@charset "utf-8";

/* CSS Document */


/******************************

[Table of Contents]

1. 1600px
2. 1440px
3. 1380px
4. 1280px
5. 1199px
6. 1100px
7. 1024px
8. 991px
9. 959px
10. 880px
11. 768px
12. 767px
13. 575px
14. 539px
15. 480px
16. 479px
17. 400px

******************************/


/************
1. 1600px
************/

@media only screen and (max-width: 1600px) {
    .intro_content {
        width: 600px;
        right: -100px;
    }
}


/************
2. 1440px
************/

@media only screen and (max-width: 1440px) {}


/************
3. 1380px
************/

@media only screen and (max-width: 1380px) {}


/************
4. 1280px
************/

@media only screen and (max-width: 1280px) {}


/************
5. 1199px
************/

@media only screen and (max-width: 1199px) {
    .main_nav {
        margin-left: 70px;
    }
    .main_nav ul li:not(:last-child) {
        margin-right: 35px;
    }
    .intro_content {
        right: -30px;
    }
    .chefs {
        padding-bottom: 23px;
    }
    .chef_col {
        margin-bottom: 40px;
    }
    .chef_image {
        width: 75%;
        margin-left: auto;
        margin-right: auto;
    }
}


/************
6. 1100px
************/

@media only screen and (max-width: 1100px) {}


/************
7. 1024px
************/

@media only screen and (max-width: 1024px) {}


/************
8. 991px
************/

@media only screen and (max-width: 991px) {
    .hamburger {
        display: block;
    }
    .hamburger_bar {
        display: block;
    }
    .main_nav,
    .reservations_phone {
        display: none;
    }
    .intro_content {
        position: relative;
        top: auto;
        transform: none;
        right: auto;
        margin-bottom: 102px;
        width: 100%;
        padding-left: 0;
    }
    .footer_col:not(:last-child) {
        margin-bottom: 80px;
    }
}


/************
9. 959px
************/

@media only screen and (max-width: 959px) {}


/************
10. 880px
************/

@media only screen and (max-width: 880px) {}


/************
11. 768px
************/

@media only screen and (max-width: 768px) {}


/************
12. 767px
************/

@media only screen and (max-width: 767px) {
    .hamburger_bar {
        right: calc((100vw - 510px) / 2 - 15px);
    }
    .home_subtitle {
        font-size: 48px;
    }
    .home_title h1 {
        font-size: 56px;
    }
    .intro_content {
        padding-left: 49px;
    }
    .intro_col:not(:last-child) {
        margin-bottom: 30px;
    }
    .res_input,
    .res_select {
        width: 150px;
    }
}


/************
13. 575px
************/

@media only screen and (max-width: 575px) {
    p {
        font-size: 14px;
    }
    .header_content,
    .header.scrolled .header_content {
        height: 80px;
    }
    .hamburger_bar,
    .hamburger_bar.scrolled {
        right: 0;
        height: 80px;
    }
    .home {
        height: 350px;
    }
    .home_container {
        bottom: 69px;
    }
    .home_subtitle {
        font-size: 30px;
    }
    .home_title h1 {
        font-size: 36px;
    }
    .section_subtitle {
        font-size: 30px;
    }
    .section_title h1 {
        font-size: 36px;
    }
    .intro_content {
        padding-left: 30px;
    }
    .intro_subtitle {
        font-size: 30px;
    }
    .intro_title h2 {
        font-size: 36px;
    }
    .intro_text {
        margin-top: 24px;
    }
    .chef_image {
        width: 50%;
    }
    .res_stars {
        font-size: 30px;
    }
    .res_title {
        font-size: 36px;
    }
    .res_form_container {
        width: 100%;
        margin-top: 60px;
    }
    .res_input:not(:last-child) {
        margin-right: 0;
        margin-bottom: 12px;
    }
    .res_input,
    .res_select {
        width: 100%;
    }
    .footer_logo_title {
        font-size: 36px;
    }
    .footer_logo_subtitle {
        font-size: 12px;
    }
    .footer_contact_title,
    .footer_contact_text {
        font-size: 14px;
    }
}


/************
14. 539px
************/

@media only screen and (max-width: 539px) {}


/************
15. 480px
************/

@media only screen and (max-width: 480px) {}


/************
16. 479px
************/

@media only screen and (max-width: 479px) {}


/************
17. 400px
************/

@media only screen and (max-width: 400px){}