/* roboto-condensed-300 - latin */
@font-face {
    font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 300;
  src: url('../font/roboto-condensed-v16-latin-300.eot'); /* IE9 Compat Modes */
  src: local('Roboto Condensed Light'), local('RobotoCondensed-Light'),
       url('../font/roboto-condensed-v16-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/roboto-condensed-v16-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/roboto-condensed-v16-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../font/roboto-condensed-v16-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/roboto-condensed-v16-latin-300.svg#RobotoCondensed') format('svg'); /* Legacy iOS */;
}
/* roboto-condensed-regular - latin */
@font-face {
    font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 400;
  src: url('../font/roboto-condensed-v16-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Roboto Condensed'), local('RobotoCondensed-Regular'),
       url('../font/roboto-condensed-v16-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/roboto-condensed-v16-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/roboto-condensed-v16-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../font/roboto-condensed-v16-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/roboto-condensed-v16-latin-regular.svg#RobotoCondensed') format('svg'); /* Legacy iOS */;
}
/* roboto-condensed-300italic - latin */
@font-face {
    font-family: 'Roboto Condensed';
  font-style: italic;
  font-weight: 300;
  src: url('../font/roboto-condensed-v16-latin-300italic.eot'); /* IE9 Compat Modes */
  src: local('Roboto Condensed Light Italic'), local('RobotoCondensed-LightItalic'),
       url('../font/roboto-condensed-v16-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/roboto-condensed-v16-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/roboto-condensed-v16-latin-300italic.woff') format('woff'), /* Modern Browsers */
       url('../font/roboto-condensed-v16-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/roboto-condensed-v16-latin-300italic.svg#RobotoCondensed') format('svg'); /* Legacy iOS */;
}
/* roboto-condensed-italic - latin */
@font-face {
    font-family: 'Roboto Condensed';
  font-style: italic;
  font-weight: 400;
  src: url('../font/roboto-condensed-v16-latin-italic.eot'); /* IE9 Compat Modes */
  src: local('Roboto Condensed Italic'), local('RobotoCondensed-Italic'),
       url('../font/roboto-condensed-v16-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/roboto-condensed-v16-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/roboto-condensed-v16-latin-italic.woff') format('woff'), /* Modern Browsers */
       url('../font/roboto-condensed-v16-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/roboto-condensed-v16-latin-italic.svg#RobotoCondensed') format('svg'); /* Legacy iOS */;
}
/* roboto-condensed-700 - latin */
@font-face {
    font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 700;
  src: url('../font/roboto-condensed-v16-latin-700.eot'); /* IE9 Compat Modes */
  src: local('Roboto Condensed Bold'), local('RobotoCondensed-Bold'),
       url('../font/roboto-condensed-v16-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/roboto-condensed-v16-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/roboto-condensed-v16-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../font/roboto-condensed-v16-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/roboto-condensed-v16-latin-700.svg#RobotoCondensed') format('svg'); /* Legacy iOS */;
}
/* roboto-condensed-700italic - latin */
@font-face {
    font-family: 'Roboto Condensed';
  font-style: italic;
  font-weight: 700;
  src: url('../font/roboto-condensed-v16-latin-700italic.eot'); /* IE9 Compat Modes */
  src: local('Roboto Condensed Bold Italic'), local('RobotoCondensed-BoldItalic'),
       url('../font/roboto-condensed-v16-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/roboto-condensed-v16-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/roboto-condensed-v16-latin-700italic.woff') format('woff'), /* Modern Browsers */
       url('../font/roboto-condensed-v16-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/roboto-condensed-v16-latin-700italic.svg#RobotoCondensed') format('svg'); /* Legacy iOS */;
}
/* go on with normal style definitions #b5bac4 #F1F1F1*/

:root {
    --primary-color: #1B1E24;
    --secondary-color: #1B1E24;
    --body-bg-color: background-color: #d8d9dc;
    --body-bg-image: url(assets2012/medium-bg-texture-01.jpg);
    --font-color: #1B1E24;
    --font-color-abgerundet_zelle2: #1B1E24;
    --font-color-zeile: #000000;
    --font-color-link: #002F5E;
    --font-color-link-hover: #0080FF;
    --font-color-whitelink: #FFFFFF;
    --font-color-whitelink-hover: #0080FF;
    --font-color-greylink: #AFAFAF;
    --font-color-greylink-hover: #0080FF;
    --font-color-menue: #fff;
    --font-color-header: #000000;
    --font-color-neuerkopf: #fff;
    --font-color-neuerfeldkopf: #000000;
    --font-color-circle: #666;
  /*graue Schrift*/
    --font-color-badge: #fff;
    --font-color-button-hell: #000000;
    --font-color-button-plus: #FFFFFF;
    --font-color-button-rot: #FFFFFF;
    --font-color-button-blau: #FFFFFF;
    --font-color-button-gelb: #777;
    --font-color-button-gruen: #FFFFFF;
    --font-color-input: #000000;
    --font-color-input-label: #777;
    --font-color-input-select: #000000;
    --font-color-rpc-list: #000000;
    --font-color-checkbox-label: #000000;
    --font-color-kachel: #000000;
    --bg-color: #fff;
    --bg-color-loadScreen: #FFFFFF;
    --bg-color-table-aussen: #E9E9E9;
    --bg-color-table-rot: #E9E9E9;
    --bg-color-table-sticky: #77CAEE;
    --bg-color-tr-Liste1: #FFFFD5;
    --bg-color-tr-Liste2: #B8DCDC;
    --bg-color-tr-Liste3: #E9F3F3;
    --bg-color-tr-Liste4: #FFFFFF;
    --bg-color-tr-Liste5: #FFFFFF;
    --bg-color-tr-Liste5nth: #E0E0E0;
    --bg-color-tr-Liste1-hover: #9CC9C9;
    --bg-color-tr-Liste2-hover: #9CC9C9;
    --bg-color-tr-Liste3-hover: #9CC9C9;
    --bg-color-tr-Liste4-hover: #e4f2f4;
    --bg-color-tr-Liste5-hover: #e4f2f4;
    --bg-color-tr-Liste5nth-hover: #D4EAED;
    --bg-color-abgerundet_zelle2: #fff;
    --bg-color-abgerundet_zelle4: #D9D9FF;
    --bg-color-zelle13-tour: #fff;
    --bg-color-zelle2_tief: #EEEEEE;
    --bg-zelle13-tour-box-shadow: #A0A0A0;
    --bg-zelle2-tief-box-shadow: #A0A0A0;
    --bg-image-zeile: url(../bg_tab.png);
    --bg-color-zelle_gruen: #DFFFDF;
    --bg-color-zelle_gruen-kopf-verlauf-start: #DFF0D8;
    --bg-color-zelle_gruen-kopf-verlauf-ende: #DFF0D8;
    --bg-color-zelle_success-verlauf-start: #DFF0D8;
    --bg-color-zelle_success-verlauf-ende: #DFF0D8;
    --bg-color-zelle_gelb: #FFFFDF;
    --bg-color-zelle_warnung-verlauf-start: #FCF8E3;
    --bg-color-zelle_warnung-verlauf-ende: #FCF8E3;
    --bg-color-zelle_rot: #FFDDDD;
    --bg-color-zelle_danger-verlauf-start: #F2DEDE;
    --bg-color-zelle_danger-verlauf-ende: #FF2222;
    --bg-color-zelle_danger-halb-verlauf-start: #FCF8E3;
    --bg-color-zelle_danger-halb-verlauf-ende: #F2DEDE;
    --bg-color-zelle_hinweis-verlauf-start: #B3D9FF;
    --bg-color-zelle_hinweis-verlauf-ende: #0074E8;
    --bg-color-zelle2_tipp-verlauf-start: #F5FAFF;
    --bg-color-zelle2_tipp-verlauf-ende: #CCE6FF;
    --bg-color-zelle_blau: #CCE6FF;
    --bg-color-zelle_glow-green: #DFF0D8;
    --bg-color-kachel: #fff;
    --bg-color-circle: #eee;
    --bg-color-input: #efefef;
    --bg-color-editierbar: #efefef;
    --bg-color-editierbar-nth: #F6FBFE;
    --bg-color-checkbox: #efefef;
    --bg-color-checkbox-hover: #CDECF9;
    --bg-color-button-hell: #EDEDED;
    --bg-color-button-hell-hover: #E3E3E3;
    --bg-color-button-icon-blau: #0097E3;
    --bg-color-button-icon-blau-hover: #007EBD;

    --bg-color-button-gruen: #7fb378;
    --bg-color-button-gruen-hover: #61A05A;

    --bg-color-button-gelb: #FFFF80;
    --bg-color-button-gelb-hover: #F0F000;

    --bg-color-button-blau: #30AAE9;
    --bg-color-button-blau-hover: #1695D4;

    --bg-color-button-rot: #E93030;
    --bg-color-button-rot-hover: #D41616;

    --bg-feldkopf-verlauf-start: #ffffff;
    --bg-feldkopf-verlauf-ende: #dadada;
    --bg-feldkopf-box-shadow: #ffffff;
    --bg-neuerfeldkopf-verlauf-start: #f5f5f5;
    --bg-neuerfeldkopf-verlauf-ende: #e5e5e5;
    --bg-neuerfeldkopf-box-shadow-start: #333333;
    --bg-neuerfeldkopf-box-shadow-ende: #FFFFFF;
    --bg-header-sticky: #1A9AD3;
    --bg-select-verlauf-start: #ffffff;
    --bg-select-verlauf-ende: #dadada;
    --bg-suggestionbox-verlauf-start: #EFEFEF;
    --bg-suggestionbox-verlauf-ende: #EFEFEF;
    --bg-color-rpc-list: #FFFFFF;
    --bg-color-select-option: #efefef;
    --bg-color-flipswitch: #489499;
    --bg-color-kalkulation-kopf-fuss: #EFEFEF;
    --bg-color-loadspinner: #AFAFAF;
    --bg-color-fieldset: #FFFFFF;
    --border-feldkopf-bottom: #c4c4c4;
    --border-success: #00CE00;
    --border-warnung: #FFCB5B;
    --border-danger: #FF2222;
    --border-danger-halb: #E88A7B;
    --border-glow-green: #00CE00;
    --border-badge: #ffffff;
    --border-input: #cfcfcf;
    --border-input-focus: #1A9AD0;
    --border-input-editable: #cfcfcf;
    --border-input-editable-focus: #1A9AD0;
    --border-rpc-list: #cfcfcf;
    --border-rpc-list-bold: #333333;
    --border-suggestionBox: #cfcfcf;
    --border-button-hell: #cfcfcf;
    --border-kalkulationslist: silver;
    --border-fieldset: #60C2EB;
    --heading-color: #1B1E24;
    --padding-header: 5px;
    --padding-header_sticky: 10px;
    --padding-tablecell: 5px;
}

[data-theme="dark"] {
    --primary-color: #fff;
    --secondary-color: #fff;
    --body-bg-color: black;
    --body-bg-image: -webkit-linear-gradient(top, #292929, #292929);
    --font-color: #CCCCCC;
    --font-color-abgerundet_zelle2: #CCCCCC;
    --font-color-zeile: #E3E3E3;
    --font-color-link: #CCCCCC;
    --font-color-link-hover: #70B8FF;
    --font-color-whitelink: #CCCCCC;
    --font-color-whitelink-hover: #0080FF;
    --font-color-greylink: #777;
    --font-color-greylink-hover: #0080FF;
    --font-color-menue: #CCCCCC;
    --font-color-header: #CCCCCC;
    --font-color-neuerkopf: #CCCCCC;
    --font-color-neuerfeldkopf: #CCCCCC;
    --font-color-circle: #CCCCCC;
    --font-color-badge: #E3E3E3;
    --font-color-button-hell: #E3E3E3;
    --font-color-button-plus: #E3E3E3;
    --font-color-button-rot: #E3E3E3;
    --font-color-button-blau: #E3E3E3;
    --font-color-button-gelb: #000000;
    --font-color-button-gruen: #E3E3E3;
    --font-color-input: #CCCCCC;
    --font-color-input-label: #777;
    --font-color-input-select: #CCCCCC;
    --font-color-rpc-list: #CCCCCC;
    --font-color-checkbox-label: #CCCCCC;
    --font-color-kachel: #CCCCCC;
    --bg-color: #212121;
    --bg-color-loadScreen: #363636;
    --bg-color-table-aussen: #292929;
    --bg-color-table-aussen-rot: #520014;
    --bg-color-table-sticky: #0B4056;
    --bg-color-tr-Liste1: #5C5C00;
    --bg-color-tr-Liste2: #204141;
    --bg-color-tr-Liste3: #223F3F;
    --bg-color-tr-Liste4: #363636;
    --bg-color-tr-Liste5: #363636;
    --bg-color-tr-Liste5nth: #242424;
    --bg-color-tr-Liste1-hover: #474700;
    --bg-color-tr-Liste2-hover: #193434;
    --bg-color-tr-Liste3-hover: #172B2B;
    --bg-color-tr-Liste4-hover: #242424;
    --bg-color-tr-Liste5-hover: #242424;
    --bg-color-tr-Liste5nth-hover: #171717;
    --bg-color-abgerundet_zelle2: #363636;
    --bg-color-abgerundet_zelle4: #000061;
    --bg-color-zelle13-tour: #424242;
    --bg-color-zelle2_tief: #242424;
    --bg-zelle13-tour-box-shadow: #363636;
    --bg-zelle2-tief-box-shadow: #363636;
    --bg-image-zeile: -webkit-linear-gradient(top, #363636, #363636);
    --bg-color-zelle_gruen: #006100;
    --bg-color-zelle_gruen-kopf-verlauf-start: #006100;
    --bg-color-zelle_gruen-kopf-verlauf-ende: #002900;
    --bg-color-zelle_success-verlauf-start: #006100;
    --bg-color-zelle_success-verlauf-ende: #002900;
    --bg-color-zelle_gelb: #5C5C00;
    --bg-color-zelle_warnung-verlauf-start: #5C5C00;
    --bg-color-zelle_warnung-verlauf-ende: #292900;
    --bg-color-zelle_rot: #990000;
    --bg-color-zelle_danger-verlauf-start: #610000;
    --bg-color-zelle_danger-verlauf-ende: #2E0000;
    --bg-color-zelle_danger-halb-verlauf-start: #5C5C00;
    --bg-color-zelle_danger-halb-verlauf-ende: #610000;
    --bg-color-zelle_hinweis-verlauf-start: #004C99;
    --bg-color-zelle_hinweis-verlauf-ende: #003261;
    --bg-color-zelle2_tipp-verlauf-start: #004C99;
    --bg-color-zelle2_tipp-verlauf-ende: #003261;
    --bg-color-zelle_blau: #004F99;
    --bg-color-zelle_glow-green: #002900;
    --bg-color-kachel: #575757;
    --bg-color-circle: #666666;
    --bg-color-input: #313131;
    --bg-color-editierbar: #383838;
    --bg-color-editierbar-nth: #2E2E2E;
    --bg-color-checkbox: #292929;
    --bg-color-checkbox-hover: #666666;
    --bg-color-button-hell: #666666;
    --bg-color-button-hell-hover: #545454;
    --bg-color-button-icon-blau: #0097E3;
    --bg-color-button-icon-blau-hover: #38BDFF;

    --bg-color-button-gruen: #3B6336;
    --bg-color-button-gruen-hover: #2E4C2A;

    --bg-color-button-gelb: #F5D657;
    --bg-color-button-gelb-hover: #A3A300;

    --bg-color-button-blau: #127BAF;
    --bg-color-button-blau-hover: #0E5B81;

    --bg-color-button-rot: #AF1212;
    --bg-color-button-rot-hover: #810E0E;

    --bg-feldkopf-verlauf-start: #666666;
    --bg-feldkopf-verlauf-ende: #2E2E2E;
    --bg-feldkopf-box-shadow: #171717;
    --bg-neuerfeldkopf-verlauf-start: #666666;
    --bg-neuerfeldkopf-verlauf-ende: #2E2E2E;
    --bg-neuerfeldkopf-box-shadow-start: #333333;
    --bg-neuerfeldkopf-box-shadow-ende: #171717;
    --bg-header-sticky: #0A3C52;
    --bg-select-verlauf-start: #4F4F4F;
    --bg-select-verlauf-ende: #2E2E2E;
    --bg-suggestionbox-verlauf-start: #4F4F4F;
    --bg-suggestionbox-verlauf-ende: #2E2E2E;
    --bg-color-rpc-list: #292929;
    --bg-color-select-option: #292929;
    --bg-color-flipswitch: #1A9AD0;
    --bg-color-kalkulation-kopf-fuss: #2E2E2E;
    --bg-color-loadspinner: #fff;
    --bg-color-fieldset: #363636;
    --border-feldkopf-bottom: #2E2E2E;
    --border-success: #006100;
    --border-warnung: #5C5C00;
    --border-danger: #610000;
    --border-danger-halb: #610000;
    --border-glow-green: #006100;
    --border-badge: #666666;
    --border-input: #666666;
    --border-input-focus: #287CB2;
    --border-input-editable: #666666;
    --border-input-editable-focus: #287CB2;
    --border-rpc-list: #666666;
    --border-rpc-list-bold: #CCCCCC;
    --border-suggestionBox: #666666;
    --border-button-hell: #666666;
    --border-kalkulationslist: #666666;
    --border-fieldset: #287CB2;
    --heading-color: #fff;
    --padding-header: 5px;
    --padding-header_sticky: 10px;
    --padding-tablecell: 5px;
}

[data-theme-priv="close"] {
    --display-private: none;
}

body {
    margin: 0  0  0 0.0em;
    font-family: Roboto Condensed, sans-serif;
    font-size: calc(0.5em + 0.9vmin);
    background-color: var(--bg-color);
}

.moon, .sun {
    width: 1.2em;
    cursor: pointer;
    transition: .5s all ease-in-out;
}

.sun:hover {
    animation: sun_rotate 1s infinite;
}

.moon:hover {
    transform: scale(1.1);
}

.hide {
    display: none;
}

.close, .open {
    width: 1.2em;
    cursor: pointer;
    transition: .5s all ease-in-out;
}

.open:hover {
    animation: sun_rotate 1s infinite;
}

.close:hover {
    transform: scale(1.1);
}

.hide1 {
    display: none;
}




/* Hauptmenü */
#menu {
    position: sticky;
    top: 0px;
    display: flex;
    z-index: 1000;
 /* 4 bis Darkmode: Dann hat sich aber loadscreen mit z-index 999 auch über das Menü gelegt. */
    line-height: 1.3em;
    justify-content: space-between;
    -moz-box-shadow: 1px 1px 1px #888;
    -webkit-box-shadow: 1px 1px 1px #888;
    box-shadow: 1px 1px 1px #888;
}

#menu ul {
    margin: 0;
    padding: 0;
}

#menu .main-menu {
    display: none;
}

#tm:checked + .main-menu {
    display: block;
}

#menu input[type="checkbox"],#menu ul span.drop-icon {
    display: none;
}

#menu li,#toggle-menu,#menu .sub-menu {
    -moz-box-shadow: 1px 1px 1px #888;
    -webkit-box-shadow: 1px 1px 1px #888;
    box-shadow: 1px 1px 1px #888;
    background-color: #191E23;
    border-style: solid;
    border-color: #32373C;
}

#menu li,#toggle-menu {
    border-width: 0 0 1px;
}

#menu .sub-menu {
    border-width: 1px 1px 0;
    margin: 0 1em;
}

#menu .sub-menu li:last-child {
    border-width: 0;
}

#menu li,#toggle-menu,#menu a {
    position: relative;
    display: block;
    color: var(--font-color-menue);
    text-shadow: 1px 1px 0 rgba(0, 0, 0, .125);
}

#menu,#toggle-menu {
    background-color: #191E23;
}

#toggle-menu,#menu a {
    padding: 0.75em 1.0em;
}

#menu a {
    text-decoration: none;
    transition: all .125s ease-in-out;
    -webkit-transition: all .125s ease-in-out;
}

#menu a:hover {
    background-color: white;
    color: #191E23;
}

#menu .sub-menu {
    z-index: 9999;
    display: none;


}

#menu .sub-menu li {
    background-color: #32373C;
    }



#menu .sub-menu ul.unten {
    background-color: #32373C;
    @media (max-height: 56em) {
    /*background-color: #FF0033;*/
    transform: translateY(-14.2em); /* Move the menu up by 100% of its height */
  }
}


/*Mastermenü zwischen 2 Screenbreiten, sprich wenn rechts nicht genug Platz ist, nach links aufklappen.*/
@media only screen and (max-width: 120em) and (min-width: 90em) {
#menu ul .sub-menu .rechts_master  {
    position: absolute;
    top: 0;
    left: -100%; /* verschiebt das Submenü nach links außerhalb des Elternelements */
    width: 100%;
    text-align: right;
    }
}


#menu input[type="checkbox"]:checked + .sub-menu {
    display: block;
}

#menu .sub-menu a:hover {
    color: #444;
}

#toggle-menu .drop-icon,#menu li label.drop-icon {
    position: absolute;
    right: 1.0em;
    top: 0.2em;
}

#menu label.drop-icon, #toggle-menu span.drop-icon {
    border-radius: 50%;
    width: 1em;
    height: 1em;
    font-size: 2em;
    text-align: center;
    background-color: rgba(0, 0, 0, .125);
    text-shadow: 0 0 0 transparent;
    color: rgba(255, 255, 255, .75);
}

#menu .drop-icon {
    line-height: 1.3;
}

#menu .badge {
    display: block;
    position: absolute;
    top: 10px;
    right: 3px;
    line-height: 16px;
    height: 16px;
    padding: 0 5px;
    font-family: Roboto Condensed, sans-serif;
    font-size: 0.9em;
    color: var(--font-color-badge);
    text-shadow: 0 1px rgba(0, 0, 0, 0.25);
    border: 1px solid;
    border-radius: 10px;
    -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.3), 0 1px 1px rgba(0, 0, 0, 0.08);
    box-shadow: inset 0 1px rgba(255, 255, 255, 0.3), 0 1px 1px rgba(0, 0, 0, 0.08);
}

#menu .badge {
    background: #67c1ef;
    border-color: #30aae9;
    background-image: -webkit-linear-gradient(top, #acddf6, #67c1ef);
    background-image: -moz-linear-gradient(top, #acddf6, #67c1ef);
    background-image: -o-linear-gradient(top, #acddf6, #67c1ef);
    background-image: linear-gradient(to bottom, #acddf6, #67c1ef);
}

#menu .badge.green {
    background: #77cc51;
    border-color: #59ad33;
    background-image: -webkit-linear-gradient(top, #a5dd8c, #77cc51);
    background-image: -moz-linear-gradient(top, #a5dd8c, #77cc51);
    background-image: -o-linear-gradient(top, #a5dd8c, #77cc51);
    background-image: linear-gradient(to bottom, #a5dd8c, #77cc51);
}

#menu .badge.yellow {
    background: #faba3e;
    border-color: #f4a306;
    background-image: -webkit-linear-gradient(top, #fcd589, #faba3e);
    background-image: -moz-linear-gradient(top, #fcd589, #faba3e);
    background-image: -o-linear-gradient(top, #fcd589, #faba3e);
    background-image: linear-gradient(to bottom, #fcd589, #faba3e);
}

#menu .badge.red {
    background: #fa623f;
    border-color: #fa5a35;
    background-image: -webkit-linear-gradient(top, #fc9f8a, #fa623f);
    background-image: -moz-linear-gradient(top, #fc9f8a, #fa623f);
    background-image: -o-linear-gradient(top, #fc9f8a, #fa623f);
    background-image: linear-gradient(to bottom, #fc9f8a, #fa623f);
}

@media only screen and (max-width: 90em) and (min-width: 52.01em) {
    #menu li {
        width: auto;
    }

    #menu .sub-menu li {
        width: auto;
    }
}

@media only screen and (min-width: 52em) {
    #menu .main-menu {
        display: block;
    }

    #toggle-menu,#menu label.drop-icon {
        display: none;
    }

    #menu ul span.drop-icon {
        display: inline-block;
    }

    #menu li {
        white-space: nowrap;
        float: left;
        border-width: 0 1px 0 0;
    }

    #menu .sub-menu li {
        float: none;
    }

    #menu .sub-menu {
        border-width: 0;
        margin: 0;
        position: absolute;
        top: 100%;
        left: 0;
        width: auto;
        <!-- auto damit Spaltenbreite der Liste passt Ursprung 12em-->z-index: 3000;
    }

    #menu .sub-menu,#menu input[type="checkbox"]:checked + .sub-menu {
        display: none;
    }

    #menu .sub-menu li {
        border-width: 0 0 1px;
    }

    #menu .sub-menu .sub-menu {
        top: 0;
        left: 100%;
    }

    #menu li:hover > input[type="checkbox"] + .sub-menu {
        display: block;
    }
}

@media only screen and (max-width: 52em) {
    #menu {
        display: inline;
        justify-content: space-between;
    }
}

@media  (max-width: 95em) {
    .beibreit {
        display: none;
    }
}

#overlay {
    visibility: hidden;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    text-align: center;
    z-index: 1000;
}

#overlay div {
    width: 300px;
    margin: 200px auto;
    background-color: #fff;
    border: 1px solid #000;
    padding: 15px;
    text-align: center;
}

.navLeftLevel1 {
    display: block;
    background-color: #FFFFFF;
    color: #FFFFFF;
    width: 160px;
    margin-bottom: 2px;
    font-size: 1em;
    font-weight: bolder;
    font-family: Roboto Condensed, sans-serif;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

.navLeftLevel2 {
    display: block;
    background-color: #FFFFFF;
    color: #FFFFFF;
    width: 160px;
    margin-bottom: 2px;
    font-size: 1em;
}

.navLeftLevel3 {
    display: block;
    background-color: #FFFFFF;
    color: #FFFFFF;
    width: 160px;
}

.aNavLeftLevel1 {
    display: block;
    line-height: 16px;
    padding-left: 4px;
    font-size: 1em;
    font-weight: bold;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

.aNavLeftLevel2 {
    display: block;
    line-height: 1em;
    padding-left: 16px;
    font-size: 1em;
}

.aNavLeftLevel3 {
    display: block;
    line-height: 1empadding-left:28px;
    background-color: #FFFFFF;
}

.aNavLeftLevel1:hover {
    background-color: #B3D9FF;
    color: #0080FF;
}

.aNavLeftLevel2:hover {
    background-color: #B3D9FF;
    color: #0080FF;
}

.aNavLeftLevel3:hover {
    background-color: #B3D9FF;
    color: #0080FF;
}

.fa-2x {
    font-size: 2em;
}

.fa_left-menu {
    position: relative;
    display: table-cell;
    width: 1.5em;
    height: 1.5em;
    padding: 0.5em;
    text-align: center;
    vertical-align: middle;
    font-size: 1.25em;
}

#left-menu:hover,nav.left-menu.expanded {
    overflow: visible;
}

#left-menu {
    background: #212121;
    border-right: 1px solid #e5e5e5;
    position: sticky;
    float: left;
    top: 0em;
    bottom: 0em;
    min-height: 100vh;
    left: 0;
    width: 3.0em;
    overflow: hidden;
    -webkit-transition: width .05s linear;
    transition: width .05s linear;
    -webkit-transform: translateZ(0) scale(1,1);
    z-index: 1000;
}

#left-menu>ul {
    margin: 3.0em 0;
}

#left-menu li {
    position: relative;
    display: block;
    float: none;
    width: 200px;
    background: #212121;
    border-right: 1px solid #e5e5e5;
}

#left-menu li>a {
    position: relative;
    display: table;
    border-collapse: collapse;
    border-spacing: 0;
    color: #999;
    font-size: 1em;
    text-decoration: none;
    -webkit-transform: translateZ(0) scale(1,1);
    -webkit-transition: all .125s linear;
    transition: all .125s linear;
}

#left-menu .nav-icon {
    position: relative;
    display: table-cell;
    width: 3em;
    height: 2em;
    text-align: center;
    vertical-align: middle;
    font-size: 2em;
}

#left-menu .nav-text {
    position: relative;
    display: table-cell;
    vertical-align: middle;
    width: 100%;
}

#left-menu>ul.logout {
    position: sticky;
    left: 0;
    bottom: 0;
}

.no-touch .scrollable.hover {
    overflow-y: hidden;
}

.no-touch .scrollable.hover:hover {
    overflow-y: auto;
    overflow: visible;
}

a:hover,a:focus {
    text-decoration: none;
}

#left-menu.nav {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

nav ul,nav li {
    outline: 0;
    margin: 0;
    padding: 0;
}

#left-menu li:hover>a,nav.left-menu li.active>a,.dropdown-menu>li>a:hover,.dropdown-menu>li>a:focus,.dropdown-menu>.active>a,.dropdown-menu>.active>a:hover,.dropdown-menu>.active>a:focus,.no-touch .dashboard-page nav.dashboard-menu ul li:hover a,.dashboard-page nav.dashboard-menu ul li.active a {
    color: #fff;
    background-color: #5fa2db;
}

.area {
    position: sticky;
    top: 2.5em;
    float: left;
    padding: 0px;
    background: #e2e2e2;
    height: 100%;
}

fieldset {
    border: 2px solid var(--border-fieldset);
    border-radius: 6px;
    background: var(--bg-color-fieldset);
}

hr {
    border: 0;
    height: 1px;
    background-image: linear-gradient(to right, #ccc, #333, #ccc);
}

::-webkit-input-placeholder,
:-moz-placeholder, /* Firefox 18- */
::-moz-placeholder, /* Firefox 19+ */
:-ms-input-placeholder {
    font-weight: lighter;
    font-size: 0.9em;
}

.qrcode-text,
.qrcode-text-btn {
    display: none;
}

@media only screen and (max-device-width:1367px) {
    /*1px größer als Ipad Pro*/
    .qrcode-text {
        padding-right: 0.1em;
        margin-right: 0;
    }

    .qrcode-text-btn {
        display: inline;
        position: fixed;
        left: auto;
        right: auto;
        text-align: center;
        bottom: 0;
        font-size: calc(2.5em + 0.9vmax);
        padding: 0.1em;
        z-index: 10000;
        background: #5fa2db;
        border: 5px solid white;
        border-radius: 3px;
        -webkit-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
        -moz-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
        box-shadow: 0 0 5px -1px #333333, 0 1px 2px -1px #FFFFFF inset, inset 0 0 4px 2px rgba(0,0,0, 0.1);
        cursor: pointer;
    }

    .qrcode-text-btn > input[type=file] {
        position: absolute;
        overflow: hidden;
        width: 1px;
        height: 1px;
        opacity: 0;
    }
}

#fusszeile_meldung,
#fusszeile_meldung_breit,
#fusszeile_meldung_workcenter,
#fusszeile_warnung_workcenter {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 0.5em;
    border: 1px solid silver;
    box-shadow: -1px 0px 1px #888;
}

#fusszeile_meldung {
    margin-left: 3em;
    background: green;
    color: white;
}

#fusszeile_meldung_breit {
    margin-left: 0;
    background: green;
    color: white;
}

#fusszeile_warnung {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    background: yellow;
    color: white;
    padding: 0.5em;
    border: 1px solid silver;
    box-shadow: -1px 0px 1px #888;
    font-size: 1.4em;
    font-weight: bold;
}

#fusszeile_warnung_workcenter {
    margin-left: 3em;
    background: #F5D657;
    color: var(--font-color-warnung);
    font-size: 1.2em;
}

#fusszeile_meldung_workcenter {
    margin-left: 3em;
    background: green;
    color: var(--font-color-meldung);
    font-size: 1.2em;
}

#fusszeile_option {
    position: sticky;
    display: flex;
    left: 3em;
    bottom: 0;
    width: auto;
    padding: 1em;
    border: 1px solid white;
    border-radius: 1px;
    text-decoration: none;
    font-size: 1em;
    font-weight: bold;
    font-family: Roboto Condensed, sans-serif;
    text-align: left;
    background: linear-gradient(to bottom, #DADADA 5%, #DADADA 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#599bb3', endColorstr='#408c99',GradientType=0);
    background-color: #DADADA;
    color: black;
    opacity: 0.9;
    filter: alpha(opacity=90);
    -webkit-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    -moz-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    box-shadow: 0 0 5px -1px #333333, 0 1px 2px -1px #FFFFFF inset, inset 0 0 4px 2px rgba(0,0,0, 0.1);
    z-index: 998;
}

#notification-container {
    --notification-box-height: 50px;
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    z-index: 99999;
}

.notification-card-debug, .notification-card-change, .notification-card-plus, .notification-card-dark, .notification-card-success, .notification-card-info, .notification-card-warning, .notification-card-error {
    --notification-box-height: 50px;
    --notification-box-height_2: 42px; /* Wert - 4 * 2 */
    position: relative;
    width: 460px;
    min-height: var(--notification-box-height_2);
    padding: 4px;
    margin: 5px;
    border-radius: 4px;
    box-shadow: 0 0 10px Black;
    transform: translateX(100%); /* Startposition außerhalb des Sichtbereichs */
    opacity: 0; /* Start mit unsichtbar */
    transition: transform 0.75s ease, opacity 0.75s ease;
    font-size: 0.9em;
    font-weight: 300;
}

.notification-card-debug span,
.notification-card-change span,
.notification-card-plus span,
.notification-card-dark span,
.notification-card-success span,
.notification-card-info span,
.notification-card-warning span,
.notification-card-error span {
    display: block;
    margin-left: 50px;
}

.notification-card-debug span:nth-child(2),
.notification-card-change span:nth-child(2),
.notification-card-plaus span:nth-child(2),
.notification-card-dark span:nth-child(2),
.notification-card-success span:nth-child(2),
.notification-card-info span:nth-child(2),
.notification-card-warning span:nth-child(2),
.notification-card-error span:nth-child(2) {
    font-weight: 700;
}

.notification-card-debug i,
.notification-card-change i,
.notification-card-plus i,
.notification-card-dark i,
.notification-card-success i,
.notification-card-info i,
.notification-card-warning i,
.notification-card-error i {
    position: absolute;
    left: 0;
    top: 0;
    width: 40px;
    min-height: var(--notification-box-height);
    font-size: 32px;
    text-align: center;
    line-height: var(--notification-box-height);
    vertical-align: middle;
}

.notification-card-success {
    color: #0d8801;
    border: 1px solid #a1d28f; /* Dunkler als #cdecc2 */
    background: linear-gradient(to bottom, #cdecc2, #b3d8a0);
}

.notification-card-success a {
    color: #0d8801;
}

.notification-card-success i {
    background: #b3d8a0; /* Dunkler als #cdecc2 */
    color: #0b6e00; /* Dunkler als #0d8801 */
    text-shadow: 0px 1px 1px #e0f0e0; /* Heller als #cdecc2 */
}

.notification-card-info {
    color: #004d7e;
    border: 1px solid #a3c1e0; /* Dunkler als #cae2ff */
    background: linear-gradient(to bottom, #cae2ff, #c2d9f0);
}

.notification-card-info a {
    color: #004d7e;
}

.notification-card-info i {
    background: #b3cde0; /* Dunkler als #cae2ff */
    color: #003d6a; /* Dunkler als #004d7e */
    text-shadow: 0px 1px 1px #e0f0ff; /* Heller als #cae2ff */
}

.notification-card-warning, .notification-card-change, .notification-card-plus  {
    color: #7a5f24;
    border: 1px solid #e6c27a; /* Dunkler als #ffdd9c */
    background: linear-gradient(to bottom, #ffdd9c, #f0d68c);
}

.notification-card-warning a, .notification-card-change a, .notification-card-plus a {
    color: #7a5f24;
}

.notification-card-warning i, .notification-card-change i, .notification-card-plus i {
    background: #e6c27a; /* Dunkler als #ffdd9c */
    color: #6a4e1a; /* Dunkler als #7a5f24 */
    text-shadow: 0px 1px 1px #f0e0b0; /* Heller als #ffdd9c */
}

.notification-card-error {
    color: #a44646;
    border: 1px solid #e6a3a3; /* Dunkler als #ffcece */
    background: linear-gradient(to bottom, #ffcece, #f0b3b3);
}

.notification-card-error a {
    color: #a44646;
}

.notification-card-error i {
    background: #e6a3a3; /* Dunkler als #ffcece */
    color: #8a3a3a; /* Dunkler als #a44646 */
    text-shadow: 0px 1px 1px #f0d0d0; /* Heller als #ffcece */
}

.notification-card-dark, .notification-card-debug {
    color: #ddd;
    border: 1px solid #4c4c4c; /* Dunkler als #3e3e3e */
    background: linear-gradient(to bottom, #3e3e3e, #2e2e2e);
}

.notification-card-dark a, .notification-card-debug a {
    color: #ddd;
}

.notification-card-dark i, .notification-card-debug i {
    background: #4c4c4c; /* Dunkler als #3e3e3e */
    color: #ccc; /* Dunkler als #ddd */
    text-shadow: none;
}

.notification-card-debug.hide_notification,
.notification-card-change.hide_notification,
.notification-card-plus.hide_notification,
.notification-card-dark.hide_notification,
.notification-card-success.hide_notification,
.notification-card-info.hide_notification,
.notification-card-warning.hide_notification,
.notification-card-error.hide_notification {
    transform: translateX(100vw); /* Verschiebe das Element nach rechts */
    opacity: 0; /* Mache das Element unsichtbar */
}

.notification-card-debug.show_notification,
.notification-card-change.show_notification,
.notification-card-plus.show_notification,
.notification-card-dark.show_notification,
.notification-card-success.show_notification,
.notification-card-info.show_notification,
.notification-card-warning.show_notification,
.notification-card-error.show_notification {
    transform: translateX(0); /* Verschiebe das Element nach rechts */
    opacity: 1; /* Mache das Element sichtbar */
}

#wrapper {
    margin: 0 auto;
    width: 100%;
}

#customersList {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

#customersList li {
    height: 30px;
    padding: 1em;
    margin: 1em 0;
    background-color: #efefef;
    border: 1px solid silver;
    color: #fff;
}

html>body #customersList li {
    height: 30px;
    margin: 1em 0;
}

#customersList .customersListHighlight {
    background: #fdfdfd;
    height: 30px;
    border: 1px dashed silver;
}

.customerName {
    color: green;
    font-size: 1em;
    float: left;
    padding: 3px;
}

.KalkulationList, .KalkulationListPR, .KalkulationListAS, .KalkulationListES, .KalkulationListCA, .KalkulationListAN {
    list-style-type: none;
    margin-top: 0.25em;
    margin-bottom: 0.25em;
    padding: 0;
    border-left: 2px solid var(--border-kalkulationslist);
    border-right: 2px solid var(--border-kalkulationslist);
    border-radius: 2px;
}

.KalkulationList:first-child, .KalkulationListPR:first-child, .KalkulationListAS:first-child, .KalkulationListES:first-child, .KalkulationListCA:first-child, .KalkulationListAN:first-child {
    margin-top: 0;
}

.KalkulationList:last-child, .KalkulationListPR:last-child, .KalkulationListAS:last-child, .KalkulationListES:last-child, .KalkulationListCA:last-child, .KalkulationListAN:last-child {
    margin-bottom: 0;
}

.KalkulationList li, .KalkulationListPR li, .KalkulationListAS li, .KalkulationListES li, .KalkulationListCA li, .KalkulationListAN li {
    display: inline-block;
    width: 100%;
    cursor: move;
    min-height: 3em;
    padding: 0;
    margin: 0;
    background-color: #FFFFFF;
    border-top: 1px solid var(--border-kalkulationslist);
    border-right: 1px solid var(--border-kalkulationslist);
    color: #fff;
}

.KalkulationList li:last-child, .KalkulationListPR li:last-child, .KalkulationListAS li:last-child, .KalkulationListES li:last-child, .KalkulationListCA li:last-child, .KalkulationListAN li:last-child {
    border-bottom: 1px solid var(--border-kalkulationslist);
}

html>body .KalkulationList li, .KalkulationListPR li, .KalkulationListAS li, .KalkulationListES li, .KalkulationListCA li, .KalkulationListAN li {
    margin: 0;
}

.KalkulationList .KalkulationListHighlight, .KalkulationListPR .KalkulationListHighlight, .KalkulationListAS .KalkulationListHighlight, .KalkulationListES .KalkulationListHighlight, .KalkulationListCA .KalkulationListHighlight, .KalkulationListAN .KalkulationListHighlight {
    background: #fdfdfd;
    border: 2px dashed var(--border-kalkulationslist);
}

.KalkulationArtikel {
    background-color: var(--bg-color-abgerundet_zelle2);
    color: var(--font-color-input);
    font-size: 1em;
    float: left;
    width: 100%;
    min-height: 2.7em;
    padding: 3px 0 3px 0;
}

.Kalkulation_Freitext {
    display: block;
    color: black;
    font-size: 0.8em;
    float: left;
    width: 100%;
    padding: 3px;
}

.customerOrt {
    color: grey;
    font-size: 1em;
    font-weight: normal;
    float: left;
    padding: 3px;
}

#debugMess {
    background: green;
    color: white;
    padding: 1em;
    border: 1px solid silver;
}

/* Removed invalid selectors with double dots (..) */

/* Consolidated .termin_box styles */
.termin_box {
    position: fixed;
    z-index: 99;
    background: linear-gradient(to bottom, #81b1d1, #2980b9);
    border-radius: 3px;
    box-shadow: 0px 1px 3px #666666;
    font-family: Roboto Condensed, sans-serif;
    color: #000000;
    font-size: 1em;
    padding: 5px;
    text-decoration: none;
}

.termin_box_rot {
    background: linear-gradient(to bottom, #F2DEDE 0%, #F2DEDE 100%);
    border: 1px solid #E88A7B;
    border-radius: 3px;
    box-shadow: 0px 1px 3px #666666;
    font-family: Roboto Condensed, sans-serif;
    color: #000000;
    font-size: 1em;
    padding: 5px;
    text-decoration: none;
}

.termin_box_gelb {
    background: linear-gradient(to bottom, #FCF8E3 0%, #FCF8E3 100%);
    border: 0;
    border-radius: 3px;
    box-shadow: 0px 1px 3px #666666;
    font-family: Roboto Condensed, sans-serif;
    color: #000000;
    font-size: 1em;
    padding: 5px;
    text-decoration: none;
}

.termin_box_gruen {
    background: linear-gradient(to bottom, #DFF0D8 0%, #DFF0D8 100%);
    border: 1px solid #00CE00;
    border-radius: 3px;
    box-shadow: 0px 1px 3px #666666;
    font-family: Roboto Condensed, sans-serif;
    color: #000000;
    font-size: 1em;
    padding: 5px;
    text-decoration: none;
}

/* Consolidated .termin_balken and .termin_rahmen */
.termin_balken,
.termin_rahmen {
    position: fixed;
    z-index: 99;
    background-image: linear-gradient(to bottom, #e4efc0 0%, #abbd73 100%);
}

/* Consolidated .termin_tour_balken */
.termin_tour_balken {
    position: fixed;
    z-index: 99;
    background-image: linear-gradient(to bottom, #E4EFC0 0%, #ABBD73 50%, #E4EFC0 51%, #abbd73 100%);
}

/* Consolidated .buchung_balken */
.buchung_balken {
    position: fixed;
    z-index: 99;
    background-image: linear-gradient(to bottom, #cfe7fa 0%, #6393c1 100%);
}

/* Consolidated .buchung_inaktiv_balken */
.buchung_inaktiv_balken {
    position: fixed;
    z-index: 99;
    background-image: linear-gradient(to bottom, #FFDDDD 0%, #FF8080 100%);
}

/* Consolidated .buchung_tour_balken */
.buchung_tour_balken {
    position: fixed;
    z-index: 99;
    background-image: linear-gradient(to bottom, #CFE7FA 0%, #6393C1 50%, #CFE7FA 51%, #6393c1 100%);
}

/* Consolidated .unten_box */
.unten_box {
    position: fixed;
    width: 30%;
    bottom: 2%;
    right: 2%;
    background-color: #599bb3;
    color: white;
    opacity: 0.8;
    filter: alpha(opacity=80);
}

/* Consolidated .unten_speichern_box and .unten_speichern_box_abstand_wegen_Hilfetexte */
.unten_speichern_box,
.unten_speichern_box_abstand_wegen_Hilfetexte {
    position: fixed;
    bottom: 1%;
    right: 1%;
    padding: 5px;
    border: 3px solid white;
    border-radius: 3px;
    text-decoration: none;
    color: white;
    font-size: 1em;
    font-weight: bold;
    font-family: Roboto Condensed, sans-serif;
    text-align: center;
    background: linear-gradient(to bottom, #DADADA 5%, #DADADA 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#599bb3', endColorstr='#408c99',GradientType=0);
    background-color: #DADADA;
    opacity: 0.8;
    filter: alpha(opacity=80);
    -webkit-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    -moz-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    box-shadow: 0 0 5px -1px #333333, 0 1px 2px -1px #FFFFFF inset, inset 0 0 4px 2px rgba(0,0,0, 0.1);
}

.unten_speichern_box_abstand_wegen_Hilfetexte {
    bottom: 3em;
}

/* Consolidated .plus_box, .zurueck_box, .vor_box, #arrowUp */
.plus_box,
.zurueck_box,
.vor_box,
#arrowUp {
    position: fixed;
    right: 0;
    border: 1px solid white;
    border-radius: 3px;
    text-decoration: none;
    color: white;
    font-family: Roboto Condensed, sans-serif;
    text-align: center;
    background: linear-gradient(to bottom, #599bb3 5%, #408c99 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#599bb3', endColorstr='#408c99',GradientType=0);
    background-color: #599bb3;
    opacity: 0.8;
    filter: alpha(opacity=80);
    -webkit-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    -moz-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    box-shadow: 0 0 5px -1px #333333, 0 1px 2px -1px #FFFFFF inset, inset 0 0 4px 2px rgba(0,0,0, 0.1);
    z-index: 3;
    font-size: 1.5em;
}

.plus_box {
    bottom: 2em;
}

.zurueck_box {
    bottom: 4em;
    right: 1.5em;
}

.vor_box {
    bottom: 4em;
}

#arrowUp {
    bottom: 0;
}

#arrowUp a {
    text-decoration: none;
    color: white;
    font-weight: bold;
    font-family: Roboto Condensed, sans-serif;
}

/* Consolidated .preis_box */
.preis_box {
    position: fixed;
    top: 1%;
    right: 5%;
    padding: 0.25em;
    border: 1px solid #0074E8;
    border-radius: 1.5em;
    text-decoration: none;
    color: white;
    font-size: 1.5em;
    font-weight: bold;
    font-family: Roboto Condensed, sans-serif;
    text-align: center;
    background: linear-gradient(to bottom, #B3D9FF 5%, #0074E8 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#B3D9FF', endColorstr='#0074E8',GradientType=0);
    background-color: #599bb3;
    opacity: 0.8;
    filter: alpha(opacity=80);
    -webkit-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    -moz-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    box-shadow: 0 0 5px -1px #333333, 0 1px 2px -1px #FFFFFF inset, inset 0 0 4px 2px rgba(0,0,0, 0.1);
}

/* Consolidated .summe_box */
.summe_box {
    position: fixed;
    top: 2em;
    right: 0.1em;
    padding: 0.25em;
    border: 3px solid white;
    border-radius: 0.5em;
    text-decoration: none;
    text-shadow: #000 0px 0px 2px;
    -webkit-font-smoothing: antialiased;
    color: var(--font-color-button-blau);
    font-size: 1.5em;
    font-weight: bold;
    font-family: Roboto Condensed, sans-serif;
    text-align: center;
    background: linear-gradient(to bottom, #B3D9FF 5%, #0074E8 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#B3D9FF', endColorstr='#0074E8',GradientType=0);
    background-color: #599bb3;
    opacity: 0.8;
    filter: alpha(opacity=80);
    -webkit-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    -moz-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    box-shadow: 0 0 5px -1px #333333, 0 1px 2px -1px #FFFFFF inset, inset 0 0 4px 2px rgba(0,0,0, 0.1);
    z-index: 3;
}

/* Consolidated .schnellnavigation_box */
.schnellnavigation_box {
    position: fixed;
    right: 0;
    padding: 1px;
    border: 1px solid white;
    border-radius: 1px;
    text-decoration: none;
    color: white;
    font-size: 1em;
    font-weight: bold;
    font-family: Roboto Condensed, sans-serif;
    text-align: center;
    background: linear-gradient(to bottom, #DADADA 5%, #DADADA 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#599bb3', endColorstr='#408c99',GradientType=0);
    background-color: #DADADA;
    opacity: 0.8;
    filter: alpha(opacity=80);
    -webkit-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    -moz-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    box-shadow: 0 0 5px -1px #333333, 0 1px 2px -1px #FFFFFF inset, inset 0 0 4px 2px rgba(0,0,0, 0.1);
    z-index: 998;
}

@media only screen and (max-width: 52em) {
    .schnellnavigation_box {
        display: none;
    }
}

/* Consolidated .speicher_box */
.speicher_box {
    position: fixed;
    z-index: 99;
    width: 100px;
    top: 2%;
    right: 7%;
    padding: 1em;
}

/* Consolidated .close_box */
.close_box {
    position: fixed;
    width: 1.5em;
    height: 1.5em;
    top: 1%;
    right: 1%;
    padding: 5px;
    border: 2px solid white;
    border-radius: 20px;
    text-decoration: none;
    color: white;
    font-weight: bold;
    font-family: Roboto Condensed, sans-serif;
    text-align: center;
    background: linear-gradient(to bottom, #DADADA 5%, #DADADA 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#599bb3', endColorstr='#408c99',GradientType=0);
    background-color: #DADADA;
    opacity: 0.8;
    filter: alpha(opacity=80);
    -webkit-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    -moz-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    box-shadow: 0 0 5px -1px #333333, 0 1px 2px -1px #FFFFFF inset, inset 0 0 4px 2px rgba(0,0,0, 0.1);
}

/* Consolidated .qr_box */
.qr_box {
    position: fixed;
    width: 7em;
    height: 7.7em;
    bottom: 0;
    right: 45%;
    padding: 1em;
    border: 1px solid white;
    border-radius: 1px;
    text-decoration: none;
    color: white;
    font-size: 1em;
    font-weight: bold;
    font-family: Roboto Condensed, sans-serif;
    text-align: center;
    background: linear-gradient(to bottom, #599bb3 5%, #408c99 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#599bb3', endColorstr='#408c99',GradientType=0);
    background-color: #599bb3;
    opacity: 0.8;
    filter: alpha(opacity=80);
    -webkit-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    -moz-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    box-shadow: 0 0 5px -1px #333333, 0 1px 2px -1px #FFFFFF inset, inset 0 0 4px 2px rgba(0,0,0, 0.1);
}

/* Consolidated .hinweis_box */
.hinweis_box {
    position: fixed;
    z-index: 99;
    width: 30%;
    max-height: 90%;
    bottom: 2%;
    right: 2%;
    padding: 0;
    border-style: solid;
    border-color: transparent;
    border-width: 1px;
    border-radius: 3px;
    background-color: transparent;
    box-shadow: 0 0 5px -1px #333333, 0 1px 2px -1px #FFFFFF inset, inset 0 0 4px 2px rgba(0,0,0, 0.1);
    border-collapse: separate;
    text-decoration: none;
    color: black;
    font-size: 1em;
    font-family: Roboto Condensed, sans-serif;
    text-align: center;
    background: linear-gradient(to bottom, #F7F7F7 0%, #E8E8E8 100%);
    overflow: auto;
}

/* Consolidated .hinweis_box_klein */
.hinweis_box_klein {
    position: fixed;
    z-index: 99;
    bottom: 2%;
    right: 2%;
    padding: 0;
    border-style: solid;
    border-color: transparent;
    border-width: 1px;
    border-radius: 3px;
    background-color: transparent;
    box-shadow: 0 0 5px -1px #333333, 0 1px 2px -1px #FFFFFF inset, inset 0 0 4px 2px rgba(0,0,0, 0.1);
    border-collapse: separate;
    text-decoration: none;
    color: black;
    font-weight: bold;
    font-family: Roboto Condensed, sans-serif;
    text-align: center;
    background: linear-gradient(to bottom, #F7F7F7 0%, #E8E8E8 100%);
    cursor: pointer;
}

/* Consolidated .melde_box */
.melde_box {
    position: fixed;
    min-width: 30px;
    top: 5%;
    right: 5%;
    padding: 15px;
    border: 3px solid white;
    border-radius: 30px;
    text-decoration: none;
    color: white;
    font-weight: bold;
    font-family: Roboto Condensed, sans-serif;
    text-align: center;
    background: linear-gradient(to bottom, #599bb3 5%, #408c99 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#599bb3', endColorstr='#408c99',GradientType=0);
    background-color: #599bb3;
    opacity: 0.8;
    filter: alpha(opacity=80);
    -webkit-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    -moz-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    box-shadow: 0 0 5px -1px #333333, 0 1px 2px -1px #FFFFFF inset, inset 0 0 4px 2px rgba(0,0,0, 0.1);
}

/* Consolidated .sperr_box */
.sperr_box {
    position: fixed;
    min-width: 90%;
    min-height: 90%;
    top: 5%;
    right: 5%;
    padding: 15px;
    border: 3px solid white;
    border-radius: 30px;
    text-decoration: none;
    color: white;
    font-weight: bold;
    font-family: Roboto Condensed, sans-serif;
    text-align: center;
    background: linear-gradient(to bottom, #e4685d 5%, #eb675e 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e4685d', endColorstr='#eb675e',GradientType=0);
    background-color: #e4685d;
    opacity: 0.8;
    filter: alpha(opacity=80);
}

/* Sticky table row */
tr.zeile_sticky {
    position: sticky;
    top: 10em;
}

/* Suggestions box */
.suggestionsBox,
.suggestionsBoxFlexBreit,
.suggestionsBoxFlexBreit_rechts,
.suggestionsBoxFlexBreitInside {
    position: absolute;
    overflow: visible;
    z-index: 9999;
    margin: 1px 0 0 0;
    background-image: linear-gradient(to bottom, var(--bg-suggestionbox-verlauf-start) 0%, var(--bg-suggestionbox-verlauf-ende) 100%);
    background-repeat: repeat-x;
    border-radius: 3px;
    border: 1px solid var(--border-suggestionBox);
    font-size: 1em;
    padding: 4px;
    font-family: Roboto Condensed, sans-serif;
    background-color: #EFEFEF;
    -webkit-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    -moz-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22), inset 0 0 4px 2px rgba(0,0,0, 0.1);
}

.suggestionsBoxFlexBreit_rechts {
    right: 10px;
}

.suggestionsBoxFlexBreitInside {
    margin: 15px 0 0 0;
}

.suggestionList {
    margin: 0;
    padding: 0;
}

.suggestionList li {
    margin: 0 0 3px 0;
    padding: 5px;
}

.suggestionList li:hover {
    background-color: #659CD8;
}

/* Tooltip */
.tooltip,
.tooltip_rechts {
    display: none;
    position: absolute;
    z-index: 9999;
    text-align: center;
    border: 1px solid #333;
    background-color: #161616;
    border-radius: 3px;
    padding: 0.5em;
    color: #fff;
    font-size: 1em;
    -webkit-box-shadow: 0 0 5px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 5px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 5px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.tooltip_rechts {
    float: left;
    width: 110px;
}

/* Loader spinner */
.lds-spinner {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
    margin-top: 200px;
}

.lds-spinner div {
    transform-origin: 40px 40px;
    animation: lds-spinner 1.2s linear infinite;
}

.lds-spinner div:after {
    content: " ";
    display: block;
    position: absolute;
    top: 3px;
    left: 37px;
    width: 6px;
    height: 18px;
    border-radius: 20%;
    background: var(--bg-color-loadspinner);
}

.lds-spinner div:nth-child(1) { transform: rotate(0deg); animation-delay: -1.1s; }
.lds-spinner div:nth-child(2) { transform: rotate(30deg); animation-delay: -1s; }
.lds-spinner div:nth-child(3) { transform: rotate(60deg); animation-delay: -0.9s; }
.lds-spinner div:nth-child(4) { transform: rotate(90deg); animation-delay: -0.8s; }
.lds-spinner div:nth-child(5) { transform: rotate(120deg); animation-delay: -0.7s; }
.lds-spinner div:nth-child(6) { transform: rotate(150deg); animation-delay: -0.6s; }
.lds-spinner div:nth-child(7) { transform: rotate(180deg); animation-delay: -0.5s; }
.lds-spinner div:nth-child(8) { transform: rotate(210deg); animation-delay: -0.4s; }
.lds-spinner div:nth-child(9) { transform: rotate(240deg); animation-delay: -0.3s; }
.lds-spinner div:nth-child(10) { transform: rotate(270deg); animation-delay: -0.2s; }
.lds-spinner div:nth-child(11) { transform: rotate(300deg); animation-delay: -0.1s; }
.lds-spinner div:nth-child(12) { transform: rotate(330deg); animation-delay: 0s; }

@keyframes lds-spinner {
    0% { opacity: 1; }
    100% { opacity: 0; }
}

/* Loader */
.loader {
    width: 1em;
    height: 1em;
    border: 2px solid #FFF;
    border-bottom-color: transparent;
    border-radius: 50%;
    display: inline-block;
    vertical-align: middle;
    margin: 0.25em;
    animation: rotation 1s linear infinite;
}

@keyframes rotation {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

#loadScreen {
    position: fixed;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    background: var(--bg-color-loadScreen);
    opacity: 0.65;
    filter: alpha(opacity=65);
    /* For IE8 and earlier */
    z-index: 999;
}

.loadscreen {
    margin-top: 200px;
    margin-left: 45%;
    z-index: 999;
    background: var(--bg-color-loadScreen);
}

.loadscreen img {
    width: 10%;
    margin-top: 200px;
    z-index: 999;
    background: var(--bg-color-loadScreen);
}

#buchenScreen {
    position: fixed;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    background: var(--bg-color-loadScreen);
    opacity: 0.65;
    filter: alpha(opacity=65);
    /* For IE8 and earlier */
    z-index: 999;
}

.buchenscreen {
    margin-top: 200px;
    margin-left: 45%;
    z-index: 999;
    background: var(--bg-color-loadScreen);
}

.buchenscreen img {
    width: 10%;
    margin-top: 200px;
    z-index: 999;
    background: var(--bg-color-loadScreen);
}

#loadScreen2 {
    position: fixed;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    background: #000000;
    opacity: 0.45;
    filter: alpha(opacity=45);
    /* For IE8 and earlier */
    z-index: 2;
}

#greenScreen {
    position: fixed;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    background: #390;
    opacity: 0.65;
    filter: alpha(opacity=65);
    /* For IE8 and earlier */
    z-index: 2;
}

.greenscreen {
    margin-top: 200px;
    margin-left: 40%;
}

.greenscreen img {
    margin-top: 200px;
}

#redScreen {
    position: fixed;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    background: #F00;
    opacity: 0.65;
    filter: alpha(opacity=65);
    /* For IE8 and earlier */
    z-index: 2;
}

.redscreen {
    margin-top: 200px;
    margin-left: 40%;
}

.redscreen img {
    margin-top: 200px;
}

#yellowScreen {
    position: fixed;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    background: #FF0;
    opacity: 0.65;
    filter: alpha(opacity=65);
    /* For IE8 and earlier */
    z-index: 2;
}

.yellowscreen {
    margin-top: 200px;
    margin-left: 40%;
}

.yellowscreen img {
    margin-top: 200px;
}

#greyScreen {
    position: fixed;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    background: #333;
    opacity: 0.65;
    filter: alpha(opacity=65);
    /* For IE8 and earlier */
    z-index: 2;

}

.greyscreen {
    margin-top: 200px;
    margin-left: 40%;
    H2 {
    color: white;
    }

}

.greyscreen img {
    margin-top: 200px;
}

#crossScreen {
    position: fixed;
    height: 30%;
    width: 100%;
    left: 0;
    bottom: 0;
    background: #B3D9FF;
    opacity: 0.85;
    filter: alpha(opacity=85);
    /* For IE8 and earlier */;
}

.crossscreen {
    margin-bottom: 200px;
    margin-left: 40%;
}

#helpScreen {
    position: absolute;
    height: 96%;
    width: 96%;
    left: 2%;
    top: 2%;
    background: #333;
    opacity: 0.65;
    filter: alpha(opacity=65);
    /* For IE8 and earlier */;
}

.helpscreen {
    margin-top: 20px;
    margin-left: 40%;
}

.helpscreen img {
    margin-top: 20px;
}

H1 {
    color: grey;
    font-size: 40px;
    text-align: center;
    font-family: Roboto Condensed, sans-serif;
}

H2 {
    color: black;
    font-size: 100px;
    text-align: center;
    font-family: Roboto Condensed, sans-serif;
}

H3 {
    color: var(--font-color);
    font-size: 30px;
    text-align: center;
    font-family: Roboto Condensed, sans-serif;
}

H4 {
    margin-left: 1em;
    margin-right: 1em;
    color: black;
    font-size: 1em;
    text-align: justify;
    font-family: Roboto Condensed, sans-serif;
    font-weight: normal;
}

H5 {
    color: black;
    font-size: 20px;
    text-align: center;
    font-family: Roboto Condensed, sans-serif;
    font-weight: normal;
}

#obenlinks {
    position: absolute;
    height: 10%;
    width: 10%;
    left: 0;
    top: 0;
    background: #333;
    opacity: 0.65;
    filter: alpha(opacity=65);
    /* For IE8 and earlier */;
}

.obenlinks {
    margin-top: 5px;
    margin-left: 40%;
}

.obenlinks img {
    margin-top: 20px;
}

A {
    font-size: 1em;
    text-decoration: none;
    font-family: Roboto Condensed, sans-serif;
    font-weight: bold;
    color: var(--font-color-link);
    border: 0px solid #C1C1C1;
    margin: 0px;
    padding: 0.1em;
}

A:hover {
    text-decoration: underline;
    color: var(--font-color-link-hover);
}

A.glow {
    -webkit-box-shadow: 0 0 5px 4px rgba(36,184,194, 0.30);
    -moz-box-shadow: 0 0 5px 4px rgba(36,184,194, 0.30);
    box-shadow: 0 0 5px 4px rgba(36,184,194, 0.30);
}

A.teaser {
    font-size: 1em;
}

a.greylink {
    font-size: 1em;
    line-height: 1em;
    font-weight: bold;
    color: var(--font-color-greylink);
}

a.greylink:hover {
    color: var(--font-color-greylink-hover);
}

a.whitelink {
    font-size: 1em;
    line-height: 1em;
    font-weight: bold;
    color: var(--font-color-whitelink);
}

a.whitelink:hover {
    color: var(--font-color-whitelink-hover);
}

a img {
    border: 0px;
    vertical-align: middle;
    padding: 0.1em;
}

a.moeglichst_klein {
    font-size: 1px;
    /*position:absolute; top:-100px;*/
    position: relative;
    top: -80px;
  /*Die Verschiebung in Pixel*/;
}

a.moeglichst_klein_Veranstaltungabheute {
    font-size: 1px;
    /*position:absolute; top:-100px;*/
    position: relative;
    top: -10rem;
  /*Die Verschiebung in Pixel*/;
}

.abgerundet_zelle2 a img {
       /* Padding um Schaltflächen in Auftragsliste erhöhen */
    border: 0px;
    vertical-align: middle;
    padding: 0.3em;
}

a img.mit_schatten {
    border: 0px;
    vertical-align: middle;
    border-radius: 15%;
    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
}

a.anchorPos {
    display: block;
    position: relative;
    top: -250px;
  /*Die Verschiebung in Pixel*/
    visibility: hidden;
}

.badge1, .badge1_klein {
    position: relative;
    z-index: 1;
}

.badge1[data-badge]:after, .badge1_klein[data-badge]:after {
    content: attr(data-badge);
    position: absolute;
    z-index: 1;
    top: -25px;
    right: -12px;
    padding: 1px;
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    border: 1px solid var(--border-badge);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #0DA4E4), color-stop(1, #24ACE7));
    background: -moz-linear-gradient(top, #0DA4E4 5%, #24ACE7 100%);
    background: -webkit-linear-gradient(top, #0DA4E4 5%, #24ACE7 100%);
    background: -o-linear-gradient(top, #0DA4E4 5%, #24ACE7 100%);
    background: -ms-linear-gradient(top, #0DA4E4 5%, #24ACE7 100%);
    background: linear-gradient(to bottom, #0DA4E4 5%, #24ACE7 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0DA4E4', endColorstr='#24ACE7',GradientType=0);
    background-color: #0DA4E4;
    color: var(--font-color-badge);
    min-width: 24px;
    height: 24px;
    text-align: center;
    line-height: 25px;
    border-radius: 50%;
    box-shadow: 0 0 3px #333;
}

.badge1_klein[data-badge]:after {
    top: -10px;
    right: -3px;
    padding: 1px;
    font-size: 0.5em;
    min-width: 12px;
    height: 12px;
    line-height: 13px;
}

.badge_dashboard {
    position: relative;
    z-index: 1;
}

.badge_dashboard[data-badge]:after {
    display: var(--display-private);
    content: attr(data-badge);
    position: absolute;
    z-index: 1;
    top: -15px;
    right: -15px;
    padding: 3px;
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    border: 1px solid var(--border-badge);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #0DA4E4), color-stop(1, #24ACE7));
    background: -moz-linear-gradient(top, #0DA4E4 5%, #24ACE7 100%);
    background: -webkit-linear-gradient(top, #0DA4E4 5%, #24ACE7 100%);
    background: -o-linear-gradient(top, #0DA4E4 5%, #24ACE7 100%);
    background: -ms-linear-gradient(top, #0DA4E4 5%, #24ACE7 100%);
    background: linear-gradient(to bottom, #0DA4E4 5%, #24ACE7 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0DA4E4', endColorstr='#24ACE7',GradientType=0);
    background-color: #0DA4E4;
    color: var(--font-color-badge);
    min-width: 24px;
    min-height: 24px;
    text-align: center;
    line-height: 24px;
    border-radius: 1em;
    box-shadow: 0 0 3px #333;
}

.badge2 {
    position: relative;
    z-index: 1;
}

.badge2[data-badge]:after {
    content: attr(data-badge);
    position: absolute;
    z-index: 1;
    top: -40px;
    right: -60px;
    font-family: Roboto Condensed, sans-serif;
    font-size: 1.0em;
    border: 1px solid white;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #599bb3), color-stop(1, #408c99));
    background: -moz-linear-gradient(top, #599bb3 5%, #408c99 100%);
    background: -webkit-linear-gradient(top, #599bb3 5%, #408c99 100%);
    background: -o-linear-gradient(top, #599bb3 5%, #408c99 100%);
    background: -ms-linear-gradient(top, #599bb3 5%, #408c99 100%);
    background: linear-gradient(to bottom, #599bb3 5%, #408c99 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#599bb3', endColorstr='#408c99',GradientType=0);
    background-color: #599bb3;
    color: var(--font-color-badge);
    min-width: 34px;
    height: 34px;
    text-align: center;
    line-height: 38px;
    border-radius: 50%;
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.badgefertig {
    position: relative;
    z-index: 1;
}

.badgefertig[data-badge]:after {
    content: attr(data-badge);
    position: absolute;
    z-index: 1;
    top: -23px;
    right: -18px;
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-image: url(../success-icon32.png);
    min-width: 28px;
    height: 24px;
    text-align: center;
    line-height: 29px;
}

.ribbon {
    position: absolute;
    right: -5px;
    top: -5px;
    z-index: 1;
    overflow: hidden;
    width: 75px;
    height: 75px;
    text-align: right;
}

.ribbon span {
    font-size: 1em;
    font-weight: bold;
    color: #FFF;
    text-transform: uppercase;
    text-align: center;
    line-height: 20px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    width: 100px;
    display: block;
    background: #79A70A;
    background: linear-gradient(#F79E05 0%, #8F5408 100%);
    box shadow: 0 3px 1em -5px rgba(0, 0, 0, 1);
    position: absolute;
    top: 19px;
    right: -21px;
}

.ribbon span::before {
    content: "";
    position: absolute;
    left: 0px;
    top: 100%;
    z-index: -1;
    border-left: 3px solid #8F5408;
    border-right: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-top: 3px solid #8F5408;
}

.ribbon span::after {
    content: "";
    position: absolute;
    right: 0px;
    top: 100%;
    z-index: -1;
    border-left: 3px solid transparent;
    border-right: 3px solid #8F5408;
    border-bottom: 3px solid transparent;
    border-top: 3px solid #8F5408;
}

.flipswitch {
    position: relative;
    width: 56px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.flipswitch input[type=checkbox] {
    display: none;
}

.flipswitch-label {
    display: block;
    overflow: hidden;
    cursor: pointer;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    behavior: url(border-radius.htc);
    border: 1px solid #cfcfcf;
    -webkit-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    -moz-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
}

.flipswitch-inner {
    width: 200%;
    margin-left: -100%;
    -webkit-transition: margin 0.3s ease-in 0s;
    -moz-transition: margin 0.3s ease-in 0s;
    -ms-transition: margin 0.3s ease-in 0s;
    -o-transition: margin 0.3s ease-in 0s;
    transition: margin 0.3s ease-in 0s;
}

.flipswitch-inner:before, .flipswitch-inner:after {
    float: left;
    width: 50%;
    height: 23px;
    line-height: 23px;
    font-size: 1em;
    font-weight: normal;
    color: white;
    font-family: Roboto Condensed, sans-serif;
    padding: 2px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.flipswitch-inner:before {
    content: "ja";
    padding-left: 5px;
    background-color: var(--bg-color-flipswitch);
    color: #FFFFFF;
}

.flipswitch-inner:after {
    content: "nein";
    padding-right: 5px;
    color: var(--font-color-input);
    text-align: right;
}

.flipswitch-switch {
    width: 18px;
    margin: 2.5px;
    background: #FFFFFF;
    border: 1px solid #999999;
    border-radius: 2px;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 32px;
    -webkit-transition: all 0.3s ease-in 0s;
    -moz-transition: all 0.3s ease-in 0s;
    -ms-transition: all 0.3s ease-in 0s;
    -o-transition: all 0.3s ease-in 0s;
    transition: all 0.3s ease-in 0s;
}

.flipswitch-cb:checked + .flipswitch-label .flipswitch-inner {
    margin-left: 0;
}

.flipswitch-cb:checked + .flipswitch-label .flipswitch-switch {
    right: 0;
}

.small {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #010000;
    font-weight: normal;
}

.normal {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #010000;
    font-weight: normal;
}

.header {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #002F5E;
    font-weight: bold;
}

.paraheader {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #010000;
    font-weight: bold;
    line-height: 14pt;
}

.teaserheader {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #010000;
    font-weight: bold;
}

P {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #010000;
    font-weight: normal;
    line-height: 14pt;
}

table {
    background-color: var(--bg-color-table-aussen);
}

table.transparent {
    background-color: red;
}

table.workcenter {
    background-color: var(--bg-color-abgerundet_zelle2);
}

table.aussen, table.aussen-rot {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: var(--bg-color-table-aussen);
    margin-top: 3px;
    border: 0px solid #cfcfcf;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

table.aussen-rot {
    background-color: var(--bg-color-table-aussen-rot);
}

@media only screen and (max-width: 94rem) {
         /* von 91 auf 94 wegen Umbruch auf Ipad */
    table.aussen {
        display: -webkit-box;
        display: -moz-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: justify;
        -moz-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
}

tr.Liste1 td.zelle12, tr.Liste1 td.zelle13, tr.Liste1 td.zelle13tour {
    background: var(--bg-color-tr-Liste1) !important;
}

tr.Liste2 td.zelle12, tr.Liste2 td.zelle13, tr.Liste2 td.zelle13tour {
    background: var(--bg-color-tr-Liste2) !important;
}

tr.Liste3 td.zelle12, tr.Liste3 td.zelle13, tr.Liste3 td.zelle13tour {
    background: var(--bg-color-tr-Liste3) !important;
}

tr.Liste4 td.zelle12, tr.Liste4 td.zelle13, tr.Liste4 td.zelle13tour {
    background: var(--bg-color-tr-Liste4) !important;
}

tr.Liste1:hover td.zelle12, tr.Liste1:hover td.zelle13, tr.Liste1:hover td.zelle13tour {
    background: var(--bg-color-tr-Liste1-hover) !important;
}

tr.Liste2:hover td.zelle12, tr.Liste2:hover td.zelle13, tr.Liste2:hover td.zelle13tour {
    background: var(--bg-color-tr-Liste2-hover) !important;
}

tr.Liste3:hover td.zelle12, tr.Liste3:hover td.zelle13, tr.Liste3:hover td.zelle13tour {
    background: var(--bg-color-tr-Liste3-hover) !important;
}

tr.Liste4:hover td.zelle12, tr.Liste4:hover td.zelle13, tr.Liste4:hover td.zelle13tour {
    background: var(--bg-color-tr-Liste4-hover) !important;
}

td.cell {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
    font-weight: normal;
}

td.headercell {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #010000;
    font-weight: bold;
}

INPUT.search {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-Color=#ffffff;
    BORDER: #000000 1 solid;
    width: 135px;
    background-image: url(../search-icon16.png);
    background-width: 1em;
    background-repeat: no-repeat;
    background-position: right;
}

strong {
    background: #71b8bc;
    padding: 2px;
}

td {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
}

.rpclist, .rpclistbold, .rpclistlight {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    font-weight: normal;
    color: var(--font-color-rpc-list);
    background-color: var(--bg-color-rpc-list);
    border: 1px solid var(--border-rpc-list);
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */;
}

.rpclistbold {
    border: 1px solid var(--border-rpc-list-bold);
}

.rpclistlight {
    border: 1px solid var(--border-rpc-list);
    font-size: 0.8em;
}

.rpclist_neu {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    font-weight: normal;
    padding: 5px;
    color: var(--font-color-rpc-list);
    background-color: var(--bg-color-rpc-list);
    border: 1px solid var(--border-rpc-list);
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */;
}

.rpclist_neu:hover, .rpclist_neu_rechts:hover {
    background-color: #659CD8;
}

.abgerundet_zelle2, .abgerundet_zelle2_transparent {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
    border: 0px solid #cfcfcf;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle2:hover {
    -webkit-box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle2_transparent {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
    opacity: 0.5;
    filter: alpha(opacity=65);
    /* For IE8 and earlier */;
}

.abgerundet_zelle2_dashboard {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1.2em;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-kachel);
    border: 0px solid #cfcfcf;
    min-width: 14rem;
    max-width: 14rem;
    padding: 0px;
    padding-top: 0px;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle2_dashboard a {
    text-decoration: none;
    font-weight: normal;
}

.abgerundet_zelle2_dashboard a:hover {
    color: #0FA5E4;
}

.abgerundet_zelle2_dashboard:hover {
    -webkit-box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle2_dashboard img {
    float: top;
    margin: 5px;
    max-height: 2em;
    max-width: 2em;
}

.abgerundet_zelle2_dashboard_hinweis {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1.2em;
    background: -moz-linear-gradient(top, #B3D9FF 0%, #0074E8 100%);
    background: -webkit-linear-gradient(top, #B3D9FF 0%, #0074E8 100%);
    background: -ms-linear-gradient(top, #B3D9FF 0%, #0074E8 100%);
    background: linear-gradient(top, #B3D9FF 0%, #0074E8 100%);
    border: 0px solid #0074E8;
    min-width: 14rem;
    max-width: 14rem;
    padding: 0px;
    padding-top: 0px;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle2_dashboard_hinweis:hover {
    -webkit-box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle4_dashboard {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1.2em;
    background-image: url(../Systembilder/stripered_grau.png);
    border: 0px solid #cfcfcf;
    min-width: 14rem;
    max-width: 14rem;
    padding: 0px;
    padding-top: 0px;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle4_dashboard:hover {
    -webkit-box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle2_optional {
    background-color: #FFFFFF;
    border: 0px solid #cfcfcf;
    border-right: 0.1em solid #B0B0B0;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle2_optional:hover {
    -webkit-box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle2_hervorgehoben {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: var(--bg-color-abgerundet_zelle2);
    border: 0px solid #cfcfcf;
    border-left: 0.25em solid #1A9AD0;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    animation: shockwave .5s ease;
    transition: all .25s ease;
    -webkit-transition: all .25s ease;
}

@keyframes shockwave {
    0% {
        transform: scale(1);
        box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    }

    95% {
        box-shadow: 0 0 5px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    }

    100% {
        transform: scale(1.05);
    }
}

.abgerundet_zelle2_hervorgehoben:hover {
    -webkit-box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.zelle2_labeled {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: var(--bg-color-abgerundet_zelle2);
    border: 0px solid #cfcfcf;
    border-left: 0.25em solid #B0B0B0;
    padding: 0px;
}

.zelle2_labeled_transparent {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: var(--bg-color-abgerundet_zelle2);
    border: 0px solid #cfcfcf;
    border-left: 0.25em solid #B0B0B0;
    padding: 0px;
    opacity: 0.5;
    filter: alpha(opacity=65);
}

.zelle2_labeled_blau {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: var(--bg-color-abgerundet_zelle2);
    border: 0px solid #cfcfcf;
    border-left: 0.25em solid #0080FF;
    padding: 0px;
}

.zelle2_labeled_blau_transparent {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: var(--bg-color-abgerundet_zelle2);
    border: 0px solid #cfcfcf;
    border-left: 0.25em solid #0080FF;
    padding: 0px;
    opacity: 0.5;
    filter: alpha(opacity=65);
}

.abgerundet_zelle2_labeled {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
    border: 0px solid #cfcfcf;
    border-left: 0.25em solid #B0B0B0;
    padding: 0px;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle2_labeled_blau {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
    border: 0px solid #cfcfcf;
    border-left: 0.25em solid #0080FF;
    padding: 0px;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.labeled {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #FFFFFF;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    float: left;
    margin-right: 4px;
    background-color: #B0B0B0;
    padding: 2px;
    text-align: center;
}

.labeled_transparent {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #FFFFFF;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    float: left;
    margin-right: 4px;
    padding: 2px;
    text-align: center;
}

.labeled_blau {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #FFFFFF;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    float: left;
    margin-right: 4px;
    background-color: #1695D4;
    padding: 2px;
    text-align: center;
}

.labeled_gruen {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #FFFFFF;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    float: left;
    margin-right: 4px;
    background-color: #59AD33;
    padding: 2px;
    text-align: center;
}

.labeled_dashboard {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    font-weight: bolder;
    color: #000000;
    background-color: #B3D9FF;
    padding: 2px;
    text-align: center;
}

.labeled_dashboard_gold {
    margin-top: 0px;
    /*width: 100%;*/
    background-color: #B0A279;
    padding: 3px;
    text-align: center;
    -moz-border-top-right-radius: 3px;
    /* Firefox */
    -webkit-border-top-right-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-top-right-radius: 3px;
    /* Konqueror */
    border-top-right-radius: 3px;
    /* CSS3 */
    -moz-border-top-left-radius: 3px;
    /* Firefox */
    -webkit-border-top-left-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-top-left-radius: 3px;
    /* Konqueror */
    border-top-left-radius: 3px;
    /* CSS3 */;
}

.labeled_dashboard_rot {
    margin-top: 0px;
    /*width: 100%;*/
    background-color: #EE8277;
    padding: 3px;
    text-align: center;
    -moz-border-top-right-radius: 3px;
    /* Firefox */
    -webkit-border-top-right-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-top-right-radius: 3px;
    /* Konqueror */
    border-top-right-radius: 3px;
    /* CSS3 */
    -moz-border-top-left-radius: 3px;
    /* Firefox */
    -webkit-border-top-left-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-top-left-radius: 3px;
    /* Konqueror */
    border-top-left-radius: 3px;
    /* CSS3 */;
}

.labeled_dashboard_gelb {
    margin-top: 0px;
    /*width: 100%;*/
    background-color: #F5D657;
    padding: 3px;
    text-align: center;
    -moz-border-top-right-radius: 3px;
    /* Firefox */
    -webkit-border-top-right-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-top-right-radius: 3px;
    /* Konqueror */
    border-top-right-radius: 3px;
    /* CSS3 */
    -moz-border-top-left-radius: 3px;
    /* Firefox */
    -webkit-border-top-left-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-top-left-radius: 3px;
    /* Konqueror */
    border-top-left-radius: 3px;
    /* CSS3 */;
}

.labeled_dashboard_gruen {
    margin-top: 0px;
    /*width: 100%;*/
    background-color: #5CBDAA;
    padding: 3px;
    text-align: center;
    -moz-border-top-right-radius: 3px;
    /* Firefox */
    -webkit-border-top-right-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-top-right-radius: 3px;
    /* Konqueror */
    border-top-right-radius: 3px;
    /* CSS3 */
    -moz-border-top-left-radius: 3px;
    /* Firefox */
    -webkit-border-top-left-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-top-left-radius: 3px;
    /* Konqueror */
    border-top-left-radius: 3px;
    /* CSS3 */;
}

.labeled_dashboard_blau {
    margin-top: 0px;
    /*width: 100%;*/
    background-color: #6AA6CE;
    padding: 3px;
    text-align: center;
    -moz-border-top-right-radius: 3px;
    /* Firefox */
    -webkit-border-top-right-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-top-right-radius: 3px;
    /* Konqueror */
    border-top-right-radius: 3px;
    /* CSS3 */
    -moz-border-top-left-radius: 3px;
    /* Firefox */
    -webkit-border-top-left-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-top-left-radius: 3px;
    /* Konqueror */
    border-top-left-radius: 3px;
    /* CSS3 */;
}

.labeled_dashboard_dunkelblau {
    margin-top: 0px;
    /*width: 100%;*/
    background-color: #71808F;
    padding: 3px;
    text-align: center;
    -moz-border-top-right-radius: 3px;
    /* Firefox */
    -webkit-border-top-right-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-top-right-radius: 3px;
    /* Konqueror */
    border-top-right-radius: 3px;
    /* CSS3 */
    -moz-border-top-left-radius: 3px;
    /* Firefox */
    -webkit-border-top-left-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-top-left-radius: 3px;
    /* Konqueror */
    border-top-left-radius: 3px;
    /* CSS3 */;
}

.labeled_dashboard_circle {
    font-size: 0.6em;
    font-weight: light;
    color: #777777;
    float: right;
    padding: 0px;
}

.labeled_dashboard_anlegen {
    font-size: 0.6em;
    font-weight: light;
    color: #777777;
    float: left;
    background-color: #59AD33;
    padding: 5px;
    margin-top: 0px;
    text-align: center;
    border-top-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

.labeled_dashboard_anlegen_kopf {
    font-size: 0.8em;
    font-weight: light;
    color: #FFFFFF;
    float: right;
    background-color: #59AD33;
    padding: 3px;
    margin-top: 0px;
    text-align: center;
    border-radius: 3px;
}

.labeled_dashboard_anlegen {
    color: var(--font-color-kachel);
    float: left;
}

.labeled_dashboard_kopf {
    font-size: 0.8em;
    font-weight: light;
    color: #777777;
    float: right;
    background-color: #575757;
    padding: 3px;
    margin-top: 0px;
    text-align: center;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */;
}

.labeled_dashboard_kopf_transparent {
    font-size: 0.8em;
    font-weight: light;
    float: right;
    padding: 3px;
    margin-top: 0px;
    text-align: center;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */;
}

.labeled_dashboard_anlegen_voll {
    font-size: 0.6em;
    font-weight: light;
    color: #777777;
    float: left;
    background-color: #59AD33;
    max-width: 100%;
    min-width: 100%;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-top: 0px;
    text-align: center;
    -moz-border-bottom-left-radius: 3px;
    /* Firefox */
    -webkit-border-bottom-left-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-bottom-left-radius: 3px;
    /* Konqueror */
    border-bottom-left-radius: 3px;
    /* CSS3 */
    -moz-border-bottom-right-radius: 3px;
    /* Firefox */
    -webkit-border-bottom-right-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-bottom-right-radius: 3px;
    /* Konqueror */
    border-bottom-right-radius: 3px;
    /* CSS3 */;
}

.labeled_dashboard_bearbeiten {
    font-size: 0.6em;
    font-weight: light;
    color: #777777;
    float: right;
    background-color: #1695D4;
    padding: 5px;
    margin-top: 0px;
    text-align: center;
    -moz-border-top-left-radius: 3px;
        /* Firefox */
    -webkit-border-top-left-radius: 3px;
        /* Safari, Chrome */
    -khtml-border-top-left-radius: 3px;
        /* Konqueror */
    border-top-left-radius: 3px;
        /* CSS3 */
    -moz-border-bottom-right-radius: 3px;
    /* Firefox */
    -webkit-border-bottom-right-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-bottom-right-radius: 3px;
    /* Konqueror */
    border-bottom-right-radius: 3px;
    /* CSS3 */;
}

.labeled_dashboard_anlegen a:hover, .labeled_dashboard_bearbeiten a:hover {
    color: #000000;
}

.abgerundet_zelle2_workcenter {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: #FFFFFF;
    border: 0px solid #cfcfcf;
    padding: 0px;
    vertical-align: top;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.zelle_inhalt_workcenter {
    float: left;
}

.zelle2_success {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-image: linear-gradient(to bottom, var(--bg-color-zelle_success-verlauf-start) 0%, var(--bg-color-zelle_success-verlauf-ende) 100%);
    background-repeat: repeat-x;
    border: 1px solid var(--border-success);
    border-left: 0.25em solid var(--border-success);
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle2_success {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-image: linear-gradient(to bottom, var(--bg-color-zelle_success-verlauf-start) 0%, var(--bg-color-zelle_success-verlauf-ende) 100%);
    background-repeat: repeat-x;
    border: 1px solid var(--border-success);
    border-left: 0.25em solid var(--border-success);
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.zelle2_hinweis {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-image: linear-gradient(to bottom, var(--bg-color-zelle_hinweis-verlauf-start) 0%, var(--bg-color-zelle_hinweis-verlauf-ende) 100%);
    border: 1px solid #0074E8;
    border-left: 0.25em solid #0074E8;
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle2_hinweis {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-image: linear-gradient(to bottom, var(--bg-color-zelle_hinweis-verlauf-start) 0%, var(--bg-color-zelle_hinweis-verlauf-ende) 100%);
    border: 0px solid #0074E8;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle2_danger {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-image: linear-gradient(to bottom, var(--bg-color-zelle_danger-verlauf-start) 0%, var(--bg-color-zelle_danger-verlauf-ende) 100%);
    background-repeat: repeat-x;
    border: 1px solid var(--border-danger);
    border-left: 0.25em solid var(--border-danger);
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle2_danger_halb {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-image: linear-gradient(to bottom, var(--bg-color-zelle_danger-halb-verlauf-start) 0%, var(--bg-color-zelle_danger-halb-verlauf-ende) 100%);
    background-repeat: repeat-x;
    border: 1px solid var(--border-danger-halb);
    border-left: 0.25em solid var(--border-danger-halb);
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.zelle2_danger {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-image: linear-gradient(to bottom, var(--bg-color-zelle_danger-verlauf-start) 0%, var(--bg-color-zelle_danger-verlauf-ende) 100%);
    background-repeat: repeat-x;
    border: 1px solid var(--border-danger);
    border-left: 0.25em solid var(--border-danger);
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle2_warnung {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-image: linear-gradient(to bottom, var(--bg-color-zelle_warnung-verlauf-start) 0%, var(--bg-color-zelle_warnung-verlauf-ende) 100%);
    background-repeat: repeat-x;
    border: 0px solid var(--border-warnung);
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.zelle2_warnung {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-image: linear-gradient(to bottom, var(--bg-color-zelle_warnung-verlauf-start) 0%, var(--bg-color-zelle_warnung-verlauf-ende) 100%);
    background-repeat: repeat-x;
    border: 1px solid var(--border-warnung);
    border-left: 0.25em solid var(--border-warnung);
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.zelle2_tipp {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-image: linear-gradient(to bottom, var(--bg-color-zelle2_tipp-verlauf-start) 0%, var(--bg-color-zelle2_tipp-verlauf-ende) 100%);
    background-repeat: repeat-x;
    border: 1px solid #0074E8;
    border-left: 0.25em solid #0074E8;
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle3 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: #FFFF80;
    border: 0px solid #cfcfcf;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle4 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-image: url(../Systembilder/stripered_grau.png);
    border: 0px solid #cfcfcf;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle5 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: #FFFFFF;
    border: 0px solid #cccccc;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 1em -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 1em -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 1em -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle6 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    font-weight: bold;
    background-color: #FFFFFF;
    border: 0px solid #cfcfcf;
    padding: 0px;
    vertical-align: top;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

input, textarea {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-input);
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    behavior: url(border-radius.htc);
    border: 1px solid var(--border-input);
    padding: 3px;
    background: var(--bg-color-input);
    transition: all .25s;
}

input[type=checkbox] {
    cursor: pointer;
/* Double-sized Checkboxes */
    -ms-transform: scale(1.2);
 /* IE */
    -moz-transform: scale(1.2);
 /* FF */
    -webkit-transform: scale(1.2);
 /* Safari and Chrome */
    -o-transform: scale(1.2);
 /* Opera */
    padding: 5px;
}

input[type=radio] {
    cursor: pointer;
/* background-color: #FF0000; */
/* Double-sized Checkboxes */
    -ms-transform: scale(1.2);
 /* IE */
    -moz-transform: scale(1.2);
 /* FF */
    -webkit-transform: scale(1.2);
 /* Safari and Chrome */
    -o-transform: scale(1.2);
 /* Opera */
    padding: 5px;
}

/* eigene Checkbox */
.custom_checkbox input[type="checkbox"] {
    display: none;
}

.custom_checkbox input[type="checkbox"] + label {
    cursor: pointer;
    color: var(--font-color-checkbox-label);
    font-size: 1em;
}

.custom_checkbox:hover input[type="checkbox"] + label:before {
    background-color: var(--bg-color-checkbox-hover);
}

.custom_checkbox input[type="checkbox"]:checked + label {
    cursor: pointer;
    color: #1A9AD0;
    font-size: 1em;
    font-weight: bold;
}

.custom_checkbox input[type="checkbox"] + label:before {
    background-color: var(--bg-color-checkbox);
    height: 15px;
    border: 1px solid #60C2EB;
    content: " ";
    display: inline-block;
    width: 15px;
    vertical-align: middle;
    margin-right: 10px;
    position: relative;
    top: -1px;
    border-radius: 2px;
}

.custom_checkbox input[type="checkbox"]:checked + label:before {
    background-color: #1A9AD0;
    display: inline-block;
    content: "\2713";
    color: #FFFFFF;
    font-size: 0.75em;
    text-align: center;
    line-height: 1.4em;
}

/* eigene Checkbox klein */
.custom_checkbox_klein input[type="checkbox"] {
    display: none;
}

.custom_checkbox_klein input[type="checkbox"] + label {
    cursor: pointer;
    color: var(--font-color-checkbox-label);
    font-size: 0.75em;
}

.custom_checkbox_klein:hover input[type="checkbox"] + label:before {
    background-color: var(--bg-color-checkbox-hover);
}

.custom_checkbox_klein input[type="checkbox"]:checked + label {
    cursor: pointer;
    color: #1A9AD0;
    font-size: 0.75em;
    font-weight: bold;
}

.custom_checkbox_klein input[type="checkbox"] + label:before {
    background: var(--bg-color-checkbox);
    height: 10px;
    border: 1px solid #60C2EB;
    content: " ";
    display: inline-block;
    width: 10px;
    vertical-align: middle;
    margin-right: 10px;
    position: relative;
    top: -1px;
    border-radius: 2px;
}

.custom_checkbox_klein input[type="checkbox"]:checked + label:before {
    background-color: #1A9AD0;
    display: inline-block;
    content: "\2713";
    color: #FFFFFF;
    font-size: 0.75em;
    text-align: center;
    line-height: 1.4em;
}

/* eigene Checkbox groß */
.custom_checkbox_gross input[type="checkbox"], .custom_checkbox_gross_EQ input[type="checkbox"], .custom_checkbox_gross_AR input[type="checkbox"] {
    display: none;
}

.custom_checkbox_gross input[type="checkbox"] + label, .custom_checkbox_gross_EQ input[type="checkbox"] + label, .custom_checkbox_gross_AR input[type="checkbox"] + label {
    cursor: pointer;
    color: var(--font-color);
    font-size: 1.0em;
}

.custom_checkbox_gross_EQ input[type="checkbox"] + label, .custom_checkbox_gross_AR input[type="checkbox"] + label {
    float: right;
    color: var(--font-color);

}

.custom_checkbox_gross:hover input[type="checkbox"] + label:before, .custom_checkbox_gross_EQ:hover input[type="checkbox"] + label:before, .custom_checkbox_gross_AR:hover input[type="checkbox"] + label:before {
    background-color: var(--bg-color-checkbox-hover);
}

.custom_checkbox_gross input[type="checkbox"]:checked + label, .custom_checkbox_gross_EQ input[type="checkbox"]:checked + label, .custom_checkbox_gross_AR input[type="checkbox"]:checked + label {
    cursor: pointer;
    color: #1A9AD0;
    font-size: 1.0em;
    font-weight: bold;
}

.custom_checkbox_gross input[type="checkbox"] + label:before, .custom_checkbox_gross_EQ input[type="checkbox"] + label:before, .custom_checkbox_gross_AR input[type="checkbox"] + label:before {
    background: var(--bg-color-checkbox);
    height: 2.0em;
    border: 1px solid #60C2EB;
    content: " ";
    display: inline-block;
    width: 2.0em;
    vertical-align: middle;
    margin-right: 10px;
    margin-left: 10px;
    position: relative;
    top: -1px;
    border-radius: 2px;
}

.custom_checkbox_gross_EQ input[type="checkbox"] + label:before, .custom_checkbox_gross_AR input[type="checkbox"] + label:before {
    height: 1.5em;
    width: 1.5em;
    vertical-align: middle;
    margin-right: 5px;
    margin-left: 5px;
}

.custom_checkbox_gross input[type="checkbox"]:checked + label:before, .custom_checkbox_gross_EQ input[type="checkbox"]:checked + label:before, .custom_checkbox_gross_AR input[type="checkbox"]:checked + label:before {
    background-color: #1A9AD0;
    display: inline-block;
    content: "\2713";
    color: #FFFFFF;
    font-size: 1.0em;
    text-align: center;
    line-height: 2.0em;
}

.custom_checkbox_gross_EQ input[type="checkbox"]:checked + label:before, .custom_checkbox_gross_AR input[type="checkbox"]:checked + label:before {
    line-height: 1.5em;
}


/* eigener Radiobutton */
.custom_radio input[type="radio"], .custom_radio_grauer_hintergrund input[type="radio"] {
    display: none;
}

.custom_radio input[type="radio"] + label, .custom_radio_grauer_hintergrund input[type="radio"] + label {
    cursor: pointer;
    color: var(--font-color-checkbox-label);
    font-size: 1em;
}

.custom_radio_grauer_hintergrund input[type="radio"] + label {
    color: black;
}

.custom_radio:hover input[type="radio"] + label:before, .custom_radio_grauer_hintergrund:hover input[type="radio"] + label:before {
    background-color: var(--bg-color-checkbox-hover);
}

.custom_radio input[type="radio"]:checked + label, .custom_radio_grauer_hintergrund input[type="radio"]:checked + label {
    cursor: pointer;
    color: #1A9AD0;
    font-size: 1em;
    font-weight: bold;
}

.custom_radio input[type="radio"] + label:before, .custom_radio_grauer_hintergrund input[type="radio"] + label:before {
    background: var(--bg-color-checkbox);
    height: 15px;
    border: 1px solid #60C2EB;
    content: " ";
    display: inline-block;
    width: 15px;
    vertical-align: middle;
    margin-right: 10px;
    position: relative;
    top: -1px;
    border-radius: 50%;
}

.custom_radio input[type="radio"]:checked + label:before, .custom_radio_grauer_hintergrund input[type="radio"]:checked + label:before {
    background-color: #1A9AD0;
    display: inline-block;
    content: "\2713";
    color: #FFFFFF;
    font-size: 0.75em;
    text-align: center;
    line-height: 1.4em;
}

/* eigener Radiobutton klein */
.custom_radio_klein input[type="radio"] {
    display: none;
}

.custom_radio_klein input[type="radio"] + label {
    cursor: pointer;
    color: var(--font-color-checkbox-label);
    font-size: 0.75em;
}

.custom_radio_klein:hover input[type="radio"] + label:before {
    background-color: var(--bg-color-checkbox-hover);
}

.custom_radio_klein input[type="radio"]:checked + label {
    cursor: pointer;
    color: #1A9AD0;
    font-size: 0.75em;
    font-weight: bold;
}

.custom_radio_klein input[type="radio"] + label:before {
    background: var(--bg-color-checkbox);
    height: 10px;
    border: 1px solid #60C2EB;
    content: " ";
    display: inline-block;
    width: 10px;
    vertical-align: middle;
    margin-right: 10px;
    position: relative;
    top: -1px;
    border-radius: 50%;
}

.custom_radio_klein input[type="radio"]:checked + label:before {
    background-color: #1A9AD0;
    display: inline-block;
    content: "\2713";
    color: #FFFFFF;
    font-size: 0.75em;
    text-align: center;
    line-height: 1.4em;
}

input[type=range] {
    border: 1px solid #71B8FF;
    height: 1em;
}

input.pflicht {
    border: 1px solid #71B8FF;
}

input:required {
    border-color: red;
}

input:required:valid {
    border-color: #71B8FF;
}

input:invalid {
    border-color: red;
}

input[type=submit], .buttonanmelden {
    font-size: 1em;
    font-weight: bold;
    border: 1px solid #F7F7F7;
    background: #7fb378;
    cursor: pointer;
    border-radius: 3px;
    padding: 6px;
    min-height: 2em;
    color: white;
    text-shadow: #000 0px 0px 2px;
    -webkit-font-smoothing: antialiased;
    margin: 0 5px;
    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

input[type=submit].Flexcase {
    background: var(--bg-color-button-blau);
}

input[type=submit]:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
}

input[type=submit].Flexcase:hover {
    background: var(--bg-color-button-blau-hover);
}

input[type=submit]:active {
    position: relative;
    top: 1px;
}

input[type=submit]:focus {
    transform: translateY(-1px);
    box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
}

input[type=submit]:disabled {
    background: var(--bg-color-button-gelb);
    }

input[type=reset] {
    font-size: 1em;
    font-weight: bold;
    border: 1px solid #F7F7F7;
    background: #cf535d;
    cursor: pointer;
    border-radius: 3px;
    padding: 6px;
    min-height: 2em;
    color: white;
    text-shadow: #000 0px 0px 2px;
    -webkit-font-smoothing: antialiased;
    margin: 0 5px;
    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
}

input[type=reset]:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
}

input[type=reset]:active {
    position: relative;
    top: 1px;
}

input[type=reset]:focus {
    transform: translateY(-1px);
    box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
}

input[type=file] {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    font-weight: bold;
    border: 1px solid #ccc;
    display: inline-block;
    padding: 6px;
    cursor: pointer;
}

input[type=file]:hover {
    /* background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed));
    background:-moz-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
    background:-webkit-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
    background:-o-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
    background:-ms-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
    background:linear-gradient(to bottom, #dfdfdf 5%, #ededed 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed',GradientType=0);
    background-color:#dfdfdf;
    */;
}

input[type=file]:active {
    /* position:relative;
    top:1px;
    */;
}

input[type=file]:focus {
    /* background-Color=#EFEFEF;
    outline:0;
    border:1px solid #EFEFEF;
    position:relative;
    top:1px;
    */;
}



input:focus, .input-focus, textarea:focus {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    /*background: #EFEFEF;  rausgenommen weil sonst Submit und Reset beim verlassen völlig weiß waren... 27.05.2019  */
    outline: 0;
    border: 1px solid var(--border-input-focus);
    border-radius: 3px;
    box-shadow: 0px 3px 4px -2px rgba(0,0,115,0.25) inset;
}

textarea:focus {
    background: var(--bg-color-input);
    box-shadow: 0px 3px 4px -2px rgba(0,0,115,0.25) inset;
}

 /*
input[type="password"]:invalid {
    border:1px solid #F9270E;
    background: #FFFF80;
}

input[type="password"]:focus:invalid, .input-focus:invalid {
     border:1px solid #F9270E;
     background: #F0F000;
}

input[type="password"]:valid {
    border:1px solid #008000;
    background: #7fb378;
}

input[type="password"]:focus:valid, .input-focus:valid {
     border:1px solid #008000;
     background: #61A05A;
}
*/

select {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    color: var(--font-color-input-select);
    border: 1px solid var(--border-input);
    padding: 3px;
    background-image: linear-gradient(to bottom, var(--bg-select-verlauf-start) 0%, var(--bg-select-verlauf-ende) 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#dddadada', GradientType=0);
    /* -webkit-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    */
    /* -moz-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    */
    /* box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    */;
}

select:focus, .select-focus {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-Color=#EFEFEF;
    outline: 0;
    border: 1px solid var(--border-input-focus);
}

select.pflicht {
    border: 1px solid #71B8FF;
}

option, optgroup {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    border: 1px solid #cfcfcf;
    padding: 3px;
    line-height: 1.5;
    font-family: Roboto Condensed, sans-serif;
    background-color: var(--bg-color-select-option);
    -webkit-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    -moz-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
}

option:focus {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-Color=#EFEFEF;
    outline: 0;
    border: 1px solid #95D2DF;
    border-radius: 3px;
    -webkit-box-shadow: 0 0 5px 4px rgba(36,184,194, 0.10);
    -moz-box-shadow: 0 0 5px 4px rgba(36,184,194, 0.10);
    box-shadow: 0 0 5px 4px rgba(36,184,194, 0.10);
}

.passiv option {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    font-style: italic;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    border: 1px solid #cfcfcf;
    padding: 3px;
    line-height: 1.5;
    font-family: Roboto Condensed, sans-serif;
    background-color: var(--bg-color-select-option);
    -webkit-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    -moz-box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
    box-shadow: inset 0 0 4px 2px rgba(0,0,0, 0.1);
}





/*
textarea {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-input);
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    behavior:url(border-radius.htc);
    border:1px solid var(--border-input);
    padding:3px;
    background: var(--bg-color-input);
    transition: all .25s;

}


textarea:focus {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background: #efefef;
    outline:0;
    border:1px solid #95D2DF;
    border-radius: 3px;
    transition:box-shadow 1.5s ease;

}
*/

.zelle_blau, .zelle_blau_kopf, .zelle_gruen, .zelle_gruen_kopf, .zelle_gelb, .zelle_gelb_kopf, .zelle_rot, .zelle_rot_kopf {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
}

.zelle_blau {
    background-color: var(--bg-color-zelle_blau);
}

.zelle_blau_kopf {
    background-image: linear-gradient(to bottom, var(--bg-color-zelle_blau-kopf-verlauf-start) 0%, var(--bg-color-zelle_blau-kopf-verlauf-ende) 100%);
    background-repeat: repeat-x;
}

.zelle_gruen {
    background-color: var(--bg-color-zelle_gruen);
}

.zelle_gruen_kopf {
    background-image: linear-gradient(to bottom, var(--bg-color-zelle_gruen-kopf-verlauf-start) 0%, var(--bg-color-zelle_gruen-kopf-verlauf-ende) 100%);
    background-repeat: repeat-x;
}

.zelle_gelb {
    background-color: var(--bg-color-zelle_gelb);
}

.zelle_gelb_kopf {
    background-image: linear-gradient(to bottom, var(--bg-color-zelle_gelb-kopf-verlauf-start) 0%, var(--bg-color-zelle_gelb-kopf-verlauf-ende) 100%);
    background-repeat: repeat-x;
}

.zelle_rot {
    background-color: var(--bg-color-zelle_rot);
}

.zelle_rot_kopf {
    background-image: linear-gradient(to bottom, var(--bg-color-zelle_rot-kopf-verlauf-start) 0%, var(--bg-color-zelle_rot-kopf-verlauf-ende) 100%);
    background-repeat: repeat-x;
}

.zelle1 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: #AFAFAF;
}

.zelle2 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
}

.zelle2_ueberschrift {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: #EBEBEB;
}

.zelle2_ueberschrift_pfeil {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: #EBEBEB;
    background-image: url(../Arrow-Down-icon_alt.png);
    background-size: 1em;
    background-repeat: no-repeat;
    background-position: bottom;
}

.zelle2_glow {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    outline: 0;
    border: 1px solid #95D2DF;
    -webkit-box-shadow: 0 0 5px 4px rgba(36,184,194, 0.10);
    -moz-box-shadow: 0 0 5px 4px rgba(36,184,194, 0.10);
    box-shadow: 0 0 5px 4px rgba(36,184,194, 0.10);
    text-shadow: 0 0 5px #00FF40;
    background-color: #FFFFFF;
}

.zelle2_glow_green {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    font color: #3c763d;
    background-color: var(--bg-color-zelle_glow-green);
    border: 1px solid var(--border-glow-green);
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.zelle2_tief {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: var(--bg-color-zelle2_tief);
    ;
    box-shadow: inset 0.05em 0.05em 0.05em 0.05em var(--bg-zelle2-tief-box-shadow);
}

.zelle2_transparent {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
    opacity: 0.5;
    filter: alpha(opacity=65);
    /* For IE8 and earlier */;
}

.zelle2_komplett_transparent {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    /*background-color: hsla(30,40%,90%,0.8);*/
    /* For IE8 and earlier */;
}

.zelle3 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: #3399CC;
}

.zelle4 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: var(--bg-color-abgerundet_zelle4);
}

.zelle5 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: #C1C1C1;
}

.zelle6 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: #D5D5FF;
}

.zelle7 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 50px;
    background-color: #FFFFFF;
}

.buchenzelle2 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: #FFFFFF;
    float: left;
}

.buchenzelle7 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 10em;
    background-color: #FFFFFF;
    float: top;
}

.zelle8 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 50px;
    background-color: #D5D5FF;
}

.zelle9 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
    /*
    background-image: url(../bg_normal.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    */;
}

.zelle9_hervorgehoben {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
    /*
    background-image: url(../bg_normal.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    */
    border-left: 0.25em solid #B0B0B0;
}

.zelle9a {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
    /*
    background-image: url(../bg_normal.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 5px -1px #333333, 0 1px 7px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 5px -1px #333333, 0 1px 7px -1px #FFFFFF inset;
    box-shadow: 0 0 5px -1px #333333, 0 1px 7px -1px #FFFFFF inset;
}

.zelle9b {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
    /*
    background-image: url(../bg_normal.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    */
    border-radius: 5px 5px 0px 0px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 5px -1px #333333, 0 1px 7px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 5px -1px #333333, 0 1px 7px -1px #FFFFFF inset;
    box-shadow: 0 0 5px -1px #333333, 0 1px 7px -1px #FFFFFF inset;
}

.zelle10 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: #FEF900;
    padding-left: 5px;
}

.zelle11 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: #F9270E;
    padding-left: 5px;
    -webkit-box-shadow: 0 0 5px -1px #333333, 0 1px 7px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 5px -1px #333333, 0 1px 7px -1px #FFFFFF inset;
    box-shadow: 0 0 5px -1px #333333, 0 1px 7px -1px #FFFFFF inset;
}

.zelle12 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    padding: 5px;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
}

.zelle13 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    padding-left: 5px;
}

.abgerundet_zelle13 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    border: 0px solid #cfcfcf;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle14 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-image: url(../96pixel_1pixel_grau.png);
    border: 0px solid #cfcfcf;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle14:hover {
    font-size: 18px;
    color: white;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    position: relative;
    background: #2098D1;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.abgerundet_zelle15 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-image: url(../96pixel_1pixel_blau.png);
    border: 0px solid #cfcfcf;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    font-size: 18px;
    color: white;
}

.abgerundet_zelle16 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-image: url(../72pixel_1pixel_grau.png);
    border: 0px solid #cfcfcf;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.abgerundet_zelle16:hover {
    font-size: 18px;
    color: white;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    position: relative;
    background: #2098D1;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.abgerundet_zelle17 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-image: url(../96pixel_1pixel_blau.png);
    border: 0px solid #cfcfcf;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    font-size: 18px;
    color: white;
}

.abgerundet_zelle2:hover {
    -webkit-box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 6px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    //-webkit-transform: scale(1.01);
    // -ms-transform: scale(1.01);
    // transform: scale(1.01);
}

.zelle13tour, .zelle13projekt {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    border: 0px solid #cfcfcf;
    background-color: var(--bg-color-zelle13-tour);
    padding-left: 5px;
}

.zelle13:first-of-type {
    border-left: 0.15em solid var(--bg-color-abgerundet_zelle2);
}

.zelle13:last-of-type {
    border-right: 0.15em solid var(--bg-color-abgerundet_zelle2);
}

.zelle13tour:first-of-type {
    border-left: 0.15em solid #0080FF;
}

.zelle13tour:last-of-type {
    border-right: 0.15em solid #0080FF;
}

.zelle13projekt:first-of-type {
    border-left: 0.15em solid #8E44AD;
}

.zelle13projekt:last-of-type {
    border-right: 0.15em solid #8E44AD;
}

.zelle14 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
}

.zelleWarnung {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    //background-image: url(../Systembilder/stripered.png);
    background-color: #FFAEAE;
    background-image: linear-gradient(to bottom, #EFEFEF 0%, #FFAEAE 75%, #FFAEAE 100%);
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.zelleCase {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    //background-image: url(../Systembilder/stripered.png);
    border: 5px groove silver;
    background-color: #FFFFFF;
}

.zelleFremd {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: #D9D9FF;
    background-image: url(../Systembilder/external64.png);
    background-size: 64px;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 3px;
    /* CSS3 */
    -webkit-box-shadow: 0 0 3px -1px #9191FF inset;
    -moz-box-shadow: 0 0 3px -1px #9191FF inset;
    box-shadow: 0 0 3px -1px #9191FF inset;
    //background-image: url(../Systembilder/stripered_blau.png);
    //www.stripegenerator.com;
}

.zelledos {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #FEFEFD;
    background-color: #070203;
}

.neuerkopf {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    border: 0px solid #000000;
    color: var(--font-color-neuerkopf);
    background-image: url(../button_bg_4.gif);
}

.neuerkopf_abgerundet {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    border: 0px solid #000000;
    color: var(--font-color-neuerkopf);
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */
    background: #353535;
    background: linear-gradient(#373737, #353535);
    -webkit-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    -moz-box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
    box-shadow: 0 0 3px -1px #333333, 0 1px 2px -1px #FFFFFF inset;
}

.neuerkopf_abgerundet_toggle {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    border: 0px solid silver;
    padding: 1em;
    color: var(--font-color-neuerfeldkopf);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    -moz-border-top-left-radius: 5px;
    /* Firefox */
    -moz-border-top-right-radius: 5px;
    /* Firefox */
    -webkit-border-top-left-radius: 5px;
    /* Safari, Chrome */
    -webkit-border-top-right-radius: 5px;
    /* Safari, Chrome */
    -khtml-border-top-left-radius: 5px;
    /* Konqueror */
    -khtml-border-top-right-radius: 5px;
    /* Konqueror */
    /*border-bottom: 1px solid var(--border-feldkopf-bottom);*/
    background-image: linear-gradient(to bottom, var(--bg-neuerfeldkopf-verlauf-start) 0%, var(--bg-neuerfeldkopf-verlauf-ende) 100%);
    background-repeat: repeat-x;
    -webkit-box-shadow: 0 0 3px -1px var(--bg-neuerfeldkopf-box-shadow-start), 0 1px 2px -1px var(--bg-neuerfeldkopf-box-shadow-ende) inset;
    -moz-box-shadow: 0 0 3px -1px var(--bg-neuerfeldkopf-box-shadow-start), 0 1px 2px -1px var(--bg-neuerfeldkopf-box-shadow-ende) inset;
    box-shadow: 0 0 3px -1px var(--bg-neuerfeldkopf-box-shadow-start), 0 1px 2px -1px var(--bg-neuerfeldkopf-box-shadow-ende) inset;
}

.neuerkopf1 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    border: 0px solid #000000;
    color: #ffffff;
    background-image: url(../button_bg_4.gif);
}

.neuerkopf2 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    border: 0px solid #000000;
    color: #ffffff;
    background-image: url(../nav_buttons_bg.gif);
}

.neuerkopf3 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #ffffff;
    background-image: url(../button_bg_4.gif);
    border: 1px solid #cfcfcf;
    -moz-border-radius: 3px;
    /* Firefox */
    -webkit-border-radius: 3px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px;
    /* Konqueror */
    border-radius: 3px;
    /* CSS3 */;
}

.neuerfeldkopf, .neuerfeldkopf_theader_sticky, .neuerfeldkopf_theader_sticky_2_oben {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    font-weight: bold;
    color: var(--font-color-header);
    padding: var(--padding-header);
    border-bottom: 1px solid var(--border-feldkopf-bottom);
    background-image: linear-gradient(to bottom, var(--bg-feldkopf-verlauf-start) 0%, var(--bg-feldkopf-verlauf-ende) 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#dddadada', GradientType=0);
    box-shadow: 0 1px 0px var(--bg-feldkopf-box-shadow);
}

.neuerfeldkopf_theader_sticky {
    position: sticky;
    top: 3em;
    float: top;
}

.neuerfeldkopf_theader_sticky_2_oben {
    position: sticky;
    top: 6.5em;
    float: top;
}

.neuerfeldkopf_sticky {
    position: sticky;
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    font-weight: bold;
    color: #000000;
    padding: var(--padding-header_sticky);
    top: 150;
    background: white;
}

.neuerfeldkopf_workcenter, .neuerfeldkopf_dokumente, .neuerfeldkopf_technik_buchen, .neuerfeldkopf_technik_sparten {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1.5em;
    font-weight: normal;
    color: var(--font-color-header);
    padding: var(--padding-header);
    text-align: left;
    padding-left: 1rem;
    -moz-border-radius: 3px 3px 0px 0px;
    /* Firefox */
    -webkit-border-radius: 3px 3px 0px 0px;
    /* Safari, Chrome */
    -khtml-border-radius: 3px 3px 0px 0px;
    /* Konqueror */
    border-radius: 3px 3px 0px 0px;
    /* CSS3 */
    border-bottom: 0px solid var(--border-feldkopf-bottom);
    background-image: linear-gradient(to bottom, var(--bg-feldkopf-verlauf-start) 0%, var(--bg-feldkopf-verlauf-ende) 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#dddadada', GradientType=0);
    box-shadow: 0 1px 0px var(--bg-feldkopf-box-shadow);
}

.klebrig {
    position: sticky;
    top: 0px;
    display: flex;
}

.neuerfeldkopf_workcenter form {
    font-size: 1rem;
    float: right;
    margin-right: 1rem;
}

.neuerfeldkopf_technik_buchen {
    font-size: 1em;
    text-align: left;
}

.neuerfeldkopf_technik_sparten {
    float: left;
    width: 100%;
    font-size: 1.25em;
    text-align: left;
}

.neuerfeldkopf_technik_sparten_begriffe {
    float: left;
    cursor: pointer;
    margin-right: 1em;
    text-align: center;
}

.neuerfeldkopf_dokumente {
    font-size: 1em;
    text-align: center;
}

.zeile {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    border: 0px solid #000000;
    color: var(--font-color-zeile);
    background-image: var(--bg-image-zeile);
    background-repeat: no-repeat;
    background-size: cover;
}

.zelleKalenderBestaetigt {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: #C1C1C1;
}

.zelleKalenderAngebot {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #FFFF80;
    background-color: #C1C1C1;
}

.zelleKalenderAbgesagt {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #FF0000;
    background-color: #C1C1C1;
}

.zelleKalenderVormerkung {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #0080FF;
    background-color: #C1C1C1;
}

.zelleKalenderUrlaub {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #FF80FF;
    background-color: #C1C1C1;
}

.zelleKalenderTag {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: #FF80FF;
    border: 1px solid #ffffff;
    background-color: #E0E0E0;
}

/*Kalenderansicht phpcal*/

a.callink:link {
    font-weight: bold;
    text-decoration: none;
}

a.callink:visited {
    font-weight: bold;
    text-decoration: none;
}

a.callink:active {
    font-weight: bold;
    text-decoration: none;
}

a.callink:hover {
    font-weight: bold;
    text-decoration: none;
}

a.calhome:link {
    text-decoration: none;
}

a.calhome:visited {
    text-decoration: none;
}

a.calhome:active {
    text-decoration: none;
}

a.calhome:hover {
    text-decoration: none;
}

td.caltz {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    font-weight: bold;
    color: var(--font-color-header);
    padding: 1px;
    border-bottom: 1px solid var(--border-feldkopf-bottom);
    background-image: linear-gradient(to bottom, var(--bg-feldkopf-verlauf-start) 0%, var(--bg-feldkopf-verlauf-ende) 100%);
    background-repeat: repeat-x;
}

td.calwt {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    font-weight: bold;
    color: var(--font-color-header);
    padding: 1px;
    border-bottom: 1px solid var(--border-feldkopf-bottom);
    background-image: linear-gradient(to bottom, var(--bg-feldkopf-verlauf-start) 0%, var(--bg-feldkopf-verlauf-ende) 100%);
    background-repeat: repeat-x;
}

td.calat {
}

td.calht {
    background-color: #AAAAFF;
}

td.calhe {
    color: #FF0000;
    background-color: #AAAAFF;
}

td.calwe {
    color: #FF0000;
}

td.calverfuegbar {
    background-color: #FFFF00;
}

td.calbesetzt {
    background-color: #FF0000;
}

td.calangebot {
    background-color: #00FFFF;
}

td.calbuchung {
    background-color: #49C5B3;
}

table.caltab {
    width: 160px;
    border: 1px solid grey;
    background-color: var(--bg-color-abgerundet_zelle2);
    padding: 2px;
    margin: 0px;
}

table.caltab1 {
    border: 0px;
    padding: 0px;
    margin: 0px;
}

table.caltab2 {
    border: 0px;
    padding: 0px;
    margin: 0px;
}

button {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    font-weight: bolder;
    background-color: var(--bg-color-button-hell);
    color: var(--font-color-button-hell);
    cursor: pointer;
    border: 1px solid var(--border-button-hell);
    border-radius: 3px;
    padding: 5px 5px;
    min-height: 2em;
    margin: 0 5px;
    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
    display: inline-block;
}

button:hover {
    transform: translateY(-1px);
    background-color: var(--bg-color-button-hell-hover);
    box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
}

button:active {
    position: relative;
    top: 1px;
    background-color: #E3E3E3;
}

button:focus {
    transform: translateY(-1px);
    background-color: #E3E3E3;
    box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
}

.button {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    behavior: url(border-radius.htc);
    border: 1px solid #cfcfcf;
    font-size: 1em;
    font-family: Roboto Condensed, sans-serif;
    border: 1px solid #C1C1C1;
    padding: 5px 5px;
    cursor: pointer;
    -webkit-appearance: none;
}

.button:hover {
    text-decoration: none;
    color: #fff;
}

.less_button {
    background-color: #FFDDDD;
    /* Green */
    width: 100%;
    border: none;
    padding: 5px 5px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    cursor: pointer;
}

.more_button {
    background-color: #DFFFDF;
    /* Green */
    width: 100%;
    border: none;
    padding: 5px 5px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    cursor: pointer;
}

.more_div {
    background-color: #DFFFDF;
    /* Green */
    border: 1px;
    color: black;
    text-decoration: none;
    display: inline-block;
}

button[type=submit], .buttonanmelden {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    /*padding:2px; rausgenommen damit neuer buttonsubmit auch die gleiche Größe erhält wie die übrigen Submit Buttons*/
    cursor: pointer;
    -webkit-appearance: none;
}

.buttonaktiv {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    border: 1px solid #C1C1C1;
    color: #39597b;
    height: 19px;
    padding: 5px;
}

.buttonrot {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    text-decoration: none;
    border-radius: 4px;
    cursor: pointer;
    margin: 5px 0px 5px;
    display: inline-block;
    color: var(--font-color-button-rot);
    padding: 2px;
    background-color: var(--bg-color-button-rot);
}

.buttonrot:hover {
    text-decoration: none;
    color: var(--font-color-button-rot);
    background-color: var(--bg-color-button-rot-hover);
}

.buttongrau, .buttongrau_float_right {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    text-decoration: none;
    background-color: var(--bg-color-button-hell);
    color: var(--font-color-button-hell);
    cursor: pointer;
    border: 1px solid var(--border-button-hell);
    padding: 5px 5px;
    border-radius: 4px;
    margin: 5px 0px 5px;
    display: inline-block;
    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
}

.buttongrau:hover, .buttongrau_float_right:hover {
    text-decoration: none;
    background-color: #B2B2B2;
 /* 3 Stufen dunkler */
    color: #fff;
    box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
}

.buttongrau_float_right {
    float: right;
}

.buttonblau {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    text-decoration: none;
    background-color: var(--bg-color-button-blau);
    padding: 5px 5px;
    color: var(--font-color-button-blau);
    text-shadow: #000 0px 0px 2px;
    -webkit-font-smoothing: antialiased;
    border-radius: 4px;
    cursor: pointer;
    margin: 5px 0px 5px;
    display: inline-block;
}

.buttonblau:hover {
    text-decoration: none;
    background-color: var(--bg-color-button-blau-hover);
 /* 3 Stufen dunkler */
    color: var(--font-color-button-hell);
}

.buttongruen {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    text-decoration: none;
    background-color: var(--bg-color-button-gruen);
    padding: 5px 5px;
    color: var(--font-color-button-gruen);
    text-shadow: #000 0px 0px 2px;
    -webkit-font-smoothing: antialiased;
    border-radius: 4px;
    cursor: pointer;
    margin: 5px 0px 5px;
    display: inline-block;
    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
    -webkit-appearance: none;
}



.buttonsubmit {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    font-weight: bold;
    border: 1px solid #F7F7F7;
    background: var(--bg-color-button-gruen);
    cursor: pointer;
    border-radius: 3px;
    padding: 6px;
    min-height: 2em;
    color: fff;
    text-shadow: #000 0px 0px 2px;
    -webkit-font-smoothing: antialiased;
    margin: 0 5px;
    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.buttongruen:hover, .buttonsubmit:hover {
    text-decoration: none;
    background-color:var(--bg-color-button-gruen-hover);
    color: var(--font-color-button-gruen);
    box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
}

.buttongelb {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    text-decoration: none;
    background-color: var(--bg-color-button-gelb);
    padding: 5px 5px;
    color: var(--font-color-button-gelb);
    text-shadow: #CC9900 0px 0px 2px;
    -webkit-font-smoothing: antialiased;
    border-radius: 4px;
    cursor: pointer;
    margin: 5px 0px 5px;
    display: inline-block;
    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
}

.buttongelb:hover {
    text-decoration: none;
    background-color: var(--bg-color-button-gelb-hover);
    color: var(--font-color-button-gelb);
    box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
}



.buttonplus {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    text-decoration: none;
    background-color: #59AD33;
    padding: 6px 6px;
    color: var(--font-color-button-plus);
    text-shadow: #000 0px 0px 2px;
    -webkit-font-smoothing: antialiased;
    border-radius: 4px;
    cursor: pointer;
    margin: 5px 0px 5px;
    display: inline-block;
    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
    -webkit-appearance: none;
}

.button-plusmenue {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    text-decoration: none;
    background-color: #59AD33;
    padding: 0px 6px;
    color: var(--font-color-button-hell);
    text-shadow: #000 0px 0px 2px;
    -webkit-font-smoothing: antialiased;
    border-radius: 4px;
    cursor: pointer;
    margin: 3px 2px 3px;
    display: inline-block;
    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
    -webkit-appearance: none;
}

.buttonplus:hover, .buttonplus-menue:hover {
    text-decoration: none;
    background-color: #529D2F;
    box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
}

.buttonsubmenue, .buttoniconblau {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    text-decoration: none;
    vertical-align: middle;
    height: 28px;
    padding: 5px 5px;
    border-radius: 4px;
    cursor: pointer;
    margin: 5px 0px 5px;
    display: inline-block;
    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
}

.buttonsubmenue {
    background-color: var(--bg-color-button-hell);
    color: var(--font-color-button-hell);
}

.buttoniconblau {
    height: 1.1em;
    padding: 5px 5px;
    background-color: var(--bg-color-button-icon-blau);
    color: #FFFFFF;
}

.buttonsubmenue:hover {
    text-decoration: none;
    background-color: #B2B2B2;
 /* 3 Stufen dunkler */
    color: var(--font-color-button-hell);
    box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
}

.buttoniconblau:hover {
    background-color: var(--bg-color-button-icon-blau-hover);
    color: #FFFFFF;
}

.buttonklein {
    font-size: 0.7em;
    padding: 3px 3px;
    border-radius: 2px;
    margin: 2px;
}

.floatright {
    float: right;
}

.texthintergrundgruen, .texthintergrundgelb, .texthintergrundrot, .texthintergrundblau, .texthintergrundgelb_more, .texthintergrundrot_more, .texthintergrundblau_more, .texthintergrundgelb_meldung, .texthintergrundrot_meldung, .texthintergrundblau_meldung {
    font: 0.8em Roboto Condensed, sans-serif;
    text-decoration: none;
    background-color: var(--bg-color-button-gruen);
    padding: 2px;
    min-width: 2em; /* wegen Zahlung offen in Verasntaltung ab heute von min 3 auf min 2 runtergesetzt. */
    text-align: center;
    color: var(--font-color-button-gruen);
    border-radius: 4px;
    cursor: default;
    margin: 2px;
    display: inline-block;
    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
    -webkit-appearance: none;
}

.texthintergrundgruen, .texthintergrundgelb, .texthintergrundrot, .texthintergrundblau {
    text-align: left;
    white-space: pre;
}

.texthintergrundgelb, .texthintergrundgelb_more, .texthintergrundgelb_meldung {
    /*background-color: #F5D657;
    color: #000;*/
    background-color: var(--bg-color-button-gelb);
    color: var(--font-color-button-gelb);
}

.texthintergrundrot, .texthintergrundrot_more, .texthintergrundrot_meldung {
    /*background-color: #FF0000;*/
    background-color: var(--bg-color-button-rot);
    color: var(--font-color-button-rot);
}

.texthintergrundblau, .texthintergrundblau_more, .texthintergrundblau_meldung {
    /*background-color: #0066CC;*/
    background-color: var(--bg-color-button-blau);
    color: var(--font-color-button-blau);
}

/* more weil Klassenname in den Belegwarnungen nicht gleich dem Togglebutton sein darf */
.texthintergrundgelb_more, .texthintergrundrot_more, .texthintergrundblau_more {
    min-width: 0em;
    cursor: hand;

}

.texthintergrundgelb_meldung, .texthintergrundrot_meldung, .texthintergrundblau_meldung {
    min-width: 0em;
    cursor: hand;
    padding: 10px 20px;
    }

.fehler {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    font-color: black;
}

.apple, .apple_in_button, .apple_fl_left, .apple_artikel {
    background: #FFFFFF;
    margin: 3px;
    padding: 0px !important;
    border: 1px solid silver !important;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    box-shadow: 1px 1px 2px rgba(0,0,0,.4);
    vertical-align: middle;
}

.apple_fl_left {
    float: left;
}

.apple_artikel {
    float: left;
}

.fl_top {
    clear: left;
}

.apple_in_button {
    height: 1.5em;
    margin: 0px;
    margin-right: 0.5em;
    padding: 0px !important;
    background-color: silver;
    border: 0px solid silver !important;
    vertical-align: center;
}

.apple_case {
    font-family: Roboto Condensed, sans-serif;
    background: #FFFFFF;
    margin: 3px;
    border: 3px dashed silver;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    box-shadow: 1px 1px 2px rgba(0,0,0,.4);
    vertical-align: middle;
}

.apple_in_flexcase {
    font-family: Roboto Condensed, sans-serif;
    text-align: left !important;
    margin: 3px;
    border: 2px dashed var(--border-fieldset);
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    box-shadow: 1px 1px 2px rgba(0,0,0,.4);
    vertical-align: middle;
}

.apple_in_flexcase legend {
    text-decoration: none !important;
    font-size: 0.75em;
    color: var(--border-fieldset);
    }

.apple_flexcase {
    font-family: Roboto Condensed, sans-serif;
    margin: 3px;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #bab1ba));
    background: -moz-linear-gradient(top, #ededed 5%, #bab1ba 100%);
    background: -webkit-linear-gradient(top, #ededed 5%, #bab1ba 100%);
    background: -o-linear-gradient(top, #ededed 5%, #bab1ba 100%);
    background: -ms-linear-gradient(top, #ededed 5%, #bab1ba 100%);
    background: linear-gradient(to bottom, #ededed 5%, #bab1ba 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#bab1ba',GradientType=0);
    background-color: #ededed;
    vertical-align: middle;
}

.apple_unten {
    position: absolute;
    background: #FFFFFF;
    margin: 10px;
    padding: 10px;
    border: 1px solid silver;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    box-shadow: 1px 1px 2px rgba(0,0,0,.4);
    vertical-align: middle;
}

.Beleg {
    background: #FFFFFF;
    margin: 0px;
    float: left;
    margin-right: 4px;
    padding: 1px;
    border: 1px solid silver;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    box-shadow: 1px 1px 2px rgba(0,0,0,.4);
    vertical-align: middle;
    transition: all .2s ease-in-out;
}

.Beleg:hover {
    background: #2473A6;
    transform: scale(1.1);
}

.Beleg_rechts {
    background: #f5f5f5;
    margin: 0px;
    margin-left: 4px;
    padding: 1px;
    border: 1px solid silver;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    box-shadow: 1px 1px 2px rgba(0,0,0,.4);
    vertical-align: middle;
    transition: all .2s ease-in-out;
}

.Beleg_rechts:hover {
    background: #2473A6;
    transform: scale(1.1);
}

.QR_Lastschrift_rechts {
    background: #f5f5f5;
    width: 6em;
    margin: 0px;
    margin-left: 4px;
    padding: 1px;
    float: left;
    vertical-align: top;
    transition: all .2s ease-in-out;
}

.pricetag {
    white-space: nowrap;
    position: relative;
    margin: 0 5px 0 10px;
    displaY: inline-block;
    height: 25px;
    border-radius: 0 5px 5px 0;
    padding: 0 25px 0 10px;
    background: #E8EDF0;
    border: 0 solid #C7D2D4;
    border-top-width: 1px;
    border-bottom-width: 1px;
    color: #000000;
    line-height: 23px;
    font-weight: bold;
}

.pricetag:after {
    //position: absolute;
    //right: 0;
    //margin: 1px 7px;
    //font-weight: bold;
    //font-size: 19px;
    //content: "\00D7";
}

.pricetag:before {
    position: absolute;
    content: "\25CF";
    color: white;
    text-shadow: 0 0 1px #333;
    font-size: 11px;
    line-height: 0px;
    text-indent: 12px;
    left: -15px;
    width: 1px;
    height: 0px;
    border-right: 14px solid #E8EDF0;
    border-top: 13px solid transparent;
    border-bottom: 13px solid transparent;
}

.dropdowngruen {
    color: black;
    background-color: #DFFFDF;
}

.dropdowngelb {
    color: black;
    background-color: #FFFFDF;
}

.dropdownrot {
    color: black;
    background-color: #FFDDDD;
}

.dropdownblau {
    color: black;
    background-color: #A8D5FF !important;
}

.dropdownaktiv {
    color: black;
    background-color: #30AAE9;
}
//Kreis

.row {
}

.circle-tile {
    margin-bottom: 15px;
    text-align: center;
}

.circle-tile-heading {
    border: 3px solid rgba(255, 255, 255, 0.3);
    border-radius: 100%;
    color: #FFFFFF;
    height: 5em;
    margin: 0 auto -2.5em;
    position: relative;
    transition: all 0.3s ease-in-out 0s;
    width: 5em;
}

.circle-tile-heading .fa {
    line-height: 1.6em;
}

.circle-tile-heading .img {
    line-height: 1.0em;
}

.circle-tile-content {
    padding-top: 2em;
}

.circle-tile-number {
    font-size: 2em;
    font-weight: 700;
    line-height: 2em;
    padding: 5px 0 15px;
}

.circle-tile-description {
}

.circle-tile-footer {
    background-color: rgba(0, 0, 0, 0.1);
    color: rgba(255, 255, 255, 0.5);
    display: block;
    padding: 5px;
    transition: all 0.3s ease-in-out 0s;
}

.circle-tile-footer:hover {
    background-color: rgba(0, 0, 0, 0.2);
    color: rgba(255, 255, 255, 0.5);
    text-decoration: none;
}

.circle-tile-heading.dark-blue:hover {
    background-color: #2E4154;
}

.circle-tile-heading.green:hover {
    background-color: #138F77;
}

.circle-tile-heading.orange:hover {
    background-color: #DA8C10;
}

.circle-tile-heading.gold:hover {
    background-color: #796835;
}

.circle-tile-heading.blue:hover {
    background-color: #2473A6;
}

.circle-tile-heading.red:hover {
    background-color: #CF4435;
}

.circle-tile-heading.purple:hover {
    background-color: #7F3D9B;
}

.circle-tile-heading.yellow:hover {
    background-color: #D4AC0C;
}

.tile-img {
    text-shadow: 2px 2px 3px rgba(0, 0, 0, 1);
}

.dark-blue {
    background-color: #34495E;
}

.green {
    background-color: #16A085;
}

.blue {
    background-color: #2980B9;
}

.orange {
    background-color: #F39C12;
}

.gold {
    background-color: #8e7a3f;
}

.red {
    background-color: #E74C3C;
}

.purple {
    background-color: #8E44AD;
}

.dark-gray {
    background-color: #7F8C8D;
}

.gray {
    background-color: #95A5A6;
}

.light-gray {
    background-color: #BDC3C7;
}

.yellow {
    background-color: #F1C40F;
}

.text-dark-blue {
    color: #34495E;
}

.text-green {
    color: #16A085;
}

.text-blue {
    color: #2980B9;
}

.text-orange {
    color: #F39C12;
}

.text-gold {
    color: #8e7a3f;
}

.text-red {
    color: #E74C3C;
}

.text-purple {
    color: #8E44AD;
}

.text-faded {
    color: rgba(255, 255, 255, 0.7);
}
////Prozentkreis//
.flex-wrapper {
    display: flex;
    flex-flow: row nowrap;
}

.single-chart {
    width: 6rem;
    justify-content: space-around;
}

.single-chart-klein {
    width: 3rem;
}

.circular-chart {
    background-color: background-color: var(--bg-color-kachel);
    display: block;
    margin: 10px auto;
    max-width: 80%;
    max-height: 250px;
}

.circular-chart-klein {
    background-color: background-color: var(--bg-color-kachel);
    display: block;
    margin: 3px;
    max-width: 80%;
    max-height: 250px;
}

.circle-bg {
    fill: none;
    stroke: var(--bg-color-circle);
    stroke-width: 3.8;
}

.circle {
    fill: none;
    stroke-width: 2.8;
    stroke-linecap: round;
    animation: progress 1s ease-out forwards;
}

@keyframes progress {
    0% {
        stroke-dasharray: 0 100;
    }
}

.circular-chart.orange .circle {
    stroke: #ff9f00;
}

.circular-chart.yellow .circle {
    stroke: #F1C40F;
}

.circular-chart-klein.yellow .circle {
    stroke: #F1C40F;
}

.circular-chart.green .circle {
    stroke: #4CC790;
}

.circular-chart-klein.green .circle {
    stroke: #4CC790;
}

.circular-chart.blue .circle {
    stroke: #3c9ee5;
}

.percentage {
    fill: var(--font-color-circle);
    font-family: sans-serif;
    font-size: 0.75em;
    text-anchor: middle;
}




/* Modal opening object (link, button, or pretend button) */
/* https://codepen.io/2kool2/pen/LkaXay */

button,
[aria-role="button"] {
    cursor: pointer;
}

button[data-modal][aria-controls],
[aria-role="button"][data-modal][aria-controls] {
  /* transition: all .3s ease-out; */
    transition: opacity .1s ease-out, transform .1s ease-out;
}

/* Hover & focus indication. */

/* Reads as: if button, or aria-role=button, has data-model attribute and JavaScript has added aria-controls then on hover or focus */

button[data-modal][aria-controls]:hover,
button[data-modal][aria-controls]:focus,
[aria-role="button"][data-modal][aria-controls]:hover,
[aria-role="button"][data-modal][aria-controls]:focus {
    -webkit-filter: contrast(120%);
    filter: contrast(120%);
  /*box-shadow: 0 0 0 4px rgba(255, 0, 0, .6); /* Red so you can tell */;
}


/* Modal opening link cosmetics */

.lnk_modal-open {
  /*font-size: larger;*/
  /*background-color: #000;*/
  /*padding:.25rem .5rem;*/
    display: inline-block;
    text-decoration: none;
    border: 0 solid;
    margin: 0 auto;
}

.lnk_modal-img {
    padding: 0;
}

.lnk_modal-open:active {
    -webkit-filter: brightness(85%);
    filter: brightness(85%);
}

.img_modal-open {
    display: block;
    border: 0 solid;
}


/* The modal section is added via JS */

.modal {
    /*  !!! Muss ggf. für Ipad usw. auch width und Height 80 und 90 wie früher geändert werden um bedienbar zu bleiben. */
    width: fit-content;
    height: fit-content;
    background: var(--bg-color-loadScreen);
    margin: auto;
    position: absolute;
    left: 10%;
    right: 10%;
    top: 5%;
    bottom: 5%;
    z-index: 10001;
  /* Original: 10 */
    border: 1px solid #000;
    box-shadow: 0 .25em .5em #000;
    transition: opacity .25s ease-out, visibility 0s ease-out 0.5s, transform .25s ease-out .25s;
    backface-visibility: hidden;
    opacity: 0;
    visibility: hidden;
    transform: scale(.8) translate3d(0,0,0);
    pointer-events: none;
}

.modal[aria-hidden="false"] {
    position: fixed;
    transition-delay: 0s,0s, 0s;
    opacity: 1;
    visibility: visible;
    transform: scale(1) translate3d(0,0,0);
    pointer-events: auto;
}




/* Light box properties */

.modal_lightbox {
    display: table;
    text-indent: -200em;
    background-color: rgba(0, 0, 0, 0.8);
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
  /* places the modal overlay between the main page (0) and the modal dialog (10) */
    z-index: 10000;
    cursor: pointer;
    transition: opacity .5s ease-out, visibility 0s ease-out .5s;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.modal_lightbox-on {
    transition-delay: 0s, 0s;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.modal_lightbox-on:hover {
  /* Stolen from trickle.js. Under consideration. SVGs will not work here */
    cursor: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAANpJREFUOBGNkz0KAjEQhYPYWXgCKws7LcXWyt7WG4i9jegBvIJ4AvEyXsRCsBDiN0sGkiE/O/A2O9n3viS7rPPeb9ETrVzPwrtHDzR1XF5I6oPWLQaeq5hDXQRw0I6xCuF5HH7Tz7oFuTkhrSyEhza8THaLoQhphpWUg/QOFyA/AFpy5nTbGrIjxvg4AiiGBzYc+rGZH9KPzFy+ZbX4bX9l+VDZr5NQMMbhbtvMxccpQ3JhpTchtXATQviItIpvW0CY7HHm8c9UDRd2chbABt3RQk2tEe8O3dDkD4JQ4iOR7BMpAAAAAElFTkSuQmCC"), pointer;
}


/* Modal title and description */

.modal_title,
.modal_desc {
    position: absolute;
    top: 5px;
    left: -200em;
    background-color: #fff;
    color: #000;
    text-shadow: 0 0 0 #fff;
    font-size: 20px;
    padding: 0.125em .25em;
  /* Tesco requirement
  font-family: Tesco_W_Rg, sans-serif; */
    margin: 0;
}

.modal_title:focus,
.modal_desc:focus {
    left: 5px;
}

[aria-hidden="false"] .modal_title {
    transition: opacity .5s ease-out 3s;
    opacity: 0;
}

.modal_title,
.modal_title:focus {
    opacity: 1;
    transition: opacity .5s ease-out;
}


/* The iframe */

.modal_iframe {
    transition: opacity .5s ease-out, visibility 0s ease-out 1s;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.modal_iframe-on {
  /* transition: opacity .8s ease-out, visibility 0s ease-out 0s; */    /* alt */
    transition: opacity .3s ease-out, transform .3s ease-out;
             /* neu wegen Apple Problemen*/
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

[aria-hidden="true"] .modal_iframe {
    display: none;
}

[aria-hidden="false"] .modal_iframe {
    display: block;
}


/* The modal pop-ups close button, appears last in the modal, but is moved visually to the top right of the pop-up */

.modal_lnk-close {
    cursor: pointer;
    position: absolute;
    top: -20px;
    right: -20px;
    border: 0 solid;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    background-color: #000;
    box-shadow: 0 .25em .5em rgba(0, 0, 0, .25);
    overflow: hidden;
    transition: background-color .3s ease-out;
}

.modal_lnk-close:hover,
.modal_lnk-close:active,
.modal_lnk-close:focus {
    background-color: #c00;
    outline: 0 solid;
}

.svg-close {
    pointer-events: none;
    width: 40px;
    height: 40px;
    stroke: #fff;
    stroke-width: 2;
}




/* Modal SVG (Tesco) loading animation version 2 (overlaid on itself and out of phase) */

[class*="svg-loading"] {
    display: none;
 /* neu wegen Apple Problemen*/
    position: absolute;
    width: 80px;
    height: 80px;
    top: calc(50% - 40px);
    left: calc(50% - 40px);
    z-index: -1;
    transition: opacity .3s ease-out;
    backface-visibility: hidden;
}

.svg-loading {
    fill: #00539f;
    -webkit-animation: rotate 4s linear 0s infinite;
    animation: rotate 4s linear 0s infinite;
}

.svg-loading2 {
  /* Match to .modal background colour for full effect */
    fill: #F7F0E8;
    -webkit-animation: rotate 5s linear 1s infinite;
    animation: rotate 5s linear 1s infinite;
}

@-webkit-keyframes rotate {
    to {
        -webkit-transform: rotate(360deg) translate3d(0,0,0);
        transform: rotate(360deg) translate3d(0,0,0);
    }
}

@keyframes rotate {
    to {
        -webkit-transform: rotate(360deg) translate3d(0,0,0);
        transform: rotate(360deg) translate3d(0,0,0);
    }
}



/* While modal is open */

/* Class added to body tag to prevent scroll
   Note the body does not require class "-modal" */
body.-modal-open {
    overflow: hidden;
}


/* Any tags classed with "-modal", when open, get "-modal-open" added */
/* Both of these are equivalent, best practice to use the attribute version which enforces accessibility */

.-modal[aria-hidden="true"] {
    -webkit-filter: blur(4px);
    filter: blur(4px);
}

.-modal.-modal-open {
    -webkit-filter: blur(4px);
    filter: blur(4px);
}


/* Generic helper style */
.u-margin2 {
    margin: 2rem 0;
}

/*Ajax Seiten Anfang*/




#list-product > table {
}

#add-product table {
    width: 100%;
    background-color: #F0F0F0;
}

#add-product table th {
    text-align: center;
    padding: 5px;
}

#add-product table td {
    background-color: #d1e6d6;
    text-align: right;
    padding: 2px 20px 2px 2px;
    min-height: 20px;
    word-break: break-all;
    max-width: 10px;
    vertical-align: middle;
}

#add-product table .feldleft {
    background-color: var(--bg-color-input);
    color: var(--font-color-input);
    font-size: 1em;;
    text-align: left;
    padding: 2px 24px 2px 2px;
    min-height: 20px;
    word-break: break-all;
    max-width: 10px;
    vertical-align: middle;
}

#list-product table {
    width: 100%;
    background-color: #F0F0F0;
}

#list-product table th {
    text-align: center;
    padding: 5px;
}

#list-product table td {
    background-color: #FFFFFF;
    text-align: right;
    padding: 2px 24px 2px 2px;
    min-height: 20px;
    word-break: break-all;
    max-width: 10px;
    vertical-align: middle;
}

#list-product table .feldleft {
    background-color: var(--bg-color-input);
    color: var(--font-color-input);
    text-align: left;
    padding: 2px 24px 2px 2px;
    min-height: 20px;
    word-break: break-all;
    max-width: 10px;
    vertical-align: middle;
}

#list-product table a {
    cursor: pointer;
    vertical-align: middle;
}

#btnSaveAction, #btnSaveActionFaktor {
    background-color: #7fb378;
    padding: 5px 5px;
    color: #fff;
    border-radius: 4px;
    cursor: pointer;
    margin: 5px 0px 5px;
    display: inline-block;
    vertical-align: middle;
}

#list-product table td, .feld {
    background-color: var(--bg-color-input);
    color: var(--font-color-input);
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 1px;
    border: 0px solid #cfcfcf;
    padding: 2px 20px 2px 2px
    transition: all .25s;
}

#list-product table td[contenteditable="true"] {
    background-color: var(--bg-color-input);
    color: var(--font-color-input);
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
    border: 1px solid var(--border-input-editable);
    padding: 2px 20px 2px 2px
    transition: all .25s;
}

#list-product table td[contenteditable="true"]:focus {

    border: 1px solid var(--border-input-editable-focus) !important;
    transition: all .25s;
}

.neben_editierbar, .editierbar_schmal[contenteditable="true"], .editierbar[contenteditable="true"], .editierbar_Tabelle, .editierbar_Tabelle[contenteditable="true"], .editierbar_Tabelle[contenteditable="false"], .editierbar_Tabelle_sticky1, .editierbar_Tabelle_sticky2 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-input);
    padding: 3px;
    border: 1px solid var(--border-input-editable);
}

.editierbar_Tabelle, .editierbar_Tabelle[contenteditable="true"], .editierbar_Tabelle[contenteditable="false"], .editierbar_Tabelle_sticky1, .editierbar_Tabelle_sticky2 {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    padding-left: 3px;
    padding-right: 3px;
    padding-bottom: 1px;
    padding-top: 1px;
    background: var(--bg-color-editierbar);
    border: 1px solid var(--border-input-editable);
    text-align: right;
}

.editierbar_Tabelle_sticky1 {
    left: 0;
    position: sticky;
    z-index: 0;
    white-space: nowrap;
    background: var(--bg-color-table-sticky);
    border: 0px solid var(--border-input-editable);
}

.editierbar_Tabelle_sticky2 {
    left: 60;
    position: sticky;
    z-index: 0;
    background: var(--bg-color-table-sticky);
    ;
    border: 0px solid var(--border-input-editable);
}

th.editierbar_Tabelle_sticky1, th.editierbar_Tabelle_sticky2 {
    background: var(--bg-header-sticky);
}

.editierbar_Tabelle:nth-of-type(even) {
    background: var(--bg-color-editierbar-nth);
}

tr.Liste5 .editierbar_Tabelle {
    background: var(--bg-color-tr-Liste5) !important;
}

tr.Liste5 .editierbar_Tabelle:nth-of-type(even) {
    background: var(--bg-color-tr-Liste5nth) !important;
}

tr.Liste5:hover .editierbar_Tabelle {
    background: var(--bg-color-tr-Liste5-hover) !important;
}

tr.Liste5:hover .editierbar_Tabelle:nth-of-type(even) {
    background: var(--bg-color-tr-Liste5nth-hover) !important;
}

.editierbar_schmal[contenteditable="true"], .editierbar[contenteditable="true"] {
    border-radius: 2px;
    behavior: url(border-radius.htc);
    border: 1px solid var(--border-input-editable);
    padding: 3px;
    background: background-color: (--bg-color-input);
    transition: all .25s;
}

.editierbar_schmal[contenteditable="true"] {
    float: left;
    min-width: 2em;
}

/*
.feldleft[contenteditable="true"]:focus, .feld[contenteditable="true"]:focus {
    border: 1px solid var(--border-input-editable-focus);
}
*/


.neben_editierbar {
    float: left;
}

.txt-heading {
    padding: 5px;
    border-radius: 2px;
    color: #333;
    font-size: 1.1em;
    background: #d1e6d6;
    margin: 20px 0 5px;
}

td.zelle12:nth-of-type(odd) {
    //background: #E8F5FC;
}

td.zelle12:nth-of-type(even) {
}

/*Ajax Seiten Ende*/

.neuerkopf_abgerundet_fluid, .neuerkopf_abgerundet_fluid_rot {
    font-family: Roboto Condensed, sans-serif;
    font-size: calc(0.5em + 0.9vmin);
    margin: 0.25rem;
    width: 100%;
    padding: 0.5rem;
    text-align: center;
    border: 0 solid #000;
    color: var(--font-color-neuerkopf);
    border-radius: 3px;
    background: linear-gradient(#373737, #353535);
    -webkit-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    -moz-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
}

.neuerkopf_abgerundet_fluid_rot {
    background: linear-gradient(#420011, #610018);
}

.abgerundet_zelle2_fluid {
    margin: 0.25rem;
    width: 100%;
    padding: 0.5rem;
    flex: 1 1 auto;
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: var(--bg-color-abgerundet_zelle2);
    border: 0 solid #cfcfcf;
    border-radius: 3px;
    -webkit-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    -moz-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
}

.abgerundet_zelle2_fluid_nebeneinander, .abgerundet_zelle2_optional {
    margin: 0.25rem;
    width: 20%;
    max-width: 100%;
    float: left;
    padding: 0.5rem;
    flex: 1 1 auto;
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: var(--bg-color-abgerundet_zelle2);
    border: 0 solid #cfcfcf;
    border-radius: 3px;
    -webkit-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    -moz-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
}

.abgerundet_zelle2_fluid_nebeneinander_tabelle_bedienung, .abgerundet_zelle2_fluid_nebeneinander_tabelle_bedienung_sticky {
    min-width: 10%;
    float: left;
    margin: 3px;
    padding: 0.25rem;
    vertical-align: center;
    align-content: center;
    text-align: center;
    flex: 1 1 auto;
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
    border: 0 solid #cfcfcf;
    border-radius: 3px;
    -webkit-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    -moz-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
}

.abgerundet_zelle2_fluid_nebeneinander_tabelle_bedienung_sticky {
    position: sticky;
    top: 3em;
    float: top;
    z-index: 9999991;
}

.abgerundet_zelle2_fluid_nebeneinander_tabelle_bedienung_schmal, .abgerundet_zelle2_fluid_nebeneinander_tabelle_bedienung_schmal_hervorgehoben {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: var(--bg-color-button-hell);
    cursor: pointer;
    float: left;
    margin: 3px;
    padding: 0.25rem;
    text-align: center;
    border-radius: 3px;
}

.abgerundet_zelle2_fluid_nebeneinander_tabelle_bedienung_schmal {
    border: 1px solid var(--border-button-hell);
    color: var(--font-color-button-hell);
}

.abgerundet_zelle2_fluid_nebeneinander_tabelle_bedienung_schmal_hervorgehoben {
    color: var(--font-color-abgerundet_zelle2-hervorgehoben);
    border: 0 solid #cfcfcf;
    border-left: 0.25em solid #1A9AD0;
}

.abgerundet_zelle2_fluid_nebeneinander_tabelle_inhalt {
    min-width: 10%;
    float: left;
    margin: 3px;
    padding: 0.5rem;
    vertical-align: top;
    flex: 1 1 auto;
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: var(--bg-color);
    border: 0 solid #cfcfcf;
    border-radius: 3px;
    -webkit-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    -moz-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
}

.abgerundet_zelle2_fluid_nebeneinander_workcenter, .abgerundet_zelle2_fluid_gebuchte_Technik_aussen {
    float: left;
    padding: 0;
    vertical-align: top;
    flex: 1 1 auto;
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: var(--bg-color);
    border: 0 solid #cfcfcf;
    border-radius: 3px;
    -webkit-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    -moz-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
}

.abgerundet_zelle2_fluid_gebuchte_Technik_aussen {
    width: 100%;
    font-size: 0.8em;
}

.abgerundet_zelle2_fluid_nebeneinander_workcenter {
    min-width: 10%;
    margin: 3px;
}

.abgerundet_zelle2_fluid_nebeneinander_workcenter_1column,
.abgerundet_zelle2_fluid_nebeneinander_workcenter_2column,
.abgerundet_zelle2_fluid_nebeneinander_workcenter_3column {
    min-width: 10%;
    float: left;
    margin: 3px;
    padding: 0;
    vertical-align: top;
    flex: 1 1 auto;
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: var(--bg-color-abgerundet_zelle2);
    border: 0 solid #cfcfcf;
    border-radius: 3px;
    -webkit-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    -moz-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
}

.abgerundet_zelle2_fluid_nebeneinander_workcenter_1column {
    max-width: 102.7rem;
}

.abgerundet_zelle2_fluid_nebeneinander_workcenter_2column {
    max-width: 51.2rem;
}

.abgerundet_zelle2_fluid_nebeneinander_workcenter_3column {
    max-width: 34rem;
}

@media only screen and (max-width: 103em) and (min-width: 69.01em) {
    .abgerundet_zelle2_fluid_nebeneinander_workcenter_1column,
    .abgerundet_zelle2_fluid_nebeneinander_workcenter_2column,
    .abgerundet_zelle2_fluid_nebeneinander_workcenter_3column {
        max-width: 102rem;
    }
}

@media only screen and (max-width: 69.0rem) {
    .abgerundet_zelle2_fluid_nebeneinander_workcenter_1column,
    .abgerundet_zelle2_fluid_nebeneinander_workcenter_2column,
    .abgerundet_zelle2_fluid_nebeneinander_workcenter_3column {
        max-width: 68rem;
    }
}

.abgerundet_zelle2_fluid_nebeneinander_buchen_2column_links, .abgerundet_zelle2_fluid_nebeneinander_buchen_2column_rechts {
    margin: 3px;
    padding: 0;
    vertical-align: top;
    flex: 1 1 auto;
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    background-color: #fff;
    border: 0 solid #cfcfcf;
    border-radius: 3px;
    -webkit-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    -moz-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
}

.abgerundet_zelle2_fluid_nebeneinander_buchen_2column_links {
    min-width: 10%;
    /*border: 5px solid #CCFF66;*/
}

.abgerundet_zelle2_fluid_nebeneinander_buchen_2column_rechts {
    min-width: 10%;
    /*border: 5px solid #330099;*/
}

.zellebuchen, .zellebuchen_fremd, .zellebuchenListe {
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
    border: 0 solid #cfcfcf;
    vertical-align: top;
    flex: 1 1 auto;
    padding: 0.1em;
    margin: 0.1em;
    border-radius: 3px;
    -webkit-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    -moz-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
}

.zellebuchen, .zellebuchen_fremd {
    min-width: 22rem;
    /*background-color: #CC99CC;*/
}

.zellebuchen_fremd {
    background-color: var(--bg-color-zelle_blau);
}

.zellebuchenListe {
    width: 100%;
    margin: 0.2em;
    /*background-color: #66CC33;*/
}

.zellebucheninhalt {
    /* begrenzt den Inhalt etwas kleiner, damit trotz shrink alle gleich breit sind. */
    /*background-color: #FF3366;*/
    min-width: 22rem;
    max-width: 22rem;
}

.zellebucheninhaltListe {
    /* begrenzt den Inhalt etwas kleiner, damit trotz shrink alle gleich breit sind. */
    /*background-color: #800020;*/
    width: 100%;
}

.verlauf_success {
    vertical-align: top;
    flex: 1 1 auto;
    padding: 0.1em;
    margin: 0.1em;
    font-family: Roboto Condensed, sans-serif;
    font-size: 1em;
    color: var(--font-color-abgerundet_zelle2);
    background-image: linear-gradient(to bottom, var(--bg-color-zelle_success-verlauf-start) 0%, var(--bg-color-zelle_success-verlauf-ende) 100%);
    background-repeat: repeat-x;
    border: 0 solid #00CE00;
    border-left: 0.25em solid #00CE00;
    border-radius: 3px;
    -webkit-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    -moz-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
}

.verlauf_success_inhalt {
    min-width: 5rem;
    max-width: 5rem;
}

.abgerundet_zelle2_fluid_nebeneinander:hover {
    -webkit-box-shadow: 0 0 6px -1px #333, 0 1px 2px -1px #fff inset;
    -moz-box-shadow: 0 0 6px -1px #333, 0 1px 2px -1px #fff inset;
    box-shadow: 0 0 6px -1px #333, 0 1px 2px -1px #fff inset;
}

.fill-height-or-more, .fill-height-or-more-left, .fill-height-or-more-popup, .fill-height-or-more_sticky {
    display: flex;
    justify-content: center;
    flex-flow: row wrap;
    margin-left: 3em; /* neu 2020 - wegen Schnellnavigation links */
    background-color: var(--bg-color-table-aussen);
}

.fill-height-or-more-popup {
    margin-left: 0;
}

.fill-height-or-more-left {
    justify-content: left;
}

.fill-height-or-more_sticky {
    position: sticky;
    top: 3em;
    z-index: 1;
}

.fill-highlite {
    /* neu 2020 - in andere Browser übersetzen und dann obere alte Einträge löschen */
    border: 1px solid #0DA4E4;
    border-left-width: 3px;
    padding: 0.5em;
    border-radius: 3px;
    box-shadow: 0 19px 38px rgba(0,0,0,0.3), 0 15px 12px rgba(0,0,0,0.22);
}

.fill-lowlite {
    /* neu 2020 - in andere Browser übersetzen und dann obere alte Einträge löschen */
    border: 1px solid #D8D9DC;
    border-left-width: 3px;
    padding: 0.5em;
    border-radius: 3px;
}

.abgerundet_zelle2_optional::before {
    content: "Optionale Angaben";
    line-height: 0.7em;
    font-size: 0.7em;
    color: #777;
    text-align: right;
    float: right;
    padding: 5px;
    border: 1px solid #777;
    background-color: #E8E8E8;
}

.header-nebeneinander {
    margin: 1.5em 1.5em 0 0;
    white-space: nowrap;
    float: left;
    padding: 0;
    min-width: 14rem;
    max-width: 14rem;
    font-weight: bold;
    color: #1A9AD0;
}

.header-nebeneinander-wrap-1_5 {
    margin: 1.5em 1.5em 0 0;
    overflow-wrap: break-word;
    float: left;
    padding: 0;
    min-width: 21.75rem;
    max-width: 21.75rem;
    font-weight: bold;
    color: #1A9AD0;
}

.input-container {
    margin: 1.5em 0 0 0;
    white-space: nowrap;
    padding: 0;
    min-width: 14rem;
    max-width: 14rem;
}

.input-container-workcenter {
    margin: 1.5em 1.5em 0 0;
    min-width: 14rem;
    max-width: 14rem;
}

.input-container-formulartexte {
    padding: 1em 0 0 0;
}

.input-container-in-kopfbedienung {
    float: left;
    text-align: left;
    vertical-align: center;
    padding: 0.25em;
}

.newboxes-2, .newboxes-3 {
    padding: 1em;
}

.VorschauframePDF_3column {
    width: 100%;
    min-height: 75vh;
    float: left;
    vertical-align: top;
    flex: 1 1 auto;
}

.input-container-left {
    /*Technik buchen auf Artikelebene*/
    min-width: 30%;
    margin: 0.5em;
    white-space: nowrap;
    float: left;
    padding: 0.5em;
    border: 1px solid #777;
    color: var(--font-color-kachel);
    background-color: var(--bg-color-kachel);
}

.input-container-dokument, .input-container-bild, .input-container-artikel-bild {
    /*Dokumente in Dokumente2Veranstaltung */
    min-width: 25em;
    max-width: 25em;
    margin: 0.5em;
    overflow-wrap: break-word;
    word-wrap: break-word;
    hyphens: auto;
    float: left;
    text-align: justify-content;
    padding: 0.25em;
    border: 0 solid #777;
    color: var(--font-color-kachel);
    background-color: var(--bg-color-kachel);
    border-radius: 3px;
    -webkit-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    -moz-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
}

.input-container-bild {
    min-width: 11.75em;
    max-width: 11.75em;
}

.input-container-artikel-bild {
    min-width: 1em;
    max-width: auto;
}

@media only screen and (max-width: 30em) {
    .input-container-dokument {
        min-width: auto;
        max-width: 90vw;
    }
}

.input-container-nebeneinander {
    margin: 1.5em 1.5em 0 0;
    white-space: nowrap;
    float: left;
    padding: 0;
    min-width: 14rem;
    max-width: 14rem;
}

/* Beginn Kalkulation */

.content {
    grid-area: content;
}

.header {
    grid-area: header;
}

.wrapper-grid {
    display: grid;
    width: 100%;
    grid-gap: 0.1em;
    grid-template-areas:
        "header"
        "content"
        "footer";
}

.box {
    border-radius: 5px;
}

.header {
    background-color: var(--bg-color-kalkulation-kopf-fuss);
    border: 2px solid var(--border-kalkulationslist);
    border-radius: 5px 5px 0 0;
    color: var(--font-color-header);
}

.content {
    background-color: var(--bg-color-abgerundet_zelle2);
    border: 0 solid #CC0033;
    color: var(--font-color-abgerundet_zelle2);
}

.footer {
    background-color: var(--bg-color-kalkulation-kopf-fuss);
    border: 2px solid var(--border-kalkulationslist);
    border-radius: 0 0 5px 5px;
    color: var(--font-color-abgerundet_zelle2);
}

.undragable {
    background-color: #9966FF;
    user-drag: none;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-drag: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

.input-container-nebeneinander-tabelle-verfuegbarkeiten-kopf {
    margin: 0;
    white-space: wrap;
    float: left;
    width: 96px;
    padding: 0.1em 0 0.1em 0;
}

.input-container-nebeneinander-tabelle-kalkulation-kopf,
.input-container-nebeneinander-tabelle-artikel-kopf,
.input-container-nebeneinander-tabelle-kalkulation,
.input-container-nebeneinander-tabelle-kalkulation-footer {
    margin: 1px;
    white-space: wrap;
    float: left;
    padding: 0.1em 0.2em;
}

@media only screen and (max-width: 90em) {
    .input-container-nebeneinander-tabelle-kalkulation-kopf,
    .input-container-nebeneinander-tabelle-artikel-kopf,
    .input-container-nebeneinander-tabelle-kalkulation,
    .input-container-nebeneinander-tabelle-kalkulation-footer {
        font-size: calc(0.5em + 0.45vmin);
    }
}

.input-container-nebeneinander-tabelle-kalkulation-kopf,
.input-container-nebeneinander-tabelle-artikel-kopf,
.input-container-nebeneinander-tabelle-kalkulation,
.input-container-nebeneinander-tabelle-kalkulation-footer:first-child {
    padding-left: 0.4em;
}

.input-container-nebeneinander-tabelle-kalkulation-kopf,
.input-container-nebeneinander-tabelle-artikel-kopf,
.input-container-nebeneinander-tabelle-kalkulation,
.input-container-nebeneinander-tabelle-kalkulation-footer:last-child {
    padding-right: 0.4em;
}

.input-container-nebeneinander-tabelle-kalkulation-kopf {
    min-height: 3.5rem;
    background-color: var(--bg-color-kalkulation-kopf-fuss);
}

.input-container-nebeneinander-tabelle-artikel-kopf {
    min-height: 1.5rem;
    background-color: var(--bg-color-kalkulation-kopf-fuss);
}

.input-container-nebeneinander-tabelle-kalkulation-footer {
    min-height: 1.5rem;
    background-color: var(--bg-color-kalkulation-kopf-fuss);
    text-align: right;
}

/* Ende Kalkulation */

.input-container-nebeneinander-tabelle,
.input-container-nebeneinander-tabelle-kopfbedienung {
    margin: 1px;
    white-space: wrap;
    float: left;
    padding: 0.5em;
    background-color: #fff;
}

.input-container-untereinander,
.input-container-untereinander-artikel {
    margin: 1.5em 1.5em 0 0;
    width: 100%;
    text-align: left;
    white-space: nowrap;
    float: top;
    padding: 0;
}

.input-container-untereinander-artikel {
    border: 1px solid #777;
    background-color: #F2F2F2;
    border-radius: 3px;
    -webkit-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    -moz-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
}

.input-container-nebeneinander-artikel {
    margin: 1.5em 1.5em 0 0;
    white-space: nowrap;
    float: left;
    padding: 10px;
    min-width: 14rem;
    max-width: 14rem;
    color: var(--font-color-abgerundet_zelle2);
    border: 1px solid #777;
    background-color: var(--bg-color-abgerundet_zelle2);
    border-radius: 3px;
    -webkit-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    -moz-box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
    box-shadow: 0 0 3px -1px #333, 0 1px 2px -1px #fff inset;
}

.input-container-nebeneinander-wrap,
.input-container-nebeneinander-wrap-Bilder-Dokumente-Thumbs,
.input-container-nebeneinander-wrap-Bilder-Artikel-Thumbs,
.input-container-nebeneinander-wrap-1_5 {
    margin: 1.5em 1.5em 0 0;
    overflow-wrap: break-word;
    word-wrap: break-word;
    float: left;
    padding: 0;
}

.input-container-nebeneinander-wrap {
    min-width: 14rem;
    max-width: 14rem;
}

.input-container-nebeneinander-wrap-Bilder-Dokumente-Thumbs {
    min-width: 9.25rem;
    max-width: 9.25rem;
    /* Für Auflistung von Bildern und PDFs im Bereich Dokumente in edit_Equipment etc. */
}

.input-container-nebeneinander-wrap-Bilder-Artikel-Thumbs {
    margin: 1.1em 0 0 0;
    min-width: 4rem;
    max-width: 4rem;
    /* Für die Anzeige von Artikelbildern in Listenansichten wie Artikel.php etc. */
}

.input-container-nebeneinander-wrap-1_5 {
    min-width: 21.75rem;
    max-width: 21.75rem;
}

.input-container-nebeneinander-0_25_divider,
.input-container-nebeneinander-0_125_divider {
    margin: 0;
    white-space: nowrap;
    float: left;
    padding: 0;
}

.input-container-nebeneinander-0_25_divider {
    min-width: 3.85rem;
    max-width: 3.85rem;
}

.input-container-nebeneinander-0_125_divider {
    min-width: 1.8rem;
    max-width: 1.8rem;
}

.input-container-nebeneinander-1rem_left,
.input-container-nebeneinander-1rem_right {
    margin: 0.5em 0.25em;
    white-space: nowrap;
    padding: 0;
    min-width: 1rem;
}

.input-container-nebeneinander-1rem_left {
    float: left;
}

.input-container-nebeneinander-1rem_right {
    float: right;
}

.div_mit_float_elementen,
.input-container-nebeneinander,
.input-container-nebeneinander-unendlich,
.input-container-nebeneinander-0_5,
.input-container-nebeneinander-0_75,
.input-container-nebeneinander-1_25,
.input-container-nebeneinander-1_5,
.input-container-nebeneinander-1_5_wrap,
.input-container-nebeneinander-2_0 {
    color: var(--font-color-kachel);
}

.input-container-nebeneinander-0_5 {
    margin: 1.5em 1.5em 0 0;
    white-space: nowrap;
    float: left;
    padding: 0;
    min-width: 6.25rem;
    max-width: 6.25rem;
}

/*
.input-container-nebeneinander-0_25_Kalkulation {
    margin: 0;
    white-space: nowrap;
    float: left;
    justify-content: center;
    align-items: center;
    min-width: 3.5rem;
    max-width: 3.5rem;
}

.input-container-nebeneinander-0_5_Kalkulation {
    margin: 0;
    white-space: nowrap;
    float: left;
    justify-content: center;
    align-items: center;
    min-width: 6.25rem;
    max-width: 6.25rem;
}
*/

.input-container-nebeneinander-0_75 {
    margin: 1.5em 1.5em 0 0;
    white-space: nowrap;
    float: left;
    padding: 0;
    min-width: 9rem;
    max-width: 9rem;
}

.input-container-nebeneinander-1_25 {
    margin: 1.5em 1.5em 0 0;
    white-space: nowrap;
    float: left;
    padding: 0;
    min-width: 17.9rem;
    max-width: 17.9rem;
}

.input-container-nebeneinander-1_5,
.input-container-nebeneinander-1_5_wrap {
    margin: 1.5em 1.5em 0 0;
    white-space: nowrap;
    float: left;
    padding: 0;
    min-width: 21.75rem;
    max-width: 21.75rem;
}

.input-container-nebeneinander-1_5_wrap {
    white-space: normal;
    word-wrap: break-word;
}

.input-container-nebeneinander-2_0 {
    margin: 1.5em 1.5em 0 0;
    white-space: nowrap;
    float: left;
    padding: 0;
    min-width: 29.5rem; /* am 13.04.2022 von 30 auf 29.5 gesetzt wegen Versatz zu groß gegenüber 2 Stück 1_0 */
    max-width: 29.5rem; /* am 13.04.2022 von 30 auf 29.5 gesetzt wegen Versatz zu groß gegenüber 2 Stück 1_0 */
}

.input-container-nebeneinander-unendlich,
.input-container-nebeneinander-unendlich-kopf {
    margin: 1.5em 1.5em 0 0;
    white-space: nowrap;
    float: left;
    padding: 0;
}

.input-container-nebeneinander-unendlich-kopf {
    margin: 0 0.5em 0 0;
}

/* Input Feld neu */

.div_mit_float_elementen {
    display: flex;
    flex-flow: row wrap;
    overflow: hidden;
    width: 100%;
    background-color: var(--bg-color-abgerundet_zelle2);
}

.div_mit_float_elementen_zentriert,
.div_mit_float_elementen_zentriert_nur_mobil,
.div_mit_float_elementen_zentriert_nur_mobil_mit_menue {
    font-size: 1em;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
}

.div_mit_float_elementen_zentriert_nur_mobil,
.div_mit_float_elementen_zentriert_nur_mobil_mit_menue {
    display: none;
}

.div_mit_float_elementen_workcenter {
    display: flex;
    flex-flow: row wrap;
    overflow: hidden;
    margin: 0 0 1.5em 1.5em;
    vertical-align: top;
}

.div_mit_float_elementen_left {
    /*Technik buchen auf Artikelebene*/
    display: flex;
    flex-flow: row wrap;
    float: left;
    overflow: hidden;
    width: 100%;
}

.div_mit_float_elementen_rand_unten_blau,
.div_mit_float_elementen_rand_unten_grau,
.div_mit_float_elementen_tabelle_grau {
    display: flex;
    flex-flow: row wrap;
    overflow: hidden;
    width: 100%;
}

.div_mit_float_elementen_rand_unten_blau {
    border-bottom: 1px solid #0DA4E4;
}

.div_mit_float_elementen_rand_unten_grau {
    border-bottom: 1px solid #C1C1C1;
}

.div_mit_float_elementen_tabelle_grau {
    padding: 1px;
    background: #C1C1C1;
}

.div_mit_float_elementen_tabelle_sticky {
    position: sticky;
    top: 3rem;
    width: 100%;
    padding: 1px;
    color: var(--font-color-abgerundet_zelle2);
    background-color: var(--bg-color-abgerundet_zelle2);
}

.div_hidden {
    display: none;
}

.inpt {
    height: 2em;
    font-size: 1em;
    color: var(--font-color-input);
    padding: 3px;
    max-width: 100%;
    min-width: 5.5rem;
}

.inpt[type=number] {
    text-align: right;
}

.inpt[type=file] {
    min-width: 18rem;
}

.inpt-bold {
    height: 2em;
    font-size: 1em;
    color: var(--font-color-input);
    padding: 3px;
    font-weight: bold;
    max-width: 100%;
    min-width: 3rem;
}

.inpt:focus ~ .lbl,
.inpt:not(:placeholder-shown) ~ .lbl,
.inpt[type=file]:not(:placeholder-shown) ~ .lbl,
.inpt-bold:focus ~ .lbl-bold,
.inpt-bold:not(:placeholder-shown) ~ .lbl-bold {
    top: -3.5em;
    left: 0;
    font-size: 0.9em;
    font-weight: bold;
    color: #1A9AD0;
}

/* Textarea Feld neu */

.txtarea {
    height: 5em;
    font-size: 1em;
    padding: 3px;
    min-width: 24rem;
    max-width: 100%;
}

.txtarea_2reihen {
    height: 3.8em;
    font-size: 1em;
    padding: 3px;
    max-width: 100%;
    min-width: 100%;
}

.txtarea_10reihen {
    height: 10em;
    font-size: 1em;
    padding: 3px;
    max-width: 100%;
    min-width: 100%;
}

.txtarea_formulartexte {
    height: 30em;
    min-width: 28em;
    font-size: 1em;
    padding: 3px;
    max-width: 100%;
    min-width: 100%;
}

.lbl_txtarea {
    /* Fokus ohne Eingabe */
    top: -6em;
    left: 0;
    font-size: 0.9em;
    color: #1A9AD0;
}

.lbl_editable {
    /* Fokus ohne Eingabe */
    left: 0;
    font-size: 0.9em;
    font-weight: bold;
    color: #1A9AD0;
}

.txtarea:focus ~ .lbl_txtarea {
    /* Fokus ohne Eingabe */
    top: -8em;
    left: 0;
    font-size: 0.9em;
    font-weight: bold;
    color: #1A9AD0;
}

.txtarea_2reihen:focus ~ .lbl_txtarea_2reihen,
.txtarea_10reihen:focus ~ .lbl_txtarea_10reihen {
    top: -5.5em;
    left: 0;
    font-size: 0.9em;
    font-weight: bold;
    color: #1A9AD0;
}

.txtarea_formulartexte:focus ~ .lbl_txtarea_formulartexte {
    top: -34.5em;
    left: 0;
    font-size: 0.9em;
    font-weight: bold;
    color: #1A9AD0;
}

/* Edge austricksen */
@supports (-ms-ime-align:auto),
    screen and (-ms-high-contrast: active),
    screen and (-ms-high-contrast: none) {
    .txtarea:focus ~ .lbl_txtarea {
        position: relative;
        margin-top: 0.5em;
        font-weight: bold;
    }
}

.txtarea:not(:placeholder-shown) ~ .lbl_txtarea {
    /* Fokus mit Eingabe */
    top: -8em;
    left: 0;
    font-size: 0.9em;
    font-weight: bold;
    color: #1A9AD0;
}

.txtarea_2reihen:not(:placeholder-shown) ~ .lbl_txtarea_2reihen {
    top: -5.5em;
    left: 0;
    font-size: 0.9em;
    font-weight: bold;
    color: #1A9AD0;
}

.txtarea_10reihen:not(:placeholder-shown) ~ .lbl_txtarea_10reihen {
    top: -15.5em;
    left: 0;
    font-size: 0.9em;
    font-weight: bold;
    color: #1A9AD0;
}

.txtarea_formulartexte:not(:placeholder-shown) ~ .lbl_txtarea_formulartexte {
    top: -34.5em;
    left: 0;
    font-size: 0.9em;
    font-weight: bold;
    color: #1A9AD0;
}

.slct {
    height: 2em;
    font-size: 1em;
    padding: 3px;
    max-width: 100%;
    min-width: 5rem;
    color: var(--font-color-input-select);
    border: 1px solid var(--border-input);
}

.slct:focus ~ .lbl_slct,
.slct:not(:placeholder-shown) ~ .lbl_slct {
    top: -3.5em;
    left: 0;
    font-size: 0.9em;
    font-weight: bold;
    color: #1A9AD0;
}

.lbl, .lbl-flip, .lbl-bold {
    position: relative;
    height: 1em;
    top: -1.6em;
    left: 3px;
    font-size: 1em;
    color: #777;
    transition: 0.2s all ease;
    pointer-events: none;
    padding: 0 3px;
    box-sizing: border-box;
}

.lbl-flip {
    top: -3em;
    left: 0;
    font-weight: bold;
    font-size: 0.9em;
    color: #1A9AD0;
}

.lbl-bold {
    font-weight: bold;
    color: #777;
}

/* Edge austricksen */
@supports (-ms-ime-align:auto) {

    .lbl, .lbl-flip {
        top: -3.5em;
        left: 0px;
        font-size: 0.9em;
        color: #1A9AD0;
    }    /* EDGE */


    .lbl-bold {
        top: -3.5em;
        left: 0px;
        font-size: 0.9em;
        font-weight: bold;
        color: #1A9AD0;
    }
}

/* EI 8-11 austricksen */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .lbl, .lbl-flip {
        top: -3.5em;
        left: 0px;
        font-size: 0.9em;
        color: #1A9AD0;
    }    /* EDGE */


    .lbl-bold {
        top: -3.5em;
        left: 0px;
        font-size: 0.9em;
        font-weight: bold;
        color: #1A9AD0;
    }
}

.unterschrift, .unterschrift_check {
    position: relative;
    height: 1em;
    bottom: 1em;
    left: -0.5em;
    line-height: 1em;
    text-align: left;
    font-size: 0.75em;
    color: #777;
    word-wrap: break-word;
    transition: 0.2s all ease;
    pointer-events: none;
    padding: 0 0.5em;
    border-box: sizing;
}

.unterschrift_check {
    height: auto;
    bottom: 0.0em;
    left: 1.75em;
    box-sizing: content-box;
}

.progress {
    height: 1.25em;
    font-size: 0.75em;
    color: #777;
    transition: 0.2s all ease;
    pointer-events: none;
    padding: 0 3px;
    border-box: sizing;
}

.lbl_txtarea {
    position: relative;
    height: 1.0em;
    top: -5.75em;
    left: 3px;
    font-size: 1.0em;
    color: #777;
    transition: 0.2s all ease;
    pointer-events: none;
    padding: 0 3px;
    border-box: sizing;
}

.lbl_txtarea_2reihen {
    position: relative;
    height: 1.0em;
    top: -3.5em;
    left: 3px;
    font-size: 1.0em;
    color: #777;
    transition: 0.2s all ease;
    pointer-events: none;
    padding: 0 3px;
    border-box: sizing;
}

.lbl_txtarea_formulartexte {
    position: relative;
    height: 1.0em;
    top: -29.75em;
    left: 3px;
    font-size: 1.0em;
    color: #777;
    transition: 0.2s all ease;
    pointer-events: none;
    padding: 0 3px;
    border-box: sizing;
}

.lbl_slct {
    position: relative;
    height: 1.0em;
    top: -3.5em;
    left: 3px;
    font-size: 1.0em;
    color: #777;
    transition: 0.2s all ease;
    pointer-events: none;
    padding: 0 3px;
    border-box: sizing;
}

@supports (-ms-ime-align:auto) {

    .lbl_txtarea {
        position: relative;
        margin-top: -2.0em;
        left: 3px;
        font-size: 0.9em;
        color: #1A9AD0;
    }

    .lbl_slct {
        top: -3.5em;
        left: 0px;
        font-size: 0.9em;
        color: #1A9AD0;
    }
}

/* EI 8-11 austricksen */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .lbl_txtarea {
        position: relative;
        margin-top: -2.0em;
        left: 3px;
        font-size: 0.9em;
        color: #1A9AD0;
    }

    .lbl_slct {
        top: -3.5em;
        left: 0px;
        font-size: 0.9em;
        color: #1A9AD0;
    }
}

@media only screen and (max-device-width: 769px) {
    .zellebuchen, .zellebucheninhalt, .zellebuchenListe, .zellebucheninhaltListe {
        min-width: 90%;
        min-height: 10rem;
        margin: 0.25rem;
        padding: 0.25rem;
        font-size: calc(0.5em + 0.9vmax);
    }
}

@media only screen and (min-width: 48rem) {
    .abgerundet_zelle2_fluid_nebeneinander {
        min-width: 48rem;
    }
}

@media only screen and (max-device-width: 1365px) {
    .neuerkopf_abgerundet_fluid, .div_mit_float_elementen_zentriert, .input-container-nebeneinander-unendlich-kopf {
        font-size: calc(0.5em + 0.9vmax);
        display: block;
        flex-wrap: wrap;
        margin: 0.25rem;
        padding: 0.25rem;
        text-align: center;
    }

    .div_mit_float_elementen_zentriert {
        display: flex;
        flex-wrap: wrap;
        padding: 0.25rem;
    }

    .div_mit_float_elementen_zentriert_nur_mobil {
        display: flex;
        flex-wrap: wrap;
    }

    .div_mit_float_elementen_zentriert_nur_mobil_mit_menue {
        display: flex;
        flex-wrap: wrap;
        margin: 3 0em;
    }

    .BarcodebildBuchen, .apple {
        width: 2em;
        padding: 1em;
    }

    #greenscreen {
        margin: 0 auto;
        font-size: 2em;
    }

    .greenscreen {
        margin: 0 auto;
        font-size: 2em;
    }

    .greenscreen img {
        margin: 0 auto;
    }
}

table.responsive {
    /*border: 1px solid #ccc;*/
    background-color: var(--bg-color-table-aussen);
    /*border-collapse: collapse;*/
    margin: 0;
    padding: 0;
    width: 100%;
    /*table-layout: fixed;*/;
}

table.responsive caption {
    font-size: 1.5em;
    margin: .5em 0 .75em;
}

table.responsive tr {
    /*background-color: #f8f8f8;
    border: 1px solid #ddd;
    padding: .35em;*/;
}

table.responsive th,
table.responsive td {
    /*padding: .625em;
    text-align: center;*/;
}

table.responsive th {
    /*font-size: .85em;
    letter-spacing: .1em;
    text-transform: uppercase;*/;
}

table.responsive .nur_wenn_schmal {
        /*border-bottom: 1px solid #ddd;*/
    display: none;
        /*font-size: .8em;*/
    text-align: right;
}

table.responsive .Datum_Auftragliste {
    font-size: 1.1em;
    font-weight: bold;
}

table.responsive .Wochentag_Auftragliste {
    font-size: 0.6em;
    font-weight: normal;
}

table.responsive .Firmenname_Kontaktliste {
    font-size: 1.0em;
    font-weight: bold;
}

table.responsive .Name_Kontaktliste {
    font-size: 1.0em;
    font-weight: normal;
}

@media only screen and (max-width: 52em) {
    table.responsive {
        border-collapse: collapse;
        border: 0;
        table-layout: fixed;
        overflow: hidden;
        background-color: var(--bg-abgerundet-zelle2);
    }

    table.responsive caption {
        font-size: 1.3em;
    }

    table.responsive thead {
        border: none;
        clip: rect(0 0 0 0);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
    }

    table.responsive tr {
        border: 3px solid var(--border-kalkulationslist);
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        display: block;
        margin-bottom: .625em;
        overflow: auto;
    }

    table.responsive td {
        border-bottom: 1px solid var(--border-kalkulationslist);
        display: block;
        font-size: 1.0em;
        text-align: right;
        min-height: 2.5em;
        padding: 0.25em;
    }

    table.responsive td.nur_wenn_breit {
        /*border-bottom: 1px solid #ddd;*/
        display: none;
        /*font-size: .8em;*/
        text-align: right;
    }

    table.responsive .nur_wenn_schmal {
        /*border-bottom: 1px solid #ddd;*/
        display: block;
        /*font-size: .8em;*/
        float: right;
    }

    table.responsive td.nur_wenn_schmal {
        width: 100%;
    }

    table.responsive td.nur_wenn_schmal a {
        padding: 0.5em;
    }

    table.responsive td.neuerfeldkopf {
        text-align: left;
        min-height: 1.5em;
    }

    table.responsive td::before {
        /*
        * aria-label has no advantage, it won't be read inside a table
        content: attr(aria-label);
        */
        content: attr(data-label);
        float: left;
        color: var(--font-color-input);
        /*font-weight: bold;*/
        /*text-transform: uppercase;*/
    }

    table.responsive td:last-child {
        border-bottom: 0;
    }

table.responsive .Datum_Auftragliste {

}

table.responsive .Wochentag_Auftragliste {
        font-size: 0.8rem;
        font-weight: normal;
}

table.responsive .Firmenname_Kontaktliste {

}
table.responsive .Name_Kontaktliste {
        font-size: 1.0rem;
}

table.responsive a {
        font-size: 1.0rem;
        font-weight: normal;
}

a.moeglichst_klein {
    position: relative;
    top: -3em;  /*Die Verschiebung in Pixel*/
}

}



.private {
//color: var(--font-color-private);
display: var(--display-private);
}