.pre-box-views-cart {
display: flex;
align-items: center;
gap: 5px;
}
.pre-box-views-cart .pre-cart-box,
.pre-box-views-cart .pre-views-box {
flex: 1 1 auto;
}
.pre-cart-box,
.pre-views-box {
display: flex;
align-items: center;
width: 100%;
flex: 0 0 auto;
margin-bottom: 5px;
}
.pre-cart-box .btn,
.pre-views-box .btn {
padding: 0 5px;
width: 100%;
}
.pre-views-box {
text-align: var(--pre-views-align);
}
.pre-views-box .btn {
background-color: var(--pre-views-bg);
border: var(--pre-views-border-width) solid var(--pre-views-border);
text-align: var(--pre-cart-align);
}
.pre-views-box .btn span {
color: var(--pre-views-color);
font-family: var(--pre-views-font);
font-size: var(--pre-views-size);
font-weight: var(--pre-views-weight);
}
.pre-views-box .btn:hover {
background-color: var(--pre-views-bg-hover);
border-color: var(--pre-views-border-hover);
}
.pre-views-box .btn:hover span {
color: var(--pre-views-color-hover);
}
.pre-cart-box {
text-align: var(--pre-cart-align);
}
.pre-cart-box .btn {
background-color: var(--pre-cart-bg);
border: var(--pre-cart-border-width) solid var(--pre-cart-border);
text-align: var(--pre-cart-align);
}
.pre-cart-box .btn span {
color: var(--pre-cart-color);
font-family: var(--pre-cart-font);
font-size: var(--pre-cart-size);
font-weight: var(--pre-cart-weight);
}
.pre-cart-box .btn:hover {
background-color: var(--pre-cart-bg-hover);
border-color: var(--pre-cart-border-hover);
}
.pre-cart-box .btn:hover span {
color: var(--pre-cart-color-hover);
}
.product-detail-items-info {
overflow: hidden;
text-align: center;
}
.product-detail-items-info .item-info-wrapper {
position: relative;
display: grid;
grid-template-columns: repeat(var(--prd-item-info-per-row), 1fr);
gap: 10px;
}
.product-detail-items-info .item-info-wrapper .item-info {
position: relative;
overflow: hidden;
text-align: center;
background-position: center;
}
.product-detail-items-info .item-info-wrapper .item-info .item-img {
height: var(--item1-height, 40px);
text-align: center;
}
.product-detail-items-info .item-info-wrapper .item-info .item-img img {
width: auto;
height: 100%;
display: inline-block;
border-radius: 5px;
padding: 5px;
margin-top: 5px;
}
.product-detail-items-info .item-info-wrapper .item-info .item-title {
text-align: center;
padding: 10px;
}
.product-detail-items-info .item-info-wrapper .item-info .item-title p.item-heading {
color: var(--prd-item-info-heading);
font-size: 15px;
font-weight: bold;
margin: 0 0 10px 0;
}
.product-detail-items-info .item-info-wrapper .item-info .item-title p.item-description {
color: var(--prd-item-info-desc);
font-size: 13px;
line-height: 20px;
}
@media (max-width: 768px) {
.product-detail-items-info .item-info-wrapper {
grid-template-columns: repeat(2, 1fr);
}
}
.sale-popup-box {
position: fixed;
z-index: 99999;
opacity: 0;
transition: all 1s;
}
.sale-popup-box.bottomLeft {
left: 10px;
bottom: -120px;
}
.sale-popup-box.bottomRight {
right: 10px;
bottom: -120px;
}
.sale-popup-box.topLeft {
left: 10px;
top: -120px;
}
.sale-popup-box.topRight {
right: 10px;
top: -120px;
}
.sale-popup-box.show {
opacity: 1;
}
.sale-popup-box.show.bottomLeft,
.sale-popup-box.show.bottomRight {
bottom: 20px;
}
.sale-popup-box.show.topLeft,
.sale-popup-box.show.topRight {
top: 20px;
}
@media (max-width: 600px) {
.sale-popup-box {
width: 100%;
}
.sale-popup-box.bottomRight,
.sale-popup-box.topRight {
right: 0;
}
.sale-popup-box.bottomLeft,
.sale-popup-box.topLeft {
left: 0;
}
.sale-popup-box.show.bottomLeft,
.sale-popup-box.show.bottomRight {
bottom: 0;
}
.sale-popup-box.show.topLeft,
.sale-popup-box.show.topRight {
top: 0;
}
}
.sale-popup {
padding: 10px;
background-color: #fff;
border-radius: 10px;
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
width: 500px;
max-width: 100%;
}
.sale-popup .sale-popup-thumb {
width: 110px;
height: 110px;
border-radius: 10px;
overflow: hidden;
background: #cccccc;
}
.sale-popup .sale-popup-thumb img {
width: 100%;
height: 100%;
object-fit: cover;
}
.sale-popup .sale-popup-info {
width: calc(100% - 110px);
padding-left: 10px;
font-size: 12px;
}
.sale-popup .sale-popup-info a {
color: #000;
font-size: 13px;
}
.sale-popup .sale-popup-info .sale-popup-name {
font-weight: bold;
}
.sale-popup .sale-popup-info .sale-popup-title {
font-size: 13px;
font-weight: bold;
color: var(--theme-color);
line-height: 10px;
}
.sale-popup .sale-popup-info .sale-popup-address {
font-style: italic;
}
.sale-popup .sale-popup-info .sale-popup-time {
color: #7F7F7F;
font-weight: 500;
margin-right: 10px;
}
.sale-popup .sale-popup-info-footer span {
display: inline-block;
}
header .header-content {
padding: var(--header-padding);
}
header .header-grid {
display: grid;
gap: var(--bs-gutter-x);
grid-template-columns: var(--header-layout-grid);
padding: 0;
}
header .logo img {
max-height: var(--header-logo-height);
}
header .search {
padding-top: 0;
}
header .search .form-search {
border-color: var(--header-search-br-color);
background-color: var(--header-search-bg-color);
border-radius: var(--header-search-radius);
}
header .search .form-search .form-group {
width: var(--search-input-width);
}
header .search .form-search .form-group .form-control {
background-color: var(--header-search-bg-color);
height: 45px;
}
header .search .form-search .btn-search {
width: var(--header-search-btn-width);
background-color: var(--header-search-btn-bg-color);
color: var(--header-search-btn-txt-color);
border: 2px solid var(--header-search-btn-bg-color);
line-height: 41px !important;
}
header .hotline {
display: flex;
justify-content: start;
gap: 10px;
}
header .hotline .hotline__icon {
height: 40px;
width: 40px;
line-height: 40px;
text-align: center;
}
header .hotline .hotline__icon img {
width: 33px;
}
header .hotline .hotline__title {
text-align: left;
}
header .hotline .hotline__title p {
margin: 0;
color: var(--header-hotline-color-heading);
line-height: 19px;
}
header .hotline .hotline__title p.hotline__phone {
color: var(--header-hotline-color-phone);
font-size: 18px;
}
header .cart-top .btn-cart-top {
margin-top: 0;
}
header .cart-top img {
width: 33px;
}
.navigation-grid {
display: grid;
align-items: start;
grid-template-columns: var(--nav-layout-grid);
}
@media (max-width: 991px) {
.navigation-grid {
grid-template-columns: 100%;
}
}
.navigation > .container > div {
position: relative;
}
.vertical-menu {
padding-right: 0;
}
.menu-vertical {
position: relative;
z-index: 52;
display: block !important;
}
.menu-vertical .menu-vertical__header {
cursor: pointer;
margin: 0;
padding: 0 15px;
min-height: 56px;
display: flex;
align-items: center;
font-size: 14px;
text-transform: uppercase;
font-weight: 600;
color: var(--navd-head-txt);
background-color: var(--navd-head-bg);
border-radius: var(--navd-head-radius) var(--navd-head-radius) 0 0;
}
.menu-vertical .menu-vertical__header span {
padding-left: 25px;
}
.menu-vertical .menu-vertical__content {
position: absolute;
left: 0;
width: 100%;
z-index: 52;
}
.menu-vertical .menu-vertical__content:before {
content: "";
position: absolute;
top: calc(var(--nav-hv-margin-top) * -1);
left: 0;
display: block;
width: 100%;
height: var(--nav-hv-margin-top);
background-color: transparent;
z-index: 1;
}
.menu-vertical .menu-vertical__content .menu-vertical__category {
background-color: #fff;
border-style: var(--navd-border-style, solid);
border-color: var(--navd-border-color);
border-top-width: var(--navd-border-width-top);
border-right-width: var(--navd-border-width-right);
border-bottom-width: var(--navd-border-width-bottom);
border-left-width: var(--navd-border-width-left);
border-radius: var(--navd-radius-top) var(--navd-radius-right) var(--navd-radius-bottom) var(--navd-radius-left);
}
.menu-vertical .menu-vertical__content .menu-vertical__category .menu-vertical__category__nav {
padding: var(--navd-padding);
color: var(--navd-txt-color);
background-color: var(--navd-bg-color);
list-style: none;
margin: 0;
border-radius: var(--navd-radius-top) var(--navd-radius-right) var(--navd-radius-bottom) var(--navd-radius-left);
}
.menu-vertical .menu-vertical__content .menu-vertical__category .menu-vertical__category__nav .nav-item {
float: none;
position: initial;
}
.menu-vertical .menu-vertical__content .menu-vertical__category .menu-vertical__category__nav .nav-item:first-child {
border-top: 0 solid rgba(0, 0, 0, 0.15);
border-radius: var(--navd-radius-top) var(--navd-radius-top) 0 0;
}
.menu-vertical .menu-vertical__content .menu-vertical__category .menu-vertical__category__nav .nav-item:first-child a {
border-radius: inherit;
}
.menu-vertical .menu-vertical__content .menu-vertical__category .menu-vertical__category__nav .nav-item:last-child {
border-radius: 0 0 var(--navd-radius-bottom) var(--navd-radius-bottom);
}
.menu-vertical .menu-vertical__content .menu-vertical__category .menu-vertical__category__nav .nav-item:last-child a {
border-radius: inherit;
}
.menu-vertical .menu-vertical__content .menu-vertical__category .menu-vertical__category__nav .nav-item.nav-hidden {
display: none;
}
.menu-vertical .menu-vertical__content .menu-vertical__category .menu-vertical__category__nav .nav-item .icon {
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
line-height: 40px;
display: flex;
justify-content: center;
align-items: center;
}
.menu-vertical .menu-vertical__content .menu-vertical__category .menu-vertical__category__nav .nav-item .icon img {
width: 20px;
}
.menu-vertical .menu-vertical__content .menu-vertical__category .menu-vertical__category__nav .nav-item > a.nav-link {
position: relative;
display: block;
overflow: hidden;
white-space: nowrap;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
padding: 9px 30px 10px 40px;
color: var(--navd-txt-color, #000000);
background-color: var(--navd-bg-color, #ffffff);
border-style: var(--navd-item-border-style, none);
border-color: var(--navd-item-border-color);
border-top-width: var(--navd-item-border-width-top);
border-right-width: var(--navd-item-border-width-right);
border-bottom-width: var(--navd-item-border-width-bottom);
border-left-width: var(--navd-item-border-width-left);
border-radius: var(--navd-item-radius-top) var(--navd-item-radius-right) var(--navd-item-radius-bottom) var(--navd-item-radius-left);
}
.menu-vertical .menu-vertical__content .menu-vertical__category .menu-vertical__category__nav .nav-item > a.nav-link:hover {
border-color: var(--navd-item-border-color-hv);
color: var(--navd-txt-color-hv, var(--theme-color));
background-color: var(--navd-bg-color-hv, #ffffff);
}
.menu-vertical .menu-vertical__content .menu-vertical__category .menu-vertical__category__nav .nav-item i {
position: absolute;
top: 0;
right: 0;
width: 43px;
line-height: 43px;
text-align: center;
}
.menu-vertical .menu-vertical__content .menu-vertical__category .menu-vertical__category__nav .nav-item:hover .sub-menu-dropdown {
visibility: visible;
opacity: 1;
-webkit-transform: none;
transform: none;
pointer-events: unset;
}
.menu-vertical .menu-vertical__content .menu-vertical__category .menu-vertical__category__nav .nav-more {
font-weight: 700;
}
.menu-vertical .menu-vertical__content .sub-menu-dropdown {
position: absolute;
z-index: 380;
margin: 0 0 0;
padding: 30px 35px 0 35px;
background-color: #FFF;
background-position: bottom right;
background-clip: border-box;
background-repeat: no-repeat;
box-shadow: 0 5px 30px rgba(0, 0, 0, 0.4);
text-align: left;
visibility: hidden;
opacity: 0;
transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease, -webkit-transform 0.2s ease;
-webkit-transform: translateY(15px) translateZ(0);
transform: translateY(15px) translateZ(0);
pointer-events: none;
top: 0;
left: 100%;
width: 825px;
min-height: 100%;
border-radius: var(--navd-radius-top) var(--navd-radius-right) var(--navd-radius-bottom) var(--navd-radius-left);
}
.menu-vertical .menu-vertical__content .sub-menu-dropdown:before {
content: "";
position: absolute;
top: 0;
left: calc((var(--navd-padding) + 10px) * -1);
display: block;
width: calc(var(--navd-padding) + 10px);
height: 100%;
background-color: transparent;
z-index: 1;
}
.menu-vertical .menu-vertical__content .sub-menu-dropdown .sub-menu-dropdown-container {
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.menu-vertical .menu-vertical__content .sub-menu-dropdown .col-inner {
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
width: 25%;
float: left;
}
.menu-vertical .menu-vertical__content .sub-menu-dropdown ul {
list-style: none;
padding: 0;
}
.menu-vertical .menu-vertical__content .sub-menu-dropdown ul li:hover {
color: var(--navd-txt-color-hv, var(--theme-color));
}
.menu-vertical .menu-vertical__content .sub-menu-dropdown ul li a {
color: var(--navd-txt-color, #000000);
background-color: var(--navd-bg-color, #ffffff);
padding-bottom: 10px;
display: block;
}
.menu-vertical .menu-vertical__content .sub-menu-dropdown ul.mega-menu-list > li > a {
font-weight: bold;
}
.menu-vertical .bg-vertical.active {
display: block;
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 51;
}
.menu-vertical.no-home .menu-vertical__content {
display: none;
}
.menu-vertical.no-home:hover .menu-vertical__content {
display: block;
}
.menu-vertical.menu-vertical-home .menu-vertical__content {
position: inherit;
width: 100%;
z-index: 52;
}
.menu-vertical.style2 .menu-vertical__content .menu-vertical__category__nav .nav-item {
position: relative;
}
.menu-vertical.style2 .menu-vertical__content .menu-vertical__category__nav .nav-item > .dropdown-menu {
position: absolute;
top: 0;
padding: 0px;
min-width: 230px;
border-radius: var(--navd-radius-top) var(--navd-radius-right) var(--navd-radius-bottom) var(--navd-radius-left);
box-shadow: 0 0 15px -5px rgba(0, 0, 0, 0.4);
color: var(--navd-txt-color);
background-color: var(--navd-bg-color);
left: calc(100% + 5px) !important;
border: 0;
margin-top: 0;
width: 700px;
}
.menu-vertical.style2 .menu-vertical__content .menu-vertical__category__nav .nav-item > .dropdown-menu:before {
content: "";
position: absolute;
top: 0;
left: calc((var(--navd-padding) + 10px) * -1);
display: block;
width: calc(var(--navd-padding) + 10px);
height: 100%;
background-color: transparent;
z-index: 1;
}
.menu-vertical.style2 .menu-vertical__content .menu-vertical__category__nav .nav-item > .dropdown-menu h5 {
margin-bottom: 0;
border-bottom: 1px solid #ccc;
}
.menu-vertical.style2 .menu-vertical__content .menu-vertical__category__nav .nav-item > .dropdown-menu a.nav-link {
padding: 10px;
margin: 0;
}
.menu-vertical.style2 .menu-vertical__content .menu-vertical__category__nav .nav-item .dropdown > .dropdown-menu > .col-menu {
float: left;
width: 33%;
margin-bottom: 10px;
padding: 0 10px;
}
.menu-vertical.style2 .menu-vertical__content .menu-vertical__category__nav .nav-item a.nav-link:hover {
color: var(--navd-txt-color-hv, #000000);
background-color: var(--navd-bg-color-hv, #ffffff);
}
.menu-vertical.style2 .menu-vertical__content .menu-vertical__category__nav .nav-item:hover {
color: var(--navd-txt-color-hv, #000000);
background-color: var(--navd-bg-color-hv, #ffffff);
}
.menu-vertical.style2 .menu-vertical__content .menu-vertical__category__nav .nav-item:hover > a.nav-link:hover {
color: var(--navd-txt-color-hv, #000000);
background-color: var(--navd-bg-color-hv, #ffffff);
}
.menu-vertical.style2 .menu-vertical__content .menu-vertical__category__nav .nav-item:hover > .dropdown-menu {
display: block;
min-width: 200px;
width: auto;
}
.menu-vertical.style2 .menu-vertical__content .menu-vertical__category__nav > .nav-item > .dropdown-menu {
left: calc(100% + var(--navd-padding) + 5px) !important;
}
.menu-vertical.menu-noIcon .menu-vertical__content .menu-vertical__category .menu-vertical__category__nav .nav-item > a.nav-link {
padding-left: 10px;
}
.fixed {
-webkit-animation: animate-translate-top 1s;
-moz-animation: animate-translate-top 1s;
animation: animate-translate-top 1s;
}
@-webkit-keyframes animate-translate-top {
0% {
-webkit-transform: translate(0, -150px);
-ms-transform: translate(0, -150px);
transform: translate(0, -150px);
}
100% {
-webkit-transform: translate(0, 0px);
-ms-transform: translate(0, 0px);
transform: translate(0, 0px);
}
}
@-moz-keyframes animate-translate-top {
0% {
-webkit-transform: translate(0, -150px);
-ms-transform: translate(0, -150px);
transform: translate(0, -150px);
}
100% {
-webkit-transform: translate(0, 0px);
-ms-transform: translate(0, 0px);
transform: translate(0, 0px);
}
}
@keyframes animate-translate-top {
0% {
-webkit-transform: translate(0, -150px);
-ms-transform: translate(0, -150px);
transform: translate(0, -150px);
}
100% {
-webkit-transform: translate(0, 0px);
-ms-transform: translate(0, 0px);
transform: translate(0, 0px);
}
}
.fixed .menu-vertical .menu-vertical__content {
display: none;
top: auto !important;
}
.fixed .menu-vertical .menu-vertical__content.active {
display: block;
}
.fixed .menu-vertical .menu-vertical__content .menu-vertical__category {
border-radius: 0 0 var(--navd-radius-bottom) var(--navd-radius-left);
}
.fixed .menu-vertical.no-home:hover .menu-vertical__content {
display: block;
}
.section-vertical {
margin-top: var(--nav-hv-margin-top);
}
.section-vertical .vertical-slider {
padding: 0 10px;
position: relative;
}
.section-vertical .vertical-slider .container {
width: 100% !important;
padding: 0;
}
@media (max-width: 768px) {
.section-vertical .vertical-slider {
padding: 0;
}
}
.vertical-menu.sticky-top {
top: 60px;
}
.top-bar {
--top-bar-txt-color: #000000;
--top-bar-icon-color: #000000;
}
.top-bar {
background: #ffffff;
}
.top-bar {
color: var(--top-bar-txt-color);
}
.top-bar a {
color: var(--top-bar-txt-color);
}
.top-bar .contact-list {
display: flex;
align-items: center;
justify-content: start;
gap: 16px;
}
.top-bar .contact-list .contact {
position: relative;
}
.top-bar .contact-list .contact:after {
content: '';
display: block;
height: 50%;
width: 1px;
background-color: var(--top-bar-txt-color);
position: absolute;
right: -8px;
top: 25%;
}
.top-bar .contact-list .contact:last-child:after {
display: none;
}
.top-bar .contact-list .contact .icon {
color: var(--top-bar-icon-color, var(--top-bar-txt-color));
}
.header-title.header-title-style-1 {
text-align: var(--heading-position);
}
.header-title.header-title-style-1 .header {
text-align: var(--heading-position);
letter-spacing: 0;
padding-bottom: 0;
position: relative;
display: block;
background-color: var(--header-title-bg);
}
.header-title.header-title-style-1 .header-image-bottom {
text-align: var(--heading-position);
}
.header-title.header-title-style-1 .header-image-bottom img {
display: inline-block;
}
.header-title.header-title-style-1 .header-description {
color: var(--heading-des-color);
width: var(--heading-des-width);
margin: var(--heading-des-margin);
max-width: 100%;
}
.pre-form-contact {
overflow: hidden; margin-bottom: 10px;
}
.pre-form-contact__title {
font-weight: 700;
margin: 15px 0;
}
.pre-form-contact__box {
background-color: var(--pre-form-contact-bg_box);
padding: var(--pre-form-contact-padding);
width: 100%;
border-radius: 5px;
}
.pre-form-contact__box .form-group {
display: flex;
flex-wrap: wrap;
margin-bottom: 0;
}
.pre-form-contact__box .form-group .input {
width: calc(100% - 60px);
}
.pre-form-contact__box .form-group .form-control {
background-color: var(--pre-form-contact-bg_input);
box-shadow: none; border-radius: 5px 0 0 5px; font-size: 15px;
border: 0; min-height: 41px; height: 100%;
}
.pre-form-contact__box .form-group button {
background-color: var(--pre-form-contact-bg_button);
color:var(--pre-form-contact-color_button);
width: 60px; border-radius: 0 5px 5px 0; font-size: 20px;
border: 0;
}
.pre-form-contact__box .form-group button:hover {
background-color: var(--pre-form-contact-bg_button_hover);
color:var(--pre-form-contact-color_button_hover);
}.fancybox-content.products-detail{
width: 80%;
}
.navigation{
border-top: 1px solid #ccc;
}
.sidebar .widget{
overflow: hidden;
}:root{--nav-padding:10px 10px 10px 10px;--nav-layout-grid:25% 75% ;--navd-head-txt:#ffffff;--navd-head-bg:#000000;--navd-head-radius:px;--navd-padding:0px;--nav-hv-margin-top:1px;--navd-border-color:#e1e1e1;--navd-border-style:solid;--navd-border-width-top:1px;--navd-border-width-right:1px;--navd-border-width-bottom:1px;--navd-border-width-left:1px;--navd-radius-top:px;--navd-radius-right:px;--navd-radius-bottom:px;--navd-radius-left:px;--navd-item-border-width-top:px;--navd-item-border-width-right:px;--navd-item-border-width-bottom:px;--navd-item-border-width-left:px;--navd-item-radius-top:px;--navd-item-radius-right:px;--navd-item-radius-bottom:px;--navd-item-radius-left:px;}.navigation{background:#ffffff;}
.navigation ul.main-menu>li a{color:#000000;font-family:Inter, sans-serif;font-size:18px;font-weight:bold;line-height:36px;}