/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400..700&display=swap" rel="stylesheet');
:root{
    --color-text: #0A0A0A; 
    --color-black: #000000; 
    --color-white: #ffffff;
    --color-cyan-bluish-gray: #abb8c3;
    --color-white: #ffffff;
    --color-pale-pink: #f78da7;
    --color-vivid-red: #cf2e2e;
    --color-luminous-vivid-orange: #ff6900;
    --color-luminous-vivid-amber: #fcb900;
    --color-light-green-cyan: #7bdcb5;
    --color-vivid-green-cyan: #00d084;
    --color-pale-cyan-blue: #8ed1fc;
    --color-vivid-cyan-blue: #0693e3;
    --color-vivid-purple: #9b51e0;
    --color-primary: #A2B270;
    --color-secondary: #FDF5E6;
    --color-success: #768d59;
    --color-alert: #768d59;
    --color-thread: #c9c9c9;
}
body {
    
    font-family: 'Quicksand', sans-serif;
    overflow: hidden;
}
h1,h2,h3,h4,h5,h6{
    color: var(--color-primary) !important;
    padding-bottom: 15px;
    margin-bottom: 0;
}

td:first-child, th:first-child{
    padding-left: 7.2px;
}

h1,h2{
    text-transform: uppercase;
    padding-bottom: 30px;
}

h1{font-size: 30px;}
h2{font-size: 28px;}
h3{font-size: 26px;}
h4{font-size: 24px;}
h5{font-size: 22px;}
h6{font-size: 20px;}

p, li {
    font-size: 16px;
    color: var(--color-text);
    
}
p{
    padding-bottom: 15px;
    margin-bottom: 0;
}
.text-banner{
    color: white;
}

.formBooking .wpcf7-submit:hover{
    background-color: var(--color-secondary);
    color: var(--color-primary);
    border: 1px solid var(--color-primary);
    box-shadow: none;
}

.wpcf7-form-control-wrap .wpcf7-form-control button, input, select, textarea {
    font-family: 'Quicksand', sans-serif !important;
}

.select-resize-ghost, .select2-container .select2-choice, .select2-container .select2-selection, select {
    background-color: var(--color-white);
    display: block;
    box-shadow:none;
}

.header-top{
    border-bottom: 1px solid var(--color-primary);
    .html_topbar_right{
        .gtranslate_wrapper{
            display: flex;
            gap: 10px;
            flex-direction: row-reverse;
        }
    }

    .header-button-1{
        margin: 0 !important;
        border: 1px solid var(--color-primary) !important;
        .header-button a:hover{
            background-color: var(--color-secondary);
            color: var(--color-primary);
            border: 1px solid var(--color-primary);
            box-shadow: none;
        }
    }
    .header-button-2{
        margin: 0 !important;
        border: 1px solid var(--color-primary);
        background-color: var(--color-secondary);
        .header-button span{
            color: var(--color-primary);
        }
        .header-button a:hover{
            background-color: var(--color-primary);
            border: 1px solid var(--color-primary);
            box-shadow: none;
            & span{
                color: var(--color-white);
            }
        }
    }
}

.large-columns-7>.col{
    flex:0 0 calc(100% / 7);
    p{
        font-size: 16px;
    }
    .box .box-image{
        margin-bottom: 15px;
    }
    .box .box-text{
        padding: 0;
        .box-text-inner h4 {
            margin: 0;
            padding: 0 0 15px 0;
            font-size: 20px;
        }
    }
}

.header-nav-main.nav > li > a {
    color: var(--color-primary) !important;
    font-weight: 700;
}

.nav>li>a:hover{
    color: var(--color-primary);
}



.ss-footer a:hover{
    color: var(--color-primary) !important;
}

.ss-footer ul li{
    margin-left: 0;
}
.ss-short-intro h2{ 
    margin-bottom: 0;
    padding-bottom: 0;
}
.ss-short-intro .button{
    margin-bottom: 0;
}

.VIpgJd-ZVi9od-aZ2wEe-wOHMyf{
    display: none;
}

.ss-short-intro .col-text-short{
    display: flex;
    align-items: center;
}

.ss-short-intro .col-button-short .col-inner{
    display: flex;
    justify-content: flex-end;
    gap: 15px;
    .btn-menu:hover{
        background-color: var(--color-secondary) !important;
        color: var(--color-primary);
        border: 1px solid var(--color-primary);
        box-shadow: none;

    }
    .btn-uu-dai:hover{
        background-color: var(--color-primary) !important;
        border: 1px solid var(--color-primary);
        box-shadow: none;
        & span{
            color: var(--color-white) !important;
        }

    }
}

.ss-dv .large-columns-7 .pb-0{
    .box-text .box-text-inner h4{
        display: flex;
        justify-content: center;
    }
}

.ss-cn{
    .row .large-6{
        padding-left: 0;
        padding-right: 0;
    }

    .box-chinhanh{
        border: 1px solid var(--color-primary);

        .box-text{
            padding: 15px;
        }
    }
}
.ss-booking{
    .cot1{
        display: flex;
        align-items: center;
        .title-td p {
            font-family: 'Dancing Script';
            color: var(--color-white) !important;
            margin-bottom: 0;
            font-size: 100px;
            line-height: .9;
            font-weight: bold;
            text-shadow: 2px 2px 4px rgb(0 0 0 / 45%);
        }
        .title-td p:nth-child(2){
            padding-left: 15px;
        }
    }
    .formBooking{
        & h3{
            text-transform: uppercase;
        }
       .wpcf7-submit{
        margin: 0;
       }
       .wpcf7-spinner{
        display: none;
       }
    }
}
.banner_gioithieu{
    .text-box .text-box-content .text-center .text-banner p{
        font-size: 18px;
    }
}
.btn-menu{
    margin:0;
    border-radius: 10px;
    height: 45px;
    line-height: 44px;
    position: relative;
    background-color: var(--color-primary) !important; 
    &:hover{
        background-color: var(--color-secondary) !important;
        color: var(--color-primary);
        border: 1px solid var(--color-primary);
        box-shadow: none;
    }
}
.back-to-top{
    margin-right: 20px !important; 
    bottom: 100px ;
}

.box-text.text-center{
    padding: 0 15px;
}
.section_khonggian{
    .box{
        .box-text{
            padding: 0;
            background-color: var(--color-secondary);
            .box-text-inner{
                padding: 0 50px;
            }
        }
    }
}

.section_amthuc{
    .box{
        .box-text{
            padding: 0;
            .box-text-inner{
                padding: 0 50px;
            }
        }
    }
}

.section_doingu{  
    .box{
        display: flex;
        flex-direction: row-reverse;
        .box-image{
            width: 100% !important;
        }
        .box-text{
            display: flex;
            align-items: center;
            padding: 0;
            .box-text-inner{
                padding: 0 50px;
            }
        }
    }
}
.section_khonggian_cn_thaodien{
  
    .box{
        .box-text{
            padding: 0;
            .box-text-inner{
                padding: 0 50px;
            }
        }
    }
}
.section_thuvien_cn_thaodien{
    .imgbox_edit{
        .box-text{
            padding: 10px;
            background-color: var(--color-primary);
            .box-text-inner h2{
                padding: 0;
                color: var(--color-white) !important;
                margin: 0;
            }
        }
    }
}
.section_quyenloi{
    .box{
        .btn-menu{
            margin: 15px 0;
        }
    }
    .box:last-child{
        display: flex;
        flex-direction: row !important;
        .box-image{
        }
        .box-text{
            display: flex;
            align-items: center;
            padding: 0;
            .box-text-inner{
                padding: 0 50px;
                & ul{
                    margin-left: 18px !important;
                }
            }
        }
    }
}

.btn-uu-dai{
    background-color: var(--color-secondary) !important;
    border: 1px solid var(--color-primary);
    & span{
        color: var(--color-primary) !important;
    }
    &:hover{
        background-color: var(--color-primary) !important;
        border: 1px solid var(--color-primary);
        box-shadow: none;
        & span{
            color: var(--color-white) !important;
        }

    }
}

    

.ss-uu-dai{
    & h2{
        color: var(--color-white) !important;
    }
    
}

.ss-hinh h1{
    padding-bottom: 30px;

}

.section_ketnoi{
    .mxh-icon{

        position: absolute;
        top: 40%;
        right: 35%;
        & h3{
            padding-bottom: 10px;
        }
        & h3 > a{
            color: var(--color-primary);
        }
        & h3:nth-child(2){
            padding-left:15px;
        }
        & h3:nth-child(3){
            padding-left:30px;
        }
    }


}

.ss-gio-hoat-dong{
    .text-schedule{
        & h4{
            color: var(--color-white) !important;
            font-size: 30px;
            margin: 0;
            padding-bottom: 0;
        }
        & p{
            font-size: 24px;
            margin: 0;
        }

    }
}

.ss-at{
    .col-btn-at{
        padding : 0 0 30px 0;
    }
}
.post-item{
    .is-divider{
        display: none;
    }
}

.spacespa-category-title h1{
    display: flex;
    justify-content: center;
    text-transform: uppercase;

}

.product-small .box-text-products{
    background-color: var(--color-primary);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    .title-wrapper, .price-wrapper{
        .product-title, .price{
            padding: 0;
            a, span{
                font-size: 20px;
                color: var(--color-white) !important;
                font-weight: 700;
            }
            span{
                color: var(--color-secondary) !important;
            }
        }  
    }
    .add-to-cart-button{
        background-color: var(--color-secondary);
        & a{
            margin: 0;
        }

    }
    
}
.product-footer .wc-tabs-wrapper{

    padding: 30px 0;
    .description_tab {
        & a{
            color: var(--color-primary) !important;
            font-size: 16px;
            font-weight: 600;
        }
    }
    .reviews_tab{
        display: none;
    }
    .tab-panels{
        padding-top: 0;
        .woocommerce-tabs {
            border-top: 0;
            padding: 0;
            & p{
                padding: 15px 0;
            }
        }
    }
} 

.product-main .content-row{
    .product-info{
        .is-divider, .product_meta, .social-icons {display: none;}
        .product-title{
            padding-bottom: 10px;
            border-bottom: 1px solid var(--color-thread);

        }
        .price-wrapper{
            .price{
                margin: 0;
                padding: 10px 0;
                .woocommerce-Price-amount {
                    color: var(--color-vivid-red);
                    font-size: 28px;     

                    
                }
            }
        }
        .product-short-description{
            & p:first-child{
            padding: 10px 0;
            }
            & p:last-child{
            margin-bottom: 10px;
            border-bottom: 1px solid var(--color-thread);
            }
        }
        .cart{
            display: flex;
            flex-wrap: wrap;
            gap: 12px;
            align-items: stretch;
            width: 100%;
            .buttons_added{
                order: 1;
                flex: 0 0 100%;
                margin:0;
                gap: 12px;
                align-items: center;
                &:before{
                    content:'Số lượng:';
                    font-weight: 600;
                    display:flex;
                    align-items: center;
                    height: 100%;
                    padding-right: 24px;
                }
                .minus, .plus{
                    background-color: var(--color-primary);
                    color: var(--color-white);
                    text-shadow: none;
                    border: none;
                    font-weight: 600;
                    width: 38px;
                }
                .input-text {
                    border:none;
                    text-shadow: none;
                    box-shadow: none;
                }
            }

            .single_add_to_cart_button:hover{
                background-color: var(--color-secondary) !important;
                color: var(--color-primary) !important;
                border: 1px solid var(--color-primary);
                box-shadow: none;

            }
            
            .buy-now-button:hover{
                background-color: var(--color-primary) !important;
                border: 1px solid var(--color-primary);
                box-shadow: none;
                color: var(--color-white) !important;
            }

            .single_add_to_cart_button, .buy-now-button{    
                order: 2;
                flex: 1 1 0;
                padding: 10px;
                align-items: center;       
                margin: 0;
                width: 50%;
                background-color: var(--color-primary) !important;
            }
            .buy-now-button{
                background-color: var(--color-secondary) !important;
                color: var(--color-primary);
                border: 1px solid var(--color-primary) !important;

            }
        }
    }
}


.nav-dropdown-default .nav-column li>a, .nav-dropdown.nav-dropdown-default>li>a{
    border-bottom: 1px dashed var(--color-thread);
}

.nav-dropdown-default{
    padding: 0;

}

.header-main .flex-col:nth-child(3) .header-nav .menu-item a:hover{
    color: var(--color-primary);
}

.checkout-page-title{
    .breadcrumbs a.current{
        color: var(--color-primary);
    }
    .breadcrumbs a:hover{
        color: var(--color-primary);
    }
    
}

.cart-container .woocommerce{
    .large-7 .actions {
        .continue-shopping .button{
            background-color: var(--color-secondary);
            color: var(--color-primary);
            .button.button.primary.mt-0.pull-left.small{
                background-color: var(--color-primary) !important;
            }
        }
    }
    .cart-collaterals .wc-proceed-to-checkout{
        .checkout-button{
            background-color: var(--color-primary);
        }
    }
}

.woocommerce-form-coupon-toggle{
    display: none;
}

.checkout{
    .large-5 .checkout-sidebar{
        .form-row .button{
            background-color: var(--color-primary);
        }
    }
}

.mfp-content .inner-padding{
    .woocommerce-mini-cart__buttons .checkout {
        color: var(--color-primary);
        border: 1px solid var(--color-primary);
    }
}   


.blog-tin .post-item{
    padding-bottom: 0;
    .box .box-text .box-text-inner{
        .cat-label{
            padding-bottom: 0;
            font-size: 13px;
        }
        .post-title{
            font-size: 18px;
            padding-bottom: 0;
        }
        .post-title a:hover{
            color: var(--color-primary);
        }
        .from_the_blog_excerpt {
            padding-bottom: 0;
        }
    }
} 
.blog-archive .post-item{padding-bottom: 0;}
.blog-archive .post-item .box{
    .box-image .image-cover{
        padding-top: 100% !important;
    }
    .box-text .box-text-inner{
        .post-title{
            font-size: 18px;
            padding-bottom: 0;
        }
        .post-title a:hover{
            color: var(--color-primary);
        }
        .from_the_blog_excerpt {
            padding-bottom: 0;
        }
    }
}

.blog-single{
    padding-bottom: 0;
    .col .type-post {
        margin-bottom: 0;
        .entry-content{
            padding-bottom: 0;
        }
    }
}

.woocommerce-customer-details .customer-info{
    & p{
        padding-bottom: 0;
        border-bottom: 1px solid var(--color-thread);
        display: flex;
        justify-content: space-between;
    }
}

@media( max-width: 1000px){

    .large-columns-7>.col{
        flex:0 0 calc(100% / 2);
        .box .box-text{
            .box-text-inner {
                font-size: 20px;
            }
        }
    }

    h1{
        font-size: 28px !important;
    }

    p, li {
        font-size: 16px !important;
    }
    .section_khonggian .box, .section_amthuc .box, .section_doingu .box, .section_khonggian_cn_thaodien .box, .section_quyenloi .box:last-child{
        display: flex;
        .box-image{
            width: 100% !important;
            display: grid;
        }
    }
    .ss-cn{
        

        .box-chinhanh{
            height: 100%;
        }
    }
    .section_ketnoi {
        .mxh-icon {
            position: absolute;
            top: 35%;
            right: 25%;
            
        }
    }

    .ss-gio-hoat-dong {
        .text-schedule {
            position: absolute;
            top: 35%;
            left: 15%;
        }
        .y30{
            top: 20%;
        }
    }
    .section_khonggian .box, .section_amthuc .box, .section_doingu .box{
        .box-text{
            .box-text-inner{
                padding: 30px 50px 0 50px !important;
            }
        }
    }
    
    .ss-booking .cot1 .title-td p { font-size: 80px !important;}
}

@media  (max-width: 600px){
    .ss-short-intro .pb-0:first-child{
        .col-text-short .short-text{
            text-align: center;
        }
    }

    .category-page-row .shop-container .products .product-small .box-text-products{
        .title-wrapper, .price-wrapper{
            .product-title, .price{
                a, span{
                    font-size: 16px !important;
                }
            }
        }      
    }

    .product-small .box-text-products {
        .title-wrapper, .price-wrapper {
            .product-title, .price {
                a, span {
                    font-size: 16px !important;
                }
            }
        }
    }

    .header-main .header-inner {
        .mobile-nav .nav-icon .icon-menu{
            color: var(--color-primary);
        }
        .mobile-nav .cart-item .icon-shopping-cart{
            color: var(--color-primary);
        }
    }
    .mfp-content .mobile-sidebar .sidebar-menu {
        background-color: var(--color-secondary);
        .nav .menu-item a{
            color: var(--color-primary);
            font-weight: bold;
            opacity: 1;
        }
        .nav .menu-item .sub-menu {
                background-color: var(--color-secondary) !important;
                .nav-slide-header  .toggle, .nav-slide-header .toggle .icon-angle-left{
                    color: var(--color-primary);
                    font-weight: bold;
                    opacity: 1;
                }
                .menu-item{
                    padding-top: 5px;
                    margin-top: 5px;
                    margin-bottom: 5px;
                    padding-bottom: 5px;
                    border-top: 1px solid var(--color-thread)
                }
            }
    }

    h1{font-size: 26px !important;}
    h2{font-size: 20px !important;}
    h3{font-size: 18px !important;}
    h4{font-size: 18px !important;}
    h5{font-size: 18px !important;}
    h6{font-size: 18px !important;}
    p, li {
        font-size: 14px !important;
    }

    .large-columns-7>.col{
        flex:0 0 calc(100% / 2);
        .box .box-text{
            .box-text-inner {
                font-size: 16px;
            }
        }
    }
    .section_khonggian .box, .section_amthuc .box, .section_doingu .box, .section_khonggian_cn_thaodien .box, .section_quyenloi .box:last-child{
        display: block;
            .box-text{
                padding: 30px 15px 0 15px; 
                .box-text-inner{
                    padding: 0!important;
                }
            }
        
    }
    
    .section_ketnoi {
        .mxh-icon {
            position: absolute;
            top: 30%;
            right: 25%;
        }
    }
    
    .ss-gio-hoat-dong {
        .text-schedule {
            position: absolute;
            top: 25%;
            left: 10%;
        }
        .y30{
            top: 20%;
        }
    }
    .ss-booking .cot1 .title-td p { font-size: 60px !important;}

    .section_lienhe_cn_thaodien .row-btn{
        .col-btn-nvh1 .col-inner {
            display: flex !important;
            justify-content: flex-end !important;
        }
        .col-btn-nvh2 .col-inner{
            display: flex !important;
            justify-content: flex-start !important;
        }
    }
    .ss-short-intro{
        .col-text-short .col-inner{
            display: flex;
            justify-content: center;
        }
        .col-button-short .col-inner{
            justify-content: center;
        }
    }

    .product-main{
        padding-bottom: 0;
        .content-row .product-info .cart{
            .single_add_to_cart_button, .buy-now-button{
                flex: 1 1 100%;
                width: 100% !important; 
            }
        }       
    }
    .product-footer{
        .related-products-wrapper .row-slider .product-small {
            .box-text{
                .title-wrapper .name a{
                    font-size: 16px;
                }
                .price-wrapper .price .amount{
                    font-size: 16px;
                }
            }

        } 
    }

    .ss-cn{
        .row .large-6{
            padding-left: 15px;
            padding-right: 15px;
        }
    }

}