/* -----------------------------------
  1. Typography
  2. Custom Padding
  3. Box shadow and image overlay
  4. Global Link Style
  5. Global media query
  6. Body
  7. Button
  9. Header section
  10. Booking form
  11. About section
  12. Services Section
  13. Menu Section
  14. Vid background Section
  15. Gallery Section
  15. Chefs Form
  16. Contact section
  17. Footer section 
  18. Go to Top
  19. Preloader
  20. Navigation
  21. Social Icons
    
-----------------------------------------*/
.heading-primary {
    font-family: "Dancing Script", cursive;
    font-size: 5rem;
}

.heading-secondary {
    font-family: "Merriweather Sans", sans-serif;
    font-size: 4rem;
}

.heading-tertiary {
    font-family: "Merriweather Sans", sans-serif;
    font-size: 3rem;
}

.heading-quaternary {
    font-family: "Merriweather Sans", sans-serif;
    font-size: 2.5rem;
}

.heading-tag {
    font-family: "Merriweather Sans", sans-serif;
    font-size: 1.2rem;
    font-weight: 400;
}

.paragraph {
    font-size: 1.8rem;
}

.paragraph:not(:last-child) {
    margin-bottom: 3rem;
}

/*--------------------------------------------------------------
* custom padding
----------------------------------------------------------------*/
.section-padding {
    padding: 16rem 6rem;
}

/*----- width < 991px ----- */
@media only screen and (max-width: 61.94em) {
    .section-padding {
        padding: 12rem 6rem;
    }
}

/*----- width < 768px -----*/
@media only screen and (max-width: 48em) {
    .section-padding {
        padding: 10rem 4rem;
    }
}

/*----- width < 480px -----*/
@media only screen and (max-width: 30em) {
    .section-padding {
        padding: 8rem 2rem;
    }
}

.banner-padding {
    padding: 10rem 6rem;
}

/*----- width < 991px -----*/
@media only screen and (max-width: 61.94em) {
    .banner-padding {
        padding: 8rem;
    }
}

/*----- width < 768px -----*/
@media only screen and (max-width: 48em) {
    .banner-padding {
        padding: 6rem 4rem;
    }
}

/*----- width < 480px -----*/
@media only screen and (max-width: 30em) {
    .banner-padding {
        padding: 4rem 2rem;
    }
}

/*--------------------------------------------------------------
* Box shadow and image overlay variable declaratives
----------------------------------------------------------------*/
*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
}

/*--------------------------------------------------------------
* Global link decoration declarative
----------------------------------------------------------------*/
a {
    text-decoration: none;
    color: inherit;
}

a:hover {
    text-decoration: none;
    color: inherit;
}

/*--------------------------------------------------------------
* Global media query declarative
----------------------------------------------------------------*/
html {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 62.5%;
}

/*----- width < 1200px -----*/
@media only screen and (max-width: 75em) {
    html {
        font-size: 56.25%;
    }
}

/*----- width < 991px -----*/
@media only screen and (max-width: 61.94em) {
    html {
        font-size: 53.13%;
    }
}

/*----- width < 480px -----*/
@media only screen and (max-width: 30em) {
    html {
        font-size: 50%;
    }
}

/*--------------------------------------------------------------
* Body background and font properties
----------------------------------------------------------------*/
body {
    font-family: "Merriweather Sans", sans-serif;
    color: #f9f7f6;
    font-size: 1.6rem;
    background-color: #320000;
    line-height: 1.6;
    letter-spacing: .08rem;
    font-weight: 400;
}

button {
    border: none;
}

button:active,
:focus {
    border: none;
}

.btn-boco {
    background-color: #E8B400;
    border-radius: .2rem;
    color: #f9f7f6;
    padding: 1rem 2rem;
    margin: 2rem 0;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.btn-boco:hover {
    background-color: #A37E00;
    cursor: pointer;
}

.btn-boco-outline {
    border: 0.1rem solid #870000;
    border-radius: .2rem;
    color: #870000;
    padding: 1rem 2rem;
    margin: 2rem 0;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.btn-boco-outline:hover {
    background-color: #870000;
    color: #f9f7f6;
    cursor: pointer;
}

.header {
    min-height: 100vh;
    position: relative;
}

.header__container {
    margin-top: 10rem;
}

.header__container .heading-primary {
    font-size: 8rem;
    z-index: 10;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

/*----- width < 768px -----*/
@media only screen and (max-width: 48em) {
    .header__container .heading-primary {
        font-size: 6rem;
    }
}

/*----- width < 480px -----*/
@media only screen and (max-width: 30em) {
    .header__container .heading-primary {
        font-size: 4rem;
    }
}

.header__container .paragraph {
    font-family: "Dancing Script", cursive;
    font-size: 2.5rem;
}

.booking-form {
    padding: 1rem 2rem;
    border-radius: .2rem;
    background-color: rgba(5, 3, 7, 0.7);
}

.booking-form__input {
    height: 4rem;
    width: 100%;
    padding: 2rem .5rem;
    margin: 1rem 0;
    border-radius: .2rem;
    color: #f9f7f6;
    background-color: rgba(5, 3, 7, 0.6);
    border: none;
}

.booking-form .btn-boco {
    width: 100%;
}

.booking-form .form__input {
    height: 4rem;
    width: 100%;
    margin: 1rem 0;
    border-radius: .2rem;
    color: #f9f7f6;
    background-color: rgba(5, 3, 7, 0.6);
    border: none;
}

/*------------ scroll down -------------*/
.scrolldown {
    position: absolute;
    bottom: 0;
    right: 0;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-transform-origin: right top 0;
    -ms-transform-origin: right top 0;
    transform-origin: right top 0;
    float: right;
}

.scrolldown i {
    padding-left: .9rem;
}

.scrolldown a:hover,
.scrolldown a:focus,
.scrolldown a:active {
    color: #E8B400 !important;
}

.scroll-icon {
    display: inline-block;
    font-size: 1.4rem;
    text-transform: uppercase;
    letter-spacing: .3rem;
    color: #f9f7f6 !important;
    background: transparent;
    position: relative;
    top: 3.6rem;
    right: 4.2rem;
    -webkit-animation: animate-it 3s ease infinite;
    animation: animate-it 3s ease infinite;
}

/*----------- vertical animation ------------*/
@-webkit-keyframes animate-it {

    0%,
    60%,
    80%,
    100% {
        -webkit-transform: translateX(0);
    }

    20% {
        -webkit-transform: translateX(-5px);
    }

    40% {
        -webkit-transform: translateX(20px);
    }
}

@keyframes animate-it {

    0%,
    60%,
    80%,
    100% {
        -webkit-transform: translateX(0);
    }

    20% {
        -webkit-transform: translateX(-5px);
    }

    40% {
        -webkit-transform: translateX(20px);
    }
}

/*--------------------------------------------------------------
* Home page header background image transition effect (can be used anywhere with this class)
----------------------------------------------------------------*/
.slideshow {
    background: url(../img/hero-01.jpg) no-repeat center;
    background-size: cover;
    background-blend-mode: darken;
    -webkit-transition: 3s;
    -o-transition: 3s;
    transition: 3s;
}

/*--------------------------------------------------------------
* About section
----------------------------------------------------------------*/
.about {
    min-height: 100vh;
    background-color: #f9f7f6;
    color: #616060;
}

.about .heading-primary {
    color: #870000;
    font-weight: 700;
    margin-bottom: 2rem;
}

.about__img {
    width: 100%;
}

/*--------------------------------------------------------------
* Services section
----------------------------------------------------------------*/
.services {
    min-height: 50vh;
    position: relative;
}

.services__content {
    margin-bottom: 4rem;
}

.services__text {
    text-align: center;
}

.services .heading-tertiary {
    font-family: "Dancing Script", cursive;
    margin-bottom: 2rem;
}

.services__icon {
    width: 8rem;
    height: 8rem;
    border-radius: 50%;
    margin: 0 auto;
    padding: 1rem;
    margin-bottom: 2rem;
    background-color: #E8B400;
}

.services__img {
    width: 100%;
}

/*--------------------------------------------------------------
* Menu section
----------------------------------------------------------------*/
.menu {
    min-height: 100vh;
    background-color: #f9f7f6;
}

.menu__content {
    margin-bottom: 4rem;
    color: #616060;
    text-align: center;
}

.menu__list {
    list-style: none;
}

.menu__list .active {
    background-color: #870000;
    color: #f9f7f6;
}

.menu__item {
    display: inline-block;
}

.menu__img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    display: block;
}

.menu__container {
    margin-top: 2rem;
    padding: 1rem;
    color: #616060;
}

.menu__container--img {
    width: 20rem;
    display: block;
}

.menu__container--text {
    margin-left: 2rem;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.menu__container--text .heading-tertiary {
    font-family: "Dancing Script", cursive;
    color: #870000;
}

/*--------------------------------------------------------------
* Video background section
----------------------------------------------------------------*/
.vid-bg {
    position: relative;
    min-height: 70vh;
    border-top: 1rem solid #E8B400;
    border-bottom: 1rem solid #E8B400;
    overflow: hidden;
}

.vid-bg .fullscreen-video-wrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 60vh;
    overflow: hidden;
}

.vid-bg .fullscreen-video-wrap video {
    min-height: 100%;
    min-width: 100%;
}

.vid-bg__content {
    z-index: 10;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
}

.vid-bg__content .heading-primary {
    font-size: 8rem;
}

/*--------------------------------------------------------------
* Gallery section
----------------------------------------------------------------*/
.gallery {
    min-height: 100vh;
    position: relative;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.gallery .heading-primary {
    font-size: 8rem;
}

.gallery__one {
    min-height: inherit;
    background: url(../img/gallery-01.png) no-repeat right fixed #ffffff;
    background-size: cover;
    text-align: left;
}

.gallery__two {
    min-height: inherit;
    background: url(../img/gallery-02.png) no-repeat left fixed;
    background-size: cover;
    text-align: right;
}

.gallery__three {
    min-height: inherit;
    background: url(../img/gallery-03.png) no-repeat right fixed #A37E00;
    background-size: cover;
    text-align: left;
}

.gallery__four {
    min-height: inherit;
    background: url(../img/gallery-04.png) no-repeat left fixed #ffffff;
    background-size: cover;
    text-align: right;
}

.gallery__five {
    min-height: inherit;
    background: url(../img/gallery-05.jpg) no-repeat right fixed;
    background-size: cover;
    text-align: left;
}

.gallery__six {
    min-height: inherit;
    background: url(../img/gallery-06.png) no-repeat left fixed #A37E00;
    background-size: cover;
    text-align: right;
}

.gallery__content {
    padding: 2rem;
    background-color: rgba(5, 3, 7, 0.5);
}

/*----- width < 991px -----*/
@media only screen and (max-width: 61.94em) {
    .gallery__content {
        background-color: rgba(135, 0, 0, 0);
    }
}

/*----- width < 991px -----*/
@media only screen and (max-width: 61.94em) {
    .gallery__overlay {
        background-color: rgba(5, 3, 7, 0.5);
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
    }
}

/*----- width < 480px -----*/
@media only screen and (max-width: 48em) {
    .gallery {
        text-align: center;
    }
}

/*--------------------------------------------------------------
* Chefs section
----------------------------------------------------------------*/
.chefs {
    min-height: 100vh;
}

.chefs__content {
    height: 40rem;
    text-align: center;
    position: relative;
}

.chefs__content figcaption {
    padding: 2rem;
    position: absolute;
    bottom: 0;
    left: 0;
    height: 0;
    color: transparent;
    overflow: hidden;
    visibility: hidden;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.chefs__content:hover figcaption {
    color: #f9f7f6;
    height: 30%;
    visibility: visible;
    background: #8E0E00;
    /* fallback for old browsers */
    background: -webkit-linear-gradient(to bottom, #1F1C18, #8E0E00);
    /* Chrome 10-25, Safari 5.1-6 */
    background: -webkit-gradient(linear, left top, left bottom, from(#1F1C18), to(#8E0E00));
    background: -webkit-linear-gradient(top, #1F1C18, #8E0E00);
    background: -o-linear-gradient(top, #1F1C18, #8E0E00);
    background: linear-gradient(to bottom, #1F1C18, #8E0E00);
    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.chefs__img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    display: block;
}

.chefs__list {
    list-style: none;
}

.chefs__item {
    display: inline-block;
    margin: 0 1rem;
}

.chefs .heading-tertiary {
    font-family: "Dancing Script", cursive;
    margin: 2rem 0;
}

/*--------------------------------------------------------------
* Contact section
----------------------------------------------------------------*/
.contact {
    min-height: 80vh;
    background-color: #ffffff;
}

.contact__img {
    width: 100%;
}

.contact .heading-tertiary {
    color: #320000;
}

.contact .paragraph {
    color: #616060;
}

.contact .contact__list {
    list-style: none;
    color: #616060;
}

.contact form {
    color: #616060;
}

.contact__cta--list {
    list-style: none;
    color: #320000;
    margin: 2rem 0;
}

.contact__cta--item {
    display: inline-block;
    margin-right: 2rem;
}

.form-group .form-control {
    -webkit-box-shadow: none;
    border-bottom: .1rem;
    border-style: none none solid none;
    border-radius: 0;
    font-size: 1.6rem;
    border-color: #320000;
}

.form-group .form-control:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    border-width: 0 0 .2rem 0;
    border-color: #320000;
}

textarea {
    resize: none;
}

/*--------------------------------------------------------------
* Footer section
----------------------------------------------------------------*/
.footer {
    background-color: #320000;
    color: #ffffff;
    /*---- Footer main ----*/
    /*---- Subscription form ----*/
}

.footer__main {
    padding: 6rem 0;
}

.footer__main .heading-quaternary {
    font-family: "Dancing Script", cursive;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 0.06rem solid rgba(249, 247, 246, 0.6);
}

.footer__main--text {
    font-size: 1.6rem;
    letter-spacing: .08rem;
    margin-bottom: 2.5rem;
}

.footer__main--link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    list-style: none;
    font-size: 1.4rem;
    line-height: 2.8rem;
}

.footer__main--link>* {
    display: inline-block;
    vertical-align: middle;
}

.footer__main--link:hover a {
    color: #E8B400;
}

.footer__main--link:active {
    color: #E8B400;
}

.footer__main--copy {
    color: #A37E00;
    font-size: 1.2rem;
    font-weight: 700;
}

.footer__main .row>* {}

/*----- width < 768px -----*/
@media only screen and (max-width: 48em) {
    .footer__main .row>* {
        margin-bottom: 4rem;
    }
}

.footer__form {
    font-size: 1.5rem;
    padding: 1.2rem 1rem;
    width: 100%;
}

.footer form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.footer form .btn__cta {
    background-color: #870000;
    padding: 1.2rem 2rem;
}

.footer-end {
    left: 0;
    bottom: 0;
    background: #870000;
}

/*--------------------------------------------------------------
* Go to Top style
----------------------------------------------------------------*/
#gotop {
    display: none;
    position: fixed;
    bottom: 3rem;
    right: 3rem;
    z-index: 99;
    border: none;
    outline: none;
    background-color: #E8B400;
    color: #f9f7f6;
    cursor: pointer;
    padding: .5rem;
    border-radius: 5rem;
    font-size: 2.5rem;
    height: 4.6rem;
    width: 4.6rem;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

#gotop:hover {
    background-color: #A37E00;
}

/*--------------------------------------------------------------
* Preloader style
----------------------------------------------------------------*/
#preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #320000;
    z-index: 999;
    height: 100%;
    width: 100%;
}

.no-js #preloader,
.oldie #preloader {
    display: none;
}

#loader {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 6rem;
    height: 6rem;
    margin: -3rem 0 0 -3rem;
    padding: 0;
}

#loader:before {
    content: "";
    border-top: 0.6rem solid rgba(255, 255, 255, 0.1);
    border-right: 0.6rem solid rgba(255, 255, 255, 0.1);
    border-bottom: 0.6rem solid rgba(255, 255, 255, 0.1);
    border-left: .6rem solid #FFFFFF;
    -webkit-animation: load 1.1s infinite linear;
    animation: load 1.1s infinite linear;
    display: block;
    border-radius: 50%;
    width: 6rem;
    height: 6rem;
}

@-webkit-keyframes load {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes load {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.navigation {
    min-height: 100vh;
    padding: 2rem;
    background: rgba(5, 3, 7, 0.4);
}

.navigation .navbar {
    z-index: 999;
}

.navigation .navbar-nav {
    background: rgba(5, 3, 7, 0);
}

/*----- width < 991px -----*/
@media only screen and (max-width: 61.94em) {
    .navigation .navbar-nav {
        background: #320000;
        -webkit-transition: background-color .5s ease 0s;
        -o-transition: background-color .5s ease 0s;
        transition: background-color .5s ease 0s;
    }
}

/*----- width < 991px -----*/
@media only screen and (max-width: 61.94em) {
    .navigation {
        text-align: center;
    }
}

.header-logo {
    width: 8rem;
}

.nav-item {
    font-size: 1.8rem;
    margin: 0 2rem;
    color: #f9f7f6;
    -webkit-transition: all .3s ease-in;
    -o-transition: all .3s ease-in;
    transition: all .3s ease-in;
}

.nav-item:hover {
    color: #E8B400;
}

.navbar-nav .active {
    color: #E8B400;
}

.dropdown-menu {
    border: none;
    background-color: rgba(5, 3, 7, 0.4);
}

.dropdown-menu .dropdown-item {
    font-size: 1.8rem;
    padding: 1rem 2rem;
    color: #f9f7f6;
    -webkit-transition: all .3s ease-in;
    -o-transition: all .3s ease-in;
    transition: all .3s ease-in;
}

.dropdown-menu .dropdown-item:hover {
    color: #320000;
}

.custom-toggler .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(249, 247, 246, 0.8)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.custom-toggler.navbar-toggler {
    border-color: #f9f7f6;
}

.nav-scroll {
    background: #320000;
    -webkit-transition: background-color .5s ease 0s;
    -o-transition: background-color .5s ease 0s;
    transition: background-color .5s ease 0s;
    position: fixed;
    top: -100px;
    left: 0;
    width: 100%;
    -webkit-transition: -webkit-transform .5s;
    transition: -webkit-transform .5s;
    -o-transition: transform .5s;
    transition: transform .5s;
    transition: transform .5s, -webkit-transform .5s;
    -webkit-transform: translateY(100px);
    -ms-transform: translateY(100px);
    transform: translateY(100px);
    -webkit-box-shadow: 0px 0px 53px -24px #870000;
    box-shadow: 0px 0px 53px -24px #870000;
    z-index: 999;
}

.nav-scroll .icon-bar {
    color: #320000;
    margin-right: 1.5rem;
}

.nav-scroll .navbar-nav .active {
    color: #E8B400 !important;
}

.social {
    padding: 2rem 0;
}

.social__list {
    list-style: none;
}

.social__item {
    font-size: 2rem;
    margin: 1rem;
    padding: 1.4rem 1.6rem;
    border-radius: 50%;
    display: inline;
    cursor: pointer;
    background: #8E0E00;
    /* fallback for old browsers */
    background: -webkit-linear-gradient(to bottom, #1F1C18, #8E0E00);
    /* Chrome 10-25, Safari 5.1-6 */
    background: -webkit-gradient(linear, left top, left bottom, from(#1F1C18), to(#8E0E00));
    background: -webkit-linear-gradient(top, #1F1C18, #8E0E00);
    background: -o-linear-gradient(top, #1F1C18, #8E0E00);
    background: linear-gradient(to bottom, #1F1C18, #8E0E00);
    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    -webkit-box-shadow: 4px 4px 29px -15px #948f94;
    box-shadow: 4px 4px 29px -15px #948f94;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.social__item:hover {
    background: #320000;
}