#banner {
  overflow: hidden;
  width: 100%;
  height: 500px;
  margin-top: 60px;
  position: relative;
  clear: both;
  -webkit-background-size: 100%;
  -moz-background-size: 100%;
  -o-background-size: 100%;
  background-size: 100%;
  background-position: top center
}

.wrap-center {
  margin: 0 auto;
  position: relative;
}

.banner-centered {
  text-align: center;
  position: absolute;
  display: table;
  width: 100%;
  height: 500px;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.1);
}

.banner-centered h2 {
  font-size: 60px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #ffffff;
  font-weight: 300;
  display: table-cell;
  vertical-align: middle;
}

.about-us-head {
  background: transparent url(../images/about-head.jpg) no-repeat fixed;
}
.contact-head {
  background: transparent url(../images/contact-head.jpg) no-repeat fixed;
}
.best-local-head {
  background: transparent url(../images/best-local.jpg) no-repeat fixed;
}
.patio-head {
  background: transparent url(../images/patio-head.jpg) no-repeat fixed;
}
.the-bar-head {
  background: transparent url(../images/the-bar-head.jpg) no-repeat fixed;
}
.gift-card-head {
  background: transparent url(../images/gift-card-head.jpg) no-repeat fixed;
}
.events-head {
  background: transparent url(../images/events-head.jpg) no-repeat fixed;
}
.gallery-head {
  background: transparent url(../images/gallery-head.jpg) no-repeat fixed;
}
.lunch-head {
  background: transparent url(../images/lunch-head.jpg) no-repeat fixed;
}
.dinner-head {
  background: transparent url(../images/dinner-head.jpg) no-repeat fixed;
}
.dessert-head {
  background: transparent url(../images/dessert-head.jpg) no-repeat fixed;
}
.to-go-head {
  background: transparent url(../images/to-go-head.jpg) no-repeat fixed;
}
.off-premise-head {
  background: transparent url(../images/off-premise-head.jpg) no-repeat fixed;
}
.events-restaurant-head {
  background: transparent url(../images/events-restaurant-head.jpg) no-repeat fixed;
}
.calm-bakes-head {
  background: transparent url(../images/calm-bakes-head.jpg) no-repeat fixed;
}
.catering-head {
  background: transparent url(../images/calm-bakes-head.jpg) no-repeat fixed;
}
.catering-tray-head {
  background: transparent url(../images/catering-tray-head.jpg) no-repeat fixed;
}
.bar-services-head {
  background: transparent url(../images/bar-services-head.jpg) no-repeat fixed;
}
.pizza-truck-head {
  background: transparent url(../images/pizza-truck-head.jpg) no-repeat fixed;
}
.pizza-truck {
  background: transparent url(../images/pizza-truck.jpg) no-repeat fixed;
}

@media screen and (max-width: 1024px) {
  #banner {
    height: 400px;
    margin-top: 48px;
    background-size: 100%;
    background-position: top center
  }
  .banner-centered {
    height: 400px;
  }
}

@media screen and (max-width: 768px) {
  #banner {
    height: 250px;
  }
  .banner-centered {
    height: 250px;
  }
  .banner-centered h2 {
    font-size: 30px;
  }
}

@media screen and (max-width: 600px) {
  #banner {
    height: 145px;
  }
  .banner-centered {
    height: 145px;
  }
}