@media not all, (prefers-color-scheme: dark) {
    /* CSS Code wenn Dark Mode aktiv */ 
:root {
    /*======================================
      Allgemeine Farben ?
    ======================================*/
    --color-white:#ffffff;
    --color-black:#000000;
    
    --color-dm-blue: #00162C;
    --color-blue: #003c78;
    --color-blue-90: #1a5085;
    --color-blue-80: #336393;
    --color-blue-40: #99b1c9;
    --color-blue-20: #ccd8e4;
    --color-blue-10: #e5ebf1;
    --color-blue-5: #f2f5f8;
    
    --color-cyan: #00b4e6;
    --color-cyan-50: #80daf3;
    --color-cyan-20: #00b4e6;    
    --color-cyan-10: #00b4e6;
    --color-cyan-10: #00b4e6;
    --color-dark-cyan-interaction-1: #2ba1c2;
    --color-dark-cyan-interaction-2: #2791af;    
    
    --color-orange: #f07800;
    --color-orange-50: #f8bc80;
    --color-orange-30: #fbd7b3;
    --color-orange-20: #A35609; /*fce4cc*/
    --color-orange-10: #fef1e5;
    --color-orange-5: #fef4eb;
    --color-dark-orange-interaction: #e77300;
    
    --color-grey-disabled: #D6D6D6;
    
    --color-warning-red:#ad3535;
    --color-warning-red-15:#f3e1e1;
    --color-success-green:#287e1e;
    --color-warning-green-15:#e0edde;
    /*======================================
      BODY
    ======================================*/
    --body-bg-color: #003c78; /*transparent*/
    --body-font-family: Gilam;
    --body-font-style: normal;
    --body-font-size: 16px;
    --body-font-weight: 400;
    --body-line-height: 150%;
    --body-font-color: #ffffff; /*003c78*/
    /*======================================
      UEBERSCHRIFTEN
    ======================================*/
    --heading-color: #ffffff; /*003c78*/
    /*======================================
      HERVORGEHOBEN
    ======================================*/
    --hervorgehoben-bg-color:#C84E0B; /*#fef1e5*/
    /*======================================
      LINKS
    ======================================*/
    --link-font-color: #ffffff; /*003c78*/
    --link-font-color-hoverfocus: #2ba1c2; /*OK*/
    --link-cta-border-color: var(--bg-orange);
    --link-cta-font-color: #ffffff;
    --link-cta-bg-color: #003C78;
    --link-cta-brand-bg-color: #412204; /*F07800*/
    --link-cta-icon-color: #ffffff;
    --link-cta-bg-color-hoverfocus: #248FAE;
    --link-cta-border-color-hoverfocus: #ffffff;
    --link-cta-outline-color-hoverfocus: #248FAE;
    /*======================================
      BUTTONS
    ======================================*/
    --button-primary-font-color: #003c78; /*ffffff*/
    --button-primary-bg-color: #ffffff; /*003c78*/
    --button-primary-border-color: #ffffff; /*003c78*/
    --button-primary-font-color-hoverfocus: #fff; /*OK*/
    --button-primary-bg-color-hoverfocus: #003c78; /*248FAE*/
    --button-primary-border-color-hoverfocus:#003c78; /*ffffff*/
    --button-primary-offset-color-hoverfocus: #fff; /*248FAE*/
    
    --button-secondary-font-color: #003c78; /*ffffff*/
    --button-secondary-bg-color: #ffffff; /*003c78*/
    --button-secondary-border-color: #ffffff; /*003c78*/
    --button-secondary-font-color-hoverfocus: #003c78; /*ffffff*/
    --button-secondary-bg-color-hoverfocus: #fff; /*248FAE*/
    --button-secondary-border-color-hoverfocus: #003c78; /*ffffff*/
    --button-secondary-offset-color-hoverfocus: #fff; /*248FAE*/
    /*======================================
      COPYRIGHT
    ======================================*/
    --copyright-color:#fff; /*OK*/
    --copyright-bg-color:#000; /*OK*/
    /*======================================
      VIDEO
    ======================================*/
    --youtube-wrapper-bg-color:#00162c; /*003c78*/
    --vjs-control-font-color:#fff; /*OK*/
    --vjs-control-outline-color:#fff; /*OK*/
    /*======================================
      BORDER
    ======================================*/
    --border-color:#CCD8E4; /*?*/
    /*======================================                  
      Accordion
    ======================================*/
    --accordion-icon-border-color:#99B1C9; /*OK*/
    --accordion-link-active-font-color:#ffffff; /*003c78*/ /*?*/
    --accordion-link-active-icon-color: #003c78; /*ffffff*/
    --accordion-link-font-color-hoverfocus: #2ba1c2; /*OK*/
    /*======================================                  
      Table ?(war auch Accordion)
    ======================================*/ 
    --tabelle-bg-color:#fff;
    --tabelle-head-bg-color:#336393;
    --tabelle-head-font-color:#fff;
    --tabelle-border-color:#99B1C9;    
    --tabelle-font-color:#003c78;    
    /*======================================                 
      BANNER
    ======================================*/
    --banner-intro-bg-color:#00162c; /*e5ebf1*/
    --banner-intro-infozeile-label-border-color:#fff; /*336393*/
    --banner-intro-infozeile-label-color:#fff; /*336393*/
    --banner-intro-brand-bg-color:#3c5671; /*ccd8e4*/
    --banner-intro-veranstaltung-bg-color:#A35609; /*fce4cc*/
    --banner-intro-veranstaltung-brand-bg-color:#412204; /*fbd7b3*/
    /*======================================                  
      ONSITE-NAVIGATION
    ======================================*/
    --ankerNavigation-bg-color:#ffffff; /*99B1C9*/
    /*======================================                  
      LEISTE SPRUNGANKER
    ======================================*/
    --leiste-sprunganker-rechts-bg-color:#a35609; /*FBD7B3*/
    /*======================================
      LOGO
    ======================================*/
    --link-logo-ouline-color-hoverfocus: #ffffff; /*003c78*/
    /*======================================
      VORLAGE TOOLBAR
    ======================================*/
    --toolbar-link-color:#ffffff; /*003c78*/
    --toolbar-link-color-hoverfocus:#ffffff; /*003c78*/
    --toolbar-button-active:#E77300; /*OK*/
    /*======================================
      BREADCRUMB
    ======================================*/
    --breadcrumb-border-color:#CCD8E4; /*OK*/
    --breadcrumb-link-font-color:#ffffff; /*003c78*/
    --breadcrumb-link-font-color-hoverfocus:#ffffff; /*003c78 sollte aber anders sein*/ 
    /*======================================
      VORLAGE HAUPNAVIGATION MOBIL TODO
    ======================================*/
    /*======================================
      VORLAGE HAUPNAVIGATION DESKTOP 
    ======================================*/
    --hauptnavigation-firstlevel-bg-image-color:#fff; 
    --hauptnavigation-firstlevel-bg-image-color-active:#E77300; /*OK*/
    --hauptnavigation-flyout-bg-color:#00162C; /*003c78*/
    --hauptnavigation-flyout-font-color:#fff; /*OK*/
    --hauptnavigation-flyout-font-color-hoverfocus:#66D2F0; /*OK*/
    --hauptnavigation-flyout-font-color-active:#F8BC80; /*OK*/
    
    --nav-teaser-link-color:#ffffff; /*OK*/
    --nav-teaser-link-bg-color:#003c78; /*OK*/
    --nav-teaser-link-border-color:#003c78; /*OK*/
    --nav-teaser-link-bg-color-hoverfocus:#248FAE; /*OK*/
    --nav-teaser-link-border-color-hoverfocus:#ffffff; /*OK*/
    --nav-teaser-link-outline-color-hoverfocus:#248FAE; /*OK*/
    --nav-teaser-link-svg-color-hoverfocus:#ffffff; /*OK*/
    
    --hauptnavigation-mobil-icon-border-color:#fff; /*OK*/
    /*======================================
      TEASER_FOOTER
    ======================================*/
    --teaser-footer-socialmedia-icon-color:#fff; /*OK*/
    /*=====================================
      WARENKORB - ICON
    ======================================*/
    --warenkorb-icon-bg-color:#e77300;
    --warenkorb-icon-border-color:#ffffff;
    --warenkorb-icon-font-color:#ffffff;
    --warenkorb-icon-font-color-hoverfocus:#ffffff;
    --warenkorb-outline-font-color-hoverfocus:#ffffff;
    --warenkorb-icon-color:#ffffff;
    /*=====================================
      Veranstaltung
    ======================================*/
    --veranstaltung-banner-intro-bg-color:#a35609; /*fce4cc*/
    --veranstaltung-banner-intro-brand-bg-color: #412204; /*fbd7b3*/
    --veranstaltung-link-cta-border-color: #ffffff; /*OK*/
    /*=====================================
      Pagination
    ======================================*/
    --pagination-font-color: #2BA1C2; /*003c78*/
    --pagination-active-border-color: #E77300;/*OK*/
    /*======================================
      FILTER rest OK
    ======================================*/
    --filter-bg-color:#00162C; /*E5F8FD*/
    --filter-content-bg-color:#00162C; /*ffffff*/
    --filter-button-font-color:#003C78;
    --filter-button-bg-color:#E5F8FD;
    --filter-button-border-color:#E5F8FD;
    --filter-button-font-color-active:#ffffff;
    --filter-button-bg-color-active:#248FAE;
    --filter-button-border-color-active:#248FAE;
    --filter-button-zahl-color:#003C78;
    
    --filter-button-font-color-hoverfocus:#ffffff;
    --filter-button-bg-color-hoverfocus:#248FAE;
    --filter-button-border-color-hoverfocus:#248FAE;
    --filter-button-outline-color-hoverfocus:#248FAE;
    
    --filter-button-active-font-color-hoverfocus:#003C78;
    --filter-button-active-bg-color-hoverfocus:#E5F8FD;
    --filter-button-active-border-color-hoverfocus:#ffffff;
    --filter-button-active-outline-color-hoverfocus:#248FAE;
    
    --filter-i-color:#fff;
    /*======================================
      FUSS
    ======================================*/
    --footer-border-color:#99B1C9;/*OK*/
    /*======================================
      LISTE
    ======================================*/
    --liste-border-color:#99B1C9;/*OK*/
    /*======================================
      TEASER-LANDSCAPE
    ======================================*/
    --teaser-landscape-brand-element-color:#F07800;
    --teaser-landscape-background-blue-brand-cyan-brand-element:#00B4E6;
    --teaser-landscape-background-light-blue-brand-blue-brand-element:#003C78;
    --teaser-landscape-background-light-blue-brand-blue-brand-element:#e5ebf1;
    --teaser-wall-teaser-landscape-background-light-blue-brand-element:#e5ebf1;
    --teaser-wall-teaser-landscape-background-light-orange-brand-element-first:#FCE4CC;
    /*======================================
      TEASER-ICON
    ======================================*/
    --teaser-icon-brand-bg-color:#412204; /*FBD7B3*/
    /*======================================                  
      teaser-related-terms ?
    ======================================*/
    --teaser-related-terms-brand-bg-color:#336393;
    /*======================================                  
      TEASER KONTAKT-SERVICE
    ======================================*/
    --teaser-kontakt-service-brand-bg-color:#A35609; /*FBD7B3*/
    /*======================================                  
      SLIDER CONTROLS OK
    ======================================*/
    --slider-controls-font-color:#ffffff;
    --slider-animation-color:#F07800;
    --slider-controls-outline-color:#ffffff;
    --slider-brand-bg-color:#336393;
    /*======================================
      SEITENFUNKTIONEN SHARIFF
    ======================================*/
    --shariff-border-color:#fff; /*OK*/
    /*======================================
      FORMULARE ?
    ======================================*/
    --form-element-color-basic:#003c78;
    --form-element-color-active:#003c78;
    --form-element-color-hover-focus:#003c78; /*003c78*/
    --form-element-background-color:#fff; /*OK*/
    --form-element-background-color-active:#E5EBF1;/*OK*/
    --form-element-background-color-hover-focus:#E5EBF1;/*OK*/
    --form-element-border-color:#fff; /*003c78*/
    --form-element-border-color-active:#fff; /*003c78*/
    --form-element-border-hover-focus:#fff; /*003c78*/
    --form-element-outline-color:transparent;
    --form-element-outline-color-active:#fff; /*003c78*/
    --form-element-outline-color-hover-focus:#fff; /*003c78*/
    --form-element-error-color:#FFABA0;/*OK*/
    --form-error-summery-bg-color:#863535;/*f3e1e1*/
    --form-submit-icon-color:#ffffff;
    --form-submit-button-bg-color:#fff; /*248FAE*/
    --form-submit-button-border-color:#fff; /*248FAE*/
    --form-submit-button-outline-color:#fff; /*248FAE*/
    --form-select-option-color:#003c78; /*fff*/
    /*======================================
      TOOLTIP OK
    ======================================*/
    --tooltip-font-color:#ffffff;
    --tooltip-bg-color:#003C78;
    --tooltip-border-color:#ffffff;
    /*======================================
      newsletter ?
    ======================================*/
    --newsletter-anmelden-subscription-bg-color:#00162c;/*E5EBF1*/
    /*======================================
      startseite
    ======================================*/
    --startseite-border-color:#CCD8E4; /*OK*/
    --startseite-veranstaltungen-bg-color:#003C78; /*FEF1E5*/
    /*======================================
      shopping-cart-summary
    ======================================*/
    --shopping-cart-summary-font-color:#ffffff;
    --shopping-cart-summary-background-color:#336393;

    /*======================================
      COLORED BACKGROUND OK
    ====================================== */   
    --bg-blue:#00162C; /*003c78*/
    --bg-blue-font-color: #ffffff;
    --bg-blue-font-color-cyan: #80daf3;
    --bg-blue-font-color-orange: #f8bc80;
    --bg-blue-link-font-color: #ffffff;
    --bg-blue-link-font-color-hoverfocus: #66D2F0;
    
    --bg-blue-button-primary-font-color: #003C78;
    --bg-blue-button-primary-bg-color: #ffffff;
    --bg-blue-button-primary-border-color: #ffffff;
    --bg-blue-button-primary-font-color-hoverfocus: #ffffff;
    --bg-blue-button-primary-bg-color-hoverfocus: #248fae;
    --bg-blue-button-primary-border-color-hoverfocus: #003c78;
    --bg-blue-button-primary-offset-color-hoverfocus: #ffffff;
    
    --bg-blue-button-secondary-font-color: #ffffff;
    --bg-blue-button-secondary-bg-color: #003c78;
    --bg-blue-button-secondary-border-color: #ffffff;
    --bg-blue-button-secondary-font-color-hoverfocus: #ffffff;
    --bg-blue-button-secondary-bg-color-hoverfocus: #248FAE;
    --bg-blue-button-secondary-border-color-hoverfocus: #003c78;
    --bg-blue-button-secondary-offset-color-hoverfocus: #ffffff;
    
    --bg-blue-link-tag-bg-color: #CCD8E4;
    --bg-blue-link-tag-border-color: #CCD8E4;
    /*======================================                  
      HINTERGRUND HELLBLAU ?
    ======================================*/
    --bg-light-blue:#254E76; /*e5ebf1*/
    --bg-light-blue-link-font-color:#248FAE;
    /*======================================                  
      HINTERGRUND HELLERBLAU
    ======================================*/
    --bg-lighter-blue:#254E76; /*E5F8FD?*/
    /*======================================                  
      HINTERGRUND ORANGE
    ======================================*/
    --bg-orange:#A35609; /*fce4cc*/
    --bg-orange-link-font-color:#00162C; /*227E97*/
    --sticky-bg-color: #00162C;
}
    /*======================================
      ALLGEMEIN
    ======================================*/
    #pageWrapper {
        background: none;
        background-color: var(--color-blue);
    }
    /*i.svg-icon svg, i.svg-icon svg path,*/
    /*.exklusiv-badge i.svg-icon svg path {
        fill: var(--color-white);
    }
    .exklusiv-badge:hover i.svg-icon svg path, 
    .exklusiv-badge:focus i.svg-icon svg path {
        fill: var(--color-blue);
    }*/
    /*======================================
      NAVIGATION
    ======================================*/    
    .mobile-hauptnavigation .ui-accordion-header:hover span:first-child {
        background: var(--color-white);
        border: 1px solid var(--color-white);
    }
    .mobile-hauptnavigation .ui-accordion-header-active span, .mobile-hauptnavigation .ui-accordion-header-active span + span {
        color: var(--color-dm-blue);
    }
    .ui-accordion-header-active:hover span:first-child, .ui-accordion-header-active:focus span:first-child, .ui-accordion-header:hover span:first-child, .ui-accordion-header:focus span:first-child {
    --link-font-color-hoverfocus: var(--accordion-link-font-color-hoverfocus);
        /*background: var(--color-dm-blue);*/
        background: var(--color-white);
        color: var(--color-dm-blue);
    }    
    /*======================================
      TEASER-LANDSCAPE
    ======================================*/
    .teaser-landscape-wrapper {
        background-color: var(--color-dm-blue);
    }
    .teaser-landscape.background-blue.brand-orange .brand-element.first,
    .teaser-landscape.background-blue.brand-cyan .brand-element.first,
    .teaser-wall .teaser-landscape.background-light-blue .brand-element.first,
    .teaser-landscape.background-light-blue.brand-blue .brand-element.first{
        background-color: var(--color-dm-blue);
    }

    /*======================================
      FORMULARE 
    ======================================*/    
    .formular button[type="submit"], .formular input[type="submit"] {
        color: var(--color-blue);
    }
    .formular .label-input-wrapper input + .checkmark::after {
        border-color: var(--color-dm-blue);
    }
    .formular .label-input-wrapper.radio input + .checkmark::after {
        background-color: var(--color-dm-blue);
    }
    .fancybox-button:hover i.svg-icon svg path, 
    .fancybox-button:focus i.svg-icon svg path { 
        fill: var(--color-dm-blue) !important;
    }
    .formular input[type="submit"].with-icon + .svg-icon {
      display: none;
    }
    .formular input[type="text"], .formular input[type="password"], .formular textarea, .formular select {
        color: var(--color-dm-blue);
    }
    form.cart.formular nav.error-summery i.svg-icon svg path {
        fill: var( --form-element-error-color) !important;
        fill: var( --form-element-error-color) !important;
    }
    /*======================================
      COOKIE 
    ======================================*/    
    .fancybox-content {
        background-color: var(--color-dm-blue);
    }
    .fancybox-button.fancybox-close-small.secondary-button:hover i.svg-icon svg path,
    .fancybox-button.fancybox-close-small.secondary-button:focus i.svg-icon svg path {
        fill: var(--color-dm-blue);
    }
    /*======================================
      ACCORDION 
    ======================================*/      
    .ui-accordion-header-active span + span {
        --link-font-color-hoverfocus: var(--color-white);
    }
    /*======================================
      PARSER
    ======================================*/
    /*.teaser-prefooter .image-wrapper-inner,
    .teaser-icon .img-wrapper-teaser,*/
    a.home-link span svg path {
        fill: var(--color-white) !important;
    }
    .zitat.with-image .zitat-wrapper .brand-element {
        display:none;
    }
    .zitat.with-image .zitat-wrapper {
        background-color: var(--color-dm-blue);
    }
    article table th p {
        color: var(--tabelle-head-font-color);
    }
    article table td p {
        color: var(--tabelle-font-color);
    }
    #shopping-cart-summary tr td {
        background-color: var(--color-white) !important;
    }
    /*======================================
      NEWSETTER 
    ======================================*/      
    body.medtech-ambulant-2024-01-1 div#pageWrapper main#content-container table tbody tr td {
        background-color: var(--color-dm-blue) !important;
    }
    body.medtech-ambulant-2024-01-1 div#pageWrapper main#content-container table tbody tr td h3 a {
        color: var(--color-white) !important;
        text-decoration: underline !important;
    }
    body.medtech-ambulant-2024-01-1 div#pageWrapper main#content-container table tbody tr td p,
    body.medtech-ambulant-2024-01-1 div#pageWrapper main#content-container table tbody tr td table tbody tr td table tbody tr td p a.p {
        color: var(--color-white) !important; /*Fusz*/
    }
    /*======================================
      VERANSTALTUNG 
    ======================================*/     
    .exklusiv-badge:focus, .exklusiv-badge:hover {
        color: var(--color-white);
    }
}