#nb-megashark {
  max-height: 90%;
  background-image: linear-gradient(rgba(0, 0, 0, .2), rgba(0, 0, 0, .1)), url('../images/hero-cover-2000.jpg') !important
}

.nb-megashark--billboard {
  width: 90%
}

.nb-megashark--billboard h2,
.nb-megashark--billboard h3 {
  color: #fff
}

@media screen and (max-width: 850px) {

  #nb-megashark {
    max-height: none
  }

  #nb-megashark {
    background-image: none !important;
  }

  .nb-megashark--billboard h2 {
    font-size: 4em
  }

  .nb-megashark--billboard h3 {
    display: none !important;
  }

  .nb-megashark--billboard {
    background-image: linear-gradient(rgba(0, 0, 0, .2), rgba(0, 0, 0, .1)), url('../images/hero-cover-800.jpg') !important;
    background-size: cover !important;
    background-position: top center !important;
    background-repeat: no-repeat;
    text-align: left !important;
    width: 100%;
    /* min-height: 300px; */
    padding: 80px 0;
  }

  .nb-megashark--billboard h2 {
    width: 60%;
    padding-left: 20px;
  }

}

@media screen and (max-width: 600px) {

  .nb-megashark--billboard {
    min-height: auto
  }

  .nb-megashark--billboard h2 {
    font-size: 3em
  }

  .nb-megashark--billboard {
    padding: 60px 0;
  }

  .nb-megashark--billboard h2 {
    width: 80%;
  }

}