/*
Gulp not working so couldn't compile sass, so here's some hardcoded css to be fixed as I was on a deadline...
*/



/* Header */

@media screen and (min-width: 768px) {
  .home #hero-section .overlay {
    background: linear-gradient(to bottom, rgba(0,0,0,0.7), rgba(0,0,0,0), rgba(0,0,0,0), rgba(0,0,0,0));
  }
}

/* Parallax Items */

@media screen and (min-width: 768px) {

  .parallax-item.item-1 {
    max-width: 350px;
    top: 200px;
  }

  .parallax-item.item-2 {
    right: 0px;
    max-width: 293px;
  }

  .parallax-item.item-3 {
    top: -500px;
  }

  .parallax-item.item-4 {
    top: 520px;
    right: 30px;
    max-width: 470px;
    height: 338px;
  }

  .parallax-item.item-7 {
    max-width: 184px;
    height: 267px;
    top: -150px;
  }

  .parallax-item.item-8 {
    top: -250px;
    max-width: 529px;
  }

  .parallax-item.item-9 {
    left: auto;
    right: 0;
    top: 0;
  }

  .parallax-item.item-10 {
    left: 0;
    max-width: 243px;
    top: -180px;
  }

  .parallax-item.item-11 {
    left: 0;
    top: 550px;
    max-width: 320px;
    width: 320px;
  }

  .parallax-item.item-11 svg {
    width: 320px;
  }

  .parallax-item.item-12 {
    top: -200px;
    right: 40px;
    max-width: 410px;
  }

}



/* Our Bars */

.home #our-bars {
  padding-top: 120px;
}

/* Drinks and Food */

.home #menu-section {
  padding-top: 100px !important;
}

.home #menu-section .diamond-content-section:before {
  border-color: #B0D6CA !important;
}

.home #menu-section .diamond-content-section 

.home #menu-section .diamond-content-section:after {
  background: #B0D6CA !important;
}

.home #menu-section .menus .menu .menu-btn {
  border-color: #E5C8C1 !important;
  color: #E5C8C1 !important;
}

#menu-section .menus .menu:hover .menu-btn {
  border-color: #FB4D6A !important;
  color: #FB4D6A !important;
}

#menu-section .menus .menu:hover:after {
  border-color: #FB4D6A !important;
}

.main-hero.inner-hero .page-title {
  z-index: 30;
}

.main-hero.inner-hero .booking-widget {
  bottom: 0;
  background-color: rgba(136,32,53,0.8);
}

@media screen and (max-width: 768px) {
  .page-template-page-offers .inner-hero.main-hero.with-widget {
    height: 680px;
  }
}

@media screen and (max-width: 768px) {
  .page-template-page-offers .inner-hero.main-hero.with-widget .page-title {
    top: 40%;
  }
}