:root {
    --color-red: #ec2d3f;
    --color-medium-red: #cc2c32;
    --color-dark-red: #c31829;
    --color-green: #28a745;
    --color-dark-green: #207d36;
    --color-black: #212529;
    --color-gray: #6c757d;
    --background-static: #3fa07e;
    --background-hover: #eceb1b;
    --color-static: #000;
    --color-hover: #ec2d3f;
    --animation-time: 40s;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes blink {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes shake-anim {
    0% {
        transform: rotate(0) scale(1) skew(1deg);
    }

    10%,30% {
        -moz-transform: rotate(-25deg) scale(1) skew(1deg);
    }

    20%,40% {
        -moz-transform: rotate(25deg) scale(1) skew(1deg);
    }

    100%,50% {
        -moz-transform: rotate(0) scale(1) skew(1deg);
    }
}

@keyframes rotate {
    from {
        transform: rotate(0);
    }

    to {
        transform: rotate(360deg);
    }
}

@keyframes fadeup {
    from {
        opacity: 0;
        transform: translateX(-20px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes pulse-animation {
    0% {
        transform: scale3d(1,1,1);
        opacity: 0;
    }

    10% {
        transform: scale3d(1.1,1.1,1.1);
        opacity: 1;
    }

    100% {
        transform: scale3d(1.6,1.6,1.6);
        opacity: 0;
    }
}

@keyframes border-animation {
    0% {
        transform: scale3d(0.6,0.6,0.6);
        opacity: 0;
    }

    20% {
        transform: scale3d(1.2,1.2,1.2);
        opacity: 1;
    }

    100% {
        transform: scale3d(1.4,1.4,1.4);
        opacity: 0;
    }
}

:root {
    --color-main: #ED800B;
    --color-social: #ED800B;
    --color-hover: #ED800B;
    --color-text: #ED800B;
}

body {
    font-size: 14px;
    font-family: 'RobotoRegular' !important;
}

.w-clear:after {
    display: block;
    content: "";
    clear: both;
}

.hidden {
    display: none;
}

.clear {
    clear: both;
}

.none {
    display: none;
}

.wrap-container {
    /* overflow:hidden;*/
    overflow-x: hidden;
    position: relative;
}

.wrap-content {
    max-width: 1200px;
    margin: auto;
    width: calc(100% - 30px);
}

.wrap-content {
    margin: auto;
}

.max-width {
    width: 90%;
    max-width: 1200px;
    margin: 0px auto;
}

img {
    max-width: 100%;
}

* {
    box-sizing: border-box;
}

a {
    text-decoration: none;
}

.social-plugin {
    display: flex;
    margin-top: 10px;
}

.hover-img {
    position: relative;
    overflow: hidden;
    display: block;
}

.text-split {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    -webkit-box-orient: vertical;
    display: -webkit-box;
}

.p-relative {
    position: relative;
}

/* Transition All */
.transition,.btn-frame .kenit-alo-circle-fill,.control-owl button,.carousel-comment-media .carousel-control a span,.menu ul li a.has-child:after,.menu ul li ul,.menu ul li:hover > ul,.scale-img img,.scale-img:hover > img,.support-online .kenit-alo-circle-fill {
    transition: 0.3s all;
}

/* Header */
.header {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    z-index: 12;
    padding: 0;
}

.cart-head {
    position: relative;
    color: #000;
}

.cart-head:hover {
    color: #fff;
}

.cart-head i {
    font-size: 20px;
}

.cart-head .count-cart {
    position: relative;
    z-index: 999;
    color: #000;
}

.menu-head {
    display: flex;
    gap: 20px;
    justify-content: end;
    align-items: center;
}

.menu-head a {
    color: #fff;
}

.menu-head a:hover {
    color: #fed402;
}

.line-head {
    background-color: #72b2fd;
    height: 32px;
    width: 1px;
}

/* Slideshow */
.slideshow {
    position: relative;
}

.slideshow-item {
    display: block;
    cursor: pointer;
    overflow: hidden;
}

.slideshow:hover .control-slideshow {
    opacity: 1;
}

.control-slideshow {
    opacity: 0;
}

@-webkit-keyframes sliderZoom {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transition: -webkit-transform 10000ms linear 0s;
        transition: -webkit-transform 10000ms linear 0s;
        transition: transform 10000ms linear 0s;
        transition: transform 10000ms linear 0s,-webkit-transform 10000ms linear 0s;
    }

    100% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
        -webkit-transition: -webkit-transform 10000ms linear 0s;
        transition: -webkit-transform 10000ms linear 0s;
        transition: transform 10000ms linear 0s;
        transition: transform 10000ms linear 0s,-webkit-transform 10000ms linear 0s;
    }
}

@keyframes sliderZoom {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transition: -webkit-transform 10000ms linear 0s;
        transition: -webkit-transform 10000ms linear 0s;
        transition: transform 10000ms linear 0s;
        transition: transform 10000ms linear 0s,-webkit-transform 10000ms linear 0s;
    }

    100% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
        -webkit-transition: -webkit-transform 10000ms linear 0s;
        transition: -webkit-transform 10000ms linear 0s;
        transition: transform 10000ms linear 0s;
        transition: transform 10000ms linear 0s,-webkit-transform 10000ms linear 0s;
    }
}

.group-slider .slideshow-item .slideshow-image img {
    -webkit-animation: sliderZoom 10000ms linear 0s infinite alternate;
    animation: sliderZoom 10000ms linear 0s infinite alternate;
}

.slideshow .slideshow-item .slideshow-image img {
    -webkit-animation: sliderZoom 10000ms linear 0s infinite alternate;
    animation: sliderZoom 10000ms linear 0s infinite alternate;
}

/* @-webkit-keyframes fadeInDown1{0%{opacity:0;-webkit-transform:translate3d(0,-600px,0);transform:translate3d(0,-600px,0)}
to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}
}
@keyframes fadeInDown1{0%{opacity:0;-webkit-transform:translate3d(0,-600px,0);transform:translate3d(0,-600px,0)}
to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}
}
.slideshow .owl-item.active .name-slider{animation:fadeInDown1 1.4s linear 0.4s forwards;}
.slideshow .owl-item.active .desc-slider{animation:fadeInDown1 1.2s linear 0.2s forwards;}
.slideshow .owl-item.active .content-slider{animation:fadeInDown1 1s linear 0s forwards;}
*/
@-webkit-keyframes fadeInDown1 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-600px,0);
        transform: translate3d(0,-600px,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes fadeInDown1 {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-600px,0);
        transform: translate3d(0,-600px,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.slideshow .owl-item.active .name-slide {
    animation: fadeInDown1 1.4s linear 0.6s forwards;
}

.slideshow .owl-item.active .name-slide1 {
    animation: fadeInDown1 1.3s linear 0.6s forwards;
}

.slideshow .owl-item.active .name2-slide {
    animation: fadeInDown1 1.2s linear 0.6s forwards;
}

.slideshow .owl-item.active .view-slide {
    animation: fadeInDown1 1.1s linear 0.6s forwards;
}

.slideshow .owl-item.active .view-slide {
    animation: fadeInDown1 1s linear 0.6s forwards;
}

.position-slide {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 10%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.box-slide {
    position: relative;
    text-align: left;
    width: 90%;
}

.name-slide {
    color: #fff;
    font-size: 85px;
    overflow: initial !important;
    text-transform: uppercase;
    margin-bottom: -20px;
    font-family: 'Oswald-Bold';
}

.name-slide1 {
    color: #FFD800;
    font-size: 65px;
    font-family: 'UTMHelvetIns';
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #fff;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.name-slide2 {
    font-family: 'UTMBitsumishiPro';
    font-size: 75px;
    color: #019C00;
    text-transform: uppercase;
    text-shadow: 1px 1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,-1px -1px 0 #fff,1px 0px 0 #fff,0px 1px 0 #fff,-1px 0px 0 #fff,0px -1px 0 #fff;
}

.desc-slide {
    font-size: 14px;
    color: #fff;
    margin: auto;
    margin-bottom: 15px;
}

.views-more-slide {
    text-align: center;
}

.views-more-slide a {
    display: inline-block;
    font-size: 18px;
    font-family: 'UTMAvoBold';
    color: #fff;
    text-transform: uppercase;
    padding-right: 7%;
    padding-bottom: 10px;
    padding-top: 7px;
}

/* Partner */
.w-partner {
    position: relative;
}

.control-partner button {
    background-color: transparent;
    color: #222222;
    opacity: 1;
    width: 60px;
    font-size: 23px;
}

.control-partner button:hover {
    opacity: 0.7;
}

.control-partner button.owl-prev {
    left: -50px;
}

.control-partner button.owl-next {
    right: -51px;
}

/* Search */
.search {
    width: 100%;
    max-width: 100%;
    height: 40px;
    position: relative;
    right: 0;
    top: 0;
    margin: auto;
}

.search input {
    width: calc(100% - 40px);
    height: 40px;
    font-size: 13px;
    color: #333;
    border: none;
    background: #F5F5F5;
    border: solid 1px #E4E4E4;
    border-radius: 5px;
}

.search input:focus {
    border: none;
    box-shadow: none;
}

.search p {
    width: 40px;
    height: 40px;
    cursor: pointer;
    line-height: 40px;
    text-align: center;
    font-size: 16px;
    border-radius: 5px;
    margin-right: -5px;
    margin-left: 5px;
    margin-top: 1px;
    background: var(--color-main);
}

.search p i {
    font-weight: bold;
    color: #fff;
}

.box-search {
    padding: 10px;
    border-bottom: 1px solid #f1f1f1;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.ds-item-search {
    width: calc(100% - 70px);
}

.ds-item-search a {
    font-size: 14px;
    color: #333;
}

.show-search {
    position: absolute;
    z-index: 9999;
    top: 100%;
    background: #fff;
    width: 100%;
    border-radius: 10px;
    box-shadow: 0 1px 8px rgba(0,0,0,0.3);
}

.box-search .price-product {
    width: 100%;
    margin: 0px;
    text-align: left;
}

.box-search .price-product .price-new {
    color: #f00;
    font-size: 14px;
    font-weight: bold;
}

.box-search .price-product .price-old {
    color: #999;
    text-decoration-line: line-through;
}

/* Menu */
.wrap-menu {
    position: relative;
}

.menu {
    position: relative;
    z-index: 12;
    top: 0;
    left: 0;
    right: 0;
    padding: 5px 0;
    margin-bottom: 0px;
    left: 0;
    right: 0;
    top: 0;
    width: 100%;
    background: #fff;
}

.fix_menu {
    position: fixed !important;
    box-shadow: 0 0 1px #999;
    background: #fff;
}

.menu ul {
    width: 100%;
    padding: 0px;
    margin: 0;
    list-style: none;
    margin: auto;
    padding-left: 3%;
}

.menu ul.ulmn {
}

.menu ul li {
    /* position:relative;*/
    z-index: 99;
}

.menu ul.ulmn > li {
    position: relative;
}

.menu ul li.line {
    width: 1px;
    height: 15px;
    background-color: rgba(255,255,255,0.5);
    flex: none;
}

.menu ul li a {
    font-size: 15px;
    color: #000;
    font-family: 'RobotoMedium';
    margin: 0px;
    padding: 0;
    display: inline-block;
    text-transform: capitalize;
    position: relative;
    text-decoration: none !important;
    cursor: pointer;
}

.menu ul li a img {
    vertical-align: middle;
}

.menu ul li a.active,.menu ul li:hover > a {
    color: var(--color-main) !important;
}

.menu ul li ul {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 250px;
    -webkit-border-radius: 0.25rem;
    -moz-border-radius: 0.25rem;
    border-radius: 0.25rem;
    background: #fff;
    -webkit-box-shadow: 1px 1px 15px #00000026;
    -moz-box-shadow: 1px 1px 15px #00000026;
    box-shadow: 1px 1px 15px #00000026;
    padding: 0;
    margin-top: -5px;
    -webkit-transform: perspective(600px) scaleY(1.5) translateY(15px);
    -moz-transform: perspective(600px) scaleY(1.5) translateY(15px);
    transform: perspective(600px) scaleY(1.5) translateY(15px);
    -webkit-transform-origin: 0 0 0;
    -moz-transform-origin: 0 0 0;
    -ms-transform-origin: 0 0 0;
    -o-transform-origin: 0 0 0;
    transform-origin: 0 0 0;
    -webkit-transition: all .5s ease-out;
    -o-transition: all .5s ease-out;
    -moz-transition: all .5s ease-out;
    transition: all .5s ease-out;
}

.menu ul li:hover > ul {
    opacity: 1;
    visibility: visible;
    -webkit-transform: perspective(600px) scaleY(1) translateY(0);
    -moz-transform: perspective(600px) scaleY(1) translateY(0);
    transform: perspective(600px) scaleY(1) translateY(0);
    -webkit-transform-origin: 0 0 0;
    -moz-transform-origin: 0 0 0;
    -ms-transform-origin: 0 0 0;
    -o-transform-origin: 0 0 0;
    transform-origin: 0 0 0;
    -webkit-transition: all .5s ease-out;
    -o-transition: all .5s ease-out;
    -moz-transition: all .5s ease-out;
    transition: all .5s ease-out;
    top: -webkit-calc(100% + 10px);
    top: -moz-calc(100% + 10px);
    top: calc(100% + 10px);
}

.menu ul li ul li {
    text-align: left;
    border-bottom: 1px solid rgb(173 173 173 / 32%);
}

.menu ul li ul li:last-child {
    border-bottom: 0px;
}

.menu ul li ul li a {
    font-size: 14px;
    padding: 10px;
    display: block;
    text-decoration: none !important;
    line-height: 20px;
    text-align: left;
    font-weight: 500;
    text-transform: capitalize;
    background: none !important;
    color: #000 !important;
}

.menu ul li ul li ul {
    top: 5px !important;
    left: 100%;
}

.menu ul li ul li a:before {
    position: absolute;
    content: '';
    top: 50%;
    left: 0;
    width: 0;
    height: 1px;
    background: var(--color-main);
    transition: all .3s linear;
    -webkit-transition: all .3s linear;
    -moz-transition: all .3s linear;
    -o-transition: all .3s linear;
    -ms-transition: all .3s linear;
    visibility: hidden;
    opacity: 0;
}

.menu ul li ul li a:hover:before,.menu ul li ul li>a.active:before {
    left: 0;
    visibility: visible;
    opacity: 1;
    width: 30px;
}

.menu ul li ul li a:hover,.menu ul li ul li>a.active {
    padding-left: 40px;
    background: none;
    color: #000
}

.menu ul li a::before {
    position: absolute;
    content: '';
    width: 100%;
    height: 2px;
    background-color: var(--color-main);
    border-radius: 5px;
    left: 0px;
    bottom: -5px;
    transform-origin: right;
    transform: scaleX(0);
    transition: transform 0.5s;
}

.menu ul li > a.active::before,.menu ul li:hover > a::before {
    transform-origin: left;
    transform: scaleX(1);
}

/* .menu ul li a:before{content:'';position:absolute;background:url(../images/main/line-menu.png)no-repeat;width:0;height:8px;bottom:0;left:calc(55% - 35px/2);transition:all ease .5s;margin:auto;text-align:center;}
.menu ul li:hover a:before,.menu ul li a.active:before{width:35px;}
.menu ul li ul li a:before{display:none;}
*/
/* Mmenu */
.menu-res {
    height: 55px;
    z-index: 501;
    background: var(--color-main);
    position: relative;
    display: none;
    box-shadow: 0 1px 5px 0 rgb(0 0 0 / 10%);
}

.menu-bar-res {
    height: 55px;
    padding: 0px 15px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

#menu {
    display: none;
}

#hamburger {
    display: block;
    width: 35px;
    height: 23px;
    position: relative;
}

#hamburger:before,#hamburger:after,#hamburger span {
    background: #fff;
    content: "";
    display: block;
    width: 100%;
    height: 3px;
    position: absolute;
    left: 0px;
}

#hamburger:before {
    top: 0px;
}

#hamburger span {
    top: 10px;
}

#hamburger:after {
    top: 20px;
}

#hamburger:before,#hamburger:after,#hamburger span {
    -webkit-transition: none 0.5s ease 0.5s;
    transition: none 0.5s ease 0.5s;
    -webkit-transition-property: transform,top,bottom,left,opacity;
    -webkit-transition-property: top,bottom,left,opacity,-webkit-transform;
    transition-property: top,bottom,left,opacity,-webkit-transform;
    transition-property: transform,top,bottom,left,opacity;
    transition-property: transform,top,bottom,left,opacity,-webkit-transform;
}

.search-res-w100 {
    width: calc(100% - 45px);
    border-radius: 0.25rem;
}

.mm-wrapper_opening #hamburger:before,.mm-wrapper_opening #hamburger:after {
    top: 10px;
}

.mm-wrapper_opening #hamburger span {
    left: -50px;
    opacity: 0;
}

.mm-wrapper_opening #hamburger:before {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.mm-wrapper_opening #hamburger:after {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.mm-menu_opened {
    display: block !important;
}

.mm-slideout {
    z-index: unset;
}

/* Search Responsive */
.search-res {
    position: relative;
}

.search-res .icon-search {
    width: 40px;
    height: 40px;
    cursor: pointer;
    text-align: center;
    line-height: 40px;
    color: #000;
    font-size: 23px;
    margin: 0px;
    background: none;
    border-radius: 50%;
}

.search-res .icon-search.active {
    color: var(--color-main);
    /* background:#7a7878;*/
    border-radius: 100%;
}

.search-res .search-grid {
    position: absolute;
    top: 50px;
    right: 0px;
    width: 0px;
    height: 35px;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid var(--main-color);
    z-index: 2;
    opacity: 0;
    border-radius: 25px;
    line-height: normal;
}

.search-res .search-grid p {
    float: left;
    width: 35px;
    height: 38px;
    cursor: pointer;
    outline: none;
    border: none;
    margin: 0px;
    font-size: 17px;
    display: block;
    color: var(--main-color);
    line-height: 40px;
    text-align: center;
}

.search-res .search-grid input {
    width: calc(100% - 35px);
    float: right;
    line-height: 35px;
    outline: none;
    border: none;
    color: black;
    padding: 0;
    font-size: 13px;
    border-left: none !important;
    box-shadow: none !important;
}

.search-res .search-grid input::-webkit-input-placeholder {
    color: #313131;
}

.search-res .search-grid input:-moz-placeholder {
    color: #313131;
}

.search-res .search-grid input::-moz-placeholder {
    color: #313131;
}

.search-res .search-grid input:-ms-input-placeholder {
    color: #313131;
}

/*Menu*/
.mmenu-fixwidth ul,ol {
    padding: 0px;
    margin: 0px;
    list-style: none
}

.opacity-menu.open-opacity {
    content: " ";
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    position: fixed;
    top: 0px !important;
    left: 0px;
    z-index: 9999;
}

.mmenu-fixwidth {
    top: 0 !important;
    width: 255px;
    min-height: 100vh;
    position: fixed;
    float: left;
    background: #fff;
    width: 290px;
    position: fixed;
    z-index: -9999;
    left: 0;
    top: 0;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.35s ease;
    -o-transition: all 0.35s ease;
    transition: all 0.35s ease;
    -webkit-transform: translateX(-280px);
    -ms-transform: translateX(-280px);
    -o-transform: translateX(-280px);
    transform: translateX(-280px);
}

.mmenu-fixwidth.open-sidebar-menu {
    visibility: visible;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    z-index: 999999;
    opacity: 1;
}

.mmenu-fixwidth.open-menu {
    padding-top: 15px;
    visibility: visible;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0)
}

.mmenu-fixwidth .wrap-menu {
    overflow-y: auto;
    position: relative;
    min-height: 100vh;
    max-height: 100vh;
    border-left: 1px solid #ebebeb;
    border-right: 1px solid #ebebeb;
    /* padding:0 15px;*/
}

.mmenu-fixwidth .wrap-menu::-webkit-scrollbar-track {
    -webkit-box-shadow: inset transparent;
    background-color: transparent
}

.mmenu-fixwidth .wrap-menu::-webkit-scrollbar {
    width: 1px;
    background-color: transparent
}

.mmenu-fixwidth .wrap-menu::-webkit-scrollbar-thumb {
    border: 1px solid transparent
}

.mmenu-fixwidth .wrap-menu .logos-menu {
    padding: 20px 0px;
}

.mmenu-fixwidth .wrap-menu .logos-menu img {
    max-width: 100%;
    display: block;
    margin: 0 auto;
    max-height: 50px;
}

.mmenu-fixwidth .wrap-menu .nav-menu ul a {
    display: block;
    font-size: 16px;
    color: #333;
    padding: 10px 10px;
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mmenu-fixwidth .wrap-menu .nav-menu ul li {
    position: relative;
    border-top: 1px solid #F0F0F0;
}

.mmenu-fixwidth .wrap-menu .nav-menu ul li a:hover {
    background-color: #F0F0F0;
}

.mmenu-fixwidth .wrap-menu .nav-menu ul li span.btn-dropdown-menu {
    position: absolute;
    right: 0px;
    font-size: 25px;
    display: flex;
    width: 43px;
    height: 43px;
    background: transparent;
    top: 0px;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
    color: #8a8987;
    z-index: 1000;
    cursor: pointer;
    transition: all 0.6s;
    border-left: 1px solid #F0F0F0;
    border-right: 1px solid #F0F0F0;
}

.mmenu-fixwidth .wrap-menu .nav-menu ul li span.btn-dropdown-menu i {
    transition: all 0.6s;
}

.mmenu-fixwidth .wrap-menu .nav-menu ul li span.btn-dropdown-menu.active i {
    transform: rotate(90deg);
    color: var(--color-key);
}

.mmenu-fixwidth .wrap-menu .nav-menu ul li span.btn-dropdown-menu:before {
    position: absolute;
    content: '';
    width: 16px;
    height: 2px;
    background: #333;
    right: 12px;
    top: 22px;
}

.mmenu-fixwidth .wrap-menu .nav-menu ul li span.btn-dropdown-menu:after {
    position: absolute;
    content: '';
    width: 2px;
    height: 16px;
    background: #333;
    right: 19px;
    top: 15px;
    transition: all 0.3s;
}

.mmenu-fixwidth .wrap-menu .nav-menu ul li span.btn-dropdown-menu.active:after {
    transform: scale(0);
}

.mmenu-fixwidth .wrap-menu .nav-menu ul ul a {
    padding: 10px 25px;
    font-size: 14px;
}

/* .mmenu-fixwidth .wrap-menu .nav-menu ul ul ul a{padding:10px 40px;}
.mmenu-fixwidth .wrap-menu .nav-menu ul ul ul ul a{padding:10px 55px;}
.mmenu-fixwidth .wrap-menu .nav-menu ul ul ul ul ul a{padding:10px 70px;}
*/
.mmenu-fixwidth .wrap-menu .nav-menu ul.none {
    display: none;
}

.mmenu-fixwidth .wrap-menu .nav-menu ul.block {
    display: block;
}

.mm-opening #hamburger:before {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.mm-opening #hamburger:after {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.mm-opening #hamburger span {
    left: -50px;
    opacity: 0;
}

.mm-opening #hamburger:before,.mm-opening #hamburger:after {
    top: 10px;
}

a.cart-header {
    position: relative;
}

a.cart-header span {
    position: absolute;
    top: 0px;
    right: 0px;
    color: #fff;
    font-size: 11px;
    width: 17px;
    height: 17px;
    text-align: center;
    border-radius: 50%;
}

/* SLider */
.control-owl {
    position: absolute;
    width: 100%;
    z-index: 2;
    left: 0px;
    top: calc(50% - 45px / 2);
}

.control-owl button {
    opacity: 0.5;
    top: 0px;
    position: absolute;
    outline: none;
    border: 0px;
    padding: 0px;
    margin: 0px;
    display: block;
    cursor: pointer;
    color: #ffffff;
    width: 45px;
    height: 45px;
    text-align: center;
    font-size: 25px;
    margin: 0px;
    background-color: #000;
    border-radius: 3px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.control-owl button:hover {
    opacity: 1;
}

.control-owl button.owl-prev {
    left: 20px;
}

.control-owl button.owl-next {
    right: 20px;
}

.box-photo-ct {
    border-radius: 20px;
    overflow: hidden;
}

.title-detail {
    position: relative;
    margin: 20px 0px;
}

.title-detail h1 {
    font-size: 20px;
    color: #333;
    font-family: 'MontserratBold';
    text-align: left;
    text-transform: uppercase;
}

.tt-week {
    font-size: 25px;
    text-align: center;
    margin: 20px 0px;
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
}

.title-cat-main {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 20px 0px;
    gap: 20px;
}

.title-cat-main span {
    display: block;
    color: #999;
    background: linear-gradient(64.85deg,#fca600 23.67%,#ffd41d 106.12%);
    background-color: #fff;
    padding: 10px;
    border-radius: 10px;
    cursor: pointer;
}

.title-cat-main span:hover,.title-cat-main span.active {
    background: linear-gradient(64.85deg,#ffd41d 23.67%,#fca600 106.12%);
    color: #000;
}

/* News intro */
.news-intro:before {
    content: "";
    position: absolute;
    width: 1px;
    height: calc(100% - 50px);
    top: 10px;
    left: 90px;
    background-color: #cacaca;
}

.news-scroll:before,.news-scroll:after {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    left: 85px;
    border-radius: 100%;
    background-color: #cacaca;
}

.news-scroll:before {
    top: 10px;
}

.news-scroll:after {
    bottom: 40px;
}

.news-control {
    left: 85px;
    font-size: 13px;
    opacity: 0.5;
    z-index: 1;
    cursor: pointer;
}

.news-control:hover {
    opacity: 1;
    color: var(--color-main);
}

.news-control#up {
    top: -10px;
}

.news-control#down {
    bottom: 20px;
}

.news-shadow {
    padding-bottom: 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.news-shadow .news-shadow-time {
    font-size: 13px;
    width: 75px;
    margin-right: 45px;
}

.news-shadow .news-shadow-time:after {
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    top: calc(50% - 20px / 2);
    right: -26px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../images/pattern-news.png);
}

.news-shadow .news-shadow-article {
    width: calc(100% - 120px);
    padding: 14px 15px;
    border-radius: 10px;
    background-color: #ffffff;
    border: 1px solid #cecabb;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.news-shadow .news-shadow-article:before {
    content: "";
    position: absolute;
    top: calc(50% - 26px / 2);
    left: -13px;
    z-index: 0;
    border-top: 13px solid transparent;
    border-right: 13px solid #cecabb;
    border-bottom: 13px solid transparent;
}

.news-shadow .news-shadow-article:after {
    content: "";
    position: absolute;
    top: calc(50% - 24px / 2);
    left: -11px;
    z-index: 1;
    border-top: 12px solid transparent;
    border-right: 11px solid #ffffff;
    border-bottom: 12px solid transparent;
}

.news-shadow .news-shadow-article .news-shadow-image {
    margin-right: 10px;
    width: 90px;
}

.news-shadow .news-shadow-article .news-shadow-info {
    width: calc(100% - 100px);
}

.news-shadow .news-shadow-article .news-shadow-info .news-shadow-name {
    height: 36px;
    font-size: 15px;
    font-weight: 700;
}

.news-shadow .news-shadow-article .news-shadow-info .news-shadow-name a {
    color: #222222;
}

.news-shadow .news-shadow-article .news-shadow-info .news-shadow-name a:hover {
    color: var(--color-main);
}

.news-shadow .news-shadow-article .news-shadow-info .news-shadow-name a .text-split {
    -webkit-line-clamp: 2;
}

.news-shadow .news-shadow-article .news-shadow-info .news-shadow-desc {
    height: 38px;
    font-size: 13px;
}

.news-shadow .news-shadow-article .news-shadow-info .news-shadow-desc.text-split {
    -webkit-line-clamp: 2;
}

/* News */
.grid-tintuc {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-flow: row wrap;
    -webkit-flex-flow: row wrap;
    justify-content: space-between;
}

.news {
    display: block;
    margin-bottom: 20px;
    display: block;
}

.pic-news {
    border-radius: 10px;
    display: block;
    overflow: hidden;
    position: relative;
}

.pic-news img {
    width: 100%;
}

a.views {
    display: inline-block;
    text-decoration: none;
    margin-top: 10px;
    border: solid 1px #ccc;
    padding: 7px 20px;
    border-radius: 20px;
    color: #000;
    font-size: 16px;
}

a.views:hover {
    border: solid 1px #fed402;
    color: #fed402;
}

.info-news {
}

.info-news h3 {
}

.name-news {
    color: #1b1b1b;
    font-size: 18px;
    line-height: 22px;
    max-height: 40px;
    -webkit-line-clamp: 2 !important;
    font-weight: 400;
}

a.name-news.name1 {
    font-size: 25px;
    line-height: 32px;
    max-height: 64px;
}

.name-news:hover {
    color: #fed402;
}

.time-news {
    color: #fed402;
    margin-bottom: 0px;
    font-size: 12px;
    margin: 7px 0;
    font-style: italic;
    font-weight: 500;
}

.desc-news {
    color: #333333;
    margin-top: 0px;
    line-height: 20px;
    height: 60px;
}

.share {
    padding: 17px 10px 10px 10px;
    line-height: normal;
    background: rgba(128,128,128,0.15);
    margin-top: 15px;
    border-radius: 5px;
}

.share b {
    display: block;
    margin-bottom: 5px;
}

.othernews b {
    margin-bottom: 10px;
}

.list-news-other {
    padding-left: 17px;
    list-style: square;
}

.list-news-other li {
    margin-bottom: 2px;
}

.list-news-other li a {
    text-transform: none;
    color: #333333;
}

.list-news-other li a:hover {
    color: #fed402;
}

/*News orther*/
.othernews {
    position: sticky;
    top: 80px;
    z-index: 11;
}

.news-other {
    margin-bottom: 15px;
}

.pic-news-other {
    width: 40%;
}

.info-news-other {
    width: 60%;
    padding-left: 10px;
}

.name-news-other {
    color: #252525;
    font-size: 14px;
    line-height: normal;
    font-family: 'MontserratBold';
}

.name-news-other:hover {
    color: var(--color-main);
}

.othernews b {
    margin-bottom: 10px;
    font-size: 15px;
    font-family: 'MontserratBold';
}

.time-main {
    color: #333;
}

.title-detail-main {
    text-align: left;
    margin-bottom: 1rem;
}

.title-detail-main h3 {
    font-family: 'MontserratBold';
    font-size: 25px;
}

/* Toc */
a.mucluc-dropdown-list_button:before {
    content: "\f03a";
    font-family: "FontAwesome";
    font-style: normal;
    font-weight: 400;
    background: #fff;
    color: #006ACB!important;
    font-size: 20px;
    width: 35px;
    height: 35px;
    display: inline-block;
    line-height: 38px;
    text-align: center;
    border: 1px solid #ddd;
}

.meta-toc.fiedx {
    position: fixed;
    left: 5px;
    top: 200px;
    z-index: 111;
}

.meta-toc .mucluc-dropdown-list_button {
    display: none
}

.meta-toc.fiedx .mucluc-dropdown-list_button {
    display: block;
}

.meta-toc:not(.fiedx) .box-readmore {
    display: block !important;
}

.box-readmore {
    padding: 10px;
    background-color: #f5f5f5;
    width: 100%;
    margin-top: 2px;
    border: 1px solid #dddddd;
    font-size: 13px;
    margin-bottom: 10px;
}

.meta-toc.fiedx .box-readmore {
    width: 350px;
    display: none;
}

.box-readmore li ul > li {
    margin: 0;
    margin-bottom: 8px;
}

.box-readmore li ul > li:before {
    content: counters(item,".") " ";
}

.box-readmore ul {
    list-style-type: none;
    counter-reset: item;
    margin-bottom: 0px;
    padding-left: 0px !important;
    margin-top: 8px;
}

.box-readmore ul li {
    display: table;
    counter-increment: item;
    margin: 0 0 5px 0;
}

.box-readmore ul li:before {
    content: counters(item,".") ". ";
    display: table-cell;
    padding-right: 5px;
}

.box-readmore ul li a {
    color: #000!important;
    cursor: pointer;
    font-weight: 500;
    font-size: 14px;
}

.box-readmore ul li li a {
    font-weight: 400;
}

.box-readmore ul li a:hover {
    color: #767676;
}

/* Partner */
.info-partner {
    background: #f8f8f8;
    padding: 15px 0px;
}

/* Footer */
.info-footer .flex-footer {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

.info-footer .flex-footer .box-footer .social-footer {
    display: flex;
    gap: 5px;
    margin: 10px 0px;
}

.info-footer .flex-footer .box-footer:nth-child(1) {
    width: 33.3%;
}

.info-footer .flex-footer .box-footer:nth-child(2) {
    width: 40%;
}

.info-footer .flex-footer .box-footer:nth-child(3) {
    width: 25%;
}

.info-footer .flex-footer .title-footer {
    text-transform: uppercase;
    margin-bottom: 20px;
    font-weight: 700;
    font-size: 14px;
}

.info-footer .flex-footer .service-footer {
    margin-top: 20px;
}

.info-footer .flex-footer .service-footer ul {
    padding: 0px;
    margin: 0px;
}

.info-footer .flex-footer .service-footer ul li {
    list-style: none;
    padding: 5px 0px;
}

.info-footer a {
    color: #fff;
}

/* Tags */
.title-tags {
    position: relative;
    font-size: 1em;
    font-weight: 600;
    padding-bottom: 15px;
    margin-bottom: 15px;
    color: #777;
}

.title-tags:after {
    content: '';
    position: absolute;
    left: 0px;
    bottom: 0px;
    background-color: rgba(0,0,0,0.1);
    display: block;
    height: 3px;
    width: 30px;
}

.flex-tags {
    display: flex;
    gap: 5px;
}

.flex-tags a {
    color: #333;
    border: 1px solid;
    border-radius: 3px;
    display: inline-block;
    font-size: 0.8em !important;
    opacity: 0.8;
    padding: 2px 5px;
}

.flex-tags a:hover {
    background-color: #446084;
    border-color: #446084;
    color: #fff;
    opacity: 1;
}

.footer-powered {
    background: var(--color-main);
}

/* TC */
.item-criteria a {
    display: flex;
    align-items: center;
    color: #333;
}

.item-criteria a .ds-criteria {
    width: calc(100% - 60px);
    margin-left: 10px;
}

.item-criteria a .ds-criteria h3 {
    -webkit-line-clamp: 2;
    font-size: 16px;
    color: var(--color-main);
}

.item-criteria a .ds-criteria p {
    -webkit-line-clamp: 2;
    margin: 0px;
}

/* About */
.box-about {
    max-width: 700px;
    margin: 0px auto;
    text-align: center;
}

.box-about h3 {
    color: #ca0000;
    font-family: SVN;
    font-size: 22px;
    margin-bottom: 10px;
    text-transform: lowercase;
}

.box-about a {
    padding: 10px 20px;
    color: white;
    text-transform: uppercase;
    font-size: 15px;
    display: block;
    background: #ca0000;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto;
    font-weight: 600;
    border-radius: 10px;
}

/* Service */
.item-service {
    position: relative;
}

.item-service h3 {
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    color: #fff;
    text-transform: uppercase;
    padding: 10px;
    font-size: 17px;
    margin: 0px;
}

/* Sort */
.sort-select {
    display: flex;
    justify-content: end;
    margin: 20px 0px;
    position: relative;
}

.sort-select .click-sort {
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    padding: 6px 10px 6px 8px;
    margin: 0px;
}

.sort-select-main {
    display: grid;
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0 4px 6px rgb(0 0 0 / 20%);
    position: absolute;
    padding: 0 7px;
    top: 30px;
    right: 0;
    width: 160px;
    z-index: 2;
}

.sort-select-main p {
    border-bottom: 1px solid #f1f1f1;
    margin: 0px;
    order: 2;
}

.sort-select-main p:has(.check) {
    order: 1;
}

.sort a {
    color: #000;
    font-size: 14px;
    line-height: 17px;
    padding: 11px 3px;
    display: block;
    cursor: pointer;
}

.sort a.check i {
    box-sizing: border-box;
    position: relative;
    display: inline-block;
    transform: scale(var(--ggs,1));
    width: 22px;
    height: 16px;
    border: 2px solid transparent;
    border-radius: 100px;
    vertical-align: middle;
}

.sort a.check i::after {
    content: '';
    display: block;
    box-sizing: border-box;
    position: absolute;
    left: 3px;
    top: -4px;
    width: 6px;
    height: 10px;
    border-width: 0 2px 2px 0;
    border-style: solid;
    transform-origin: bottom left;
    transform: rotate(45deg);
}

.sort-select .sort-show {
    padding-right: 12px;
    position: relative;
}

.sort-select .sort-show::before {
    content: '';
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid #333;
    content: '';
    height: 0;
    position: absolute;
    top: 6px;
    right: 0;
    width: 0;
}

/* Product */
.filter {
    position: absolute;
    right: 0px;
    top: 0px;
    padding: 5px 10px;
    background: #f1f1f1;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
    text-transform: uppercase;
    border-radius: 5px;
    cursor: pointer;
    border: 1px solid #ddd;
    display: none;
}

.flex-product-main {
    display: flex;
    gap: 20px;
}

.flex-product-main .left-product {
    width: 250px;
    border: 1px solid #f1f1f1;
    padding: 20px;
    border-radius: 5px;
}

.flex-product-main .right-product {
    width: calc(100% - 250px);
}

.wrap-product-sale {
    background-color: #ffa09e;
    border-radius: 10px;
    overflow: hidden;
}

.wr-search p {
    font-weight: bold;
    text-transform: uppercase;
}

.product .pic-product {
    display: block;
    position: relative;
    overflow: hidden;
    margin-bottom: 0;
    /* box-shadow:0 0px 15px rgb(0 0 0 / 12%);*/
}

.product:hover .pic-product {
}

.product .pic-product img {
    width: 100%;
    -webkit-transform-style: preserve-3d;
    height: 100%;
    object-fit: cover;
}

.product .pic-product > a {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    /* text-align:center;*/
}

.first_img {
    position: absolute;
    top: 0;
    transition: all 0.5s ease;
    height: 100%;
}

.product:hover .first_img {
    transform: scale(0);
}

.second_img {
    display: block;
    position: absolute;
    top: 0;
    right: 100%;
    transition: all 0.5s ease;
    height: 100%;
}

.product:hover .second_img {
    right: 0;
    top: 0;
    transition: all 0.5s ease;
}

.name-product .text-split {
    -webkit-line-clamp: 1;
}

.box-cat {
    text-align: center;
}

.box-cat h3 {
    font-size: 14px;
    color: #333;
    margin-top: 10px;
}

.box-cat:hover h3 {
    color: #f00;
}

.cart-product {
    margin: 5px 0 0 0px;
}

.cart-product span {
    cursor: pointer;
    color: #fff;
    text-align: center;
    padding: 0px 5px;
    border-radius: 5px;
    display: inline-block;
    line-height: 34px;
    font-size: 13px;
    font-weight: 700;
}

.cart-add {
    margin-left: 10px;
    background-color: #00a5d9;
    width: 155px;
}

.cart-add:hover {
    background-color: #fed402;
}

.cart-buy {
    background-color: #ff2e00;
    width: 93px;
    height: 33px;
}

.cart-buy:hover {
    background-color: #fed402;
}

.grid-product {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 20px;
}

.grid-product .product .product-info {
    margin-top: 10px;
    color: #333;
}

.grid-product .product .product-info h3 {
    font-size: 17px;
    color: #333;
}

.grid-product .product .product-info .price span {
    color: #f00;
}

.grid-product .product .pic-product {
    border: 1px solid #ddd;
}

/* product detail */
.grid-pro-detail {
    display: flex;
    justify-content: space-between;
    align-items: start;
    border-bottom: 1px solid #ececec;
}

.grid-pro-detail .left-pro-detail {
    width: 50%;
    border-right: 1px solid #ececec;
    padding-right: 15px;
}

.grid-pro-detail .right-pro-detail {
    width: 48%;
}

.detail-product {
    display: flex;
    justify-content: space-between;
}

.detail-product .left-pro-detail {
    width: 40%;
    border: 1px solid #ddd;
}

.detail-product .right-pro-detail {
    width: 57%;
}

.detail-product .right-pro-detail ul {
    list-style: none;
    padding: 0px;
}

.detail-product .right-pro-detail ul li {
    margin-bottom: 20px;
}

.detail-product .right-pro-detail ul li .title-pro-detail {
    font-size: 18px;
}

.detail-product .right-pro-detail ul li .attr-content-pro-detail {
    display: inline-block;
    margin-bottom: 0px;
}

.detail-product .right-pro-detail ul li .attr-content-pro-detail .price-new-pro-detail {
    font-weight: 700;
    font-size: 20px;
    color: #f00;
}

.price-new-pro-detail {
}

.price-old-pro-detail {
}

.policy_intuitive {
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    margin-bottom: 25px;
}

.policy {
    margin: 20px 16px 0 16px;
}

.policy__list {
    display: flex;
    flex-wrap: wrap;
    padding: 0px;
}

.policy__list > li {
    border-bottom: 1px solid #f1f1f1;
    position: relative;
    padding: 12px 0 12px 35px;
    width: 50%;
    display: inline-block;
}

.policy__list > li:nth-child(2n + 1) {
    padding-right: 20px;
}

.policy__list li > div.iconl {
    left: 0;
    position: absolute;
    top: 15px;
}

.policy__list li .iconl {
    width: 32px;
}

.policy__list li p {
    line-height: 20px;
    padding-left: 5px;
    margin: 0px;
}

.policy__list li:last-child {
    border-bottom: 0;
}

.policy__list > li:nth-child(2n + 1):nth-last-child(2) {
    border: 0;
}

/* css block actions */
.ul-actions {
    display: flex;
    justify-content: center;
    margin: 20px;
    gap: 15px;
    align-items: flex-start;
}

.ul-actions li,.ul-actions > div {
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 80px;
    text-align: center;
}

.ul-actions .active .box__tabr,.ul-actions .box__tabr:hover {
    border-color: #fd6e1d;
}

.ul-actions .box__tabr {
    align-items: center;
    border: 1px solid #e0e0e0;
    border-radius: 2px;
    display: flex;
    justify-content: center;
    min-height: 55px;
    padding: 4px;
    height: 60px;
    width: 80px;
}

.icon-action {
    background-image: url('../images/icon_chitiet@2x-min.png');
    background-repeat: no-repeat;
    display: inline-block;
    height: 30px;
    width: 30px;
    line-height: 30px;
    vertical-align: middle;
    background-size: 300px 180px;
}

.icon-dnb {
    background-position: 0 0;
    height: 28px;
    width: 28px;
}

.icon-tskt {
    background-position: -105px 0;
    height: 30px;
    width: 30px;
}

.icon-ttsp {
    background-position: -140px 0;
    height: 19px;
    width: 23px;
}

.ul-actions p {
    font-size: 14px;
    line-height: 1.3;
    margin-top: 5px;
    white-space: normal;
    color: #000;
}

/* modal-detail */
.modal-detail::-webkit-scrollbar {
    width: 10px;
}

.modal-detail::-webkit-scrollbar-thumb {
    width: 10px;
    background: #4d90e0;
    border-radius: 10px;
    height: 50px;
}

.modal-detail {
    position: fixed;
    z-index: 999;
    background: #000000c4;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    overflow-y: scroll;
}

.content-modal-detail {
    background: #fff;
    max-width: 1200px;
    margin: 0px auto;
    min-height: 100vh;
}

.content-modal-detail .tabs {
    display: flex;
    cursor: pointer;
    padding: 0;
    list-style: none;
    justify-content: center;
    border-bottom: 1px solid #e0e0e0;
    position: sticky;
    top: 0px;
    background: #fff;
    z-index: 99;
}

.content-modal-detail .tabs li {
    padding: 20px 20px;
    margin-right: 5px;
    font-weight: bold;
    position: relative;
    border-bottom: 4px solid #fff;
}

.content-modal-detail .tabs li.active {
    color: #2d9cdb;
    border-bottom: 4px solid #2d9cdb;
}

.content-modal-detail .tab-content {
    padding: 20px;
    max-width: 900px;
    margin: 0px auto;
}

.content-modal-detail .tab-content.active {
    display: block;
}

.close-tab {
    position: fixed;
    top: 15px;
    right: 20px;
    z-index: 10;
}

.btn-closemenu {
    position: fixed;
    top: 10px;
    right: 20px;
    background-color: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    color: #333;
    cursor: pointer;
    line-height: 21px;
    padding: 7px;
    text-align: right;
    width: 72px;
}

.btn-closemenu::before {
    transform: rotate(45deg);
}

.btn-closemenu::after {
    transform: rotate(-45deg);
}

.btn-closemenu::before,.btn-closemenu::after {
    background-color: #333;
    content: '';
    left: 13px;
    height: 14px;
    position: absolute;
    top: 10px;
    width: 1px;
}

.cursor-pointer {
    cursor: pointer;
}

/* breadCrumbs */
.breadCrumbs {
    padding: 10px 0px;
    background: #ddd;
}

.breadCrumbs ol {
    margin: 0px;
}

.breadCrumbs ol li a {
    color: #333;
}

.breadCrumbs ol li a:hover {
    color: #f00;
}

/* paging */
.pagination {
    margin: 20px 0px;
}

.pagination li a {
    cursor: pointer;
}

.btn-frame {
    display: block;
    width: 50px;
    height: 50px;
    position: fixed;
    right: 20px;
    z-index: 10;
    cursor: pointer;
}

.btn-frame i {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #1182fc;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-frame i img {
    vertical-align: middle;
    width: 70%;
}

.btn-frame .animated.infinite {
    animation-iteration-count: infinite;
}

.btn-frame .kenit-alo-circle {
    width: 60px;
    height: 60px;
    top: -5px;
    right: -5px;
    position: absolute;
    background-color: transparent;
    border-radius: 100%;
    border: 2px solid rgba(7,41,103,0.8);
    opacity: 0.1;
    border-color: #1182fc;
    opacity: 0.5;
}

.btn-frame .zoomIn {
    animation-name: zoomIn;
}

.btn-frame .animated {
    animation-duration: 1s;
    animation-fill-mode: both;
}

.btn-frame .kenit-alo-circle-fill {
    width: 70px;
    height: 70px;
    top: -10px;
    right: -10px;
    position: absolute;
    border-radius: 100%;
    border: 2px solid transparent;
    background-color: rgba(7,41,103,0.35);
    opacity: 0.4;
}

.btn-frame .pulse {
    animation-name: pulse;
}

.grid-properties {
    display: flex;
    gap: 10px;
}

.grid-properties span {
    position: relative;
    border: 1px solid #ddd;
    padding: 5px 15px;
    cursor: pointer;
}

.grid-properties span:hover,.grid-properties span.active {
    border: 1px solid #f00;
    color: #f00;
}

.grid-properties span:hover:after,.grid-properties span.active:after {
    content: '';
    border: 0.9375rem solid transparent;
    border-bottom: 0.9375rem solid var(#d0011b,#ee4d2d);
    bottom: 0;
    position: absolute;
    right: -0.9375rem;
}

.grid-properties span.outstock {
    pointer-events: none;
    background-color: #fafafa;
    color: rgba(0,0,0,0.26);
    cursor: not-allowed;
}

/* Xu huong */
.wrap-xh {
    background: linear-gradient(90deg,#ffecd2 0%,#fcb69f 100%);
    padding: 10px;
    border-radius: 10px;
}

.title-xh {
    font-size: 25px;
    margin: 20px 0px;
    color: #333;
    font-weight: 700;
    text-align: left;
    text-transform: uppercase;
}

.image-xh {
    border-radius: 10px;
    overflow: hidden;
}

.name-xh {
    text-align: center;
    color: #333;
    font-size: 16px;
    margin: 10px 0px 0px;
}

/* scrollToTop */
.scrollToTop {
    width: 41px;
    height: 41px;
    text-align: center;
    font-weight: bold;
    color: #444;
    text-decoration: none;
    position: fixed;
    bottom: 65px;
    right: 25px;
    display: none;
    z-index: 10;
    cursor: pointer;
}

/* Hidden Google Captcha */
.grecaptcha-badge {
    display: none !important;
    width: 0px !important;
    height: 0px !important;
    visibility: hidden !important;
    overflow: hidden;
}

[x-cloak] {
    display: none !important;
}

/* Contact */
.contact-map {
    position: relative;
    height: 500px;
    margin-top: 30px;
}

.contact-map iframe {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
}

/* breadCrumbs */
.breadCrumbs {
    padding: 10px 0px;
    background: #ddd;
}

.breadCrumbs ol {
    margin: 0px;
}

.breadCrumbs ol li a {
    color: #333;
}

.breadCrumbs ol li a:hover {
    color: #f00;
}

/* paging */
.pagination {
    margin: 20px 0px;
}

.pagination li a {
    cursor: pointer;
}

.btn-frame {
    display: block;
    width: 50px;
    height: 50px;
    position: fixed;
    right: 20px;
    z-index: 10;
    cursor: pointer;
}

.btn-frame i {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #1182fc;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-frame i img {
    vertical-align: middle;
    width: 70%;
}

.btn-frame .animated.infinite {
    animation-iteration-count: infinite;
}

.btn-frame .kenit-alo-circle {
    width: 60px;
    height: 60px;
    top: -5px;
    right: -5px;
    position: absolute;
    background-color: transparent;
    border-radius: 100%;
    border: 2px solid rgba(7,41,103,0.8);
    opacity: 0.1;
    border-color: #1182fc;
    opacity: 0.5;
}

.btn-frame .zoomIn {
    animation-name: zoomIn;
}

.btn-frame .animated {
    animation-duration: 1s;
    animation-fill-mode: both;
}

.btn-frame .kenit-alo-circle-fill {
    width: 70px;
    height: 70px;
    top: -10px;
    right: -10px;
    position: absolute;
    border-radius: 100%;
    border: 2px solid transparent;
    background-color: rgba(7,41,103,0.35);
    opacity: 0.4;
}

.btn-frame .pulse {
    animation-name: pulse;
}

.grid-properties {
    display: flex;
    gap: 10px;
}

.grid-properties span {
    position: relative;
    border: 1px solid #ddd;
    padding: 5px 15px;
    cursor: pointer;
}

.grid-properties span:hover,.grid-properties span.active {
    border: 1px solid #f00;
    color: #f00;
}

.grid-properties span:hover:after,.grid-properties span.active:after {
    content: '';
    border: 0.9375rem solid transparent;
    border-bottom: 0.9375rem solid var(#d0011b,#ee4d2d);
    bottom: 0;
    position: absolute;
    right: -0.9375rem;
}

.grid-properties span.outstock {
    pointer-events: none;
    background-color: #fafafa;
    color: rgba(0,0,0,0.26);
    cursor: not-allowed;
}

/* scrollToTop */
.scrollToTop {
    width: 41px;
    height: 41px;
    text-align: center;
    font-weight: bold;
    color: #444;
    text-decoration: none;
    position: fixed;
    bottom: 65px;
    right: 25px;
    display: none;
    z-index: 10;
    cursor: pointer;
}

/* Hidden Google Captcha */
.grecaptcha-badge {
    display: none !important;
    width: 0px !important;
    height: 0px !important;
    visibility: hidden !important;
    overflow: hidden;
}

[x-cloak] {
    display: none !important;
}

/* Contact */
.contact-map {
    position: relative;
    height: 500px;
    margin-top: 30px;
}

.contact-map iframe {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
}

.footer-map {
    position: relative;
    height: 250px;
    z-index: 1;
}

.footer-map iframe {
    position: absolute !important;
    width: 100% !important;
    height: 100% !important;
    top: 0px !important;
    left: 0px !important;
}

.fanpage-facebook {
    display: block;
    overflow: hidden;
    width: 100%;
    position: relative;
    z-index: 1;
}

/* breadCrumbs */
.breadCrumbs {
    padding: 10px 0px;
    background: #ddd;
}

.breadCrumbs ol {
    margin: 0px;
}

.breadCrumbs ol li a {
    color: #333;
}

.breadCrumbs ol li a:hover {
    color: #f00;
}

/* paging */
.pagination {
    margin: 0;
    margin-top: 10px;
    gap: 10px;
}

.pagination li a {
    cursor: pointer;
}

.btn-frame {
    display: block;
    width: 50px;
    height: 50px;
    position: fixed;
    right: 20px;
    z-index: 10;
    cursor: pointer;
}

.btn-frame i {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #1182fc;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-frame i img {
    vertical-align: middle;
    width: 70%;
}

.btn-frame .animated.infinite {
    animation-iteration-count: infinite;
}

.btn-frame .kenit-alo-circle {
    width: 60px;
    height: 60px;
    top: -5px;
    right: -5px;
    position: absolute;
    background-color: transparent;
    border-radius: 100%;
    border: 2px solid rgba(7,41,103,0.8);
    opacity: 0.1;
    border-color: #1182fc;
    opacity: 0.5;
}

.btn-frame .zoomIn {
    animation-name: zoomIn;
}

.btn-frame .animated {
    animation-duration: 1s;
    animation-fill-mode: both;
}

.btn-frame .kenit-alo-circle-fill {
    width: 70px;
    height: 70px;
    top: -10px;
    right: -10px;
    position: absolute;
    border-radius: 100%;
    border: 2px solid transparent;
    background-color: rgba(7,41,103,0.35);
    opacity: 0.4;
}

.btn-frame .pulse {
    animation-name: pulse;
}

.grid-properties {
    display: flex;
    gap: 10px;
}

.grid-properties span {
    position: relative;
    border: 1px solid #ddd;
    padding: 5px 15px;
    cursor: pointer;
}

.grid-properties span:hover,.grid-properties span.active {
    border: 1px solid #f00;
    color: #f00;
}

.grid-properties span:hover:after,.grid-properties span.active:after {
    content: '';
    border: 0.9375rem solid transparent;
    border-bottom: 0.9375rem solid var(#d0011b,#ee4d2d);
    bottom: 0;
    position: absolute;
    right: -0.9375rem;
}

.grid-properties span.outstock {
    pointer-events: none;
    background-color: #fafafa;
    color: rgba(0,0,0,0.26);
    cursor: not-allowed;
}

/* Messenger */
.js-facebook-messenger-top-header {
    background: #487dfc;
    color: #fff;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: 5px 5px 0 0;
}

.js-facebook-messenger-container.closed {
    display: none !important;
}

.js-facebook-messenger-tooltip {
    bottom: 97px;
    right: 97px;
    color: #404040;
    background: #fff;
}

.js-facebook-messenger-tooltip.closed {
    display: none !important;
}

.js-facebook-messenger-box,.js-facebook-messenger-button {
    z-index: 999;
}

.js-facebook-messenger-tooltip {
    z-index: 999;
    display: none;
    position: fixed;
    text-align: center;
    border-radius: 10px;
    overflow: hidden;
    font-size: 12px;
    line-height: 1;
    padding: 10px;
    border: 1px solid rgba(0,0,0,0.1);
    -webkit-box-shadow: rgba(0,0,0,0.15) 0 2pt 10pt;
    box-shadow: rgba(0,0,0,0.15) 0 2pt 10pt;
    z-index: 1000000000000000019884624838656;
}

.js-facebook-messenger-close-tooltip {
    width: 10px;
    height: 10px;
    display: inline-block;
    cursor: pointer;
    margin-left: 10px;
}

.js-facebook-messenger-box {
    z-index: 999;
}

.js-facebook-messenger-box.rubberBand {
    -webkit-animation-name: rubberBand;
    animation-name: rubberBand;
}

.js-facebook-messenger-box.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.js-facebook-messenger-button,.js-facebook-messenger-tooltip {
    z-index: 999;
}

.js-facebook-messenger-box {
    display: block;
    position: fixed;
    cursor: pointer;
    bottom: 150px;
    right: 17px;
    width: 50px;
    height: 50px;
    text-align: center;
    background: var(--color-main);
    border-radius: 10px;
    overflow: hidden;
    z-index: 99;
    -webkit-box-shadow: 1px 1px 4px 0 rgba(0,0,0,0.3);
    box-shadow: 1px 1px 4px 0 rgba(0,0,0,0.3);
}

.js-facebook-messenger-box.rotate svg#fb-msng-icon {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
}

.js-facebook-messenger-box svg#fb-msng-icon {
    width: 32px;
    height: 33px;
    position: absolute;
    top: 9px;
    left: 9px;
    opacity: 1;
    overflow: hidden;
    -webkit-transition: opacity 160ms ease-in-out,transform 160ms ease-in-out;
    -webkit-transition: opacity 160ms ease-in-out,-webkit-transform 160ms ease-in-out;
    transition: opacity 160ms ease-in-out,-webkit-transform 160ms ease-in-out;
    transition: opacity 160ms ease-in-out,transform 160ms ease-in-out;
    transition: opacity 160ms ease-in-out,transform 160ms ease-in-out,-webkit-transform 160ms ease-in-out;
}

.js-facebook-messenger-box.rotate svg#close-icon {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.js-facebook-messenger-box svg#close-icon {
    opacity: 0;
    width: 19px;
    height: 20px;
    position: absolute;
    top: 16px;
    left: 16px;
    -webkit-transition: opacity 160ms ease-in-out,transform 160ms ease-in-out;
    -webkit-transition: opacity 160ms ease-in-out,-webkit-transform 160ms ease-in-out;
    transition: opacity 160ms ease-in-out,-webkit-transform 160ms ease-in-out;
    transition: opacity 160ms ease-in-out,transform 160ms ease-in-out;
    transition: opacity 160ms ease-in-out,transform 160ms ease-in-out,-webkit-transform 160ms ease-in-out;
}

.js-facebook-messenger-container,.js-facebook-messenger-container-button {
    z-index: 1000;
}

.js-facebook-messenger-container {
    width: 250px;
    position: fixed;
    opacity: 0;
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
    bottom: 110px;
    right: 90px;
    border-radius: 10px;
    pointer-events: none;
    -webkit-box-shadow: 0 1px 6px rgba(0,0,0,0.06),0 2px 32px rgba(0,0,0,0.16);
    box-shadow: 0 1px 6px rgba(0,0,0,0.06),0 2px 32px rgba(0,0,0,0.16);
    -webkit-transition: transform 160ms ease-in-out,opacity 160ms ease-in-out;
    -webkit-transition: opacity 160ms ease-in-out,-webkit-transform 160ms ease-in-out;
    transition: opacity 160ms ease-in-out,-webkit-transform 160ms ease-in-out;
    transition: transform 160ms ease-in-out,opacity 160ms ease-in-out;
    transition: transform 160ms ease-in-out,opacity 160ms ease-in-out,-webkit-transform 160ms ease-in-out;
}

.js-facebook-messenger-top-head {
    width: 220px;
    color: #ffffff;
    background: #1182fc;
    display: block;
    position: relative;
    width: 220px;
    background: #1182fc;
    color: #ffffff;
    text-align: center;
    line-height: 1;
    padding: 10px;
    font-size: 14px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.js-facebook-messenger-container iframe,.js-facebook-messenger-container-button iframe {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.js-facebook-messenger-box,.js-facebook-messenger-button,.js-facebook-messenger-tooltip {
    z-index: 999;
}

.js-facebook-messenger-container,.js-facebook-messenger-container-button {
    z-index: 1000;
}

.js-facebook-messenger-top-head {
    color: #ffffff;
    background: #1182fc;
    width: 220px;
}

.js-facebook-messenger-tooltip {
    color: #404040;
    background: #fff;
}

.js-facebook-messenger-container.open {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
    pointer-events: all;
}

.js-facebook-messenger-tooltip {
    bottom: 97px;
    right: 97px;
}

.js-facebook-messenger-box.open svg#fb-msng-icon {
    opacity: 0;
}

.js-facebook-messenger-box.rotate.open svg#close-icon {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
}

.js-facebook-messenger-box.open svg#close-icon {
    opacity: 1;
}

/* Button Frame */
.btn-frame {
    display: block;
    width: 50px;
    height: 50px;
    position: fixed;
    right: 20px;
    z-index: 10;
    cursor: pointer;
}

.btn-frame i {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: #1182fc;
    position: relative;
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.btn-frame i img {
    vertical-align: middle;
    width: 70%;
}

.btn-frame .animated.infinite {
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

.btn-frame .kenit-alo-circle {
    width: 60px;
    height: 60px;
    top: -5px;
    right: -5px;
    position: absolute;
    background-color: transparent;
    border-radius: 100%;
    border: 2px solid rgba(7,41,103,0.8);
    opacity: 0.1;
    border-color: #1182fc;
    opacity: 0.5;
}

.btn-frame .zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn;
}

.btn-frame .animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.btn-frame .kenit-alo-circle-fill {
    width: 70px;
    height: 70px;
    top: -10px;
    right: -10px;
    position: absolute;
    border-radius: 100%;
    border: 2px solid transparent;
    background-color: rgba(7,41,103,0.35);
    opacity: 0.4;
}

.btn-frame .pulse {
    -webkit-animation-name: pulse;
    animation-name: pulse;
}

/* Zalo */
.btn-zalo {
    bottom: 300px;
}

/* Phone */
.btn-phone {
    bottom: 220px;
}

/* Maps */
.btn-maps {
    bottom: 380px;
}

.btn_animation--style {
    display: flex;
    justify-content: center;
    text-decoration: none;
    border-radius: 10px;
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
    z-index: 1;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    --tw-shadow: 0px 1px 6px #66cdee;
    --tw-shadow-colored: 0px 1px 6px var(--tw-shadow-color);
    width: 3rem;
    height: 3rem;
    z-index: 111;
}

.btn_animation--style:hover {
    transition: all 0.3s ease-in-out;
    z-index: 1;
    margin: auto 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    width: 100%;
}

.btn_animation--style:before {
    content: "";
    position: absolute;
    margin: 0 auto;
    inset: 0;
    width: 100%;
    background: var(--color-main);
    height: 60px;
    animation: rotate360 4s linear infinite;
    transition: all 0.2s linear;
    z-index: 0;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -ms-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    pointer-events: none;
    -webkit-animation: rotate360 4s linear infinite
}

.btn_animation--style:after {
    content: "";
    position: absolute;
    background: #fff;
    inset: 4px;
    border-radius: 4px;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px
}

.btn_animation--style span {
    position: relative;
    z-index: 2;
    color: #122257;
    opacity: 0;
    font-size: 1rem;
    line-height: 1.5rem;
    white-space: pre;
    width: 0;
}

.btn_animation--style i {
    display: block;
    max-width: 30px;
}

.btn_animation--style:hover {
    color: #fff;
    background: #fff
}

.btn_animation--style:hover:after {
    background: #031249
}

.btn_animation--style:hover span {
    color: #fff;
    opacity: 1;
    width: auto;
    margin-right: 5px;
}

@keyframes rotate360 {
    from {
        transform: rotate(0deg)
    }

    to {
        transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg)
    }
}

.menu-contacts-left {
    position: fixed;
    bottom: 200px;
    right: 20px;
    display: flex;
    align-items: flex-end;
    gap: 1rem;
    flex-direction: column;
    z-index: 99;
}

.btn_animation--style a {
    text-decoration: none;
    color: #000;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
}

/* Widget App */
.show-btn-wrapper {
    width: 0;
    height: 0;
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 9999;
}

.zalo-chat-custom {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 60px;
    position: fixed;
    bottom: 181px;
    right: 17px;
    border-radius: 50%;
    box-shadow: 2px 2px 5px #000000;
    color: #fff;
    z-index: 999999999;
    cursor: pointer;
    background-color: #025738;
    font-size: 24px;
    animation: pulse-blue 2s infinite;
}

.zalo-chat-custom-no-active {
    width: 100%;
    height: 100%;
    position: absolute;
    transition: all .3s ease;
    bottom: 70px;
    right: 40px;
    transform: scale(0);
    transform-origin: bottom right;
}

.show-btn-wrapper .zalo-chat-custom2 {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 55px;
    position: fixed;
    bottom: 210px;
    right: 15px;
    border-radius: 30px;
    text-decoration: none;
    z-index: 89;
    cursor: pointer;
}

.show-btn-wrapper .zalo-chat-custom2 div {
    font-weight: 700;
    display: flex;
    justify-content: flex-end;
    color: #fff;
    margin-right: 10px;
    font-size: 14px;
    font-style: normal;
    line-height: 26px;
}

.show-btn-wrapper .zalo-chat-custom2 img {
    width: 45px;
    height: 45px;
}

.show-btn-wrapper .float-button2 {
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 55px;
    position: fixed;
    right: 76px;
    bottom: 155px;
    text-decoration: none;
    border-radius: 30px;
    z-index: 90;
}

.show-btn-wrapper .float-button2 div {
    font-weight: 700;
    text-align: right;
    color: #fff;
    margin-right: 10px;
    font-size: 14px;
    font-style: normal;
    line-height: 26px;
    text-decoration: none;
}

.show-btn-wrapper .float-button3 {
    font-weight: 700;
    display: flex;
    position: fixed;
    bottom: 85px;
    right: 85px;
    z-index: 90;
    height: 55px;
    text-decoration: none;
    justify-content: flex-end;
}

.show-btn-wrapper .float-button3 div {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    color: #fff;
    margin-right: 10px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
    font-style: normal;
    line-height: 26px;
}

.show-btn-wrapper .float-button3 .btn-main {
    width: 48px;
    height: 48px;
    border-radius: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.show-btn-wrapper .float-button3 .icon {
    font-size: 18px;
    color: #C2B5A2;
}

.show-btn-wrapper .float-button4 {
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 55px;
    position: fixed;
    bottom: 30px;
    text-decoration: none;
    right: 23px;
    border-radius: 30px;
    z-index: 90;
}

.show-btn-wrapper .float-button4 div {
    font-weight: 700;
    text-align: right;
    color: #fff;
    margin-right: 10px;
    font-size: 14px;
    font-style: normal;
    line-height: 26px;
    text-decoration: none;
}

.show-btn-wrapper.toggle {
    z-index: 999999;
    background-color: rgba(0,0,0,0.8);
    width: 100%;
    height: 100%;
}

.zalo-chat-custom img {
    width: 40px;
    height: 40px;
}

.show-btn-wrapper.toggle .zalo-chat-custom-no-active {
    transform: scale(1);
    transform-origin: bottom right;
}

.show-btn-wrapper .float-button2 img {
    width: 48px;
    height: 48px;
}

.ak-info ul {
    list-style: none;
}

.welcome-text {
    font-size: 16px;
}

.empty-cart p {
    font-weight: 700;
}

.empty-cart span {
    font-weight: 700;
}

.show-btn-wrapper.toggle .zalo-chat-custom i {
    transform: rotate(225deg);
}

@-webkit-keyframes colorchange {
    0% {
        color: var(--background-static);
    }

    50% {
        color: var(--color-main);
    }

    100% {
        color: var(--background-static);
    }
}

.shake-shake,.zalo-chat-custom-no-active a:hover img,.btn-home-fix.toggle .home-cus-btn i {
    animation: shake 1s;
    animation-iteration-count: infinite;
}

@keyframes shake {
    0% {
        transform: translateX(0);
    }

    25% {
        transform: translateY(-5px);
    }

    35% {
        transform: translateY(-5px) rotate(10deg);
    }

    55% {
        transform: translateY(-5px) rotate(-10deg);
    }

    65% {
        transform: translateY(-5px) rotate(10deg);
    }

    75% {
        transform: translateY(-5px) rotate(-10deg);
    }

    100% {
        transform: translateY(0) rotate(0);
    }
}

/* About us */
.wrap-about-us {
    position: relative;
    overflow: hidden;
    padding: 50px 0;
    background: #FAFDFF;
}

.cols-about-us {
    display: flex;
    justify-content: space-between;
    align-items: start;
    flex-wrap: wrap;
    position: relative;
    z-index: 10;
}

.cols-about-us >div:nth-child(1) {
    width: 49%;
    position: relative;
}

.cols-about-us >div:nth-child(2) {
    position: relative;
    width: 49%;
    z-index: 2;
}

.cols-about-us >div:nth-child(3) {
    position: relative;
    width: 34%;
    z-index: 2;
}

.photo-about-us {
    position: relative;
    display: flex;
    justify-content: start;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.pic-about-us {
    display: inline-block;
    position: relative;
    z-index: 3 !important;
}

.pic-about-us:first-child {
}

.pic-about-us:first-child a {
    position: relative;
    z-index: 2;
}

.pic-about-us:last-child {
}

.pic-about-us:last-child a {
}

.pic-about-us a {
    padding: 0;
    position: relative;
    display: block;
}

.desc-about-us {
    font-size: 15px;
    color: #222;
}

.info-about-us {
    display: block;
    position: relative;
    text-align: left;
    z-index: 14;
    margin: auto;
}

.name-about-us {
    margin: 0;
    position: relative;
    font-size: 35px;
    text-transform: uppercase;
    font-family: 'RobotoBlack';
    color: #ED2228;
}

.title-about-us {
    margin-bottom: 15px;
    position: relative;
    z-index: 12;
    text-align: left;
}

.title-about-us p {
    margin: 0;
    font-size: 30px;
    color: #333;
    margin-bottom: 0px !important;
    font-family: 'SVN-Beloved';
}

.title-about-us span {
    color: #fff;
    text-transform: none;
    font-size: 15px;
    text-transform: uppercase;
    background: #008001;
    padding: 0px 10px;
    position: relative;
    display: block;
    margin-top: 12px;
    display: inline-block;
    display: inline-flex;
    justify-content: start;
    align-items: center;
    gap: 10px;
    animation: changeColor 1s infinite alternate;
}

@keyframes changeColor {
    0% {
        background: #008001;
    }

    100% {
        background: #BD000D;
    }
}

.move_picture:first-child {
    position: relative;
    animation: quayvong 6s infinite linear;
    display: inline-block;
}

.move_picture:last-child {
    position: absolute;
    right: 0px;
    top: 0px;
    z-index: 3;
    animation: quayvong2 6s infinite linear;
    display: inline-block;
}

/* Img Animation */
@keyframes quayvong {
    0% {
        transform: translate(0%,0%) rotate(0deg);
    }

    25% {
        transform: translate(10%,0%) rotate(-2deg);
    }

    50% {
        transform: translate(10%,10%) rotate(2deg);
        z-index: 3;
    }

    75% {
        transform: translate(0%,10%) rotate(-2deg);
        z-index: 3;
    }

    100% {
        transform: translate(0%,0%) rotate(0deg);
    }
}

@keyframes quayvong2 {
    0% {
        transform: translate(0%,0%) rotate(0deg);
    }

    25% {
        transform: translate(-10%,0%) rotate(2deg);
    }

    50% {
        transform: translate(-10%,-10%) rotate(-2deg);
        z-index: 1;
    }

    75% {
        transform: translate(0%,-10%) rotate(2deg);
        z-index: 1;
    }

    100% {
        transform: translate(0%,0%) rotate(0deg);
    }
}

.more {
    text-align: center;
    margin-top: 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: 'RobotoMedium';
    position: relative;
    z-index: 2;
}

.more a {
    transition: all 0.3s cubic-bezier(0.25,0.46,0.45,0.94) 0s;
    transition: all .6s;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    text-decoration: none;
    cursor: pointer;
    text-transform: uppercase;
    color: #fff;
    position: relative;
    font-size: 14px;
    padding: 5px;
    padding-left: 25px;
    border-radius: 100px;
    background: var(--color-main);
}

.more a:hover {
    color: #fff;
    background: #FFB502;
}

.view-more {
    margin-top: 20px;
    text-align: center;
}

.view-more a {
    font-size: 15px;
    text-transform: capitalize;
    text-decoration: none;
    background: #D5518D;
    padding: 10px 20px;
    color: #fff;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    border: solid 1px #D5518D;
    transition: all .4s;
}

.view-more a span {
    width: 35px;
    height: 35px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background: #fff;
}

.view-more a span i {
    color: #f00
}

.view-more a:hover span {
    background: linear-gradient(90deg,rgba(222,158,62,1) 0%,rgba(253,217,125,1) 25%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.view-more a:hover span i {
    color: #243c82
}

button.gioithieu-button {
    position: relative;
    padding: 10px 30px;
    text-align: center;
    display: block;
    overflow: hidden;
    border-radius: 100px;
}

button.gioithieu-button span {
    position: relative;
    color: #fff;
    z-index: 1;
    text-transform: capitalize;
}

button.gioithieu-button:hover span {
    color: #fff;
}

button.gioithieu-button > div {
    position: absolute;
    top: -80px;
    left: 0;
    width: 200px;
    height: 200px;
    background: var(--color-main);
    transition: 0.5s;
}

button.gioithieu-button > div::after,button.gioithieu-button > div::before {
    content: '';
    width: 200%;
    height: 200%;
    position: absolute;
}

button.gioithieu-button > div::before {
    border-radius: 45%;
    background: rgba(20,20,20,1);
    animation: animate_gioithieu_button 5s linear infinite;
}

button.gioithieu-button > div::after {
    border-radius: 40%;
    background: rgba(20,20,20,0.5);
    animation: animate_gioithieu_button 10s linear infinite;
}

button.gioithieu-button:hover > div {
    top: -150px;
}

@keyframes animate_gioithieu_button {
    0% {
        transform: translate(-50%,-75%) rotate(0deg);
    }

    100% {
        transform: translate(-50%,-75%) rotate(360deg);
    }
}

/* Criteria */
.wrap-criteria {
    position: relative;
    padding: 35px 0;
}

.box-criteria {
    display: block;
    position: relative;
    text-align: center;
}

.info-criteria {
    position: relative;
    z-index: 1;
    width: 75%;
}

.criteria-image {
    margin-bottom: 1rem;
    display: inline-block;
}

.info-criteria p {
    margin: 0;
    font-family: 'RobotoBold';
    position: relative;
    color: #ED2228;
    font-size: 20px;
    text-transform: uppercase;
}

.info-criteria span {
    color: #000;
    font-size: 14px;
    font-family: 'RobotoMedium';
}

.pic-criteria {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    /* overflow:hidden;*/
    position: relative;
}

.img-criteria {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 1;
}

.items-criteria {
    display: inline-flex;
    justify-content: start;
    align-items: start;
    gap: 10px;
    width: 32%;
}

/*.pic-criteria::before{position:absolute;content:'';width:103px;height:95px;left:50%;top:55%;transform:translate(-50%,-50%);background:#fff;z-index:-1;}
.cols-criteria .owl-stage .owl-item:nth-child(n+1) .pic-criteria::before{animation:liquid1 linear 4s infinite;}
.cols-criteria .owl-stage .owl-item:nth-child(2n+1) .pic-criteria::before{animation:liquid2 linear 4s infinite;}
.cols-criteria .owl-stage .owl-item:nth-child(3n+1) .pic-criteria::before{animation:liquid3 linear 4s infinite;}
@keyframes liquid1{0%{border-radius:19% 29% 26% 71% / 20% 29% 28% 69%;}
33%{border-radius:67% 29% 25% 9% / 79% 29% 43% 25%;}
66%{border-radius:16% 20% 77% 18% / 29% 22% 72% 33%;}
100%{border-radius:19% 29% 26% 71% / 20% 29% 28% 69%;}
}
@keyframes liquid2{0%{border-radius:67% 29% 25% 9% / 79% 29% 43% 25%;}
33%{border-radius:16% 20% 77% 18% / 29% 22% 72% 33%;}
66%{border-radius:19% 29% 26% 71% / 20% 29% 28% 69%;}
100%{border-radius:67% 29% 25% 9% / 79% 29% 43% 25%;}
}
@keyframes liquid3{0%{border-radius:16% 20% 77% 18% / 29% 22% 72% 33%;}
33%{border-radius:19% 29% 26% 71% / 20% 29% 28% 69%;}
66%{border-radius:67% 29% 25% 9% / 79% 29% 43% 25%;}
100%{border-radius:16% 20% 77% 18% / 29% 22% 72% 33%;}
}
*/
/* Feedback */
.slick-slideshow .slick-slide.slick-active:has(+ .slick-center) {
    transform: translateX(-13px);
    transition: 0.6s all;
}

.slick-slideshow .slick-slide.slick-current.slick-active.slick-center + .slick-slide {
    transform: translateX(13px);
}

.slick-slideshow .slick-slide.slick-current.slick-active.slick-center .box-feedback {
    transform: scale(1);
}

.slick-slideshow .slick-slide.slick-current.slick-active.slick-center .pic-feedback {
    position: relative;
    transition: 0.6s all;
}

.nextArr-c {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9;
    cursor: pointer;
}

.prevArr-c {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9;
    cursor: pointer;
}

.prevArr-c {
    left: -10%;
}

.nextArr-c {
    left: -20%;
}

.prevArr-c:hover {
    opacity: 1;
}

.nextArr-c:hover {
    opacity: 1;
}

.wrap-feedback {
    position: relative;
    padding-bottom: 50px;
}

.col-feedback {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.col-feedback >div:nth-child(1) {
    width: 60%;
}

.col-feedback >div:nth-child(2) {
    width: 38%;
    text-align: right;
    position: relative;
}

.box-feedback {
    position: relative;
    transition: all 0.6s;
    display: block;
    text-align: center;
    transition: ease 0.5s;
    padding-top: 0;
    margin: 0 10px;
}

.info-feedback {
    text-align: left;
    position: relative;
    width: 60%;
}

.info-feedback p {
    margin-bottom: 0px !important;
    position: relative;
    font-size: 16px;
    color: #9D0208;
    font-family: 'SVN-GilroyBold';
    text-transform: uppercase;
    background: linear-gradient(90deg,rgba(237,187,107,1) 0%,rgba(235,146,6,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.info-feedback span {
    color: #333;
    font-size: 15px;
}

.pic-feedback a {
    border-radius: 50%;
}

.pic-feedback {
    position: relative;
    z-index: 1;
    border-radius: 50%;
}

.desc-feedback {
    position: relative;
    text-align: left;
    color: #fff;
    line-height: 25px;
}

.video-clips {
    position: relative;
}

.slider_nav .video-clips {
    margin-right: 10px;
}

.slider_nav .video-clips:last-child {
    margin: 0;
}

.slider_nav .slick-track {
}

.title-feedback {
    text-align: left;
    margin-bottom: 1.5rem;
}

.title-feedback span {
    font-size: 30px;
    color: #322212;
    font-family: 'UTMNokia';
}

.title-feedback p {
    font-size: 15px;
    margin-bottom: -5px !important;
    color: #333;
}

.items-feedback {
    text-align: left;
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 15px;
}

.chatbox {
    text-align: center;
    right: 20px;
    top: -60px;
    margin: 0;
}

.cols-newsletter {
    display: block;
}

.form-newsletters {
    text-align: center;
}

.form .form-floating {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Album */
.wrap-album {
    position: relative;
    padding: 50px 0;
    background: linear-gradient(180deg,rgba(157,2,8,0) 50%,rgba(157,2,8,1) 100%);
}

.box-album {
    padding: 10px;
    border-radius: 10px;
    background: #fff;
    display: block;
}

.img-album {
    display: inline-flex !important;
    position: relative;
    background: #000;
    overflow: hidden;
    border-radius: 15px;
}

.img-album img {
    display: block;
}

.info-album {
    display: none;
    position: absolute;
    z-index: 10;
    text-align: center;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    padding: 15px;
    background-image: linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,0.9999999999999999) 100%);
}

.info-album h3 {
    font-size: inherit;
    margin: 0;
}

.name-album {
    color: #fff;
    font-size: 20px;
    text-transform: capitalize;
    text-decoration: none;
    cursor: pointer;
    font-family: 'MontserratBold';
    transition: all .3s !important;
}

.name-album:hover {
    color: var(--color-main);
}

.img-album:hover img {
    /* opacity:.6 */
}

.photo-album {
    position: relative;
    /* overflow:hidden;*/
    z-index: 1;
    display: flex;
}

.photo-album:hover .info-album {
    display: block;
    -webkit-animation: tracking-in-expand-fwd .8s cubic-bezier(0.215,0.610,0.355,1.000) both;
    animation: tracking-in-expand-fwd .8s cubic-bezier(0.215,0.610,0.355,1.000) both
}

@-webkit-keyframes tracking-in-expand-fwd {
    0% {
        letter-spacing: -.5em;
        -webkit-transform: translateZ(-700px);
        transform: translateZ(-700px);
        opacity: 0
    }

    40% {
        opacity: .6
    }

    100% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

@keyframes tracking-in-expand-fwd {
    0% {
        letter-spacing: -.5em;
        -webkit-transform: translateZ(-700px);
        transform: translateZ(-700px);
        opacity: 0
    }

    40% {
        opacity: .6
    }

    100% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        opacity: 1
    }
}

.album-page {
    float: left;
    width: 32%;
    margin: 0 2% 2% 0;
}

.album-page:nth-child(3n+1) {
    clear: both;
}

.album-page:nth-child(3n) {
    margin-right: 0px;
}

.info-album-page {
    text-align: center;
    padding-top: 10px;
}

.info-album-page h3 {
    font-size: inherit;
}

.name-album-page {
    font-family: 'RobotoBold';
    font-size: 16px;
    text-transform: capitalize;
    color: #000;
    transition: all .3s;
}

.name-album-page:hover {
    color: #f00;
}

.cols-album {
    position: relative;
    display: grid;
    justify-content: center;
    align-items: center;
    gap: 20px;
}

.album-main {
    float: left;
    width: 32%;
    margin: 0 2% 2% 0;
}

.album-main:nth-child(3n+1) {
    clear: both;
}

.album-main:nth-child(3n) {
    margin-right: 0px;
}

/* Service */
.wrap-service {
    position: relative;
}

.pic-service {
    display: block;
    justify-content: center;
    align-items: center;
    text-align: center;
    position: relative;
}

.img-service img {
    display: block;
}

.box-service {
    position: relative;
    text-align: center;
    display: block;
    transition: ease 0.5s;
}

.items-service {
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 10px;
    margin-bottom: 1rem;
}

.pic-service a {
    overflow: hidden;
    position: relative;
    position: relative;
    z-index: 2;
    display: block;
}

.info-service {
    text-align: left;
    transition: 0.5s;
    position: relative;
}

.info-service h3 {
    font-size: inherit;
    display: block;
    position: relative;
    margin-bottom: 0px !important;
}

.name-service {
    text-decoration: none;
    transition: all 0.3s cubic-bezier(0.25,0.46,0.45,0.94) 0s;
    font-size: 20px;
    font-family: 'SVN-GilroyBold';
    color: #fff;
    text-transform: uppercase;
    background: linear-gradient(90deg,rgba(237,187,107,1) 0%,rgba(235,146,6,1) 100%);
    padding: 20px 15px;
}

.name-service:hover {
    color: var(--color-main);
    letter-spacing: 0.25px;
}

.desc-service {
    font-size: 14px;
    color: #363533;
    text-align: left;
    line-height: 30px;
}

.service {
    float: left;
    width: 23.5%;
    margin: 0 2% 2% 0;
}

.service:nth-child(4n+1) {
    clear: both;
}

.service:nth-child(4n) {
    margin-right: 0px;
}

.cols-service {
    display: flex;
    justify-content: space-between;
    align-items: end;
    margin-bottom: 7%;
}

.cols-service >div:nth-child(1) {
    width: 45%;
    margin-right: -12%;
}

.cols-service >div:nth-child(2) {
    width: 67%;
}

.service-index {
    position: relative;
    text-align: center;
    margin-top: -7%;
}

/* Product */
.wrap-product {
}

.wrap-product:nth-child(2n) {
}

.box-product {
    position: relative;
    text-align: center;
    transition: all .5s;
    border: solid 1px #D8D8D8;
}

.pic-product {
    position: relative;
    margin-bottom: 0;
}

.pic-product img {
    width: 100%;
}

.info-product {
}

.name-product {
    font-size: 15px;
    color: #494949;
    text-transform: capitalize;
    height: 36px;
    font-family: 'SVN-GilroyMedium';
    transition: all .5s
}

.name-product:hover {
    color: var(--color-main);
}

.price-product {
    margin-bottom: 0px;
    display: flex;
    justify-content: center;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 3px;
    text-align: left;
}

.price-title {
    font-size: 14px;
    color: var(--color-gray);
}

.price-hotline {
    font-size: 15px;
    color: var(--color-red);
    font-weight: 700;
}

.price-product b {
    color: #fff;
    font-family: 'MontserratRegular';
}

.price-new {
    position: relative;
    color: #EA0000;
    font-size: 16px;
    text-transform: capitalize;
    font-family: 'SVN-GilroyBold';
}

.price-new:hover {
    color: var(--color-main);
}

.price-old {
    color: #7C7C7C;
    text-decoration: line-through;
    font-size: 13px;
    padding-left: 5px;
}

.price-per {
    position: absolute;
    top: 15px;
    right: 15px;
    color: #fff1db;
    background: url(../images/sale-pro.webp)no-repeat;
    background-size: 100% 100%;
    font-size: 13px;
    width: 55px;
    height: 25px;
    font-family: 'RobotoBold';
    text-align: center;
    display: inline-flex;
    display: grid;
    justify-content: center;
    align-items: center;
    text-transform: capitalize;
    padding-left: 3%;
}

.pic-product a {
    display: block;
}

/* hover 7 color */
.box-product .i_left {
    position: absolute;
    height: 0;
    width: 1px;
    left: 0;
    top: 0;
    background: -webkit-linear-gradient(bottom,red,orange,yellow,green,blue,indigo,violet);
    background: -o-linear-gradient(bottom,red,orange,yellow,green,blue,indigo,violet);
    background: -webkit-gradient(linear,left bottom,left top,from(red),color-stop(orange),color-stop(yellow),color-stop(green),color-stop(blue),color-stop(indigo),to(violet));
    background: linear-gradient(to top,red,orange,yellow,green,blue,indigo,violet);
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease
}

.box-product .i_right {
    position: absolute;
    height: 0;
    width: 1px;
    right: 0;
    bottom: 0;
    background: -webkit-linear-gradient(top,red,orange,yellow,green,blue,indigo,violet);
    background: -o-linear-gradient(top,red,orange,yellow,green,blue,indigo,violet);
    background: -webkit-gradient(linear,left top,left bottom,from(red),color-stop(orange),color-stop(yellow),color-stop(green),color-stop(blue),color-stop(indigo),to(violet));
    background: linear-gradient(to bottom,red,orange,yellow,green,blue,indigo,violet);
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease
}

.box-product .i_top {
    position: absolute;
    height: 1px;
    width: 0;
    right: 0;
    top: 0;
    background: -webkit-linear-gradient(left,red,orange,yellow,green,blue,indigo,violet);
    background: -o-linear-gradient(left,red,orange,yellow,green,blue,indigo,violet);
    background: -webkit-gradient(linear,left top,right top,from(red),color-stop(orange),color-stop(yellow),color-stop(green),color-stop(blue),color-stop(indigo),to(violet));
    background: linear-gradient(to right,red,orange,yellow,green,blue,indigo,violet);
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease
}

.box-product .i_bottom {
    position: absolute;
    height: 1px;
    width: 0;
    left: 0;
    bottom: 0;
    background: -webkit-linear-gradient(right,red,orange,yellow,green,blue,indigo,violet);
    background: -o-linear-gradient(right,red,orange,yellow,green,blue,indigo,violet);
    background: -webkit-gradient(linear,right top,left top,from(red),color-stop(orange),color-stop(yellow),color-stop(green),color-stop(blue),color-stop(indigo),to(violet));
    background: linear-gradient(to left,red,orange,yellow,green,blue,indigo,violet);
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease
}

.box-product:hover .i_left {
    height: 100%;
    bottom: 0;
    top: inherit
}

.box-product:hover .i_top {
    width: 100%;
    left: 0
}

.box-product:hover .i_right {
    height: 100%;
    top: 0;
    bottom: inherit
}

.box-product:hover .i_bottom {
    width: 100%;
    right: 0;
    left: inherit
}

/* Product Tool */
.product-tool {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    width: 100%;
    left: 0px;
    bottom: 15px;
    z-index: 1;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-evenly;
}

.product-tool a {
    cursor: pointer;
    padding: 7px 15px;
    font-size: 12px;
    text-align: center;
    color: #ffffff;
    background: #025738;
    border-radius: 30px;
    box-shadow: #00000050 1px 1px 2px 1px;
    margin-bottom: 5px;
    transition: all ease 0.4s;
    border-radius: 5px !important;
}

.product-tool a:hover {
    background-color: #FF9700;
}

.box-product:hover .product-tool {
    opacity: 1;
    visibility: visible;
}

.popupProduct .modal-lg,.modal-xl {
    max-width: 85% !important;
}

/* Hover box after */
.box {
    position: relative;
    transition: 0.5s;
    -webkit-transition: 0.5s;
}

.box:hover::after,.box:hover::before {
    -webkit-transform: scale(1);
}

.box:hover .text-split1 {
    padding-top: 10px;
    transition: 0.5s;
    -webkit-transition: 0.5s;
}

.foo {
    position: relative;
}

.foo::after {
    position: absolute;
    border-radius: 10px;
    border-bottom: 2px solid var(--color-main);
    border-left: 2px solid var(--color-main);
    -webkit-transform-origin: 0 100%;
    width: 100%;
    height: 100%;
    z-index: 1;
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    box-sizing: border-box;
    -webkit-transform: scale(0);
    transition: 0.5s;
    pointer-events: none;
}

.foo::before {
    position: absolute;
    border-radius: 10px;
    border-top: 2px solid var(--color-main);
    border-right: 2px solid var(--color-main);
    -webkit-transform-origin: 100% 0%;
    width: 100%;
    height: 100%;
    z-index: 1;
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    box-sizing: border-box;
    -webkit-transform: scale(0);
    transition: 0.5s;
    pointer-events: none;
}

.shadow-product {
    position: relative;
    /* margin:5px 5px 20px 5px;*/
    /* box-shadow:0px 4.226415157318115px 15.8490571975708px 0px rgba(0,0,0,0.10);*/
    transition: .4s;
    /* overflow:hidden;*/
}

.shadow-product:hover {
    box-shadow: rgba(14,30,37,0.12) 0px 2px 4px 0px,rgba(14,30,37,0.32) 0px 2px 16px 0px;
    transform: scale(1.02);
}

.shadow-product2 {
    -webkit-box-shadow: 0 0 35px rgba(17,44,145,.1);
    -moz-box-shadow: 0 0 35px rgba(17,44,145,.1);
    box-shadow: 0 0 35px rgba(17,44,145,.1);
}

.shadow-product2:hover {
    -webkit-box-shadow: 0 0 10px rgba(17,44,145,.4);
    -moz-box-shadow: 0 0 10px rgba(17,44,145,.4);
    box-shadow: 0 0 10px rgba(17,44,145,.4)
}

.price-new span {
    color: #fff;
    font-size: 20px;
}

.price-old span {
    color: #7C7C7C;
    font-size: 20px;
}

.box-top-shadow:hover {
    box-shadow: 0 4px 4px rgb(0 0 0 / 15%);
    transform: translateY(-10px)
}

.title-product-cat {
    list-style: none;
    padding: 0;
    margin: 0;
    z-index: 2;
    position: relative;
    white-space: nowrap;
    width: 84%;
    height: auto;
    flex-wrap: nowrap;
    overflow-x: scroll;
    overflow-y: hidden;
    padding-bottom: 7px;
}

.title-product-cat li {
    display: inline-block;
    margin-right: 10px;
}

.title-product-cat::-webkit-scrollbar {
    height: 5px;
}

.title-product-cat::-webkit-scrollbar-track {
}

.title-product-cat::-webkit-scrollbar-thumb {
    background-color: #26170C;
}

.title-product-cat li a {
    cursor: pointer;
    display: inline-block;
    text-align: center;
    font-size: 15px;
    text-transform: capitalize;
    color: #2F4858 !important;
    font-family: 'RobotoMedium';
    transition: all 0.3s;
    position: relative;
}

.title-product-cat li.active a,.title-product-cat li a:hover {
    transition: all ease 0.4s;
    color: #2E3A90 !important;
}

/* .title-product-cat li a::before{position:absolute;content:'';width:100%;height:2px;background-color:#FFB0BD;border-radius:5px;left:0px;bottom:-8px;transform-origin:right;transform:scaleX(0);transition:transform 0.5s;}
.title-product-cat li:hover > a::before{transform-origin:left;transform:scaleX(1);}
*/
.title-product-cat li > a.active::before {
    transform-origin: left;
    transform: scaleX(1);
}

.title-product-cat li.active a::before {
    transform-origin: left;
    transform: scaleX(1);
}

.title-product-list {
    list-style: none;
    margin: 0;
    padding: 0;
    z-index: 10;
    position: relative;
    /* white-space:nowrap;*/
    /* display:grid;*/
    justify-content: start;
    align-items: center;
    gap: 15px;
    flex-wrap: wrap;
    border: solid 1px #D0D0D0;
    border-top: none;
}

.title-product-list li {
    display: block;
    text-align: left;
    position: relative;
    z-index: 1;
    cursor: pointer;
    width: 100%;
}

.title-product-list li a {
    cursor: pointer;
    text-align: center;
    font-size: 15px;
    color: #333 !important;
    transition: all 0.3s;
    font-family: 'SVN-GilroyMedium';
    display: flex;
    justify-content: start;
    align-items: center;
    text-transform: uppercase;
    gap: 10px;
    width: 100%;
    padding: 10px;
    border-bottom: dashed 1px #D0D0D0;
}

.title-product-list li.active a,.title-product-list li a:hover {
    transition: all ease 0.4s;
    color: var(--color-main) !important;
}

/*.title-product-list li a::before{position:absolute;content:'';width:100%;height:2px;background-color:#FCDD2E;border-radius:5px;left:0px;bottom:-8px;transform-origin:right;transform:scaleX(0);transition:transform 0.5s;}
.title-product-list li:hover > a::before{transform-origin:left;transform:scaleX(1);}
.title-product-list li > a.active::before{transform-origin:left;transform:scaleX(1);}
.title-product-list li.active a::before{transform-origin:left;transform:scaleX(1);}
*/
.product {
    float: left;
    width: 32%;
    margin: 0 2% 2% 0;
}

.product:nth-child(3n+1) {
    clear: both;
}

.product:nth-child(3n) {
    margin-right: 0px;
}

.wrap-product {
    position: relative;
    padding: 50px 0;
}

.desc-product {
    font-size: 14px;
    margin: 15px 0;
    color: #646464;
    line-height: 25px;
}

.img-product {
    display: block;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.product_aos.aos-init.aos-animate {
    transition-duration: unset !important;
    animation: scale-in-center .5s cubic-bezier(.25,.46,.45,.94) both
}

@keyframes scale-in-center {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
        opacity: 1
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }
}

.wrap-product-hot {
    position: relative;
    text-align: center;
    padding: 50px 0;
}

.info-product {
    text-align: center;
    padding-top: 10px;
    padding: 10px;
}

.info-product h3 {
    font-size: inherit;
    margin-bottom: 5px !important;
    position: relative;
}

.control-product button {
}

.control-product button.owl-prev {
    left: -4%;
}

.control-product button.owl-next {
    right: -4%;
}

.control-product button {
    background: none;
    opacity: 0.5;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: solid 2px #000;
}

.control-product button svg {
    stroke: #000;
}

.control-product button:hover svg {
    stroke: #042552;
}

.control-product img {
    transform: scale(0.65);
}

.control-product-hot button {
    background-color: transparent;
    color: #222222;
    opacity: 1;
    width: 60px;
    font-size: 23px;
    border: none;
}

.control-product-hot button:hover {
    opacity: 0.7;
}

.control-product-hot button.owl-prev {
    left: -50px;
}

.control-product-hot button.owl-next {
    right: -51px;
}

.product-index {
    text-align: center;
    position: relative;
}

/* News */
.wrap-newsnb {
    position: relative;
    padding: 50px 0;
}

.box-newsnb {
    display: block;
    position: relative;
    transition: .5s ease;
    text-align: center;
}

.info-newsnb {
}

.info-newsnb h3 {
    font-size: inherit;
    margin-bottom: 5px !important;
    position: relative;
}

.name-newsnb {
    transition: 0.3s;
    position: relative;
    color: #000;
    font-size: 17px;
    border-radius: 0 !important;
    font-family: 'SVN-GilroyMedium';
    text-transform: uppercase;
}

.name-newsnb:hover {
    color: var(--color-main) !important;
}

.cols-news-hot {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: start;
    gap: 10px;
}

.cols-news-hot >div:nth-child(1) {
    width: 49%;
    position: relative;
}

.cols-news-hot >div:nth-child(2) {
    width: 49%;
    position: relative;
    z-index: 1;
}

.desc-newsnb {
    color: #787878;
    font-size: 14px;
}

.img-newsnb {
    display: block;
    z-index: 1;
}

.items-newsnb {
    display: flex !important;
    justify-content: start;
    align-items: center;
    gap: 15px;
    position: relative;
    width: auto !important;
    border: solid 1px #C0B9A3;
    border-radius: 10px;
    padding: 10px;
}

.pic-newsnb {
    position: relative;
}

.pic-newsnb a {
    position: relative;
}

.info-newsnb {
    transition: .5s ease;
    text-align: left;
    background: #F2F2F2;
    width: 90%;
    margin: auto;
    padding: 20px;
    margin-top: -15%;
    position: relative;
    z-index: 2;
}

.items-newsnb .info-newsnb {
    padding: 0;
    text-align: left;
    width: 60%;
}

.time-newsnb {
    gap: 0px;
    display: flex;
    justify-content: end;
    align-items: center;
    text-align: center;
    margin-top: -12%;
    margin-bottom: 5%;
}

.time-newsnb p {
    margin: 0;
    font-size: 25px;
    color: #fff;
    font-family: 'UTMNokia';
    margin-bottom: 0px !important;
    position: relative;
    line-height: 1;
    background: linear-gradient(90deg,rgba(237,187,107,1) 0%,rgba(235,146,6,1) 100%);
    padding: 10px;
}

.time-newsnb span {
    color: #fff;
    text-transform: uppercase;
    display: inline-block;
    font-family: 'SVN-GilroyBold';
    display: grid;
    background: #322212;
    font-size: 15px;
    padding: 0px 6px;
}

.view-news {
    position: relative;
    margin-top: 5px;
    text-align: left;
}

.view-news a {
    transition: all 0.3s cubic-bezier(0.25,0.46,0.45,0.94) 0s;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
    text-decoration: none;
    cursor: pointer;
    font-size: 14px;
    color: #222;
    text-transform: capitalize;
    color: #2B2B2B;
    position: relative;
}

.view-news a:hover {
    color: var(--color-main);
    letter-spacing: 0.25px;
}

.news {
    float: left;
    width: 32%;
    margin: 0 2% 2% 0;
}

.news:nth-child(3n+1) {
    clear: both;
}

.news:nth-child(3n) {
    margin-right: 0px;
}

.news-slick {
    margin-bottom: 5%;
    border: none !important;
}

/* News Page */
.box-news-page {
    display: block;
    position: relative;
    transition: 0.5s;
}

.info-news-page {
    text-align: left;
    padding-top: 10px;
}

.name-news-page {
    font-size: inherit;
    position: relative;
    margin-bottom: 15px !important;
}

.name-news-page a {
    transition: 0.3s;
    font-size: 16px;
    color: #000;
    text-transform: capitalize;
    font-family: 'RobotoBold';
}

.name-news-page a:hover {
    color: var(--color-main) !important;
}

.pic-news-page {
    position: relative;
}

.pic-news-page a {
    border-radius: 10px;
}

.view-news-page a {
    position: relative;
    transition: all 0.5s;
    color: var(--color-main);
    text-decoration: none;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
    text-transform: capitalize;
    font-family: 'RobotoBold';
}

.view-news-page a:hover {
    color: #f00;
}

.view-news-page {
    margin-top: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: solid 1px #D9D9D9;
    padding-top: 10px;
}

.cols-news {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 10px;
    flex-wrap: wrap;
}

.cols-news >div:nth-child(1) {
    width: 280px;
    position: sticky;
    top: 50px;
}

.cols-news >div:nth-child(2) {
    width: calc(100% - 300px)
}

/* Form */
.wrap-form {
    position: relative;
    padding-top: 50px;
}

.col-form {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}

.col-form >div:nth-child(1) {
    width: 60%;
}

.col-form >div:nth-child(2) {
    width: 40%;
    display: block;
    z-index: 1;
}

.title-form {
    text-align: center;
    position: relative;
    margin-bottom: 1.5rem;
}

.title-form p {
    margin: 0;
    font-size: 18px;
    text-transform: uppercase;
    color: #322212;
    position: relative;
    font-family: 'UTMNokia';
}

.title-form span {
    display: inline-block;
    color: #fff;
    font-size: 15px;
    margin: auto;
}

.newsletter-input {
    position: relative;
}

.newsletter-input .form-control {
    height: calc(1em + 1.5rem + 8px);
    color: #fff;
    background: #ffffff00;
    border: none;
    border-radius: 0px;
    border-bottom: solid 1px #fff;
}

.newsletter-input textarea {
    height: 100px !important;
}

.newsletter-input i {
    position: absolute;
    right: 2%;
    top: 35%;
}

.newsletter-input textarea::-webkit-input-placeholder,.newsletter-input input::-webkit-input-placeholder {
    color: #fff;
}

.newsletter-input textarea:-moz-placeholder,.newsletter-input input:-moz-placeholder {
    color: #fff;
}

.newsletter-input textarea::-moz-placeholder,.newsletter-input input::-moz-placeholder {
    color: #fff;
}

.newsletter-input textarea:-ms-input-placeholder,.newsletter-input input:-ms-input-placeholder {
    color: #fff;
}

.newsletter-button {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 15px;
    gap: 15px;
    flex-wrap: wrap;
}

.newsletter-button input {
    font-size: 14px;
    text-transform: uppercase;
    color: #fff;
    border: none;
    padding: 15px 7%;
    font-family: 'RobotoMedium';
    transition: all 0.5s;
    font-size: 15px;
}

.newsletter-button [type=submit] {
    background: #322212;
    color: var(--color-main);
    border-radius: 5px
}

.newsletter-button [type=rest] {
}

.newsletter-button:hover input {
}

.newsletter-button:hover:before {
    -webkit-animation: moveArrow 1500ms;
    animation: moveArrow 1500ms;
}

.form .form-floating.form-floating-cus>input,.form .form-floating-cus>select {
    border: none;
    border-radius: 0px;
    color: #000;
    background: none;
    border-radius: 0px;
    height: 50px;
    background: none;
    font-size: 14px;
    background: #fff;
    /* box-shadow:0 2px 1px #6C5948;*/
}

.form .form-floating.form-floating-cus>textarea {
    height: calc(1em + 1.5rem + 8px);
    height: 114px;
    background: none;
    color: #000;
    border: none;
    border-radius: 0px;
    background: #fff;
    /* box-shadow:0 2px 1px #6C5948;*/
}

.form .newsletter-input {
    width: 100%;
    margin-bottom: 1%;
}

.items-newsletter .newsletter-input {
    width: calc(50% - 5px);
}

.form {
    position: relative;
    z-index: 3;
    margin: auto;
    text-align: center;
    background: linear-gradient(90deg,rgba(237,187,107,1) 0%,rgba(235,146,6,1) 100%);
    padding: 27px 25px;
}

.form .newsletter-textarea {
    position: relative;
    width: 100%;
}

.form .newsletter-input label {
    color: #525252;
}

.form .newsletter-textarea label {
    color: #525252;
}

.cols-form {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap: 0px;
    flex-wrap: wrap;
}

.cols-form >div:nth-child(1) {
    width: 65%;
    position: relative;
    text-align: left;
}

.cols-form >div:nth-child(2) {
    width: 35%;
    position: relative;
}

/* Partner */
.partner-index {
    position: relative;
}

.control-partner button {
    background-color: transparent;
    color: #222222;
    border-radius: 50%;
    border: solid 1px #333;
    opacity: 1;
    width: 35px;
    height: 35px;
    font-size: 14px;
}

.control-partner button svg {
    stroke: #000;
}

.control-partner button:hover {
    opacity: 0.7;
}

.control-partner button.owl-prev {
    left: -40px;
}

.control-partner button.owl-next {
    right: -40px;
}

.wrap-partner {
    padding: 50px 0;
    position: relative;
    background: #F5F5F5;
}

.wrap-partner .wrap-content {
    position: relative;
}

.partner {
    display: block;
    margin: 0px auto;
    border: solid 1px #CACACA;
}

/* Title Main */
.title-main {
    margin-bottom: 1.5rem;
    text-align: center;
    position: relative;
}

.title-main span,.title-main h1 {
    position: relative;
    font-size: 35px;
    text-transform: uppercase;
    font-family: 'RobotoBlack';
    color: #322212;
    width: 100%;
    display: inline-block;
}

.title-slogan {
    font-size: 25px !important;
    color: #fff;
    position: relative;
    font-family: 'RobotoBold';
    text-transform: uppercase;
}

.title-main p {
    margin-bottom: 0;
    font-size: 14px;
}

/* Text Hide */
.text-split {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 3;
}

.split1 {
    -webkit-line-clamp: 1 !important;
}

.split2 {
    -webkit-line-clamp: 2 !important;
}

.split3 {
    -webkit-line-clamp: 3 !important;
}

.split4 {
    -webkit-line-clamp: 4 !important;
}

.split5 {
    -webkit-line-clamp: 5 !important;
}

.split6 {
    -webkit-line-clamp: 6 !important;
}

.split7 {
    -webkit-line-clamp: 7 !important;
}

.split8 {
    -webkit-line-clamp: 8 !important;
}

/*============move scroll================*/
.scroll-down {
    position: absolute;
    left: 50%;
    bottom: 20px;
    transform: translateX(-50%);
    text-align: center;
    z-index: 50;
}

.scroll-down .circle {
    display: block;
    width: 24px;
    height: 42px;
    box-shadow: inset 0 0 0 1px #fff;
    border-radius: 32px;
    margin: 0 auto 10px;
    position: relative;
}

.scroll-down .circle:before {
    content: '';
    width: 6px;
    height: 6px;
    background: #fff;
    margin-left: -4px;
    top: 8px;
    border-radius: 4px;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-name: scrollDown;
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateY(8px);
    margin-left: -3px;
}

.scroll-down .txt {
    display: block;
    font-size: 10px;
    color: #fff;
    font-weight: bold;
}

.nav-slider-dev {
    position: absolute;
    right: 135px;
    bottom: 45px;
    display: inline-block;
    width: 60px;
    height: 60px;
    cursor: default;
    z-index: 1;
    background-image: url(assets/img/mv_num.png);
}

.current-slider,.total-slider-slider {
    position: relative;
    top: -2px;
    height: 30px;
    width: 100%;
    font-family: 'Rubik',sans-serif;
    font-weight: 300;
    font-size: 16px;
    letter-spacing: -0.03em;
    color: #fff;
}

.total-slider-slider {
    text-align: right;
    top: 4px;
    opacity: 0.5;
}

@keyframes scrollDown {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0;
        transform: translateY(30px);
    }
}

/*============move scroll================*/
/* video much */
.video-main {
    position: relative;
    height: 345px;
}

.video-main iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
}

.listvideos {
    width: 100%;
    height: 40px;
    padding: 0px 10px;
    border: 1px solid #fff;
    color: #000;
    margin-top: 5px;
    cursor: pointer;
    font-family: 'MontserratBold';
}

.pic-video {
    position: relative;
    cursor: pointer;
}

.pic-video:before {
    content: "";
    position: absolute;
    width: 50px;
    height: 35px;
    top: calc(50% - 50px / 2);
    left: calc(50% - 35px / 2);
    z-index: 1;
    background: url(../images/play.png) no-repeat center center;
    cursor: pointer;
    background-size: cover;
}

.pic-video img {
    width: 100%;
}

.pic-video-2 {
    position: relative;
    cursor: pointer;
}

.pic-video-2:before {
    content: "";
    position: absolute;
    width: 50px;
    height: 35px;
    top: calc(50% - 50px / 2);
    left: calc(50% - 35px / 2);
    z-index: 1;
    background: url(../images/play.png) no-repeat center center;
    cursor: pointer;
    background-size: cover;
}

.pic-video-2 img {
    width: 100%;
}

.name-video {
    font-size: 16px;
    color: var(--color-dark);
    margin-bottom: 0px;
}

.owl-video {
    margin-top: 10px;
}

div#video-select {
    padding: 25px;
    background: #F6C20B;
    border-radius: 20px;
}

/* Video */
.video {
    cursor: pointer;
    margin-bottom: 1rem;
}

.video .video-image {
    position: relative;
    margin-bottom: 0.75rem;
}

.video-clips {
    position: relative;
}

.video-clips .video-image {
    cursor: pointer;
}

.video .video-image:before {
    content: "";
    position: absolute;
    width: 50px;
    height: 35px;
    top: calc(50% - 50px / 2);
    left: calc(50% - 35px / 2);
    z-index: 1;
    background-repeat: no-repeat;
    background-image: url(../images/play.png);
}

.video .video-name {
    text-align: center;
    font-size: 16px;
    color: #212529;
    margin-bottom: 0px;
}

.play-btn::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translateX(-40%) translateY(-50%);
    transform: translateX(-40%) translateY(-50%);
    transform-origin: center center;
    width: 0;
    height: 0;
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-left: 25px solid #fff;
    z-index: 100;
    -webkit-transition: all 400ms cubic-bezier(0.55,0.055,0.675,0.19);
    transition: all 400ms cubic-bezier(0.55,0.055,0.675,0.19);
}

.playboy {
    position: absolute;
    cursor: pointer;
    height: 100%;
    width: 100%;
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
}

.play-btn {
    width: 100px;
    height: 100px;
    background: radial-gradient( rgba(255,255,255,0.8) 60%,rgba(255,255,255,1) 62%);
    border-radius: 50%;
    position: relative;
    display: block;
    margin: 100px auto;
    box-shadow: 0px 0px 25px 3px rgba(255,255,255,0.8);
}

.play-btn:before {
    content: "";
    position: absolute;
    width: 150%;
    height: 150%;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
    -webkit-animation: pulsate1 2s;
    animation: pulsate1 2s;
    -webkit-animation-direction: forwards;
    animation-direction: forwards;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: steps;
    animation-timing-function: steps;
    opacity: 1;
    border-radius: 50%;
    border: 5px solid rgba(255,255,255,.75);
    top: -25%;
    left: -25%;
    background: rgba(198,16,0,0);
}

@-webkit-keyframes pulsate1 {
    0% {
        -webkit-transform: scale(0.6);
        transform: scale(0.6);
        opacity: 1;
        box-shadow: inset 0px 0px 25px 3px rgba(255,255,255,0.75),0px 0px 25px 10px rgba(255,255,255,0.75);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: 0;
        box-shadow: none;
    }
}

@keyframes pulsate1 {
    0% {
        -webkit-transform: scale(0.6);
        transform: scale(0.6);
        opacity: 1;
        box-shadow: inset 0px 0px 25px 3px rgba(255,255,255,0.75),0px 0px 25px 10px rgba(255,255,255,0.75);
    }

    100% {
        -webkit-transform: scale(1,1);
        transform: scale(1);
        opacity: 0;
        box-shadow: none;
    }
}

/* Transition All */
.transition,.control-owl button,.carousel-comment-media .carousel-control a span,.menu ul li a.has-child:after,.menu ul li ul,.menu ul li:hover > ul,.scale-img img,.scale-img:hover > img,.btn-frame .kenit-alo-circle-fill,.support-online .kenit-alo-circle-fill {
    -webkit-transition: 0.3s all;
    transition: 0.3s all;
}

/* Scale IMG */
.scale-img {
    display: block;
    overflow: hidden;
    position: relative;
    transition: box-shadow 0.3s ease-in-out;
}

.scale-img:hover {
    box-shadow: 0px 1px 1px rgba(0,0,0,0.3);
}

.scale-img img {
    width: 100%;
    height: auto;
    transform: scale(1) rotate(0deg);
    transition: transform 0.6s ease-in-out;
}

.scale-img:hover img {
    transform: scale(1.1) rotate(1deg);
    transition: transform 0.6s ease-in-out;
}

.scale-img img {
    transition: transform 1s ease-in-out;
}

/* scrollToTop */
.scrollToTop {
    width: 41px;
    height: 41px;
    text-align: center;
    font-weight: bold;
    color: #444;
    text-decoration: none;
    position: fixed;
    bottom: 65px;
    right: 25px;
    display: none;
    z-index: 10;
    cursor: pointer;
}

/* Hidden Google Captcha */
.grecaptcha-badge {
    display: none !important;
    width: 0px !important;
    height: 0px !important;
    visibility: hidden !important;
    overflow: hidden;
}

[x-cloak] {
    display: none !important;
}

/* Google translate */
body {
    top: 0 !important
}

body .skiptranslate {
    display: none !important;
}

#google_language_translator {
    width: auto !important;
    display: none;
}

.goog-te-gadget .goog-te-combo {
    margin: 4px 0px !important;
}

.goog-tooltip {
    display: none !important;
}

.goog-tooltip:hover {
    display: none !important;
}

.goog-text-highlight {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.glt-clear {
    height: 0px;
    clear: both;
    margin: 0px;
    padding: 0px;
}

.langCon {
    position: absolute;
    top: 5px;
    right: 10px;
    z-index: 100;
}

#flags a {
    height: 20px;
    display: inline-block;
}

/* Danh Muc */
/* Page menu */
.hdanhmucdrops {
    position: relative;
    width: 100%;
    z-index: 19;
    background-color: #fff;
    padding: 10px;
}

.hdanhmucdrops > .nicescl {
    top: 100%;
    position: relative;
}

.fixed .hdanhmucdrops > .nicescl,.hdanhmucdrops.ver1 > .nicescl {
    display: none;
    top: 100%
}

.fixed .hdanhmucdrops:hover .nicescl {
    display: block;
}

.hdanhmucdrops.ver1 > .nicescl {
    display: none;
    top: 100%
}

.hdanhmucdrops .title {
    display: block;
    height: 100%;
    cursor: pointer;
    font-size: 18px;
    text-transform: uppercase;
    text-align: center;
    color: #000;
    text-decoration: none;
    font-family: 'RobotoMedium';
}

.click-icon-menu {
    height: 100%;
    margin-bottom: 0px;
}

.click-icon-menu > span i:nth-child(1) {
    position: unset;
}

.click-icon-menu span {
    justify-content: start !important;
    height: 100%;
    width: 100%;
    gap: 5px;
}

.click-icon-menu span i {
    /* margin-right:10px;*/
    /* margin-top:-4px;*/
    position: relative;
    color: #000;
}

.hdanhmucdrops ul {
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: left;
}

.hdanhmucdrops ul > li {
    padding: 0 2% 0% 2%;
}

.hdanhmucdrops ul > li.line {
    border-bottom: solid 1px #E7E7E7 !important;
    width: 95%;
    margin: 0 auto;
}

.hdanhmucdrops .nicescl {
    position: absolute;
    box-sizing: border-box;
    width: 100%;
    height: 415px;
    left: 0px;
    top: 100%;
    background: #fff;
    margin: auto;
    margin-top: 0px;
    padding-top: 0px;
    border: solid 1px #fff;
    border-top: none;
    /* box-shadow:0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);*/
}

.hdanhmucdrops ul.content {
    overflow: auto;
    font-size: 14px;
    min-height: auto;
    height: 100%;
}

.hdanhmucdrops li a {
    display: inline-flex !important;
    align-items: center;
    width: 100%;
    position: relative;
    padding: 12px 0px !important;
    font-size: 14px !important;
    font-family: 'RobotoMedium' !important;
    color: #000;
    text-transform: capitalize;
    /* line-height:0px !important;*/
    text-decoration: none;
}

.hdanhmucdrops li a i {
    margin-right: 10px;
}

/* .hdanhmucdrops ul ul{-webkit-transform:scaleX(0);transform:scaleX(0);width:100%;display:none;position:absolute;left:calc(100% - 7px);left:-moz-calc(100% - 7px);left:-webkit-calc(100% - 7px);z-index:9999;background:#fff;}
*/
.hdanhmucdrops ul ul li {
    position: relative;
    border-bottom: dashed 1px #6666;
}

.hdanhmucdrops ul > li:hover > ul {
    display: block;
    -webkit-animation: scale-up-hor-left .4s cubic-bezier(0.390,0.575,0.565,1.000) both;
    animation: scale-up-hor-left .4s cubic-bezier(0.390,0.575,0.565,1.000) both
}

.hdanhmucdrops ul > li:last-child {
    /* border-bottom:none;*/
}

.hdanhmucdrops ul ul ul {
    left: 100%;
    top: 0!important
}

.hdanhmucdrops i.right {
    position: absolute;
    right: 13px;
    font-size: 16px;
}

.hdanhmucdrops i.left {
    font-size: 6px;
    margin-right: 10px;
}

.hdanhmucdrops li:hover > a {
    color: var(--color-main) !important;
    background: none !important;
}

.hdanhmucdrops .fa-angle-right:before {
    font-size: 15px;
}

.hdanhmucdrops li a img {
    margin-right: 10px;
    margin-top: -1px;
}

.hdanhmucdrops ul > li:hover .submenu {
    display: block;
    -webkit-animation: scale-up-hor-left .4s cubic-bezier(0.390,0.575,0.565,1.000) both;
    animation: scale-up-hor-left .4s cubic-bezier(0.390,0.575,0.565,1.000) both;
}

.hdanhmucdrops .submenu {
    display: none;
    width: calc( (100% * var(--start-color)) + 15px);
    width: 985px !important;
    height: 100% !important;
    padding: 10px 20px !important;
    border-radius: 0px !important;
    border-width: 1px 1px 1px 0px !important;
    border-style: solid !important;
    border-color: #ddd #ddd #ddd #e1e1e1;
    position: absolute !important;
    top: 0px !important;
    bottom: 0px !important;
    left: calc(100% - 15px) !important;
    background: #fff !important;
    margin-left: 0px !important;
    /* box-shadow:rgb(0 0 0 / 6%) -2px 0px 8px 0px;*/
    z-index: 999 !important;
    overflow: auto !important;
    font-size: 14px !important;
}

.hdanhmucdrops .submenu__col {
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(calc(100% / var(--col-menu) - 10px),1fr));
    /* grid-gap:15px 5px;*/
    padding: 0px;
    list-style: none;
}

.hdanhmucdrops .submenu__list {
    /* display:flex;*/
    /* justify-content:flex-start;*/
    /* flex-direction:column;*/
    /* flex-wrap:wrap;*/
    /* align-items:start;*/
    /* gap:40px;*/
}

.hdanhmucdrops .submenu__item {
    margin-bottom: 5px;
}

.hdanhmucdrops .submenu__item--main {
}

.hdanhmucdrops .submenu__item--main a {
    font-family: 'RobotoMedium' !important;
    font-size: 15px !important;
    margin-bottom: 5px;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.hdanhmucdrops .submenu__item--items a {
    font-family: 'RobotoRegular' !important;
    font-size: 14px !important
}

a.link:hover {
    color: #B78925 !important;
}

a.link {
    text-decoration: none;
    cursor: pointer;
    color: #000
}

/* Click dmc */
.nicescl {
    display: block;
    opacity: 1;
    transition: opacity 0.5s ease,transform 0.5s ease;
}

.nicescl.show {
    display: block;
    opacity: 1;
    transform: translateY(0);
}

.nicescl.hide {
    opacity: 0;
    transform: translateY(-10px);
}

.wrap-menu_main.w-menu.fix_head .hdanhmucdrops > .nicescl {
    display: none !important;
    opacity: 0;
}

.wrap-menu_main.w-menu.fix_head .hdanhmucdrops:hover .nicescl {
    display: block !important;
    opacity: 1 !important;
}

.wrap-head-allpage .hdanhmucdrops.ver1:hover .nicescl {
    display: block !important;
    opacity: 1 !important;
}

.cols-menu {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.cols-menu >div:nth-child(1) {
}

.cols-menu >div:nth-child(2) {
    /* width:calc(100% - 285px);*/
}

.wrap-menu_main {
    background: #F6F6F7;
    border-bottom: solid 1px #eee;
}

.menu ul li ul.sub-menu li a::before {
    background: none;
}

.menu ul li ul.sub-menu li a:hover {
    color: #F27614 !important;
}

.menu ul li ul.sub-menu {
    /* box-shadow:1px 1px 15px rgb(0 0 0 / 15%);*/
    display: none;
    width: 230px;
    list-style: none;
    height: auto;
    position: absolute;
    background: #D5518D;
    top: 100%;
    left: 0px;
    border-radius: 0px;
    z-index: 9999;
    border-top: 0;
    float: left;
    border: none !important;
}

.menu ul li:hover ul.sub-menu {
    display: block;
}

.menu ul li:hover ul.sub-menu-pr {
    display: flex;
    flex-wrap: wrap;
}

ul.sub-menu li {
    width: 100%;
    height: auto;
    float: left
}

ul.sub-menu li a {
    font-size: 14px;
    font-weight: 500;
    width: 100% !important;
    height: auto !important;
    line-height: 18px !important;
    padding: 15px 20px !important;
    color: #042552 !important;
    text-transform: inherit;
    float: left;
    text-align: left;
}

.sub-menu-2 {
    position: absolute;
    background: #111111;
    width: 230px;
    left: 100%;
    display: none;
}

.sub-menu-2 li {
    border-top: 1px solid #000000 !important;
}

.sub-menu li:hover .sub-menu-2 {
    display: block;
}

.sub-menu-pr>li>a {
    font-weight: 600;
}

.menu ul .menu-pr {
    position: inherit;
}

.menu ul li ul.sub-menu-pr {
    width: 100%;
    flex-wrap: wrap;
    top: 65px;
    display: none;
}

.menu ul li ul.sub-menu-pr li.level1 {
    float: left;
    width: 25%;
    height: 125px;
    padding: 10px;
    position: relative;
    border: none;
}

.menu ul li ul.sub-menu-pr li a {
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    position: relative;
    padding: 0 !important;
    transition: all .6s;
    border: solid 5px #D5518D;
}

.menu ul li ul.sub-menu-pr li a img {
    width: 100%;
    /* margin-bottom:10px;*/
}

.menu ul li ul.sub-menu-pr .sub-menu-2 {
    display: none;
    top: 100%;
    left: 0;
}

.menu ul li ul.sub-menu-pr li:hover .sub-menu-2 {
    display: block;
}

.menu ul li ul.sub-menu-pr .sub-menu-2 a {
    font-size: 14px;
}

.menu-title-show {
    color: #B78925;
    border-bottom: 1px solid #B78925;
    margin-bottom: 4px;
    font-family: 'SVN-GilroyBlack';
    text-transform: capitalize;
    font-size: 16px;
    margin-bottom: 10px;
}

.submenu__list {
    --sl-x: 4;
    --x: 0px;
    --y: 20px;
    display: grid;
    grid-template-columns: repeat(var(--sl-x),1fr);
    gap: var(--x) var(--y)
}

/* page inside */
/* .hdanhmucdrops{position:relative;}
.hdanhmucdrops .title{display:block;font-family:'RobotoBold';font-size:18px;text-transform:uppercase;color:#000;text-decoration:none;margin-bottom:10px;}
.hdanhmucdrops ul{padding:0;margin:0;list-style:none;text-align:left;background-color:#fff;border:none;}
.hdanhmucdrops .nicescl{position:absolute;box-sizing:border-box;width:100%;left:0;top:100%}
.hdanhmucdrops ul.content{overflow:hidden;}
.hdanhmucdrops.ver1 .nicescl{position:relative;}
.hdanhmucdrops.ver1 ul.content{height:auto}
.hdanhmucdrops ul img{margin-right:10px}
.hdanhmucdrops li a{position:relative;display:block;padding:10px 20px 10px 15px;font-size:16px;font-family:'RobotoMedium';text-transform:capitalize;display:flex;justify-content:start;align-items:center;text-decoration:none;border-left:solid;color:#333;margin:5px;}
.hdanhmucdrops li a::before{content:'';content:"\f178";font-family:"fontAwesome";padding-right:12px;margin-left:-25px;opacity:0;transition:opacity 200ms,margin-left 200ms;-moz-transition:opacity 200ms,margin-left 200ms;-o-transition:opacity 200ms,margin-left 200ms;-webkit-transition:opacity 200ms,margin-left 200ms}
.hdanhmucdrops ul ul li a{padding-left:35px;font-family:'MulishRegular';text-transform:none;font-size:14px;border-left:none;}
.hdanhmucdrops ul.content > li:not(:last-child) > a{}
.hdanhmucdrops ul ul{display:block}
.hdanhmucdrops li{position:relative}
.hdanhmucdrops ul > li:last-child{border-bottom:none}
.hdanhmucdrops li a:hover,.hdanhmucdrops li a.active{color:#273585;}
.hdanhmucdrops li a:hover:before,.hdanhmucdrops li a.active:before{opacity:1;margin-left:-10px}
.hdanhmucdrops .icon-drop{cursor:pointer;position:absolute;right:6px;top:12px;width:20px;height:20px;line-height:20px;font-size:20px;text-align:center}
*/
/* New Scroll */
.pro-height::-webkit-scrollbar {
    width: 3px;
}

.pro-height::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    background: #FCF6E3
}

.pro-height::-webkit-scrollbar-thumb {
    background-color: #4E2410;
}

.pro-height {
    height: 150px;
    overflow-y: auto;
    padding-right: 10px;
}

/* Text shadow */
.textshadow {
    text-shadow: 1px 1px 0 #fff,1px -1px 0 #fff,-1px 1px 0 #fff,-1px -1px 0 #fff,1px 0px 0 #fff,0px 1px 0 #fff,-1px 0px 0 #fff,0px -1px 0 #fff;
}

/* Toolbar */
.toolbar {
    width: 100%;
    bottom: 0px;
    position: fixed;
    z-index: 500;
    left: 0px;
    display: none;
    -webkit-filter: drop-shadow(1px 1px 4px rgba(0,0,0,0.75));
    -moz-filter: drop-shadow(1px 1px 4px rgba(0,0,0,0.75));
    -ms-filter: drop-shadow(1px 1px 4px rgba(0,0,0,0.75));
    -o-filter: drop-shadow(1px 1px 4px rgba(0,0,0,0.75));
}

.toolbar.is-active .list-phone {
    display: block;
    -webkit-animation: quickShow .2s cubic-bezier(0.66,0.45,0.76,1.53) forwards;
    animation: quickShow .2s cubic-bezier(0.66,0.45,0.76,1.53) forwards;
}

.toolbar .list-phone {
    position: absolute;
    bottom: 100%;
    left: 30px;
    opacity: 0;
    transform: scale(0);
    transform-origin: 50% 100%;
    display: none;
}

.toolbar .list-phone a {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    max-width: 240px;
    padding: 10px 20px;
    margin: 10px 0;
    border-radius: 50px;
    padding-right: 30px;
}

.toolbar .list-phone svg {
    max-width: 30px;
    max-height: 30px;
}

.toolbar .list-phone span {
    display: block;
    width: calc(100% - 40px);
    color: #333;
    font-weight: 700;
}

.toolbar .phone {
    position: relative;
    width: 50px;
    height: 50px;
    z-index: 99;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--color-main);
    border-radius: 50%;
    margin: 0 0px -25px 30px;
    transition: transform .2s ease-in-out;
}

.toolbar .phone a {
    color: #333;
    display: block;
    position: relative;
}

.toolbar .phone a:before,.toolbar .phone a:after {
    position: absolute;
    content: '';
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) rotate(135deg);
    width: 30px;
    height: 3px;
    border-radius: 2rem;
    background-color: #0F4334;
    opacity: 0;
    transition: opacity .2s ease-in-out;
}

.toolbar .phone a:after {
    transform: translate(-50%,-50%) rotate(45deg);
}

.toolbar .phone svg {
    max-width: 27px;
    max-height: 27px;
    display: block;
    position: relative;
    fill: #0F4334;
}

.toolbar.is-active .phone {
    transform: rotate(-180deg);
}

.toolbar.is-active .phone svg {
    opacity: 0;
}

.toolbar.is-active .phone a:before,.toolbar.is-active .phone a:after {
    opacity: 1;
}

.toolbar ul {
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0px;
    margin: 0px;
    --size: 33px;
    -webkit-mask: radial-gradient(33px at 55px 0px, #0000 99%, #fff 101%) 100%;
    background: var(--color-main);
    padding: 10px 0;
    padding-left: 100px;
    border-radius: 10px 10px 0px 0px;
}

.toolbar ul li {
    text-align: center;
    width: 25%;
    line-height: 1;
}

.toolbar ul li a {
    display: block;
    width: 100%;
    font-size: 27px;
    color: #ffff;
}

.toolbar ul li .icon {
    position: relative;
    margin: 0 auto;
    text-align: center;
}

.toolbar ul li a span {
    display: none;
    font-weight: 400;
    font-size: 11px;
    margin-top: 5px;
    color: #333;
    text-transform: capitalize;
}

.toolbar ul li a img,.toolbar ul li svg {
    max-height: 30px;
    fill: #fff;
    width: 100%;
}

.toolbar .phone svg {
    animation: tada 1.2s infinite;
    fill: #fff;
}

.tada {
    animation: tada 1.2s infinite;
}

.lang-toolbar {
    display: flex;
    justify-content: center;
    align-items: center;
}

.toolbar ul li.lang-toolbar a {
    display: inline-block;
    width: unset;
    margin: 0px 2px;
    font-size: unset;
}

.toolbar ul li.lang-toolbar a img {
    height: 10% !important;
}

.ex6 path {
    fill: transparent;
    stroke: #fff;
    stroke-width: 0.5;
    stroke-dasharray: 1500;
    stroke-dashoffset: 1500;
    -webkit-animation: dash 5s ease forwards;
    animation: dash 5s ease forwards;
}

@-webkit-keyframes dash {
    to {
        fill: #fff;
        stroke-dashoffset: 0;
    }
}

@keyframes dash {
    to {
        fill: #fff;
        stroke-dashoffset: 0;
    }
}

@keyframes tada {
    0% {
        transform: scaleX(1)
    }

    10%,20% {
        transform: scale3d(.9,.9,.9) rotate(-3deg)
    }

    30%,50%,70%,90% {
        transform: scale3d(1.1,1.1,1.1) rotate(3deg);
    }

    40%,60%,80% {
        transform: scale3d(1.1,1.1,1.1) rotate(-3deg);
    }

    to {
        transform: scaleX(1)
    }
}

@keyframes quickShow {
    0% {
        opacity: 0;
        transform: scale(0);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@media(max-width: 1001px) {
    .toolbar {
        display:block;
    }

    .scrollToTop,#messages-facebook {
        display: none !important;
    }
}

/* Flipbook */
.f-flipbook {
    display: inline-block;
    position: relative
}

.flipbook {
    margin: auto!important
}

.f-flipbook button {
    position: absolute;
    top: 50%;
    border: none;
    background: transparent;
    width: 55px;
    height: 35px;
    filter: brightness(0) saturate(100%) invert(0%) sepia(100%) saturate(0%) hue-rotate(21deg) brightness(97%) contrast(103%);
}

.f-flipbook .turn-next {
    left: calc(100% + 60px);
    left: -moz-calc(100% + 60px);
    left: -webkit-calc(100% + 60px)
}

.f-flipbook .turn-prev {
    right: calc(100% + 60px);
    right: -moz-calc(100% + 60px);
    right: -webkit-calc(100% + 60px)
}

.flipbook:before {
    content: '';
    position: absolute;
    top: -3px;
    bottom: -3px;
    left: -3px;
    right: -3px;
    background: url(../images/main/book.webp) no-repeat top center;
    background-size: 100% 100%;
    background: #66462F;
}

.flipbook-viewport .page {
    width: 461px;
    height: 600px;
    background-color: #fff;
    background-repeat: no-repeat;
    background-size: 100% 100%
}

.flipbook .page {
    -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 0 20px rgba(0,0,0,0.2);
    -ms-box-shadow: 0 0 20px rgba(0,0,0,0.2);
    -o-box-shadow: 0 0 20px rgba(0,0,0,0.2);
    box-shadow: 0 0 20px rgba(0,0,0,0.2)
}

.flipbook-viewport .page img {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin: 0
}

.flipbook-viewport .shadow {
    -webkit-transition: -webkit-box-shadow .5s;
    -moz-transition: -moz-box-shadow .5s;
    -o-transition: -webkit-box-shadow .5s;
    -ms-transition: -ms-box-shadow .5s;
    -webkit-box-shadow: 0 0 20px #ccc;
    -moz-box-shadow: 0 0 20px #ccc;
    -o-box-shadow: 0 0 20px #ccc;
    -ms-box-shadow: 0 0 20px #ccc;
    box-shadow: 0 0 20px #ccc
}

@keyframes scroll {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(100%);
    }
}

.scroll-text {
    display: flex;
    overflow: hidden;
    white-space: nowrap;
}

.scroll-text .content {
    display: inline-flex;
    animation: scroll 20s linear infinite;
}

.scroll-text span {
    font-size: 50px;
    font-family: 'SVN-PosterizerKGInline';
    line-height: 1.2;
    padding-right: 35px;
    color: #E8EDF1;
    text-transform: uppercase;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.transition-main {
    transition: all 0.3s cubic-bezier(0.25,0.46,0.45,0.94) 0s;
}

/* Menu click */
.menu-box {
}

.menu-box:nth-child(1) {
    text-align: left;
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 10px;
    width: 15%;
}

.menu-box:nth-child(2) {
    text-align: center;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.menu-box:nth-child(3) {
    width: 40%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.nav-click {
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
    padding: 5px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 48px;
    height: 48px;
    border: solid 1px #fff;
}

.navigation {
    position: fixed;
    top: 0;
    left: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    text-align: right;
    opacity: 0;
    pointer-events: none;
    overflow: hidden
}

.open-nav {
    pointer-events: auto;
    opacity: 1;
    z-index: 1100
}

.nav-click-close {
    position: absolute;
    top: 20px;
    right: 131px;
    z-index: 1101;
    cursor: pointer;
    color: #fff!important;
    font-size: 2rem;
    text-shadow: 1px 1px 1px #000;
}

.tencty {
    color: #fff;
    z-index: 100;
    text-align: left;
    position: absolute;
    top: 20px;
    left: 20px;
    font-size: 50px;
    text-shadow: 1px 1px 0px #000;
    text-transform: capitalize;
    font-family: 'MontserratBold';
}

.menu-show {
    margin: 0;
    padding: 15vh 130px;
    z-index: 100;
    width: 100%;
    height: 100%;
    text-align: right;
    position: relative;
}

.menu-show ul {
    display: inline-block;
    min-width: 200px;
    padding: 0;
}

.menu-show ul li {
    width: auto;
    height: auto;
    padding: 10px 0px;
    text-align: right;
    list-style: none;
    position: relative;
}

.menu-show ul li a {
    color: #fff;
    font-size: 1.5rem;
    text-shadow: 1px 1px 1px #000;
    text-transform: capitalize;
    letter-spacing: 2px;
    text-decoration: none;
    font-family: 'MontserratBold';
}

.menu-show ul li span.btn_menu {
    display: inline-block;
    color: #fff;
    width: 20px;
    height: 25px;
    cursor: pointer;
    position: relative;
    top: 0px;
    text-shadow: 1px 1px 1px #000;
    font-size: 13px;
    text-align: center;
    right: 5px;
}

.menu-show ul li ul li {
    margin: 0;
    padding: 0;
}

.menu-show ul li ul li a {
    font-size: 1.25rem;
    text-transform: capitalize;
    letter-spacing: 1px;
    display: block;
    text-shadow: 1px 1px 1px #000;
    color: #fff;
}

.menu-show li:hover > a {
    color: #7E28B1 !important;
}

.menu-layout ul li a.active,.menu-show ul li a:hover {
    color: #7E28B1;
    transform: translateX(10px) !important;
}

.menu-layout ul li ul li a {
    font-size: 20px;
    color: #fff;
    text-transform: capitalize;
    padding: 10px 20px;
    padding-bottom: 0;
}

.menu-layout ul li ul li a.has-child {
    margin-right: 0px
}

.menu-layout ul li ul li a.has-child:after {
    border-color: #F25B9D;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.menu-layout ul li ul li a.active,.menu-layout ul li ul li a:hover {
    color: #F25B9D !important;
    transform: translateX(10px) !important;
}

.menu-layout ul li ul li a.active.has-child:after {
    border-color: #F25B9D
}

.menu-layout ul li ul li ul li a {
    font-size: 15px;
}

.menu-layout ul li ul li:last-child > a {
    border-bottom: 0px
}

.menu-layout ul li ul li:hover > a {
    color: var(--m1)
}

.menu-layout ul li ul li:hover > a.has-child:after {
    border-color: var(--m1)
}

.menu-layout ul li ul li ul {
    left: 100%;
    margin-top: 0px;
    top: 0px;
}

.svg-menu {
    height: 100%;
    pointer-events: none;
    z-index: -1;
    position: fixed;
}

#scene,.svg-menu {
    top: 0;
    right: 0;
    width: 100%;
}

.style-1 {
    --color-stop: #7E28B1;
}

.gradient {
    transform-origin: center center
}

.gradient path {
    fill: url(#ColorGradient)
}

.gradient path:first-of-type {
    fill-opacity: .7;
    transform-origin: top right;
    transform: translate(50%,-180%)
}

.gradient path:nth-of-type(2) {
    fill-opacity: .3;
    transform-origin: center left;
    transform: translate(50%,-100%)
}

.gradient path:nth-of-type(3) {
    fill-opacity: .4;
    transform-origin: center left;
    transform: translate(50%,-50%)
}

.gradient path:nth-of-type(4) {
    fill-opacity: .5;
    transform-origin: top right;
    transform: translate(50%,-50%)
}

.gradient path:nth-of-type(5) {
    fill-opacity: .6;
    transform-origin: top right;
    transform: translate(100%,-50%)
}

.menu_icon {
    width: 25px;
    height: 20px;
    position: relative;
    cursor: pointer;
    text-align: left;
}

.menu_icon span {
    height: 2px;
    width: 28px;
    background: #333;
    display: inline-block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    opacity: 1;
    transition: all ease .6s;
}

.menu_icon::before {
    position: absolute;
    content: '';
    left: 0;
    top: 0;
    height: 2px;
    width: 28px;
    background: #333;
    transition: all ease .6s;
}

.menu_icon::after {
    position: absolute;
    content: '';
    left: 0;
    top: 100%;
    transform: translateY(-100%);
    height: 2px;
    width: 28px;
    background: #333;
    transition: all ease .6s;
}

.menu_icon.fixed span,.menu_icon.fixed::before,.menu_icon.fixed::after {
    background: #E4D481;
}

.menu_toggle.nav-click.open-click .menu_icon span {
    opacity: 0;
    transition: all ease .6s;
}

.menu_toggle.nav-click.open-click .menu_icon::before {
    top: 50%;
    transform: translateY(50%) rotate(225deg);
    transition: all ease .6s;
}

.menu_toggle.nav-click.open-click .menu_icon::after {
    top: 50%;
    transform: translateY(50%) rotate(315deg);
    transition: all ease .6s;
}

.items-menu {
    display: inline-flex;
    justify-content: center;
    gap: 10px;
    align-items: center;
    flex-direction: column-reverse;
}

.menu-text {
    color: #004414;
    /* font-family:'MontserratBold';*/
    text-transform: uppercase;
    font-size: 25px;
    font-family: 'ChiSon2';
    line-height: 20px;
}

.content-menu ul li.has-child {
    position: relative;
}

.content-menu ul li .more_menu {
    cursor: pointer;
    position: absolute;
    right: -24px;
    top: 25px;
    transform: translateY(-50%);
    width: 25px;
    text-align: center;
    color: #fff;
    display: flex;
    align-items: center;
}

.content-menu ul li .more_menu span:first-child {
    display: none;
}

.content-menu ul li .more_menu span {
    display: block;
    width: 100%;
    font-size: 20px;
    line-height: 1;
    position: relative;
    top: 4px;
    color: #F25B9D;
}

.content-menu ul li .more_menu.hide span:first-child {
    display: block;
    width: 100%;
    color: #fff;
}

.content-menu ul li .more_menu.hide span:last-child {
    display: none;
}

.content-menu ul li ul {
    display: none;
}

.more_menu.add span {
    font-size: 18px !important;
}

.more_menu.add {
    top: 22px !important;
    right: -5px !important;
}

.scroll-menu-show-list::-webkit-scrollbar {
    width: 3px;
}

.scroll-menu-show-list::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}

.scroll-menu-show-list::-webkit-scrollbar-thumb {
    background-color: #F25B9D;
}

.scroll-menu-show-list {
    height: 180px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 10px;
}

/* Tabs product */
.tabs-pro-detail {
    margin-top: 2rem;
}

.tabs-pro-detail .nav-tabs .nav-link {
    border-top-width: 3px;
    font-size: 13px;
    color: #333;
    text-transform: uppercase;
    font-weight: 500;
}

.tabs-pro-detail .nav-tabs .nav-link.active,.tabs-pro-detail .nav-tabs .nav-item.show .nav-link {
    border-top-color: #555555;
}

/* custom pape */
.page-link:hover {
    z-index: 2;
    color: #0a58ca;
    background-color: #e9ecef;
    border-color: #dee2e6
}

.page-link:focus {
    z-index: 3;
    color: #0a58ca;
    background-color: #e9ecef;
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(13,110,253,.25)
}

.page-item:not(:first-child) .page-link {
    margin-left: -1px
}

.page-link {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #000;
    width: 35px;
    height: 35px;
    border-radius: 50% !important;
}

.page-item.active .page-link {
    z-index: 3;
    color: #fff;
    /* background-color:#0098DB;*/
    border-color: var(--color-main);
    background: var(--color-main);
}

.page-item.disabled .page-link {
    color: #6c757d;
    pointer-events: none;
    background-color: #fff;
    border-color: #dee2e6;
}

/* hide Content */
div.noidung_anhien .noidung {
    max-height: 250px;
    overflow: hidden;
    position: relative;
}

div.noidung_anhien .noidung.pro_tpl {
    max-height: 1200px;
}

div.noidung_anhien p.thanhmo {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    height: 100px !important;
    background-image: linear-gradient(rgba(255,255,255,0),rgb(255 255 255));
    margin-bottom: 0;
}

.pic-brand,.pic-brand img {
    border-radius: 10px;
}

div.noidung_anhien .anhien {
    width: 180px;
    line-height: 30px;
    margin: 5px auto;
    text-align: center;
    color: #C89F49;
    border-radius: 4px;
    text-transform: capitalize;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    padding-right: 10px;
}

div.noidung_anhien .anbot,div.noidung_anhien_active .thanhmo {
    display: none;
}

div.noidung_anhien_active .xemthemnd,div.noidung_anhien_active p.thanhmo {
    display: none;
}

div.noidung_anhien_active .anbot {
    display: block;
}

div.noidung_anhien_active .noidung {
    max-height: 100% !important;
}

/* Circle */
.w-process {
}

.container-process {
    width: 100%;
    min-height: 1000px;
    position: relative;
    display: grid;
    place-items: center;
    pointer-events: none;
    animation: rotate var(--animation-time) linear infinite;
    /* animation-play-state:paused;*/
    margin-bottom: -700px;
    margin-top: 100px;
    min-width: 500px;
}

.container-process:after {
    position: absolute;
    content: '';
    width: 1000px;
    height: 100%;
    border: 10px solid #EEB203;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    border-radius: 50%;
}

.process-name {
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0;
}

.process-content {
    background: linear-gradient(180deg,rgba(219,219,219,1) 0%,rgba(255,255,255,1) 100%);
    height: 290px;
    position: relative;
    z-index: 2;
    text-align: center;
    padding-top: 104px;
    padding-bottom: 50px;
    /* margin-bottom:-6%;*/
    top: 80px;
}

.process-content .process-box {
    padding-bottom: 25px;
}

.process-content .img-process {
    margin-top: -255px;
    display: inline-block;
    position: absolute;
    top: -35%;
    left: 50%;
    transform: translate(-50%,0);
    z-index: 1;
    margin-top: -28%;
}

.process-items .process-desc {
    margin: 0;
    /* display:none;*/
    font-size: 15px;
    font-family: 'Open Sans';
    opacity: 0;
    transition: all 0.3s ease-in-out;
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
}

.process-items .process-img {
    margin: 0;
    /* display:none;*/
    font-size: 15px;
    font-family: 'Open Sans';
    opacity: 0;
    transition: all 0.3s ease-in-out;
    position: absolute;
}

.process-items.active .process-desc {
    margin: 0;
    display: block;
    opacity: 1;
}

.process-items.active .process-img {
    margin: 0;
    display: block;
    opacity: 1;
}

.container-process:hover {
    animation-play-state: paused;
}

.container-process:hover img {
    animation-play-state: paused;
}

.container-process:hover .circle .inner-circle {
    animation-play-state: paused;
    cursor: pointer;
}

@keyframes rotate {
    from {
        transform: rotate(0);
    }

    to {
        transform: rotate(360deg);
    }
}

.circle {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    pointer-events: none;
    transition: 550ms ease;
    z-index: 2;
}

.inner-circle {
    position: absolute;
    background-color: #EEB203;
    width: 160px;
    border-radius: 100%;
    aspect-ratio: 1;
    left: 0;
    display: grid;
    place-items: center;
    pointer-events: auto;
    transition: background 350ms ease,color 350ms ease-in-out;
    animation: rotate-opposite var( --animation-time) linear infinite;
    text-align: center;
    align-content: center;
    border: 5px solid #EEB203;
    overflow: hidden;
    z-index: 12;
}

.inner-circle .img {
    display: inline-block;
    padding: 5px;
    border-radius: 50%;
}

.inner-circle:hover {
    background-color: #fff;
    color: #000;
    border-color: var(--main-color);
}

.container-process > img {
    width: 25%;
    animation: rotate-opposite var(--animation-time) linear infinite;
    border-radius: 100vw;
    outline: 4px solid hsl(120,70%,60%);
    outline-offset: 8px;
    z-index: 1;
    --start-angle-of-rotation: 0deg;
    --end-angle-of-rotation: -360deg;
}

@keyframes rotate-opposite {
    from {
        transform: rotate(var(--start-angle-of-rotation));
    }

    to {
        transform: rotate(var(--end-angle-of-rotation));
    }
}

/* Combo Phone */
.support-online {
    position: fixed;
    z-index: 999;
    left: 10px;
    bottom: 300px;
}

.support-online a {
    position: relative;
    text-align: left;
}

.support-online i {
    width: 40px;
    height: 40px;
    background: #43a1f3;
    color: #ffffff;
    border-radius: 100%;
    font-size: 20px;
    text-align: center;
    line-height: 1.9;
    position: relative;
    z-index: 999;
}

.support-online a {
    display: block;
    cursor: pointer;
    text-align: center;
}

.support-online a span {
    border-radius: 2px;
    text-align: center;
    background: #67b634;
    padding: 9px;
    display: none;
    width: 180px;
    margin-left: 10px;
    position: absolute;
    color: #ffffff;
    z-index: 999;
    top: 0px;
    left: 40px;
    -webkit-transition: all 0.2s ease-in-out 0s;
    transition: all 0.2s ease-in-out 0s;
    -webkit-animation: headAnimation 0.7s 1;
    animation: headAnimation 0.7s 1;
}

.support-online a:hover span {
    display: block;
}

.support-online a span:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 10px 10px 0;
    border-color: transparent #67b634 transparent transparent;
    position: absolute;
    left: -10px;
    top: 10px;
}

.support-online .kenit-alo-circle-fill {
    width: 60px;
    height: 60px;
    top: -10px;
    position: absolute;
    border-radius: 100%;
    border: 2px solid transparent;
    background-color: rgba(0,175,242,0.5);
    opacity: 0.75;
    right: -10px;
}

.support-online .kenit-alo-circle {
    width: 50px;
    height: 50px;
    top: -5px;
    right: -5px;
    position: absolute;
    background-color: transparent;
    border-radius: 100%;
    border: 2px solid rgba(30,30,30,0.4);
    opacity: 0.1;
    border-color: #0089b9;
    opacity: 0.5;
}

.support-online .support-online .btn-support {
    cursor: pointer;
}

.support-online .mes i {
    background: orange;
}

.support-online .sms i {
    background: red;
}

.support-online .call-now i {
    background: green;
}

/* Toi uu web */
.slideshow .owl-page:not(.owl-loaded) {
    display: grid !important;
    grid-auto-flow: column;
    grid-auto-columns: 100%;
}

img.lazy {
    display: block;
}

/* Custom */
.title-seoquake {
    width: 0px;
    height: 0px;
    overflow: hidden;
}

.logo {
    max-width: 100%;
    position: relative;
    transition: all 0.3s cubic-bezier(0.25,0.46,0.45,0.94) 0s;
}

.logo-head {
    position: relative;
    margin: 0% 0;
    display: inline-block;
    transition: all 0.3s cubic-bezier(0.25,0.46,0.45,0.94) 0s;
}

.bgstart-animate {
    position: relative;
    width: fit-content;
    margin: auto;
}

.start-animate {
    z-index: 1.0E+17 !important;
    position: absolute;
    animation: star linear 1.75s infinite;
    -moz-animation: star linear 1.75s infinite;
    -webkit-animation: star linear 1.75s infinite;
    position: absolute;
    top: 0%;
    left: 15px;
    width: 50px;
    -o-animation: star linear 1.75s infinite;
}

.start-animate1 {
    z-index: 1.0E+17 !important;
    position: absolute;
    animation: star linear 2s infinite;
    -moz-animation: star linear 2s infinite;
    -webkit-animation: star linear 2s infinite;
    position: absolute;
    bottom: 50%;
    right: 0;
    width: 30px;
    -o-animation: star linear 2s infinite;
}

.start-animate2 {
    z-index: 1.0E+17 !important;
    position: absolute;
    animation: star linear 2.25s infinite;
    -moz-animation: star linear 2.25s infinite;
    -webkit-animation: star linear 2.25s infinite;
    position: absolute;
    bottom: 0%;
    left: 0;
    width: 40px;
    -o-animation: star linear 2.25s infinite;
}

.cart-fixed {
    position: fixed;
    bottom: 410px;
    right: 20px;
    display: flex;
    align-items: flex-end;
    gap: 1rem;
    flex-direction: column;
}

.btn_animation--style i {
    color: #008eff;
    font-size: 25px
}

.modal-dialog.edit {
    max-width: 800px;
}

.footer {
}

.footer-news:nth-child(1) {
    width: 35%;
}

.footer-news:nth-child(2) {
    width: 17%;
}

.footer-news:nth-child(3) {
    width: 35%;
}

.footer-news:nth-child(4) {
    width: 25%;
}

.footer-article {
    background: url("../images/main/bg-footer.png")no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

.name-company {
    font-size: 40px;
    font-family: 'RobotoBold';
    text-transform: uppercase;
    color: #fff;
}

.footer-news {
    width: calc(23% - 5px);
}

.copyright {
}

.footer-powered .wrap-content {
    display: flex;
    justify-content: center;
    align-items: center;
}

.footer-powered .wrap-content p {
    margin: 0;
    color: #fff;
}

.info-footer {
    color: #fff;
    margin-top: 15px;
}

.title-footer {
    font-size: 16px;
    font-family: 'RobotoBold';
    color: #fff;
    text-transform: uppercase;
    margin-bottom: 1rem;
    position: relative;
}

.footer-ul {
    position: relative;
    color: #fff;
}

.footer-ul li {
    text-align: left;
}

.footer-ul li a {
    color: #fff;
}

.title-footer::after {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 0;
    display: inline-block;
    width: 50px;
    height: 2px;
    background: #fff;
}

.footer-ul li a:hover {
    color: #FCCE00;
}

.title-pro-detail {
    font-family: 'MontserratBold';
    font-size: 25px;
}

.product-price-detail {
    background: #F5F5F5;
    padding: 12px 20px;
    border-radius: 6px;
}

.item-detail {
    color: #8E8E8E;
    font-size: 14px;
    padding: 0px 19px;
    position: relative;
}

.item-detail::after {
    position: absolute;
    left: 0px;
    top: 3px;
    width: 1px;
    height: 14px;
    background: #8E8E8E;
    content: '';
}

.item-detail i {
    margin-right: 5px;
}

.item-detail-comment-star {
    position: relative;
    font-size: 13px;
    margin-right: 19px;
}

.item-detail-comment-star span {
    position: absolute;
    left: 0px;
    top: 0px;
    color: #FFCD00;
    white-space: nowrap;
    overflow: hidden;
}

.attr-pro-detail li label {
    font-family: 'MontserratBold';
    font-size: 16px;
}

.attr-content-pro-detail {
    font-size: 15px;
    font-family: 'MontserratMedium';
}

.scrollToTopMobile {
    display: none !important;
}

.padding-top-bottom {
    padding: 2.5rem 0;
}

.fix_head {
    position: fixed !important;
    top: 0;
    width: 100%;
    z-index: 999 !important;
}

.logo {
    /* max-width:100%;*/
    position: relative;
    transition: all 0.3s cubic-bezier(0.25,0.46,0.45,0.94) 0s;
    z-index: 1;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.w-menu.fix_head .logo {
    transition: all 0.3s cubic-bezier(0.25,0.46,0.45,0.94) 0s;
    /* transform:scale(0.65);*/
    margin: 0% 0px;
}

.w-menu.fix_head {
    /* background-image:linear-gradient(0deg,rgba(0,0,0,0) 0%,rgba(0,0,0,0.9999999999999999) 100%);*/
    /* filter:drop-shadow(2.5px 4.33px 2.5px rgba(0,0,0,0.26));*/
}

.header-top {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    padding: 5px 0;
    background: linear-gradient(90deg,rgba(237,187,107,1) 0%,rgba(235,146,6,1) 100%);
}

.header-top .wrap-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.item-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    color: #fff;
}

.lang img {
    width: 35px;
    cursor: pointer;
}

.lang {
    gap: 5px;
}

.social-header {
    gap: 10px;
    justify-content: center !important;
    margin-top: 0px !important;
    padding: 0px !important;
    margin-bottom: 0;
}

.slogan-head {
    display: inline-flex;
    font-size: 15px;
    color: #fff;
    text-transform: uppercase;
    font-family: 'SVN-GilroyBold';
    width: 7%;
}

.header-bottom {
    padding: 5px 0;
    position: relative;
    background: #ED800B;
}

.header-bottom .wrap-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 13;
    gap: 20px;
}

.info-header {
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 7px;

    position: relative;
}

.info-header p {
    margin: 0;
}

.header-info {
    text-align: left;
    width: 63%;
}

.hotline-head {
    color: #000;
    text-align: left;
}

.number-hotline {
    font-size: 15px;
    color: #fff;
    font-family: 'RobotoMedium';
}

.number-hotline:hover {
    color: #ED2228
}

.logo-banner {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    position: relative;
    z-index: 14;
    text-align: left;
    width: 18%;
}

.info-head {
    display: inline-flex;
    justify-content: start;
    align-items: center;
    gap: 5px;
    color: #fff;
    margin: 0;
    font-size: 14px;
    position: relative;
    z-index: 1;
}

.info-head img,.info-head i,.img-info-head img {
    -webkit-animation: coccoc-alo-circle-img-anim 1s infinite ease-in-out;
    -moz-animation: coccoc-alo-circle-img-anim 1s infinite ease-in-out;
    -ms-animation: coccoc-alo-circle-img-anim 1s infinite ease-in-out;
    -o-animation: coccoc-alo-circle-img-anim 1s infinite ease-in-out;
    animation: coccoc-alo-circle-img-anim 1s infinite ease-in-out;
}

.menu.fix_head {
    padding: 5px 0;
    /* background-image:linear-gradient(0deg,rgba(0,0,0,0) 0%,rgba(0,0,0,0.9999999999999999) 100%);*/
    /* box-shadow:0 1px 5px 0 rgb(0 0 0 / 10%);*/
}

.video-slide {
    display: flex;
    position: relative;
}

.video-slide video {
    object-fit: cover;
    /* object-fit:fill;*/
    aspect-ratio: 1920/560;
    width: 100%;
}

.video {
    display: flex;
    position: relative;
}

.video video {
    object-fit: fill;
    aspect-ratio: 1920/560;
    width: 100%;
}

.btn_custom {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
}

.btn_custom a {
    display: block;
    width: max-content;
    background: #0065F7;
    color: #fff;
    font-size: 17px;
    font-weight: bold;
    margin-right: 10px;
    margin-bottom: 10px;
    border-radius: 100px;
    padding: 10px 20px;
    text-transform: capitalize;
    transition: all .3s ease;
    border: 1px solid #fc00622e;
}

.btn_custom a:hover {
    background: #fff;
    color: #FF0000;
    transition: all .3s ease;
    border: 1px solid #FF0000;
}

.menu .item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 39%;
    height: 100%;
}

.menu.position-menu {
    position: relative;
}

.menu .wrap-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.title-hotline {
    color: #fff;
}

.cols-hotline {
    display: inline-grid;
}

.desc-about-us ul {
    list-style: disc;
}

.pic-about-us1 {
    border-radius: 15px;
    border: solid 5px var(--color-main);
    display: block;
}

.pic-about-us1 a {
    border-radius: 10px;
}

.name-company1 {
    font-size: 20px;
    font-family: 'RobotoBold';
    color: #fff;
    text-transform: uppercase;
}

.copyright b {
    font-family: 'RobotoBold';
}
.cols-criteria {
    display: flex;
    justify-content: space-between;
    align-items: start;
    gap:15px;
}
/* Responsive */
@media (max-width: 1024px) {
    .contact-input {
        margin-bottom:15px;
    }

    .flex-cus,.row-video,.row-20 {
        margin-left: -5px;
        margin-right: -5px;
    }

    .mg-cus,.mg-video,.col-20 {
        padding-left: 5px;
        padding-right: 5px;
    }

    .content-text img {
        height: auto !important;
    }

    .padding-top-bottom {
        padding: 2rem 0;
    }

    .pad-top {
        padding-top: 2rem;
    }

    .pad-bottom {
        padding-bottom: 2rem;
    }

    .mg-top {
        margin-top: 2rem;
    }

    .mg-bottom {
        margin-bottom: 2rem;
    }

    .title-detail-main {
        font-size: 20px;
    }

    .cart-fixed {
        bottom: 220px;
    }

    .btn-frame {
        display: none;
    }

    .cart-pro-detail {
        width: 100%;
        margin-top: 10px;
    }

    .pad-bottom {
        padding-bottom: 2rem !important;
    }

    .pad-top {
        padding-top: 2rem !important;
    }

    .padding-top-bottom {
        padding: 2rem 0 !important;
    }

    .menu {
        display: none;
    }

    .menu-res {
        display: block;
        background-image: none !important;
    }

    .product-tool {
        opacity: 1;
        visibility: visible;
        position: initial;
    }

    .product-tool a span {
        display: none;
    }

    .head .head-top .wrap-content {
        justify-content: center !important
    }

    .logo-res {
        display: none;
    }

    .head .head-bottom .wrap-content {
        justify-content: center !important;
        flex-wrap: wrap;
        gap: 10px
    }

    .cols-about-us {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        position: relative;
        z-index: 10;
        gap: 15px
    }

    .cols-about-us >div:nth-child(1) {
        width: 100%;
        position: relative;
    }

    .cols-about-us >div:nth-child(2) {
        width: 100%;
    }

    .cols-news-hot {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        align-items: start;
        gap: 15px;
    }

    .cols-news-hot >div:nth-child(1) {
        width: 100%;
        position: relative;
    }

    .cols-news-hot >div:nth-child(2) {
        width: 100%;
        position: relative;
    }

    .cols-form {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 15px;
        flex-wrap: wrap;
    }

    .cols-form >div:nth-child(1) {
        width: 100%;
        position: relative;
    }

    .cols-form >div:nth-child(2) {
        width: 100%;
        position: relative;
    }

    .product {
        width: 32%;
    }

    .product:nth-child(4n+1) {
        clear: unset;
    }

    .product:nth-child(4n) {
        margin-right: 2%;
    }

    .product:nth-child(3n+1) {
        clear: both;
    }

    .product:nth-child(3n) {
        margin-right: 0px;
    }

    .news {
        width: 32%;
    }

    .news:nth-child(4n+1) {
        clear: unset;
    }

    .news:nth-child(4n) {
        margin-right: 2%;
    }

    .news:nth-child(3n+1) {
        clear: both;
    }

    .news:nth-child(3n) {
        margin-right: 0px;
    }

    .service {
        width: 32%;
    }

    .service:nth-child(4n+1) {
        clear: unset;
    }

    .service:nth-child(4n) {
        margin-right: 2%;
    }

    .service:nth-child(3n+1) {
        clear: both;
    }

    .service:nth-child(3n) {
        margin-right: 0px;
    }

    .head {
        display: none;
    }

    .footer-statistic {
        text-align: center;
    }

    .footer-copyright {
        text-align: center;
    }

    .scrollToTopMobile {
        display: block !important;
    }

    .header-bottom {
        display: none;
    }

    .header-top .wrap-content {
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
    }

    .header {
        padding: 0 !important;
    }

    .logo-mmenu {
        zoom: 0.7;
        }

    .header-top {
        display: none;
    }

    .cols-news {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: 10px;
        flex-wrap: wrap;
    }

    .cols-news >div:nth-child(1) {
        width: 100%;
        display: none;
    }

    .cols-news >div:nth-child(2) {
        width: 100%;
    }

    .video-slide {
        height: 70vh;
    }

    .video-slide video {
        height: 100%;
        aspect-ratio: unset;
        object-fit: cover;
    }

    .cols-album {
        display: flex;
        justify-content: space-between;
        align-items: start;
        gap: 10px;
        flex-wrap: wrap;
    }

    .cols-album .photo-album {
        width: calc(50% - 5px);
    }
}

@media (max-width: 992px) {
    .othernews {
        position:initial;
    }

    .footer-title:after {
        width: 100%;
    }

    #fanpage-facebook {
        width: 300px;
        overflow: hidden;
        margin: auto;
    }

    .footer-news:nth-child(4) {
        width: 100%;
    }

    .footer-news:nth-child(3) {
        width: 100%;
        margin-bottom: 20px;
    }

    .footer-news:nth-child(2) {
        width: 100%;
        margin: 20px 0;
    }

    .footer-news:nth-child(1) {
        width: 100%;
    }

    .time-news {
        display: none;
    }

    .copyright,.statistic {
        width: 100%;
        text-align: center;
    }

    .footer-ul li {
        width: calc(100% / 2 - 5px);
    }

    .footer-ul {
        display: flex;
        flex-flow: row wrap;
        justify-content: space-between;
    }

    .product {
        width: 32%;
    }

    .product:nth-child(4n+1) {
        clear: unset;
    }

    .product:nth-child(4n) {
        margin-right: 2%;
    }

    .product:nth-child(3n+1) {
        clear: both;
    }

    .product:nth-child(3n) {
        margin-right: 0px;
    }

    .news {
        width: 32%;
    }

    .news:nth-child(4n+1) {
        clear: unset;
    }

    .news:nth-child(4n) {
        margin-right: 2%;
    }

    .news:nth-child(3n+1) {
        clear: both;
    }

    .news:nth-child(3n) {
        margin-right: 0px;
    }

    .service {
        width: 32%;
    }

    .service:nth-child(4n+1) {
        clear: unset;
    }

    .service:nth-child(4n) {
        margin-right: 2%;
    }

    .service:nth-child(3n+1) {
        clear: both;
    }

    .service:nth-child(3n) {
        margin-right: 0px;
    }

    .album-main {
        width: 49%;
    }

    .album-main:nth-child(3n+1) {
        clear: unset;
    }

    .album-main:nth-child(3n) {
        margin-right: 2%;
    }

    .album-main:nth-child(2n+1) {
        clear: both;
    }

    .album-main:nth-child(2n) {
        margin-right: 0px;
    }
}

@media (max-width: 768px) {
    .item-video1 img {
        height:250px;
    }

    .right-intro {
        width: 100%;
    }

    .left-intro {
        width: 100%;
        margin-bottom: 20px;
        padding-right: 0;
    }

    .left-pro-detail,.right-pro-detail {
        width: 100%;
        margin: 0px;
    }

    .left-pro-detail,.top-contact .article-contact {
        margin-bottom: 30px;
    }

    .pic-news {
        width: 40%;
    }

    .info-news {
        width: 60%;
        padding-left: 10px;
    }

    .name-news {
        font-size: 15px;
    }

    .desc-news.text-split {
        -webkit-line-clamp: 2;
    }

    .product {
        width: 32%;
    }

    .product:nth-child(4n+1) {
        clear: unset;
    }

    .product:nth-child(4n) {
        margin-right: 2%;
    }

    .product:nth-child(3n+1) {
        clear: both;
    }

    .product:nth-child(3n) {
        margin-right: 0px;
    }

    .news {
        width: 32%;
    }

    .news:nth-child(4n+1) {
        clear: unset;
    }

    .news:nth-child(4n) {
        margin-right: 2%;
    }

    .news:nth-child(3n+1) {
        clear: both;
    }

    .news:nth-child(3n) {
        margin-right: 0px;
    }

    .service {
        width: 32%;
    }

    .service:nth-child(4n+1) {
        clear: unset;
    }

    .service:nth-child(4n) {
        margin-right: 2%;
    }

    .service:nth-child(3n+1) {
        clear: both;
    }

    .service:nth-child(3n) {
        margin-right: 0px;
    }

    .newsletter-button {
        width: 100%;
        transform: none;
    }

    .album-page {
        width: 49%;
    }

    .album-page:nth-child(3n+1) {
        clear: unset;
    }

    .album-page:nth-child(3n) {
        margin-right: 2%;
    }

    .album-page:nth-child(2n+1) {
        clear: both;
    }

    .album-page:nth-child(2n) {
        margin-right: 0px;
    }

    .items-newsletter {
        flex-wrap: wrap;
        gap: 0;
    }

    .items-newsletter .newsletter-input {
        width: 100%;
    }
    .items-criteria {
    width: 100%;
}

.name-company1 {
    font-size: 16px;
}
    .cols-criteria {
    display: flex;
    justify-content: center;
    align-items: start;
    gap:15px;
    flex-wrap:wrap;
}
}

@media (max-width: 576px) {
    .toast-cus {
        left:5px;
        width: calc(100% - 10px);
    }

    .box-readmore {
        width: calc(100% - 5px);
    }

    .newshome-scroll {
        width: 100%;
    }

    .newshome-intro {
        width: 100%;
        margin-bottom: 20px;
    }

    .top-contact .form-contact .button-contact .file-contact span b {
        max-width: 105px;
    }

    .cart-pro-detail {
        flex-wrap: wrap;
    }

    .cart-pro-detail a {
        width: 100%;
        text-align: center;
        margin: 0px !important;
    }

    .cart-pro-detail a:first-child {
        margin-bottom: 5px !important;
    }

    .title-main span,.title-main h1 {
        font-size: 30px;
    }

    .news {
        width: 100%;
    }

    .service {
        width: 100%;
    }

    .product {
        width: 49%;
        margin: 0 1% 1% 0
    }

    .product:nth-child(3n+1) {
        clear: unset;
    }

    .product:nth-child(3n) {
        margin-right: 2%;
    }

    .product:nth-child(2n+1) {
        clear: both;
    }

    .product:nth-child(2n) {
        margin-right: 0px;
    }

    .name-about-us {
        font-size: 30px;
    }

    .title-detail-main h3 {
        font-family: 'MontserratBold';
        font-size: 25px;
    }

    .btn_custom a {
        display: block;
        width: max-content;
        background: #0065F7;
        color: #fff;
        font-size: 15px;
        font-weight: bold;
        margin-right: 10px;
        margin-bottom: 10px;
        border-radius: 100px;
        padding: 10px 15px;
        text-transform: capitalize;
        transition: all .3s ease;
        border: 1px solid #fc00622e;
    }

    .control-product button.owl-prev {
        left: 0%;
    }

    .control-product button.owl-next {
        right: 0%;
    }
}

