/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.01
*/
/*************** ADD CUSTOM CSS HERE. ***************/
:root {
--mainColor: var(--primary-color);
--subColor: var(--fs-color-secondary);
--textColor: #000000;
--hover: #fdc110;
--price: #ff0000;
--bgFoot: #ac2027;
--txtFoot: #ffffff;
--support-color: #ac2027;
}
html::-webkit-scrollbar{width:3px}
html::-webkit-scrollbar-thumb{background-color:var(--mainColor);outline:3px solid var(--mainColor)}
header .pulsingButton {
box-shadow: 0 0 0 0 var(--textColor);
height: 8px;
width: 8px;
transition: all .3s ease-in-out;
border-radius: 50%;
margin-right: 10px;
display: inline-block;
background-color: var(--textColor);
color: var(--textColor);
animation: pulsing 1.25s cubic-bezier(0.66, 0, 0, 1) infinite;
}
.header-bg-image {
z-index: 2;
}
@keyframes playnow{0%{transform:scale(1)}10%{transform:scale(1.1)}20%{transform:scale(1)}30%{transform:scale(1.1)}40%{transform:scale(1)}50%{transform:scale(1.1)}60%{transform:scale(1)}100%{transform:scale(1)}}
.ux-nav-vertical-menu{
max-height: 435px;
overflow-y: auto;
border: 1px solid var(--mainColor);
}
.ux-nav-vertical-menu::-webkit-scrollbar{width:3px}
.ux-nav-vertical-menu::-webkit-scrollbar-thumb{background-color:var(--mainColor);outline:0px solid var(--mainColor)}
.header-vertical-menu__opener{
box-shadow: 0 -1px 2px 0 rgba(60, 64, 67, 0.1), 0 -4px 6px 2px rgba(60, 64, 67, 0.15);
}
.header-vertical-menu__fly-out.has-shadow {
box-shadow: 0 1px 2px 0 rgba(60, 64, 67, 0.1), 0 2px 6px 2px rgba(60, 64, 67, 0.15);
}
.header-vertical-menu__fly-out .nav-vertical-fly-out>li.menu-item>a {
padding: 8px 15px;
}
.nav-dropdown-default {
padding: 0px;
}
.nav-dropdown-default .nav-column li>a, .nav-dropdown.nav-dropdown-default>li>a {
color: #222;
}
.nav-column li.active>a, .nav-column li>a:hover, .nav-dropdown li.active>a, .nav-dropdown>li>a:hover, .nav-vertical-fly-out>li.active>a, .nav-vertical-fly-out>li>a:hover, .nav>li.active>a, .nav>li.current>a, .nav>li>a.active, .nav>li>a.current, .nav>li>a:hover{
color: var(--mainColor);
}
.nav-dropdown-default .nav-column li>a, .nav-dropdown.nav-dropdown-default>li>a {
padding: 10px !important;
margin: 0px !important;
font-size: 14px;
font-weight: 500;
}
header .searchform{
border-radius:4px;
max-width: 600px;
}
header #woocommerce-product-search-field-0{
height: 40px;
border-radius: 4px;
}
header .searchform button {
width: 40px;
height: 40px;
line-height: 40px;
position: absolute;
top: 0px;
right: 0px;
padding: 0px;
border-radius: 4px;
}
.bread-crumb {
}
.woocommerce-breadcrumb{
margin: 0;
font-size: 14px;
padding: 15px 0px;
border-radius: 0;
font-weight: 500;
line-height: 24px;
background-color: transparent;
width: 100%;
text-align: left;
word-break: break-word;
color: var(--mainColor);
}
.woocommerce-breadcrumb .mr_lr {
color: #666;
}
.woocommerce-breadcrumb .mr_lr svg {
width: 10px;
height: 10px;
margin-top: -2px;
}
footer#footer{
font-size: 15px;
}
footer#footer a:hover {
color: var(--subColor);
}
footer .title-menu h4 {
display: block;
position: relative;
text-transform: uppercase;
font-weight: 700;
color: #fff;
line-height: 21px;
margin-bottom: 10px;
}
footer .footer-top .icon-box-img {
margin-top: -19px;
}
footer .footer-top .icon-box h3{
margin-bottom: 0px;
}
footer .footer-top .icon-box p{
margin-bottom: 0px;
}
footer .absolute-footer {
display: none;
}
.sudes-header-stores>a {
display: flex;
justify-content: center;
align-items: center;
color: var(--txtHeader);
flex-direction: column;
font-size: 11px;
font-weight: normal;
}
.html_nav_position_text_top{
display: flex !important;
}
.sudes-header-stores>a .box-icon {
}
.header-main .nav > li > a{
text-align: center;
}
.header-main .nav > li > a b{
font-weight: normal;
}
.sudes-header-stores>a .box-icon svg {
width: 28px;
height: 28px;
}
.sudes-header-stores>a .item-title {
display: inline-block;
}
.sudes-header-stores>a .item-title span {
}
.header-main .nav > li.header-wishlist-icon > a,.header-main .nav > li.cart-item > a{
display: flex;
flex-direction: column-reverse;
font-weight: normal;
}
.header-main .nav > li.header-wishlist-icon > a i{
width: 28px;
height: 33px;
margin: 0px;
font-size: 25px;
}
.header-main .nav > li.cart-item > a .header-cart-icon{
margin: 0px;
}
.box_top_hea b {
color: var(--txtHeader);
background-color: var(--bgHeader);
border-radius: 5px;
padding: 5px 10px;
margin-left: 5px;
height: 30px;
line-height: 30px;
}
.box_top_hea:hover b {
background-color: #fff;
color: var(--mainColor);
}
.header-top{
font-size: 18px;
}
header .header-cart-icon img {
width: 28px;
}
.page-inner{
padding: 15px;
background-color: #fff;
box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}
.accordion-title {
color: #000;
padding: 10px 20px;
font-size: 16px;
margin-bottom: 0;
background: #E3E3E3;
cursor: pointer;
border-radius: 5px;
border:0px;
font-weight: 600;
}
.accordion-inner {
border: 1px solid #dee2e6;
padding: 15px 20px;
border-top: 0;
border-radius: 0 0 5px 5px;
}
.accordion-item{
margin-bottom: 10px;
}
.accordion .toggle{
display: none;
}
.accordion-title.active{
background: var(--mainColor);
color: #fff;
border-radius: 5px 5px 0 0;
}
.page-inner ul, .page-inner ol {
padding-left: 20px;
}
.sort-cate {
padding-bottom: 10px;
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom:20px
}
.sort-cate .sort-cate-right {
flex-grow: 1;
display: flex;
align-items: center;
position: relative;
justify-content: flex-end;
}
.sort-cate .sort-cate-right h3 {
color: #000;
margin: 0;
margin-right: 24px;
font-weight: 700;
width: auto;
font-size: 14px;
}
.sort-cate .sort-cate-right ul {
display: flex;
gap: 20px;
list-style: none outside;
margin-bottom: 0px;
padding-left: 0px;
}
.sort-cate .sort-cate-right ul li{
margin-bottom: 0px;
}
.sort-cate .sort-cate-right ul li a {
display: block;
padding: 0;
color: #333f48;
background-color: transparent;
position: relative;
font-size: 14px;
padding-left: 12px;
}
.sort-cate .sort-cate-right ul li.active a {
color: var(--mainColor);
}
.category-page-row {
padding-top: 0px;
}
#shop-sidebar span.widget-title{
font-size: 16px;
text-transform: uppercase;
font-weight: 600;
margin-bottom: 20px;
padding-left: 22px;
position: relative;
display: block;
}
#shop-sidebar span.widget-title:before {
content: "";
display: block;
width: 8px;
height: 8px;
border: 1px solid var(--mainColor);
position: absolute;
top: 6px;
left: 0;
transform: rotate(45deg);
}
#shop-sidebar span.widget-title:after {
content: "";
display: block;
width: 8px;
height: 8px;
border: 1px solid var(--mainColor);
position: absolute;
top: 6px;
left: 5px;
transform: rotate(45deg);
}
#shop-sidebar aside.widget {
border-bottom: 1px solid #ddd;
padding-bottom: 20px;
margin-bottom: 20px;
}
.widget .is-divider{
display: none;
}
.widget>ul>li+li, ul.menu>li+li {
border-top: 0px;
}
.widget>ul>li>a{
font-size: 14px;
}
.woocommerce-widget-layered-nav-list {
width: 100%;
display: inline-block;
list-style-type: none;
padding-left: 0px;
margin-bottom: 0px;
max-height: 176px;
overflow: hidden;
overflow-y: auto;
}
.widget>ul>li .count{
display: none;
}
.widget li.wc-layered-nav-term a:before {
color: currentColor;
content: "";
display: inline-block;
margin-right: 5px;
opacity: 1;
position: relative;
top: 2px;
}
.wc-layered-nav-term>a:before {
background-color: #FFF;
border: 1px solid rgba(0, 0, 0, .1);
border-radius: 3PX;
height: 15px;
line-height: 12px;
text-align: center;
width: 15px;
}
.widget li.chosen a:before {
color: #fff;
content: "x";
display: inline-block;
margin-right: 5px;
opacity: 1;
position: relative;
top: -2px;
}
.wc-layered-nav-term.chosen>a:before {
background-color: var(--mainColor);
border: 1px solid rgba(0, 0, 0, .1);
border-radius: 3px;
height: 15px;
line-height: 10px;
text-align: center;
width: 15px;
}
.sudes-filter {
display: inline-block;
position: relative;
}
.sort-cate .sudes-filter a {
display: flex;
align-items: center;
padding: 0px 10px;
height: 34px;
font-size: 13px;
color: var(--textColor);
background-color: #eeeeee;
/* border: 1px solid var(--mainColor); */
font-weight: 600;
min-width: 100px;
text-align: center;
margin: 0px;
border-radius: 10px;
}
.sudes-filter a svg {
margin-right: 5px;
width: 18px;
height: 18px;
}
.product-small.box {
height: 100%;
margin-bottom: 0px;
position: relative;
padding: 8px;
border-radius: 20px;
background-color: #EFEFEF;
}
.product-small.box .box-image{
border-radius: 15px;
background-color: #f9f9f9;
overflow: hidden;
}
.product-small.box img{
border-radius: 15px;
}
.product-title.woocommerce-loop-product__title{
margin-bottom: 10px;
}
.product-title.woocommerce-loop-product__title a {
-webkit-line-clamp: 2;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
font-size: 15px;
min-height: 40px;
font-weight: 600;
}
.image-fade_in_back{
width: 100%;
aspect-ratio: 1;
position: relative;
overflow: hidden;
}
.image-fade_in_back img {
width: auto;
max-height: 100%;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
object-fit: contain;
}
.image-fade_in_back img.attachment-woocommerce_thumbnail {
transition: all 0.5s ease 0s;
transform: translateY(0);
}
.image-fade_in_back img.back-image {
position: absolute;
top: 0;
left: 0;
opacity: 0;
transition: all 0.5s ease 0s;
visibility: hidden;
transform: translateY(-100%);
}
.product-small .add-to-cart-button a{
font-size: 15px !important;
border-radius: 99px !important;
font-weight: normal;
}
.shop-page-title .woocommerce-breadcrumb{
display: none;
}
.shop-page-title{
margin-bottom: 0px;
font-size: 30px;
}
.page-wrapper {
padding-bottom: 0px;
padding-top: 0px;
}
.product-page-title{
display: none;
}
.product-main > .content-row{
position: relative;
}
.header-block {
min-height: 0px;
top:0px;
}
.product-footer .woocommerce-tabs{
background-color: #fff;
padding: 30px 15px;
position: relative;
border-radius: 5px;
border:0px;
padding-top: 40px;
}
.woocommerce-tabs ul li a{
color: #333;
}
.section-title-normal span {
border-bottom: 0px;
margin-bottom: 0px;
margin-right: 15px;
padding-bottom: 0px;
}
.section-title-normal {
border-bottom: 0px;
}
.product-category .box-category{
background-color: #E5E5E5;
border-radius: 20px;
padding: 20px;
}
.product-footer .woocommerce-tabs .nav-line-bottom>li>a:before,.product-footer .woocommerce-tabs .nav-line-grow>li>a:before,.product-footer .woocommerce-tabs .nav-line>li>a:before {
display: none;
}
.page-title:not(.featured-title)+main .product-main {
padding-top: 0px;
padding-bottom: 20px;
}
.relatedbox{
margin-top: 20px;
}
.product-thumbnails a{
border: 1px solid #ebebeb;
cursor: pointer;
background: #fff;
overflow: hidden;
height: auto !important;
border-radius: 10px;
}
.product-thumbnails img {
margin-bottom: 0px;
opacity: 1;
}
.product-thumbnails .is-nav-selected a, .product-thumbnails a:hover ,.product-thumbnails .is-nav-selected a img, .product-thumbnails a:hover img{
border-color: var(--primary-color);
transform: none;
}
.woocommerce-widget-layered-nav-list::-webkit-scrollbar{width:5px;background-color:#F2F2F2}
.woocommerce-widget-layered-nav-list::-webkit-scrollbar-thumb{border-radius:5px;-webkit-box-shadow:inset 0 0 2px rgba(0,0,0,0.3);-moz-box-shadow:inset 0 0 2px rgba(0,0,0,0.3);background-color:var(--mainColor)}
.woocommerce-widget-layered-nav-list::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 2px rgba(0,0,0,0.3);-moz-box-shadow:inset 0 0 2px rgba(0,0,0,0.3);border-radius:5px;background-color:#F2F2F2}
.product-short-description{
font-size: 14px;
}
.product-info {
}
h1.product_title {
font-size: 24px;
margin-bottom: 0px;
}
.bottom-product {
display: flex;
align-items: center;
gap: 12px;
width: 100%;
margin-top: 15px;
margin-bottom: 15px;
}
.bottom-product .social-media {
display: flex;
align-items: center;
gap: 10px;
font-size: 14px;
}
.bottom-product .social-media li.title svg {
width: 20px;
height: 20px;
margin-right: 4px;
position: relative;
bottom: 1px;
}
.bottom-product .social-media li a {
width: 24px;
height: 24px;
border-radius: 5px;
background: var(--mainColor);
display: flex;
justify-content: center;
align-items: center;
}
.bottom-product .social-media li a svg {
width: 16px;
height: 16px;
fill: #fff;
}
.bottom-product .social-media li{
margin-left: 0px;
list-style: none;
display: flex;
}
.bottom-product .social-media li a:hover {
background: var(--subColor);
}
.inventory_quantity .do{
color: var(--mainColor);
}
.inventory_quantity {
font-size: 14px;
border-bottom: 1px solid #DDE1EF;
padding-bottom: 12px;
margin-bottom: 12px;
}
.price-box {
padding-bottom: 10px;
}
.price-box .special-price {
font-size: 16px;
font-weight: bold;
color: var(--price);
}
span.amount {
color: var(--price);
}
del span.amount {
color: #acacac;
font-size: 20px;
}
.price del {
text-decoration: none;
}
.price del span{
position: relative;
text-decoration: none;
}
.price del span::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 2px;
background: var(--mainColor);
transform-origin: left bottom;
transform: rotate(-7deg);
pointer-events: none;
}
.price-box del.price{
font-size: 16px;
}
.price-box .old-price {
color: #acacac;
font-size: 16px;
margin-left: 5px;
}
.price-box .sale-off {
color: #fff;
position: relative;
bottom: 1px;
background: #B11111;
padding: 2px 4px;
border-radius: 5px;
font-size: 12px;
min-width: 20px;
margin-left: 15px;
}
.price-box .sale-off:after {
border-right: 6px solid #B11111;
border-bottom: 6px solid transparent;
border-top: 6px solid transparent;
content: "";
position: absolute;
top: 50%;
left: -4px;
transform: translate(0%, -50%);
}
del span.amount {
font-weight: 400;
margin-right: 0px;
opacity: 1;
}
.product-summary .woocommerce-Price-currencySymbol {
display: contents;
font-size: inherit;
vertical-align: top;
}
.single_add_to_cart_button {
width: 50%;
height: 50px;
font-size: 13px;
text-transform: uppercase;
border-radius: 5px;
}
.category-filtering{
display: none;
}
.ux-buy-now-button{
width: 40%;
height: 50px;
font-size: 13px;
text-transform: uppercase;
border-radius: 5px;
}
.shop-page-title{
text-align: center;
}
.title-separator {
display: flex;
justify-content: center;
position: relative;
text-align: center;
margin-top: 10px;
margin-bottom: 20px;
}
.title-separator:before {
content: "";
display: block;
width: 30px;
height: 1px;
background: var(--mainColor);
position: absolute;
top: calc(50% - 1px);
left: calc(50% - 50px);
}
.title-separator:after {
content: "";
display: block;
width: 30px;
height: 1px;
background: var(--mainColor);
position: absolute;
top: calc(50% - 1px);
right: calc(50% - 50px);
}
.title-separator .separator-center {
display: block;
width: 32px;
height: 12px;
position: relative;
}
.title-separator .separator-center:before {
content: "";
display: block;
width: 10px;
height: 10px;
border: 1px solid var(--mainColor);
transform: rotate(45deg);
position: absolute;
top: 0;
left: 8px;
}
.title-separator .separator-center:after {
content: "";
display: block;
width: 10px;
height: 10px;
border: 1px solid var(--mainColor);
transform: rotate(45deg);
position: absolute;
top: 0;
right: 8px;
}
.ux-quantity {
width: 100%;
padding-left: 75px;
position: relative;
}
.ux-quantity .screen-reader-text {
clip: auto;
height: auto;
overflow: hidden;
position: absolute !important;
width: auto;
left: 0px;
line-height: 40px;
clip-path: none;
}
#product-sidebar .khuyen-mai {
display: block;
width: 100%;
border-radius: 5px;
overflow: hidden;
background: var(--bgBody);
border: 1px solid var(--mainColor);
margin-bottom: 20px;
margin-bottom: 20px;
}
#product-sidebar .khuyen-mai .product-promotion__heading {
background: var(--mainColor);
padding: 13px 10px;
color: #fff;
display: flex;
align-items: center;
font-weight: 600;
font-size: 16px;
line-height: 1;
}
#product-sidebar .khuyen-mai .product-promotion__heading img {
max-width: 20px;
margin-right: 5px;
}
#product-sidebar .khuyen-mai .content {
padding: 10px;
}
#product-sidebar .khuyen-mai .content ul li {
margin-bottom: 10px;
}
#product-sidebar .khuyen-mai .content ul li .nb_dis {
display: inline-block;
font-size: 11px;
float: left;
height: 20px;
line-height: 20px;
text-align: center;
width: 20px;
}
#product-sidebar .khuyen-mai .content ul li .nb_dis img {
max-width: 20px;
}
#product-sidebar .khuyen-mai .content ul li .content_dis {
padding-left: 25px;
display: block;
line-height: 20px;
font-size: 13px;
}
#product-sidebar .block-policy {
display: block;
width: 100%;
border-radius: 5px;
overflow: hidden;
background: var(--bgBody);
border: 1px solid var(--mainColor);
margin-bottom: 20px;
}
#product-sidebar .block-policy .heading-policy {
background: var(--mainColor);
padding: 13px 10px;
color: #fff;
display: flex;
align-items: center;
font-weight: 600;
font-size: 16px;
line-height: 1;
}
#product-sidebar .block-policy .heading-policy svg {
width: 20px;
height: 20px;
margin-right: 5px;
position: relative;
}
#product-sidebar .block-policy .policy-content {
padding: 5px 10px;
margin: 0px !important;
}
#product-sidebar .block-policy .policy-content .col-12 .policy-item {
padding: 5px 0px;
display: flex;
align-items: center;
}
.duration-300 {
transition-duration: .3s;
}
#product-sidebar .block-policy .policy-content .col-12 .policy-item .icon {
width: 32px;
height: 32px;
position: relative;
}
.aspect-1 {
aspect-ratio: 1;
}
#product-sidebar .block-policy .policy-content .col-12 .policy-item .icon img {
inset: 0px;
box-sizing: border-box;
padding: 0px;
border: none;
margin: auto;
width: 0px;
height: 0px;
min-width: 100%;
max-width: 100%;
min-height: 100%;
max-height: 100%;
object-fit: contain;
}
#product-sidebar .block-policy .policy-content .col-12 .policy-item .info {
text-align: left;
flex-grow: 1;
margin-left: 10px;
}
#product-sidebar .block-policy .policy-content .col-12 .policy-item .info h3 {
font-size: 14px;
margin: 0px;
font-weight: 400;
margin-bottom: 0px;
line-height: initial;
}
#secondary aside.widget{
}
#secondary aside.widget span.widget-title {
font-size: 16px;
margin-bottom: 10px;
padding-bottom: 10px;
color: #000;
display: block;
border-bottom: 1px solid #ccc;
}
.badge.post-date {
height: 60px;
width: 90px;
}
.button.icon.circle, .button.icon.round {
border-color: var(--fs-color-primary);
color: var(--primary-color);
border-width: 1px;
line-height: 32px;
}
.recent-blog-posts-li {
display: flex;
flex-wrap: wrap;
margin-bottom: 10px;
padding-bottom: 5px;
border-bottom: 1px dashed rgb(242, 242, 242);
}
.recent-blog-posts a{
font-size: 13px;
font-weight: 600;
line-height: 20px;
}
.box-blog-post {
display: block;
position: relative;
}
.box-blog-post .box-image{
border-radius: 12px;
overflow: hidden;
}
.archive-page-header h1{
font-size: 34px;
font-weight: bold;
color: var(--mainColor);
margin-bottom: 0px;
}
#secondary2 span.widget-title{
font-size: 20px;
text-transform: uppercase;
display: block;
padding: 17px 0px;
margin-bottom: 0px;
font-weight: 700;
border-bottom: 1px solid #dee2e6;
margin-bottom: 10px;
}
.box-blog-post .box-text{
padding: 10px 0px;
}
.box-blog-post .is-divider{
display: none;
}
.box-blog-post .post-meta {
display: block;
margin: 5px 0px;
}
.box-blog-post a.button {
margin: 0px;
font-weight: normal;
text-decoration: underline;
font-size: 14px;
}
.box-blog-post .box_time_and_comment {
display: flex;
align-items: center;
margin-bottom: 10px;
}
.box-blog-post .box_time_and_comment .user_date {
font-size: 14px;
font-weight: 500;
line-height: 1.4;
display: flex;
align-items: center;
}
.box-blog-post .box_time_and_comment .user_date svg {
width: 16px;
height: 16px;
margin-right: 5px;
margin-bottom: 1px;
}
.box-blog-post .box_time_and_comment .line-sep {
height: 16px;
width: 1px;
background-color: #000;
margin: 0px 15px;
position: relative;
display: inline-block;
}
.box-blog-post .box_time_and_comment .user_date {
font-size: 14px;
font-weight: 500;
line-height: 1.4;
display: flex;
align-items: center;
}
.box-blog-post .box_time_and_comment .user_date svg path {
fill: #000;
}
.box-blog-post .post-title{
font-family: "Lexend", sans-serif;
margin-bottom: 10px;
font-size: 18px;
font-weight: 500;
}
.blog-single{
margin-top: 40px;
}
.blog-single article{
position: relative;
display: block;
}
.entry-header-text .entry-divider{
display: none;
}
.entry-header-text .entry-meta{
text-transform: inherit;
}
.entry-content {
padding-bottom: 1.5em;
padding-top: 0px;
}
ul.links li a {
color: var(--primary-color);
}
.nav-pagination>li>a, .nav-pagination>li>span {
border: 1px solid;
border-radius: 5px;
line-height: 2.25em;
}
.widget:last-child {
margin-bottom: 0px;
}
.widget_shopping_cart{
padding: 10px;
}
.off-canvas-left .mfp-content, .off-canvas-right .mfp-content {
background-color: #fff;
}
.off-canvas .sidebar-menu {
padding: 0px;
}
.nav-sidebar.nav-vertical>li+li {
border-top: 0px;
}
.off-canvas .nav-vertical>li>a {
padding: 5px;
padding-left: 10px !important;
font-weight: normal !important;
font-size: 15px;
color: #000;
}
.sidebar-menu-tabs.nav>li>a {
background: var(--primary-color);
color: #fff;
}
.sidebar-menu-tabs.nav-line-bottom>li>a:before{
background-color: var(--fs-color-secondary);
}
.nav-vertical>li>ul li a {
font-size: 13px;
}
.select-resize-ghost, .select2-container .select2-choice, .select2-container .select2-selection, input[type=date], input[type=email], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=url], select{
border: 1px solid #e1e1e1;
box-shadow: none !important;
border-radius: 4px;
font-size: 14px;
}
textarea{
border: 1px solid #e1e1e1;
padding: 5px 20px;
box-shadow: none !important;
border-radius: 10px;
font-size: 14px;
}
.radius5 img{
border-radius: 5px;
}
.swiper_coupons .swiper-slide .item-coupon {
width: 100%;
display: flex;
align-items: center;
background-image: url(img/subtract2.png?1772264861552);
background-size: 100% 100%;
background-repeat: no-repeat;
margin-bottom: 0;
}
.swiper_coupons .swiper-slide .item-coupon .image {
min-width: 30%;
height: 100px;
display: flex;
position: relative;
padding: 30px 10px;
}
.swiper_coupons .swiper-slide .item-coupon .image img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
padding: 15px 10px 15px 15px;
}
.swiper_coupons .swiper-slide .item-coupon .content_wrap {
display: flex;
flex-direction: column;
padding: 5px 15px 5px 15px;
position: relative;
width: 100%;
}
.swiper_coupons .swiper-slide .item-coupon .content_wrap .info-button {
display: flex;
justify-content: center;
align-items: center;
position: absolute;
right: 20px;
top: 0px;
}
.swiper_coupons .swiper-slide .item-coupon .content_wrap .info-button svg {
width: 24px;
height: 24px;
}
.section_coupons .swiper_coupons .swiper-slide .item-coupon .content_wrap .content-top {
font-size: 14px;
margin-bottom: 10px;
font-weight: 600;
}
.swiper_coupons .swiper-slide .item-coupon .content_wrap .content-top span {
display: block;
font-size: 12px;
color: #000;
font-weight: 500;
}
.swiper_coupons .swiper-slide .item-coupon .content_wrap .content-bottom {
display: flex;
align-items: center;
justify-content: space-between;
}
.swiper_coupons .swiper-slide .item-coupon .content_wrap .content-bottom span {
color: var(--mainColor);
font-size: 10px;
}
.swiper_coupons .swiper-slide .item-coupon .content_wrap .content-bottom .coupon-code {
display: inline-block;
color: #fff;
background: var(--mainColor);
padding: 5px 5px;
margin-top: 5px;
margin-left: 0px;
min-width: 80px;
text-align: center;
cursor: pointer;
font-size: 11px;
}
.section_4_banner .box-overlay{
overflow: hidden;
}
.section_4_banner .box-overlay .box-text a {
margin-top: 6px;
font-size: 14px;
padding: 0px;
height: auto;
line-height: normal;
font-style: italic;
color: var(--subColor);
}
.section_4_banner .box-overlay .box-text {
display: block;
width: 100%;
position: absolute;
bottom: -34px;
left: 0;
padding: 16px;
background: rgba(0, 0, 0, 0.7);
backdrop-filter: blur(2px);
color: #fff;
border-top: 2px solid var(--subColor);
z-index: 1;
transition: 0.3s;
}
.section_4_banner .box-overlay:before {
position: absolute;
display: block;
border: 1px solid #fff;
opacity: .5;
transition: opacity 0.3s cubic-bezier(0.37, 0.01, 0, 0.98);
z-index: 1;
content: "";
top: 4px;
left: 4px;
right: 4px;
bottom: 4px;
}
.section_4_banner .box-overlay:hover .box-text {
bottom: 0px;
}
.popup-coupon {
padding: 0 8px;
box-sizing: border-box;
width: 450px;
max-height: 505px;
height: auto;
background: transparent;
margin: 0 auto;
position: relative;
position: fixed;
left: 50%;
top: 15%;
transition: transform 0.5s cubic-bezier(0.645, 0.045, 0.355, 1), visibility 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
box-shadow: none;
touch-action: manipulation;
opacity: 0;
transform: translateX(-50%);
z-index: -1;
min-height: 200px;
font-size: 14px;
}
.popup-coupon.active {
opacity: 1;
z-index: 99999;
}
.popup-coupon .content {
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
border-radius: 5px;
background-color: #fff;
margin: 0 auto;
-webkit-box-shadow: 3px 3px 20px 0 rgba(0, 0, 0, 0.15);
box-shadow: 3px 3px 20px 0 rgba(0, 0, 0, 0.15);
position: relative;
overflow: hidden;
}
.popup-coupon .content .close-popup-coupon {
position: absolute;
top: 8px;
right: 10px;
cursor: pointer;
}
.popup-coupon .content .close-popup-coupon svg {
width: 15px;
height: 15px;
transition: transform 0.3s;
fill:#fff;
}
.popup-coupon .content .close-popup-coupon:hover svg {
transform: rotate(90deg);
}
.popup-coupon .content ul {
width: 100%;
margin-bottom: 0px;
}
.popup-coupon .content ul li {
padding: 10px;
display: flex;
margin: 0px;
}
.popup-coupon .content .title {
display: block;
width: 100%;
padding: 10px;
background: var(--mainColor);
color: #fff;
}
.coupon-amount-bg{
background-color: var(--primary-color);
color: var(--fs-color-secondary);
width: 100%;
display: flex;
justify-content: center;
align-items: center;
border-radius: 10px;
font-size: 30px;
font-weight: 700;
}
.popup-coupon .content ul li:nth-child(2n+1) {
background-color: #f9f9f9;
}
.popup-coupon .content ul li span:first-child {
min-width: 126px;
display: inline-block;
color: var(--mainColor);
}
.backdrop__body-backdrop___1rvky {
position: fixed;
opacity: 0;
width: 100%;
left: 0;
top: 0 !important;
right: 0;
bottom: 0;
background-color: #363636;
z-index: 9999;
visibility: hidden;
opacity: 0;
transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
}
.backdrop__body-backdrop___1rvky.active {
visibility: visible;
opacity: 0.5;
}
.z9{
z-index: 99;
}
.swiper-wrapper {
position: relative;
width: 100%;
height: 100%;
z-index: 1;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
-ms-transition-property: -ms-transform;
transition-property: transform;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
.swiper_coupons .swiper-button-prev {
font-size: 0;
line-height: 0;
position: absolute;
top: 50%;
display: flex;
justify-content: center;
align-items: center;
width: 36px;
height: 36px;
padding: 0;
cursor: pointer;
color: var(--mainColor);
outline: none;
border: 0px;
background: transparent;
text-align: center;
z-index: 2;
left: 10px;
opacity: 0;
-webkit-transition: all .25s ease;
transition: all .25s ease;
-webkit-transform: translate(-32px, -50%) rotate(180deg);
-ms-transform: translate(-32px, -50%) rotate(180deg);
transform: translate(-32px, -50%) rotate(180deg);
margin-top: 0px;
background-color: var(--bgBodySub);
border-radius: 5px;
visibility: visible;
opacity: 1;
-webkit-transform: translateY(-50%) rotate(180deg);
transform: translateY(-50%) rotate(180deg);
}
.swiper_coupons .swiper-button-next {
font-size: 0;
line-height: 0;
position: absolute;
top: 50%;
display: flex;
justify-content: center;
align-items: center;
width: 36px;
height: 36px;
padding: 0;
cursor: pointer;
color: var(--mainColor);
outline: none;
border: 0px;
background: transparent;
text-align: center;
z-index: 2;
right: 10px;
opacity: 0;
-webkit-transition: all .25s ease;
transition: all .25s ease;
-webkit-transform: translate(32px, -50%);
-ms-transform: translate(32px, -50%);
transform: translate(32px, -50%);
margin-top: 0px;
background-color: var(--bgBodySub);
border-radius: 5px;
visibility: visible;
opacity: 1;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.swiper_coupons .swiper-button.swiper-button-disabled{
opacity: 0.8;
}
.swiper_coupons .swiper-button svg {
width: 100%;
height: 100%;
}
.swiper_coupons .swiper-button svg path {
stroke: var(--mainColor);
}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after,.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after{
display: none;
}
.swiper-container {
margin-left: auto;
margin-right: auto;
position: relative;
overflow: hidden;
list-style: none;
padding: 0;
z-index: 1;
}
.section_flash_sale .time_box_full h2 {
font-weight: 400;
margin-bottom: 0px;
display: inline-block;
margin-right: 50px;
font-size: 30px;
font-family: "Calistoga", serif;
}
.section_flash_sale .time_box_full h2 a {
color: #fff;
}
.section_flash_sale .time_box_full h2 img {
height: 32px;
width: auto;
animation: 0.8s linear 0s infinite normal none running pulseScale;
}
.section_flash_sale .time_box_full .time_box a.ssmore {
color: #fff;
display: inline-flex;
align-items: center;
width: fit-content;
font-size: 14px;
font-weight: 600;
text-decoration: underline;
}
.section_flash_sale .time_box_full .time_box a.ssmore svg {
width: 16px;
height: 16px;
margin-left: 5px;
fill:#fff;
}
.section_flash_sale .time_box_full p{
margin-bottom: 0px;
}
.box-category{
border-radius: 5px;
overflow: hidden;
}
.box-category h5.header-title {
color: var(--mainColor);
font-size: 20px;
text-transform: inherit;
display: -webkit-box;
-webkit-box-orient: vertical;
position: relative;
line-height: 1.4 !important;
overflow: hidden;
text-overflow: ellipsis;
padding: 0 !important;
-webkit-line-clamp: 1;
height: calc(1em * 1.4 * 1);
}
.flickity-prev-next-button.next {
right: 10px;
transform: none;
}
.flickity-prev-next-button.previous {
left: 10px;
transform: none;
}
.slider-nav-push:not(.slider-nav-reveal) .flickity-prev-next-button {
margin-top: 0px;
opacity: 1;
}
.slider-nav-circle .flickity-prev-next-button .arrow, .slider-nav-circle .flickity-prev-next-button {
border: 0px;
background-color: var(--primary-color);
border-radius: 100%;
}
.flickity-prev-next-button .flickity-button-icon {
display: none !important;
}
.flickity-prev-next-button {
width: 36px !important;
height: 36px !important;
transition: transform 0.3s;
min-height: 36px;
top: 45%;
}
.flickity-prev-next-button:hover {
transform: scale(1.1);
}
.flickity-prev-next-button.next {
background-image: url('data:image/svg+xml;utf8,') !important;
background-size: contain;
background-repeat: no-repeat;
right: 10px;
}
.flickity-prev-next-button.previous {
background-image: url('data:image/svg+xml;utf8,') !important;
background-size: contain;
background-repeat: no-repeat;
left: 10px;
}
.alt-font h2{
font-family:"Roboto Slab", sans-serif;
font-weight: normal !important;
}
.section-title2 p{
margin-bottom: 10px;
}
.white {
color: #000000 !important;
}
.button .icon-angle-right{
background-image: url('data:image/svg+xml;utf8,') !important;
background-size: 18px;
background-repeat: no-repeat;
background-position: center;
}
.button.white .icon-angle-right{
background-image: url('data:image/svg+xml;utf8,') !important;
background-size: 18px;
background-position: center;
background-repeat: no-repeat;
}
.button {
position: relative;
}
header .icon-search{
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='27' height='27' viewBox='0 0 27 27' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_3_125)'%3E%3Cpath d='M25.9321 24.8876L18.8579 17.8133C18.8575 17.8129 18.8575 17.8123 18.8579 17.812C20.3722 16.0261 21.2521 13.7888 21.3602 11.4498C21.6646 5.11296 16.622 0.0121201 10.2821 0.246416C4.69774 0.457789 0.219252 4.93628 0.00787958 10.5206C-0.226365 16.8606 4.87452 21.9032 11.2114 21.5986C13.5503 21.4904 15.7874 20.6105 17.5733 19.0964C17.5737 19.096 17.5743 19.096 17.5748 19.0964L24.6491 26.1706C25.0061 26.5222 25.5806 26.5177 25.9321 26.1607C26.2798 25.8075 26.2798 25.2407 25.9321 24.8876ZM2.04522 12.9832C1.34878 9.87445 2.25848 6.80634 4.4132 4.65168C6.56791 2.49702 9.63591 1.58726 12.7448 2.28375C15.6861 2.94289 18.6684 5.92493 19.3276 8.86594C20.0245 11.9751 19.1146 15.0435 16.9598 17.1984C14.805 19.3532 11.7364 20.263 8.62725 19.566C5.68624 18.9068 2.70436 15.9243 2.04522 12.9832Z' fill='%23AC2027'%3E%3C/path%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3_125'%3E%3Crect width='26.1927' height='26.1927' fill='white' transform='translate(0 0.238541)'%3E%3C/rect%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") !important; background-size: contain;
background-repeat: no-repeat;
width: 26px;
height: 26px;
}
header .icon-user {
background-image: url('data:image/svg+xml;utf8,') !important;
background-size: contain;
background-position: center left;
background-repeat: no-repeat;
width: 26px;
height: 26px;
}
ul.product_list_widget li a:not(.remove){
font-size: 14px;
}
.icon-search:before,.icon-user:before{
content: "";
}
.button .icon-angle-right:before {
content: "";
}
.banner-radius .banner {
border-radius: 5px;
overflow: hidden;
}
.wishlist-icon{
display: none;
}
.section_about .about-img .img-1 img {
border-radius: 20px 80px 80px 80px;
position: relative;
}
.section_about .about-img .img-2 img{
width: 180px;
border-radius: 50%;
}
.section_about .about-img .img-3 img{
width: 180px;
border-radius: 20px 60px 60px 60px;
}
.section_about .about-img .img-1::before {
content: "";
position: absolute;
top: -15px;
left: -15px;
bottom: -15px;
border: 5px solid var(--subColor);
width: 80%;
border-radius: 20px 80px 80px 80px;
transform: rotate(2deg);
z-index: 0;
}
.doitac .gallery-col .box-image{
padding-bottom: 50%;
overflow: hidden;
height: auto;
display: block;
position: relative;
background: #fff;
border-radius: 10px;
}
.doitac .gallery-col .box-image img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
padding: 10px;
transition: all .3s ease;
}
.section_about ul li.bullet-checkmark{
border:0px;
}
@-webkit-keyframes pulseScale{50%{opacity:0.3;transform:scale(1.3)}}
@keyframes pulsing{to{box-shadow:0 0 0 12px rgba(232,76,61,0)}}
@keyframes pulse-red{0%{transform:scale(0.8);box-shadow:0 0 0 0 #ff0000}70%{transform:scale(1);box-shadow:0 0 0 10px rgba(255,82,82,0)}100%{transform:scale(0.8);box-shadow:0 0 0 0 rgba(255,82,82,0)}}
@keyframes pulse-red-hover{0%{transform:scale(0.8);box-shadow:0 0 0 0 #fff}70%{transform:scale(1);box-shadow:0 0 0 10px rgba(255,82,82,0)}100%{transform:scale(0.8);box-shadow:0 0 0 0 rgba(255,82,82,0)}}
.product-small.box .price-wrapper .price {
font-size: 16px;
gap: 5px;
display: flex;
flex-direction: row-reverse;
justify-content: flex-end;
}
.product-small.box .price-wrapper .price del span.amount {
font-size: 14px;
color: #333;
}
.product-info .price {
font-size: 25px;
}
.khampha .icon-box .icon {
display: flex;
justify-content: center;
align-items: center;
width: 90px;
height: 90px;
border-radius: 100px;
background: linear-gradient(90deg, var(--subColor), var(--hover));
transition: 0.6s;
}
.khampha .icon-box {
font-size: 14px;
}
.khampha .icon-box-left,.khampha .icon-box-right {
align-items: center;
}
.khampha .icon-box:hover .icon {
transform: rotateY(180deg);
}
.tabbed-content .nav-simple > li > a{
padding: 0 20px;
position: relative;
width: auto;
line-height: 36px;
height: auto;
font-weight: 500;
min-width: 100px;
background: var(--subColor);
color: var(--mainColor);
transition: background-color 0.3s ease;
margin-right: 12px;
font-size: 14px;
}
.tabbed-content .nav-simple > li.active a {
background: var(--mainColor);
color: #fff;
}
.tabbed-content .nav:hover>li:not(:hover)>a:before {
opacity: 1;
}
.tabbed-content .nav-simple > li a:before {
position: absolute;
display: block;
border: 1px solid var(--mainColor);
opacity: .5;
transition: opacity 0.3s cubic-bezier(0.37, 0.01, 0, 0.98);
z-index: 1;
content: "";
top: 4px;
left: 4px;
right: 4px;
bottom: 4px;
}
.tabbed-content .nav-simple > li.active a:before {
border: 1px solid #fff;
}
.tabbed-content .nav-simple > li a:after {
content: '';
position: absolute;
left: 0;
right: 0;
bottom: -6px;
width: 8px;
margin: auto;
transition-duration: .3s;
border-top: 8px solid var(--mainColor);
border-left: 8px solid transparent;
border-right: 8px solid transparent;
transform: translateY(-10px);
z-index: -1;
}
.tabbed-content .nav-simple > li.active a:after {
transform: translateY(0px);
}
.tabbed-content > ul{
margin-bottom: 20px;
}
.sub-title{
display: block;
width: 100%;
font-weight: 500;
text-transform: uppercase;
color: var(--mainColor);
}
.product-small .badge-container {
left: auto;
margin-top: 15px;
right: 15px !important;
}
.product-small .badge-inner{
width: 60px;
height: 25px;
display: block;
font-weight: bold;
line-height: 20px;
border-radius: 20px;
font-size: 13px;
color: #000;
font-family: Unbounded, sans-serif;
}
/* Ẩn khối giá biến thể mặc định của WooCommerce */
.single_variation_wrap .woocommerce-variation-price {
display: none !important;
}
.add-to-wishlist-before_image .yith-wcwl-add-to-wishlist{
left: auto;
right:10px;
}
.page-store {
color:#000;
}
.page-store .option-chos {
background-color: #FFF4F1;
padding: 10px;
height: 100%;
}
.iFrameMap iframe{
border-radius: 10px;
}
.page-store .option-chos .group-option .group-city,
.page-store .option-chos .group-option .group-district {
margin-bottom:10px;
position:relative;
width:100%;
-ms-flex:0 0 100%;
flex:0 0 100%;
max-width:100%;
}
.page-store .option-chos .group-option .group-city select,
.page-store .option-chos .group-option .group-district select {
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
background-position:right center;
background-repeat:no-repeat;
background-position:right 10px center;
padding-right:28px;
text-indent:0.01px;
text-overflow:'';
cursor:pointer;
font-size:14px;
font-weight:500;
padding:5px 20px 5px 12px;
border-radius:5px;
width:100%;
height:35px;
border:1px solid var(--mainColor);
outline:none !important;
}
.page-store .option-chos .group-option .group-city select option,
.page-store .option-chos .group-option .group-district select option {
background-color:#fff;
color:#000;
}
.page-store .option-chos .group-option .group-city select#city,
.page-store .option-chos .group-option .group-district select#city {
background-image:url(img/ico-select2.png?1772264861552);
background-size: auto;
}
.page-store .option-chos .group-option .group-city select#district,
.page-store .option-chos .group-option .group-district select#district {
background-color:#fff;
color:#000;
background-image:url(img/ico-select2.png?1772264861552);
background-size: auto;
}
ul li.bullet-arrow:before, ul li.bullet-checkmark:before, ul li.bullet-star:before {
color: var(--fs-color-secondary);
}
.page-store .option-chos .info-store {
overflow:hidden;
overflow-y:auto;
max-height: 500px;
}
@media (max-width:991px) {
.page-store .option-chos .info-store {
height:auto;
max-height:250px;
}
}
.page-store .option-chos .info-store::-webkit-scrollbar {
width:5px;
background-color:var(--mainColor);
}
.page-store .option-chos .info-store::-webkit-scrollbar-thumb {
border-radius:5px;
-webkit-box-shadow:inset 0 0 2px rgba(0,0,0,0.3);
-moz-box-shadow:inset 0 0 2px rgba(0,0,0,0.3);
background-color:var(--mainColor);
}
.page-store .option-chos .info-store::-webkit-scrollbar-track {
-webkit-box-shadow:inset 0 0 2px rgba(0,0,0,0.3);
-moz-box-shadow:inset 0 0 2px rgba(0,0,0,0.3);
border-radius:3px;
background-color:#f5f5f5;
}
.page-store .option-chos .info-store .store-list {
padding: 5px 10px;
line-height: 24px;
border: 1px solid #e1e1e1;
margin-bottom: 10px;
border-radius: 10px;
background: #fff;
font-size: 14px;
}
.page-store .option-chos .info-store .store-list .name-cuahang {
color: var(--mainColor);
font-weight: 700;
margin-bottom: 5px;
display: block;
font-family: "Unbounded", sans-serif;
}
.page-store .option-chos .info-store .store-list .store-name {
position: relative;
display: inline-flex;
width: 100%;
margin-bottom: 10px;
align-items: center;
}
.page-store .option-chos .info-store .store-list .store-name b {
min-width: 30px;
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid #949494;
border-radius: 50%;
margin-right: 10px;
padding: 5px;
margin-right: 10px;
}
.page-store .option-chos .info-store .store-list .store-phone .phone-url {
margin-right: 15px;
color: var(--mainColor);
}
.page-store .option-chos .info-store .store-list .store-url {
background: var(--mainColor);
padding: 5px 20px;
border-radius: 30px;
display: inline-block;
margin-bottom: 5px;
color: #fff;
}
.page-store .option-chos .info-store .store-list .store-url b {
margin-right: 10px;
height: 19px;
}
.page-store .option-chos .info-store .store-list .store-name b path {
fill: var(--mainColor);
}
.page-store .option-chos .info-store .store-list .store-phone {
position: relative;
display: inline-flex;
width: 100%;
margin-bottom: 10px;
align-items: center;
}
.page-store .option-chos .info-store .store-list .store-phone b {
min-width: 30px;
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid #949494;
border-radius: 50%;
margin-right: 10px;
padding: 5px;
}
.page-store .option-chos .info-store .store-list .store-url svg path {
fill: #fff;
stroke: #fff;
}
.page-store .option-chos .info-store .store-list .store-phone b path {
fill: var(--mainColor);
}
.page-store .option-chos .info-store .store-list .store-phone .phone-url {
margin-right:15px;
color:var(--mainColor);
}
.page-store .option-chos .info-store .store-list .store-phone .phone-url:hover {
opacity:0.8;
}
.page-store .option-chos .info-store .store-list:hover,
.page-store .option-chos .info-store .store-list.active {
border-color: var(--mainColor);
}
.page-store .option-chos .info-store .store-list:hover .name-cuahang,
.page-store .option-chos .info-store .store-list.active .name-cuahang {
}
.page-store .option-chos .info-store .store-list .store-phone a{
color: var(--mainColor);
}
.page-store .option-chos .info-store .store-list .store-phone a:hover {
color: var(--subColor);
}
.section_num p{
margin-bottom: 0px;
}
.page-store .wrapcontact {
max-height: 600px;
height:calc(100vh - 20px);
overflow:hidden;
position:-webkit-sticky;
position:sticky;
top:10px;
}
.page-store .wrapcontact iframe {
width:100% !important;
height:100vh !important;
border:none !important;
z-index:0;
position:relative;
overflow:hidden;
}
.page-store .pagebody {
height:calc(100vh - 20px);
overflow:hidden;
position:-webkit-sticky;
position:sticky;
top:10px;
border-radius:5px;
}
.page-store .pagebody iframe {
width:100% !important;
height:100vh !important;
border:none !important;
z-index:0;
position:relative;
overflow:hidden;
}
@media (max-width:991px) {
.page-store .col-left {
margin-bottom:30px;
}
}
.page-store .form-control {
height:35px;
border:1px solid var(--mainColor);
width:100%;
border-radius:5px;
padding:0 10px;
}
.page-store .col-6 {
margin-bottom:15px;
}
.radius img{
border-radius: 5px;
}
.ads a.button {
font-size: 13px;
color: #000;
font-weight: normal;
border-color:var(--primary-color) ;
}
.product-tab ul{
background-color: var(--primary-color);
padding: 10px;
border-radius: 5px;
}
.product-tab ul li a{
border-radius: 5px;
border:1px solid #fff;
color: #fff;
padding: 7px 10px;
font-weight: normal;
font-size: 15px;
}
.product-tab ul li.active a,.product-tab ul li:hover a{
background-color: var(--subColor);
border-color:var(--subColor) ;
color: #000;
}
.feedback .icon-box-text{
padding: 10px;
background-color: #6d0201b5;
}
footer#footer .footer-info .content-contact {
margin-bottom: 8px;
font-weight: 500;
padding-left: 24px;
position: relative;
}
footer#footer .footer-info .content-contact span.list_footer svg {
width: 18px;
height: 18px;
color: var(--subColor);
position: absolute;
top: 4px;
left: 0px;
}
header#header #top-bar .header-promo {
display: flex;
align-items: center;
}
header#header #top-bar .header-promo .notification {
position: relative;
width: 20px;
height: 20px;
margin-right: 8px;
display: flex;
justify-content: center;
align-items: center;
}
header#header #top-bar .header-promo .notification svg {
width: 20px;
height: 20px;
}
header#header #top-bar .header-promo .notification svg path {
fill: var(--subColor);
}
header#header #top-bar .header-promo .js-promo {
text-align: left;
}
header#header #top-bar .header-promo .js-promo>li.promo-item.see-none {
display: none;
}
header#header #top-bar .header-promo .js-promo>li{
margin-bottom: 0px;
}
header#header #top-bar .header-promo .js-promo>li.promo-item.see-block {
display: block;
}
header#header #top-bar .header-promo .js-promo>li.promo-item.flipInX {
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
animation-duration: 1s;
}
header#header #top-bar .header-promo .js-promo>li.promo-item a {
color: #fff;
font-size: 14px;
}
.line-clamp-2-new {
-webkit-line-clamp: 2;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
}
.duration-300 {
transition-duration: .3s;
}
header#header #top-bar .header-promo .js-promo>li.promo-item a span {
color: var(--subColor);
font-weight: 600;
}
header#header #top-bar .header-hotline {
display: flex;
justify-content: end;
}
header#header #top-bar .header-hotline a {
display: flex;
flex-grow: 0;
align-items: center;
}
header#header #top-bar .header-hotline a svg {
width: 30px;
height: 30px;
flex: none;
}
header#header #top-bar .header-hotline a svg path {
fill: var(--subColor);
}
header#header #top-bar .header-hotline a .text-box {
color: #fff;
margin-left: 8px;
flex-grow: 1;
line-height: 16px;
position: relative;
text-align: right;
}
header#header #top-bar .header-hotline a .text-box .acc-text-small {
width: 100%;
font-size: 11px;
display: block;
}
header#header #top-bar .header-hotline a .text-box .acc-text {
font-size: 16px;
width: 100%;
font-weight: 700;
}
@-webkit-keyframes fadeIn{0%{opacity:0}to{opacity:1}}
@keyframes fadeIn{0%{opacity:0}to{opacity:1}}
header#header #topbar {
border-bottom: 1px solid rgba(253, 201, 125, 0.4);
}
header#header #wide-nav {
border-top: 1px solid rgba(253, 201, 125, 0.4);
box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
}
.header-vertical-menu__opener:before {
position: absolute;
display: block;
border: 1px solid #fff;
opacity: .5;
transition: opacity 0.3s cubic-bezier(0.37, 0.01, 0, 0.98);
z-index: 10;
content: "";
top: 4px;
left: 4px;
right: 4px;
bottom: 4px;
}
header .header-vertical-menu__opener .icon-menu{
background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 0H1C0.734784 0 0.48043 0.105357 0.292893 0.292893C0.105357 0.48043 0 0.734784 0 1V7C0 7.26522 0.105357 7.51957 0.292893 7.70711C0.48043 7.89464 0.734784 8 1 8H7C7.26522 8 7.51957 7.89464 7.70711 7.70711C7.89464 7.51957 8 7.26522 8 7V1C8 0.734784 7.89464 0.48043 7.70711 0.292893C7.51957 0.105357 7.26522 0 7 0V0ZM6 6H2V2H6V6ZM17 0H11C10.7348 0 10.4804 0.105357 10.2929 0.292893C10.1054 0.48043 10 0.734784 10 1V7C10 7.26522 10.1054 7.51957 10.2929 7.70711C10.4804 7.89464 10.7348 8 11 8H17C17.2652 8 17.5196 7.89464 17.7071 7.70711C17.8946 7.51957 18 7.26522 18 7V1C18 0.734784 17.8946 0.48043 17.7071 0.292893C17.5196 0.105357 17.2652 0 17 0V0ZM16 6H12V2H16V6ZM7 10H1C0.734784 10 0.48043 10.1054 0.292893 10.2929C0.105357 10.4804 0 10.7348 0 11V17C0 17.2652 0.105357 17.5196 0.292893 17.7071C0.48043 17.8946 0.734784 18 1 18H7C7.26522 18 7.51957 17.8946 7.70711 17.7071C7.89464 17.5196 8 17.2652 8 17V11C8 10.7348 7.89464 10.4804 7.70711 10.2929C7.51957 10.1054 7.26522 10 7 10ZM6 16H2V12H6V16ZM14 10C11.794 10 10 11.794 10 14C10 16.206 11.794 18 14 18C16.206 18 18 16.206 18 14C18 11.794 16.206 10 14 10ZM14 16C12.897 16 12 15.103 12 14C12 12.897 12.897 12 14 12C15.103 12 16 12.897 16 14C16 15.103 15.103 16 14 16Z' fill='%23FFF'/%3E%3C/svg%3E");
background-size: contain;
background-repeat: no-repeat;
width: 20px;
height: 20px;
margin-top: 5px;
}
header .header-vertical-menu__opener .icon-menu:before{
content: "";
}
header .header-vertical-menu__title{
text-transform: uppercase;
font-size: 16px;
font-weight: bold;
}
#wide-nav .header-bottom-nav.nav > li > a:before {
content: "";
height: 2px;
width: 0px;
position: absolute;
bottom: 4px;
left: 50%;
transform: translateX(-50%);
background: var(--subColor);
transition: all 200ms linear 0s;
}
#wide-nav .header-bottom-nav.nav > li:hover > a:before,#wide-nav .header-bottom-nav.nav > li.current-menu-item > a:before {
width: 30px;
}
#wide-nav .header-bottom-nav.nav-left{
margin-right: 40px;
}
.nav-dropdown-has-arrow #wide-nav li.has-dropdown:after, .nav-dropdown-has-arrow #wide-nav li.has-dropdown:before{
display: none !important;
}
.col-list-cate .menu-list {
display: flex;
flex-wrap: wrap;
justify-content: center;
column-gap: 16px;
row-gap: 10px;
margin-bottom: 16px;
}
.col-list-cate .menu-list .cate-item {
width: auto;
flex: 0 0 auto;
padding: 4px 20px;
text-align: center;
border: 1px solid var(--mainColor);
position: relative;
}
.col-list-cate .menu-list .cate-item:before {
content: "";
width: 9px;
height: 9px;
border: 1px solid var(--mainColor);
background: #fff;
position: absolute;
top: calc(50% - 3px);
left: -5px;
transform: rotate(45deg);
}
.col-list-cate .menu-list .cate-item .cate-info-title {
font-size: 15px;
font-weight: 600;
line-height: initial;
}
.col-list-cate .menu-list .cate-item:hover:before {
background: var(--subColor);
}
.col-list-cate .menu-list .cate-item:hover {
color: #fff;
background: var(--mainColor);
}
.section_services .info {
text-align: center;
display: block;
vertical-align: middle;
text-align: center;
margin-bottom: 0px;
margin-top: 0;
flex-grow: 1;
max-width: calc(100% - 80px);
margin: 0 auto;
}
.dark, .dark p, .dark td {
color: #ffffff;
}
.section_feedback:before{
content: "";
display: block;
width: 100%;
height: 300px;
background-color: var(--mainColor);
background-image: url(img/section_feedback_bg.jpg?1758009477818);
background-repeat: no-repeat;
background-size: auto;
background-position: center;
position: absolute;
top: 0;
left: 0;
}
.section_feedback .icon-box{
padding-top: 50px;
height: 100%;
}
.section_feedback .icon-box .icon-box-img{
overflow: hidden;
border-radius: 50%;
flex: none;
position: absolute;
left: 20px;
top: 10px;
margin-bottom: 0px;
z-index: 1;
border: 2px solid #fff;
}
.section_feedback .icon-box .icon-box-text span {
display: block;
color: #757575;
}
.section_feedback .icon-box .icon-box-text b {
font-size: 18px;
display: block;
line-height: normal;
}
.section_feedback .icon-box .icon-box-text:before {
content: "";
display: block;
width: 80px;
height: 80px;
position: absolute;
top: 20px;
right: 20px;
opacity: 0.2;
background-image: url(img/quote.svg?1758009477818);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.section_feedback .icon-box .icon-box-text {
padding: 20px;
padding-top: 46px;
background: #fff;
height: 100%;
position: relative;
box-shadow: rgba(60, 64, 67, 0.1) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
}
.box-shadow-1, .box-shadow-1-hover:hover, .row-box-shadow-1 .col-inner, .row-box-shadow-1-hover .col-inner:hover{
box-shadow: rgba(60, 64, 67, 0.1) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
}
.dark .sub-title{
color: #fff;
}
.dark .section-title2 .title-separator .separator-center:before {
border: 1px solid var(--subColor);
}
.dark .section-title2 .title-separator .separator-center:after {
border: 1px solid var(--subColor);
}
.dark .section-title2 .title-separator .title-separator:before {
background: var(--subColor);
}
.dark .section-title2 .title-separator:after {
background: var(--subColor);
}
.dark .section-title2 .title-separator:before {
background: var(--subColor);
}
.section_about .product-content {
text-align: center;
padding: 28px 20px;
background: rgba(0, 0, 0, 0.2);
position: relative;
z-index: 1;
}
.button.secondary{
color: var(--mainColor);
}
.button.secondary:before{
border: 1px solid var(--mainColor);
}
.button, button, input[type=button], input[type=reset], input[type=submit]{
font-weight: normal;
}
.nav-dropdown-has-border .nav-dropdown {
border-width: 1px;
}
.section_about .product-content:before {
position: absolute;
display: block;
border: 1px solid var(--subColor);
opacity: .5;
z-index: -1;
content: "";
top: 8px;
left: 8px;
right: 8px;
bottom: 8px;
}
.main-widget {
position:fixed;
right:14px;
bottom:20px;
z-index:99;
top:auto !important;
}
@media (max-width:767px) {
.main-widget {
bottom:56px;
}
}
.main-widge .img svg {
width:100%;
height:100%;
}
.main-widget .img {
width:25px;
height:25px;
}
.main-icon svg {
width:20px;
height:20px;
fill:#fff;
margin-bottom:5px;
}
.main-icon p {
font-size:11px;
color:#fff;
margin:0;
}
.out-circle {
overflow:hidden;
padding:17px;
border-radius:100%;
background:var(--mainColor);
width:60px;
height:60px;
}
.main-icon {
line-height:0;
color:#fff;
width:100%;
height:32px;
display:block;
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
text-align:center;
}
.main-icon i {
width:26px;
height:26px;
transform:translateX(2px);
}
.ser-icon {
display:inline-flex;
position:absolute;
font-size:30px;
top:0;
left:0;
padding:10%;
background:#fff;
max-width:100%;
overflow:hidden;
border-radius:100%;
color:var(--mainColor);
width:70%;
height:70%;
margin:15%;
transition:.2s all;
}
.unsee {
opacity:0;
transform:scale(0);
}
.process {
display:inline-flex;
transform:translateX(0px);
transition:0.15s linear transform;
line-height:0;
}
.ser-icon .item {
margin-right:40px;
width:30px;
height:30px;
color:var(--mainColor);
display:flex;
justify-content:center;
align-items:center;
}
.ser-icon .item svg {
width:25px;
height:25px;
color:var(--mainColor);
}
.ser-icon i:nth-child(2n) {
color:#000;
}
.radius img{
border-radius: 10px;
}
.def-content {
position:absolute;
bottom:62px;
right:0;
background:#fff;
border-radius:8px;
transition:.2s all;
box-shadow:0 0 10px rgba(0,0,0,0.2);
width:300px;
z-index:1;
}
.def-content:before {
position:absolute;
bottom:-8px;
right:22px;
left:auto;
display:inline-block !important;
border-right:8px solid transparent;
border-top:8px solid #fff;
border-left:8px solid transparent;
content:'';
}
.def-content .def-header {
background:var(--mainColor);
padding:10px;
border-radius:8px 8px 0 0;
color:#fff;
position:relative;
}
.def-content .def-header .close-icon {
display:flex;
justify-content:center;
align-items:center;
position:absolute;
right:10px;
top:10px;
left:initial;
padding:0;
margin:0;
border:0 none;
background:none;
line-height:1;
width:26px;
height:26px;
cursor:pointer;
color:#fff;
background:var(--mainColor);
border-radius:50%;
text-align:center;
}
.def-content .item>a {
display:flex;
justify-content:space-between;
align-items:center;
width:100%;
padding:5px 10px;
transition:.3s linear all;
}
.def-content .item>a .img {
flex-grow:0;
flex:none;
height:34px;
width:34px;
display:flex;
justify-content:center;
align-items:center;
margin-right:10px;
border-radius:50%;
color:#fff !important;
}
.def-content .item>a .img svg {
height:20px;
width:20px;
}
.def-content .item>a .detail {
flex-grow:1;
line-height:normal;
}
.def-content .item>a .detail .arcu-item-title {
font-weight:700;
font-size:14px;
display:block;
line-height:normal;
}
.def-content .item>a .detail .arcu-item-subtitle {
font-size:13px;
color:#787878;
}
.def-content .item.phone>a .img {
background:#4EB625;
}
.def-content .item.mess>a .img {
background:#31ADFF;
}
.def-content .item.zalo>a .img {
background:#0165f8;
}
.def-content .item.map>a .img {
background:#d94234;
}
.def-content .item:last-child {
margin-bottom:0;
}
.main-widget .close-icon {
display:flex;
justify-content:center;
align-items:center;
position:absolute;
font-size:25px;
top:0;
padding:10px;
left:0;
width:60px;
height:60px;
line-height:1;
text-align:center;
color:#fff;
background:var(--mainColor);
border-radius:100%;
transition:.2s all;
transform:rotate(0);
cursor:pointer;
}
.main-widget .close-icon svg {
width:25px;
height:25px;
}
.close-icon.unsee {
transform:rotate(180deg);
}
.pregan {
position:absolute;
width:100%;
height:100%;
left:0;
top:0;
background:#003f32;
z-index:-2;
border-radius:100%;
opacity:0.6;
animation:zoomzoom 3s linear .2s infinite;
}
.pregan:nth-child(1) {
animation-delay:.5s;
}
.main-widget .item svg {
fill:var(--mainColor);
}
header .button-promo {
flex: none;
flex-grow: 0;
max-width: 200px;
padding-left: 12px;
}
header .button-promo a {
display: flex;
align-items: center;
padding: 0px 16px 0 40px;
line-height: 30px;
background: linear-gradient(#FCBD57, #FBE79F);
font-weight: 600;
position: relative;
border-radius: 40px;
}
header .button-promo a img {
position: absolute;
top: -2px;
left: -2px;
width: 34px !important;
height: 34px !important;
margin-right: 6px;
-webkit-animation: playnow 2000ms infinite;
-moz-animation: playnow 2000ms infinite;
-o-animation: playnow 2000ms infinite;
animation: playnow 2000ms infinite;
}
header .button-promo a:hover {
color: var(--mainColor);
filter: brightness(1.1);
}
@media only screen and (min-width: 48em) {
.sort-cate .sort-cate-right ul li:hover a:before, .sort-cate .sort-cate-right ul li.active a:before {
background: var(--subColor);
}
}
@media only screen and (max-width: 48em) {
footer .footer-top .icon-box{
display: flex;
flex-flow: column;
justify-content: center;
align-items: center;
grid-gap: 0px;
}
footer .footer-top {
margin-top: 20px;
margin-bottom: 20px;
}
footer .footer-top .icon-box .icon-box-text{
text-align: center;
padding-left: 0px;
}
footer#footer .title-menu {
margin-top: 0px;
padding-top: 0px;
position: relative;
}
footer#footer .clicked h4::before, footer#footer .clicked h4::after {
position: absolute;
content: '';
top: 50%;
right: 0;
-webkit-transform: translate(-50%, -50%) rotate(-90deg);
transform: translate(-50%, -50%) rotate(-90deg);
background-color: currentColor;
-webkit-transition: opacity 0.4s ease-in-out, -webkit-transform 0.4s ease-in-out;
transition: opacity 0.4s ease-in-out, -webkit-transform 0.4s ease-in-out;
transition: transform 0.4s ease-in-out, opacity 0.4s ease-in-out;
transition: transform 0.4s ease-in-out, opacity 0.4s ease-in-out, -webkit-transform 0.4s ease-in-out;
}
footer#footer .clicked h4::before {
width: 11px;
height: 1.5px;
opacity: 1;
}
footer#footer .clicked h4::after {
width: 1.5px;
height: 11px;
right: 10px;
}
footer#footer .clicked.cls_mn h4::after {
-webkit-transform: translate(-50%, -50%) rotate(90deg);
transform: translate(-50%, -50%) rotate(90deg);
}
footer#footer .clicked.cls_mn h4::before {
opacity: 0;
}
footer#footer .ux-menu {
display: none;
}
.header-bottom {
background-color: #ffffff00 !important;
}
#woocommerce-product-search-field-1{
font-size: 14px;
}
header .searchform .button.icon {
height: 36px;
min-height: 36px;
line-height: 36px;
width: 36px;
font-size: 13px;
}
header .account-item > a{
height: 40px;
}
.header-main .nav.mobile-nav > li.has-icon > a {
line-height: 16px;
color: var(--mainColor);
font-size: 16px;
padding: 0px;
}
.row-slider .flickity-prev-next-button {
background-color: transparent !important;
width: 36px !important;
height: 36px !important;
transition: transform 0.3s;
background-color: var(--primary-color) !important;
min-height: 36px;
top: 45%;
}
.box-category h5.header-title{
font-size: 13px;
}
.shop-page-title{
font-size: 20px;
}
.sort-cate .sort-cate-right h3 {
display: flex;
align-items: center;
padding: 0px 10px;
height: 34px;
font-size: 13px;
color: var(--textColor);
background-color: #eeeeee;
font-weight: 600;
min-width: 100px;
text-align: center;
margin: 0px;
border-radius: 10px;
}
.sort-cate .sort-cate-right ul {
display: none;
position: absolute;
z-index: 99;
background-color: #fff;
top: calc(100% + 5px);
min-width: 155px;
text-align: left;
box-shadow: 2px 3px 7px 0 rgba(0, 0, 0, 0.2);
padding: 10px;
}
.sort-cate .sort-cate-right ul li {
float: none;
display: block;
padding-left: 0;
width: 100%;
text-align: center;
}
.sort-cate .sort-cate-right ul li a {
padding: 4px 10px;
}
.sort-cate .sort-cate-right ul li:hover a,.sort-cate .sort-cate-right ul li.active a {
background: var(--mainColor);
color: #fff;
}
.sort-cate .sort-cate-right ul li+li {
margin-top: 10px;
}
.category-filtering{
display: none;
}
.header-main .nav > li.cart-item > a .header-cart-icon{
margin-bottom: 0px;
}
.col-list-cate .menu-list {
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
overflow-x: auto;
scroll-snap-type: x mandatory;
width: auto;
margin-right: -14px;
margin-left: -14px;
padding-left: 14px;
padding-right: 14px;
justify-content: start;
}
.col-list-cate .menu-list .cate-item .cate-info-title {
font-size: 13px;
}
.page-title:not(.featured-title)+main .product-main{
padding: 5px;
}
.product-main > .content-row{
padding: 0px;
}
.tabbed-content .nav-simple,.scrollmobile{
max-width: 100%;
overflow-x: auto;
overflow-y: hidden;
white-space: nowrap;
padding: 0;
margin: 0;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
margin-bottom: -10px;
text-align: center;
-webkit-mask: linear-gradient(90deg, transparent 0, #000 10px, #000 calc(100% - 10px), transparent 100%);
display: block;
}
.scrollmobile > .col-inner > .icon-box{
font-size: 14px;
display: inline-block;
text-align: center;
width: 50%;
}
.scrollmobile > .col-inner > .icon-box > .icon-box-img{
margin:auto;
max-width:60px
}
.scrollmobile > .col-inner > .icon-box > .icon-box-img .icon{
max-width:60px;
height:60px;
padding:10px
}
}
/* css mới */
.mobile-nav.nav.nav-right {
border: 1px solid var(--mainColor);
background-color: #fff;
padding: 0px 10px;
border-radius: 15px;
}
.mobile-nav.nav.nav-right > li{
display: flex;
}
[data-icon-label]:after {
background-color: var(--mainColor);
box-shadow: none;
right: -5px;
top: 5px;
}
.topbarhea{
background-color: #fff;
height: 50px;
line-height: 50px;
font-size: 14px;
}
.topbarhea .container {
max-width: 1920px;
}
.topbarhea .marquee-container {
position: relative;
overflow: hidden;
}
.topbarhea .marquee-container .marquee {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
width: max-content;
white-space: nowrap;
position: relative;
direction: ltr;
}
.topbarhea .marquee-container .marquee .marquee-content {
flex-shrink: 0;
align-items: center;
display: flex;
animation: marquee-left 25s linear infinite;
}
.topbarhea .marquee-container .marquee .marquee-content .marquee-item {
margin-bottom: 0px;
}
.topbarhea .marquee-container .marquee .marquee-content .me-3 {
margin-right: 1rem !important;
}
.align-items-center {
-ms-flex-align: center !important;
align-items: center !important;
}
.topbarhea .marquee-container .marquee .marquee-content .marquee-item+.marquee-item:before {
content: "";
height: 18px;
width: 18px;
border-radius: 50%;
background-color: #fff;
display: inline-flex;
margin-right: 16px;
background: url(img/star.svg?1774486840990) no-repeat center / contain;
}
header#header .box_icon_left {
display: flex;
justify-content: end;
align-items: center;
gap: 5px;
border: 1px solid var(--mainColor);
background-color: var(--mainColor);
padding: 4px 10px;
border-radius: 15px;
}
header#header .box_icon_left .sudes-header-support {
display: inline-block;
position: relative;
transition: color 0.2s ease-in-out;
}
header#header .box_icon_left .sudes-header-support>a {
display: flex;
flex-wrap: wrap;
justify-content: center;
flex-direction: column;
color: #000;
}
header#header .box_icon_left .sudes-header-support>a .box-icon {
text-align: center;
position: relative;
display: inline-flex;
justify-content: center;
align-items: center;
width: 145px;
height: 40px;
}
header#header .box_icon_left .sudes-header-support>a .box-icon span {
font-size: 15px;
text-align: left;
font-family: "Unbounded", sans-serif;
color: #fff;
line-height: 1.4;
margin-left: 5px;
font-weight: normal;
}
header#header .box_icon_left:hover {
border: 1px solid var(--subColor);
background-color: var(--subColor);
}
header:not(.transparent) .header-wrapper:not(.stuck) #masthead > .header-inner {
background-color: #E5E5E5;
padding:0px 10px;
border-radius: 20px;
}
.header-nav-main.nav-right{
display: flex;
justify-content: end;
align-items: center;
gap: 5px;
border: 1px solid var(--mainColor);
background-color: #fff;
padding: 0px 15px;
border-radius: 15px;
}
.nav>li.html.html_topbar_left{
position: absolute;
right: 20px;
}
.header-nav-main.nav-right.nav-spacing-xlarge>li {
margin: 0 5px;
}
footer#footer .footer-center{
border-radius: 40px;
}
.radius .message-box-bg-overlay,.radius.message-box{
border-radius: 20px;
}
.box_form form {
text-align: center;
max-width: 650px;
margin: 0 auto;
}
.box_form form input[type="email"] {
height: 60px;
width: 100%;
min-width: 340px;
max-width: 100%;
padding: 0 100px 0 10px;
outline: none;
font-size: 16px;
border-radius: 40px;
margin: 0px;
background-color: #D9D9D9;
}
.box_form form input.wpcf7-submit {
position: absolute;
right: 0;
top: 0;
border: initial;
height: 60px;
font-size: 16px;
padding: 0 25px;
background: var(--mainColor);
color: #fff;
border-radius: 40px;
line-height: 60px;
font-weight: 700;
margin: 0px;
}
.wpcf7-spinner{
display: none;
}
@keyframes marquee-left{0%{transform:translateX(0%)}100%{transform:translateX(-100%)}}
.topbarhea .marquee-container:hover .marquee-content {
animation-play-state: paused;
}
.bread-crumb_new {
margin-bottom: 40px;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
display: flex;
align-items: flex-end;
padding: 100px 0;
position: relative;
z-index: 1;
min-height: 620px;
border-radius: 40px;
overflow: hidden;
}
.bread-crumb_new .title-bread-crumb {
font-size: 35px;
color: var(--textColor);
font-weight: 700;
font-size: 32px;
font-family: "Unbounded", sans-serif;
}
.breadcrumbs a {
color: rgb(0 0 0);
}
.breadcrumbs .divider, .breadcrumbs .separator {
font-weight: 300;
margin: 0 .3em;
opacity: 1;
position: relative;
top: 0;
}
body.archive header#header,body.category header#header,body.home header#header{
position: absolute;
top: 80px;
}
body.archive .header-wrapper:not(.stuck) .header-bg-color,body.category .header-wrapper:not(.stuck) .header-bg-color,body.home .header-wrapper:not(.stuck) .header-bg-color {
background-color: #ffffff00 !important;
}
body.home header:not(.transparent) .header-wrapper:not(.stuck) #masthead > .header-inner,body.archive header:not(.transparent) .header-wrapper:not(.stuck) #masthead > .header-inner,body.category header:not(.transparent) .header-wrapper:not(.stuck) #masthead > .header-inner {
background-color: rgba(255, 255, 255, 0.8);
}
.khuyen-mai {
margin-bottom: 15px;
overflow: hidden;
border: 2px dashed var(--mainColor);
padding: 15px;
border-radius: 20px;
}
.khuyen-mai .title {
font-size: 16px;
margin-bottom: 10px;
font-weight: 600;
display: flex;
align-items: center;
color: var(--mainColor);
}
.khuyen-mai .title svg {
width: 24px;
height: 24px;
margin-right: 7px;
}
.khuyen-mai .content ul li {
display: block;
margin-bottom: 10px;
align-items: center;
position: relative;
padding-left: 18px;
margin-left: 0px;
}
.khuyen-mai .content ul li:before {
content: "";
position: absolute;
background-image: url(img/checkernew.png?1774486840990);
display: inline-block;
min-width: 12px;
min-height: 12px;
top: 5px;
left: 0px;
}
.box_info_cs {
padding: 18px 10px 10px 10px;
margin-bottom: 15px;
border: 1px solid #E5E5E5;
margin-top: 25px;
position: relative;
border-radius: 20px;
}
.box_info_cs h2 {
font-size: 16px;
font-weight: 400;
padding: 5px 8px;
background: #fff;
position: absolute;
top: -12px;
left: 15px;
display: flex;
align-items: center;
gap: 5px;
line-height: 10px;
width: auto;
}
.box_info_cs .chinhsach-pro {
gap: 10px;
grid-template-columns: repeat(4, 1fr);
display: grid;
overflow: auto;
justify-content: start;
margin-bottom: 10px;
font-size: 14px;
}
.box_info_cs .chinhsach-pro li {
position: relative;
width: 100%;
display: flex;
align-items: center;
background-color: #F5F5F5;
padding: 10px 20px;
border-radius: 10px;
line-height: 1.4;
}
.box_info_cs .chinhsach-pro li img {
width: 40px;
margin-right: 10px;
}
.box_info_cs .hotline_product {
background-color: var(--mainColor);
text-align: center;
color: #fff;
font-size: 16px;
font-weight: 400;
display: flex;
justify-content: center;
align-items: center;
padding: 5px;
border-radius: 10px;
margin-bottom: -10px;
margin-left: -10px;
margin-right: -10px;
}
.box_info_cs .hotline_product svg {
margin-right: 5px;
}
.box_info_cs .hotline_product a {
font-size: 18px;
font-weight: 700;
font-family: "Unbounded", sans-serif;
-webkit-animation: my 700ms infinite;
-moz-animation: my 700ms infinite;
-o-animation: my 700ms infinite;
animation: my 700ms infinite;
margin: 0px 5px;
}
@keyframes my{0%{color:#fff}40%{color:var(--subColor)}100%{color:#fff}}
.woocommerce-tabs.wc-tabs-wrapper{
background-color: #F2F2F2;
padding: 40px;
border-radius: 40px;
margin-bottom: 40px;
}
.product-footer .woocommerce-tabs ul li a {
color: #000;
margin: 0;
font-size: 34px;
font-weight: 400;
padding: 10px 0px;
position: relative;
margin-right: 15px;
font-family: "Unbounded", sans-serif;
text-transform: uppercase;
margin-bottom: 0px;
}
.product-footer .woocommerce-tabs>.nav-line-grow, .product-footer .woocommerce-tabs>.nav-line:not(.nav-vertical) {
margin-top: 0px;
}
span.amount {
color: var(--price);
font-family: Unbounded, sans-serif;
}
.price del ,del span.amount {
color: #a6a6a6;
font-weight: 500;
}
.woocommerce-tabs img{
border-radius: 10px;
}
.product_slider_index {
display: block;
margin-bottom: 20px;
width: 595px;
}
.product_slider_index .slider-featured {
position: relative;
margin-bottom: 15px;
color: var(--textColor);
}
.slider-featured .featured-item {
width: 380px;
display: flex;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
border-radius: 20px;
overflow: hidden;
padding: 13px;
align-items: center;
background: #fff;
justify-content: end;
transition: 500ms all;
}
.slider-featured .featured-item.slide_1 {
position: relative;
left: 0;
top: 0;
z-index: 3;
}
.slider-featured .featured-item.slide_2 {
position: absolute;
left: 16%;
top: 0;
z-index: 2;
}
.slider-featured .featured-item.slide_3 {
position: absolute;
left: 32%;
top: 0;
z-index: 1;
}
.slider-featured .featured-item.featured-hidden {
width: 85px;
}
.slider-featured .featured-item .info {
width: 230px;
padding-right: 13px;
position: absolute;
top: 13px;
left: 13px;
bottom: 13px;
display: flex;
align-items: center;
}
.slider-featured .featured-item .thumb {
width: 147px;
height: 0;
overflow: hidden;
padding-top: 184px;
position: relative;
background: #e9e9e9;
border-radius: 20px;
}
.slider-featured .featured-item .info .frame .title {
font-size: 20px;
font-weight: 600;
margin-bottom: 10px;
}
.slider-featured .featured-item .info .frame .type {
font-size: 16px;
font-weight: 400;
margin-bottom: 20px;
display: block;
}
.slider-featured .featured-item .info .frame .seemore {
padding: 5px 15px;
background: #E5E5E5;
border-radius: 30px;
display: inline-flex;
gap: 5px;
font-size: 16px;
font-weight: 400;
align-items: center;
color: var(--textColor);
}
.slider-featured .featured-item .info .frame .seemore svg {
width: 13px;
}
.slider-featured .featured-item.featured-hidden .info {
display: none;
}
.slider-featured .featured-item .thumb img {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
width: 100%;
height: 100%;
object-fit: cover;
}
.product_slider_index .slider-action {
width: 96%;
display: flex;
align-items: center;
gap: 10px;
}
.product_slider_index .slider-action .action-progress {
width: calc(100% - 80px);
height: 1px;
position: relative;
background: #fff;
}
.product_slider_index .slider-action .action-progress .progress-active {
background: #000;
height: 1px;
transition: 0.5s all;
}
.product_slider_index .slider-action .action-button {
width: 70px;
display: flex;
gap: 10px;
}
.product_slider_index .slider-action .action-button button {
width: 30px;
height: 30px;
line-height: 30px;
border-radius: 50%;
border: none;
background: #fff;
padding: 0;
min-width: 30px;
min-height: 30px;
margin: 0px;
}
.product_slider_index .slider-action .action-button button.btn-disable {
cursor: pointer;
opacity: 0.5;
}
.product_slider_index .slider-action .action-button button {
width: 30px;
height: 30px;
line-height: 30px;
border-radius: 50%;
border: none;
background: #fff;
padding: 0;
}
.product_slider_index .slider-action .action-button button:hover {
background: var(--mainColor);
}
.product_slider_index .slider-action .action-button button:hover svg path {
fill: #fff;
}
.product_slider_index .slider-featured .featured-item .info .frame .seemore svg path {
fill: var(--textColor);
}
.product_slider_index .slider-featured .featured-item .info .frame .seemore:hover {
background: var(--mainColor);
color: #fff;
}
.product_slider_index .slider-featured .featured-item .info .frame .seemore:hover svg path {
fill: #fff;
}
.banner.radius40{
border-radius: 40px;
overflow: hidden;
}
.banner.radius35{
border-radius: 35px;
overflow: hidden;
}
.unboun {
font-family: "Unbounded", sans-serif;
}
.number p:before {
content: "";
width: 100%;
height: 3px;
position: absolute;
bottom: -3px;
left: 0px;
background-image: url(img/objects.svg?1758537990588);
background-repeat: no-repeat;
background-size: 100%;
}
.number p{
display: inline-block;
position: relative;
}
.banner h5, .banner h6, .banner p {
margin-bottom: 10px;
margin-top: 10px;
padding: 0;
}
.section_services h3 {
font-size: 22px;
font-weight: 600;
margin: 0px;
margin-bottom: 3px;
line-height: initial;
color: #fff;
font-family: "Unbounded", sans-serif;
}
.section_flash_sale .section-title-flash .box_title_flash h2 a {
color: var(--mainColor);
}
.section_flash_sale .section-title-flash .box_title_flash .icon-box-img img {
max-width: 68px;
-webkit-animation: zoom-in-out 1500ms infinite;
-moz-animation: zoom-in-out 1500ms infinite;
-o-animation: zoom-in-out 1500ms infinite;
animation: zoom-in-out 1500ms infinite;
}
.section_flash_sale .section-title-flash .box_title_flash h2 {
font-size: 30px;
font-weight: 800;
display: inline-block;
position: relative;
margin-bottom: 0px;
font-family: "Unbounded", sans-serif;
}
.section_flash_sale .section-title-flash .box_title_flash .content-module {
margin-bottom: 0px;
font-size: 16px;
font-weight: 400;
display: block;
line-height: 1;
color: var(--textColor);
}
.section_flash_sale .section-title-flash {
background-image: url(img/bg_flash_sale_title.jpg?1774486840990);
background-size: 100% 100%;
border-radius: 40px 40px 0px 0px;
border: 1px solid var(--mainColor);
}
.section_flash_sale .box_product_flash {
padding: 20px;
padding-top: 40px;
margin-top: -35px;
background-color: #fff;
border-radius: 40px;
border: 1px solid var(--mainColor);
position: relative;
}
.bloghome .box-blog-post .box-image {
border-radius: 20px 20px 0px 0px;
overflow: hidden;
}
.bloghome .box-blog-post .box-text{
border-radius: 0px 0px 20px 20px;
}
.button .icon-angle-right {
background-color: #ffffff;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
margin-right: -18px !important;
margin-top: -12px;
margin-bottom: -10px !important;
margin-left: 20px;
transition: 0.3s all;
right: 0px;
top: 0px;
height: 36px;
width: 36px !important;
}
.ux-swatches--x-small .ux-swatch--label {
font-size: 11px;
background-color: #e2e2e2;
}
.button.white .icon-angle-right {
background-color: var(--mainColor);
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 50%;
margin-right: -22px !important;
margin-top: -13px;
margin-bottom: -10px !important;
margin-left: 20px;
transition: 0.3s all;
right: 0px;
top: 0px;
height: 36px !important;
width: 36px !important;
}
@keyframes zoom-in-out{0%{transform:scale(0.8, 0.8)}10%,20%{transform:scale3d(0.9, 0.9, 0.9) rotate(-8deg)}30%,50%,70%,90%{transform:scale3d(1, 1, 1) rotate(8deg)}40%,60%,80%{transform:scale3d(1, 1, 1) rotate(-8deg)}100%{transform:scale(0.9)}}
@media(min-width: 992px){
.sort-cate .sort-cate-right ul li a{
border: 1px solid #000;
padding: 6px 15px;
border-radius: 24px;
font-size: 14px;
}
.sort-cate .sort-cate-right ul li:hover a, .sort-cate .sort-cate-right ul li.active a {
border: 1px solid var(--mainColor);
color: #fff;
background: var(--mainColor);
}
}
@media (max-width: 1440px) {
.bread-crumb_new {
padding: 60px 0;
min-height: 440px;
border-radius: 30px;
}
}
@media (max-width: 1025px) {
.bread-crumb_new {
padding: 30px 0;
min-height: 360px;
border-radius: 20px;
}
}
@media (max-width: 992px) {
.bread-crumb_new {
min-height: 280px;
}
}
@media (max-width: 991px) {
.bread-crumb_new {
margin-bottom: 20px;
}
.bread-crumb_new .title-bread-crumb {
font-size: 18px;
}
.product-small.box .price-wrapper .price {
flex-direction: column;
justify-content: flex-end;
}
.product-footer .woocommerce-tabs ul li a{
font-size: 22px;
text-align: center;
}
.woocommerce-tabs.wc-tabs-wrapper {
padding: 20px;
border-radius: 20px;
margin-bottom: 25px;
}
.box_info_cs .chinhsach-pro {
grid-template-columns: repeat(2, 1fr);
}
.box_info_cs .hotline_product {
font-size: 12px;
}
.box_info_cs .hotline_product a {
font-size: 14px;
}
.box_info_cs .chinhsach-pro li {
padding: 7px;
font-size: 13px;
}
.box_info_cs .chinhsach-pro li img {
width: 32px;
margin-right: 7px;
}
.section_services .info {
max-width: 100%;
}
.section_services h3 {
font-size: 16px;
}
.product-small.box .price-wrapper .price del span.amount {
font-size: 13px;
}
.product-small.box .price-wrapper .price {
font-size: 13px;
}
}