@font-face {
    font-family: "UTM Avo";
    src: url(/fonts/UTMAvoBold.woff2) format("woff2"), url(/fonts/UTMAvoBold.woff) format("woff");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "UTM Avo";
    src: url(/fonts/UTMAvo-Italic.woff2) format("woff2"), url(/fonts/UTMAvo-Italic.woff) format("woff");
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "UTM Avo";
    src: url(/fonts/UTMAvo.woff2) format("woff2"), url(/fonts/UTMAvo.woff) format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "UTM Avo";
    src: url(/fonts/UTMAvo-BoldItalic.woff2) format("woff2"), url(/fonts/UTMAvo-BoldItalic.woff) format("woff");
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}


html::-webkit-scrollbar { width: 8px; background-color: #f5f5f5 }
html::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); background-color: #f5f5f5 }
html::-webkit-scrollbar-thumb { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); background: var(--mainColor) }
body {
    font-size: 14px;
    color: var(--textColor);
    font-family: 'UTM Avo', sans-serif;
}
    body.search-active { overflow-y: hidden }
svg { width: 20px; height: 20px }

@media (min-width: 1366px) {
    .container { max-width: 1300px }
}

a { color: var(--textColor); transition: all .3s }
    a:hover { color: var(--mainColor); text-decoration: none }
ul, ol { margin: 0px; padding: 0px; list-style: none }
.relative { position: relative }
.alert { position: relative; padding: .75rem 1.25rem; margin-bottom: 1rem; border: 1px solid transparent; border-radius: .25rem }
.swiper-button-prev { background: none }
.swiper-button-next { background: none }
.alert-heading { color: inherit }
.alert-link { font-weight: 700 }
.alert-dismissible .close { position: absolute; top: 0; right: 0; padding: .75rem 1.25rem; color: inherit; border: initial; background: initial }
.alert-primary { color: #004085; background-color: #cce5ff; border-color: #b8daff }
    .alert-primary hr { border-top-color: #9fcdff }
    .alert-primary .alert-link { color: #002752 }
.alert-secondary { color: #383d41; background-color: #e2e3e5; border-color: #d6d8db }
    .alert-secondary hr { border-top-color: #c8cbcf }
    .alert-secondary .alert-link { color: #202326 }
.alert-success { color: #155724; background-color: #d4edda; border-color: #c3e6cb }
    .alert-success hr { border-top-color: #b1dfbb }
    .alert-success .alert-link { color: #0b2e13 }
.alert-info { color: #0c5460; background-color: #d1ecf1; border-color: #bee5eb }
    .alert-info hr { border-top-color: #abdde5 }
    .alert-info .alert-link { color: #062c33 }
.alert-warning { color: #856404; background-color: #fff3cd; border-color: #ffeeba }
    .alert-warning hr { border-top-color: #ffe8a1 }
    .alert-warning .alert-link { color: #533f03 }
.alert-danger { color: #721c24; background-color: #f8d7da; border-color: #f5c6cb }
    .alert-danger hr { border-top-color: #f1b0b7 }
    .alert-danger .alert-link { color: #491217 }
.alert-light { color: #818182; background-color: #fefefe; border-color: #fdfdfe }
    .alert-light hr { border-top-color: #ececf6 }
    .alert-light .alert-link { color: #686868 }
.alert-dark { color: #1b1e21; background-color: #d6d8d9; border-color: #c6c8ca }
    .alert-dark hr { border-top-color: #b9bbbe }
    .alert-dark .alert-link { color: #040505 }
.alert-dismissible .close { position: absolute; top: 0; right: 0; padding: .75rem 1.25rem; color: inherit; border: initial; background: initial }
figcaption { text-align: center; margin: 10px 0px }
.close { float: right; font-size: 21px; font-weight: bold; line-height: 1; color: #000; text-shadow: 0 1px 0 #fff; opacity: 0.2; filter: alpha(opacity=20) }
button.close { padding: 0; cursor: pointer; background: transparent; border: 0; -webkit-appearance: none }
.mrb-30 { margin-bottom: 30px }

@media (min-width: 1200px) {
    .col-xl-custom { -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20% }
}

.swiper-button-next, .swiper-button-prev { background: #fff; width: 50px; height: 50px; z-index: 5; top: 50%; border-radius: 8px; border: 1px solid #eaeaea }
    .swiper-button-next:after, .swiper-button-prev:after { font-size: 14px; font-weight: bold; color: var(--mainColor) }
    .swiper-button-next:hover, .swiper-button-prev:hover { background: var(--mainColor); border-color: var(--mainColor) }
        .swiper-button-next:hover:after, .swiper-button-prev:hover:after { color: #fff }
.section_team .swiper-button-next, .section_team .swiper-button-prev, .section_partner .swiper-button-next, .section_partner .swiper-button-prev { top: 41%; }

@media (max-width: 767px) {
    .swiper-button-next, .swiper-button-prev { width: 35px; height: 35px }
        .swiper-button-next:after, .swiper-button-prev:after { font-size: 13px !important }
}

.swiper-pagination { width: 100%; position: initial }
    .swiper-pagination .swiper-pagination-bullet { height: 10px; width: 10px; opacity: .5; margin: 0px 3px; transition: all .3s; background-color: var(--mainColor) }
    .swiper-pagination .swiper-pagination-bullet-active { width: 25px; opacity: 1; border-radius: 14px; background-color: var(--mainColor) }
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled { display: none }
.line-clamp { display: block; display: -webkit-box; -webkit-box-orient: vertical; position: relative; line-height: 1.4 !important; overflow: hidden; text-overflow: ellipsis; padding: 0 !important }
    .line-clamp:after { content: ''; text-align: right; bottom: 0; right: 0; width: 25%; display: block; position: absolute; height: calc(1em * 1.4); background: linear-gradient(to right, rgba(255,255,255,0), #fff 75%) }
@supports (-webkit-line-clamp: 1) {
    .line-clamp:after { display: none !important }
}
.line-clamp-1 { -webkit-line-clamp: 1; height: calc(1em * 1.4 * 1) }
.line-clamp-2 { -webkit-line-clamp: 2; height: calc(1em * 1.4 * 2) }
.line-clamp-3 { -webkit-line-clamp: 3; height: calc(1em * 1.4 * 3) }
.block-title { margin-bottom: 40px; text-align: center; position: relative }
    .block-title .top-title { color: var(--mainColor2); font-size: 30px; font-weight: 600; display: block; margin-bottom: 10px; text-transform: uppercase }

@media (max-width: 320px) {
    .block-title .top-title { font-size: 16px; letter-spacing: 2px }
}

.block-title h2 { color: var(--textColor); font-size: 24px; font-weight: bold; margin-bottom: 20px }
    .block-title h2 a { color: var(--textColor) }
        .block-title h2 a:hover { color: var(--mainColor) }

@media (max-width: 767px) {
    .block-title h2 { font-size: 28px }
}

@media (max-width: 320px) {
    .block-title h2 { font-size: 24px; line-height: 35px }
}

@media (max-width: 767px) {
    .block-title { margin-bottom: 20px }
}

.banner-top { text-align: center; background-color: var(--mainColor) }
    .banner-top img { max-width: 100% }

@media (max-width: 767px) {
    .banner-top { display: none }
}

.top-bar {
    background-color: #42c1c7;
    border-bottom: 1px solid #f7f7f7
}
    .top-bar .ul-control { display: flex; align-items: center; justify-content: flex-end }
        .top-bar .ul-control li { position: relative; line-height: 50px }
            .top-bar .ul-control li a { display: block }
            .top-bar .ul-control li img { height: 24px; width: 24px; margin-right: 3px }
            .top-bar .ul-control li.top-lang { position: relative; margin-right: 10px }
                .top-bar .ul-control li.top-lang img { height: auto; margin-right: 3px; margin-top: -2px }
                .top-bar .ul-control li.top-lang .drop-account { width: 130px; position: absolute; top: 100%; right: 0; background: #fff; text-align: left; z-index: 999; -webkit-box-shadow: 0px 2px 6px 0px rgba(50,50,50,0.33); -moz-box-shadow: 0px 2px 6px 0px rgba(50,50,50,0.33); box-shadow: 0px 2px 6px 0px rgba(50,50,50,0.33); transition-duration: 0s; transition-delay: .1s; opacity: 0; visibility: hidden }
                    .top-bar .ul-control li.top-lang .drop-account li { display: block; line-height: 35px }
                        .top-bar .ul-control li.top-lang .drop-account li a { display: block; padding: 0 5px; text-decoration: none }
                        .top-bar .ul-control li.top-lang .drop-account li:first-child { border-bottom: solid 1px #ebebeb }
                .top-bar .ul-control li.top-lang:hover .drop-account { opacity: 1; visibility: visible }
        .top-bar .ul-control .top-social { position: relative; margin-right: 10px }
            .top-bar .ul-control .top-social .top-social-box { display: flex; align-items: center }
                .top-bar .ul-control .top-social .top-social-box a {
                    display: block;
                    width: 50px;
                    height: 50px;
                    line-height: 50px;
                    text-align: center;
                    color: var(--textColor);
                    border-right: 1px solid #42b3b9;
                    cursor: pointer;
                    position: relative
                }
                    .top-bar .ul-control .top-social .top-social-box a svg {
                        fill: #1b9197;
                        width: 24px;
                        height: 24px
                    }
                    .top-bar .ul-control .top-social .top-social-box a:hover { opacity: 0.6 }

@media (max-width: 767px) {
    .top-bar .ul-control .top-social { margin-right: 0px }
}

.top-bar .ul-control .account { text-align: center; position: relative }
    .top-bar .ul-control .account a { color: var(--textColor); position: relative }
    .top-bar .ul-control .account .drop-account { width: 130px; position: absolute; top: 100%; right: 0; background: #fff; text-align: center; z-index: 999; -webkit-box-shadow: 0px 2px 6px 0px rgba(50,50,50,0.33); -moz-box-shadow: 0px 2px 6px 0px rgba(50,50,50,0.33); box-shadow: 0px 2px 6px 0px rgba(50,50,50,0.33); transition-duration: 0s; transition-delay: .1s; opacity: 0; visibility: hidden }
        .top-bar .ul-control .account .drop-account a { display: block; text-decoration: none; line-height: 30px; padding: 0 5px }
            .top-bar .ul-control .account .drop-account a:hover { color: var(--mainColor) }
            .top-bar .ul-control .account .drop-account a:first-child { border-bottom: solid 1px #ebebeb }

@media (min-width: 991px) {
    .top-bar .ul-control .account:hover .drop-account { opacity: 1; visibility: visible }
}

@media (max-width: 767px) {
    .top-bar .ul-control .header-search { width: 50px; height: 50px; text-align: center }
        .top-bar .ul-control .header-search .button-search svg {
            width: 24px;
            height: 24px;
            fill: #0c5b5f
        }
}

.top-bar .top-bar-left { display: flex; align-items: center }
    .top-bar .top-bar-left li { position: relative; line-height: 40px }
        .top-bar .top-bar-left li a { display: block }
            .top-bar .top-bar-left li a svg {
                fill: #1b9197
            }
        .top-bar .top-bar-left li:first-child { margin-right: 10px }
#header { position: relative; background-color: #fff }
    #header .header-top { padding: 15px 0px }
    #header .logo img { max-height: 50px; width: auto }
    #header .header-control { text-align: right }
        #header .header-control .ul-control { display: inline-flex; align-items: center; gap: 10px }
            #header .header-control .ul-control .header-wish { text-align: center; margin-right: 20px; position: relative }
                #header .header-control .ul-control .header-wish > a { color: var(--textColor); position: relative }
                    #header .header-control .ul-control .header-wish > a img.icon { width: 22px; height: 22px }
                    #header .header-control .ul-control .header-wish > a .count-item { width: 18px; height: 18px; background: var(--mainColor); display: flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 11px; font-weight: 500; color: #fff; position: absolute; right: 5px; top: -8px }

@media (max-width: 991px) {
    #header .header-control .ul-control .header-wish > a .count-item { right: 0px; top: 0px }
}

@media (max-width: 767px) {
    #header .header-control .ul-control .header-wish > a .count-item { right: -5px; top: -5px }
}

#header .header-control .ul-control .header-wish > a:hover { color: var(--mainColor) }
#header .header-control .ul-control .header-wish > a .info { display: block; margin-top: 8px }

@media (max-width: 991px) {
    #header .header-control .ul-control .header-wish > a .info { display: none }
}

@media (max-width: 991px) {
    #header .header-control .ul-control .header-wish > a { width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center }
}

@media (max-width: 767px) {
    #header .header-control .ul-control .header-wish > a { width: 31px; height: 31px }
}

@media (max-width: 991px) {
    #header .header-control .ul-control .header-wish { margin-right: 7px }
}

#header .header-control .ul-control .header-cart { text-align: center; position: relative }
    #header .header-control .ul-control .header-cart .cart-head { color: #fff; font-size: 14px; position: relative; display: flex; align-items: center; border-radius: 5px; padding: 0px 10px; padding-right: 20px; height: 40px; background-color: var(--mainColor) }
        #header .header-control .ul-control .header-cart .cart-head img { height: 16px; margin-right: 5px; filter: brightness(0) invert(1) }
        #header .header-control .ul-control .header-cart .cart-head .info { display: block }

@media (max-width: 767px) {
    #header .header-control .ul-control .header-cart .cart-head .info { display: none }
}

#header .header-control .ul-control .header-cart .cart-head .count-item { width: 18px; height: 18px; display: inline-block; border-radius: 50%; font-size: 12px; font-weight: 500; color: var(--mainColor); background-color: #fff; position: absolute; right: 3px; top: 3px }
#header .header-control .ul-control .header-cart .cart-head:hover { background-color: var(--mainColor2) }

@media (max-width: 767px) {
    #header .header-control .ul-control .header-cart .cart-head { padding: 0px 10px }
}

#header .header-control .ul-control .header-search { text-align: center; position: relative }
    #header .header-control .ul-control .header-search .button-search { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 5px; cursor: pointer; background-color: var(--mainColor3) }
        #header .header-control .ul-control .header-search .button-search svg { width: 24px; height: 24px; fill: var(--textColor) }
        #header .header-control .ul-control .header-search .button-search:hover { background-color: var(--mainColor2) }
            #header .header-control .ul-control .header-search .button-search:hover svg { fill: #fff }
#header .header-control .ul-control .menu-bar { width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 5px; background-color: var(--mainColor) }
    #header .header-control .ul-control .menu-bar svg { fill: #fff; width: 24px; height: 24px }

@media (max-width: 991px) {
    #header .header-control .ul-control .menu-bar { display: inline-flex !important }
}

#header .search-wrap-popup { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #fff; z-index: 99999; align-items: center; justify-content: center; display: none }
    #header .search-wrap-popup.active { display: flex; z-index: 9999; position: fixed; top: 0; left: 0; height: 100px; width: 100%; }
.search-header { max-width: 500px; margin: 0px auto }
    .search-header .search-smart { position: relative }
        .search-header .search-smart .header-search-form { position: relative }
            .search-header .search-smart .header-search-form input { width: 100%; padding: 10px 30px; border-radius: 5px; padding-right: 90px; line-height: 25px; height: auto; border: 1px solid #DEDACE }
            .search-header .search-smart .header-search-form button { display:inline-block!important; width:61px; color: #fff; position: absolute; top: 0px; right: 0px; border: 0; height: 100%; padding: 0px 20px; display: flex; align-items: center; justify-content: center; letter-spacing: 0; border-radius: 0 5px 5px 0; background-color: var(--mainColor) }
                .search-header .search-smart .header-search-form button svg {
                    fill: #0c5b5f
                }
                .search-header .search-smart .header-search-form button:hover { background-color: var(--mainColor2) }
    .search-header .search-suggest { position: absolute; top: 40px; left: 0; width: 100%; z-index: 99999; background: #fff; border: solid 1px #dfe3e8; display: none; position: absolute; top: 100%; border-radius: 8px; max-height: 550px; overflow-y: auto }

@media (max-width: 767px) {
    .search-header .search-suggest { max-height: 430px }
    .fixed.right-4 button {
        padding: 5px 8px;
    }
}

.search-header .search-suggest::-webkit-scrollbar-thumb { background-color: var(--mainColor); outline: 1px solid var(--mainColor) }
.search-header .search-suggest::-webkit-scrollbar { width: 3px }
.search-header .search-suggest.open { display: block; z-index: 99999; padding: 10px }
    .search-header .search-suggest.open .title { display: inline-block; color: #000 }
.search-header .list-search-style { text-align: center; margin-bottom: 0px }
    .search-header .list-search-style .title-search { text-align: left; margin-top: 10px }
        .search-header .list-search-style .title-search span { font-size: 20px; font-weight: 700; margin-bottom: 20px; position: relative; display: inline-block }
            .search-header .list-search-style .title-search span:before { background: var(--mainColor); content: ''; right: 0; left: 0; position: absolute; bottom: -5px; height: 3px; display: block; z-index: 1; width: 40% }
    .search-header .list-search-style .see-more { color: #fff; padding: 8px 30px; display: inline-block; border-radius: 5px; font-size: 16px; font-weight: 500; margin-top: 15px; background: #000 }
        .search-header .list-search-style .see-more:hover { background: var(--mainColor) }
    .search-header .list-search-style .product-smart, .search-header .list-search-style .art-smart { display: inline-block; padding: 0px 0px 8px; border-bottom: 1px solid #ededed; background: #fff; position: relative; width: 100%; text-align: left }
        .search-header .list-search-style .product-smart:first-child, .search-header .list-search-style .art-smart:first-child { margin-top: 5px }
        .search-header .list-search-style .product-smart:last-child, .search-header .list-search-style .art-smart:last-child { border-bottom: none }
        .search-header .list-search-style .product-smart .image_thumb, .search-header .list-search-style .art-smart .image_thumb { display: inline-block; float: left; width: 60px }
            .search-header .list-search-style .product-smart .image_thumb img, .search-header .list-search-style .art-smart .image_thumb img { object-fit: scale-down }
        .search-header .list-search-style .product-smart .product-info, .search-header .list-search-style .art-smart .product-info { display: block; float: left; width: calc(100% - 60px); -o-width: calc(100% - 60px); -moz-width: calc(100% - 60px); -webkit-width: calc(100% - 60px); padding-left: 10px }
        .search-header .list-search-style .product-smart .product-info, .search-header .list-search-style .art-smart .product-info { margin: 5px 0 5px; position: relative }
            .search-header .list-search-style .product-smart .product-info h3, .search-header .list-search-style .art-smart .product-info h3 { padding: 0; text-overflow: ellipsis; color: #000; text-decoration: none; font-size: 14px; font-weight: 500; margin: 0 0 3px; padding-bottom: 3px; text-transform: capitalize }

@media (max-width: 1199px) {
    .search-header .list-search-style .product-smart .product-info h3, .search-header .list-search-style .art-smart .product-info h3 { font-size: 14px }
}

.search-header .list-search-style .product-smart .product-info h3:hover, .search-header .list-search-style .art-smart .product-info h3:hover { color: var(--mainColor) }
.search-header .list-search-style .product-smart .product-info h3 a, .search-header .list-search-style .art-smart .product-info h3 a { font-weight: 500; color: #000 }
    .search-header .list-search-style .product-smart .product-info h3 a:hover, .search-header .list-search-style .art-smart .product-info h3 a:hover { color: var(--mainColor) }
.search-header .list-search-style .product-smart .product-info .price-box, .search-header .list-search-style .art-smart .product-info .price-box { color: red; line-height: 23px; display: block; font-size: 14px; font-weight: 500 }
    .search-header .list-search-style .product-smart .product-info .price-box .price, .search-header .list-search-style .art-smart .product-info .price-box .price { padding-right: 5px }
    .search-header .list-search-style .product-smart .product-info .price-box .compare-price, .search-header .list-search-style .art-smart .product-info .price-box .compare-price { text-decoration: line-through; font-size: 12px; color: #969696; line-height: 24px; font-weight: 300 }
.item_product_main { position: relative; transition: all .3s }
.product-action:not(.not) { position: relative }
    .product-action:not(.not) .product-thumbnail { position: relative; overflow: hidden; transition: all .35s ease-in-out }
        .product-action:not(.not) .product-thumbnail .image_thumb { position: relative; overflow: hidden; width: 100%; display: flex; -o-justify-content: center; -moz-justify-content: center; -webkit-justify-content: center; -os-justify-content: center; -o-display: flex; -moz-display: flex; -webkit-display: flex; -os-display: flex; align-items: center; position: relative; height: auto !important; padding-bottom: 100% }
            .product-action:not(.not) .product-thumbnail .image_thumb img { width: auto !important; max-height: 100%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; will-change: opacify; transform: scale(1); transition: all 0.5s ease }
        .product-action:not(.not) .product-thumbnail .setWishlist { position: absolute; top: 10px; right: 10px; z-index: 8; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 5px; background-color: #fff }
            .product-action:not(.not) .product-thumbnail .setWishlist svg { width: 24px; height: 24px }
            .product-action:not(.not) .product-thumbnail .setWishlist:hover { background-color: var(--mainColor) }
                .product-action:not(.not) .product-thumbnail .setWishlist:hover svg path { fill: #fff }
            .product-action:not(.not) .product-thumbnail .setWishlist.active { background-color: var(--mainColor) }
                .product-action:not(.not) .product-thumbnail .setWishlist.active svg path { fill: #fff }
    .product-action:not(.not) .product-info { z-index: 1; padding: 10px 0px; position: relative }
        .product-action:not(.not) .product-info .product-name { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; white-space: initial; overflow: hidden; margin: 0 0 6px; font-size: 15px; font-weight: 700; line-height: 20px; overflow: hidden }
            .product-action:not(.not) .product-info .product-name a { display: block; color: var(--textColor) }
                .product-action:not(.not) .product-info .product-name a:hover { color: var(--mainColor) }
        .product-action:not(.not) .product-info .price-box { font-weight: 700; font-size: 16px; color: var(--priceColor); display: flex; gap: 10px; align-items: center }
            .product-action:not(.not) .product-info .price-box span { display: block; line-height: 20px }
            .product-action:not(.not) .product-info .price-box .compare-price { text-decoration: line-through; font-size: 14px; color: var(--textColor); font-weight: 400 }

@media (max-width: 767px) {
    .product-action:not(.not) .product-info .price-box { display: block; margin-bottom: 0px }
}

.product-action:not(.not) .smart { position: absolute; top: 0px; left: 0px; z-index: 99; background: var(--mainColor); font-size: 15px; font-weight: bold; color: #ffff; padding: 7px 14px; text-align: center; display: flex; align-items: center; justify-content: center; border-radius: 0px 15px }
.product-action:not(.not) .action { position: absolute; bottom: 10px; left: auto; right: 10px; z-index: 10; -webkit-transform: translateY(0%); -moz-transform: translateY(0%); -ms-transform: translateY(0%); -o-transform: translateY(-50%); transform: translateY(0%); -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; opacity: 0 }
    .product-action:not(.not) .action .actions-secondary { display: flex; gap: 5px; width: 100%; align-items: center; justify-content: center; flex-direction: column; flex-wrap: wrap }
    .product-action:not(.not) .action .btn-views { border: none; width: 40px; height: 40px; padding: 0px; text-align: center; display: flex; align-items: center; justify-content: center; background: #fff; font-size: 12px; border-radius: 5px; -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); opacity: 0; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out }
        .product-action:not(.not) .action .btn-views:hover { background: var(--mainColor) }
            .product-action:not(.not) .action .btn-views:hover svg path { fill: #fff }
        .product-action:not(.not) .action .btn-views.quick-view svg { width: 24px; height: 24px }
        .product-action:not(.not) .action .btn-views:last-child { margin-bottom: 0px }

@media (max-width: 1199px) {
    .product-action:not(.not) .actions-primary { display: none }
}

.product-action:not(.not) .actions-primary button { width: 40px; height: 40px; padding: 0px; display: inline-flex; border-radius: 5px; align-items: center; justify-content: center; border: initial; position: relative; z-index: 9; -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); opacity: 0; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; background: #fff }
    .product-action:not(.not) .actions-primary button .icon-detail { width: 20px }
        .product-action:not(.not) .actions-primary button .icon-detail svg { width: 20px; height: 20px }
    .product-action:not(.not) .actions-primary button .icon-settings svg { width: 20px; height: 20px }
    .product-action:not(.not) .actions-primary button .icon-cart { width: 20px }
        .product-action:not(.not) .actions-primary button .icon-cart svg { height: 20px; width: 20px }
    .product-action:not(.not) .actions-primary button .icon-outsock { width: 20px; height: 20px }
    .product-action:not(.not) .actions-primary button:hover { background: var(--mainColor) }
        .product-action:not(.not) .actions-primary button:hover .icon-detail svg path { fill: #fff }
        .product-action:not(.not) .actions-primary button:hover .icon-settings svg path { fill: #fff }
        .product-action:not(.not) .actions-primary button:hover .icon-settings svg rect { fill: #fff }
        .product-action:not(.not) .actions-primary button:hover .icon-cart svg path { stroke: #fff }
        .product-action:not(.not) .actions-primary button:hover .icon-cart svg .cls-1 { stroke: #fff }
        .product-action:not(.not) .actions-primary button:hover .icon-outsock svg path { stroke: #fff }
        .product-action:not(.not) .actions-primary button:hover .icon-outsock svg .cls-1 { stroke: #fff }
.product-action:not(.not):hover .image_thumb img { transform: scale(1.2) }
.product-action:not(.not):hover .action { opacity: 1 }
    .product-action:not(.not):hover .action .btn-views { webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 1 }
    .product-action:not(.not):hover .action .actions-primary button { webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 1 }
.product-action:not(.not) .sapo-product-reviews-badge { margin-top: 10px }
    .product-action:not(.not) .sapo-product-reviews-badge .sapo-product-reviews-star i { font-size: 14px }

@media (min-width: 1200px) {
    .product-action:not(.not):hover .product-thumbnail .image_thumb { background: transparent }
        .product-action:not(.not):hover .product-thumbnail .image_thumb:before { opacity: 1; z-index: 9 }
        .product-action:not(.not):hover .product-thumbnail .image_thumb .product-image.second-image { opacity: 1 }
}

.page-wishlist .item_product_main { padding: 0px }
.backtop { position: fixed; top: auto !important; bottom: 140px; right: 15px; background: var(--mainColor); height: 35px; width: 35px; text-align: center; border-radius: 3px; z-index: 99; opacity: 0; line-height: 33px }
    .backtop:hover { background: var(--hover) }
    .backtop svg { width: 19px; height: 19px; color: #fff }
    .backtop.show { opacity: 1 }
.section_mailchimp { padding: 60px 0px; background-color: #fff; border-top: 1px solid #eee }
    .section_mailchimp .subscribe-heading h2 { color: var(--textColor); font-size: 28px; font-weight: bold; margin-bottom: 0px }

@media (max-width: 767px) {
    .section_mailchimp .subscribe-heading h2 { margin-bottom: 20px }
}

.section_mailchimp .mailchimp-alerts { color: var(--mainColor) }
.section_mailchimp #mc-form { overflow: hidden; position: relative; display: flex; align-items: center; width: 100%; gap: 30px }

@media (max-width: 991px) {
    .section_mailchimp #mc-form { margin: 0; margin-bottom: 20px }
}

@media (max-width: 500px) {
    .section_mailchimp #mc-form { display: block }
}

.section_mailchimp #mc-form input { width: 100%; border: none; height: 50px; color: var(--textColor); padding: 0px; font-size: 15px; border-bottom: 1px solid #888 }

@media (max-width: 991px) {
    .section_mailchimp #mc-form input { width: 100% }
}

@media (max-width: 767px) {
    .section_mailchimp #mc-form input { height: 38px }
}

@media (max-width: 500px) {
    .section_mailchimp #mc-form input { margin-bottom: 15px }
}
#.footer-logo img {
    max-height: 50px;
    width: auto
}

.section_mailchimp #mc-form button { color: var(--textColor); font-size: 18px; height: 50px; min-width: 170px; padding: 0px 15px; font-weight: normal; border: 1px solid #888; border-radius: 5px; background-color: transparent }
    .section_mailchimp #mc-form button:hover { border-color: var(--mainColor); background-color: var(--mainColor) }
.footer { position: relative; background-color: #007dc2 }
    .footer .mid-footer { position: relative; padding: 80px 0px }
        .footer .mid-footer .footer-contact {
            padding: 30px;
            border-radius: 4px;
            background-color: #0e5881
        }
            .footer .mid-footer .footer-contact .footer-logo { display: block }
                .footer .mid-footer .footer-contact .footer-logo img { max-height: 50px }
            .footer .mid-footer .footer-contact .footer-desc { color: #e7e7e7; font-size: 16px; font-weight: 300; margin: 15px 0px; line-height: 25px; text-align: justify; }

@media (max-width: 991px) {
    .footer .mid-footer .footer-contact { margin-bottom: 30px }
    .footer-img .logo {
        width: 15% !important;
    }
}

.footer .mid-footer .contacts-list { margin-top: 30px }
    .footer .mid-footer .contacts-list .item { color: #fff; font-size: 16px; margin-bottom: 12px; position: relative }
        .footer .mid-footer .contacts-list .item a { color: #fff; display: flex; font-size: 16px; align-items: baseline }
            .footer .mid-footer .contacts-list .item a .icon { display: block; margin-right: 15px }
                .footer .mid-footer .contacts-list .item a .icon svg { fill: #fff }
            .footer .mid-footer .contacts-list .item a:hover { text-decoration: underline; }
.footer .mid-footer .title-menu { font-size: 18px; color: #fff; position: relative; margin-bottom: 20px; font-weight: 500; text-transform: uppercase }
    .footer .mid-footer .title-menu a { color: #fff }
    .footer .mid-footer .title-menu:after { display: block; width: 44px; height: 2px; margin-top: 10px; background-color: var(--mainColor); content: '' }
.footer .mid-footer .list-menu li { margin-bottom: 10px }
    .footer .mid-footer .list-menu li a { display: block; font-size: 15px; font-weight: 400; line-height: 24px; color: rgba(255,255,255,0.7) }
        .footer .mid-footer .list-menu li a:hover { color: var(--mainColor) }
.footer .mid-footer .module-mailchimp { margin-bottom: 20px }
    .footer .mid-footer .module-mailchimp .sub-title { color: #e7e7e7; opacity: 0.7; font-size: 15px; font-weight: 300; margin: 15px 0px }
    .footer .mid-footer .module-mailchimp .form-control { width: 100%; font-size: 14px; padding: 8px 16px; height: auto; margin-bottom: 10px; border-radius: 5px; border: none }
    .footer .mid-footer .module-mailchimp .btn { color: #fff; font-size: 14px; font-weight: 600; border-radius: 5px; text-align: center; width: 100%; border: none; padding: 8px 16px; letter-spacing: 0.5px; text-transform: uppercase; background-color: var(--mainColor) }
        .footer .mid-footer .module-mailchimp .btn:hover { background-color: var(--mainColor2) }
    .footer .mid-footer .module-mailchimp .mailchimp-alerts { color: #fff }
.footer .mid-footer .list-social { display: flex; align-items: center }
    .footer .mid-footer .list-social .social-button { margin-right: 5px }
        .footer .mid-footer .list-social .social-button img { width: 35px; height: 35px }
        .footer .mid-footer .list-social .social-button:hover { opacity: 0.6; transform: translateY(-2px) }

@media (max-width: 767px) {
    .footer .mid-footer .list-social { margin-bottom: 20px }
}

.footer #copyright { font-size: 14px; color: #fff; text-align: center; padding: 20px 0px; border-top: 1px solid #fff }
    .footer #copyright .opacity1 a { color: var(--mainColor); font-weight: 700 }
        .footer #copyright .opacity1 a:hover { opacity: .7 }

@media (max-width: 424px) {
    .footer #copyright { font-size: 16px }
        .footer #copyright .center { display: none }
}

.footer .logo-bct img { max-height: 61px }

@media (min-width: 991px) {
    .header-menu { position: relative; z-index: 9 }
        .header-menu .header-menu-des { display: flex; align-items: center; border-radius: 10px; overflow: hidden }
            .header-menu .header-menu-des .control-menu { width: 80px; text-align: center }
                .header-menu .header-menu-des .control-menu a svg { width: 15px; height: 15px }
                .header-menu .header-menu-des .control-menu a:hover svg path { fill: var(--mainColor) }
            .header-menu .header-menu-des .header-nav { flex: 1; display: block; overflow-x: hidden }
                .header-menu .header-menu-des .header-nav > ul.item_big { white-space: nowrap; display: inline-block }
                    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item { display: inline-block; position: static; border-radius: 10px }
                        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item:first-child > a { padding-left: 0 }
                        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item > a { display: block; text-align: left; padding: 13px 15px; font-size: 15px; font-weight: bold; position: relative; color: var(--textColor) }
                            .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item > a.caret-down:after { content: ""; position: relative; width: 0; height: 0; border-style: solid; border-width: 5px 5px 0 5px; border-color: var(--textColor) transparent transparent transparent; display: inline-block; top: -2px; margin-left: 2px; margin-top: -6px; transition: 0.5s }
                        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item:hover > a { color: var(--mainColor) }
                            .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item:hover > a.caret-down:after { transform: rotate(180deg); border-color: var(--mainColor) transparent transparent transparent }
                        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item:hover > ul { overflow: visible; max-height: 3000px; max-width: 3000px; opacity: 1; -webkit-transform: perspective(600px) rotateX(0deg); -moz-transform: perspective(600px) rotateX(0deg); -ms-transform: perspective(600px) rotateX(0deg); -o-transform: perspective(600px) rotateX(0deg); transform: perspective(600px) rotateX(0deg); -webkit-transition: -webkit-transform 0.5s ease, opacity 0.2s ease, max-height 0s step-end, max-width 0s step-end, padding 0s step-end; -o-transition: -o-transform 0.5s ease, opacity 0.2s ease, max-height 0s step-end, max-width 0s step-end, padding 0s step-end; transition: transform 0.5s ease, opacity 0.2s ease, max-height 0s step-end, max-width 0s step-end, padding 0s step-end }
                        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item .fa-caret-down { visibility: hidden; display: none }
                        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item .item_small { overflow: hidden; display: block; max-height: 0px; max-width: 0px; opacity: 0; -webkit-transform: perspective(600px) rotateX(-90deg); -moz-transform: perspective(600px) rotateX(-90deg); -ms-transform: perspective(600px) rotateX(-90deg); -o-transform: perspective(600px) rotateX(-90deg); transform: perspective(600px) rotateX(-90deg); -webkit-transition: -webkit-transform 0.5s ease, opacity 0.6s ease, max-height 0.6s step-end, max-width 0.6s step-end, padding 0.6s step-end; -o-transition: -o-transform 0.5s ease, opacity 0.6s ease, max-height 0.6s step-end, max-width 0.6s step-end, padding 0.6s step-end; transition: transform 0.5s ease, opacity 0.6s ease, max-height 0.6s step-end, max-width 0.6s step-end, padding 0.6s step-end; position: absolute; top: 100%; left: auto; width: 250px; padding: 0; background-color: #fff; box-shadow: 0 1px 2px 2px rgba(0,0,0,0.04); -webkit-transform-origin: 0% 0%; -moz-transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; -o-transform-origin: 0% 0%; transform-origin: 0% 0%; z-index: 99; white-space: normal; border-radius: 5px }
                        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item > ul li { float: none; padding: 0 0 }
                            .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item > ul li:last-child > a { border-bottom: 0 }
                            .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item > ul li:hover > ul { display: block; position: absolute; width: 250px; padding: 0; background-color: #fff; z-index: 99; box-shadow: 0 1px 2px 2px rgba(0,0,0,0.04); white-space: normal; border-radius: 5px }
}

@media (min-width: 991px) and (max-width: 1199px) and (min-width: 992px) {
    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item > ul li:hover > ul { position: relative; left: 0; width: 100%; padding-left: 0; box-shadow: 0 1px 2px 2px rgba(0,0,0,0.04) }
        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item > ul li:hover > ul li a { padding-left: 25px }
}

@media (min-width: 991px) {
    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item > ul li a { font-weight: 400; font-size: 14px; line-height: 24px; display: block; padding: 6px 20px 6px 10px; color: var(--textColor); position: relative; text-align: left }
        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item > ul li a.caret-down:before { content: ""; position: absolute; width: 0; height: 0; border-style: solid; border-width: 5px 5px 0 5px; border-color: #000 transparent transparent transparent; display: inline-block; top: 50%; left: 100%; margin-left: -15px; margin-top: -2px; transition: 0.5s; transform: rotate(270deg) }
    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item > ul li ul { display: none; left: 100%; top: -2px }
    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item > ul > li { color: #333 }
        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item > ul > li:hover > a { color: var(--mainColor) }
            .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item > ul > li:hover > a.caret-down:before { border-color: var(--mainColor) transparent transparent transparent }
        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item > ul > li ul li:hover > a { color: var(--mainColor) }
    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega { position: static }
        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content { background: #fff none repeat scroll 0 0; display: none; margin: 0; padding: 10px; position: absolute; top: 100%; left: 0; z-index: 999; width: 100%; -webkit-box-shadow: 0px 2px 6px 0px rgba(50,50,50,0.33); -moz-box-shadow: 0px 2px 6px 0px rgba(50,50,50,0.33); box-shadow: 0px 2px 6px 0px rgba(50,50,50,0.33); max-height: 600px; overflow-y: auto; border: 0; overflow: hidden; white-space: normal; display: block; opacity: 0; filter: alpha(opacity=0); visibility: hidden; -moz-transition: .2s ease-out; -o-transition: .2s ease-out; -webkit-transition: .2s ease-out; -ms-transition: .2s ease-out; transition: .2s ease-out; -moz-transform: translateY(20px); -o-transform: translateY(20px); -ms-transform: translateY(20px); -webkit-transform: translateY(20px); transform: translateY(20px) }
            .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 2px rgba(0,0,0,0.3); -moz-box-shadow: inset 0 0 2px rgba(0,0,0,0.3); border-radius: 5px; background-color: #F5F5F5 }
            .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content::-webkit-scrollbar { width: 5px; background-color: #F5F5F5 }
            .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content::-webkit-scrollbar-thumb { border-radius: 5px; -webkit-box-shadow: inset 0 0 2px rgba(0,0,0,0.3); -moz-box-shadow: inset 0 0 2px rgba(0,0,0,0.3); background-color: #e5e5e5 }
            .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.parent a.hmega { color: var(--mainColor) !important; font-weight: normal; margin-bottom: 10px; display: inline-block; font-size: 15px; text-transform: uppercase }
                .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.parent a.hmega:hover, .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.parent a.hmega:focus { color: var(--mainColor) !important }
}

@media (min-width: 991px) and (min-width: 992px) {
    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.parent a.hmega { display: block }
}

@media (min-width: 991px) {
    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.parent ul.level1 li { line-height: 25px }
        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.parent ul.level1 li a { font-weight: 400 }
        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.parent ul.level1 li + li { padding-top: 5px }
    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.item { float: left; width: calc(100%/4); padding: 10px; text-align: left }
}

@media (min-width: 991px) and (max-width: 1199px) {
    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.item { width: calc(100%/5) }
}

@media (min-width: 991px) {
    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.item > a { color: #fff !important; font-weight: 600; margin-bottom: 10px; display: inline-block }
        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.item > a:hover, .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.item > a:focus { color: var(--mainColor) !important }
    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.item h2 { font-size: 14px; margin-top: 0 }
    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.item ul.level1 { margin-bottom: 15px }
        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.item ul.level1 li a { color: var(--textColor); font-size: 15px }
            .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.item ul.level1 li a:hover, .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level1.item ul.level1 li a:focus { text-decoration: none; color: var(--mainColor) }
    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .mega-content .level0 { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap }
    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .title-mega { text-align: left; font-size: 18px; color: #fda121; margin-top: 10px; margin-bottom: 10px; font-weight: 600 }
    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .image-mega { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; padding: 15px 0 }
        .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega .image-mega li { -ms-flex: 0 0 calc(100%/2); flex: 0 0 calc(100%/2); max-width: calc(100%/2); position: relative; width: 100%; padding-right: 15px; padding-left: 15px }
    .header-menu .header-menu-des .header-nav > ul.item_big > li.nav-item.has-mega:hover .mega-content { display: block; opacity: 1; filter: alpha(opacity=100); visibility: visible; -moz-transition: .3s ease-in; -o-transition: .3s ease-in; -webkit-transition: .3s ease-in; -ms-transition: .3s ease-in; transition: .3s ease-in; -moz-transform: translateY(0px); -o-transform: translateY(0px); -ms-transform: translateY(0px); -webkit-transform: translateY(0px); transform: translateY(0px) }
    .header-menu .header-menu-des .header-nav > ul.item_big > li.active > a { color: var(--mainColor) }
        .header-menu .header-menu-des .header-nav > ul.item_big > li.active > a span > i.icon-down { border-color: var(--mainColor) transparent transparent transparent }
        .header-menu .header-menu-des .header-nav > ul.item_big > li.active > a.caret-down:after { border-color: var(--mainColor) transparent transparent transparent }
    .header-menu .header-menu-des .header-nav ul li ul a.text2line:hover { color: var(--mainColor) !important; background: transparent !important }
    .header-menu .header-menu-des .header-nav li li { position: relative }
}

.header-menu .control-menu { display: none; text-align: right }
    .header-menu .control-menu.active { display: block }
    .header-menu .control-menu #prev svg, .header-menu .control-menu #next svg { width: 12px; height: 12px; margin-top: -5px }

@media (max-width: 991px) {
    .header-menu { order: -1 }
}

@media (min-width: 767px) {
    .footer .mid-footer .title-menu svg, .footer .mid-footer .title-menu .Collapsible__Plus { display: none }
}

@media (max-width: 991px) {
    .header-nav { background-color: #fff; width: 70%; position: fixed; top: 0 !important; left: 0; z-index: 9999; transform: translateX(-100%); visibility: hidden; transition: transform 0.5s cubic-bezier(0.645, 0.045, 0.355, 1),visibility 0.5s cubic-bezier(0.645, 0.045, 0.355, 1); box-shadow: none; touch-action: manipulation }
        .header-nav.current { visibility: visible; transform: translateX(0) }
        .header-nav .user-menu { color: #fff; padding: 10px 15px; display: flex; align-items: center; background-color: var(--mainColor); margin-bottom: 5px }
            .header-nav .user-menu .user-icon { margin-right: 15px }
                .header-nav .user-menu .user-icon img { width: 25px }
            .header-nav .user-menu .user-account a { color: #fff; display: block }
        .header-nav .item_big { overflow-y: auto; max-height: 100vh; height: 100vh }
            .header-nav .item_big .nav-item { position: relative; margin-bottom: 5px }
                .header-nav .item_big .nav-item a { padding: 0 30px 0 10px !important; color: #000; height: unset; line-height: 30px; display: block; font-size: 14px; font-weight: bold }
                .header-nav .item_big .nav-item .fa-caret-down { visibility: visible; position: absolute; right: 5px; top: 0; width: 30px; height: 35px; line-height: 35px; text-align: center; display: inline-block }
                    .header-nav .item_big .nav-item .fa-caret-down:before, .header-nav .item_big .nav-item .fa-caret-down:after { position: absolute; content: ''; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(-90deg); background-color: #000; transition: transform 0.4s ease-in-out, opacity 0.4s ease-in-out }
                    .header-nav .item_big .nav-item .fa-caret-down:before { width: 11px; height: 1px; opacity: 1 }
                    .header-nav .item_big .nav-item .fa-caret-down:after { width: 1px; height: 11px }
                .header-nav .item_big .nav-item .item_small { padding-left: 10px }
                    .header-nav .item_big .nav-item .item_small li { position: relative }
                    .header-nav .item_big .nav-item .item_small ul { padding-left: 10px }
                        .header-nav .item_big .nav-item .item_small ul li { position: relative }
                            .header-nav .item_big .nav-item .item_small ul li .fa-caret-down { visibility: visible; position: absolute; right: 5px; top: 0; width: 30px; height: 35px; line-height: 35px; text-align: center; display: inline-block }
                                .header-nav .item_big .nav-item .item_small ul li .fa-caret-down:before { content: ""; position: absolute; width: 0; height: 0; border-style: solid; border-width: 5px 5px 0 5px; border-color: #333 transparent transparent transparent; display: inline-block; top: 60%; transform: translateY(-50%); right: 10px; transition: 0.5s; margin-top: -3px }
            .header-nav .item_big .account-mobile { padding: 5px }
                .header-nav .item_big .account-mobile ul { display: -ms-flexbox; display: flex !important; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -5px; margin-left: -5px; text-align: center }
                    .header-nav .item_big .account-mobile ul li { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; position: relative; width: 100%; padding-right: 5px; padding-left: 5px }
                        .header-nav .item_big .account-mobile ul li a { display: block; background: var(--mainColor); color: #fff; padding: 8px 5px; border-radius: 5px; font-weight: 600 }
            .header-nav .item_big .title-danhmuc { padding: 5px }
                .header-nav .item_big .title-danhmuc span { font-size: 14px; font-weight: bold; color: #fff; display: block; position: relative; padding-left: 10px; padding-right: 10px; text-transform: uppercase; background: var(--mainColor); border-radius: 5px; text-align: center; line-height: 35px }
            .header-nav .item_big .item-mb { padding: 10px; border-top: 1px solid var(--mainColor) }
                .header-nav .item_big .item-mb a { display: block; margin-bottom: 10px; color: #000; border-radius: 5px; font-weight: 600; font-size: 14px }
        .header-nav li > ul { display: none !important }
        .header-nav li.current > a { color: var(--mainColor) !important }
        .header-nav li.current > ul { display: block !important }
        .header-nav li.current .fa.current:before, .header-nav li.current .fa.current:after { background-color: var(--mainColor); transform: translate(-50%, -50%) rotate(90deg) }
        .header-nav li.current .fa.current:before { opacity: 0 }
    .opacity_menu { background: rgba(0,0,0,0.8); position: fixed; top: 0 !important; left: 0; height: 100%; width: 100%; z-index: 999; display: none }
        .opacity_menu.current { display: block }
}

@media (max-width: 991px) and (min-width: 767px) {
    .footer .mid-footer .col-footer { margin-bottom: 20px }
}

@media (max-width: 767px) {
    .footer .mid-footer .title-menu { margin-bottom: 10px }
        .footer .mid-footer .title-menu .Collapsible__Plus { position: absolute; top: 0px; width: 20px; height: 20px; right: 0 }
            .footer .mid-footer .title-menu .Collapsible__Plus::before, .footer .mid-footer .title-menu .Collapsible__Plus::after { position: absolute; content: ''; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%) rotate(-90deg); transform: translate(-50%, -50%) rotate(-90deg); background-color: var(--mainColor); -webkit-transition: opacity 0.4s ease-in-out, -webkit-transform 0.4s ease-in-out; transition: opacity 0.4s ease-in-out, -webkit-transform 0.4s ease-in-out; transition: transform 0.4s ease-in-out, opacity 0.4s ease-in-out; transition: transform 0.4s ease-in-out, opacity 0.4s ease-in-out, -webkit-transform 0.4s ease-in-out }
            .footer .mid-footer .title-menu .Collapsible__Plus::before { width: 11px; height: 1px; opacity: 1 }
            .footer .mid-footer .title-menu .Collapsible__Plus::after { width: 1px; height: 11px }
        .footer .mid-footer .title-menu.current .Collapsible__Plus::after { -webkit-transform: translate(-50%, -50%) rotate(90deg); transform: translate(-50%, -50%) rotate(90deg) }
        .footer .mid-footer .title-menu.current .Collapsible__Plus::before { opacity: 0 }
    .footer .mid-footer .hidden-mobile { display: none }
        .footer .mid-footer .hidden-mobile.current { display: block; margin-top: 20px }
    .footer .mid-footer .mailchim .newsletter-form { margin-top: 15px }
    .footer .mid-footer .link-social { margin-top: 10px }
    .footer .col-footer { margin-bottom: 20px }
        .footer .col-footer:last-child { margin-bottom: 0px }
}

.image_hover { position: relative; display: block; text-align: center }
    .image_hover:before { position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: 0; z-index: 1; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out }
    .image_hover:after { position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: 0; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out }
    .image_hover:hover:before { right: 50%; left: 50%; width: 0; background: rgba(255,255,255,0.3) }
    .image_hover:hover:after { height: 0; top: 50%; bottom: 50%; background: rgba(255,255,255,0.3) }
.sidebarAllMainCompare { position: fixed; left: 0; right: 0; bottom: 0; z-index: 999; background: #fff; visibility: hidden; opacity: 0; transition: all .5s; transform: translateY(100%) }
    .sidebarAllMainCompare.active { opacity: 1; visibility: visible; transform: translateY(0) }
    .sidebarAllMainCompare .sidebarAllHeader { background: var(--mainColor); padding: 10px; margin-bottom: 20px }
        .sidebarAllMainCompare .sidebarAllHeader span { font-size: 20px; font-weight: 700; margin: 0; color: #fff }
        .sidebarAllMainCompare .sidebarAllHeader .title { position: relative }
            .sidebarAllMainCompare .sidebarAllHeader .title a { padding-right: 30px; display: block }
                .sidebarAllMainCompare .sidebarAllHeader .title a:hover { opacity: 0.6 }

@media (max-width: 767px) {
    .sidebarAllMainCompare .sidebarAllHeader .title span { font-size: 16px }
}

.sidebarAllMainCompare .sidebarAllHeader .title .closeSidebar { position: absolute; right: 0; top: 0; cursor: pointer }
    .sidebarAllMainCompare .sidebarAllHeader .title .closeSidebar svg { width: 15px }
        .sidebarAllMainCompare .sidebarAllHeader .title .closeSidebar svg path { stroke: #fff }
.sidebarAllMainCompare .sidebarAllBody { display: flex; flex-wrap: nowrap; overflow-y: hidden; overflow-x: auto; padding-bottom: 20px; margin: 0 -10px }
    .sidebarAllMainCompare .sidebarAllBody .note { padding: 0 10px }
    .sidebarAllMainCompare .sidebarAllBody .itemMainCompare { width: calc(100%/3); margin: 0; padding-left: 10px; padding-right: 10px }

@media (max-width: 768px) {
    .sidebarAllMainCompare .sidebarAllBody .itemMainCompare { min-width: 300px; justify-content: center }
}

.sidebarAllMainCompare .sidebarAllBody .itemMainCompare .item-compare-wrap { background: #fff; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; padding: 15px 10px; border: 1px solid var(--mainColor); border-radius: 5px }
.sidebarAllMainCompare .sidebarAllBody .itemMainCompare .image_thumb { position: relative; width: 30%; overflow: hidden; display: block }
.sidebarAllMainCompare .sidebarAllBody .itemMainCompare .product-info { width: 70%; text-align: left; padding-left: 20px }
    .sidebarAllMainCompare .sidebarAllBody .itemMainCompare .product-info .product-name { margin: 0 0 10px 0; font-size: 16px; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box; min-height: 35px }
    .sidebarAllMainCompare .sidebarAllBody .itemMainCompare .product-info .price-box { color: var(--priceColor) }
    .sidebarAllMainCompare .sidebarAllBody .itemMainCompare .product-info .removeItem { cursor: pointer }
        .sidebarAllMainCompare .sidebarAllBody .itemMainCompare .product-info .removeItem:hover { color: var(--mainColor) }
    .sidebarAllMainCompare .sidebarAllBody .itemMainCompare .product-info .compare-price { font-weight: 300; margin-left: 5px; color: #bbbbbb; font-size: 12px; text-decoration: line-through }
.sidebarAllMainCompare .sidebarAllFooter { margin: 20px }
    .sidebarAllMainCompare .sidebarAllFooter .mainCompareButton { display: block; cursor: pointer; background: #146cda; width: 100%; text-align: center; margin: 10px 0px; padding: 10px; color: #ffffff; text-transform: uppercase; font-weight: 500 }
.overplayAll { opacity: 0; visibility: hidden; position: fixed; background: rgba(40,40,40,0.3); width: 100%; height: 100%; top: 0; left: 0; transition: all 0.2s; z-index: 99 }
    .overplayAll.active { opacity: 1; visibility: visible }
.icon-ss-mb { position: fixed; bottom: 70px; right: 10px; background: var(--mainColor); height: 44px; width: 44px; text-align: center; border-radius: 30px; z-index: 99 }
    .icon-ss-mb svg { margin-top: 11px }
        .icon-ss-mb svg path { fill: #fff }
.compare-product__qv { display: none; position: fixed; bottom: 15px; left: 0; width: 100%; z-index: 9999 }

@media (max-width: 991px) {
    .compare-product__qv { bottom: 65px }
}

@media (max-width: 767px) {
    .compare-product__qv { bottom: 0 }
}

.compare-product__qv.is-show { display: block }
.compare-product__qv .position-relative { display: flex; max-width: 375px; background: linear-gradient(180deg, var(--gradient1) 0%, var(--gradient1_2) 100%); padding: 16px 16px 12px; border-radius: 10px; margin: auto }

@media (max-width: 767px) {
    .compare-product__qv .position-relative { display: block; border-radius: 0; padding-top: 20px }
}

.compare-product__qv-row { display: grid; grid-template-columns: 1fr 1fr 1fr }
.compare-product__qv-item, .compare-product__qv-show { padding: 15px }
.compare-product__qv-item { position: relative; text-align: center; border-radius: 4px; background: #fff; margin: 0 5px; padding: 5px }
    .compare-product__qv-item img { max-width: 60px }
    .compare-product__qv-item h3 { margin: 0; font-size: 13px; font-weight: normal; display: none }
.compare-product__qv-show { margin-left: 15px; text-align: center }
    .compare-product__qv-show a { color: #fff; display: block }
        .compare-product__qv-show a.btn-main { font-weight: bold }

@media (max-width: 767px) {
    .compare-product__qv-show { margin-left: 0; padding-bottom: 0 }
}

.compare-product__qv-remove { position: absolute; top: -10px; right: -5px; font-size: 10px; font-weight: bold; width: 20px; height: 20px; line-height: 20px; text-align: center; cursor: pointer; border-radius: 100%; background: linear-gradient(180deg, var(--gradient3) 0%, var(--gradient4) 78.65%); color: #fff; z-index: 999999999 }

@media (max-width: 767px) {
    .compare-product__qv-remove { top: -15px }
}

.compare-product__qv-hide { color: #fff; display: block }
    .compare-product__qv-hide .icon { position: absolute; right: 10px; top: 15px; width: 12px; height: 12px }
.col-xs-11.col-sm-4.alert.alert-success.animated.fadeInDown { width: 270px }
    .col-xs-11.col-sm-4.alert.alert-success.animated.fadeInDown button.close { border: initial; background: initial }
.col-xs-11.col-sm-4.alert.alert-warning.animated.bounceInDown { width: 270px }
    .col-xs-11.col-sm-4.alert.alert-warning.animated.bounceInDown button.close { border: initial; background: initial }
.col-xs-11.col-sm-4.alert.alert-info.animated.bounceInDown { width: 270px }
    .col-xs-11.col-sm-4.alert.alert-info.animated.bounceInDown button.close { border: initial; background: initial }
ul.tabs li { background: none; display: inline-block; cursor: pointer }
    ul.tabs li.current { color: var(--mainColor) }
.aside-content-menu { padding: 15px; border-radius: 5px; margin-bottom: 30px; box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.15) }
    .aside-content-menu .title { color: var(--textColor); font-size: 20px; font-weight: 700; position: relative; padding-bottom: 15px; margin-bottom: 15px }
        .aside-content-menu .title:after { content: ''; height: 3px; width: 50px; position: absolute; left: 0px; bottom: 0px; background-color: var(--mainColor) }
    .aside-content-menu .nav-category ul { padding: 0; margin: 0; list-style: none }
        .aside-content-menu .nav-category ul .nav-item .nav-link { display: block; padding: 10px 0px; font-size: 15px; color: #000; font-weight: 500; border-bottom: 1px solid #ececec }
            .aside-content-menu .nav-category ul .nav-item .nav-link.pr-5 { padding-right: 30px }
        .aside-content-menu .nav-category ul .nav-item:last-child .nav-link { border-bottom: none }
        .aside-content-menu .nav-category ul .nav-item.active > .nav-link, .aside-content-menu .nav-category ul .nav-item:hover > .nav-link { color: var(--mainColor) }
        .aside-content-menu .nav-category ul .nav-item.active > .down_icon:after, .aside-content-menu .nav-category ul .nav-item.active > .down_icon:before, .aside-content-menu .nav-category ul .nav-item:hover > .down_icon:after, .aside-content-menu .nav-category ul .nav-item:hover > .down_icon:before { background-color: var(--mainColor) }
        .aside-content-menu .nav-category ul .nav-item.active .menu_down .nav-item .nav-link { padding: 5px 10px; font-weight: 500 }
        .aside-content-menu .nav-category ul .nav-item .down_icon.active:after, .aside-content-menu .nav-category ul .nav-item .down_icon.active:before { transform: translate(-50%, -50%) rotate(90deg) }
        .aside-content-menu .nav-category ul .nav-item .down_icon.active:before { opacity: 0 }
        .aside-content-menu .nav-category ul .nav-item .menu_down .nav-item .nav-link { padding: 6px 10px; font-weight: 500 }
        .aside-content-menu .nav-category ul .nav-item .menu_down .nav-item .menu_down .nav-link { padding: 6px 20px }
        .aside-content-menu .nav-category ul .nav-item .menu_down .nav-item .menu_down .menu_down .nav-link { padding-left: 30px }
        .aside-content-menu .nav-category ul .down_icon { height: 20px !important; width: 20px !important; position: absolute; right: 7.5px; top: 19px; transform: translate(0, -50%); cursor: pointer }
            .aside-content-menu .nav-category ul .down_icon:after, .aside-content-menu .nav-category ul .down_icon:before { position: absolute; content: ''; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(-90deg); background-color: #000; transition: transform 0.4s ease-in-out, opacity 0.4s ease-in-out }
            .aside-content-menu .nav-category ul .down_icon:before { width: 11px; height: 1px; opacity: 1 }
            .aside-content-menu .nav-category ul .down_icon:after { width: 1px; height: 11px }
            .aside-content-menu .nav-category ul .down_icon.active:after, .aside-content-menu .nav-category ul .down_icon.active:before { background-color: var(--mainColor); transform: translate(-50%, -50%) rotate(90deg) }
            .aside-content-menu .nav-category ul .down_icon.active:before { opacity: 0 }
.section_service { padding: 80px 0px }
    .section_service .container-fluid { padding: 0px 50px }
        .section_service .container-fluid .row { margin: 0px -20px }
            .section_service .container-fluid .row .service-pad { padding: 0px 20px }

@media (max-width: 767px) {
    .section_service .container-fluid { padding: 0px 15px }
        .section_service .container-fluid .row { margin: 0px -15px }
            .section_service .container-fluid .row .service-pad { padding: 0px 15px }
}

.section_service .service-item { display: flex; flex-wrap: wrap; align-items: center; position: relative; background-color: #fff; margin-bottom: 40px; box-shadow: 0 5px 15px rgba(0,0,0,0.08); border-radius: 10px; overflow: hidden; }
    .section_service .service-item .image { overflow: hidden; position: relative; width: 100% }

@media (min-width: 1200px) {
    .section_service .service-item .image { width: 45% }
}

.section_service .service-item .image .image_thumb { overflow: hidden; position: relative }
    .section_service .service-item .image .image_thumb img { max-width: 100% }

@media (max-width: 1199px) and (min-width: 992px) {
    .section_service .service-item .image .image_thumb { height: 300px }
        .section_service .service-item .image .image_thumb img { width: 100%; height: 100%; object-fit: cover }
}

.section_service .service-item .main { width: 100% }

@media (min-width: 1200px) {
    .section_service .service-item .main { width: 55% }
}

.section_service .service-item .main .main-body { color: #555; padding: 20px; position: relative; padding-left: 75px }

@media (max-width: 1199px) {
    .section_service .service-item .main .main-body { padding: 30px 20px; text-align: center }
}

.section_service .service-item .main .main-body .icon { display: flex; z-index: 1; position: absolute; top: 50%; left: -50px; align-items: center; justify-content: center; width: 100px; height: 100px; transform: translateY(-50%); border-radius: 50%; background-color: #fff }
    .section_service .service-item .main .main-body .icon:before { display: block; z-index: -1; position: absolute; top: 50%; left: 50%; width: calc(100% + 15px); height: calc(100% + 15px); transform: translate(-50%, -50%); border-radius: 50%; background-color: rgba(0,0,0,0.2); content: '' }
    .section_service .service-item .main .main-body .icon:after { display: block; z-index: -1; position: absolute; top: 50%; left: 50%; width: calc(50% + 15px); height: calc(100% + 15px); transform: translateY(-50%); background-color: #fff; content: '' }

@media (max-width: 1199px) {
    .section_service .service-item .main .main-body .icon:after { top: 50%; left: 50%; width: calc(100% + 15px); height: calc(50% + 15px); transform: translateX(-50%) translateY(0) }
}

@media (max-width: 1199px) {
    .section_service .service-item .main .main-body .icon { top: -50px; left: 50%; transform: translateX(-50%) translateY(0) }
}

.section_service .service-item .main .main-body .icon span { display: flex; align-items: center; justify-content: center; width: 100px; height: 100px; border-radius: 50%; background-color: #fff; box-shadow: 0 5px 24px 6px rgba(0,0,0,0.06) }
    .section_service .service-item .main .main-body .icon span img { height: 65px }
.section_service .service-item .main .main-body h3 { margin-bottom: 16px }
    .section_service .service-item .main .main-body h3 a { color: var(--textColor); font-size: 24px; font-weight: 600 }

@media (max-width: 1300px) and (min-width: 1200px) {
    .section_service .service-item .main .main-body h3 a { font-size: 20px }
}

.section_service .service-item .main .main-body h3 a:hover { color: var(--mainColor) }

@media (max-width: 1199px) {
    .section_service .service-item .main .main-body h3 { margin-top: 40px }
}

.section_service .service-item .main .main-body p { margin: 0px; font-size: 16px; text-align: justify; }

@media (max-width: 1300px) and (min-width: 1200px) {
    .section_service .service-item .main .main-body p { font-size: 15px }
}

@media (max-width: 767px) {
    .section_service .service-item { margin-bottom: 30px }
}

.section_service .service-ctas { margin-top: 50px; text-align: center }
    .section_service .service-ctas .btn-viewmore { color: #fff; font-size: 16px; font-weight: 600; padding: 15px 35px; border: 0; display: inline-block; text-transform: uppercase; border-radius: 5px; overflow: hidden; position: relative; z-index: 2; background-color: var(--mainColor) }
        .section_service .service-ctas .btn-viewmore:after { content: ""; position: absolute; left: 0; top: 0; height: 100%; width: 100%; background-color: var(--mainColor2); z-index: -1; -webkit-transform-origin: right top; transform-origin: right top; -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transition: transform 0.8s cubic-bezier(1, 0, 0, 1); -webkit-transition: -webkit-transform 0.8s cubic-bezier(1, 0, 0, 1); transition: -webkit-transform 0.8s cubic-bezier(1, 0, 0, 1); transition: transform 0.8s cubic-bezier(1, 0, 0, 1); transition: transform 0.8s cubic-bezier(1, 0, 0, 1),-webkit-transform 0.8s cubic-bezier(1, 0, 0, 1); vertical-align: top }
        .section_service .service-ctas .btn-viewmore:hover { color: #fff }
            .section_service .service-ctas .btn-viewmore:hover:after { -webkit-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(1); transform: scale(1); opacity: 1 }

@media (max-width: 767px) {
    .section_service .service-ctas { margin-top: 25px }
}

@media (max-width: 767px) {
    .section_service { padding: 50px 0px }
    h3 {
        font-size: 1.5rem;
    }
    .elementor-element.elementor-element-c08cda2, .section_values.block9, .news-title-home {
        padding-left: 15px;
        padding-right: 15px;
    }
    .col-right {
        padding: 0px 30px;
    }
    #block4-section .w-full.swiper-slide {
        width: 100% !important
    }
    .achievements-rigth{
        padding: 0 15px 15px 0;
    }
        .achievements-rigth img {
            border-radius: 20px;
        }
    .block-services .block-ct-row .textwidget {
        min-height: 100px!important;
    }
    .title-mobile {
        font-size: 1.1rem;
        -webkit-line-clamp: unset !important;
        height: unset !important;
    }
    .home-news-item .relative {
        aspect-ratio: unset !important;
    }
        .home-news-item .bottom-3 {
            bottom: 40px !important;
        }
    #block2-section .grid.container {
        margin-bottom:10px;
    }
    .student-hot-bg {
        display: none;
    }
    #block4-section h3 {
        color: #182d57 !important;
    }
}

.image-effect { display: block; position: relative; overflow: hidden }
    .image-effect:before { right: 0; opacity: 0.2; top: 0 }
    .image-effect:after { bottom: 0; opacity: 0.2; left: 0 }
    .image-effect:before, .image-effect:after { content: ""; background: #fff; height: 0; width: 0; z-index: 1; position: absolute; -webkit-transition-duration: 0.5s !important; -o-transition-duration: 0.5s; transition-duration: 0.5s !important }
    .image-effect:hover:before, .image-effect:hover:after { height: 100%; opacity: 0; width: 100% }
.fb_dialog_advanced.fb_customer_chat_bubble_animated_no_badge { right: 12px !important }
.addThis_listSharing { width: 275px; padding: 0; position: fixed; right: 0; bottom: 0; z-index: 990; background-color: transparent; display: none; opacity: 0; visibility: hidden; transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); top: auto !important }
    .addThis_listSharing .listSharing_action { position: absolute; bottom: 135px; border-radius: 12px; right: 25px; max-width: 300px; background-color: #f5f6fa; box-shadow: 0 4px 20px rgba(0,0,0,0.2); -webkit-transform-origin: 100% bottom; transform-origin: 100% bottom; transform: scale(0); -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transition: -webkit-transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1); -webkit-transition: transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1); -moz-transition: transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1); -ms-transition: transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1); top: auto !important }
    .addThis_listSharing.active { opacity: 1; visibility: visible }
        .addThis_listSharing.active .listSharing_action { -ms-transition-delay: 0.1s; -webkit-transition-delay: 0.15s; transition-delay: 0.1s; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1) }
        .addThis_listSharing.active + .addThis_iconContact .svgico .svgico--close { opacity: 1; visibility: visible; -webkit-transform: scale(1); transform: scale(1) }
        .addThis_listSharing.active + .addThis_iconContact .svgico > svg { opacity: 0; visibility: hidden; transform: scale(0.3) }
        .addThis_listSharing.active + .addThis_iconContact .item-livestream { opacity: 0; visibility: hidden }
    .addThis_listSharing .addThis_close { position: absolute; z-index: 10; right: 0; top: 0; border: 0; outline: none; padding: 6px; background: transparent }
        .addThis_listSharing .addThis_close svg { opacity: 0.6; width: 24px; height: 24px; display: block; margin: auto }
.addThis_listing { padding: 0 }
    .addThis_listing .addThis_item { margin: 0; padding: 10px 15px }
        .addThis_listing .addThis_item:not(:last-of-type) { border-bottom: 1px solid #ecedf1; box-shadow: 0 1px 0 0 #fff }
        .addThis_listing .addThis_item .addThis_item--icon { width: 100%; height: auto; border-radius: 0; box-shadow: none; display: -webkit-flex; display: -moz-flex; display: flex; -webkit-align-items: center; align-items: center }
            .addThis_listing .addThis_item .addThis_item--icon svg { display: block; border-radius: 50%; width: 32px; height: 32px; box-shadow: 0 2px 5px 0 rgba(0,0,0,0.11) }
            .addThis_listing .addThis_item .addThis_item--icon .tooltip-text { opacity: 1; visibility: visible; position: initial; width: calc(100% - 30px); padding-left: 15px; text-align: left; background: transparent; color: #1d243e; font-size: 13px; font-weight: 400 }
            .addThis_listing .addThis_item .addThis_item--icon:hover .tooltip-text { color: var(--mainColor) }
        .addThis_listing .addThis_item .addThis_item__fbchat { display: block }
.addThis_iconContact { position: fixed; bottom: 80px; right: 10px; margin: 0; z-index: 7; cursor: pointer; top: auto !important }
    .addThis_iconContact .svgico svg { fill: #ffffff; width: 30px; height: 46px; transition: opacity 0.35s ease-in-out, -webkit-transform 0.35s ease-in-out; transition: opacity 0.35s ease-in-out, transform 0.35s ease-in-out; transition: opacity 0.35s ease-in-out, transform 0.35s ease-in-out, -webkit-transform 0.35s ease-in-out }
    .addThis_iconContact .svgico .svgico--close { position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0; visibility: hidden; transform: scale(0.3); transition: opacity 0.35s ease-in-out, -webkit-transform 0.35s ease-in-out; transition: opacity 0.35s ease-in-out, transform 0.35s ease-in-out; transition: opacity 0.35s ease-in-out, transform 0.35s ease-in-out, -webkit-transform 0.35s ease-in-out }
        .addThis_iconContact .svgico .svgico--close svg { fill: #ffffff; width: 17px; height: 46px }
    .addThis_iconContact .box-item { position: relative }
        .addThis_iconContact .box-item + .box-item { margin-top: 18px }
        .addThis_iconContact .box-item .svgico { position: relative; z-index: 4; height: 48px; width: 48px; text-align: center; border-radius: 50%; border: 1px solid #ffffff; cursor: pointer; background: var(--mainColor); box-shadow: 0 4px 8px rgba(0,0,0,0.15); box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; animation: pulse 2s infinite; animation: pulse 2s infinite }
            .addThis_iconContact .box-item .svgico > svg { animation: iconSkew 1s infinite ease-out; min-height: -webkit-fill-available }
        .addThis_iconContact .box-item:before, .addThis_iconContact .box-item:after { position: absolute; content: ''; height: 48px; width: 48px; left: 0; top: 0; background: var(--mainColor); border-radius: 50% }
        .addThis_iconContact .box-item:before { animation: euiBeaconPulseSmall 2s infinite ease-out }
        .addThis_iconContact .box-item:after { animation: euiBeaconPulseSmall 2s infinite ease-out 0.4s }

@media (max-width: 991px) {
    .addThis_iconContact { right: 10px }
}

@keyframes euiBeaconPulseSmall {
    0% { -webkit-transform: scale(0); transform: scale(0); opacity: 1 }
    50% { opacity: 0.6 }
    100% { -webkit-transform: scale(1.6); transform: scale(1.4); opacity: 0 }
}

@media (max-width: 991px) {
    .addThis_listSharing .listSharing_action { bottom: 140px; left: 14px; right: 14px; max-width: 100% }
    .addThis_listing .addThis_item .addThis_item--icon svg { width: 28px; height: 28px }
    .addThis_listing .addThis_item.addThis_item__fbchat { display: block }
    .addThis_listSharing.active .listSharing_overlay { display: block; opacity: 1; visibility: visible; pointer-events: auto }
}

.popup-sapo { position: fixed; bottom: 115px; left: 17px; margin: 0; z-index: 8; top: auto !important }
    .popup-sapo .icon { position: relative; z-index: 4; height: 48px; width: 48px; text-align: center; border-radius: 50%; border: 1px solid #ffffff; cursor: pointer; background: var(--mainColor); box-shadow: 0 4px 8px rgba(0,0,0,0.15); box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; animation: pulse 2s infinite; animation: pulse 2s infinite; cursor: pointer }
        .popup-sapo .icon svg { fill: #ffffff; width: 20px; height: 20px; transition: opacity 0.35s ease-in-out, -webkit-transform 0.35s ease-in-out; transition: opacity 0.35s ease-in-out, transform 0.35s ease-in-out; transition: opacity 0.35s ease-in-out, transform 0.35s ease-in-out, -webkit-transform 0.35s ease-in-out; animation: iconSkew 1s infinite ease-out; min-height: -webkit-fill-available }
    .popup-sapo .content { background: var(--mainColor); color: #fff; padding: 20px 10px 40px; border-radius: 10px; width: 300px; position: absolute; bottom: 27px; left: 20px; box-shadow: 0 4px 20px rgba(0,0,0,0.2); -webkit-transform-origin: 100% bottom; transform-origin: 0 bottom; transform: scale(0); -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transition: -webkit-transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1),-webkit-transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1); -webkit-transition: transform 0.35s cubic-bezier(0.165, 0.84, 0.44, 1) }
        .popup-sapo .content .title { font-size: 18px; font-weight: 700; margin-bottom: 20px }

@media (max-width: 320px) {
    .popup-sapo .content .title { font-size: 16px }
}

.popup-sapo .content ul { margin-bottom: 20px }
    .popup-sapo .content ul li { margin-bottom: 10px }
        .popup-sapo .content ul li svg { margin-right: 10px }
            .popup-sapo .content ul li svg path { fill: #fff }
        .popup-sapo .content ul li a { color: #fff }
            .popup-sapo .content ul li a:hover { opacity: 0.6 }
.popup-sapo .content .ghichu { font-style: italic; font-size: 14px }
.popup-sapo .content .close-popup-sapo { position: absolute; right: 5px; top: 5px; cursor: pointer }
    .popup-sapo .content .close-popup-sapo svg { width: 15px; height: 15px }
        .popup-sapo .content .close-popup-sapo svg path { fill: #fff }

@media (max-width: 320px) {
    .popup-sapo .content { width: 250px }
}

.popup-sapo.active .content { -ms-transition-delay: 0.1s; -webkit-transition-delay: 0.15s; transition-delay: 0.1s; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1) }

@keyframes iconSkew {
    0% { transform: rotate(0deg) scale(1) skew(1deg) }
    10% { transform: rotate(-25deg) scale(1) skew(1deg) }
    20% { transform: rotate(25deg) scale(1) skew(1deg) }
    30% { transform: rotate(-25deg) scale(1) skew(1deg) }
    40% { transform: rotate(25deg) scale(1) skew(1deg) }
    50% { transform: rotate(0deg) scale(1) skew(1deg) }
    100% { transform: rotate(0deg) scale(1) skew(1deg) }
}

.jas-sale-pop { background: #fff; bottom: -100%; left: 20px; right: 20px; padding: 10px 30px 10px 10px; box-shadow: 0 0 20px rgba(0,0,0,0.1); border-radius: 3px; opacity: 0; visibility: hidden; transition: all 2s; z-index: 99999; position: fixed; right: auto; overflow: hidden; border: 1px solid var(--mainColor); border-radius: 5px }

@media (max-width: 480px) {
    .jas-sale-pop { left: 10px; right: 10px; max-width: 290px; display: none !important }
        .jas-sale-pop .jas-sale-pop-content { overflow: hidden; max-width: 180px }
    .tab-button .whitespace-nowrap {
        white-space: break-spaces;
    }
    .blog_noibat .blog_content .item .contentright h3{
        height:auto!important;
    }
    #block7-section iframe{
        width:100%;
        height: 250px;
    }
}

.jas-sale-pop a img { max-width: 65px }

@media (max-width: 321px) {
    .jas-sale-pop { left: 10px; right: 10px; max-width: 220px }
        .jas-sale-pop .jas-sale-pop-content { max-width: 180px }
}

.jas-sale-pop .mr__20 { margin-right: 10px }
.jas-sale-pop h4 { color: var(--mainColor); margin: 0; font-size: 14px; font-weight: normal; margin-bottom: 5px }
.jas-sale-pop h3 { margin: 0; font-size: 14px; max-width: 255px; line-height: 20px; text-transform: capitalize; max-height: 40px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical }
    .jas-sale-pop h3 a { color: #222; margin: 0; font-size: 14px }
        .jas-sale-pop h3 a:hover { color: var(--mainColor) }
.jas-sale-pop .jas-sale-pop-timeago { color: #878787; font-size: 12px }
.jas-sale-pop .pe-7s-close { right: 5px; top: 5px; cursor: pointer; position: absolute; display: inline-block; width: 10px; height: 10px; background: url(close-1.svg); background-repeat: no-repeat; background-size: cover; background-position: center }
.jas-sale-pop.slideUp { bottom: 20px; opacity: 1; visibility: visible }
.jas-sale-pop.middle-xs { -webkit-box-align: center; -ms-flex-align: center }
.jas-sale-pop.flex { box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex }
.jas-sale-pop.flex { z-index: 8; top: auto !important }
.livechat-mes { display: inline-block; position: fixed; top: auto !important; bottom: 20px; right: 10px; z-index: 990 }
    .livechat-mes img { width: 48px; height: 48px }
.about-content p { font-size: 16px; text-align: justify; line-height: 1.5; }

/* Thêm CSS cho sticky header */
.header-top.sticky { position: fixed; top: 0; left: 0; right: 0; width: 100%; z-index: 999; background-color: #fff; box-shadow: 0 2px 5px rgba(0,0,0,0.1); animation: slideDown 0.3s ease-in-out; transition: all 0.3s ease; }

@keyframes slideDown {
    from { transform: translateY(-100%); }
    to { transform: translateY(0); }
}

@media (min-width: 768px) {
    .grid-cols-1 {
        grid-template-columns: repeat(1,minmax(0,1fr))
    }

    .grid-cols-12 {
        grid-template-columns: repeat(12,minmax(0,1fr))
    }

    .grid-cols-15 {
        grid-template-columns: repeat(15,minmax(0,1fr))
    }

    .grid-cols-2 {
        grid-template-columns: repeat(2,minmax(0,1fr))
    }

    .grid-cols-3 {
        grid-template-columns: repeat(3,minmax(0,1fr))
    }

    .grid-cols-4 {
        grid-template-columns: repeat(4,minmax(0,1fr))
    }

    .grid-cols-6 {
        grid-template-columns: repeat(6,minmax(0,1fr))
    }

    .grid-cols-7 {
        grid-template-columns: repeat(7,minmax(0,1fr))
    }

    .grid-cols-8 {
        grid-template-columns: repeat(8,minmax(0,1fr))
    }

    .grid-cols-9 {
        grid-template-columns: repeat(9,minmax(0,1fr))
    }
}
.textwidget h3{
    margin-bottom:10px;
}
@media (min-width: 0px) and (max-width: 1200px) {
    .ae-icon {
        width: 200px;
    }
}