:root {
  --asd-background: #3c3f46;
  --asd-green: #c3d200;
  --asd-green-hover: #1ABC9C;
  --headline-color: #c3d200;
}

.asd-hero {
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  position: relative;
  --font-size: 1rem;
  --text-color: white;
}
.asd-hero .video-bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.asd-hero .video-bg video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.asd-hero .video-bg video.mobile {
  display: none;
}
@media screen and (max-width: 767px) {
  .asd-hero .video-bg video {
    display: none;
  }
  .asd-hero .video-bg video.mobile {
    display: block;
  }
}
.asd-hero .content {
  --font-size: 2rem;
  position: relative;
  z-index: 2;
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: min(800px, 80vw);
  margin: 0 auto;
  color: var(--text-color);
  font-size: var(--font-size);
}
.asd-hero .content h1, .asd-hero .content h2, .asd-hero .content h3, .asd-hero .content h4, .asd-hero .content h5, .asd-hero .content h6 {
  --text-color: #ffffff;
  color: var(--text-color);
}
.asd-hero .content h1 {
  --font-size: 4.2rem;
  font-size: var(--font-size);
  text-shadow: 0 0 2px black;
}
.asd-hero .text {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.asd-hero .text > .row {
  width: calc(100% + 30px);
}
.asd-hero a {
  --text-color: var(--asd-green);
  color: var(--text-color);
  transition: color 0.2s ease-in-out;
}
.asd-hero a:hover {
  --text-color: var(--asd-green-hover);
}

.timer {
  --font-size: 5rem;
  --gap: calc(var(--font-size) / 2);
  --text-color: var(--asd-green);
  --text-color-light: #FFFFFF22;
  font-weight: bold;
  display: flex;
  width: 100%;
  max-width: calc(var(--font-size) * 9);
  height: fit-content;
  padding-bottom: calc(2 * var(--gap));
  margin: var(--gap) auto;
  gap: var(--gap);
  justify-content: center;
  align-items: center;
  transition: opacity 0.4s ease-in-out;
}
.timer.noshow {
  opacity: 0;
}
.timer.half-blur > div {
  text-shadow: 0 0 0.15em var(--text-color), 0 0 0.25em var(--text-color-light);
}
.timer.blur > div {
  text-shadow: 0 0 0.25em var(--text-color), 0 0 0.35em var(--text-color-light), 0 0 0.55em var(--text-color-light);
}
.timer > div {
  position: relative;
  text-align: center;
  font-size: var(--font-size);
  color: var(--text-color);
  flex: 1;
  min-width: calc(2 * var(--font-size) / 5);
}
.timer > div::before {
  font-size: 0.8em;
  line-height: 1.8;
  position: absolute;
  content: ":";
  animation: blink 2s infinite;
  right: calc(var(--gap) / -2);
  transform: translateX(50%);
  color: rgba(210, 215, 85, 0.5725490196);
}
.timer > div:last-child::before {
  display: none;
}
.timer > div::after {
  display: block;
  font-size: 0.35em;
  content: attr(data-title);
}
.timer > div[data-title-replaced]::after {
  content: attr(data-title-replaced);
}

#wrapper.pagetype--5 ~ .slide-out-wrap {
  display: none;
}
#wrapper.pagetype--5 .content-wrap {
  padding-top: 0;
  background: var(--asd-background);
  --text-color: white;
  --header-color: var(--text-color);
}
#wrapper.pagetype--5 .section {
  background-color: var(--asd-background);
}
#wrapper.pagetype--5 h1, #wrapper.pagetype--5 h2, #wrapper.pagetype--5 h3, #wrapper.pagetype--5 h4, #wrapper.pagetype--5 h5, #wrapper.pagetype--5 h6 {
  color: var(--header-color);
}
#wrapper.pagetype--5 h1.green, #wrapper.pagetype--5 h2 {
  --header-color: var(--asd-green);
}
#wrapper.pagetype--5 h2.header-black {
  --header-color: black;
}
#wrapper.pagetype--5 p,
#wrapper.pagetype--5 header .subheader-h1, #wrapper.pagetype--5 header .subheader-h2, #wrapper.pagetype--5 header .subheader-h3, #wrapper.pagetype--5 header .subheader-h4, #wrapper.pagetype--5 header .subheader-h5, #wrapper.pagetype--5 header .subheader-h6 {
  color: var(--text-color);
}
#wrapper.pagetype--5 form input[type=submit] {
  background: var(--header-color);
}
#wrapper.pagetype--5 form input[type=submit]:hover, #wrapper.pagetype--5 form input[type=submit]:active, #wrapper.pagetype--5 form input[type=submit]:focus {
  --header-color: var(--asd-green-hover);
}
#wrapper.pagetype--5 .button.button-default {
  --header-color: var(--asd-green);
  background-color: var(--header-color) !important;
  color: white;
  text-shadow: 1px 1px 4px black;
}
#wrapper.pagetype--5 .button.button-default:hover, #wrapper.pagetype--5 .button.button-default:active, #wrapper.pagetype--5 .button.button-default:focus {
  --header-color: var(--asd-green-hover);
}
#wrapper.pagetype--5 .text-green {
  color: var(--asd-green);
}

/*# sourceMappingURL=asd.css.map */


