@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
body{
    background: #fff;
    font-family: "Inter", sans-serif;
}
#main{
    background: #fff;
}
.container-width, .full-width .ubermenu-nav, .container, .row{
    max-width: 1470px;
}
.cormorant-garamond-700 {
    font-family: "Cormorant Garamond", serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}
.title-style-1{
    font-size: 42px;
    font-weight: 600;
    color: #000;
    margin-bottom: 20px;
    line-height: 1.5;
    font-family: "Cormorant Garamond", serif;
}
.product-small.box{
    overflow: hidden;
}
.owl-style-1 .box-image{
    transition: all 0.6s ease;
    aspect-ratio: 1/1 !important;
    position: relative;
}
/* .owl-style-1 .col:not(.is-selected:first-child) .box-image{
    aspect-ratio: 5/6;
} */
.owl-style-1 .box-text-products{
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 10;
    background: transparent;
    transition: all 0.7s ease;
    opacity: 0;
}
.owl-style-1 .box .box-image:before{
    transition: all 0.7s ease;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
    opacity: 0;
}
.owl-style-1 .box:hover .box-image:before, .col.active-main .box-image:before{
    opacity: 0.5 !important;
}
.owl-style-1 .box:hover .box-text-products, .col.active-main .box-text-products{
    opacity: 1 !important;
}
.owl-style-1 .woocommerce-LoopProduct-link{
    color: white;
}
.owl-style-1 .flickity-page-dots{
    text-align: left;
    left: calc(33.33% + 20px);
    bottom: 30px;
}
.flickity-page-dots{
    text-align: left;
    left: 20px;
    bottom: 0px;
}
.flickity-page-dots .dot{
    position: relative;
    border-width: 1px;
    border-color: #fff;
    opacity: 1 !important;
    padding: 5px !important;
    height: 20px !important;
    width: 20px !important;
    background: #fff !important;
    transition: all 0.3s ease;
}
.flickity-page-dots .dot:before{
    content: "";
    position: absolute;
    top: 40%;
    left: 40%;
    padding: 5px;
    transform: translate(-35%, -35%);
    width: 70%;
    height: 70%;
    background: #B6B6B6;
    border-radius: 50%;
}
.flickity-page-dots .dot.is-selected{
    border: 1px solid #000;
}
.flickity-page-dots .dot.is-selected:before{
    background: #000;
}
@media (min-width: 769px){
    .owl-style-1 .flickity-slider .col.active-main .box-image {
        aspect-ratio: 2/2.45 !important;
        width: 100% !important;
    }
    .owl-style-1 .col:hover .box-image{
        aspect-ratio: 2/2.45 !important;
    }
}

/** about 2 **/
.v1-bg-xam .row{
    position: relative;
}
.v1-bg-xam .row:after{
    content: "";
    position: absolute;
    bottom: 30px;
    left: 15px;
    width: calc(100% - 30px);
    height: calc(100% - 30px);
    background: linear-gradient(to top, #F5F5F5 0%, #ffffff 100%);
    z-index: -1;
}
.v1-bg-xam.reverse .section-content > .row{
    padding-top: 30px;
}
.v1-bg-xam.reverse .row:after{
    background: linear-gradient(to bottom, #F5F5F5 0%, #ffffff 100%);
}
.v1-bg-xam .last-col{
    padding-right: 30px;
}
.v1-bg-xam.bg-full .row:after{
    background: #f5f5f5;
}
.banner{
    background-color: transparent !important;
}
@media (min-width: 769px){
    .v1-bg-xam.pd .section-content > .row{
        padding-left: 30px;
        padding-right: 30px;
    }
}

/*** product cat ***/
.row p.product-title.woocommerce-loop-product__title {
    text-align: left;
    min-height: 45px;
    font-weight: 600;
}
.product-small.box{
    border: none !important;
    border-radius: 0 !important;
}
.product-small .box-image, .banner, .banner-bg{
    border-radius: 0px !important;
}
@media (max-width: 768px) {

    /* container tabs */
    .tabbed-content > .nav,
    .tabbed-content > .nav-tabs,
    .tabbed-content > ul.nav {
      display: flex !important;
      flex-wrap: nowrap !important;
      overflow-x: auto !important;
      overflow-y: hidden !important;
      white-space: nowrap;
      -webkit-overflow-scrolling: touch;
    }
  
    /* ẩn scrollbar */
    .tabbed-content > ul.nav::-webkit-scrollbar {
      display: none;
    }
    .tabbed-content > ul.nav > li.tab {
      float: none !important;      /* override Flatsome */
      flex: 0 0 auto !important;
      white-space: nowrap;
    }
    .tabbed-content .nav-center {
      justify-content: flex-start !important;
    }
  
}
  
  

/* tabs products */
.nav-outline{
    margin-bottom: 20px;
}
.nav-box>li, .nav-outline>li, .nav-pills>li, .nav-tabs>li{
    margin: 0px 10px;
}
.nav-outline>li>a{
    border: 1px solid transparent;
    border-radius: 0px;
    background: #f5f5f5;
    z-index: 10;
    padding: 5px 20px;
}
.tabs-cat .button{
    margin-top: 30px;
}
.product-small.box{
    background: transparent !important;
}
.product-small .price-wrapper{
    display: none;
}

/* khach hang */
.box-blog-post{
    padding: 10px;
    background: linear-gradient(to top, #F5F5F5 0%, #ffffff 100%);
}
.box-blog-post .is-divider, .post-date{
    display: none;
}
.box-image{
    border-radius: 0px !important;
}

/* quy trinh */
.numbe-circle{
    background: #fff;
    border: 1px solid #000;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

/* footer */
.wpfooter{
    padding-bottom: 0px !important;
}
.wpfooter .section-title-container{
    margin-bottom: 0.8em;
}
.section-title-normal span{
    border-bottom: 2px solid #ED1C24;
}
.wpfooter.v1-bg-xam .row:after{
    height: 100% !important;
    bottom: 0;
}
.about-footer{
    position: relative;
    &:before{
        background: #fff5f4;
        content: "";
        position: absolute;
        top: 0;
        left: 10px;
        width: 100%;
        height: calc(100% - 0px);
    }
}
.about-footer .col-inner, .row-about-footer{
    height: 100%;
}
i.red{
    color: #ED1C24;
}
.footer-list-address i{
    margin-right: 5px;
    font-size: 18px;
}
.newsletter-wrap {
    display: flex;
    width: 100%;
}
.newsletter-input input {
    height: 52px;
    border: none;
    padding: 0 16px;
    font-size: 16px;
    border-radius: 4px 0 0 4px;
}
.newsletter-submit {
    width: 60px;
}
.newsletter-btn {
    width: 100%;
    height: 52px;
    background: #e53935;
    border: none;
    border-radius: 0 4px 4px 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.newsletter-btn svg {
    display: block;
}
  

/* responsive */

@media (max-width: 768px){
    .title-style-1{
        font-size: 32px;
    }
    .col-md-1-5 { 
        width: 50%;
        flex-basis: 50%;
        max-width: 50%;
    }
    .v1-bg-xam .row:after{
        width: 100%;
        left: 0;
    }
    /* row blog posts */
    .mobile-scroll-posts .row.large-columns-4, .row.mobile-scroll-posts {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
    }
    .mobile-scroll-posts .row.large-columns-4::-webkit-scrollbar, .row.mobile-scroll-posts::-webkit-scrollbar  {
        display: none;
    }
    .mobile-scroll-posts .row.large-columns-4 > .col.post-item {
        flex: 0 0 80% !important;
        max-width: 80% !important;
    }
    .col > .col-inner{
        padding: 0px !important;
    }
    .row.mobile-scroll-posts > .col {
        float: none !important;
        flex: 0 0 80% !important;
        max-width: 80% !important;
    }

    /* title */
    .title-style-1{
        font-size: 28px;
    }
    .about-footer{
        padding-top: 30px;
        min-height: unset !important;
        margin-bottom: 20px;
    }
    .about-footer:before {
        left: 0;
    }
    .dmca{
        display: block;
        margin: 0px auto;
    }
}
@media (min-width: 769px){
    .col-md-1-5 {
        width: 20%;
        flex-basis: 20%;
        max-width: 20%;
    }
    .mt-desktop-5 {
        margin-top: 50px;
    }
    .mt-desktop-4 {
        margin-top: 40px;
    }
    .mt-desktop-3 {
        margin-top: 30px;
    }
    .mt-desktop-2 {
        margin-top: 20px;
    }
    .mt-desktop-1 {
        margin-top: 10px;
    }
    .owl-style-1 .flickity-viewport {
        min-height: 350px !important; 
    }
    .wp-section-banner .row{
        max-width: 1310px !important;
    }
    /* .w120-desktop{
        overflow: hidden;
    }
    .w120-desktop > .col-inner{
        width: 120% !important;
    } */
    .w120-desktop > .col-inner{
        width: 120% !important;
        overflow: hidden;
    }
    .wpfooter .col{
        padding-top: 10px !important;
        padding-bottom: 0px !important;
    }
}