/**
 * [Table of contents]
 *
 * [&. Content / #key]
 * [Let press Ctrl + f and type of paste the key, then press Enter to search the content ]
 *
 * Summary:
 *
 *  0. VARIABLE LESS
 *    - 0.1. Color
 *  1. RESPONSIVE SCREEN
 *    - 1.1. Media screen max width 1024px
 *    - 1.2. Media screen max width 768px
 *    - 1.3. Media screen max width 767px
 *    - 1.4. Media screen max width 600px
 *    - 1.5. Media screen max width 480px
 *    - 1.6. Media screen max width 414px
 *    - 1.7. Media screen max width 380px
 *    - 1.8. Media screen max width 320px
 */

/*=====================================
=            VARIABLE LESS            =
=====================================*/

/**
 * [Table of contents]
 *
 * [&. Content / #key]
 * [Let press Ctrl + f and type of paste the key, then press Enter to search the content ]
 *
 * Summary:
 *
 *  0. VARIABLE LESS
 *  1. MIXINS


/*=============================
 =====   VARIABLE LESS    =====
 =============================*/

/*=============================
 ====  END VARIABLE LESS   ====
 =============================*/

/*=============================
 =====       MIXINS       =====
 =============================*/

/*=============================
 ====      END MIXINS      ====
 =============================*/

/*----------  0.1. Color  ----------*/

/*=====  End of VARIABLE LESS  ======*/

/*=========================================
=            RESPONSIVE SCREEN            =

=========================================*/

/*----------  1.0. Media screen min width 1600px  ----------*/

@media screen and (min-width: 1600px) {
    /********************* HOME PAGE ***********************/

    .homepage-default .homepage-banner-content .group-title .title {
        font-size: 3.2rem;

        margin-bottom: 25px;
    }
    .homepage-default .homepage-banner-content .group-title .text {
        font-size: 18px;
    }
    .homepage-default .homepage-banner-content .group-open-hours {
        margin-top: 30px;
    }
    .homepage-default .homepage-banner-content .group-open-hours .title {
        font-size: 20px;
    }
    .homepage-default .homepage-banner-content .group-open-hours .time-1,
    .homepage-default .homepage-banner-content .group-open-hours .time-2 {
        font-size: 16px;
    }
    .menu-of-day.style-1 .right-infomation .content-wrapper {
        width: 76%;
        margin-left: 12%;
    }
    .book-table.style-1 .bg-images-pc,
    .book-table.style-2 .bg-images-pc,
    .book-table.style-4 .bg-images-pc {
        display: block;
    }
    .book-table.style-3 {
        background-position: center;
    }
    .book-table.style-3 .main-content {
        width: 100%;
    }
    .contact-form-wrapper .bg-images-pc {
        display: block;
    }
    .banner-prallax .title-bg {
        left: 8%;
    }
    .banner-prallax .infomation-wrapper {
        left: 7%;
    }
}

@media screen and (min-width: 1200px) {
.header-topbar .topbar-left {
        margin-left: 100px;
}
.header-topbar .topbar-right {
        margin-right: 100px;
}
.homepage-default .homepage-banner-warpper {
        margin-left: 100px;
}
}
/*----------  1.1. Media screen max width 1024px  ----------*/

@media screen and (max-width: 1024px) {
    /********************* HOME PAGE ***********************/

    .main-title .title {
        font-size: 3.8rem;

        margin: 20px 0 50px 0;
    }
	
.homepage-default .homepage-banner-content .group-title .title {
    font-size: 1.8rem;
}	
.homepage-default .homepage-banner-warpper {
       max-width: 450px;
}	
    .about-us-1 .left-image .homepage-hero-module {
        display: none;
    }
    .about-us-1 .right-infomation .content-wrapper {
        width: 100%;
        margin-left: 0;
        padding-right: 30px;
        padding-left: 30px;
    }
    .about-us-1 .right-infomation .text {
        margin-bottom: 20px;
    }
    .about-us-1 .right-infomation .signature img {
        max-width: 280px;
    }
    .dish .box .border-efect {
        display: none;
    }
    .dish .wrapper {
        border: 1px solid #cdcfd1;
    }
    .tab-menu .name .icons {
        margin-right: 10px;
    }
    .banner-prallax {
        height: 450px;

        text-align: center;
    }
    .banner-prallax .title-bg {
        font-size: 7rem;

        position: relative;
        top: 45%;

        margin-top: -50px;
    }
    .banner-prallax .infomation-wrapper {
        top: 45%;
    }
    .banner-prallax .img-wrapper {
        display: none;
    }
    .new-of-day .list-news {
        margin-bottom: 45px;
    }
    .new-of-day .list-news .item .infomation {
        width: 60%;
    }
    .new-of-day .list-news .item .images {
        width: 40%;
    }
    .new-of-day .list-news .slick-dots {
        top: auto;
        right: auto;
        bottom: -45px;
        left: 50%;

        margin-top: 0;
        margin-bottom: 0;
        margin-left: -60px;
    }
    .new-of-day .list-news .slick-dots li {
        display: inline-block;

        margin: 0 10px;
    }
    .new-of-day .list-news .slick-dots li button {
        right: auto !important;

        text-align: center;
    }
    .new-of-day .list-news .slick-dots li button:before {
        display: none;
    }
    .blog-detail-content .content {
        padding-left: 15px;
    }
    .blog-detail-content .content .title {
        font-size: 2rem;
    }
    .blog-detail-content .content .info {
        margin-bottom: 20px;
    }
    .blog-detail-content .content .description .text {
        margin-bottom: 20px;
    }
    .book-table .left-image {
        width: 30%;
    }
    .book-table .right-infomation .content-wrapper {
        width: 100%;
        margin-left: 0;
        padding-right: 30px;
        padding-left: 30px;
    }
    .coming-soon-wrapper .left-infomation {
        width: 45%;
		margin-bottom: 60px;
    }
    .coming-soon-wrapper .left-infomation .open-hours-bg {
        width: 100%;
    }
    .coming-soon-wrapper .right-infomation {
        width: 55%;
    }
    .open-hours-bg .open-hours-wrapper .content .item .day:after {
        width: 140px;
    }
    .coming-soon-event-wrapper .coming-soon-count .count-wrapper {
        height: 140px;
    }
    .coming-soon-event-wrapper .coming-soon-count .count-wrapper .time .count {
        font-size: 6rem;
        line-height: 140px;
    }
    .subscribe-email .subscribe-email-wrapper .subscribe-email-left {
        max-width: 580px;
    }
    .subscribe-email .subscribe-email-wrapper .subscribe-email-right {
        max-width: 325px;
    }
    .subscribe-email .subscribe-email-wrapper .subscribe-email-right .form-subscribe-email .form-control {
        padding-left: 15px;
    }
    /********************* HOME PAGE 2 ***********************/

    .background-video {
        background-image: url('../images/background-full/homepage-2.jpg');
    }
    .background-video .homepage-hero-module {
        display: none;
    }
    .background-video .bg-image {
        display: none;
    }
    .background-video .btn-click {
        display: none;
    }
    .about-us-2 .right-image {
        right: 0;
        left: auto;

        width: 38%;
        margin-left: 0;
    }
    .about-us-2 .left-infomation .text {
        margin-bottom: 20px;
    }
    .about-us-2 .left-infomation .signature img {
        max-width: 280px;
    }
    .menu-items.style-2 .item-image {
        width: 38%;
    }
    .testimonial-list {
        width: 90%;
    }
    .testimonial-list .slider-for {
        left: 0;
    }
    .testimonial-list .testimonial-item .news-content .content {
        margin-left: -135px;
    }
    /********************* ABOUT US ***********************/

    .logo-bg {
        max-width: 400px;
    }
    /********************* CONTACT ***********************/

    .contact-info-item {
        padding: 0;
    }
}

/*----------  1.2. Media screen max width 768px  ----------*/

@media screen and (max-width: 768px) {
    .header-main .logo-wrapper .logo img {
        max-width: 260px;
    }
    .navigation .nav-links .main-menu {
        margin: 0 18px;
    }
    .button-search .main-menu {
        margin-right: 0;
        margin-left: 18px;
    }
    .sidebar {
        margin-top: 100px;
    }
    .sidebar .col-1 {
        width: 100%;
    }
    .sidebar .col-2 {
        float: left;

        width: 50%;
    }
    .sidebar .col-2 .widget:last-child {
        margin-bottom: 0;
    }
    .sidebar .col-2:nth-child(even) {
        padding-right: 15px;
    }
    .sidebar .col-2:nth-child(odd) {
        padding-left: 15px;
    }
    .main-right {
        float: left;
    }
    /********************* HOME PAGE ***********************/

    .homepage-default .homepage-banner-content {
        text-align: center;
    }
    .about-us-1 .left-image {
        display: none;
    }
    .about-us-1 .right-infomation .text {
        text-align: justify;
    }
    .about-us-2 .left-infomation .text,
    .about-us-3 .text {
        text-align: justify;
    }
    .about-us-2 .left-infomation .group-list .box-media {
        margin-bottom: 30px;
    }
    .about-us-2 .left-infomation .group-list .box-media .text {
        text-align: left;
    }
    .menu-of-day.style-1 .left-image {
        display: none;
    }
    .menu-of-day.style-1 .right-infomation .content-wrapper {
        width: 100%;
        margin: 0;
        padding-right: 30px;
        padding-left: 30px;
    }
    .menu-of-day.style-2 .tab-menu {
        width: 100%;
    }
    .menu-of-day.style-2 .col-md-6:nth-child(even) .menu-items.style-2 .item-image {
        float: right;

        margin-right: 0;
        margin-left: 20px;
    }
    .menu-of-day.style-2 .col-md-6:last-child .menu-items.style-2 {
        margin-bottom: 0;
        padding-bottom: 0;

        border-bottom: none;
    }
    .banner-prallax .infomation-wrapper .description {
        width: 90%;
    }
    .new-of-day .list-news .item .infomation,
    .new-of-day .list-news .item .images {
        float: left;

        width: 100%;
        padding: 0 15px;
    }
    .new-of-day .list-news .item .images {
        margin-bottom: 30px;
    }
    .book-table.style-1 .left-image,
    .book-table.style-2 .left-image {
        display: none;
    }
    .book-table .right-infomation .content-wrapper {
        padding-right: 15px;
        padding-left: 15px;
    }
    .coming-soon-wrapper {
        display: block;
    }
    .coming-soon-wrapper .left-infomation,
    .coming-soon-wrapper .right-infomation {
        display: block;

        width: 100%;
        padding-right: 0;
        padding-left: 0;
    }
    .coming-soon-wrapper .left-infomation {
        padding-top: 100px;
    }
    .coming-soon-wrapper .left-infomation .open-hours-bg {
        max-width: 470px;
        margin: 0 auto;
    }
    .open-hours-bg .open-hours-wrapper .content .item .day:after {
        width: 210px;
    }
    .subscribe-email .subscribe-email-wrapper .subscribe-email-right {
        float: left;

        margin-top: 20px;
    }
    .footer-wrapper .col-2 {
        display: inline-block;

        width: 100%;
        margin-bottom: 30px;
    }
    .footer-wrapper .col-2:last-child {
        margin-bottom: 0;
    }
    .blog-detail-content .content .tags {
        margin-top: 30px;
    }
    /******************** HOME PAGE 2 **********************/

    .background-video .group-title {
        width: 80%;
        margin: 0 auto;
    }
    .about-us-2 .right-image {
        display: none;
    }
    .about-us-2 .left-infomation .content-wrapper {
        width: 100%;
    }
    .menu-items.style-2 {
        display: inline-block;

        width: 100%;
        margin-bottom: 25px;
        padding-bottom: 30px;

        border-bottom: 1px dashed #ebebeb;
    }
    .menu-items.style-2 .item-image {
        display: inline-block;
        float: left;

        width: 40%;
        margin-right: 20px;
    }
    .menu-items.style-2 .item-image img {
        width: 100%;
    }
    .menu-items.style-2 .item-content {
        display: inline-block;
        float: left;

        width: calc(60% - 20px);
        padding: 15px 0;
    }
    .book-table.style-3 .main-content,
    .book-table.style-4 .main-content {
        width: 100%;
    }
    .testimonial.style-2 .testimonial-list .testimonial-item .news-content:after {
        left: 10%;
    }
    .testimonial-list .testimonial-item .news-content {
        padding: 30px 0 0 20px;
    }
    /******************** HOME PAGE 3 **********************/

    .background-slide .slide-item.background-item-3 .homepage-banner-content {
        text-align: center;
    }
    /******************** ABOUT US **********************/

    .coming-soon.style-2 .logo-bg {
        max-width: 470px;
        margin: 0 auto 50px auto;

        background-position: top;
    }
    .coming-soon.style-2 .coming-soon-wrapper .left-infomation {
        padding-top: 0;
    }
    /******************** LIST MENU **********************/

    .meal-wrapper .col-md-6:nth-child(even) .menu-items.style-2 .item-image {
        float: right;

        margin-right: 0;
        margin-left: 20px;
    }
    .meal-wrapper .col-md-6:last-child .menu-items.style-2 {
        margin-bottom: 0;
        padding-bottom: 0;

        border-bottom: none;
    }
    /******************** EVENT **********************/

    .more-event .coming-soon-wrapper .left-infomation {
        padding-top: 0;
        padding-bottom: 60px;
    }
    .more-event .coming-soon-wrapper:last-child .left-infomation {
        padding-top: 60px;
        padding-bottom: 0;
    }
    .more-event .coming-soon-wrapper .logo-bg {
        margin: 0 auto;
    }
    /******************** 404 **********************/

    .page-404 .title {
        margin-top: 15%;
    }
}

/*----------  1.3. Media screen max width 767px  ----------*/

@media screen and (max-width: 767px) {

.logo-bg.style-2 img {
    width: 100%;
}
.logo-bg.style-3 img {
    width: 100%;
}
    .padding-top-100 {
        padding-top: 60px;
    }
    .padding-bottom-100 {
        padding-bottom: 60px;
    }
    .margin-top-70 {
        margin-top: 50px;
    }
    .margin-top-50 {
        margin-top: 30px;
    }
    .sidebar {
        margin-top: 60px;
    }
    .sidebar .widget {
        margin-bottom: 30px;
    }
    /********************* MENU ***********************/

    .header-main .navigation {
        display: none;
    }
    .header-main.header-fixed .hamburger-menu-mobile .icons,
    .header-main.header-fixed .button-search-mobile .icons {
        line-height: 50px;
    }
    .hamburger-menu-mobile,
    .button-search-mobile {
        display: block;
    }
    .header-main-wrapper {
        position: relative;
    }
    .logo-wrapper {
        text-align: center;
    }
.logo-wrapper .logo img {
    max-width: 250px;
}	
	
	
    .homepage-banner,
    .background-slide .slide-item {
        min-height: 667px;
    }
    /********************* HOME PAGE ***********************/

    .homepage-default,
    .special-menu,
    .banner,
    .testimonial,
    .morepage-banner-wrapper,
    .background-slide .slide-item,
    .menu-of-day.style-3,
    .main-event {
        background-attachment: scroll;
    }
    .main-title .bg-image {
        margin-top: -60px;
    }
    .main-title .bg-image .crawfish {
        max-width: 170px;
    }
    .main-title .bg-image .clamp {
        max-width: 120px;
    }
    .main-title .bg-image .kingcrab {
        position: relative;
        top: -15px;

        max-width: 140px;
    }
    .main-title .bg-image .cuttle {
        max-width: 280px;
    }
    .main-title .bg-image .scallop {
        max-width: 120px;
    }
    .main-title .bg-image .shrimp {
        position: relative;
        top: 10px;

        max-width: 170px;
    }
    .main-title .bg-image .swordfish {
        max-width: 250px;
    }
    .main-title .bg-image img {
        display: block;

        margin: 0 auto;
    }
    .main-title .title {
        font-size: 3.2rem;

        margin-bottom: 40px;
    }
    .tab-menu {
        margin-bottom: 30px;
    }
    .banner-prallax {
        height: 380px;
    }
    .banner-prallax .title-bg {
        font-size: 6rem;
    }
    .banner-prallax .infomation-wrapper .title {
        font-size: 2.4rem;
    }
    .new-of-day .list-news .slick-dots {
        bottom: -35px;
    }
    .book-table .form-group {
        margin-bottom: 30px;
    }
    .coming-soon-wrapper .left-infomation {
        padding-top: 60px;
    }
    .subscribe-email .subscribe-email-wrapper .subscribe-email-right {
        margin-top: 15px;
    }
    .footer {
        position: relative;

        display: block;

        width: auto;
        height: auto;
    }
    .footer .footer-wrapper {
        display: block;
    }
    .footer .footer-main {
        padding: 80px 0 100px 0;
    }
    .gamba-descripton .logo-foogter {
        margin-bottom: 30px;
    }
    .footer-wrapper .widget .content-widget {
        margin-top: 30px;
    }
    .hyperlink {
        padding: 15px 0;
    }
    .banner-prallax .infomation-wrapper {
        padding-right: 15px;
        padding-left: 15px;
    }
    .banner-prallax .img-wrapper-2 {
        width: 40%;
    }
    .menu-of-day.style-1 .right-infomation .content-wrapper,
    .about-us-1 .right-infomation .content-wrapper {

    }
    /******************** HOME PAGE 2 **********************/

    .background-video .homepage-banner-content {
        padding-top: 140px;
    }
    .coming-soon-event-wrapper {
        max-width: 570px;
    }
    /******************** HOME PAGE 3 **********************/

    .menu-of-day .content-menu .col-sm-6:nth-last-child(-n + 2) .menu-items.style-3 {
        margin-bottom: 20px;
        padding-bottom: 20px;

        border-bottom: 1px dashed #ebebeb;
    }
    .menu-of-day .content-menu .col-sm-6:last-child .menu-items.style-3 {
        margin-bottom: 0;
        padding-bottom: 0;

        border-bottom: none;
    }
    .background-slide .homepage-banner-content .logo-images {
        margin-bottom: 60px;
    }
    .about-us-3 .video-thumbnail {
        margin-top: 30px;
    }
    .special-menu.style-3 .dish .box {
        border: 3px solid #eeeeee;
    }
    .special-menu.style-3 .dish .wrapper {
        border: none;
    }
    /******************** RESERVATION **********************/

    .main-title-2 {
        margin-bottom: 40px;
    }
    .book-table .more-infomation .col-sm-6 {
        margin-top: 40px;
    }
    .book-table .more-infomation .title-info {
        margin-bottom: 20px;
    }
    .taste-of-fresh {
        width: 100%;
    }
    /******************** BLOG **********************/

    .blog-post {
        margin-bottom: 40px;
    }
    /******************** CONTACTS **********************/

    .contact-info-item {
        max-width: 320px;
        margin: 0 auto;
    }
    .contact-info-item .icons {
        margin-bottom: 20px;
    }
    .contact-info .col-sm-4 {
        margin-bottom: 30px;
    }
    .contact-info .col-sm-4:last-child {
        margin-bottom: 0;
    }
    .contact-form .col-sm-4 {
        margin-bottom: 30px;
    }
    .contact-form .col-sm-4:last-child {
        margin-bottom: 0;
    }
    .contact-map #googleMap {
        height: 400px;
    }
    /******************** LIST MENU **********************/

    .tab-main-menu .slick-prev {
        left: -15px;
    }
    .tab-main-menu .slick-next {
        right: -15px;
    }
    .main-menu .content-menu {
        margin-bottom: 0;
    }
    .main-menu .content-menu .menu-items.style-4 {
        margin-bottom: 30px;
    }
    .main-menu .content-menu .col-md-4:nth-last-child(-n + 3) .menu-items.style-4 {
        margin-bottom: 30px;
    }
    .main-menu .content-menu .col-md-4:nth-last-child(-n + 2) .menu-items.style-4 {
        margin-bottom: 0;
    }
    .sub-menu .col-sm-6:nth-last-child(-n+2) .menu-items.style-3 {
        margin-bottom: 20px;
        padding-bottom: 20px;

        border-bottom: 1px dashed #ebebeb;
    }
    .sub-menu .col-sm-6:last-child .menu-items.style-3 {
        margin-bottom: 0;
        padding-bottom: 0;

        border: none;
    }
    /******************** EVENT **********************/

    .more-event .coming-soon-wrapper .left-infomation {
        padding-top: 0;
        padding-bottom: 60px;
    }
    .more-event .coming-soon-wrapper:last-child .left-infomation {
        padding-top: 60px;
        padding-bottom: 0;
    }
    .more-event .coming-soon-wrapper .logo-bg {
        margin: 0 auto;

        background-attachment: scroll;
    }
    /******************** 404 **********************/

    .page-404 {
        min-height: 667px;
    }
    .page-404 .title {
        margin-top: 50px;
    }
    /******************** GALLERY **********************/

    .description-gallery {
        margin-top: 50px;
    }
}

/*----------  1.4. Media screen max width 600px  ----------*/

@media screen and (max-width: 600px) {
    html {
        font-size: 12px;
    }
    .header-topbar .topbar-right {
        display: none;
    }
    .header-topbar .topbar-left > li {
        padding: 0 10px;
    }
    .sidebar .col-1 {
        width: 100%;
    }
    .sidebar .col-2 {
        width: 100%;
        margin-bottom: 30px;
    }
    .sidebar .col-2:last-child {
        margin-bottom: 0;
    }
    .sidebar .col-2:nth-child(even) {
        padding-right: 0;
    }
    .sidebar .col-2:nth-child(odd) {
        padding-left: 0;
    }
    /********************* HOME PAGE ***********************/

    .homepage-default .homepage-banner-content .group-title .title {
        font-size: 3rem;
        line-height: 1.4;
    }
    .background-video .homepage-banner-content .group-title .title {
        font-size: 3rem;
        line-height: 1.4;
    }
    .special-menu .list-dish {
        margin: 0 -10px;
    }
    .special-menu .list-dish .dish {
        margin: 0 10px;
    }
    .dish .box {
        height: 420px;
    }
    .dish .box .image-dish {
        max-width: 160px;
        min-height: 120px;
    }
    .tab-menu {
        margin-bottom: 20px;
        padding-bottom: 20px;

        border-bottom: 1px dashed #dfe0e1;
    }
    .tab-menu .name {
        display: inline-block;

        padding-bottom: 15px;

        border-bottom: 1px dashed #dfe0e1;
    }
    .tab-menu li {
        width: 50%;
        margin-bottom: 15px;
    }
    .tab-menu li:nth-child(odd):before {
        border-left: none;
    }
    .tab-menu li:nth-child(even):before {
        border-left: 1px dashed #dfe0e1;
    }
    .tab-menu li:nth-last-child(-n+2) {
        margin-bottom: 0;
    }
    .tab-menu li:nth-last-child(-n+2) .name {
        padding-bottom: 0;

        border: none;
    }
    .menu-items.style-2 {
        margin-bottom: 15px;
        padding-bottom: 20px;
    }
    .testimonial-list {
        width: 100%;
    }
    .testimonial-list .testimonial-item {
        padding: 0;
    }
    .testimonial-list .testimonial-item .icons {
        display: none;
    }
    .testimonial-list .testimonial-item .news-content {
        padding: 20px 0 0 0;

        text-align: center;
    }
    .testimonial-list .testimonial-item .news-content .content {
        top: -20px;
        left: auto;

        display: inline-block;

        width: auto;
        margin-left: 0;
    }
    /********************* HOME PAGE 3 **********************/

    .main-title-2 {
        margin-bottom: 30px;
    }
    .background-slide .homepage-banner-content .group-title .title,
    .background-slide .homepage-banner-content .group-title-2 .title {
        font-size: 3rem;
    }
    .logo-bg .list-logo {
        padding: 50px 0;
    }
    /********************* LIST MENU **********************/

    .meal-wrapper .description-menu {
        width: 100%;
        margin-bottom: 20px;
    }
    .meal-wrapper .more-image {
        margin-bottom: 30px;
    }
    .meal-wrapper .more-image img {
        max-width: 45%;
    }
    .menu-items.style-4 .item-content .price {
        margin-bottom: 10px;
    }
    /********************* BLOG **********************/

    .blog-post .blog-image {
        margin-bottom: 30px;
    }
    /******************** EVENT **********************/

    .main-event .coming-soon-event-wrapper .coming-soon-count {
        margin: 50px 0 0 0;
    }
    .more-event .coming-soon-wrapper .left-infomation {
        padding-bottom: 30px;
    }
    .more-event .coming-soon-wrapper:last-child .left-infomation {
        padding-top: 30px;
    }
    /******************** GALLERY **********************/

    .gallery-wrapper .tab-menu {
        display: inline-block;

        width: 100%;
    }
    .gallery-wrapper .tab-menu li {
        display: inline-block;
        float: left;

        width: 25%;
    }
    .gallery-wrapper .tab-menu li:before {
        position: absolute;
        right: 0;
        left: auto;

        height: 100%;

        content: '';

        border-left: 1px dashed #dfe0e1 !important;
    }
    .description-gallery {
        margin-top: 0;
    }
    .grid-gallery {
        margin: 0 -10px;
    }
    .grid-item-wrapper {
        width: 50%;
    }
    .grid-item-wrapper .grid-item {
        top: 10px;
        right: 10px;
        bottom: 10px;
        left: 10px;
    }
}

/*----------  1.5. Media screen max width 480px  ----------*/

@media screen and (max-width: 480px) {
    /********************* HOME PAGE ***********************/

    .group-btn .btn-left {
        display: block;

        margin: 0 auto;
        margin-bottom: 15px;
    }
    .group-btn .btn-right {
        display: block;

        margin: 0 auto;
    }
    .menu-of-day .content-menu .col-sm-6.col-xs-6 {
        width: 100%;
    }
    .menu-of-day .content-menu .col-sm-6:nth-last-child(-n + 2) .menu-items.style-1 {
        margin-bottom: 20px;
        padding-bottom: 20px;

        border-bottom: 1px dashed #ebebeb;
    }
    .menu-of-day .content-menu .col-sm-6:last-child .menu-items.style-1 {
        margin-bottom: 0;
        padding-bottom: 0;

        border: none;
    }
    .blog-detail-content .dates {
        display: none;
    }
    .blog-detail-content .content {
        padding-left: 0;
    }
    .new-of-day .list-news {
        margin-bottom: 30px;
    }
    .new-of-day .list-news .slick-dots {
        bottom: -25px;
    }
    .book-table .form-group .col-sm-6 {
        width: 100%;
        margin-bottom: 20px;
    }
    .book-table .form-group .col-sm-6:nth-last-child(-n + 2) {
        margin-bottom: 20px;
    }
    .book-table .form-group .col-sm-6:last-child {
        margin-bottom: 0;
    }
    .open-hours-bg .open-hours-wrapper .content .item .day:after {
        width: 130px;
    }
    .coming-soon-event-wrapper .coming-soon-count {
        margin-top: 30px;
    }
    .coming-soon-event-wrapper .coming-soon-count .count-wrapper {
        height: 100px;
    }
    .coming-soon-event-wrapper .coming-soon-count .count-wrapper .time .count {
        font-size: 4.8rem;
        line-height: 100px;
    }
    .footer .footer-main {
        padding-top: 60px;
    }
    .footer-wrapper .col-2 .col-md-3 {
        width: 100%;
        margin-bottom: 40px;
    }
    .footer-wrapper .col-2 .col-md-3:last-child {
        margin-bottom: 0;
    }
    .banner-prallax .img-wrapper-2 {
        width: 70%;
    }
    .gamba-descripton {
        top: 0;
    }
    .gamba-gallery .slick-prev,
    .gamba-gallery .slick-next {
        top: 108%;
    }
    /******************** HOME PAGE 2 **********************/

    .video-thumbnail .video-button-play {
        font-size: 1.4rem;
        line-height: 46px;

        width: 50px;
        height: 50px;
        padding-left: 3px;
    }
    /******************** ABOUT US **********************/

    .about-us-2 .left-infomation .group-list {
        margin-top: 30px;
    }
    .about-us-2 .left-infomation .group-list .col-xs-6 {
        width: 100%;
    }
    .about-us-2 .left-infomation .group-list .col-xs-6 .box-media {
        margin-bottom: 20px;
    }
    .about-us-2 .left-infomation .group-list .col-xs-6:nth-last-child(-n + 2) .box-media {
        margin-bottom: 20px;
    }
    .about-us-2 .left-infomation .group-list .col-xs-6:last-child .box-media {
        margin-bottom: 0;
    }
    .coming-soon.style-2 .logo-bg {
        margin-bottom: 40px;
    }
    /******************** RESERVATION **********************/

    .taste-of-fresh .title {
        font-size: 2.8rem;
    }
    .taste-of-fresh .title .name-2 {
        font-size: 26px;
    }
    /******************** LIST MENU **********************/

    .menu-items.style-2 .item-content {
        padding: 0;
    }
    /********************* BLOG ***********************/

    .blog-author {
        background-color: #f9f9f9;
    }
    .blog-author .media-left {
        width: auto;
        padding: 20px;

        vertical-align: top;
    }
    .blog-author .media-right {
        display: block;

        width: 100%;
        padding: 0 20px 20px 20px;
    }
    .blog-author .media-right:before {
        display: none;
    }
    .blog-comment .comment-list .parent {
        margin-bottom: 20px;
        padding: 20px;

        background-color: #f9f9f9;
    }
    .blog-comment .comment-list .comment-list-children {
        margin-left: 0;
    }
    .blog-comment .comment-list .comment-item:not(:last-child) {
        margin-bottom: 20px;
    }
    .leave-comment {
        margin-top: 50px;
    }
    .leave-comment .comment-form .col-50 {
        width: 100%;
        margin-bottom: 10px;
        padding: 0 !important;
    }
    .leave-comment .comment-form .col-50:last-child {
        margin-bottom: 0;
    }
    /********************* CONTACT ***********************/

    .contact-form .col-sm-4 {
        margin-bottom: 20px;
    }
    .contact-form .form-textarea {
        margin-top: 20px;
    }
    /******************** EVENT **********************/

    .logo-bg.style-2,
    .logo-bg.style-3 {
        min-height: 260px;
    }
    /********************* 404 ***********************/

    .page-404 .title {
        font-size: 4.2rem;

        margin-bottom: 20px;
    }
}

/*----------  1.6. Media screen max width 414px  ----------*/

@media screen and (max-width: 414px) {
    /********************* HOME PAGE ***********************/

    .banner-prallax .title-bg {
        font-size: 5rem;
    }
    .open-hours-bg .open-hours-wrapper .content .item .day:after {
        display: none;
    }
    .banner-prallax .title-bg {
        top: 40%;

        margin-top: -50px;
    }
    .banner-prallax .infomation-wrapper {
        top: 35%;
    }
    .coming-soon-event-wrapper .coming-soon-count {
        margin-right: -10px;
        margin-left: -10px;
    }
    .coming-soon-event-wrapper .coming-soon-count .count-wrapper {
        padding: 0 10px;
    }
    .logo-bg .list-logo {
        padding: 30px 0;
    }
    /********************* BLOG ***********************/

    .blog-post .blog-image {
        margin-bottom: 20px;
    }
    .blog-detail-content .content .title {
        font-size: 1.6rem;
    }
    /********************* LIST MENU ***********************/

    .content-menu .tab-pane .col-xs-6 {
        width: 100%;
    }
    .main-menu .content-menu .col-md-4:nth-last-child(-n + 2) .menu-items.style-4 {
        margin-bottom: 30px;
    }
    .main-menu .content-menu .col-md-4:last-child .menu-items.style-4 {
        margin-bottom: 0;
    }
    /******************** EVENT **********************/

    /******************** GALLERY **********************/

    .grid-item-wrapper {
        width: 100%;
    }
    .gallery-wrapper .tab-menu li {
        width: 33%;
    }
    .gallery-wrapper .tab-menu li:nth-last-child(-n+3) {
        margin-bottom: 0;
    }
    .gallery-wrapper .tab-menu li:nth-last-child(-n+3) .name {
        padding-bottom: 0;

        border: none;
    }
}

/*----------  1.7. Media screen max width 380px  ----------*/

@media screen and (max-width: 380px) {
    /********************* HOME PAGE ***********************/

    .homepage-default .homepage-banner-content .group-title .title {
        font-size: 2.6rem;
    }
    .background-video .homepage-banner-content {
        padding: 0 15px;
    }
    .background-video .homepage-banner-content .group-title {
        width: 100%;
    }
    .background-video .homepage-banner-content .group-title .title {
        font-size: 2.6rem;
    }
    .header-topbar .topbar-left > li {
        padding: 0 7px;
    }
    .coming-soon-event-wrapper .coming-soon-count .count-wrapper .time .count {
        font-size: 4.2rem;
    }
    .dish .box {
        height: 420px;
    }
    .menu-items.style-1 {
        margin-bottom: 15px;
        padding-bottom: 15px;
    }
    .menu-of-day .content-menu .col-sm-6:nth-last-child(-n + 2) .menu-items.style-1 {
        margin-bottom: 15px;
        padding-bottom: 15px;
    }
    .menu-of-day .content-menu .col-sm-6:last-child .menu-items.style-1 {
        margin-bottom: 0;
        padding-bottom: 0;
    }
    .new-of-day .list-news .item .images {
        margin-bottom: 20px;
    }
    .open-hours-bg .open-hours-wrapper .content {
        margin-top: 25px;
    }
    .open-hours-bg .open-hours-wrapper .content .item {
        font-size: 14px;

        padding: 0;
    }
    .mb-nav {
        padding: 20px 10px 0 10px;
    }
    .wrapper-menu-mobile .mb-social-wrapper {
        padding: 15px;
        padding-left: 5px;
    }
    .footer-wrapper .widget .title {
        padding-bottom: 10px;
    }
    .footer-wrapper .widget .content-widget {
        margin-top: 20px;
    }
    .social-footer {
        display: none;
    }
    /******************** HOME PAGE 2 **********************/

    .testimonial.style-2 .testimonial-list .testimonial-item .news-content:after {
        font-size: 5rem;
    }
    .pagination li .btn-pagination {
        line-height: 32px;

        width: 32px;
        height: 32px;
    }
    /******************** HOME PAGE 3 **********************/

    .background-slide .homepage-banner-content .group-title .title,
    .background-slide .homepage-banner-content .group-title-2 .title {
        font-size: 2.6rem;
    }
    .menu-items.style-3 .title .name {
        width: calc(100% - 50px);
    }
    /******************** LIST MENU **********************/

    .menu-items.style-2 .title .name {
        width: calc(100% - 50px);
    }
    /******************** BLOG **********************/

    .blog-post blockquote .quote-wrapper {
        padding-left: 10px;
    }
    .blog-post blockquote .icons {
        font-size: 6rem;
        line-height: 60px;
    }
    .blog-comment .comment-list .comment-left {
        width: 50px;
    }
    .blog-comment .comment-list .comment-right {
        padding-left: 60px;
    }
    /******************** EVENT **********************/

    .logo-bg.style-2,
    .logo-bg.style-3 {
        min-height: 220px;
    }
}

/*----------  1.8. Media screen max width 320px  ----------*/

@media screen and (max-width: 320px) {
    /********************* HOME PAGE ***********************/

    .header-topbar {
        display: none;
    }
    .homepage-default .homepage-banner-content {
        padding-top: 60px;
    }
    .banner-prallax .title-bg {
        top: 25%;

        margin-top: 0;
    }
    .banner-prallax .infomation-wrapper .title {
        font-size: 2rem;
    }
    .open-hours-bg .open-hours-wrapper {
        padding: 50px 25px;
    }
    .open-hours-bg .open-hours-wrapper:before {
        top: 18px;
        right: 10px;
        bottom: 18px;
        left: 10px;
    }
    .coming-soon-event-wrapper .coming-soon-count .count-wrapper .time-label {
        font-size: 1.2rem;

        width: 58px;
        margin-left: -29px;
    }
    .mb-nav {
        padding: 20px 5px 0 5px;
    }
    /********************* HOME PAGE 2 *********************/

    .menu-items.style-2 .item-image {
        display: block;
        float: inherit !important;

        width: 100%;
        margin: 0 auto !important;
    }
    .menu-items.style-2 .item-content {
        width: 100%;
        margin-top: 20px;
    }
    /******************** LIST MENU **********************/

    .meal-wrapper .more-image img {
        max-width: 70%;
    }
    /********************* 404 ***********************/

    .page-404 {
        min-height: 568px;
    }
    .page-404 .title {
        font-size: 3.6rem;

        margin-top: 30px;
        margin-bottom: 20px;
    }
}