/*
    List of All Colors
    (sorted using: https://elektrobild.org/tools/sort-colors)
*/
.hero {
  width: 100%;
  height: 735px;
  max-width: 100%;
}
@media (min-width: 1200px) {
  .hero {
    height: 900px;
  }
}
.hero__video {
  z-index: 5;
  -o-object-fit: cover;
     object-fit: cover;
  height: 750px;
}
@media (min-width: 1200px) {
  .hero__video {
    height: 925px;
  }
}
.hero__overlay {
  position: absolute;
  z-index: 10;
  top: 0;
  left: 0;
  height: 105%;
  width: 100%;
  background: linear-gradient(to bottom, transparent, #151949);
}
.hero__container {
  z-index: 10;
}
.hero__container__h1 {
  max-width: 450px;
}
.hero__container__text {
  color: #FFFFFF;
  font: normal normal 400 36px/42px "poppins-regular";
}
@media (min-width: 992px) {
  .hero__container__text {
    font: normal normal 400 46px/56px "poppins-regular";
  }
}
.hero__container__text :last-child {
  animation-name: lastWord;
  animation-fill-mode: forwards;
  animation-duration: 1.5s;
}
.hero__container__text__sub {
  transform: translateX(-100vw);
  animation-name: subText;
  animation-duration: 3s;
  animation-delay: 0s;
  animation-iteration-count: 1;
}
@keyframes lastWord {
  0% {
    transform: translateX(-100vw);
  }
  50% {
    transform: translateX(0vw);
  }
  100% {
    transform: translateX(0vw);
  }
}
@keyframes subText {
  0% {
    transform: translateX(-100vw);
  }
  25% {
    transform: translateX(0vw);
  }
  75% {
    transform: translateX(0vw);
  }
  100% {
    transform: translateX(100vw);
  }
}
.hero__container__scroll-circle {
  height: 50px;
  width: 50px;
  border: 3px dotted #FFCA00;
  border-radius: 50%;
}
.hero__container__line {
  height: 50px;
  border-left: solid #FFCA00 3px;
  animation-name: scaleLine;
  animation-duration: 10s;
  animation-timing-function: ease-in-out;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  transform-origin: top;
  bottom: 15px;
}
@keyframes scaleLine {
  0% {
    transform: scaleY(1);
  }
  5% {
    transform: scaleY(2);
  }
  15% {
    transform: scaleY(1);
  }
  55% {
    transform: scaleY(1);
  }
  60% {
    transform: scaleY(2);
  }
  65% {
    transform: scaleY(1);
  }
  100% {
    transform: scaleY(1);
  }
}
.hero__container__chevron {
  right: 2.5px;
  bottom: 32px;
  animation-name: translateChevron;
  animation-duration: 10s;
  animation-timing-function: ease-in-out;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  transform-origin: top;
}
@keyframes translateChevron {
  0% {
    transform: translateY(0);
  }
  5% {
    transform: translateY(50px);
  }
  15% {
    transform: translateY(0);
  }
  55% {
    transform: translateY(0);
  }
  60% {
    transform: translateY(50px);
  }
  65% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(0);
  }
}
.hero__container__chevron::before {
  border-style: solid;
  border-width: 0.15em 0.15em 0 0;
  content: "";
  display: inline-block;
  height: 1rem;
  left: 0.15em;
  position: relative;
  top: 0.15em;
  transform: rotate(-45deg);
  vertical-align: top;
  width: 1rem;
  top: 0;
  transform: rotate(135deg);
  color: #FFCA00;
}
.hero__audio {
  max-width: 1440px;
  bottom: 4vw;
  width: 100%;
}
@media (min-width: 768px) {
  .hero__audio {
    width: 80%;
  }
}
.hero__audio__image {
  z-index: 15;
  cursor: pointer;
}