@media (min-width: 768px) {
  #hero {
    width: 100%;
    height: 100vh;
    color: var(--bs-white);
    background: url("../../assets/img/hero.jpg") center / cover no-repeat;
  }
}

#hero {
  max-width: 100%;
  height: 100vh;
  background: url("../../assets/img/hero.jpg") center / cover no-repeat;
}

#title {
  font-size: 60px;
  font-weight: bold;
  font-style: italic;
  text-align: center;
  padding-top: 280px;
  background: transparent;
}

#video-and-stats {
  text-align: center;
  background: var(--bs-emphasis-color);
}

#showreel-main {
  color: var(--bs-white);
  padding-top: 20px;
  padding-bottom: 10px;
}

h1 {
  color: var(--bs-white);
  background: var(--bs-gray-800);
  text-align: center;
  padding-top: 20px;
  padding-bottom: 10px;
  border-color: var(--bs-gray);
}

#description-1 {
  width: 80%;
  padding-top: 20px;
  text-align: center;
  padding-left: 150px;
}

#description-1 {
  background: var(--bs-gray);
}

#main-description {
  background: var(--bs-gray-400);
}

#about-jd {
  background: transparent;
  padding-top: 20px;
  padding-left: 30px;
  padding-right: 20px;
}

#sub-title {
  background: none;
  font-size: 30px;
  text-align: center;
}

#about {
}

#paragraph-one {
  text-align: center;
  padding-top: 20px;
  padding-left: 82px;
  padding-right: 78px;
  font-size: 20px;
  padding-bottom: 40px;
}

#skillset {
  font-size: 30px;
  text-align: center;
  background: var(--bs-gray-500);
}

#sub-heading {
}

#creative-head {
}