:root {
  --lightgrey: rgba(235,235,235,1);
  --lightgrey-95: rgba(235,235,235,0.95);
  --ci-color1: rgba(255,203,15,1);
  --ci-color2: rgba(214,15,60,1);
  --cta-color: rgba(214,15,60,1);
}
#header, #footer {
  background-color: var(--white);
}
#logo {
  aspect-ratio: 1 / 1;
  width: 3em;
  background-image: url("../../userlibrary/turmdersinne/tds-logo.webp");
}
.scrolled #logo {
  width: 2em;
}
#mainnavi, #helpnavi {
  font-weight: var(--fontbold);
}
#mainnavi a:hover, #footernavi a:hover, #helpnavi:hover, #helpclose:hover {
  color: var(--ci-color1);
}
@media screen and (min-width: 1024px) {
  #mainnavi ul.level_2 {
    background-color: var(--white-95);
  }
}
#main {
  background-color: var(--lightgrey);
}
.herotext > * {
  max-width: unset;
}
.herotext h1, .herotext h3 {
  text-transform: none;
}
@media screen and (min-width: 1280px) {
  .herotext h1 {
    font-size: 4.5em;
  }
}
@media screen and (max-width: 1023px) {
  .hero-fullheight .herotext {
    padding-bottom: 0;
  }
}
#main a.cta-button {
  background-color: var(--white);
}
.play-button, .progressBar, .volumeFill {
  background-color: var(--ci-color1);
}
@media (orientation: portrait) {
  .heroimage, .hero-fullheight .heroimage {
	  height: 50vw;
    min-height: 15em;
  }
}