
:root {
    --box-shadow02: 0 0 10px 0 rgba(255, 255, 255, .33);
}

body.darkmode {
    color: var(--white);
    background-color: var(--black);
}

.darkmode header {
    background-color: var(--black);

}

.darkmode #headTop {
  border-bottom: 1px solid var(--gry80);
}

.darkmode a {
    color: var(--ci001) !important;
}
.darkmode a:hover {
    color: var(--white) !important;
}

body.darkmode.nav-is-mobile .navigation-main a {
    color: var(--ci001) !important;
}


body.darkmode.nav-is-mobile .navigation-main li.active {
    background-color: var(--black) !important;
}
.darkmode p {
    color: var(--white) !important;
}

.darkmode .navigation-main ul.level_1 li a {
  color: var(--ci001) !important;
}
body.darkmode.nav-is-desktop .navigation-main a:hover {
  color: var(--white) !important;
}

body.darkmode.nav-is-desktop .navigation-main a.trail, 
body.darkmode.nav-is-desktop .navigation-main a:hover, 
body.darkmode.nav-is-desktop .navigation-main strong:not(.does-not-exist) {
  color: var(--white) !important;
}

.darkmode .navigation-main ul.level_1 li:hover, 
.darkmode .navigation-main ul.level_1 li.submenu:hover, 
.darkmode .navigation-main ul.level_1 li.nav-expanded {
    border-color: var(--ci001) !important;
}

body.darkmode.nav-is-mobile .navigation-main strong,
body.darkmode.nav-is-mobile .navigation-main a.trail {
    color: var(--white) !important;
    font-weight: bold;
}


.darkmode .navigation-main ul.level_2 {
    background-color: var(--black) !important;
}

body.darkmode.nav-is-desktop .navigation-main ul ul li:not(:last-of-type) {
  border-bottom: 1px solid var(--gry80) !important;
}

.darkmode main {
    background-color: var(--col02) !important;
}


.darkmode .heroSection .overlay,
.darkmode .heroContainer {
    background-color: rgba(0, 0, 0, .8) !important;
}
.darkmode .heroContainer {
    padding: 1rem !important;
}


.darkmode .boxWrapper {
  background-color: var(--col02) !important;
}


.darkmode .content-list ul li::before, 
.darkmode .content-text ul li::before {
  background-image: url("../dots/circle_white.svg");
}

.darkmode .matterbox {
    border-color: var(--gry80);
}

.darkmode .splitBanner .box1,
.darkmode .splitBanner .box2,
.darkmode .evobox .container,
.darkmode .mod_newslist .col02 {
    background-color: var(--col03) !important;
    color: var(--white) !important;
}

.darkmode .splitBanner .box1 .preHeadline,
.darkmode .splitBanner .box2 .preHeadline {
     color: var(--white) !important;
}

.darkmode .testimonial {
  background-color: var(--col03);
  border: 1px solid var(--gry80);
  color: var(--white) !important;
}

.darkmode .handorgel__header__button {
  background-color: var(--black) !important;
  border: 1px solid var(--gry80) !important;
}
.darkmode .handorgel__header__button:hover {
  color: var(--white);
}
.darkmode .handorgel__header__button:focus {
    background-color: var(--ci001-5) !important;
    border-color: var(--ciacc2) !important;
}

.darkmode .handorgel__content {
  background-color: var(--col03) !important;
  border: 1px solid var(--gry80) !important;
}

.darkmode .content-accordion {
  border-bottom: none !important;
}


.darkmode .content-table.rowGrayWhite table th {
  background-color: var(--gry80);
  border-bottom: 2px solid var(--col04)
}

.darkmode .content-table.rowGrayWhite tbody tr:nth-child(even) {
  background-color: var(--gry50);
  color: var(--black);
}

.darkmode .content-table.rowGrayDarkgray tbody tr:nth-child(odd) {
  background-color: var(--gry50);
    color: var(--black);
}


.darkmode .button.buttonSolid01 a,
.darkmode .button.buttonOutline01 a,
.darkmode .button.buttonOutline02 a {
    color: var(--white) !important;
}   
.darkmode .button.buttonSolid02 a {
  color: var(--black) !important;
}
.darkmode .button.buttonSolid02 a:hover {
  color: var(--white) !important;
}


.darkmode .bgcolor_white, 
.darkmode .mod_newslist.bgcolor_white .col02 {
  background-color: var(--col02) !important;
}

.darkmode .formbody {
  background-color: var(--col02);
  color: var(--white);
}

.darkmode input.text,
.darkmode .textarea {
  background-color: var(--black);
  box-shadow: 0 0 1px 0 var(--white);
  border-top: 0px solid var(--gry80);
  border-right: 0px solid var(--gry80);
  border-bottom: 1px solid var(--gry80);
  border-left: 0px solid var(--gry80);
}

.darkmode [placeholder], 
.darkmode [placeholder], 
.darkmode [placeholder] {
    color: var(--white);
}

.darkmode .widget label,
.darkmode .widget-fineuploader label,
.darkmode .widget-fineuploader span {
    color: var(--white);
}

.darkmode .fineuploader-wrapper .qq-upload-drop-area {
    background-color: var(--black);
}

.darkmode .pagination a,
.darkmode .mod_newsmenu a {
    color: var(--white) !important;
}


.darkmode footer,
.darkmode footer .boxWrapper {
    background-color: var(--black) !important;
}


.darkmode a.invisible:focus, 
.darkmode span.invisible:focus, 
.darkmode .skip-link:focus {
  color: var(--white) !important;
}


@media (max-width: 1097px) {
  body.darkmode.nav-is-mobile .navigation-main ul {
    background-color: var(--black);
  }
}