.hero-container video {
  object-fit: cover;
  width: 100%;
  height: 80vh;
  position: fixed;
  z-index: -1;
}

.hero-container {
  /* background: url('/images/img-home.jpg') center center/cover no-repeat; */
  height: 80vh;
  width: 100%;
  object-fit: contain;
  /* top: -110px; */
  background: rgba(5, 5, 5, 0.6);
  position: relative;
}

.hero-carousel {
  /* border: 1px solid blue; */
  padding-top: 200px;
}
.carouselBody {
  padding: 50px;
}
.carouselBody > h1 {
  font-size: 5rem;
  color: #fff;
}
.carouselBody > p {
  font-size: 2rem;
  color: #fff;
}

.hero-btns {
  margin-top: 32px;
}

.hero-btns .btn {
  margin: 6px;
}

.fa-play-circle {
  margin-left: 4px;
}

@media screen and (max-width: 960px) {
  .hero-container > h1 {
    font-size: 70px;
    margin-top: -150px;
  }
}
@media screen and (min-width: 2000px) {
  .hero-container {
    height: 60vh;
  }
  .hero-carousel {
    padding-top: 300px;
    padding-left: 100px;
  }
}

@media screen and (max-width: 768px) {
  .hero-carousel {
    padding-top: 100px;
  }
  .carouselBody > h1 {
    font-size: 4rem;
    /* margin-top: -100px; */
  }

  .carouselBody > p {
    font-size: 2rem;
  }

  .btn-mobile {
    display: block;
    text-decoration: none;
  }

  .btn {
    width: 100%;
  }
}
@media screen and (min-width: 2000px) {
  .hero-carousel {
    /* border: 1px solid red; */
    width: 60vw;
    margin-left: 20vw;
    padding-top: 300px;
  }
}

@media screen and (max-width: 500px) {
  .hero-carousel {
    padding-top: 100px;
  }
}