header.dark,
section.dark,
footer.dark {
  background-color: var(--dark-blue);
  border-color: var(--grey);
  color: var(--grey);
  fill: var(--grey);
}
section.dark label {
  background-color: var(--dark);
}

.dark svg {
  fill: var(--grey);
}

section.dark .subtheme {
  background-color: var(--grey);
  color: var(--dark-blue);
  border-color: var(--dark-blue);
}
section.dark .subtheme a.button:hover,
section.dark .subtheme.hover:hover {
  background-color: var(--dark-blue) !important;
  color: var(--yellow) !important;
}


section.beige {
  background-color: var(--beige);
  border-color: var(--dark-blue);
  color: var(--dark-blue);
}
section.beige .subtheme {
  background-color: var(--dark-blue);
  color: var(--beige);
  border-color: var(--beige);
  fill: var(--beige);
}
section.beige .subtheme svg {
  fill: var(--beige);
}

section.beige .subtheme a.button:hover,
section.beige .subtheme.hover:hover {
  background-color: var(--beige) !important;
  color: var(--dark-blue) !important;
}
section.beige .subtheme.hover:hover svg {
  fill: var(--dark-blue);
}


section.yellow {
  background-color: var(--yellow);
  border-color: var(--dark-blue);
  color: var(--dark-blue);
}
section.yellow .subtheme {
  background-color: var(--dark-blue);
  color: var(--yellow);
  border-color: var(--yellow);
  fill: var(--yellow);
}
section.yellow .subtheme svg {
  fill: var(--yellow);
}

section.yellow .subtheme a.button:hover,
section.yellow .subtheme.hover:hover {
  background-color: var(--yellow) !important;
  color: var(--dark-blue) !important;
}
section.yellow .subtheme.hover:hover svg {
  fill: var(--dark-blue);
}


section.red {
  background-color: var(--red);
  border-color: var(--dark-blue);
  color: var(--dark-blue);
}
section.red .subtheme {
  background-color: var(--dark-blue);
  color: var(--red);
  border-color: var(--red);
}
section.red .subtheme svg {
  fill: var(--red);
}

section.red .subtheme a.button:hover,
section.red .subtheme.hover:hover {
  background-color: var(--red) !important;
  color: var(--dark-blue) !important;
}
section.red .subtheme.hover:hover svg {
  fill: var(--dark-blue);
}

section.grey {
  background-color: var(--grey);
  border-color: var(--dark-blue) !important;
  color: var(--dark-blue) !important;
}
section.grey .subtheme {
  background-color: var(--dark-blue);
  color: var(--grey);
  border-color: var(--grey);
  fill: var(--grey);
}
section.grey .subtheme a {
  color: inherit !important;
}

section.grey .subtheme svg {
  fill: var(--grey);
}

section.grey .subtheme a.button:hover,
section.grey .subtheme.hover:hover {
  background-color: var(--grey) !important;
  color: var(--dark-blue) !important;
}
section.grey .subtheme.hover:hover svg {
  fill: var(--dark-blue);
}

header.beige,
footer.beige,
section.beige-font {
  background-color: var(--dark-blue);
  color: var(--beige);
  border-color: var(--beige);
}

header.yellow,
footer.yellow,
section.yellow-font {
  background-color: var(--dark-blue);
  color: var(--yellow);
  border-color: var(--yellow);
  fill: var(--yellow);
}
header.red,
footer.red,
section.red-font {
  background-color: var(--dark-blue);
  color: var(--red);
  border-color: var(--red);
  fill: var(--red);
}
header.red a:hover:not(.injected-logo),
footer.red a:hover:not(.injected-logo),
header.red .main-navigation .main-nav ul li[class*="current-menu-"] > a {
  background-color: var(--red) !important;
  color: var(--dark-blue) !important;
}

header.yellow svg,
footer.yellow svg {
  fill: var(--yellow);
}
header.red svg,
footer.red svg {
  fill: var(--red);
}
header.beige svg,
footer.beige svg {
  fill: var(--beige);
}

header.dark,
header.beige,
header.yellow,
header.red,
header.grey {
  background-color: transparent !important;
}

@media screen and (max-width: 768px) {
  html.mobile-menu-open header {
    background-color: var(--dark-blue) !important;
  }
}

section.dark button:hover,
section.dark .button:hover {
  background-color: var(--grey) !important;
  color: var(--dark-blue) !important;
}
header.dark a:hover:not(.injected-logo),
footer.dark a:hover:not(.injected-logo),
header.dark .main-navigation .main-nav ul li[class*="current-menu-"] > a,
footer.dark .main-navigation .main-nav ul li[class*="current-menu-"] > a {
  background-color: var(--grey) !important;
  color: var(--dark-blue) !important;
}

section.dark.yellow-font button:hover,
section.dark.yellow-font .button:hover,
header.yellow a:hover:not(.injected-logo),
footer.yellow a:hover:not(.injected-logo),
header.yellow .main-navigation .main-nav ul li[class*="current-menu-"] > a,
footer.yellow .main-navigation .main-nav ul li[class*="current-menu-"] > a {
  background-color: var(--yellow) !important;
  color: var(--dark-blue) !important;
}

header.beige a:hover:not(.injected-logo),
footer.beige a:hover:not(.injected-logo),
header.beige .main-navigation .main-nav ul li[class*="current-menu-"] > a,
footer.beige .main-navigation .main-nav ul li[class*="current-menu-"] > a {
  background-color: var(--beige) !important;
  color: var(--dark-blue) !important;
}

section.beige button:hover,
section.beige .button:hover {
  background-color: var(--dark-blue) !important;
  color: var(--beige) !important;
}
section.beige label {
  background-color: var(--red);
}

section.yellow button:hover,
section.yellow .button:hover {
  background-color: var(--dark-blue) !important;
  color: var(--yellow) !important;
}

section.yellow label {
  background-color: var(--yellow);
}

section.red button:hover,
section.red .button:hover,
section.red input[type="submit"]:hover {
  background-color: var(--dark-blue) !important;
  color: var(--red) !important;
}
section.red label {
  background-color: var(--red);
}

section.grey button:hover,
section.grey .button:hover,
section.grey input[type="submit"]:hover {
  background-color: var(--dark-blue) !important;
  color: var(--grey) !important;
}
section.grey label {
  background-color: var(--grey);
}

section.yellow-font button:hover,
section.yellow-font .button:hover {
  background-color: var(--dark-blue) !important;
  color: var(--yellow) !important;
}
/* 
header svg,
footer svg {
  fill: var(--grey) !important;
} */