*{
  margin: 0px;
  padding: 0px;
}

.c-HeroSection {
  background-color: rgba(0, 0, 0, 0.5);
}

.c-HeroSection-VideoBg {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: 100%;
  min-height: 100%;
  z-index: -1;
}

.c-HeroSection-Intro {
  width: 80%;
  margin: 0px auto;
}

@media (max-width: 639px) {
  .c-HeroSection {
    min-height: 50vh;
  }

  .c-HeroSection-VideoBg{
    display: none;
  }

  .c-HeroSection-image{
    background-image: url(/driving-in-car.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    z-index: -1;
  }

  .c-HeroSection-Intro {
    width: 90%;
  }
}

@media (min-width: 640px) and (max-width: 767px) {
  .c-HeroSection {
    min-height: 63vh;
  }
}

@media (min-width: 768px) {
  .c-HeroSection {
    min-height: 30vh;
  }

  .c-HeroSection-VideoBg {
    top: 60%;
  }
}

@media (min-width: 769px) and (max-width: 1024px) {
  .c-HeroSection {
    min-height: 57vh;
  }
}

@media (min-width: 1025px) {
  .c-HeroSection {
    min-height: 70vh;
  }
}	
.c-StateCard {
  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.2);
  background-color: #000;
}

.c-StateCard img{
  height: 100%;
  opacity: .4;
}

.c-StateCard-name {
  bottom: 90px;
}

@media (min-width: 640px) and (max-width: 767px) {
  .c-StateCard-wrapper {
    display: inline-flex;
    width: 40%;
    margin: 0px 31px;
  }
}

@media (width: 768px) {
  .c-StateCard-wrapper {
    width: 29%;
  }
}

@media (min-width: 769px) {
  .c-StateCard-wrapper {
    width: 30%;
  }
}
*{
  margin: 0px;
  padding: 0px;
}

.c-StateHeroSection {
  background-color: #000000cf;
  min-height: 50vh;
}

.c-StateHeroSection-Intro {
  width: 80%;
  margin: 0px auto;
}

@media (min-width: 768px) {
  .c-StateHeroSection {
    min-height: 30vh;
  }
}
.c-SchoolCard {
  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.2);
}

@media (min-width: 640px) and (max-width: 767px) {
  .c-SchoolCard-wrapper {
    display: inline-flex;
    width: 40%;
    margin: 0px 31px;
  }
}

@media (min-width: 768px) {
  .c-SchoolCard-wrapper {
    width: 29%;
  }
}

@media (min-width: 769px) {
  .c-SchoolCard-wrapper {
    width: 30%;
  }
}