/* ### A ### Marker im Logo für DEV- / Workversion v03.04c ## ### ## */
/*
div#headFunction div#headLogo::after {
    position: absolute;
    content: "v0304c |98,1%|";
    font-size: 1.75em;
    opacity: 1;
    padding: 0.5em;
    color: var(--BEFIX-blau);
    font-weight: bold;
    left: 0.75em;
    top: -0.4em;
}

@media only screen and (max-width:63.9375em) {
    div#headFunction div#headLogo::after {
        font-size: 1em;
        padding: 0.25em;
        color: var(--BEFIX-blau);
        font-weight: bold;
        top: 3em;
        background-color: var(--BEFIX-Hellgrau);
        border-radius: 1em;
    }
}
*/
/* ### E ### Marker im Logo für DEV- / Workversion v03.04c ## ### ## */

*,
:after,
:before {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-touch-callout: initial;
    -webkit-user-select: initial;
    -moz-user-select: initial;
    -ms-user-select: initial;
    user-select: initial;
    /*   font-size: 100%;*/
    outline: 0;
}

html {
    font-size: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -ms-overflow-style: scrollbar;
    -webkit-tap-highlight-color: transparent
}

body {
    font-family: 'Roboto', sans-serif;
    padding: 0;
    margin: 0;
    color: var(--BEFIX-Schwarz);
    line-height: 1.5;
    background-color: var(--BEFIX-weiss);
    text-align: left;
}

body,
html {
    overscroll-behavior-y: contain;
}

br,
div,
h1,
h2,
h3,
h4,
h5,
header,
hr,
menu,
nav,
p,
section,
span {
    margin: 0;
    padding: 0;
    border: 0;
}


/* ### E ### default ## */


/* ### A ### cockpit_left ## */

nav#cockpit_left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: calc(100% - 16.25rem);
    margin-top: 13.75rem;
    width: 100%;
    max-width: 15.5rem;
    position: fixed;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    top: 0;
    left: 0;
    z-index: 110;
    will-change: left, right;
    -webkit-transition: left .4s cubic-bezier(.165, .84, .44, 1), right .4s cubic-bezier(.165, .84, .44, 1);
    transition: left .4s cubic-bezier(.165, .84, .44, 1), right .4s cubic-bezier(.165, .84, .44, 1);
    visibility: visible;
    -webkit-animation-name: visibleBeforeShow;
    animation-name: visibleBeforeShow;
    -webkit-animation-duration: .4s;
    animation-duration: .4s;
}


/*
@media (min-width:162.5em) {
    nav#cockpit_left {
        height: -webkit-fill-available;
    }
}
*/

nav#cockpit_left div#menuLeft {
    height: 100%;
    background-color: var(--BEFIX-weiss);
    overflow-y: auto;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    border: 0;
    margin: 1.75rem .5rem 0 0;
    -webkit-box-shadow: 0 .1875rem .375rem rgba(0, 0, 0, .25);
    box-shadow: 0 .1875rem .375rem rgba(0, 0, 0, .25);
}

div#menuLeft div.menue {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    padding-bottom: 3rem;
}

div#menuLeft ul {
    list-style: none;
    padding-left: 0;
    /*  padding-top: 0.75rem;*/
}

div#menuLeft li a {
    cursor: pointer;
    background-color: transparent;
}

div#menuLeft li {
    position: relative;
    display: block;
    padding: 0.5rem;
    padding-bottom: 0.4rem;
    margin-bottom: 0.1rem;
    transition: background-color 0.3s ease;
}

div#menuLeft li>a {
    display: block;
    transition: color 0.3s ease;
    white-space: nowrap;
}

div#menuLeft:hover ul#menuLeft_nav a {
    color: var(--BEFIX-Schwarz);
}

div#menuLeft div.menue>ul#menuLeft_nav>li:first-child,
div#menuLeft div.menue>ul#menuLeft_nav>li:hover {
    background-color: var(--BEFIX-Hellgrau_50);
    transition: background-color 0.3s ease;
}


/*
div#menuLeft div.menue>ul#menuLeft_nav>li.aktiv,
*/

div#menuLeft div.menue>ul#menuLeft_nav>li:first-child {
    font-weight: 500;
    padding-left: 1.5rem;
    margin-bottom: 0;
    padding-bottom: 0.5rem;
}

div#menuLeft div.menue>ul#menuLeft_nav>li.aktiv {
    background-color: var(--BEFIX-Hellgrau_30);
}

/*
div#menuLeft li i {
    padding-right: 0.5rem;
    font-size: 1.2rem;
    min-width: 1.75em;
    vertical-align: baseline;
}
*/
div#menuLeft li>a {
    height: 1.5rem;
}

div#menuLeft li:hover>a {
    color: var(--BEFIX-blau);
    transition: color 0.3s ease;
}

div#wk_Termin div#wk_TerminInnerType div.form-check>i,
div#menuLeft li>a>i {
    display: block;
    top: 0.25em;
    right: 0.125em;
    position: absolute;
    background-color: var(--BEFIX-blau);
    color: var(--BEFIX-weiss);
    border-radius: 0.25em;
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 0.3em;
    padding-right: 0.35em;
    font-size: 0.75em;
    line-height: normal;
    transition: all 0.2s ease;
    transform: scale(1);
    border: 0.125em solid transparent;
    z-index: +10;
}

div#wk_Termin div#wk_TerminInnerType div.form-check>i {
    top: 0.0;
    right: 0.0;

}



div#wk_Termin div#wk_TerminInnerType div.form-check:hover>i,
div#menuLeft li>a:hover>i {
    transform: scale(1.125);
}

div#menuLeft li>a.aktiv>i,
div#menuLeft li>a.aktiv:hover>i {
    border: 0.125em solid var(--BEFIX-blau);
    background-color: var(--BEFIX-weiss);
    color: var(--BEFIX-blau);
    transform: scale(1);
}

div#wk_Termin div#wk_TerminInnerType div.form-check.aktiv>i,
div#wk_Termin div#wk_TerminInnerType div.form-check.aktiv:hover>i {
    color: var(--BEFIX-Schwarz);
    transform: scale(1);
    border: 0.125em solid transparent;
    background-color: transparent;
    font-weight: 600;
}

div#menuLeft li svg {
    margin-right: 0.5rem;
    width: 1.375em;
    height: 1.375em;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
    /*   vertical-align: baseline;*/
}

div#menuLeft li:hover>a>svg {
    width: 1.5rem;
    height: 1.5rem;
    margin-right: 0.375rem;
}

div#menuLeft li svg[id^='Pfeil-'],
div#menuLeft li:hover>a>svg[id^='Pfeil-'] {
    width: 0.75rem;
    height: 0.75rem;
    margin-top: -0.25rem;
}

div#menuLeft li svg path {
    fill: var(--BEFIX-Schwarz);
}

div#menuLeft li:hover svg path {
    fill: var(--BEFIX-blau);
}

div#menuLeft li svg[id^='Pfeil-'] path {
    fill: var(--BEFIX-Rahmen);
}

div#menuLeft div.menue>ul#menuLeft_nav>li.more>ul {
    padding-top: 0;
    max-height: 0;
    overflow: hidden;
}

div#menuLeft div.menue>ul#menuLeft_nav>li.more.open>ul {
    padding-top: 0.1rem;
    max-height: unset;
    overflow: hidden;
}

div#menuLeft div.menue>ul#menuLeft_nav>li.more.open svg[id^='Pfeil-'] {
    transform: rotate(180deg);
}

div#menuLeft div.menue>ul#menuLeft_nav>li.more>a>span {
    position: absolute;
    right: 0;
    padding-right: 1.2rem;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.25em;
    border-color: transparent;
    top: 0;
    padding-top: 0.5rem;
    margin-right: 0;
    overflow: hidden;
    background-color: transparent;
}

div#menuLeft div.menue>ul#menuLeft_nav>li.more>ul>li>a.aktiv {
    color: var(--BEFIX-blau);
}

div#menuLeft div.menue>ul#menuLeft_nav>li.more>ul>li {
    font-size: 95%;
    padding: 0;
    margin-bottom: 0;
    padding-left: 2.4rem;
    padding-top: 0.1rem;
    padding-bottom: 0.1rem;
}

div#menuLeft div.menue>ul#menuLeft_nav>li.more ul>li ul {
    display: none;
    height: 0;
    width: 0;
    opacity: 0;
    visibility: hidden;
}


/* ### A ### cockpit menuLeft_footer ## */

nav#cockpit_left div#menuLeft_footer {
    position: absolute;
    bottom: 0;
    width: 96%;
    text-align: center;
    z-index: +1;
    background-color: var(--BEFIX-weiss);
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-right: 1.45rem;
    padding-left: 0.45rem;
}

nav#cockpit_left div#menuLeft_footer:hover a {
    opacity: 0.75;
}

nav#cockpit_left div#menuLeft_footer a {
    display: inline-block;
    /*   width: 50%;*/
    margin: .3rem .4rem;
    text-decoration: none;
    font-size: 85%;
    opacity: 0.6;
}

nav#cockpit_left div#menuLeft_footer a#footerLink_Copyright {
    width: 100%;
}

nav#cockpit_left div#menuLeft_footer a:hover {
    opacity: 1;
}

nav#cockpit_left div#menuLeft_footer {
    text-align: left;
}

nav#cockpit_left p.footerContact {
    padding-left: 1.6rem;

    text-align: left;
    background-color: transparent;
    color: var(--BEFIX-Schwarz);
    white-space: nowrap;
    padding-bottom: 0;
    font-size: 85%;
    overflow: hidden;
}


span#footerLink_um {
    padding-left: 1.6rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
    white-space: nowrap;
}

nav#cockpit_left div#menuLeft_footer a#footerLink_Kontakt {
    display: none;
}



nav#cockpit_left div#menuLeft_footer a {
    margin: 0;
    padding: 0.25em 0.4rem;
    /*   margin-left: 1.6rem;*/
    transition: background-color 0.3s ease;
}

nav#cockpit_left div#menuLeft_footer a:hover {
    background-color: var(--BEFIX-Hellgrau_50);
    transition: background-color 0.3s ease;
}

/*
nav#cockpit_left div#menuLeft_footer a#footerLink_Impressum {
    margin-left: 0.4rem;
}
*/
nav.content-nav>ul:not(.smallNavi) {
    overflow-x: hidden;
    overflow-y: visible;
    white-space: nowrap;
}

@media (min-width:162.5em) {
    nav#cockpit_left p.footerContact {
        display: none;
    }

    nav#cockpit_left div#menuLeft_footer {
        padding-bottom: 0;
    }

    nav#cockpit_left {
        height: calc(100% - 14.25rem);
    }
}

@media only screen and (min-width: 64em) {
    div#divMenuWitdhContainer nav {
        display: block;
        white-space: nowrap;
        overflow: visible;
    }
}


/* ### E ### cockpit menuLeft_footer ## */


/* ### E ### cockpit_left ## */


/* ### A ### cockpit_header ## */

header {
    width: 100%;
    position: fixed;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    top: 0;
    left: 0;
    z-index: 100;
    background-color: var(--BEFIX-weiss);
    display: block;
    -webkit-transition: all .4s cubic-bezier(.165, .84, .44, 1);
    transition: all .4s cubic-bezier(.165, .84, .44, 1);
}

div#headProject,
div#headFunction {
    width: 100%;
}

div#headProject {
    background-color: var(--BEFIX-Leichtblau);
    height: 3rem;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

div#headSuchePos div,
div#headSuchePos,
div#headWKnav {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
    flex-direction: row;

}

div#headSuchePos {
    width: 100%;
    justify-content: center;
    padding-right: 0.5rem;
}

@media (max-width:79.999em) {
    div#headWKnav {
        width: 100%;
        justify-content: end;
    }

    div#headSuchePos {
        padding-left: 1em;
        padding-right: 1.75em;
        /* max-width: 16.25em;*/

    }
}

div#headSuchePos,
div#headWKnav {
    padding-top: 1.125rem;
}

div#headSuchePos *,
div#headWKnav *,
div#headProject * {
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

div#headWKnav a,
div#headProject a {
    white-space: nowrap;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    margin-right: 1.25rem;
    letter-spacing: 0.025rem;
}

div#headProject a {
    font-weight: bold;
    height: 1.875rem;
    color: var(--BEFIX-blau);
    border-left: 0.125rem solid var(--BEFIX-blau);
    padding-right: 1rem;
}

div#headWKnav a:not(a#linkLogoKunde) {
    font-weight: normal;
    color: var(--BEFIX-Dunkelgrau);
    height: 1.5rem;
    border-left: 0.125rem solid var(--BEFIX-Rahmen);
    padding-right: 1rem;
    text-decoration: none;
    position: relative;
}

div#headWKnav a:hover:not(a#linkLogoKunde),
div#headProject a:hover {
    color: var(--BEFIX-Schwarz);
}

div#headProject>a:first-child {
    background-color: var(--BEFIX-gelb);
    border-left: 0.125rem solid transparent;
    text-decoration: none;
    border-radius: .25rem
}

div#headProject>a:first-child span {
    padding-right: 0.75rem;
}

a#headLinkProjectInfo {
    position: relative;
}

a#headLinkProjectInfo span#editPro {
    display: none;
    left: -4px;
    width: 12.25em;
    position: absolute;
}

a#headLinkProjectInfo:hover span#editPro:not(.hide) {
    display: block;
}

a#headLinkProjectInfo span button {
    padding: 0;
    height: 1.85em
}

div#headWKnav a#linkLogoKunde {
    padding-right: 0;
}

div#headWKnav a#linkLogoKunde img {
    width: auto;
    height: auto;
}

@media only screen and (min-width: 75em) {
    div#headWKnav a#linkLogoKunde img {
        width: 12.5rem;
    }
}

div#headProject>a svg {
    width: 1.5rem;
    height: 1.5rem;
    margin-left: 2.25rem;
    margin-right: 1rem;
}

div#headWKnav a svg {
    width: 1.25rem;
    height: 1.25rem;
    margin-left: 1.25rem;
    margin-right: 1rem;
}

div#headProject>a:first-child svg {
    margin-left: 1rem;
}

div#headProject>a:hover svg {
    width: 1.75rem;
    height: 1.75rem;
    margin-left: 2rem;
}

div#headWKnav>a:hover svg {
    width: 1.5rem;
    height: 1.5rem;
    margin-left: 1rem;
}

div#headProject>a:hover:first-child svg {
    margin-left: 0.75rem;
}

div#headProject svg path {
    fill: var(--BEFIX-blau);
}

div#headWKnav svg path {
    fill: var(--BEFIX-Dunkelgrau);
}

div#headWKnav a:hover svg path,
div#headProject a:hover svg path {
    fill: var(--BEFIX-Schwarz);
}

a#headMZ>i,
a#headWK>i {
    font-style: normal;
}

a#headMZ>span,
a#headWK>span {
    color: var(--BEFIX-Dunkelgrau);
    text-decoration: none !important;
    position: absolute;
    right: -0.5rem;
    font-size: 75%;
    padding: 0.35rem;
    padding-bottom: 0.375rem;
    font-weight: normal;
    margin-left: 0.125rem;
}

a#headMZ:hover>span,
a#headWK:hover>span {
    color: var(--BEFIX-Schwarz);
    text-decoration: none !important;
}

a#headWK.WKoff {
    max-width: 0;
    overflow: hidden;
    padding-right: 0 !important;
    border-left: 0 !important;
    -webkit-transition: none;
    transition: none;
}

a#headWK.WKon {
    -webkit-transition: max-width 0.5s ease;
    transition: max-width 0.5s ease;
    max-width: 12.5rem;
}

a#headWK.WKoff>span {
    display: none;
}

div#headSuche {
    max-width: 37.188rem;
    width: 100%;
    height: 2.25rem;
    border: 0.0625rem solid var(--BEFIX-Rahmen);
    border-radius: 0.25rem;
    white-space: nowrap;
    margin-left: 1rem;
}

div#headSuche>form {
    display: inherit;
    display: inherit;
    -ms-flex-wrap: inherit;
    flex-wrap: inherit;
    width: inherit;
}

div#headSuche button,
div#headSuche button:hover,
div#headSuche input {
    border: none !important;
    background-color: transparent !important;
}

div#headSuche input {
    width: calc(100% - 3.75rem);
    padding-right: 0.75rem;
    padding-left: 0.75rem;
}

div#headSuche button {
    width: 2.25rem;
    margin-left: 1rem;
    padding: 0.35rem;
}

div#headSuche button svg {
    width: 1.5rem;
    height: 1.5rem;
}

div#headSuche button:hover svg {
    width: 2rem;
    height: 2rem;
}

div#headSuche button svg path {
    fill: var(--BEFIX-blau);
}

div#headSuche button:hover svg path {
    fill: var(--BEFIX-Schwarz);
}

div#headSuche.TakeOver {
    border-color: var(--BEFIX-Dunkelgrau);
}

div#headSuche.TakeOver button svg path {
    fill: var(--BEFIX-Dunkelgrau);
}

div#headSuche.TakeOver button#headFormSuche_Submit {
    cursor: none;
}


div#headLang a svg[id^='sprache-'] {
    width: 2.25rem;
    height: 2.25rem;
    margin-left: 2.5rem;
    margin-top: 0.55rem;
}

div#headLang a:hover svg[id^='sprache-'] {
    width: 2.5rem;
    height: 2.5rem;
    margin-left: 2.25rem;
}

div#headLang a svg[id^='Pfeil-'] {
    width: 0.75rem;
    height: 0.75rem;
    margin-top: -0.25rem;
}

header div#headLang div#ChangeLANG {
    display: none;
    overflow: hidden;
    position: absolute;
    right: 6rem;
    top: 0;
    -webkit-transition: all 1s ease 0.2s;
    transition: all 1s ease 0.2s;
    background-color: var(--BEFIX-Leichtblau);
    height: 3rem;
    justify-content: flex-end;
    align-items: center;
    width: calc(100% - 6rem);
}

header div#headLang div#ChangeLANG.show {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}

div#MsgBlock,
div#headFunction {
    display: flex;
    background-color: var(--BEFIX-weiss);
    height: 8.5rem;
    align-items: center;
    justify-content: space-between;
    overflow: hidden;
}

div#MsgBlock {
    position: absolute;
    top: 3rem;
    right: 0;
    z-index: 1;
    min-width: 35rem;
    max-width: 0;
    margin-right: -35rem;
    -webkit-transition: all 1s ease 0.2s;
    transition: all 1s ease 0.2s;
}

div#MsgBlock.show {
    max-width: calc(100% - 17rem);
    margin-right: 0;
    -webkit-transition: all 1.5s ease 0.2s;
    transition: all 1.5s ease 0.2s;
}

header div#MsgBlock>div {
    height: 100%;
    width: 100%;
    display: flex;
    padding: 0.5rem;
    padding-top: 1.125rem;
    padding-right: 1.5rem;
    align-items: center;
    justify-content: flex-start;
}

header div#MsgBlock>div>a>p {
    white-space: nowrap;
    padding: 0.75em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

header div#MsgBlock img {
    border-radius: 0.25em;
    height: 100%;
    margin: 0;
}

div#headFunction div#headLogo img {
    height: 6rem;
    margin: 1.25rem;
    max-width: 18.75em;
    /*  16.625em;*/
}

div#headFunction div#headLogo img#Logo_SAM_IMG {
    height: unset;
}


/* ### E ### cockpit_header ## */


/* ### A ### CacheMainMenu divMenu ## */


/* ### A ### CacheMainMenu divMenu divMenuContainer divMenuWitdhContainer ## */

div#divMenu {
    position: fixed;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    top: 11.5rem;
    /**/
    left: 0;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 3rem;
    z-index: 112;
    background-color: var(--BEFIX-blau);
    will-change: all;
    /*   -webkit-transition: all .4s cubic-bezier(.165, .84, .44, 1);
    transition: all .4s cubic-bezier(.165, .84, .44, 1);*/
}

@media (min-width:96em) {
    div#divMenu {
        padding-left: 16rem;
        padding-right: 4rem;
    }
}

@media (min-width:162.5em) {
    body:not(.de):not(.en) div#divMenu {
        padding-left: 0.75rem;
        padding-right: 4rem;
    }
}


/* ### E ### CacheMainMenu divMenu divMenuContainer divMenuWitdhContainer ## */


/* ### E ### CacheMainMenu divMenu ## */


/* ### Ende ### ## */

main {
    display: block;
    position: relative;
    margin: 14.5rem 1rem 1rem 16rem;
    min-height: 22rem;
    padding: 1.25rem 1rem 2rem 1rem;
    will-change: margin-left, padding, height;
    -webkit-transition: margin-left .4s cubic-bezier(.165, .84, .44, 1), padding .4s cubic-bezier(.165, .84, .44, 1), height .4s cubic-bezier(.165, .84, .44, 1);
    transition: margin-left .4s cubic-bezier(.165, .84, .44, 1), padding .4s cubic-bezier(.165, .84, .44, 1), height .4s cubic-bezier(.165, .84, .44, 1);
    text-align: left;
    line-height: 1.5;
    background-color: var(--BEFIX-weiss);
    -webkit-box-shadow: 0 .1875rem .375rem rgba(0, 0, 0, .25);
    box-shadow: 0 .1875rem .375rem rgba(0, 0, 0, .25);
}

main.setToTop {
    z-index: 10000;
    position: absolute;
    border: solid 0.125em var(--BEFIX-blau);
    border-radius: 0.25em;
    padding: 1.125rem 0.875rem 1.875rem 0.875rem;
    min-width: calc(100% - 16rem);
}

@media (max-width:79.999em) {
    main.setToTop {
        margin: 8.5rem 0.25rem 0.25rem 0.25rem;
    }
}




main form {
    width: 100%;
}

div#divMenu i#iShowMenuLeft {
    display: none;
    opacity: 0;
    visibility: hidden;
}

@media only screen and (max-width:63.9375em) {
    nav#cockpit_left {
        z-index: 110;
        /*
        max-width: 15.75rem;
        v03.04a */
        padding-right: 0.25rem;
        left: -17.5rem;
        visibility: hidden;
        -webkit-animation-name: visibilityHiddenAfterHide;
        animation-name: visibilityHiddenAfterHide;
        -webkit-animation-duration: .4s;
        animation-duration: .4s;
        background-color: var(--BEFIX-weiss);
        -webkit-box-shadow: 0 .1875rem .375rem rgba(0, 0, 0, .25);
        box-shadow: 0 .1875rem .375rem rgba(0, 0, 0, .25);
        height: calc(100% - 9.75rem);
    }

    body.showLeftMenu nav#cockpit_left {
        left: 0;
        /*  z-index: 1000; OPEN */
        visibility: visible;
        -webkit-animation-name: visibleBeforeShow;
        animation-name: visibleBeforeShow;
        -webkit-animation-duration: .4s;
        animation-duration: .4s;
        min-width: calc(100% - 0.25rem);

    }

    nav#cockpit_left div#menuLeft_footer {
        width: 95%;
    }

    body div#divMenu {
        /*     z-index: 1000;*/
    }

    div#divMenu {
        margin-left: 0;
        padding-left: 1rem;
    }

    main {
        margin-left: 1rem !important;
    }
}


/* res hier keines DB */

@media (max-width:79.999em) {
    /* ### A ### Responsive v03.04a ## */
    /*

    div#headProject a#headLinkProjectKundenkonto span,
    div#headProject a#headAbmelden span {
        display: none;
    }
        */
    /* ### E ### Responsive v03.04a ## */

    div#headProject a {
        padding-right: 0;
    }

    div#headSuche {
        margin-right: 1rem;
    }
}

@media (max-width:61.999em) {

    /* ### A ### Responsive v03.04a ## */
    /*
    div#headProject a#headLinkProjectWechsel span {
        display: none;
    }
       

    div#headWKnav a#linkLogoKunde img {
        width: 7.5rem;
    }
 */
    /* ### E ### Responsive v03.04a ## */

    /* ### A ### Responsive v03.04a ## */
    /*

    div#headFunction div#headLogo img {
        height: 4rem;
        margin: 1rem;
    }   

    div#headSuchePos,
    div#headWKnav {
        padding-top: 0;
    }
     */
    /* ### E ### Responsive v03.04a ## */

    /* ### A ### Responsive v03.04a ## */
    /*

    div#MsgBlock,
    div#headFunction {
        height: 4.5rem;
    }
  

    div#divMenu {
        top: 7.5rem;
    }
    
    main {
        margin-top: 10.5rem;
    }

    nav#cockpit_left {
        margin-top: 9.75rem;
    }
        /* ### E ### Responsive v03.04a ## */

}

.blink {
    animation-name: kf_pleaceFill;
    animation-timing-function: ease-in;
    animation-duration: 2s;
    animation-iteration-count: 3;
    animation-fill-mode: both;
}

@-webkit-keyframes visibleBeforeShow {
    0% {
        visibility: hidden
    }

    1% {
        visibility: visible
    }

    to {
        visibility: visible
    }
}

@keyframes visibleBeforeShow {
    0% {
        visibility: hidden
    }

    1% {
        visibility: visible
    }

    to {
        visibility: visible
    }
}

@-webkit-keyframes visibilityHiddenAfterHide {
    0% {
        visibility: visible
    }

    99% {
        visibility: visible
    }

    to {
        visibility: hidden
    }
}

@keyframes visibilityHiddenAfterHide {
    0% {
        visibility: visible
    }

    99% {
        visibility: visible
    }

    to {
        visibility: hidden
    }
}


/*

div#SlaveTarget {
    display: none;
}

div#SlaveTarget {
    display: none;
}
*/

div#SlaveTarget div.Imgload {
    display: flex;
    padding: 0;
    outline: none;
    position: relative;
    overflow: hidden;
    justify-content: center;
    margin-top: -5.5rem;
    cursor: pointer;
}

div#SlaveTarget img.insertImgload {
    width: 45%;
    height: auto;
    padding: 0;
    margin: 0;
    border: none;
    outline: none;
    line-height: 0;
    vertical-align: top;
}

div#SlaveTarget div.ImgHeadLiene {
    position: absolute;
    bottom: 0px;
    text-align: center;
    background-color: var(--BEFIX-weiss);
    border-radius: 0.25em;
}


/* ### A ### ajax_Controls on the bottom ## */

div.ajax_Controls {
    visibility: hidden;
    display: none;
    height: 0;
    width: 0;
    max-height: 0;
    max-width: 0;
    opacity: 0;
}

div.ajax_Controls.show {
    z-index: 10000;
    position: fixed;
    visibility: visible;
    display: block;
    height: auto;
    width: auto;
    max-height: unset;
    max-width: unset;
    opacity: 1;
    padding: 1rem;
    margin: 4rem;
    background-color: var(--BEFIX-Hellgrau_80);
}


/*ajax_default */


/* ### E ### ajax_Controls on the bottom ## */


/* ### A ### Icon Button ## */

.btnIcon {
    position: relative;
    display: block;
    text-align: center;
    background-color: transparent;
    -webkit-transition: all .4s cubic-bezier(.165, .84, .44, 1);
    transition: all .4s cubic-bezier(.165, .84, .44, 1);
    font-size: 2em;
    color: var(--BEFIX-Schwarz);
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
    cursor: pointer;
    padding: 0;
    background-color: transparent;
    border: 0.0625rem solid rgba(5, 5, 5, 0.3);
    border-radius: 0.25em;
    width: 2.725rem;
    height: 2.825rem;
    overflow: hidden;
    float: right;
}

.btnIcon:hover {
    background-color: var(--BEFIX-Hellgrau_30);
    color: var(--BEFIX-Schwarz);
    border: 0.0625rem solid var(--BEFIX-Schwarz);
    -webkit-transition: all .4s cubic-bezier(.165, .84, .44, 1);
    transition: all .4s cubic-bezier(.165, .84, .44, 1);
}


/* ### A ### Icon Button ## */

.btnloadFunc {
    z-index: 112;
    top: 11.5rem;
    position: fixed;
    font-size: 2.5em;
    color: var(--BEFIX-weiss);
    cursor: pointer;
    padding: 0;
    border: 0.0625rem solid rgba(244, 243, 245, 0);
    border-radius: 0.25em;
    width: 3rem;
    height: 3rem;
    background-color: var(--BEFIX-blau);
    line-height: 3.35rem;
    right: 2rem;
    will-change: all;
    -webkit-transition: all .4s cubic-bezier(.165, .84, .44, 1);
    transition: all .4s cubic-bezier(.165, .84, .44, 1);
}

button.btnloadFunc:hover {
    /*
font-size: 3em;
width: 3.5rem;
height: 3.5rem;
line-height: 3.9rem;
*/
    will-change: all;
    -webkit-transition: all .4s cubic-bezier(.165, .84, .44, 1);
    transition: all .4s cubic-bezier(.165, .84, .44, 1);
}

button.btnloadFunc:hover i {
    height: 3.5rem;
}

button.btnloadFunc i {
    height: 3rem;
}


/* ### Ende ### ## */

div#divMenuWitdhContainer>nav>ul:not(.smallNavi)::-webkit-scrollbar,
nav#cockpit_left div#menuLeft::-webkit-scrollbar {
    display: none;
}


/* ### A ### insertload Functions ## */


/* ### A ### insertload deactivateUserInterface ## */

div#deactivateUserInterface {
    position: fixed;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    top: -20%;
    left: -20%;
    z-index: -1;
    width: 140%;
    height: 140%;
    background-color: transparent;
    overflow: hidden;
    visibility: hidden;
    will-change: visibility;
    -webkit-transition: visibility 0.5s ease;
    transition: visibility 0.5s ease;
}

div#deactivateUserInterface.activatedT,
div#deactivateUserInterface.activated {
    z-index: 9999;
    visibility: visible;
    -webkit-transition: visibility 0.5s ease;
    transition: visibility 0.5s ease;
    background-color: var(--BEFIX-Hellgrau_30);
}

div#deactivateUserInterface.activatedT {
    background-color: transparent;
}

div#deactivateUserInterface.activated.setToTop {
    background-color: var(--BEFIX-Hellgrau_80);
}

@media only screen and (max-width:63.9375em) {
    body.showLeftMenu div#deactivateUserInterface.activated {
        z-index: 999;
    }
}

div#insertloadUserInterface {
    display: none;
    position: fixed;
    left: 50%;
    top: 45%;
    -webkit-transform: translate(-2rem, -2rem);
    transform: translate(-2rem, -2rem);
    width: 8rem;
    height: 8rem;
    z-index: 9998;
}

div#insertloadUserInterface.activated {
    display: block;
    transform: scale(1.5);
}


/* ### E ### insertload deactivateUserInterface ## */


/* ### A ### allgemeine Settings für Frame Input usw. ## z.B. Upload Bestellung ## ## */

.required:after {
    content: "*";
    color: var(--BEFIX-rot);
    margin-left: 3px;
}

input.noneInput {
    width: 100%;
    border: none;
}

input.textInput,
input.dateInput {
    border: 0.0625rem solid var(--BEFIX-Leichtblau);
    border-radius: 0.25em;
    box-shadow: none;
    font-size: inherit;
    color: inherit;
    width: 100%;
    padding: 0.25rem;
    margin-bottom: 0.05rem;
}

input.textInput:disabled,
input.dateInput:disabled {
    cursor: not-allowed;
}

select.Group:focus,
textarea.HinweisText:focus,
input.textInput:not(.ro):focus,
input.dateInput:not(.ro):focus {
    background-color: var(--BEFIX-Hellgrau_20);
}

input.dateInput {
    font-size: 1.4rem;
}

input.textInput.ro,
input.dateInput.ro {
    border-bottom: 0.0625rem solid var(--BEFIX-weiss);
    border-top: 0.0625rem solid var(--BEFIX-weiss);
    border-left: 0.0625rem solid var(--BEFIX-weiss);
    border-right: 0.0625rem solid var(--BEFIX-weiss);
}

div.row>form {
    display: inherit;
    display: inherit;
    -ms-flex-wrap: inherit;
    flex-wrap: inherit;
    flex-direction: inherit;
}

@media (min-width:80em) {

    input.dateInput,
    input.dateInput {
        width: 60%;
    }
}

textarea.HinweisText {
    overflow: auto;
    resize: none;
    border: 0.0625rem solid var(--BEFIX-Leichtblau);
    border-radius: 0.25em;
    box-shadow: none;
    font-size: inherit;
    color: inherit;
    margin: 0;
    padding: .5rem;
    width: 100%;
    /*white-space: normal;*/
    white-space: pre-wrap;
    height: 6.125rem;
}

textarea.HinweisText::placeholder {
    font-size: inherit;
    color: inherit;
    font-weight: 300;
}

.pleaceFill {
    color: var(--BEFIX-blau);
    font-weight: bold;
    animation-name: kf_pleaceFill;
    animation-timing-function: ease-in;
    animation-duration: 2s;
    animation-iteration-count: 3;
    animation-fill-mode: both;
}

@keyframes kf_pleaceFill {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.1;
    }

    100% {
        opacity: 1;
    }
}


/* ### E ### allgemeine Settings für Frame Input usw. ## z.B. Upload Bestellung ## ## */


/* ### A ### ao_main_KatOverview ## ## */

div.container a[id^='kO_link_'] {
    display: inherit;
    flex-direction: column;
}


/* ### E ### ao_main_KatOverview ## ## */


/* ### E ### insertload Functions ## */

.pt-1-25 {
    padding-top: 1.25rem !important;
}

div.rowFolded>span:nth-child(1) {
    position: absolute;
    z-index: +1;
    top: 1.125em;
    left: 0.875em;
    width: 2em;
    height: 2em;
    cursor: pointer;
}

div.rowFolded>span>svg {
    width: 1.25rem;
    height: 1.25rem;
    margin-left: 0.25rem;
    margin-right: 0.25rem;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

div.rowFolded:hover>span>svg {
    width: 1.5rem;
    height: 1.5rem;
    margin-left: 0.125rem;
    margin-right: 0.125rem;
}

div.rowFolded.down>span>svg {
    transform: rotate(180deg);
}

div.rowFolded>span>svg path {
    fill: var(--BEFIX-Hellgrau);
}

div.rowFolded:hover>span>svg path {
    fill: var(--BEFIX-blau);
}

.rowFolded {
    position: relative;
    max-height: 6.5em;
    overflow: hidden;
    border-bottom: 0.0625rem solid var(--BEFIX-Hellgrau);
    margin-bottom: 1em;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.rowFolded.down {
    max-height: 30em;
    border-bottom: 0.0 solid var(--BEFIX-Hellgrau);
    margin-bottom: 0;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

@media (max-width:61.999em) {
    .rowFolded.down {
        max-height: 80em;
    }
}

.rowGrowStartrow {
    display: flex;
    /*  flex-direction: row;*/
    justify-content: flex-start;
    align-content: flex-start;
}


.rowGrowStart {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}


.rowGrowEvenly {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

.ControlButton {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    background-color: var(--BEFIX-weiss);
    position: relative;
}

@media only screen and (min-width:127.5em) {
    html {
        font-size: 0.8vw;
    }
}

@media only screen and (min-width:149.375em) {
    html {
        /*    font-size: 0.8vw;*/
    }
}

@media only screen and (min-width:162.5em) {
    html {
        font-size: 0.75vw;
    }
}


/* ### A ### aus OpenTodo.css zur Prüfung. ## ## ## */

span.clickCheckKeep {
    cursor: pointer;
}

.divMainMenuWrapper {
    display: none;
}


/* ### A ### aus OpenTodo.css zur Prüfung. ## ## ## */

div#CooBannMain {
    display: flex;
    position: fixed;
    padding-top: 1.5rem;
    padding-right: 1rem;
    padding-left: 1rem;
    padding-bottom: 1.5rem;
    line-height: 1.5;
    background-color: var(--BEFIX-weiss);
    -webkit-box-shadow: 0 0.1875rem 0.375rem rgba(0, 0, 0, .25);
    box-shadow: 0 0.1875rem 0.375rem rgba(0, 0, 0, .25);
    bottom: 0;
    right: 0;
    z-index: +5;
    margin-top: 0;
    margin-right: 1rem;
    margin-bottom: 0;
    margin-left: 16rem;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    width: calc(100% - 17rem);

}

div#CooBannMain>div:nth-child(1) {
    display: flex;
    flex-direction: column;
    padding-left: 0;
}

div#CooBannCmd {
    display: flex;
    flex-direction: column-reverse;
}

@media (max-width:48.999em) {
    .ControlButton {
        display: block;
    }

    div#CooBannMain {
        flex-direction: column;
        flex-wrap: wrap;
        justify-content: unset;
    }

    div#CooBannMain>div {
        width: 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%
    }

    div#CooBann_Buttons {
        padding-top: 1.5em;
    }

    div#CooBannMain>div:nth-child(1) {
        padding-left: 0.938rem;
    }
}

@media only screen and (max-width:63.9375em) {
    div#CooBannMain {
        margin-left: 1rem;
        width: calc(100% - 1em);
    }
}









/* ### A ### Responsive Design Anpassungen v03.04a ## ### ## */

@media (max-width:95.999em) {
    header div#headLang div#ChangeLANG {
        height: auto;
        top: unset;
        width: unset;
        position: fixed;
        z-index: 1;
        right: 0;
        flex-direction: column;
        align-items: stretch;
        padding-top: 0.5em;
        margin-top: 0.2em;
    }

    header {
        z-index: 112;
    }

    div#headProject {
        height: 2.25rem;
    }

    header div#headLang div#ChangeLANG {
        border: 0.0625rem dotted var(--BEFIX-Rahmen);
        /*0.125rem solid var(--BEFIX-blau);*/
        border-radius: 0.0625rem;
    }

    div#headLang div#ChangeLANG a svg[id^='sprache-'] {
        width: 2.25rem;
        height: 2.25rem;
        margin-left: 0.5rem;
        margin-top: 0.5rem;
        margin-right: 0.25em;
    }


    header div#headLang div#ChangeLANG a {
        border: none;
        padding-bottom: 0.25em;
        height: 2em;

    }


    div#headProject a#headLinkProjectKundenkonto,
    div#headProject a#headAbmelden,
    div#headProject a#headLinkProjectWechsel {
        position: relative;
    }

    div#headProject a#headLinkProjectInfo span#head_proj,
    div#headProject a#headLinkProjectKundenkonto span,
    div#headProject a#headAbmelden span,
    div#headProject a#headLinkProjectWechsel span {
        display: none;
        max-height: 0;
        transition: max-height 0.5s ease;
        z-index: +1;
        position: absolute;
        top: 2.05em;
        background-color: var(--BEFIX-Leichtblau);
        padding: 0.25em;
        border: 0.0625rem dotted var(--BEFIX-Rahmen);
        border-top: 0.0625rem dotted var(--BEFIX-Leichtblau);
        border-radius: 0.0625rem;
    }

    div#headProject a#headLinkProjectKundenkonto:hover span,
    div#headProject a#headAbmelden:hover span,
    div#headProject a#headLinkProjectWechsel:hover span {
        display: block;
        max-height: 2em;
        transition: max-height 0.5s ease;
    }

    div#headLang>a,
    div#headProject a {
        margin-right: 0.5rem;
    }

    div#headLang>a:hover svg[id^='sprache-'],
    div#headLang>a svg[id^='sprache-'],
    div#headProject>a:hover svg,
    div#headProject>a svg {
        width: 1.5rem !important;
        height: 1.5rem !important;
        margin-left: 1.25rem !important;
        margin-right: 0.5rem !important;
    }

    div#headLang>a:hover svg[id^='sprache-'],
    div#headLang>a svg[id^='sprache-'] {
        width: 2rem !important;
        height: 2rem !important;

    }



    div#headFunction div#headLogo img {
        height: 4rem;
        margin: 1rem;
    }

    div#headWKnav a#linkLogoKunde img {
        width: 7.5rem;
    }

    div#MsgBlock,
    div#headFunction {
        height: 3.5rem;
    }

    div#headSuchePos,
    div#headWKnav {
        padding-top: 0;
    }

    div#MsgBlock {

        top: 2.25rem;
    }


    div#divMenu {
        top: 7.5rem;
        top: 5.75rem;
    }

    main {
        margin-top: 8.75rem;
    }

    nav#cockpit_left {
        margin-top: 7rem;
        height: calc(100% - 7.75rem);
    }
}


@media (max-height:47.25em) {
    nav#cockpit_left div#menuLeft_footer a#footerLink_Kontakt {
        display: inline-block;
    }

    div#menuLeft_footer:has(p.footerContact.show) {
        border-top: 0.0625rem solid var(--BEFIX-Leichtblau);
    }

    nav#cockpit_left p.footerContact {
        display: none;
        font-size: unset;
    }

    nav#cockpit_left p.footerContact.show {
        display: inline-block;
    }

}

@media (max-width:79.999em) {
    .btnloadFunc {
        top: 8.5rem;
        right: 1rem;
    }

    div#SlaveTarget div.Imgload {
        overflow: hidden;
        margin-top: 0;
        flex-direction: column;
        align-items: center;
    }

    div#SlaveTarget div.ImgHeadLiene {
        order: 2;
        position: unset;
    }
}

@media (max-width:35.999em) {

    div#headProject a#headLinkProjectWechsel,
    div#headProject a#headLinkProjectKundenkonto,
    div#headFunction div#headKuLogo,
    div#headFunction a#headMZ>i,
    div#headFunction a#headWK>i,
    a#headMZ>span,
    a#headWK>span {

        display: none;
    }


    div#headFunction a#headMZ,
    div#headFunction a#headWK {

        padding-right: 0.75rem !important;
    }



    div#headWKnav a svg {

        margin-left: 0.25rem;
        margin-right: 0rem;
    }

    .h2,
    h2 {
        font-size: 1.75rem;
    }

    .searchfield input {

        font-size: 1rem;
    }
}

@media (max-width: 44.999em) {

    a#headMZ>span,
    a#headWK>span {
        margin-right: 1em;
    }

    div#headFunction a#headMZ,
    div#headFunction a#headWK {
        margin: 0;
        padding-right: 0.75rem !important;
    }

    div#headFunction a#headMZ>i,
    div#headFunction a#headWK>i {
        display: none;
    }
}



@media (max-height:34.999em) and (max-width: 47.999em) {
    body div#divMenu {
        position: relative;
        top: unset;
        order: 2;
        overflow-x: hidden;
    }


    header {
        position: relative;
        top: unset;
        order: 1;
    }

    main {
        margin: 0;
        -webkit-box-shadow: unset;
        box-shadow: unset;
        order: 3;
    }

    div#MsgBlock {
        display: none !important;
    }

    div#MsgBlock,
    div#headFunction {
        height: 3.25em;
    }

    body {
        /*  overflow-x: unset;*/

        display: flex;
        flex-direction: column;

    }

    nav#cockpit_left,
    ul.smallNaviAktiv {
        position: absolute;
        height: auto;
        top: 0.25em;
    }

    ul.smallNaviAktiv {
        position: absolute;
        height: auto;
        top: 7em;
    }

    div.AF_GroupTable table thead tr.thCaption td {
        position: unset !important;
    }

    div#wk_iF {
        z-index: -1;
        padding: 2em;

    }
}

/* ### A ### Responsive Design Anpassungen v03.04a ## ### ## */