/*
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.   ***************/


@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}

/****** GLOBAL *******/
@font-face { 
    font-family: EBGaramond-Regular; 
    src: url(asessts/fonts/EBGaramond-Regular.ttf); 
    font-weight: normal; 
}

body{
    font-family: EBGaramond-Regular, sans-serif; 
}

.nav> li> a {
    font-family: 'dancing-script', sans-serif !important;
}

h1,h2,h3,h4,h5,h6{font-family: 'dancing-script', sans-serif;font-weight:normal;}

h1{
    font-size: 62px;
}


.dark, .dark p, .dark td {
    color: #B0AAA1;
}


/****** Header *******/
/* Menu */
.header .header-main .hide-for-medium ul.nav-left{
    justify-content: flex-end;
}

.header .header-main .hide-for-medium ul.nav-right{
    justify-content: flex-start;
}

.nav-spacing-xlarge>li{
    position: relative;
    height: auto;
    overflow: visible;
    z-index: 1;
    cursor: pointer;
}

.nav-spacing-xlarge>li:hover:after{
    content: '';
    position: absolute;
    width: 100%;
    left: 0;
    border: 20px solid transparent;
    border-image: url(asessts/img/bg-border-nav-items.png) 20 stretch;
    height: 100%;
    z-index: 2;
}

.nav-size-xlarge>li>a{
    position: relative;
    font-size: 19.84px;
    padding: 10px;
    z-index: 3;
}

/* Sub menu */
.has-dropdown .icon-angle-down{
    display: none;
}

li.current-dropdown>.nav-dropdown{
    left: 25px;
    padding: 0;
    transform: translateX(-50%);
    min-width: 161px;
}

.menu-item-has-children .nav-dropdown.dark>li>a{
    color: #E8CC24;
    font-size: 19px;
    text-align: center;
    font-family: 'dancing-script', sans-serif;
}

.nav-dropdown.dark>li>a:hover{
    
}


/* Mobile menu */
.off-canvas-center.mfp-bg.mfp-ready{
    opacity: 1;
}

ul.mobile-nav li.nav-icon .icon-menu:before{
    content: '';
    width: 45px;
    height: 35px;
    position: absolute;
    background-image: url(asessts/img/icon-menu.png);
    background-size: cover;
    background-position: center;
    transform: translateY(-50%);
}

ul.mobile-nav li.nav-icon span.menu-title {
    position: absolute;
    bottom: -30px;
    font-size: 15px;
    color: #E8CC24;
}

.mfp-wrap .mfp-close{
    opacity: 1;
    width: 120px;
    position: relative;
    float: right;
}

.mfp-wrap .mfp-close:before{
    content: '';
    width: 45px;
    height: 45px;
    position: absolute;
    background-image: url(asessts/img/icon-close-menu.png);
    top: 0;
    transform: translateX(-50%);
}

.mfp-close svg{
    display: none;
}

.mfp-wrap .mfp-close span.menu-title{
    font-family: 'dancing-script', sans-serif;
    position: absolute;
    bottom: -50px;
    font-size: 15px;
    color: #E8CC24;
    width: 100%;
    right: 0;
}

.searchform-wrapper{
    padding: 0px 30px;
}

.off-canvas-center .mfp-content .searchform{
    max-width: unset;
    width: 100%;
    margin: 0;
}

.searchform-wrapper .searchform input.search-field{
    height: 48px;
    font-size: 1em;
}

.form-flat input:not([type="submit"]){
    border-radius: 0;
    color: #bbb8b7 !important;
    font-style: italic;
}

.dark .form-flat input:not([type="submit"]){
    background-color: transparent !important;
    border-color: rgb(232 205 36);
}

.searchform .button.icon i{
    color: #e8cd24;
}


.mfp-wrap .mfp-container .mfp-content .mobile-sidebar ul li{
    text-align: left;
    
}

.off-canvas-center .nav-sidebar.nav-vertical > li > a{
    font-weight: normal;
    color: #e8cd24;
    border-bottom: 0.5px solid #e8cd2429;
    border-bottom-width: thin;
    margin: 0px 30px;
}

.mfp-wrap .mfp-container .mfp-content .mobile-sidebar ul li.menu-item .toggle i{
    font-size: 2.2em;
    color: #e8cd24;
}

.mfp-wrap .mfp-container .mfp-content .mobile-sidebar ul li.menu-item ul.sub-menu li a{
    font-family: "Dancing-Script", sans-serif;
    font-size: 1.5em;
    font-weight: normal;
    color: #e8cd24;
    border-bottom: 0.5px solid #e8cd2429;
    margin: 0px 30px;
    padding: 15px 30px 15px 60px;
}



/****** Main Content *******/

/* Slider */
.banner-layers{
    max-width: 100% !important;
}

.jo-img-banner-1{
    z-index: 3;
}

.jo-img-banner-2{
    z-index: 2;
}

.jo-img-banner-3{
    z-index: 1;
}

/* Row 1 - Box image */

.jo-row-1{
    position: relative;
    z-index: 22;
}

.jo-row-1:before{
    content: '';
    width: 100%;
    position: absolute;
    background-image: url(asessts/img/box0.png);
    left: -16%;
    top: -48px;
    height: 443px;
    margin-left: calc(-31% + -25px);
    transform: translateX(-50%);
}

.jo-row-1:after{
    content: '';
    width: 100%;
    position: absolute;
    background-image: url(asessts/img/box0.png);
    right: 100%;
    top: -48px;
    height: 443px;
    margin-right: calc(-245% + -50px);
    transform: translateX(-50%);
}




.jo-row-1 .icon-box{
    height: 443px;
    margin-top: -50px;
}

.jo-row-1 .jo-box-1{   
    background-image: url('asessts/img/box1.png');
}

.jo-row-1 .jo-box-2{
    background-image: url('asessts/img/box2.png');
}

.jo-row-1 .jo-box-3{
    background-image: url('asessts/img/box3.png');
}

.jo-row-1 .icon-box-center .icon-box-img{
    padding-top: 7em;
}

.jo-row-1 .icon-box-center .icon-box-text p{
    color: #581E0A;
    font-size: 20px;
    line-height: normal;
    font-weight: bold;
}

.jo-row-1 .icon-box-center .icon-box-text strong.jo-strong-number {
    font-size: 3em;
    font-weight: normal;
}

    /* Row 1 - mobile */
.jo-row1-mobile .box-image:before{
    content: none;
}

.jo-row1-mobile .box-image .overlay{
    background-color: transparent;
}

.jo-row1-mobile .box-text{
    padding-left: 0;
    padding-right: 0;
}

.jo-row1-mobile .box-text p{
    font-size: 12px;
    color: #581E0A;
    line-height: normal;
}

.jo-row1-mobile .box-text p > strong{
    font-size: 22px;
}

/* Section */
.jo-section .bg-fill{
    background-size: auto !important;
    background-repeat: repeat !important;
    background-position: center top;
}


.section-title b{
    flex: 0;
}

/* Row 2 - */
.jo-row-2 .col{
    z-index: 1;
}

.jo-row-2:after{
    content: '';
    position: absolute;
    width: 364px;
    height: 1383px;
    background-image: url(asessts/img/bg-vai-den-row-2.png);
    background-repeat: no-repeat;
    right: -5%;
    z-index: 0;
}


/* Row 3 - Dat mua truc tuyen */
.jo-row-3 .col{
    z-index: 1;
}

.jo-row-3:after{
    content: '';
    position: absolute;
    width: 318px;
    height: 1085px;
    background-image: url(asessts/img/bg-vai-den-row-3.png);
    background-repeat: no-repeat;
    left: -5%;
    top: 18%;
    z-index: 0;
}
.jo-row-3 .jo-image-box-product{
    overflow: visible;
}


.jo-row-3 .jo-image-box-product .box-text{
    width: 100%;
    margin: 0;
    background: transparent;
}

.jo-row-3 .jo-image-box-product .box-text .jo-product-info{
    padding-left: 30px;
}

.jo-row-3 .jo-image-box-product .box-text .jo-product-info h2.jo-product-title{
    font-size: 2em;
    color: #F5D335;
}

.jo-row-3 .jo-image-box-product .box-text .jo-product-info p.jo-price {
    font-size: 1.6em;
}

.jo-row-3 .jo-image-box-product .box-text .devvn_buy_now{
    position: absolute;
    right: 20px;
    max-width: 92px;
    font-size: 25px;
    bottom: -30px;
    padding: 30px 15px;
    color: #F5D335;
    background-color: #0A0809;
    border: 2px solid;
    border-image-source: linear-gradient(45deg, rgb(156 101 11), rgb(250,224,66));
    border-image-slice: 1;
}

.jo-row-3 .jo-image-box-product .box-text .devvn_buy_now:hover{
    color: #F7931E;
}

.jo-image-box-highlight .box-image:before{
    content: none;
}

.jo-image-box-highlight h4.jo-text-row3{
    font-family: EBGaramond-Regular, sans-serif !important;
    font-size: revert;
    color: #F5D335;
}

.jo-image-box-highlight:hover h4.jo-text-row3{
    color: #F7931E;
}


/* Row 4 - Dai su thuong hieu */
.jo-row-4{
    position: relative;
}

.jo-row-4:before{
    content: '';
    position: absolute;
    width: 339px;
    height: 1119px;
    background-image: url(asessts/img/bg-vai-den-row-4-left.png);
    background-repeat: no-repeat;
    left: -25%;
    z-index: 0;
    bottom: -70%;
}

.jo-row-4:after{
    content: '';
    position: absolute;
    width: 363px;
    height: 1383px;
    background-image: url(asessts/img/bg-vai-den-row-4-right.png);
    background-repeat: no-repeat;
    right: -30%;
    z-index: 2;
    top: -39%;
}


.jo-row-4 div.img:before{
    content: '';
    position: absolute;
    width: 35%;
    height: 350px;
    background-image: url(asessts/img/flower1-row4.png);
    background-repeat: no-repeat;
    left: -25%;
    bottom: -10%;
    z-index: 1;
}

.jo-row-4 div.img:after{
    content: '';
    position: absolute;
    width: 20%;
    height: 200px;
    background-image: url(asessts/img/flower2-row4.png);
    background-repeat: no-repeat;
    right: -15%;
    bottom: -3%;
    z-index: 1;
}



/* Row 5 - Tin tuc Blog */
.box-text .post-title{
    font-family: EBGaramond-Regular, sans-serif;
    font-weight: normal;
    font-size: 24px;
    color: #F5D335;
}

.box-text .is-divider{
    display: none;
}



/* Row 6 - Video */
.jo-row-6{
    background-image: url('asessts/img/bg-row-video.png');
    background-repeat: no-repeat;
}


/* Row 7 - Slider truoc sau */
.jo-text-slider{
    padding: 15px;
    background-image: url('asessts/img/anh-truoc-sau-bottom.png');
}

.jo-text-slider h3{
    color: #581E0A;
}

.slider-nav-outside .flickity-page-dots, .row-slider .flickity-page-dots {
    bottom: -30px;
}


.slider-nav-dots-simple .flickity-page-dots .dot{
    background-color: #B0AAA1;
    width: 14px;
    height: 14px;
}

.flickity-page-dots .dot{
    border: none;
    opacity: 1;
}

.flickity-page-dots .dot.is-selected{
    border: none;
    background-color: #E8CC24;
}


.jo-row-7:before{
    content: '';
    position: absolute;
    width: 318px;
    height: 1085px;
    background-image: url(asessts/img/bg-vai-den-row-7-left.png);
    background-repeat: no-repeat;
    left: -5%;
    z-index: 0;
}

.jo-row-7:after{
    content: '';
    position: absolute;
    width: 363px;
    height: 1383px;
    background-image: url(asessts/img/bg-vai-den-row-7-right.png);
    background-repeat: no-repeat;
    right: -8%;
    z-index: 0;
    bottom: -3%;
}





/****** FOOTER *******/
.footer-wrapper{
    background-image: url('asessts/img/bg-body.jpg');
    background-size: auto !important;
    background-repeat: repeat !important;
    background-position: center top;
}

/* Footer 1 - Newsletter */
.footer-wrapper .jo-section-footer-1{
    z-index: 9;
}

.footer-wrapper .jo-section-footer-1 .section-bg{
    padding-bottom: 29% !important;
    top: unset;
    background-image: url(asessts/img/model-1.png);
    width: 25%;
    left: 5%;
}


.jo-row-footer-1 h2{
    color: #581E0A;
    font-weight: normal;
    font-size: 3em;
}

.jo-row-footer-1 > .col{
    padding-bottom: 0;
}


    /* Contact Form */
    .jo-row-footer-1 .jo-contact-form {
        border: 1px solid #fff;
        border-radius: 15px;
        display: flex;
        flex-direction: row;
    }

    .jo-row-footer-1 .wpcf7 form.wpcf7-form{
        max-width: 369px;
        display: block;
        margin: auto;
    }

    .jo-row-footer-1 input[type='tel']{
        font-family: "Dancing Script", sans-serif;
        background-color: transparent;
        border: none;
        color: #fff;
        font-size: 17px;
        margin: 0;
    }

    .wpcf7-spinner{
        display: none;
    }

.jo-row-footer-1 input[type='submit']:not(.is-form){
    font-size: 17px;
    padding: 0 10px;
    margin: 0;
    font-weight: normal;
    margin: 0;
    border-radius: 15px;
    border: 1px solid #581e0a;
    font-family: EBGaramond-Regular;
    height: 100%;
}

 .jo-row-footer-1 ::-webkit-input-placeholder { /* Edge */
      color: #fff;
    }

 .jo-row-footer-1 :-ms-input-placeholder { /* Internet Explorer */
      color: #fff;
    }

  .jo-row-footer-1 ::placeholder {
      color: #fff;
    }

    



/* Footer 2 */
.jo-row-footer-2{
    padding-top: 30px;
}


.jo-row-footer-2 .jo-contacts-wrap h5{
    font-family: EBGaramond-Regular, sans-serif;
    font-weight: normal;
    font-size: 20px;
    color: #F5D335;
}

.jo-row-footer-2 .jo-contacts-wrap p{
    color: #B0AAA1;
}

.jo-row-footer-2 .jo-contacts-wrap .jo-contacts-item{
    position: relative;
    padding-left: 40px;
    margin-bottom: 20px;
}

.jo-row-footer-2-mobile .jo-contacts-wrap .jo-contacts-item{
    padding-left: 25px;
}

.jo-row-footer-2 .jo-contacts-wrap .jo-contacts-item a{
    font-size: 17px;
    color: #B0AAA1;
}

.jo-row-footer-2-mobile .jo-contacts-wrap .jo-contacts-item a{
    font-size: 14px;
}

.jo-row-footer-2 .jo-contacts-wrap .contacts-item-phone:before{
    content: '';
    width: 31px;
    height: 31px;
    position: absolute;
    background-image: url(asessts/img/icon-phone.png);
    background-size: cover;
    background-position: center;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.jo-row-footer-2-mobile .jo-contacts-wrap .contacts-item-phone:before{
    width: 17px;
    height: 17px;
}

.jo-row-footer-2 .jo-contacts-wrap .contacts-item-email:before{
    content: '';
    width: 31px;
    height: 31px;
    position: absolute;
    background-image: url(asessts/img/icon-email.png);
    background-size: cover;
    background-position: center;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.jo-row-footer-2-mobile .jo-contacts-wrap .contacts-item-email:before{
    width: 17px;
    height: 17px;
}



.jo-row-footer-2 ul{
    list-style: none;
    padding-left: 0;
}

.jo-row-footer-2 ul li{
    position: relative;
    padding-left: 35px;
    margin: 0px 0px 20px 0px;
}

.jo-row-footer-2 ul li:before{
    content: '';
    width: 30px;
    height: 27px;
    position: absolute;
    background-image: url(asessts/img/bullet_flower_footer.png);
    background-size: cover;
    background-position: center;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.jo-row-footer-2 ul li a.jo-link-footer {
    font-size: 18px;
    color: #E8CC24;
}

.jo-row-footer-2-mobile ul li a.jo-link-footer{
    font-size: 14px;
}

/* Footer Copyright */
.absolute-footer{
    background-image: url('asessts/img/bg-copyright.png');
    background-size: cover;
}

.absolute-footer .footer-secondary.pull-right {
    display: none;
}

.absolute-footer .copyright-footer{
    font-size: 17px;
    font-weight: bold;
    color: #581E0A;
}




/****** CATEGORY POSTS *******/
.blog-archive{
    padding-top: 0;
}

.blog-archive .archive-page-header{
    display: none;
}

/* Breabcrumb */
nav.breadcrumbs{
    position: relative;
    max-width: 1120px;
    margin: auto;
    margin-bottom: 30px;
    margin-top: 30px;
    font-size: 17px;
    padding: 0px 25px;
}

nav.breadcrumbs:before{
    content: '';
    width: 21px;
    height: 21px;
    position: absolute;
    background-image: url(asessts/img/bullet_breadcrumb.png);
    top: 0;
    transform: translateX(-50%);
}

nav.breadcrumbs a:first-child{
    margin-left: 20px;
}

.dark .breadcrumbs {
    color: #E8CC24;
}

.dark .breadcrumbs a {
    color: #B0AAA1;
}

.breadcrumbs .divider, .breadcrumbs .separator{
    color: #B0AAA1;
}


/* Box Blog Post */
.box-image{
    z-index: 0;
}

.box-image:before{
    content: '';
    position: absolute;
    width: 100%;
    left: 0;
    border: 20px solid transparent;
    border-image: url(asessts/img/bg-border-thumb-post.png) 20 stretch;
    height: 100%;
    z-index: 9;
}


.box-image .image-cover{
    padding-top: 232px !important;
}

/* Pagination */
.nav-pagination>li>a{
    border: none;
    background-image: url(asessts/img/bullet-pagination-1.png);
    width: 42px;
    height: 42px;
    line-height: 42px;
}

.nav-pagination > li > .current, .nav-pagination > li > span:hover, .nav-pagination > li > a:hover{
    border: none;
    background-image: url(asessts/img/bullet-pagination-2.png);
    width: 42px;
    height: 42px;
    line-height: 42px;
    color: #fff;
    background-color: transparent !important;
}





/****** SINGLE POST *******/
.blog-single{
    padding-top: 0;
    padding-bottom: 150px;
}

.blog-single .breadcrumbs{
    margin-top: 0;
}

.entry-header .entry-image{
    max-width: 388px;
    margin: 0 auto;
}

.entry-header .entry-header-text h1.entry-title{
    color: #E8CC24;
    font-size: 45px;
    line-height: normal;
    margin-top: .5em;
    font-family: "Dancing Script", sans-serif;
}

.entry-header .entry-header-text .jo-excerpt-single-post{
    font-size: 17px;
    padding: 5px 10px;
    border: 2px dotted #e8cc24;
}

.single-page h3{
    color: #e8cc24;
    font-size: 22px;
}

.single-page p{
    color: #393132;
}

footer.entry-meta{
    font-size: 17px;
    border: none;
    color: #E8CC24;
}

footer.entry-meta a:hover{
    color: #B0AAA1;
}

.jo-box-image{
    max-width: 540px;
}

.jo-box-image .box-text{
    background-color: #E8CC24;
}

.jo-box-image .box-image:before{
    content: none;
}

.jo-box-image  p.jo-box-text{
    padding: 0px 20px;
}

.blog-single article.post .entry-content.single-page ul{
    list-style: none;
}

.blog-single article.post .entry-content.single-page ul li{   
    position: relative;
    padding-left: 30px;
    color: #393132;
}

.blog-single article.post .entry-content.single-page ul li:before{
    content: '';
    width: 21px;
    height: 21px;
    position: absolute;
    background-image: url(asessts/img/bullet_breadcrumb.png);
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.blog-single article.post .entry-content.single-page blockquote{
    position: relative;
    font-size: initial;
    padding: 20px 15px;
    font-style: initial;
    border: none;
    background-color: #E8CC24;
}

.blog-single article.post .entry-content.single-page blockquote:before{
    content: '';
    position: absolute;
    width: 17px;
    height: 14px;
    background-image: url(asessts/img/blockquote-mark-open.png);
    left: 15px;
    top: -5px;  
}

.blog-single article.post .entry-content.single-page blockquote:after{
    content: '';
    position: absolute;
    width: 17px;
    height: 14px;
    background-image: url(asessts/img/blockquote-mark-close.png);
    right: 15px;
    bottom: -5px;  
}

.blog-single article.post .entry-content.single-page blockquote > p{
    margin-bottom: 0;
}

/* Sidebar */
span.widget-title{
    font-size: 24px;
    font-weight: normal;
    color: #E8CC24;
    position: relative;
    line-height: 17px;
}

span.widget-title > span{
    margin-left: 20px;   
}

span.widget-title:before{
    content: '';
    width: 21px;
    height: 21px;
    position: absolute;
    background-image: url(asessts/img/bullet_breadcrumb.png);
    transform: translateX(-50%);
}

aside.widget_media_image img{
    width: 100%;
}





/* Laptop - desktop */
@media only screen and (max-width: 1024px) {
    
}

/* Tablet */
@media screen and (max-width: 849px){
    .jo-row-2:after, .jo-row-3:after, .jo-row-4 div.img:before, .jo-row-4 div.img:after, .jo-row-4:before, .jo-row-4:after,.jo-row-7:before, .jo-row-7:after{
        content: none;    
    }
    
    .jo-row-6{
        background-image: unset;    
    }
    
    /****** FOOTER *******/
    .jo-row-footer-1 h2 {
        font-size: 2em;
        text-align: right;
    }
    .jo-row-footer-1 .wpcf7 form.wpcf7-form{
        float: right;
    }
    
    .footer-wrapper .jo-section-footer-1 .section-bg{
        padding-bottom: 40% !important;
        width: 35%;
    }
}

/* Mobile */
@media screen and (max-width: 549px){
    /****** GLOBAL *******/
    h1.section-title{
        font-size: 26px;    
    }
    
    /**** Main Content ****/
    /* Row 3 */
    .jo-row-3 .jo-image-box-product .box-text .jo-product-info h2.jo-product-title{
        font-size: 14px;    
    }
    
    .jo-row-3 .jo-image-box-product .box-text .jo-product-info p.jo-price{
        font-size: 14px;
    }
    
    .jo-row-3 .jo-image-box-product .box-text .devvn_buy_now{
        font-size: 20px;
        padding: 25px 20px;
    }
    
    /****** FOOTER *******/
    .jo-row-footer-1 h2{
        font-size: 18px;
    }
    
    .jo-row-footer-1 .wpcf7 form.wpcf7-form{
        max-width: 223px;
    }
    
    .jo-row-footer-1 input[type='tel']{
        font-size: 11px;
    }
    
    .jo-row-footer-1 input[type='submit']:not(.is-form){
        max-width: 100px;
        font-size: 12px;
        padding: 0 10px;
    }
    
    .footer-wrapper .jo-section-footer-1 .section-bg{
        padding-bottom: 55% !important;
        width: 45%;
        left: 3%;
    }
}