.main-banner {
  background: linear-gradient(rgba(0,0,0,.8), rgba(0,0,0,.1)), url("/runswick-bay_sm.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}

@media (min-width: 767px) {
  .main-banner {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("/runswick-bay.jpg");
    background-size: cover;
    background-position: center center;
  }
}