:root {
--white: #ffffff;
--white-2: #FFFFFFCC;
--black: #000000;
--black-2: #0000001A;
--main: #1F1F1F;
--main-2: #181818;
--main-3: #484848;
--main-4: #818181;
--main-5: #BABABA;
--main-6: #545454;
--main-7: #1C1C1C99;
--main-8: #646464;
--main-9: #5A5A5A;
--main-10: #D2D2D2;
--main-11: #8F8F8F;
--main-12: #667085;
--primary: #AE873E;
--primary-2: #957127;
--primary-3: #8C763B;
--secondary: #FF6969;
--secondary-2: #E5775F;
--secondary-3: #DF7C1F;
--secondary-4: #F43B3B;
--bg: #F5F2E9;
--bg-2: #776733;
--bg-3: #000000CC;
--bg-4: #281C06CC;
--bg-5: #777433;
--bg-6: #00000033;
--bg-7: #A63A27;
--bg-8: #423321;
--bg-9: #E8EBDD;
--bg-10: #454D25;
--bg-11: #FFF7ED;
--bg-12: #C2C2C299;
--bg-13: #9D5100;
--bg-14: #EFE8D5;
--bg-15: #D9D9D9;
--bg-16: #DADEC9;
--bg-17: #D4B04C;
--bg-18: #EDEDED;
--bg-19: #FBECE3;
--bg-20: #97764E;
--bg-21: #FFF3E4;
--bg-22: #765540;
--bg-23: #FFF7E7;
--bg-24: #ECDBF2;
--bg-25: #FFEBD4;
--bg-26: #F3F3F3;
--line: #11111126;
--line-2: #1111111A;
--line-3: #E0E0E0;
--line-4: #515151;
--line-5: #7D7D7D;
--line-6: #787878;
--line-7: #A2A2A2;
--line-8: #EBEBEB;
--line-9: #E1E1E1;
--line-10: #9C9C9C;
--line-11: #CACACA;
--line-12: #EFEFEF;
--line-13: #E8D2A7;
--shadow-1: #A3A3A340;
--green: #3FC53A;
--linear-1: linear-gradient(180deg, rgba(246, 221, 190, 0) 0%, rgba(246, 221, 190, 0.5) 100%);
--linear-2: linear-gradient(137.6deg, #C09C71 23.87%, #664B18 99.83%);
--linear-3: linear-gradient(285.63deg, #4B2C17 5.45%, #905E3D 94.52%);
--linear-4: linear-gradient(133.57deg, #FFF0D3 25.62%, #EBD1A2 100%);
--linear-5: linear-gradient(138.03deg, #FFF3E5 23.68%, #FFCDA2 100%);
--success: #3dab25;
--error: #f03e3e;
}   html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
font-family: inherit;
font-size: 100%;
font-style: inherit;
font-weight: inherit;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
} html {
margin-right: 0 !important;
scroll-behavior: smooth;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: "Jost", sans-serif;
font-size: 16px;
line-height: 24px;
font-weight: 400;
letter-spacing: -0.32px;
color: var(--main);
background-color: var(--white);
}
body::-webkit-scrollbar {
width: 5px;
height: 1px;
}
body::-webkit-scrollbar-thumb {
background-color: var(--primary);
border-radius: 5px;
}
img {
max-width: 100%;
height: auto;
transform: scale(1);
vertical-align: middle;
-ms-interpolation-mode: bicubic;
}
.row {
margin-right: -15px;
margin-left: -15px;
}
.row > * {
padding-left: 15px;
padding-right: 15px;
}
ul,
li {
list-style-type: none;
margin-bottom: 0;
padding-left: 0;
list-style: none;
}
table {
width: 100%;
overflow-x: auto;
table-layout: auto;
border-collapse: collapse;
}
thead {
background-color: var(--line-8);
}
tbody tr:nth-child(even) {
background-color: var(--line-8);
}
tr th:not(:first-child) {
border-left: 1px solid var(--white);
}
td,
th {
padding: 10px 14px;
}
.container {
max-width: 1548px;
width: 100%;
margin: auto;
padding-left: 15px;
padding-right: 15px;
}
.container-2 {
max-width: 1790px;
width: 100%;
margin: auto;
padding-left: 15px;
padding-right: 15px;
}
.container-3 {
max-width: 1750px;
width: 100%;
margin: auto;
padding-left: 15px;
padding-right: 15px;
}
.container-4 {
max-width: 1358px;
width: 100%;
margin: auto;
padding-left: 15px;
padding-right: 15px;
}
.container-5 {
max-width: 1854px;
width: 100%;
margin: auto;
padding-left: 15px;
padding-right: 15px;
}
.container-6 {
max-width: 1290px;
width: 100%;
margin: auto;
padding-left: 15px;
padding-right: 15px;
}
.container-7 {
max-width: 1614px;
width: 100%;
margin: auto;
padding-left: 15px;
padding-right: 15px;
}
.container-full {
width: 100%;
max-width: 100%;
margin: 0 auto;
padding: 0px 15px;
}
@media (min-width: 1600px) {
.container-full {
padding-left: 48px;
padding-right: 48px;
}
}
.container-full-2 {
width: 100%;
max-width: 100%;
margin: 0 auto;
padding: 0px 15px;
}
@media (min-width: 1440px) {
.container-full-2 {
padding-left: 30px;
padding-right: 30px;
}
}
.container-full-3 {
width: 100%;
max-width: 100%;
margin: 0 auto;
padding: 0px 15px;
}
@media (min-width: 1440px) {
.container-full-3 {
padding-left: 30px;
padding-right: 30px;
}
}
@media (min-width: 1600px) {
.container-full-3 {
padding-left: 62px;
padding-right: 62px;
}
}
.container-full-4 {
width: 100%;
max-width: 100%;
margin: 0 auto;
padding: 0px 15px;
}
@media (min-width: 1440px) {
.container-full-4 {
padding-left: 30px;
padding-right: 30px;
}
}
@media (min-width: 1600px) {
.container-full-4 {
padding-left: 48px;
padding-right: 48px;
}
}
.container-layout-right {
width: calc(100vw - (100vw - 1548px) / 2 - 4px);
margin-right: unset;
max-width: 100%;
margin-left: auto;
padding-left: 15px;
}
.container-layout-right-2 {
width: calc(100vw - (100vw - 1012px) / 2);
margin-right: unset;
max-width: 100%;
margin-left: auto;
padding-left: 15px;
}
.container-layout-right-3 {
width: calc(100vw - (100vw - 646px) / 2);
margin-right: unset;
max-width: 100%;
margin-left: auto;
padding-left: 15px;
}
.container-layout-right-4 {
width: calc(100vw - (100vw - 1636px) / 2);
margin-right: unset;
max-width: 100%;
margin-left: auto;
padding-left: 15px;
padding-right: 15px;
}
.container-layout-right-4 > * {
margin-right: -15px;
}
.container-layout-left {
width: calc(100vw - (100vw - 1548px) / 2 - 4px);
margin-left: unset;
max-width: 100%;
margin-right: auto;
padding-right: 15px;
padding-left: 15px;
}
.slider-layout-right {
width: calc(100vw - (100vw - 1548px) / 2);
margin-right: unset;
max-width: 100%;
margin-left: auto;
padding: 0 15px;
}
.slider-layout-right .swiper {
margin-right: -15px;
}
.cus-width {
max-width: 1518px;
width: 100%;
margin: 0 auto;
}
svg path {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
button {
background: transparent;
border: 0;
display: inline-flex;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
color: var(--main);
} :-ms-input-placeholder {
color: var(--secondary-2);
} h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
font-family: "Jost", sans-serif;
text-rendering: optimizeLegibility;
font-weight: 500;
margin-bottom: 0;
letter-spacing: 0;
}
h1,
.h1 {
font-size: clamp(32px, 5vw, 60px);
line-height: clamp(40px, 6vw, 72px);
}
h2,
.h2 {
font-size: clamp(30px, 3vw, 48px);
line-height: clamp(40px, 3.5vw, 60px);
}
h3,
.h3 {
font-size: clamp(24px, 2vw, 36px);
line-height: clamp(32px, 2.5vw, 44px);
}
.text-lg {
font-size: clamp(24px, 2.5vw, 28px);
line-height: clamp(30px, 3vw, 32px);
}
.text-lg-2 {
font-size: clamp(20px, 2.8vw, 32px);
line-height: clamp(28px, 3.5vw, 42px);
}
h4,
.h4 {
font-size: clamp(18px, 2vw, 24px);
line-height: clamp(26px, 2.5vw, 32px);
}
h5 {
font-size: 20px;
line-height: 30px;
}
.h5 {
font-size: clamp(18px, 3vw, 20px);
line-height: clamp(28px, 3.5vw, 30px);
}
h6,
.h6 {
font-size: 18px;
line-height: 28px;
}
.text-hero {
font-size: clamp(36px, 6vw, 72px);
line-height: clamp(48px, 7vw, 90px);
letter-spacing: 0px;
}
.text-hero-2 {
font-size: clamp(28px, 4vw, 48px);
line-height: 130%;
letter-spacing: 0px;
}
.text-caption {
font-size: 14px;
line-height: 20px;
letter-spacing: 0px;
}
.text-caption-2 {
font-size: 14px !important;
line-height: 28px !important;
letter-spacing: 0px;
}
.text-caption-3 {
font-size: 14px;
line-height: 22px;
letter-spacing: 0px;
}
.text-xs {
font-size: 12px;
line-height: 18px;
letter-spacing: 0px;
}
.text-body {
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: -0.32px;
}
.font-main {
font-family: "Jost", sans-serif;
}
.font-2 {
font-family: "Playfair Display", serif;
}
.font-3 {
font-family: "Hero";
}
.font-4 {
font-family: "Raleway", sans-serif;
}
.font-5 {
font-family: "Poppins", sans-serif;
}
b,
strong {
font-weight: bolder;
}
video {
width: 100%;
height: 100%;
object-fit: cover;
}
.fs-10 {
font-size: 10px;
}
.fs-12 {
font-size: 12px !important;
}
.fs-14 {
font-size: 14px;
}
.fs-16 {
font-size: 16px;
}
.fs-20 {
font-size: 20px;
}
.fs-18 {
font-size: 18px;
}
.fs-32 {
font-size: 32px !important;
}
.fs-35 {
font-size: 35px;
}
.lh-19 {
line-height: 19px !important;
}
.lh-20 {
line-height: 20px !important;
}
.lh-28 {
line-height: 28px !important;
}
.lh-32 {
line-height: 32px !important;
}
.fs-24 {
font-size: 24px;
}
.text-primary {
color: var(--primary) !important;
}
.text-primary-2 {
color: var(--primary-2) !important;
}
.text-primary-3 {
color: var(--primary-3) !important;
}
.text-secondary {
color: var(--secondary) !important;
}
.text-secondary-4 {
color: var(--secondary-4) !important;
}
.text-white-2 {
color: var(--white-2) !important;
}
.text-main {
color: var(--main) !important;
}
.text-main-3 {
color: var(--main-3) !important;
}
.text-main-4 {
color: var(--main-4) !important;
}
.text-main-5 {
color: var(--main-5) !important;
}
.text-main-6 {
color: var(--main-6) !important;
}
.text-main-8 {
color: var(--main-8) !important;
}
.text-main-9 {
color: var(--main-9) !important;
}
.text-main-10 {
color: var(--main-10) !important;
}
.text-main-12 {
color: var(--main-12) !important;
}
.text-star {
color: #E69600 !important;
}
.bg-black-2 {
background-color: var(--black-2);
}
.bg-surface {
background-color: var(--bg);
}
.bg-surface-2 {
background-color: var(--bg-14) !important;
}
.bg-olive-brown {
background-color: var(--bg-2);
}
.bg-dark-black {
background-color: var(--bg-3);
}
.bg-dark-olive {
background-color: var(--bg-5);
}
.bg-dark-brown {
background-color: var(--bg-8) !important;
}
.bg-dark-brown-2 {
background-color: var(--bg-13) !important;
}
.bg-dark-tan {
background-color: var(--bg-20) !important;
}
.bg-light-gray {
background-color: var(--bg-12) !important;
}
.bg-light-peach {
background-color: var(--bg-19) !important;
}
.bg-light-peach-2 {
background-color: var(--bg-21) !important;
}
.bg-light-peach-3 {
background: var(--bg-25) !important;
}
.bg-main {
background-color: var(--main);
}
.bg-main-2 {
background-color: var(--main-2);
}
.bg-primary {
background-color: var(--primary) !important;
}
.bg-primary-2 {
background-color: var(--primary-2) !important;
}
.bg-linear {
background: var(--linear-1);
}
.bg-linear-light-brown {
background: var(--linear-2);
}
.bg-linear-dark-brown {
background: var(--linear-3);
}
.bg-linear-golden-cream {
background: var(--linear-4);
}
.bg-linear-golden-cream-2 {
background: var(--linear-5);
}
.bg-earth-brown {
background: var(--bg-22);
}
.bg-line {
background-color: var(--line);
}
.line {
border: 1px solid var(--line) !important;
}
.line-2 {
border: 1px solid var(--line-8);
}
.line-bt-2 {
border: 1px solid var(--line-2);
}
.line-bt {
border-bottom: 1px solid var(--line);
}
.line-y {
border-top: 1px solid var(--line);
border-bottom: 1px solid var(--line);
}
.text-stroke-white {
-webkit-text-stroke: 2px var(--white);
color: transparent;
}
a {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
text-decoration: none;
cursor: pointer;
display: inline-block;
font-family: "Jost", sans-serif;
color: var(--main);
}
a:focus, a:hover {
text-decoration: none;
outline: 0;
}
.link {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.link:hover {
color: var(--primary) !important;
}
.link-secondary {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.link-secondary:hover {
color: var(--secondary) !important;
}
.link-secondary-2 {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.link-secondary-2:hover {
color: var(--secondary-2) !important;
}
.grid-2 {
display: grid;
grid-template-columns: repeat(2, 1fr);
}
.grid-3 {
display: grid;
grid-template-columns: repeat(3, 1fr);
}
.grid-4 {
display: grid;
grid-template-columns: repeat(4, 1fr);
}
.grid-6 {
display: grid;
grid-template-columns: repeat(6, 1fr);
}
.gap-4 {
gap: 4px !important;
}
.gap-5 {
gap: 5px !important;
}
.gap-6 {
gap: 6px !important;
}
.gap-8 {
gap: 8px;
}
.gap-10 {
gap: 10px !important;
}
.gap-12 {
gap: 12px !important;
}
.gap-15 {
gap: 15px;
}
.gap-16 {
gap: 16px;
}
.gap-20 {
gap: 20px;
}
.gap-24 {
gap: 24px !important;
}
.gap-30 {
gap: 30px !important;
}
.gap-x-10 {
column-gap: 10px !important;
}
.border-primary {
border: 1px solid var(--primary) !important;
}
.border-bt-primary {
border-bottom: 1px solid var(--primary);
}
.border-bt-13 {
border-bottom: 1px solid var(--line-13);
}
.border-bt {
border-bottom: 1px solid var(--line);
}
.radius-3 {
border-radius: 3px !important;
}
.radius-5 {
border-radius: 5px !important;
}
.radius-10 {
border-radius: 10px !important;
}
.radius-12 {
border-radius: 12px !important;
}
.radius-16 {
border-radius: 16px !important;
}
.radius-20 {
border-radius: 20px !important;
}
.radius-60 {
border-radius: 60px !important;
}
.rounded-full {
border-radius: 999px !important;
}
.flat-spacing {
padding-top: 100px;
padding-bottom: 100px;
}
@media (max-width: 1024px) {
.flat-spacing {
padding-top: 80px;
padding-bottom: 80px;
}
}
@media (max-width: 767px) {
.flat-spacing {
padding-top: 60px;
padding-bottom: 60px;
}
}
.flat-spacing-2 {
padding-top: 54px;
padding-bottom: 54px;
}
.flat-spacing-3 {
padding-top: 120px;
padding-bottom: 120px;
}
@media (max-width: 1199px) {
.flat-spacing-3 {
padding-top: 100px;
padding-bottom: 100px;
}
}
@media (max-width: 1024px) {
.flat-spacing-3 {
padding-top: 80px;
padding-bottom: 80px;
}
}
@media (max-width: 767px) {
.flat-spacing-3 {
padding-top: 60px;
padding-bottom: 60px;
}
}
.flat-spacing-4 {
padding-top: 160px;
padding-bottom: 160px;
}
@media (max-width: 1199px) {
.flat-spacing-4 {
padding-top: 100px;
padding-bottom: 100px;
}
}
@media (max-width: 1024px) {
.flat-spacing-4 {
padding-top: 80px;
padding-bottom: 80px;
}
}
@media (max-width: 767px) {
.flat-spacing-4 {
padding-top: 60px;
padding-bottom: 60px;
}
}
.flat-spacing-5 {
padding-top: 60px;
padding-bottom: 60px;
}
.flat-spacing-6 {
padding-top: 100px;
padding-bottom: 120px;
}
@media (max-width: 1199px) {
.flat-spacing-6 {
padding-top: 100px;
padding-bottom: 100px;
}
}
@media (max-width: 1024px) {
.flat-spacing-6 {
padding-top: 80px;
padding-bottom: 80px;
}
}
@media (max-width: 767px) {
.flat-spacing-6 {
padding-top: 60px;
padding-bottom: 60px;
}
}
.flat-spacing-7 {
padding-top: 100px;
padding-bottom: 80px;
}
@media (max-width: 1024px) {
.flat-spacing-7 {
padding-top: 80px;
padding-bottom: 80px;
}
}
@media (max-width: 767px) {
.flat-spacing-7 {
padding-top: 60px;
padding-bottom: 60px;
}
}
.flat-spacing-8 {
padding-top: 40px;
padding-bottom: 40px;
}
.flat-spacing-9 {
padding-top: 80px;
padding-bottom: 80px;
}
@media (max-width: 767px) {
.flat-spacing-9 {
padding-top: 60px;
padding-bottom: 60px;
}
}
.flat-spacing-10 {
padding-top: 100px;
padding-bottom: 100px;
}
@media (max-width: 1024px) {
.flat-spacing-10 {
padding-top: 80px;
padding-bottom: 80px;
}
}
@media (max-width: 767px) {
.flat-spacing-10 {
padding-top: 60px;
padding-bottom: 60px;
}
}
.flat-spacing-11 {
padding-top: 64px;
padding-bottom: 64px;
}
@media (max-width: 767px) {
.flat-spacing-11 {
padding-top: 60px;
padding-bottom: 60px;
}
}
.flat-spacing-12 {
padding-top: 120px;
padding-bottom: 100px;
}
@media (max-width: 1199px) {
.flat-spacing-12 {
padding-top: 100px;
padding-bottom: 100px;
}
}
@media (max-width: 1024px) {
.flat-spacing-12 {
padding-top: 80px;
padding-bottom: 80px;
}
}
@media (max-width: 767px) {
.flat-spacing-12 {
padding-top: 60px;
padding-bottom: 60px;
}
}
.flat-spacing-13 {
padding-top: 48px;
padding-bottom: 48px;
}
.flat-spacing-14 {
padding-top: 100px;
padding-bottom: 160px;
}
@media (max-width: 1199px) {
.flat-spacing-14 {
padding-top: 100px;
padding-bottom: 100px;
}
}
@media (max-width: 1024px) {
.flat-spacing-14 {
padding-top: 80px;
padding-bottom: 80px;
}
}
@media (max-width: 767px) {
.flat-spacing-14 {
padding-top: 60px;
padding-bottom: 60px;
}
}
.flat-spacing-15 {
padding-top: 90px;
padding-bottom: 90px;
}
@media (max-width: 1024px) {
.flat-spacing-15 {
padding-top: 80px;
padding-bottom: 80px;
}
}
@media (max-width: 767px) {
.flat-spacing-15 {
padding-top: 60px;
padding-bottom: 60px;
}
}
.flat-spacing-16 {
padding-top: 63px;
padding-bottom: 63px;
}
.flat-spacing-17 {
padding-top: 172px;
padding-bottom: 172px;
}
@media (max-width: 1199px) {
.flat-spacing-17 {
padding-top: 100px;
padding-bottom: 100px;
}
}
@media (max-width: 1024px) {
.flat-spacing-17 {
padding-top: 80px;
padding-bottom: 80px;
}
}
@media (max-width: 767px) {
.flat-spacing-17 {
padding-top: 60px;
padding-bottom: 60px;
}
}
[data-grid=grid-1] {
display: grid;
gap: 30px;
grid-template-columns: 1fr;
}
[data-grid=grid-2] {
display: grid;
gap: 30px;
grid-template-columns: 1fr 1fr;
}
[data-grid=grid-3] {
display: grid;
gap: 30px;
grid-template-columns: repeat(3, 1fr);
}
[data-grid=grid-4] {
display: grid;
gap: 30px;
grid-template-columns: repeat(4, 1fr);
}
[data-grid=grid-5] {
display: grid;
gap: 30px;
grid-template-columns: repeat(5, 1fr);
}
[data-grid=grid-6] {
display: grid;
gap: 30px;
grid-template-columns: repeat(6, 1fr);
}
[data-grid=grid-7] {
display: grid;
gap: 30px;
grid-template-columns: repeat(7, 1fr);
}
.grid-template-columns-2 {
grid-template-columns: 1fr 1fr;
}
.tf-row-flex {
display: flex;
flex-direction: row;
column-gap: 30px;
row-gap: 30px;
}
.tf-grid-layout {
display: grid;
column-gap: 15px;
row-gap: 30px;
}
.tf-grid-layout.tf-col-2 {
grid-template-columns: 1fr 1fr;
}
.tf-grid-layout.tf-col-3 {
grid-template-columns: repeat(3, 1fr);
}
.tf-grid-layout.tf-col-4 {
grid-template-columns: repeat(4, 1fr);
}
.tf-grid-layout.tf-col-5 {
grid-template-columns: repeat(5, 1fr);
}
.tf-grid-layout.tf-col-6 {
grid-template-columns: repeat(6, 1fr);
}
.tf-grid-layout.tf-col-7 {
grid-template-columns: repeat(7, 1fr);
}
.tf-grid-layout .wd-full {
grid-column: 1/-1;
}
.tf-grid-layout .wd-2-cols {
grid-column: span 2;
}
@media (min-width: 576px) {
.tf-grid-layout.sm-col-2 {
grid-template-columns: 1fr 1fr;
}
.tf-grid-layout.sm-col-3 {
grid-template-columns: repeat(3, 1fr);
}
.tf-grid-layout.sm-col-4 {
grid-template-columns: repeat(4, 1fr);
}
.tf-grid-layout.sm-col-5 {
grid-template-columns: repeat(5, 1fr);
}
.tf-grid-layout.sm-col-6 {
grid-template-columns: repeat(6, 1fr);
}
.tf-grid-layout.sm-col-7 {
grid-template-columns: repeat(7, 1fr);
}
}
@media (min-width: 768px) {
.tf-grid-layout.md-col-2 {
grid-template-columns: 1fr 1fr;
}
.tf-grid-layout.md-col-3 {
grid-template-columns: repeat(3, 1fr);
}
.tf-grid-layout.md-col-4 {
grid-template-columns: repeat(4, 1fr);
}
.tf-grid-layout.md-col-5 {
grid-template-columns: repeat(5, 1fr);
}
.tf-grid-layout.md-col-6 {
grid-template-columns: repeat(6, 1fr);
}
.tf-grid-layout.md-col-7 {
grid-template-columns: repeat(7, 1fr);
}
}
@media (min-width: 992px) {
.tf-grid-layout {
column-gap: 30px;
}
.tf-grid-layout.lg-col-2 {
grid-template-columns: 1fr 1fr;
}
.tf-grid-layout.lg-col-3 {
grid-template-columns: repeat(3, 1fr);
}
.tf-grid-layout.lg-col-4 {
grid-template-columns: repeat(4, 1fr);
}
.tf-grid-layout.lg-col-5 {
grid-template-columns: repeat(5, 1fr);
}
.tf-grid-layout.lg-col-6 {
grid-template-columns: repeat(6, 1fr);
}
.tf-grid-layout.lg-col-7 {
grid-template-columns: repeat(7, 1fr);
}
}
@media (min-width: 1200px) {
.tf-grid-layout {
row-gap: 64px;
}
.tf-grid-layout.column-gap-xl-64 {
gap: 64px;
}
.tf-grid-layout.xl-col-2 {
grid-template-columns: 1fr 1fr;
}
.tf-grid-layout.xl-col-3 {
grid-template-columns: repeat(3, 1fr);
}
.tf-grid-layout.xl-col-4 {
grid-template-columns: repeat(4, 1fr);
}
.tf-grid-layout.xl-col-5 {
grid-template-columns: repeat(5, 1fr);
}
.tf-grid-layout.xl-col-6 {
grid-template-columns: repeat(6, 1fr);
}
.tf-grid-layout.xl-col-7 {
grid-template-columns: repeat(7, 1fr);
}
}
@media (min-width: 1440px) {
.tf-grid-layout.xxl-col-2 {
grid-template-columns: 1fr 1fr;
}
.tf-grid-layout.xxl-col-3 {
grid-template-columns: repeat(3, 1fr);
}
.tf-grid-layout.xxl-col-4 {
grid-template-columns: repeat(4, 1fr);
}
.tf-grid-layout.xxl-col-5 {
grid-template-columns: repeat(5, 1fr);
}
.tf-grid-layout.xxl-col-6 {
grid-template-columns: repeat(6, 1fr);
}
.tf-grid-layout.xxl-col-7 {
grid-template-columns: repeat(7, 1fr);
}
}
.overflow-unset {
overflow: unset !important;
}
.sticky-top {
position: sticky !important;
z-index: 50;
top: 15px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.wmax {
width: max-content !important;
}
.cursor-not-allowed {
cursor: not-allowed;
}
.cursor-auto {
cursor: auto;
}
.z-5 {
z-index: 5 !important;
}
.text-line-clamp-1 {
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
display: -webkit-box !important;
overflow: hidden;
}
.text-line-clamp-2 {
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
display: -webkit-box;
overflow: hidden;
}
.aspect-ratio-0 {
aspect-ratio: 0 !important;
}
.aspect-ratio-1 {
aspect-ratio: 1/1 !important;
}
#scroll-top {
position: fixed;
display: block;
width: 48px;
height: 48px;
line-height: 50px;
border-radius: 4px;
z-index: 1;
border-radius: 50%;
opacity: 0;
visibility: hidden;
cursor: pointer;
overflow: hidden;
z-index: 100;
background-color: var(--main);
border: 0;
bottom: 92px;
right: 20px;
padding: 0;
display: flex;
align-items: center;
justify-content: center;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
#scroll-top.show {
opacity: 1;
visibility: visible;
}
#scroll-top.type-1 {
bottom: 140px;
}
#scroll-top:hover {
transform: translateY(-5px);
background-color: var(--primary);
} .preload-container {
display: flex;
position: relative;
width: 100%;
height: 100%;
background: #ffffff;
position: fixed;
top: 0;
bottom: 0;
right: 0;
left: 0;
z-index: 99999999999;
align-items: center;
justify-content: center;
overflow: hidden;
}
.spinner {
width: 60px;
height: 60px;
border: 3px solid transparent;
border-top: 3px solid var(--primary);
border-radius: 100%;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
animation: spin 1s infinite linear;
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.br-line {
width: 100%;
height: 1px;
}
.br-line.type-vertical {
height: 24px;
width: 1px;
}
.br-line.w-22 {
width: 22px;
}
.br-line.w-12 {
width: 12px;
}
.opacity-10 {
opacity: 0.1 !important;
}
.simpleParallax {
height: 100%;
width: 100%;
}
.simpleParallax img {
height: 100%;
width: 100%;
object-fit: cover;
}
.backdrop-ft-unset {
backdrop-filter: unset !important;
}
.mb-24 {
margin-bottom: 24px;
}
.mt-30 {
margin-top: 30px;
}
.lt-sp-nor {
letter-spacing: -0.32px;
}
.lt-sp-t2 {
letter-spacing: -0.76px !important;
}
.letter-space-0 {
letter-spacing: 0px !important;
}
.tf-swiper .swiper-slide {
height: auto;
}
.tf-swiper .swiper-slide > * {
height: 100%;
}
.mb_48 {
margin-bottom: 48px !important;
}
.mb_32 {
margin-bottom: 32px !important;
}
.mb_10 {
margin-bottom: 10px !important;
}
.mb_16 {
margin-bottom: 16px !important;
}
.mb_15 {
margin-bottom: 15px !important;
}
@media (min-width: 1440px) {
.mb_xxl-60 {
margin-bottom: 60px !important;
}
}
.text-vertical {
writing-mode: vertical-lr;
transform: rotate(180deg);
}
.py-20 {
padding-top: 20px;
padding-bottom: 20px;
}
.py-10 {
padding-top: 10px !important;
padding-bottom: 10px !important;
}
@media (min-width: 1200px) {
.gap-xl-64 {
gap: 64px !important;
}
}
.cs-pointer {
cursor: pointer;
}
.mb_12 {
margin-bottom: 12px !important;
}
.mb-15 {
margin-bottom: 15px !important;
}
.max-width_1 {
max-width: 1424px;
width: 100%;
}
#goTop {
position: fixed;
padding: 0;
bottom: 90px;
right: 20px;
width: 38px;
height: 38px;
background: var(--white);
color: black;
font-size: 20px;
text-align: center;
line-height: 50px;
cursor: pointer;
border: none;
border-radius: 1px;
opacity: 0;
visibility: hidden;
transition: opacity 0.3s ease;
box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.1019607843);
z-index: 1000;
display: flex;
align-items: center;
justify-content: center;
}
#goTop .border-progress {
position: absolute;
top: -1px;
left: -1px;
width: calc(100% + 2px);
height: calc(100% + 2px);
border-radius: 3px;
border: 1px solid var(--primary);
mask-image: conic-gradient(var(--primary) var(--progress-angle, 0deg), transparent 0);
-webkit-mask-image: conic-gradient(var(--primary) var(--progress-angle, 0deg), transparent 0);
content: "";
z-index: 1;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
#goTop.show {
opacity: 1;
visibility: visible;
}
#goTop .icon {
font-size: 24px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
color: var(--primary);
}
#goTop .icon-arrow-right-2 {
transform: rotate(-90deg);
}
#goTop.pos1 {
bottom: 140px;
right: 15px;
}
@media (min-width: 992px) {
#goTop {
right: 40px;
}
}
@media (min-width: 1600px) {
.sw-iconbox {
padding-left: 11px;
padding-right: 11px;
}
}
.text-trans-none {
text-transform: none !important;
}
@media (min-width: 1200px) {
.fs_xl-49 {
font-size: 49px !important;
}
.px-xl_30 {
padding-left: 30px;
padding-right: 30px;
}
}
@media (min-width: 1440px) {
.pe-xxl-30 {
padding-right: 30px;
}
.ps-xxl-30 {
padding-left: 30px;
}
.px-xxl_15 {
padding-left: 15px;
padding-right: 15px;
}
}
.vertical-text {
transform: rotate(90deg);
transform-origin: left top;
white-space: nowrap;
display: inline-block;
}    .tf-topbar {
padding: 13px;
}
.tf-topbar .new-marquee {
align-items: center;
}
.tf-topbar .new-marquee .box-item {
-webkit-animation: slide-har 20s linear infinite;
animation: slide-har 20s linear infinite;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
align-items: center;
gap: 48px;
}
.tf-topbar .new-marquee .box-item .text-caption-3 {
width: max-content;
}
.tf-topbar.tf-main-topbar {
z-index: 999;
border-bottom: 1px solid rgba(17, 17, 17, 0.1490196078);
position: relative;
}
@media (max-width: 767px) {
.tf-topbar.tf-main-topbar {
display: none !important;
}
}
@media (max-width: 1024px) {
.tf-topbar.tf-main-topbar .col-3 {
width: 50%;
}
.tf-topbar.tf-main-topbar .col-6 {
display: none;
}
}
.tf-topbar.tf-announcement {
position: relative;
z-index: 999;
overflow: hidden;
}
.tf-topbar .has-btn {
display: flex;
align-items: center;
justify-content: center;
gap: 5px 10px;
}
.tf-topbar .has-btn p {
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
display: -webkit-box;
overflow: hidden;
}
@media (min-width: 1200px) {
.tf-topbar .has-btn {
gap: 5px 20px;
}
}
.tf-topbar .br-line {
width: 12px;
background-color: var(--white);
}
.tf-topbar .br-line.w-24 {
width: 24px;
}
.tf-topbar .decor-bottom {
text-decoration: underline;
text-underline-offset: 5px;
}
.tf-topbar .tf-wrap-topbar-center,
.tf-topbar .tf-wrap-topbar-left,
.tf-topbar .tf-wrap-topbar-right {
display: flex;
column-gap: 20px;
row-gap: 10px;
flex-wrap: wrap;
}
.tf-topbar .tf-wrap-topbar-center {
justify-content: center;
}
.tf-topbar .tf-wrap-topbar-left {
justify-content: left;
}
.tf-topbar .tf-wrap-topbar-right {
justify-content: right;
}
.tf-topbar .topbar-inner {
display: flex;
gap: 30px;
}
.tf-topbar .topbar-inner .tf-swiper {
height: 22px;
}
@media (min-width: 1200px) {
.tf-topbar .topbar-inner.type-sp-2 {
gap: 48px;
}
}
.tf-topbar .tf-btn-line {
white-space: nowrap;
}
.tf-topbar .box-suport {
display: flex;
justify-content: center;
gap: 10px;
}
.tf-topbar .box-suport p {
display: flex;
gap: 6px;
align-items: center;
}
.tf-topbar .box-action {
display: flex;
align-items: center;
justify-content: end;
gap: 10px;
}
.tf-topbar .box-action li {
display: flex;
align-items: center;
gap: 10px;
}
.tf-topbar .box-action .br-line {
width: 1px;
height: 14px;
background-color: var(--line);
display: block;
}
.tf-topbar .topbar-botom {
padding: 10px 0px;
}
.tf-topbar.style-2 .topbar-top {
padding: 13px 0px;
}
@media (max-width: 1199px) {
.tf-topbar {
padding: 7px 0px;
}
}
@media (max-width: 575px) {
.tf-topbar .text-anu-slider {
font-size: 12px;
}
.tf-topbar .button-anu-slider,
.tf-topbar .border-anu-slider {
display: none;
}
}
header {
position: sticky;
z-index: 998;
transition: all 0.6s cubic-bezier(0.22, 1, 0.36, 1);
border-bottom: 1px solid #EBEBEB;
}
header.header-sticky {
background-color: var(--white);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
@media (max-width: 767px) {
header.header-sticky {
top: 0 !important;
}
}
.tf-header.header-02 .nav-icon .br-line {
background-color: rgba(255, 255, 255, 0.3019607843) !important;
}
.tf-header .style-2 .box-nav-menu {
justify-content: left;
}
.tf-header.header-absolute-2.type-2, .tf-header.header-02, .tf-header.style-2 {
border-bottom: unset;
}
@media (max-width: 1599px) {
.header-absolute-2.type-2 .box-nav-menu > li,
.header-02 .box-nav-menu > li {
padding-left: 13px !important;
padding-right: 13px !important;
}
.header-absolute-2.type-2 .box-nav-menu > li > a,
.header-02 .box-nav-menu > li > a {
font-size: 14px !important;
}
}
.header-absolute-2 .box-navigation .box-nav-menu {
justify-content: left;
}
.tf-header .nav-icon .nav-cart {
display: flex;
align-items: center;
}
.tf-header .site-logo.logo-mobile {
display: none;
}
.tf-header .site-logo.logo-sticky {
display: none;
}
.tf-header.header-sticky .site-logo.logo-default, .tf-header.header-sticky .site-logo.logo-mobile {
display: none;
}
.tf-header.header-sticky .site-logo.logo-sticky {
display: block;
}
@media (max-width: 1199px) {
.tf-header .site-logo.logo-mobile {
display: block;
}
.tf-header .site-logo.logo {
display: none;
}
}
.tf-header.style-2 .box-nav-menu {
justify-content: left;
}
.tf-header .box-nav-menu li:first-child {
padding-left: 0 !important;
}
.tf-header .box-nav-menu li:last-child {
padding-right: 0 !important;
}
.tf-header .header-right {
display: flex;
gap: 24px;
}
.tf-header .type-languages > .dropdown-menu {
margin-left: -20px !important;
}
.tf-header .tf-dropdown-select.style-default > .dropdown-toggle {
padding-top: 9px;
padding-bottom: 9px;
}
.tf-header .tf-dropdown-select.style-default > .dropdown-menu {
margin-top: 5px !important;
}
@media (min-width: 1200px) {
.tf-header.style-2 .header-top {
padding: 21px 0px;
}
.tf-header.header-absolute.header-sticky .header-top {
border: 1px solid var(--line-2);
}
}
@media (max-width: 1199px) {
.tf-header {
padding: 16.5px 0px;
}
.tf-header .logo-site {
justify-content: center;
}
}
.header-absolute {
background-color: transparent;
z-index: 999;
}
.header-absolute .menu-item .item-link {
color: var(--white);
line-height: 64px;
}
.header-absolute .menu-item .item-link .icon {
color: var(--white);
}
.header-absolute .menu-item.active .icon {
color: var(--primary) !important;
}
.header-absolute .logo-white {
display: none;
}
.header-absolute.header-sticky .item-link {
color: var(--black);
}
.header-absolute.header-sticky .menu-item {
color: var(--black);
}
.header-absolute.header-sticky .icon {
color: var(--black);
}
@media (max-width: 1199px) {
.header-absolute:not(.header-sticky) .logo-white {
display: block;
}
.header-absolute:not(.header-sticky) .logo-black {
display: none;
}
.header-absolute:not(.header-sticky) .nav-icon-item {
color: var(--white) !important;
}
.header-absolute:not(.header-sticky) .btn-mobile-menu::after, .header-absolute:not(.header-sticky) .btn-mobile-menu::before {
background-color: var(--white);
}
.header-absolute:not(.header-sticky) .btn-mobile-menu span {
background-color: var(--white);
}
}
#mobileMenu .nav-ul-mb li > .sub-menu > li {
border-bottom: unset !important;
}
.main-header-absolute .header-02,
.main-header-absolute .tf-header {
margin-bottom: -100px;
}
@media (max-width: 1199px) {
.main-header-absolute .header-02,
.main-header-absolute .tf-header {
margin-bottom: 0px;
}
}
.main-header-absolute .header-01 {
margin-bottom: -77px;
}
@media (max-width: 1199px) {
.main-header-absolute .header-01 {
margin-bottom: 0px;
}
}
.type-2-search {
display: none !important;
}
@media (max-width: 1199px) {
.type-2-search {
display: block !important;
}
}
.box-navigation .item-link::before, .box-navigation .menu-fallback::before {
display: none;
}
.logo-header .site-title {
text-align: center;
}
.logo-header .site-title a {
font-style: italic !important;
text-transform: capitalize;
}
.header-02 {
backdrop-filter: blur(30px);
background: rgba(0, 0, 0, 0.2);
}
.header-02 .box-navigation .box-nav-menu {
justify-content: left;
}
.header-01 .header-bottom {
background: #000;
}
.header-absolute-2 {
background: var(--bg-6);
backdrop-filter: blur(30px);
}
.header-absolute-2 .logo-site .logo-black {
display: none;
}
.header-absolute-2:not(.header-sticky) .nav-icon-item {
color: var(--black) !important;
}
.header-absolute-2:not(.header-sticky) .nav-icon-item:hover {
color: var(--primary) !important;
}
.header-absolute-2:not(.header-sticky) .nav-icon .br-line {
background: var(--black);
}
.header-absolute-2:not(.header-sticky) .menu-item .item-link {
color: var(--black);
}
.header-absolute-2:not(.header-sticky) .menu-item .item-link .icon {
color: var(--black);
}
.header-absolute-2:not(.header-sticky) .menu-item .item-link::before {
background-color: var(--primary);
}
.header-absolute-2:not(.header-sticky) .menu-item.active .item-link {
color: var(--primary);
}
.header-absolute-2:not(.header-sticky) .menu-item.active .icon {
color: var(--primary);
}
.header-absolute-2:not(.header-sticky) .menu-item:hover .item-link {
color: var(--primary);
}
.header-absolute-2:not(.header-sticky) .menu-item:hover .item-link .icon {
color: var(--primary);
}
.header-absolute-2:not(.header-sticky) .btn-mobile-menu::after, .header-absolute-2:not(.header-sticky) .btn-mobile-menu::before {
background-color: var(--black);
}
.header-absolute-2:not(.header-sticky) .btn-mobile-menu span {
background-color: var(--black);
}
.header-absolute-2:not(.header-sticky) .form-search input {
border-color: var(--black);
color: var(--black);
}
.header-absolute-2:not(.header-sticky) .form-search input:focus {
border-color: var(--primary);
}
.header-absolute-2:not(.header-sticky) .form-search input::placeholder {
color: var(--black);
}
.header-absolute-2:not(.header-sticky) .form-search button {
color: var(--black) !important;
}
.header-absolute-2:not(.header-sticky) .form-search button:hover {
color: var(--primary) !important;
}
.header-absolute-2.header-sticky .logo-site .logo-black {
display: block;
}
.header-absolute-2.header-sticky .logo-site .logo-white {
display: none;
}
.header-absolute-2.type-2:not(.header-sticky) {
background: transparent;
backdrop-filter: unset;
}
@media (max-width: 1439px) {
.header-absolute-2 {
margin-bottom: -80px !important;
}
}
@media (max-width: 1199px) {
.header-absolute-2 {
margin-bottom: -74px !important;
}
}
.logo-site {
display: flex;
align-items: center;
}
.logo-site img {
width: 122px;
}
@media (max-width: 767px) {
.logo-site img {
width: 82px;
}
}
.header-inner {
display: flex;
justify-content: space-between;
align-items: center;
}
#mainnav .box-nav-menu > li {
position: relative;
}
#mainnav .box-nav-menu > li.tf-megamenu {
position: static;
}
#mainnav .box-nav-menu > li.tf-megamenu > .sub-menu {
padding: 0;
}
#mainnav .box-nav-menu > li.tf-megamenu .item-link i {
display: block;
}
#mainnav .box-nav-menu > li.tf-megamenu-relative {
position: relative;
}
.menu-item:hover .item-link {
color: var(--primary);
}
.menu-item:hover .item-link::before {
opacity: 1;
visibility: visible;
transform: scale(1);
}
.menu-item:hover .item-link::after {
display: block;
}
.menu-item:hover .item-link .icon {
color: var(--primary);
transform: rotate(180deg);
}
.menu-item:hover .sub-menu {
pointer-events: all;
opacity: 1;
visibility: visible;
-webkit-transform: rotate3d(0, 0, 0, 0deg);
-moz-transform: rotate3d(0, 0, 0, 0deg);
-o-transform: rotate3d(0, 0, 0, 0deg);
-ms-transform: rotate3d(0, 0, 0, 0deg);
transform: rotate3d(0, 0, 0, 0deg);
}
.menu-item.active .item-link {
color: var(--primary);
}
.menu-item.active .item-link .icon {
color: var(--primary);
}
.box-navigation .box-nav-menu {
display: flex;
align-items: center;
justify-content: center;
}
.box-navigation .item-link,
.box-navigation .menu-fallback {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
position: relative;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
line-height: 100px;
text-transform: uppercase;
}
.box-navigation .item-link .icon,
.box-navigation .menu-fallback .icon {
display: none;
color: var(--main);
font-size: 12px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
position: relative;
top: -1px;
}
.box-navigation .item-link::before,
.box-navigation .menu-fallback::before {
content: "";
position: absolute;
left: 0;
right: 0;
width: 100%;
height: 2px;
bottom: 0;
background-color: var(--primary);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
opacity: 0;
visibility: hidden;
transform: scale(0);
}
.box-navigation .item-link::after,
.box-navigation .menu-fallback::after {
position: absolute;
content: "";
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: calc(100% + 50px);
height: 100%;
display: none;
}
.box-navigation .menu-item-has-children .icon {
display: block;
}
.box-navigation .sub-menu {
pointer-events: none;
position: absolute;
background-color: var(--white);
z-index: 999;
text-align: left;
top: 100%;
opacity: 0;
left: 0px;
box-shadow: 0px 4px 15px 0px rgba(163, 163, 163, 0.2509803922);
-webkit-transform: rotate3d(1, 0, 0, -90deg);
-moz-transform: rotate3d(1, 0, 0, -90deg);
-o-transform: rotate3d(1, 0, 0, -90deg);
-ms-transform: rotate3d(1, 0, 0, -90deg);
transform: rotate3d(1, 0, 0, -90deg);
-webkit-transform-origin: 0 0 0;
-moz-transform-origin: 0 0 0;
-o-transform-origin: 0 0 0;
-ms-transform-origin: 0 0 0;
transform-origin: 0 0 0;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;
}
.box-navigation .demo-label {
font-weight: 400;
font-size: 12px;
line-height: 17px;
letter-spacing: -0.24px;
display: flex;
padding: 1px 6px;
background-color: var(--bg-7);
color: var(--white);
text-transform: none;
}
.box-navigation .demo-label.type-new {
background-color: #9327A6;
}
.box-navigation .demo-label.type-trend {
background-color: #27A656;
}
@media (max-width: 1439px) {
.box-navigation .item-link {
line-height: 80px;
}
.box-navigation .item-link::after {
width: calc(100% + 100px);
}
}
.nav-icon {
display: flex;
align-items: baseline;
justify-content: end;
gap: 12px;
}
.nav-icon .nav-icon-item {
display: inline-flex;
position: relative;
}
.nav-icon .nav-icon-item .icon {
font-size: 32px;
}
.nav-icon .nav-icon-item .count-box,
.nav-icon .nav-icon-item .shopping-cart-items-count,
.nav-icon .nav-icon-item .whishlist-items-count {
width: 16px;
height: 16px;
background-color: #e5775f;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 11px;
color: #fff;
margin-left: -13px;
}
.nav-icon .nav-icon-item .count-notice {
position: absolute;
width: 9px;
height: 9px;
border-radius: 50%;
background-color: #e5775f;
border: 1px solid var(--white);
right: 0;
top: 5px;
}
.nav-icon .br-line {
width: 1px;
height: 21px;
background-color: var(--line);
position: relative;
top: -4px;
}
@media (max-width: 1199px) {
.nav-icon .br-line {
display: none;
}
}
@media (max-width: 1199px) {
.nav-icon {
gap: 5px;
}
}
.sub-menu .submenu-depth {
width: 100%;
padding: 40px;
pointer-events: none;
position: absolute;
background-color: var(--white);
z-index: 999;
text-align: left;
top: 20px;
opacity: 0;
left: 100%;
box-shadow: 0px 4px 15px 0px rgba(163, 163, 163, 0.2509803922);
-webkit-transform: rotate3d(1, 0, 0, -90deg);
-moz-transform: rotate3d(1, 0, 0, -90deg);
-o-transform: rotate3d(1, 0, 0, -90deg);
-ms-transform: rotate3d(1, 0, 0, -90deg);
transform: rotate3d(1, 0, 0, -90deg);
-webkit-transform-origin: 0 0 0;
-moz-transform-origin: 0 0 0;
-o-transform-origin: 0 0 0;
-ms-transform-origin: 0 0 0;
transform-origin: 0 0 0;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;
}
.sub-menu .submenu-depth:hover > .submenu-depth {
pointer-events: all;
opacity: 1;
visibility: visible;
-webkit-transform: rotate3d(0, 0, 0, 0deg);
-moz-transform: rotate3d(0, 0, 0, 0deg);
-o-transform: rotate3d(0, 0, 0, 0deg);
-ms-transform: rotate3d(0, 0, 0, 0deg);
transform: rotate3d(0, 0, 0, 0deg);
}
.sub-menu .menu-list {
display: grid;
gap: 10px;
}
.sub-menu .menu-link-text {
display: inline-flex;
align-items: center;
gap: 10px;
}
.sub-menu .menu-link-text.active {
color: var(--primary);
}
.sub-menu .menu-heading {
font-weight: 500;
color: var(--main);
}
.sub-menu::-webkit-scrollbar {
width: 0px;
height: 0px;
display: none;
}
.sub-menu.mega-menu {
padding-top: 0px;
padding-bottom: 0px;
padding-left: 0px;
padding-right: 0px;
border: none;
max-height: calc(100vh - 74px);
overflow: auto;
left: 0;
right: 0;
}
.sub-menu.mega-home {
padding: 42px 15px 42px;
}
@media (min-width: 1600px) {
.sub-menu.mega-home {
padding: 42px 40px 42px;
}
}
.sub-menu.mega-menu-shop .wrapper-sub-collection {
max-width: 594px;
width: 100%;
}
.sub-menu.mega-menu-product .wrapper-sub-collection {
max-width: 504px;
width: 100%;
}
@media (max-width: 1599px) {
.sub-menu.mega-menu-product .wrapper-sub-menu {
width: 100%;
display: grid;
grid-template-columns: repeat(4, 1fr);
}
.sub-menu.mega-menu-product .mega-menu-item {
min-width: unset;
}
}
.sub-menu.mega-menu-page .wrapper-sub-collection {
max-width: 792px;
width: 100%;
}
header .box-navigation .box-nav-menu > .menu-item > .sub-menu {
min-width: 292px;
padding: 32px 40px 32px;
}
.mega-menu-style-2 .mega-menu-wrap {
padding-right: 0px;
padding-left: 60px;
}
@media (min-width: 1440px) {
.mega-menu-style-2 .mega-menu-wrap {
padding-left: 175px;
}
}
.mega-menu-style-2 .wrapper-sub-collection {
margin-top: -40px;
margin-bottom: -40px;
}
.mega-menu-wrap {
display: flex;
justify-content: space-between;
gap: 40px;
padding: 40px;
padding-left: 0px;
left: unset;
}
.mega-menu-wrap .mega-menu-item {
min-width: 234.6666717529px;
}
.mega-menu-wrap .wrapper-sub-menu {
display: flex;
gap: 24px;
}
.mega-menu-wrap .wrapper-sub-collection {
display: flex;
gap: 24px;
}
.mega-home .text-coming {
font-weight: 400;
font-size: 28px;
line-height: 60px;
text-align: center;
}
.mega-home .text-coming span {
font-style: italic;
}
.row-demo {
display: grid;
grid-template-columns: repeat(6, 1fr);
gap: 20px;
overflow: visible;
padding-right: 15px;
margin-right: -15px;
margin-bottom: 30px;
}
@media (min-width: 1440px) {
.row-demo {
margin-bottom: 48px;
}
}
.row-demo::-webkit-scrollbar {
width: 5px;
}
.row-demo::-webkit-scrollbar-thumb {
background-color: var(--primary);
border-radius: 5px;
}
.row-demo .demo-image img {
box-shadow: 0px 4px 13px 0px rgba(120, 120, 120, 0.1490196078);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.row-demo .demo-item {
display: inline-flex;
position: relative;
}
.row-demo .demo-item > a {
display: flex;
flex-direction: column;
gap: 20px;
}
.row-demo .demo-item .demo-name {
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: -0.32px;
text-transform: uppercase;
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
text-wrap: nowrap;
text-overflow: ellipsis;
overflow: hidden;
text-align: center;
color: var(--black);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.row-demo .demo-item:hover .demo-image img {
box-shadow: 0px 6px 20px 2px rgba(120, 120, 120, 0.3137254902);
}
.row-demo .demo-item:hover .demo-name {
color: var(--primary);
}
.row-demo .demo-item.active .demo-name {
color: var(--primary);
}
.btn-mobile-menu {
display: flex;
align-items: center;
justify-content: start;
height: 30px;
width: 25px;
position: relative;
padding-right: 5px;
}
.btn-mobile-menu span {
display: block;
width: 30px;
height: 2px;
background-color: var(--main);
}
.btn-mobile-menu::after, .btn-mobile-menu::before {
content: "";
position: absolute;
height: 2px;
background-color: var(--main);
left: 0;
}
.btn-mobile-menu::before {
width: 20px;
top: 8px;
}
.btn-mobile-menu::after {
width: 20px;
bottom: 8px;
}
.canvas-mb {
width: 100% !important;
max-width: min(90%, 320px);
border-right: 0 !important;
}
.canvas-mb .mb-canvas-content {
padding-top: 60px;
min-width: 100%;
grid-auto-rows: minmax(0, 1fr) auto;
isolation: isolate;
height: 100%;
width: 100%;
display: grid;
align-content: start;
}
.canvas-mb .mb-body {
padding-right: 20px;
padding-left: 20px;
padding-bottom: 20px;
border-bottom: 1px solid var(--line);
overscroll-behavior-y: contain;
overflow-y: auto;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.canvas-mb .mb-body::-webkit-scrollbar {
width: 3px;
}
.canvas-mb .mb-body::-webkit-scrollbar-thumb {
background-color: var(--primary);
border-radius: 5px;
}
.canvas-mb .icon-close-popup {
position: absolute;
font-size: 16px;
z-index: 3;
top: 15px;
left: 15px;
background-color: transparent;
border: none;
height: 30px;
width: 30px;
padding: 7px;
display: inline-flex;
align-items: center;
justify-content: center;
cursor: pointer;
color: var(--black);
}
.canvas-mb .mb-bottom .site-nav-icon {
margin-bottom: 18px;
}
.canvas-mb .bottom-bar-language {
min-height: 40px;
max-width: 100%;
display: grid;
grid-template-columns: 1fr 1fr;
}
.canvas-mb .tf-dropdown-select.type-currencies > .dropdown-menu {
width: 200px !important;
}
.canvas-mb .tf-dropdown-select.type-languages > .dropdown-menu {
width: 96px !important;
margin-left: unset !important;
}
.canvas-mb .tf-currencies,
.canvas-mb .tf-languages {
display: flex;
align-items: center;
justify-content: center;
}
.canvas-mb .tf-currencies {
border-right: 1px solid var(--line);
}
.canvas-mb .dropdown-toggle {
padding: 12px 20px;
}
.canvas-mb .site-nav-icon {
padding: 10px 32px;
border: 1px solid #EBEBEB;
gap: 6px;
background-color: #fff;
border-radius: 0px;
display: inline-flex;
align-items: center;
justify-content: center;
font-weight: 500;
font-size: 13px;
line-height: 18px;
color: #000000;
width: 50%;
}
.canvas-mb .site-nav-icon .icon {
font-size: 20px;
}
.canvas-mb .site-nav-icon:hover {
color: var(--white);
background-color: var(--black);
border-color: var(--black);
}
.canvas-mb .mb-other-content .group-icon {
margin-top: 10px;
display: flex;
gap: 8px;
margin-bottom: 20px;
}
.canvas-mb .mb-other-content .text-need {
margin-bottom: 12px;
font-weight: 500;
font-size: 14px;
line-height: 24px;
text-decoration: underline;
text-underline-offset: 4px;
}
.canvas-mb .mb-other-content .mb-info li {
font-weight: 400;
font-size: 14px;
line-height: 24px;
color: #848484;
display: flex;
align-items: center;
gap: 4px;
}
.canvas-mb .mb-other-content .mb-info li:not(:last-child) {
margin-bottom: 8px;
}
.canvas-mb .mb-other-content .mb-info li b {
color: #252525;
}
.canvas-mb .mb-other-content .mb-contact {
display: grid;
gap: 8px;
margin-bottom: 12px;
}
.canvas-mb .mb-other-content .mb-contact p {
font-weight: 400;
font-size: 14px;
line-height: 24px;
color: #848484;
}
.canvas-mb .form-search {
margin-bottom: 8px;
position: relative;
}
.canvas-mb .form-search input {
padding-right: 44px;
}
@media (min-width: 992px) {
.canvas-mb {
max-width: 535px;
}
}
.nav-ul-mb .btn-open-sub {
position: relative;
width: 20px;
height: 30px;
display: inline-flex;
align-items: center;
justify-content: center;
}
.nav-ul-mb .btn-open-sub:after, .nav-ul-mb .btn-open-sub::before {
content: "";
position: absolute;
z-index: 1;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: var(--main);
transition: 0.4s ease 0.1s;
margin: auto;
}
.nav-ul-mb .btn-open-sub::before {
width: 2px;
height: 12px;
}
.nav-ul-mb .btn-open-sub::after {
width: 12px;
height: 2px;
}
.nav-ul-mb .demo-label {
font-weight: 400;
font-size: 12px;
line-height: 17px;
letter-spacing: -0.24px;
display: flex;
padding: 1px 6px;
background-color: var(--bg-7);
color: var(--white);
text-transform: none;
}
.nav-ul-mb .demo-label.type-new {
background-color: #9327A6;
}
.nav-ul-mb .demo-label.type-trend {
background-color: #27A656;
}
.nav-ul-mb .sub-nav-menu {
padding-left: 10px;
padding-bottom: 15px;
}
.sub-nav-link {
display: flex;
align-items: center;
justify-content: space-between;
min-height: 32px;
line-height: 32px;
font-size: 14px;
color: var(--black);
}
.sub-nav-link:not(.collapsed) .btn-open-sub::before {
transform: rotate(90deg);
}
.sub-nav-link .btn-open-sub::after, .sub-nav-link .btn-open-sub::before {
background-color: var(--black);
}
.sub-nav-link.line-clamp {
position: relative;
display: inline-flex;
}
.sub-nav-link.line-clamp .demo-label {
top: -5px;
right: -38px;
}
.sub-nav-link.active {
color: var(--primary);
}
.nav-ul-mb li {
position: relative;
padding: 2px 0px;
}
.nav-ul-mb li:not(:last-child) {
border-bottom: 1px solid var(--line);
}
.nav-ul-mb li a {
min-height: 40px;
font-weight: 500;
font-size: 14px;
line-height: 40px;
color: var(--main);
display: flex;
align-items: center;
justify-content: space-between;
}
.nav-ul-mb li a:not(.collapsed) .btn-open-sub::before {
transform: rotate(90deg);
}
.nav-ul-mb li.current-menu-item .a {
color: var(--primary);
}
.nav-ul-mb li.current-menu-item .a .btn-open-sub::after, .nav-ul-mb li.current-menu-item .a .btn-open-sub::before {
background-color: var(--primary);
}
.nav-ul-mb .btn-open-sub {
position: relative;
}
.nav-ul-mb .btn-open-sub:after, .nav-ul-mb .btn-open-sub::before {
content: "";
position: absolute;
z-index: 1;
top: 0;
bottom: 0;
left: auto;
right: 0;
background-color: var(--main);
transition: 0.4s ease 0.1s;
margin: auto;
}
.nav-ul-mb .btn-open-sub::before {
width: 2px;
height: 12px;
right: 5px;
}
.nav-ul-mb .btn-open-sub::after {
width: 12px;
height: 2px;
}
.nav-ul-mb .btn-open-sub.active::before {
transform: rotate(90deg);
}
.nav-ul-mb .sub-menu {
padding-left: 20px;
margin-bottom: 15px;
display: none;
position: relative;
}
.nav-ul-mb .sub-menu::after {
content: "";
width: 1px;
height: 100%;
left: 8px;
position: absolute;
top: 0;
background: #EBEBEB;
}
.nav-ul-mb .sub-menu li .sub-menu {
margin-bottom: 5px;
}
.nav-ul-mb .sub-menu a {
display: flex;
align-items: center;
justify-content: space-between;
min-height: 32px;
line-height: 32px;
font-size: 14px;
font-weight: 400;
color: var(--main);
}
.nav-ul-mb .sub-menu a:not(.collapsed) .btn-open-sub::before {
transform: rotate(90deg);
}
.nav-ul-mb .sub-menu a .btn-open-sub::after, .nav-ul-mb .sub-menu a .btn-open-sub::before {
background-color: var(--main);
}
.nav-ul-mb .sub-menu a.line-clamp {
position: relative;
display: inline-flex;
}
.nav-ul-mb .sub-menu a.line-clamp .demo-label {
top: -5px;
right: -38px;
}
.nav-ul-mb .btn-submenu {
position: absolute;
right: 0;
top: 0;
text-align: center;
cursor: pointer;
width: 100%;
height: 45px;
display: flex;
align-items: center;
justify-content: flex-end;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-ms-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}
.sub-nav-menu li:last-child .sub-menu-level-2 {
padding-bottom: 0;
}
.mb-menu-link {
min-height: 40px;
font-weight: 500;
font-size: 14px;
line-height: 40px;
display: flex;
align-items: center;
justify-content: space-between;
}
.mb-menu-link:not(.collapsed) .btn-open-sub::before {
transform: rotate(90deg);
}
.tf-currencies .dropdown-menu::after,
.tf-currencies .dropdown-menu::before {
left: 25px !important;
}
.tf-wrap-topbar-right .tf-currencies .dropdown-menu {
left: unset !important;
right: 0 !important;
}
.tf-wrap-topbar-right .tf-currencies .dropdown-menu::after {
left: unset !important;
right: 10px;
}
@media (max-width: 1439px) {
.tf-header .box-nav-menu > li {
padding-left: 15px;
padding-right: 15px;
}
.mega-menu.mega-custom {
left: 0 !important;
}
.page-title .breadcrumbs .heading {
font-size: 50px;
}
.page-title .box-text {
width: 50%;
}
}
@media (max-width: 1199px) {
.tf-header .box-nav-menu > li {
padding-left: 13px;
padding-right: 13px;
}
.page-title .breadcrumbs .heading {
font-size: 35px;
}
}
@media (max-width: 767px) {
.page-title {
flex-direction: column;
align-items: flex-start !important;
}
.page-title .box-text {
width: 100%;
}
.archive.post-type-archive-product .page-title {
padding-bottom: 0px;
}
}
.archive.post-type-archive-product #header,
.single.single-product #header {
border-bottom: 1px solid #EBEBEB;
}
@keyframes slide-har {
0% {
-webkit-transform: translateX(0%);
transform: translateX(0%);
}
100% {
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
}
.archive.woocommerce .tf-page-title .page-title {
padding-bottom: 0;
}
.archive.woocommerce .tf-page-title .heading {
display: none;
}
@media (max-width: 1199px) {
.archive.woocommerce .tf-page-title .bread-wrap {
margin-bottom: 0;
}
}   .category-list {
display: flex;
gap: 55px;
overflow: auto;
white-space: nowrap;
}
@media (max-width: 1439px) {
.category-list {
gap: 30px;
}
}
@media (max-width: 767px) {
.category-list {
gap: 15px;
}
}
.category-list a {
color: var(--main-4);
}
.footer-top {
padding: 0px 0px;
border-top: 1px solid var(--line);
border-bottom: 1px solid var(--line);
}
.footer-top .category-list {
padding: 40px 0;
}
.footer-inner-wrap {
display: flex;
gap: 24px;
flex-wrap: wrap;
}
.footer-inner-wrap > * {
width: 100%;
}
.footer-inner-wrap .box-title {
display: grid;
gap: 16px;
}
.footer-inner-wrap .notice {
font-weight: 400;
font-size: clamp(30px, 3vw, 48px);
line-height: clamp(40px, 4vw, 60px);
}
.footer-inner-wrap .box-email {
display: flex;
flex-direction: column;
gap: 20px;
}
@media (min-width: 1200px) {
.footer-inner-wrap {
padding-top: 80px;
padding-bottom: 79px;
}
}
.row-footer {
display: grid;
gap: 30px;
}
@media (min-width: 1200px) {
.row-footer {
display: flex;
gap: 0;
}
}
@media (max-width: 575px) {
.row-footer {
gap: 10px;
}
}
.footer-heading,
.footer-inner-wrap .wp-block-heading,
.footer-inner-wrap .widget-title {
font-size: 20px;
line-height: 32px;
text-transform: uppercase;
margin-bottom: 24px;
letter-spacing: 0;
font-family: "Playfair Display", serif;
}
@media (max-width: 575px) {
.footer-heading,
.footer-inner-wrap .wp-block-heading,
.footer-inner-wrap .widget-title {
margin-bottom: 20px;
}
}
.footer-menu-list,
.footer-inner-wrap .widget_nav_menu ul {
display: grid;
gap: 12px;
}
.footer-menu-list a,
.footer-inner-wrap .widget_nav_menu ul a {
color: var(--main-4);
}
.footer-menu-list a:hover,
.footer-inner-wrap .widget_nav_menu ul a:hover {
color: var(--primary);
}
.footer-body {
padding: 40px 0px;
}
@media (min-width: 576px) {
.footer-body {
padding: 60px 0px;
}
}
@media (max-width: 575px) {
.footer-body {
padding: 40px 0px 10px 0;
}
}
.footer-bottom {
padding: 31px 0px 32px;
border-top: 1px solid var(--line);
}
@media (max-width: 1199px) {
.footer-bottom {
margin-bottom: 50px;
}
}
.footer-bottom .paymend-method-list img {
width: 40px;
}
.footer-bottom-wrap {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 10px 20px;
}
@media (max-width: 1199px) {
.footer-bottom-wrap {
justify-content: center;
}
.footer-bottom-wrap .footer-bar-language {
justify-content: right;
min-width: unset;
}
.footer-bottom-wrap .paymend-method-list {
justify-content: center;
}
}
.footer-bar-language {
display: flex;
gap: 10px;
min-width: 270px;
}
@media (max-width: 767px) {
.footer-bar-language {
justify-content: center;
}
}
.paymend-method-list {
display: flex;
gap: 8px;
flex-wrap: wrap;
}
.tf-footer .form-email {
max-width: 389px;
}
.tf-footer .tf-dropdown-select > .dropdown-toggle {
padding: 9px 24px 9px 10px !important;
border-radius: 0px;
}
.tf-footer .tf-dropdown-select > .dropdown-toggle::after {
right: 10px !important;
}
.tf-footer.style-2 .footer-infor {
display: flex;
flex-direction: column;
gap: 48px;
}
.tf-footer.style-2 .footer-body {
padding: 60px 0px;
}
.tf-footer.style-2 .tf-dropdown-select > .dropdown-toggle {
border: 1px solid var(--line-5) !important;
}
.tf-footer.style-2 .footer-inner-wrap {
justify-content: space-between;
}
.tf-footer.style-2 .footer-inner-wrap > * {
width: 100%;
}
.tf-footer.style-2 .footer-bottom {
border-top: unset;
position: relative;
}
.tf-footer.style-2 .footer-bottom::after {
content: "";
position: absolute;
max-width: 1518px;
width: 100%;
height: 1px;
top: 0;
left: 50%;
transform: translateX(-50%);
background-color: var(--line-6);
}
@media (min-width: 576px) {
.tf-footer.style-2 .footer-inner-wrap {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 30px;
}
.tf-footer.style-2 .footer-inner-wrap > * {
width: auto;
}
.tf-footer:not(.style-2) .footer-inner-wrap .footer-col-block:nth-child(2) {
padding-left: 40px;
}
}
@media (max-width: 575px) {
.tf-footer.style-2 .footer-inner-wrap {
gap: 0;
}
.tf-footer.style-2 .footer-infor {
margin-bottom: 24px;
}
.tf-footer.style-2 .footer-infor {
gap: 20px;
}
}
@media (min-width: 1200px) {
.col-s1 {
width: 43.24%;
border-right: 1px solid var(--line);
}
.col-s1 .footer-inner-wrap {
width: 100%;
padding-bottom: 72px;
flex-direction: column;
padding-right: 50px;
}
}
@media (min-width: 1440px) {
.col-s1 .footer-inner-wrap {
max-width: 497px;
}
}
@media (min-width: 1200px) {
.col-s2 {
width: 56.76%;
}
.col-s2 .footer-inner-wrap {
padding-left: 50px;
max-width: 827px;
width: 100%;
justify-content: space-between;
margin-left: auto;
}
.col-s2 .footer-inner-wrap > * {
width: auto;
}
}
@media (min-width: 1440px) {
.col-s2 .footer-inner-wrap {
padding-left: 80px;
margin-left: unset;
}
}
@media (max-width: 575px) {
.col-s2 .footer-inner-wrap {
gap: 0px;
}
}
@media (max-width: 575px) {
.wrap-mb {
flex-direction: column !important;
}
.footer-heading-mobile,
.footer-col-block .widget_nav_menu .widget-title {
display: block;
position: relative;
padding-right: 20px;
line-height: 24px;
margin-bottom: 30px;
}
.footer-heading-mobile::after,
.footer-col-block .widget_nav_menu .widget-title::after {
position: absolute;
content: "";
right: 0px;
top: 50%;
transform: translateY(-50%);
width: 14px;
height: 2px;
background-color: var(--black);
transition: 0.25s ease-in-out;
}
.footer-heading-mobile::before,
.footer-col-block .widget_nav_menu .widget-title::before {
position: absolute;
content: "";
right: 5px;
top: 50%;
transform: translate(-50%, -50%);
width: 2px;
height: 14px;
background-color: var(--black);
transition: 0.25s ease-in-out;
}
.footer-heading-mobile.text-white::after, .footer-heading-mobile.text-white::before,
.footer-col-block .widget_nav_menu .widget-title.text-white::after,
.footer-col-block .widget_nav_menu .widget-title.text-white::before {
background-color: var(--white);
}
.footer-col-block .menu-footer-menu-2-container {
padding-bottom: 30px;
}
.footer-col-block:not(:last-child) .tf-collapse-content {
margin-bottom: 30px;
}
.footer-col-block:last-child .tf-collapse-content {
margin-top: 20px;
}
.footer-col-block.open .footer-heading-mobile::before {
opacity: 0;
}
.footer-col-block.open .footer-heading-mobile::after {
transform: translate(0%, -50%) rotate(180deg);
}
.footer-col-block .widget_nav_menu.open .widget-title::before {
opacity: 0;
}
.footer-col-block .widget_nav_menu.open .widget-title::after {
transform: translate(0%, -50%) rotate(180deg);
}
.footer-col-block .tf-collapse-content,
.footer-col-block .menu-footer-menu-1-container,
.footer-col-block .menu-footer-menu-2-container {
display: none;
}
.footer-col-block .menu-footer-menu-1-container {
margin-bottom: 30px;
}
}
@media (max-width: 767px) {
.tf-footer.style-2 .footer-bottom .tf-currencies {
display: block;
width: 50%;
}
}   .sw-dot-default {
margin-top: 20px;
}
.sw-dot-default.swiper-pagination-lock {
margin: 0;
}
.sw-dot-default .swiper-pagination-bullet {
width: 22px;
height: 22px;
background-color: transparent;
position: relative;
border: 1px solid transparent;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
opacity: 1;
margin: 0 !important;
}
.sw-dot-default .swiper-pagination-bullet::before {
position: absolute;
content: "";
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 8px;
height: 8px;
border-radius: 50%;
background-color: var(--main);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.sw-dot-default .swiper-pagination-bullet.swiper-pagination-bullet-active {
border: 1px solid var(--main);
}
@media (max-width: 767px) {
.sw-dot-default .swiper-pagination-bullet {
width: 16px;
height: 16px;
}
.sw-dot-default .swiper-pagination-bullet::before {
width: 6px;
height: 6px;
}
}
.sw-dot-default.style-white .swiper-pagination-bullet.swiper-pagination-bullet-active {
border: 1px solid var(--white);
}
.sw-dot-default.style-white .swiper-pagination-bullet::before {
background-color: var(--white);
}
.sw-dot-default.type-small {
gap: 5px;
}
.sw-dot-default.type-small .swiper-pagination-bullet {
width: 12px;
height: 12px;
}
.sw-dot-default.type-small .swiper-pagination-bullet::before {
width: 4px;
height: 4px;
background-color: #AFAFAF;
}
.sw-dot-default.type-small .swiper-pagination-bullet.swiper-pagination-bullet-active {
border: 1px solid var(--main);
}
.sw-dot-default.type-small .swiper-pagination-bullet.swiper-pagination-bullet-active::before {
background-color: var(--black);
}
.sw-dot-default.type-sld {
gap: 0;
}
.sw-dot-default.type-sld .swiper-pagination-bullet {
width: 20px;
height: 20px;
}
.sw-dot-default.type-sld .swiper-pagination-bullet::before {
width: 6px;
height: 6px;
}
@media (min-width: 1200px) {
.sw-dot-default {
margin-top: 30px;
}
.sw-dot-default.type-space-2 {
margin-top: 30px;
}
.sw-dot-default.type-space-3 {
margin-top: 24px;
}
}
@media (min-width: 1440px) {
.sw-dot-default {
margin-top: 40px;
}
}
.sw-dot-default {
display: flex;
align-items: center;
justify-content: center;
gap: 9px;
}
.sw-dot-default.swiper-pagination-lock {
margin: 0;
}
.nav-thumbs {
color: var(--main);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
font-weight: 400;
font-size: 14px;
line-height: 20px;
}
.nav-thumbs.swiper-button-disabled {
opacity: 0.6;
pointer-events: none;
}
.nav-thumbs:hover {
color: var(--primary);
}
@media (min-width: 768px) {
.nav-thumbs {
font-size: 18px;
line-height: 28px;
}
}
.nav-swiper-group {
position: absolute;
bottom: 10px;
left: 50%;
transform: translateX(-50%);
z-index: 2;
display: flex;
align-items: center;
gap: 10px;
font-size: 14px;
line-height: 20px;
}
.nav-swiper-group.style-2 {
transform: unset;
right: 20px;
left: unset;
}
.nav-swiper-group.style-3 {
transform: unset;
left: 24px;
bottom: 24px;
}
@media (min-width: 768px) {
.nav-swiper-group {
bottom: 24px;
}
.nav-swiper-group.style-2 {
bottom: 20px;
}
}
.thumbs-pagination {
position: absolute;
left: unset;
top: unset;
bottom: 10px;
right: 24px;
z-index: 2;
display: flex;
width: auto;
gap: 10px;
align-items: center;
font-size: 14px;
line-height: 20px;
font-weight: 400;
}
.thumbs-pagination .swiper-slice {
width: 24px;
height: 1px;
background-color: var(--black);
display: block;
}
.thumbs-pagination.style-2 {
left: 20px;
right: unset;
}
.thumbs-pagination.style-2 .swiper-slice {
width: unset;
height: unset;
background-color: unset;
}
.thumbs-pagination.style-2 .swiper-slice::after {
content: "/";
font-weight: 400;
font-size: 16px;
}
@media (min-width: 768px) {
.thumbs-pagination {
font-size: 18px;
line-height: 28px;
bottom: 24px;
}
.thumbs-pagination.style-2 {
bottom: 20px;
}
}
.tf-btn-swiper-item {
position: relative;
}
@media (min-width: 1600px) {
.tf-btn-swiper-item.pst-2 .nav-prev-swiper {
left: -28px;
right: unset;
}
.tf-btn-swiper-item.pst-2 .nav-next-swiper {
right: -28px;
left: unset;
}
}
.nav-swiper {
width: 50px;
height: 50px;
border-radius: 50%;
color: var(--main);
background-color: var(--white);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
display: flex;
align-items: center;
justify-content: center;
font-size: 30px;
position: absolute;
top: 36%;
transform: translateY(-50%);
z-index: 2;
}
.nav-swiper:hover {
background-color: var(--primary);
color: var(--white);
}
.nav-swiper.swiper-button-disabled {
opacity: 0.5;
pointer-events: none;
}
.nav-swiper.nav-next-swiper {
right: 10px;
}
.nav-swiper.nav-prev-swiper {
left: 10px;
}
@media (min-width: 1440px) {
.nav-swiper {
width: 64px;
height: 64px;
}
}
.nav-swiper.style-2 {
box-shadow: 0px 0px 16px 0px var(--black-2);
}
.nav-swiper.style-2:hover {
background-color: var(--main);
}
@media (min-width: 1800px) {
.nav-swiper.nav-next-swiper {
left: calc(100% + 10px);
right: unset;
}
.nav-swiper.nav-prev-swiper {
right: calc(100% + 10px);
left: unset;
}
}
.group-btn-slider {
display: flex;
align-items: center;
gap: 8px;
}
.group-btn-slider .tf-sw-nav {
font-size: 30px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.group-btn-slider .tf-sw-nav:hover {
color: var(--primary);
}
.group-btn-slider .tf-sw-nav.swiper-button-disabled {
color: #878787 !important;
pointer-events: none;
}
.group-btn-slider.style-white .tf-sw-nav {
color: var(--white);
}
.group-btn-slider.style-white .tf-sw-nav:hover {
color: var(--primary);
}
.group-btn-slider.type-2 .tf-sw-nav.swiper-button-disabled {
color: #DFDFDF !important;
}
@media (min-width: 1200px) {
.group-btn-slider {
gap: 16px;
}
.group-btn-slider .tf-sw-nav {
font-size: 48px;
}
}
.slider_effect_fade .swiper-slide.swiper-slide-active .fade-item {
transform: translateY(0);
opacity: 1;
visibility: visible;
}
.slider_effect_fade .fade-item {
transform: translateY(100px);
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.slider_effect_fade .fade-item.fade-box {
transition-delay: 0.4s;
transform: translateY(0px);
}
.slider_effect_fade .fade-item.fade-item-1 {
transition-delay: 0.5s;
}
.slider_effect_fade .fade-item.fade-item-2 {
transition-delay: 0.6s;
}
.slider_effect_fade .fade-item.fade-item-3 {
transition-delay: 0.7s;
}
.slider_effect_fade .fade-item.fade-item-4 {
transition-delay: 0.8s;
}
@media (max-width: 767px) {
.slider_effect_fade-md .swiper-slide.swiper-slide-active .fade-item {
transform: translateY(0);
opacity: 1;
visibility: visible;
}
.slider_effect_fade-md .fade-item {
transform: translateY(100px);
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.slider_effect_fade-md .fade-item.fade-box {
transition-delay: 0.4s;
transform: translateY(0px);
}
.slider_effect_fade-md .fade-item.fade-item-1 {
transition-delay: 0.5s;
}
.slider_effect_fade-md .fade-item.fade-item-2 {
transition-delay: 0.6s;
}
.slider_effect_fade-md .fade-item.fade-item-3 {
transition-delay: 0.7s;
}
.slider_effect_fade-md .fade-item.fade-item-4 {
transition-delay: 0.8s;
}
}
.sw-slide-show .sw-dot-default {
margin-top: 0;
position: absolute;
bottom: 20px !important;
left: 0;
right: 0;
z-index: 1;
}
@media (min-width: 1200px) {
.sw-slide-show .sw-dot-default {
bottom: 30px !important;
}
}
@media (max-width: 1439px) {
.tf-slideshow .slider_wrap {
height: 700px;
}
}
@media (max-width: 767px) {
.tf-slideshow .slider_wrap {
height: 600px;
}
}
@media (max-width: 575px) {
.tf-slideshow .slider_wrap {
height: 450px;
}
.tf-slideshow .slider_wrap.type-2 {
height: 550px;
}
}
.slider_wrap {
position: relative;
}
.slider_wrap .sld-content {
left: 0;
right: 0;
top: 50%;
transform: translateY(-50%);
position: absolute;
z-index: 2;
}
.slider_wrap .sld-content-2 {
left: 0;
right: 0;
top: calc(50% + 25px);
transform: translateY(-50%);
position: absolute;
z-index: 2;
}
@media (min-width: 992px) {
.slider_wrap .sld-content-2 {
top: calc(60% + 21px);
}
}
.slider_wrap .title-sld-2 {
color: var(--white);
margin-bottom: 20px;
}
.slider_wrap .title-sld,
.slider_wrap .title-sld-3,
.slider_wrap .sub-title-sld {
text-transform: uppercase;
color: var(--white);
}
.slider_wrap .title-sld {
margin-bottom: 15px;
}
.slider_wrap .sub-title-sld,
.slider_wrap .sub-title-sld-2,
.slider_wrap .title-sld-4 {
margin-bottom: 30px;
color: var(--white);
}
.slider_wrap .btn-group {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 15px;
}
@media (min-width: 1200px) {
.slider_wrap .title-sld {
margin-bottom: 24px;
}
.slider_wrap .title-sld-2,
.slider_wrap .sub-title-sld-2 {
margin-bottom: 40px;
}
.slider_wrap .sub-title-sld,
.slider_wrap .title-sld-4 {
margin-bottom: 60px;
}
.slider_wrap .btn-group {
gap: 32px;
}
.slider_wrap.style-2 .fade-item {
opacity: 0;
visibility: hidden;
transform: translateY(20px);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.slider_wrap.style-2 .fade-item.fade-box {
transform: translateY(0px);
}
.slider_wrap.style-2:hover .fade-item {
opacity: 1;
visibility: visible;
transform: translateY(0px);
}
.slider_wrap.style-2:hover .fade-item.fade-item-1 {
transition-delay: 0.1s;
}
.slider_wrap.style-2:hover .fade-item.fade-item-2 {
transition-delay: 0.2s;
}
.slider_wrap.style-2:hover .fade-item.fade-item-3 {
transition-delay: 0.3s;
}
}
.title-sld {
font-size: clamp(38px, 7vw, 76px);
line-height: clamp(48px, 8vw, 91px);
letter-spacing: 0;
}
.title-sld-2 {
font-size: clamp(34px, 6.5vw, 64px);
line-height: clamp(48px, 7vw, 70px);
letter-spacing: 0;
}
.title-sld-3 {
font-size: clamp(36px, 7vw, 72px);
line-height: clamp(48px, 8vw, 90px);
letter-spacing: 0;
}
.content-sld-2 {
margin-top: 40px;
}
@media (min-width: 1440px) {
.content-sld-2 {
margin-top: 100px;
margin-left: 32px;
}
}
@media (min-width: 1600px) {
.content-sld-2 {
margin-top: 156px;
}
}
@media (max-width: 575px) {
.content-sld-2 {
text-align: center;
}
.content-sld-2 .btn-group {
justify-content: center;
}
}
.sld-image {
height: 100%;
}
.sld-image img {
width: 100%;
height: 100% !important;
object-fit: cover;
}
.sld-img-item {
max-width: clamp(200px, 50vw, 324px);
width: 100%;
position: absolute;
bottom: 0;
right: 0;
z-index: 0;
}
.sld-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.2);
backdrop-filter: blur(22px);
z-index: 2;
}
@media (max-width: 1199px) {
.sld-overlay {
backdrop-filter: blur(5px);
}
}
.tes-slider .group-btn-slider {
justify-content: end;
}
.tes-slider .tf-sw-nav {
font-size: 32px;
}
.tes-slider-2 {
padding: 38px 15px;
}
.wrapper-shop.swiper-wrapper {
gap: unset !important;
}   .tf-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
font-weight: 400;
font-size: 16px;
line-height: 24px;
padding: 13px 40px;
border: 1px solid var(--main);
position: relative;
background-color: transparent;
text-transform: uppercase;
overflow: hidden;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-btn .icon {
font-size: 10px;
}
.tf-btn.btn-line {
padding: 0;
border: unset;
}
.tf-btn.btn-line::after {
content: "";
position: absolute;
bottom: 0;
left: auto;
right: 0;
width: 0%;
height: 1px;
background-color: var(--primary);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-btn.btn-line:hover {
background-color: unset;
}
.tf-btn.btn-line:hover::after {
left: 0;
right: auto;
width: 100%;
}
.tf-btn.btn-line.has-icon {
gap: 0;
}
.tf-btn.btn-line.has-icon .icon {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
transform: scale(0);
font-size: 11px;
margin-left: 12.5px;
}
.tf-btn.btn-line.has-icon .ic-2 {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
transform: scale(0);
margin-left: 22px;
font-size: clamp(16px, 2vw, 35px);
}
.tf-btn.btn-line.has-icon:hover .icon,
.tf-btn.btn-line.has-icon:hover .ic-2 {
transform: scale(1);
color: var(--primary);
}
.tf-btn.btn-fill {
background-color: var(--main);
backdrop-filter: blur(4px);
color: var(--white);
border-color: var(--main);
}
.tf-btn.btn-fill:hover {
background-color: var(--main);
border-color: var(--main);
}
.tf-btn.btn-fill-2 {
background-color: var(--primary);
backdrop-filter: blur(4px);
color: var(--white);
border-color: var(--primary);
}
.tf-btn.btn-fill-2:hover {
background-color: var(--primary);
border-color: var(--primary);
}
.tf-btn.btn-fill-3 {
background-color: #3B5998;
backdrop-filter: blur(4px);
color: var(--white);
border-color: #3B5998;
text-transform: none;
}
.tf-btn.btn-fill-3:hover {
background-color: #3B5998;
border-color: #3B5998;
}
.tf-btn.btn-fill-white {
background-color: var(--white);
color: var(--main);
border-color: var(--white);
}
.tf-btn.btn-fill-white:hover {
background-color: var(--white);
color: var(--main);
border-color: var(--white);
}
.tf-btn.btn-fill-white-2 {
background: rgba(255, 255, 255, 0.1);
color: var(--white);
border: 1px solid #FFFFFF;
position: relative;
backdrop-filter: blur(4px);
}
.tf-btn.btn-fill-white-2:hover {
background-color: var(--white);
border-color: var(--white);
color: var(--main);
}
.tf-btn.btn-unavailable {
font-weight: 500;
background-color: #9F9F9F;
border-color: #9F9F9F;
color: var(--white);
pointer-events: none;
}
.tf-btn.style-white {
color: var(--white);
}
.tf-btn.style-white-2 {
color: var(--white);
border-color: var(--white);
background-color: transparent;
text-transform: uppercase;
}
.tf-btn.style-white-2 .icon {
font-size: 24px;
}
.tf-btn.style-white-2:hover {
color: var(--main);
border-color: var(--white);
background-color: var(--white);
}
.tf-btn:hover {
background-color: var(--main);
border-color: var(--main);
color: var(--white);
}
.tf-btn:hover .btn-double-text {
transform: translateY(-200%);
}
.tf-btn:hover .btn-double-text:before {
transform: translate(-50%, 150%);
opacity: 1;
}
.tf-btn.hover-primary:hover {
background-color: var(--primary);
border-color: var(--primary);
}
.tf-btn.btn-def {
padding: 0;
border: unset;
text-transform: uppercase;
background-color: unset;
color: var(--primary);
text-wrap: nowrap;
}
.tf-btn.btn-def .icon {
font-size: 16px;
}
.tf-btn.btn-def .icon_2 {
font-size: 30px;
}
@media (min-width: 1200px) {
.tf-btn.btn-def .icon_2 {
font-size: 47px;
}
}
.tf-btn.btn-def:hover {
color: var(--secondary);
}
.tf-btn.btn-def-2 {
border: unset;
text-transform: uppercase;
background-color: unset;
color: var(--primary-3);
text-wrap: nowrap;
}
.tf-btn.btn-def-2 .icon {
font-size: 16px;
}
.tf-btn.btn-def-2::after {
position: absolute;
content: "";
width: 100%;
height: 1px;
bottom: 10px;
left: auto;
right: 0;
background-color: var(--primary-3);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-btn.btn-def-2.type-black {
padding: 2px 0px;
color: var(--black);
letter-spacing: 0;
}
.tf-btn.btn-def-2.type-black::after {
background-color: var(--main);
bottom: 0;
}
.tf-btn.btn-def-2.type-black .icon {
font-size: 11px;
padding: 2.5px;
}
@media (min-width: 992px) {
.tf-btn.btn-def-2::after {
width: 0%;
}
.tf-btn.btn-def-2:hover::after {
left: 0;
right: auto;
width: 100%;
}
}
.tf-btn.style-2 {
border-color: rgba(17, 17, 17, 0.1490196078);
}
.tf-btn.style-3 {
border-radius: 45px;
}
.tf-btn.style-4 {
border-radius: 50%;
background-color: transparent;
border: 1px solid var(--main);
text-transform: uppercase;
width: 100%;
max-width: 200px;
height: 200px;
padding: 30px;
flex-shrink: 0;
}
.tf-btn.style-4:hover {
color: var(--primary);
border-color: var(--primary);
}
@media (min-width: 1200px) {
.tf-btn.style-4 {
max-width: 292px;
height: 292px;
}
.tf-btn.style-4.type-size-2 {
max-width: 241px;
height: 241px;
}
}
.tf-btn.ic-abs {
text-transform: none;
line-height: 23px;
}
.tf-btn.ic-abs .icon {
position: absolute;
left: 16px;
top: 50%;
transform: translateY(-50%);
}
.tf-btn.w-100 {
padding-left: 15px;
padding-right: 15px;
}
.tf-btn.btn-out-line {
border-color: rgba(17, 17, 17, 0.1490196078);
backdrop-filter: blur(4px);
}
.tf-btn.btn-out-line:hover {
border-color: var(--primary);
}
.tf-btn .btn-double-text {
transition: opacity 0.3s, transform 0.6s;
transition-timing-function: cubic-bezier(0.15, 0.85, 0.31, 1);
}
.tf-btn .btn-double-text:before {
content: attr(data-text);
display: inline-block;
position: absolute;
white-space: nowrap;
top: 50%;
opacity: 0;
left: 50%;
transform: translate(-50%, 100%);
transition: opacity 0.5s, transform 0.8s;
transition-timing-function: cubic-bezier(0.15, 0.85, 0.31, 1);
}
@media (min-width: 768px) {
.tf-btn.style-3 {
padding: 11px 34px;
}
}
@media (min-width: 1200px) {
.tf-btn.type-large {
padding: 11px 34px;
}
}
@media (max-width: 1199px) {
.tf-btn {
padding: 10px 20px;
font-size: 14px;
}
}
.tf-btn-line {
font-weight: 500;
font-size: 14px;
line-height: 22px;
position: relative;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
display: inline-flex;
align-items: center;
gap: 12px;
cursor: pointer;
}
.tf-btn-line .icon {
font-size: 10px;
}
.tf-btn-line:hover {
color: var(--primary);
}
.tf-btn-line::after {
position: absolute;
content: "";
left: 0;
bottom: 0;
right: 0;
height: 1px;
background-color: var(--main);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-btn-line::before {
position: absolute;
content: "";
left: 0;
width: 0;
bottom: 0;
height: 1px;
background-color: var(--primary);
transition: width 0.3s linear;
z-index: 1;
}
.tf-btn-line.style-white {
color: var(--white);
}
.tf-btn-line.style-white::after {
background-color: var(--white);
}
.tf-btn-line.style-white-2 {
color: var(--white);
}
.tf-btn-line.style-white-2::before {
background-color: var(--secondary);
}
.tf-btn-line.style-white-2::after {
background-color: var(--white);
}
.tf-btn-line.style-line-2::after, .tf-btn-line.style-line-2::before {
bottom: 3px;
}
.tf-btn-line.style-large {
gap: 22px;
}
.tf-btn-line.style-large .icon {
font-size: clamp(18px, 4vw, 35px);
}
.tf-btn-line:hover {
background-position: left;
}
.tf-btn-line:hover::before {
width: 100%;
}
@media (min-width: 1200px) {
.tf-btn-line.hv-2 {
gap: 0;
}
.tf-btn-line.hv-2 .ic {
width: 0;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
margin-left: 0;
}
.tf-btn-line.hv-2:hover .ic {
width: 16px;
transition-delay: 0.2s;
margin-left: 10px;
}
}
.tf-btn-icon {
width: 52px;
height: 52px;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--white);
border: 1px solid var(--line);
color: var(--main);
}
.tf-btn-icon:hover {
background-color: var(--main);
border-color: var(--main);
color: var(--white);
}
.tf-btn-icon.style-circle {
border-radius: 50%;
border-color: var(--white);
width: 40px;
height: 40px;
flex-shrink: 0;
}
.tf-btn-icon.style-circle:hover {
border-color: var(--main);
}
@media (min-width: 1200px) {
.tf-btn-icon.style-circle {
width: 50px;
height: 50px;
}
.tf-btn-icon.style-circle .icon {
font-size: 20px;
}
}
@media (min-width: 1440px) {
.tf-btn-icon.style-circle {
width: 64px;
height: 64px;
}
}
@media (max-width: 1199px) {
.tf-btn-icon:not(.style-circle) {
height: 46px;
}
}
@media (min-width: 1200px) {
.tf-btn-icon.style-small {
width: 48px;
height: 48px;
}
.tf-btn-icon.style-small .icon {
font-size: 20px;
}
}
.animate-btn {
position: relative;
overflow: hidden;
}
.animate-btn:hover::after {
animation: shine-reverse 1s forwards;
}
.animate-btn:after {
content: "";
position: absolute;
width: 100%;
height: 100%;
background-image: linear-gradient(120deg, rgba(255, 255, 255, 0) 30%, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0) 70%);
top: 0;
left: -100%;
opacity: 0.6;
}
button.animate-btn::after,
.animate-btn.tf-btn::after {
background-image: linear-gradient(120deg, rgba(0, 0, 0, 0) 20%, rgba(255, 255, 255, 0.4), rgba(0, 0, 0, 0) 70%);
}
.animate-btn.animate-dark::after {
background-image: linear-gradient(90deg, transparent, rgba(0, 0, 0, 0.25), transparent);
}
@keyframes shine-reverse {
0% {
left: 100%;
}
100% {
left: -100%;
}
}
.tf-loading {
font-size: 14px;
line-height: 20px;
width: auto;
height: 42px;
min-width: 118px;
padding: 10px;
}
.tf-loading.loadmore .spinner-circle {
display: none;
}
.tf-loading.loadmore.loading .spinner-circle {
display: block;
}
.tf-loading.loadmore.loading .text {
display: none;
}
.tf-loading.loadmore:hover .spinner-child::before {
background-color: var(--white);
}
.tf-loading.loadmore .spinner-child::before {
background-color: var(--main);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.spinner-circle {
width: 24px;
height: 24px;
position: relative;
}
.spinner-circle .spinner-child {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}
.spinner-circle .spinner-child::before {
content: "";
display: block;
margin: 0 auto;
width: 20%;
height: 20%;
background-color: var(--white);
border-radius: 100%;
-webkit-animation: spinner-circleBounceDelay 1s infinite ease-in-out both;
animation: spinner-circleBounceDelay 1s infinite ease-in-out both;
}
.spinner-circle .spinner-circle2 {
-webkit-transform: rotate(40deg);
-ms-transform: rotate(40deg);
transform: rotate(40deg);
}
.spinner-circle .spinner-circle2::before {
-webkit-animation-delay: -0.9s;
animation-delay: -0.9s;
}
.spinner-circle .spinner-circle3 {
-webkit-transform: rotate(80deg);
-ms-transform: rotate(80deg);
transform: rotate(80deg);
}
.spinner-circle .spinner-circle3::before {
-webkit-animation-delay: -0.8s;
animation-delay: -0.8s;
}
.spinner-circle .spinner-circle4 {
-webkit-transform: rotate(120deg);
-ms-transform: rotate(120deg);
transform: rotate(120deg);
}
.spinner-circle .spinner-circle4::before {
-webkit-animation-delay: -0.7s;
animation-delay: -0.7s;
}
.spinner-circle .spinner-circle5 {
-webkit-transform: rotate(160deg);
-ms-transform: rotate(160deg);
transform: rotate(160deg);
}
.spinner-circle .spinner-circle5::before {
-webkit-animation-delay: -0.6s;
animation-delay: -0.6s;
}
.spinner-circle .spinner-circle6 {
-webkit-transform: rotate(200deg);
-ms-transform: rotate(200deg);
transform: rotate(200deg);
}
.spinner-circle .spinner-circle6::before {
-webkit-animation-delay: -0.5s;
animation-delay: -0.5s;
}
.spinner-circle .spinner-circle7 {
-webkit-transform: rotate(240deg);
-ms-transform: rotate(240deg);
transform: rotate(240deg);
}
.spinner-circle .spinner-circle7::before {
-webkit-animation-delay: -0.4s;
animation-delay: -0.4s;
}
.spinner-circle .spinner-circle8 {
-webkit-transform: rotate(280deg);
-ms-transform: rotate(280deg);
transform: rotate(280deg);
}
.spinner-circle .spinner-circle8::before {
-webkit-animation-delay: -0.3s;
animation-delay: -0.3s;
}
.spinner-circle .spinner-circle9 {
-webkit-transform: rotate(320deg);
-ms-transform: rotate(320deg);
transform: rotate(320deg);
}
.spinner-circle .spinner-circle9::before {
-webkit-animation-delay: -0.2s;
animation-delay: -0.2s;
}
@-webkit-keyframes spinner-circleBounceDelay {
0%, 80%, 100% {
-webkit-transform: scale(0);
transform: scale(0);
}
40% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
@keyframes spinner-circleBounceDelay {
0%, 80%, 100% {
-webkit-transform: scale(0);
transform: scale(0);
}
40% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
.tf-pin-btn {
cursor: pointer;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
position: relative;
}
.tf-pin-btn span {
display: block;
width: 23px;
height: 23px;
background-color: var(--black);
border: 5px solid var(--white-2);
border-radius: 50%;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-pin-btn span::after, .tf-pin-btn span::before {
position: absolute;
content: "";
top: 0;
right: 0;
bottom: 0;
left: 0;
border: solid 1px var(--white);
border-radius: 50%;
}
.tf-pin-btn span::before {
animation: ripple-line 2s linear infinite;
}
.tf-pin-btn span::after {
animation: ripple-line 2s 1s linear infinite;
}
.wrap-btn-viewer {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 50px;
height: 50px;
border-radius: 50%;
background-color: var(--white);
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3);
z-index: 5;
}
.wrap-btn-viewer .icon {
font-size: 20px;
}
.icon-chat {
padding-bottom: 4px;
}
.effect-flash {
position: relative;
overflow: hidden;
}
.effect-flash::after {
background-image: linear-gradient(90deg, transparent, var(--white), transparent);
content: "";
left: 150%;
position: absolute;
top: 0;
bottom: 0;
transform: skew(-20deg);
width: 200%;
animation: 3s cubic-bezier(0.01, 0.56, 1, 1) infinite erFlashEffect;
opacity: 0.7;
}
@keyframes erFlashEffect {
100%, 20% {
left: -200%;
}
}
.btn-check-none {
display: none;
white-space: nowrap;
}   form {
position: relative;
z-index: 30;
}
form textarea,
form input[type=text],
form input[type=password],
form input[type=datetime],
form input[type=datetime-local],
form input[type=date],
form input[type=month],
form input[type=time],
form input[type=week],
form input[type=number],
form input[type=email],
form input[type=url],
form input[type=search],
form input[type=tel],
form input[type=color] {
outline: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
width: 100%;
padding: 13px 0px 12px;
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: -0.32px;
border: 0;
border-bottom: 1px solid var(--line);
color: var(--main);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
border-radius: 0px;
}
form textarea::placeholder,
form input[type=text]::placeholder,
form input[type=password]::placeholder,
form input[type=datetime]::placeholder,
form input[type=datetime-local]::placeholder,
form input[type=date]::placeholder,
form input[type=month]::placeholder,
form input[type=time]::placeholder,
form input[type=week]::placeholder,
form input[type=number]::placeholder,
form input[type=email]::placeholder,
form input[type=url]::placeholder,
form input[type=search]::placeholder,
form input[type=tel]::placeholder,
form input[type=color]::placeholder {
font-weight: 400;
font-size: 16px;
line-height: 24px;
color: var(--main-4);
}
form textarea:focus,
form input[type=text]:focus,
form input[type=password]:focus,
form input[type=datetime]:focus,
form input[type=datetime-local]:focus,
form input[type=date]:focus,
form input[type=month]:focus,
form input[type=time]:focus,
form input[type=week]:focus,
form input[type=number]:focus,
form input[type=email]:focus,
form input[type=url]:focus,
form input[type=search]:focus,
form input[type=tel]:focus,
form input[type=color]:focus {
border-color: var(--primary);
}
form button,
form input[type=button],
form input[type=reset],
form input[type=submit] {
background-color: transparent;
overflow: hidden;
padding: 0;
}
form textarea {
height: 150px;
resize: none;
}
form .f-col {
display: flex;
flex-direction: column;
gap: 15px;
}
form .cols {
gap: 15px;
}
form .label-text {
margin-bottom: 10px;
}
form .form-content {
display: flex;
flex-direction: column;
gap: 20px;
}
form .form-content .cols {
gap: 20px;
}
form .form-content-2 {
display: flex;
flex-direction: column;
gap: 15px;
}
form .form-content-2 .cols {
gap: 15px;
}
form.style-border input,
form.style-border textarea {
padding: 11px 20px;
border: 1px solid var(--line-8);
}
form.style-border textarea:focus {
border-color: var(--primary);
}
form.style-btn-abs .btn-submit {
position: absolute;
right: 4px;
top: 4px;
bottom: 4px;
}
form.style-radius fieldset input {
padding: 9px 10px 9px 52px;
border-top: 1px solid var(--line);
border-right: 1px solid var(--line);
border-left: 1px solid var(--line);
border-radius: 30px;
}
form.style-radius fieldset input:focus {
border-color: var(--primary);
}
.st-border {
border: 1px solid var(--line-8) !important;
}
.modal.show {
background: rgba(0, 0, 0, 0.4) !important;
}
.tfwc-message > * {
display: block;
}
.dashboad-menu .list-menu li {
margin-bottom: 10px;
}
.dashboad-menu .list-menu li a:hover {
color: var(--primary);
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
margin: 0;
}
.tf-check {
position: relative;
background: transparent;
cursor: pointer;
outline: 0;
-webkit-appearance: none;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
width: 16px;
height: 16px;
min-width: 16px;
border: 1px solid var(--line-10);
padding: 0;
display: inline-flex;
justify-content: center;
align-items: center;
background-color: var(--white);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-check:checked {
border-color: var(--primary);
background-color: var(--primary);
}
.tf-check:checked::before {
opacity: 1;
transform: scale(1);
}
.tf-check::before {
font-weight: 500;
font-family: "vemus";
content: "\e944";
position: absolute;
color: var(--white);
opacity: 0;
font-size: 7px;
transform: scale(0);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-check.style-2 {
width: 24px;
height: 24px;
min-width: 24px;
}
@media (max-width: 1199px) {
.tf-check.style-2 {
width: 20px;
height: 20px;
min-width: 20px;
}
}
.tf-check.style-2:before {
font-size: 10px;
}
.tf-check.style-3 {
width: 40px;
height: 40px;
min-width: 40px;
}
.tf-check.style-4 {
width: 20px;
height: 20px;
min-width: 20px;
}
.checkbox-wrap {
display: flex;
align-items: center;
gap: 10px;
}
.checkbox-wrap input {
padding: 0;
}
.checkbox-wrap label {
cursor: pointer;
}
.checkbox-wrap.type-2 {
gap: 8px;
}
.checkbox-wrap.type-2 input + label {
color: var(--main-4);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.checkbox-wrap.type-2 input:checked + label {
color: var(--main);
}
.tf-field {
position: relative;
}
.tf-field .tf-input {
padding: 22px 0px 3px !important;
}
.tf-field .tf-input:not(:placeholder-shown) ~ .tf-lable, .tf-field .tf-input:focus ~ .tf-lable {
top: 0;
transform: translateY(0%);
font-size: 12px;
line-height: 20px;
letter-spacing: 0;
}
.tf-field .tf-input::placeholder {
color: transparent;
}
.tf-field .tf-lable {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
cursor: text;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
font-size: 16px;
line-height: 24px;
letter-spacing: -0.32px;
pointer-events: none;
}
.tf-field .tf-lable.type-2 {
top: 22px;
transform: 0;
}
.tf-field-2 {
position: relative;
}
.tf-field-2 .toggle-pass {
right: 15px;
}
.tf-field-2 .tf-select select {
padding: 12px;
color: var(--main-4);
}
.tf-field-2 .tf-select::after {
color: var(--main-4);
}
.tf-field-2 .tf-input {
padding: 22px 12px 2px;
}
.tf-field-2 .tf-input:not(:placeholder-shown) ~ .tf-lable, .tf-field-2 .tf-input:focus ~ .tf-lable {
top: 2px;
font-size: 12px;
line-height: 22px;
letter-spacing: 0;
}
.tf-field-2 .tf-input::placeholder {
color: transparent;
}
.tf-field-2 .tf-lable {
position: absolute;
left: 12px;
top: 13px;
cursor: text;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
font-size: 16px;
line-height: 24px;
letter-spacing: -0.32px;
pointer-events: none;
color: var(--main-4);
}
.tf-field-2 .tf-lable.type-2 {
transform: unset;
top: 13px;
}
.form-search {
position: relative;
width: 100%;
}
.form-search fieldset input {
padding: 10px 42px 9px;
}
@media (min-width: 1200px) {
.form-search fieldset input {
padding: 17px 42px 16px;
}
}
.form-search button {
position: absolute;
display: flex;
left: 0px;
top: 50%;
transform: translateY(-50%);
padding: 0;
background-color: transparent;
border: 0;
}
.form-search button .icon {
font-size: 32px;
}
.form-search.style-radius {
max-width: 346px;
width: 100%;
}
.form-search.style-radius button {
left: 10px;
}
.form-email {
position: relative;
}
.form-email fieldset input {
padding-top: 6px;
padding-bottom: 5px;
padding-right: 30px;
border-color: var(--main);
background: unset;
}
.form-email button {
font-size: 20px;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
}
.form-email .form-2 {
display: none;
}
.form-new-2 .form-email .box-btn {
flex-shrink: 0;
}
.form-new-2 input[type=email] {
outline: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
width: 100%;
padding: 11px 12px;
border: 1px solid var(--line-8);
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: 0.32px;
color: var(--main);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
border-radius: 0px;
height: unset;
padding: 15px 147px 15px 20px;
}
.form-new-2 button {
background: #000000 !important;
font-family: Jost;
font-weight: 500;
font-size: 16px;
line-height: 24px;
letter-spacing: -2%;
text-transform: uppercase;
color: #fff !important;
padding: 12px 25px;
right: 5px;
}
.form-new-2 button i {
display: none;
}
.form-new-2 button .form-2 {
display: block;
}
.form-email-2 {
display: flex;
align-items: center;
justify-content: center;
gap: 10px 20px;
flex-wrap: wrap;
width: 100%;
}
.form-email-2 .form-content {
max-width: 378px;
width: 100%;
}
.form-email-2 .form-content input {
padding: 13px 12px 13px 24px;
letter-spacing: -0.32px;
}
.form-email-2 input::placeholder {
color: var(--main-8);
}
.form-comment .form-content {
margin-bottom: 32px;
gap: 16px;
}
.form-comment .form-content .cols {
gap: 16px;
}
.form-log {
margin-bottom: 15px;
}
.form-log .form-content {
margin-bottom: 32px;
}
.form-log .bottom {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 32px;
gap: 0px 10px;
flex-wrap: wrap;
}
.form-log .tf-check {
width: 20px;
height: 20px;
}
.form-log .tf-check::before {
font-size: 9px;
}
.form-reset .form-content {
margin-bottom: 20px;
}
@media (min-width: 1200px) {
.form-reset .form-content {
margin-bottom: 40px;
}
}
.form-ask .form-content {
margin-bottom: 40px;
}
@media (min-width: 992px) {
.form-ask .form-content {
margin-bottom: 60px;
}
}
.tf-select {
position: relative;
}
.tf-select select {
border-radius: 0;
width: 100%;
padding: 16px 10px;
border: 1px solid var(--line);
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
background-color: transparent;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
font-size: 16px;
line-height: 24px;
color: var(--main);
outline: unset;
}
.tf-select::after {
font-family: "vemus";
position: absolute;
content: "\e928";
right: 12px;
top: 50%;
transform: translateY(-50%);
font-size: 10px;
z-index: -1;
font-weight: 400;
}
.tf-select:hover select {
border-color: var(--primary);
}
.tf-select.select-square select {
padding-top: 14px;
padding-bottom: 14px;
border-radius: 6px;
font-size: 14px;
line-height: 20px;
color: var(--main-4);
opacity: 0.8;
height: 50px;
}
#shipping-form .field input {
padding: 15px 10px;
}
.form-newleter {
display: grid;
gap: 24px;
}
.form-newleter .btn-group {
display: grid;
gap: 15px;
}
.form-contact .cols {
gap: 20px;
}
.form-contact .form-content {
margin-bottom: 30px;
}
.form-contact textarea {
height: 150px;
}
@media (min-width: 992px) {
.form-contact textarea {
height: 230px;
}
.form-contact .form-content {
margin-bottom: 33px;
}
}
.form-contact.style-border input, .form-contact.style-border textarea {
border: 1px solid rgba(17, 17, 17, 0.1490196078);
padding: 13px 20px;
}
@media (min-width: 576px) {
.form-engrave input,
.form-engrave textarea {
min-width: 276px;
}
}
.form-notify fieldset input {
padding: 15px 130px 15px 20px;
}
.form-notify fieldset input::placeholder {
color: var(--main-11);
font-weight: normal;
letter-spacing: -0.32px;
}
@media (min-width: 1200px) {
.form-notify fieldset input {
padding: 15px 170px 15px 20px;
}
}
.form-checkout-sidebar .form-content {
margin-bottom: 32px;
}
.form-checkout-sidebar .shop_table tr {
background: unset;
}
.form-checkout-sidebar .shop_table tr th, .form-checkout-sidebar .shop_table tr td {
padding-left: 0 !important;
padding-right: 0 !important;
vertical-align: middle;
}
.form-checkout-sidebar .shop_table tr td {
text-align: right;
}
.form-checkout-sidebar .shop_table tr th {
padding-right: 20px !important;
}
.form-checkout-cart-main {
display: grid;
gap: 30px;
}
@media (min-width: 1200px) {
.form-checkout-cart-main {
gap: 48px;
}
}
.check-ship {
display: flex;
align-items: center;
gap: 8px;
padding: 15px 16px;
border: 1px solid var(--line);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
cursor: pointer;
}
.check-ship:has(.tf-check-rounded:checked) {
border-color: var(--primary);
}
.check-ship:has(.tf-check-rounded:checked) .text {
color: var(--rgba-dark-2);
}
.check-ship .tf-check-rounded {
flex-shrink: 0;
}
.check-ship .text {
flex-grow: 1;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
gap: 12px;
color: rgba(102, 112, 133, 0.8);
}
.tf-check-rounded {
padding: 0 !important;
position: relative;
border: 1px solid #9a9a9a;
border-radius: 50%;
background: none;
cursor: pointer;
outline: 0;
height: 10px;
width: 10px;
display: flex;
align-items: center;
justify-content: center;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
}
.tf-check-rounded::before {
content: "";
position: absolute;
border-radius: 50%;
width: 6px;
height: 6px;
background-color: var(--primary);
opacity: 0;
}
.tf-check-rounded:checked {
border-color: var(--primary);
}
.tf-check-rounded:checked::before {
opacity: 1;
}
.check-payment {
display: flex;
align-items: center;
gap: 8px;
padding: 15px;
position: relative;
}
.check-payment .tf-check-rounded {
flex-shrink: 0;
}
.check-payment .text-payment,
.check-payment .pay-title {
color: rgba(102, 112, 133, 0.8);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.check-payment input:checked + .text-payment,
.check-payment input:checked + .pay-title {
color: var(--main);
}
.payment-method-box {
margin-bottom: 24px;
}
.payment-item {
border: 1px solid var(--line-8);
}
.payment-item:not(:last-child) {
margin-bottom: 15px;
}
.payment-item .card-logo {
position: absolute;
right: 12px;
top: 50%;
transform: translateY(-50%);
}
.payment-body {
padding: 4px 16px 22px;
}
.check-wrapper {
display: grid;
gap: 6px;
}
.check-wrap-list {
display: flex;
gap: 20px;
}
.wd-form-address {
padding: 30px 15px;
border: 1px solid var(--line-8);
}
.wd-form-address .text-label {
margin-bottom: 10px;
}
.wd-form-address .form-content-2 {
margin-bottom: 25px;
}
@media (min-width: 1200px) {
.wd-form-address {
padding: 32px;
}
.wd-form-address .form-content-2 {
margin-bottom: 40px;
}
}
.group-btn-form {
display: flex;
align-items: center;
gap: 10px;
}
.edit-form-address {
margin-top: 30px;
}
@media (min-width: 1200px) {
.edit-form-address {
margin-top: 48px;
}
}
.form-review .form-content {
gap: 10px;
margin-bottom: 24px;
}
.form-review .form-content .cols {
gap: 10px;
}
.form-review .checkbox-wrap {
margin-bottom: 20px;
}
@media (min-width: 1200px) {
.form-review .checkbox-wrap {
margin-bottom: 40px;
}
}
.form-notify .form-content-2 {
margin-bottom: 32px;
}
.form-notify .form-content-2 input {
padding: 12px;
}
.subscribe-msg {
margin-top: 20px;
}
.subscribe-msg .notification_ok {
text-align: center;
font-weight: 400;
color: var(--success);
}
.subscribe-msg .notification_error {
font-weight: 400;
text-align: center;
color: var(--error);
}
@media (max-width: 991px) {
.form-search button,
.form-email button {
color: var(--main);
}
.form-search button i,
.form-email button i {
color: var(--main);
}
}
.toggle-pass {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
cursor: pointer;
}
.coming-soon-form .form-content input {
border: none;
}
.form-email-3 {
position: relative;
}
.form-email-3 input[type=email] {
outline: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
width: 100%;
padding: 11px 12px;
border: 1px solid var(--line-8);
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: 0.32px;
color: var(--main);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
border-radius: 0px;
height: unset;
text-align: left;
padding: 15px 170px 15px 20px;
}
.form-email-3 .tf-btn {
position: absolute;
top: 50%;
right: 4px;
transform: translateY(-50%);
}
.widget.widget_categories select,
.widget select {
margin-bottom: 0px !important;
width: 100%;
color: var(--theme-primary-color);
}
footer .footer-col-block .widget {
margin-bottom: 30px;
}
footer .footer-col-block .widget-title {
margin-bottom: 10px;
}
.woocommerce-account .woocommerce:has(.woocommerce-form-login) h2, .lost_reset_password h2 {
font-weight: 400;
font-size: 36px;
line-height: 1.2222222222em;
text-transform: uppercase;
}
.woocommerce-lost-password .woocommerce-form-row label {
margin-bottom: 10px;
}
.woocommerce-lost-password .woocommerce-form-row input {
border: 1px solid var(--line);
color: var(--dark);
padding: 12px 20px;
}
.woocommerce .woocommerce-form {
margin-top: 40px;
}
.woocommerce .woocommerce-form .woocommerce-form-row {
margin-bottom: 32px;
display: block !important;
}
.woocommerce .woocommerce-form .woocommerce-form-row label {
margin-bottom: 10px;
}
.woocommerce .woocommerce-form .woocommerce-form-row input {
border: 1px solid var(--line);
color: var(--dark);
padding: 12px 20px;
}
.woocommerce .woocommerce-form > .form-row {
display: flex;
align-items: center;
justify-content: space-between;
gap: 30px;
}
.woocommerce .woocommerce-button, .woocommerce .woocommerce-Button {
background-color: var(--primary);
backdrop-filter: blur(4px);
color: var(--white);
border-color: var(--primary);
font-weight: 400;
font-size: 16px;
line-height: 24px;
padding: 13px 40px;
text-transform: uppercase;
}
.woocommerce .woocommerce-button:hover, .woocommerce .woocommerce-Button:hover {
background-color: var(--main);
border-color: var(--main);
color: var(--white);
}
.woocommerce-account .woocommerce:has(.woocommerce-form-login), .lost_reset_password {
max-width: 700px;
margin: 0 auto;
padding-bottom: 60px;
}
.lost_reset_password p {
margin-bottom: 15px;
}
.lost_reset_password label {
margin-bottom: 0px;
}
.woocommerce-account .woocommerce, .my-account-container {
padding-bottom: 60px;
}
.woocommerce-account .entry-content .woocommerce {
display: flex;
gap: 30px;
}
@media (min-width: 1200px) {
.woocommerce-account .entry-content .woocommerce {
gap: 64px;
}
}
.woocommerce-account .woocommerce:has(.woocommerce-form-login), .woocommerce-lost-password .woocommerce {
display: block;
}
.sidebar-account-wrap.sidebar-content-wrap {
padding: 0;
border: 1px solid var(--line);
border-top: unset;
min-width: 300px;
height: 100%;
}
.sidebar-account-wrap.sidebar-content-wrap .my-account-nav li.is-active a {
background: var(--primary);
color: #fff !important;
}
.sidebar-account-wrap.sidebar-content-wrap .my-account-nav li a {
padding: 10px;
padding-left: 20px;
width: 100%;
font-weight: 400 !important;
font-size: 16px;
line-height: 24px;
letter-spacing: -0.7px;
text-transform: uppercase;
padding-left: 68px;
}
.sidebar-account-wrap.sidebar-content-wrap .my-account-nav li a:hover {
background: var(--primary);
color: #fff !important;
}
.woocommerce-MyAccount-content p a, .account-orders p a {
color: var(--primary);
}
.woocommerce-MyAccount-content, .account-orders {
width: 100%;
overflow-x: auto;
}
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews,
p.no-comments {
background-color: rgba(0, 138, 0, 0.3);
color: #008a00;
clear: both;
font-weight: 500;
font-size: 14px;
border-radius: 5px;
padding: 13px 20px;
margin-bottom: 2em;
list-style: none;
outline: none;
}
.woocommerce-message a,
.woocommerce-info a,
.woocommerce-error a,
.woocommerce-noreviews a,
p.no-comments a {
color: inherit;
text-decoration: underline;
line-height: 1;
margin-left: 5px;
}
.woocommerce-info a.showcoupon {
margin-left: 0;
}
.woocommerce-message .showlogin,
.woocommerce-info .showlogin,
.woocommerce-error .showlogin,
.woocommerce-noreviews .showlogin,
p.no-comments .showlogin {
text-decoration: none;
cursor: inherit;
}
.woocommerce-message a.button,
.woocommerce-info a.button,
.woocommerce-error a.button,
.woocommerce-noreviews a.button,
p.no-comments a.button {
float: right;
padding: 5px 0 0 0;
background-color: transparent;
display: inline;
height: auto;
min-width: auto;
box-shadow: none;
color: inherit;
border: none;
}
.woocommerce-message a.button:hover,
.woocommerce-info a.button:hover,
.woocommerce-error a.button:hover,
.woocommerce-noreviews a.button:hover,
p.no-comments a.button:hover {
background-color: transparent;
}
.woocommerce-message a.button:after,
.woocommerce-info a.button:after,
.woocommerce-error a.button:after,
.woocommerce-noreviews a.button:after,
p.no-comments a.button:after {
display: none;
}
.woocommerce-message:after,
.woocommerce-info:after,
.woocommerce-error:after,
.woocommerce-noreviews:after,
p.no-comments:after {
clear: both;
display: block;
content: "";
}
.woocommerce-info,
.woocommerce-noreviews,
p.no-comments {
background-color: #ecf6ff;
color: #0f86ff;
}
.woocommerce-info a {
color: var(--primary);
}
.woocommerce-error {
background-color: rgba(255, 72, 72, 0.1);
color: #ff4848;
}
:not(.woocommerce-Addresses) .woocommerce-Address {
margin-top: 20px;
}
.woocommerce-Address {
width: auto;
border-radius: 0px;
border: 1px solid var(--line);
}
.woocommerce-Address h2 {
padding: 15px;
border-bottom: 1px solid var(--line);
font-size: 16px;
line-height: 24px;
font-weight: 500;
}
.woocommerce-Address a,
.woocommerce-Address address {
color: var(--text);
padding: 15px;
gap: 24px;
font-size: 16px;
line-height: 24px;
}
.woocommerce-Address address {
padding-top: 0;
line-height: 32px;
}
.woocommerce-Address a {
color: var(--primary);
}
.woocommerce-address-fields .button {
background-color: var(--primary);
backdrop-filter: blur(4px);
color: var(--white);
border-color: var(--primary);
font-weight: 400;
font-size: 16px;
line-height: 24px;
padding: 13px 40px;
text-transform: uppercase;
}
.woocommerce-address-fields .button:hover {
background-color: var(--main);
border-color: var(--main);
color: var(--white);
}
.woocommerce-EditAccountForm,
.woocommerce-address-fields,
.wd-form-address {
padding: 32px;
border: 1px solid var(--line);
border-radius: 0px;
margin-top: 30px;
}
.woocommerce-EditAccountForm .form-row,
.woocommerce-EditAccountForm .cols,
.woocommerce-address-fields .form-row,
.woocommerce-address-fields .cols,
.wd-form-address .form-row,
.wd-form-address .cols {
margin-bottom: 25px;
}
.woocommerce-EditAccountForm .form-row.form-row-first,
.woocommerce-EditAccountForm fieldset.form-row-first,
.woocommerce-address-fields .form-row.form-row-first,
.woocommerce-address-fields fieldset.form-row-first,
.wd-form-address .form-row.form-row-first,
.wd-form-address fieldset.form-row-first {
float: left;
width: 50%;
padding-right: 12px;
}
.woocommerce-EditAccountForm .form-row.form-row-last,
.woocommerce-EditAccountForm fieldset.form-row-last,
.woocommerce-address-fields .form-row.form-row-last,
.woocommerce-address-fields fieldset.form-row-last,
.wd-form-address .form-row.form-row-last,
.wd-form-address fieldset.form-row-last {
float: left;
width: 50%;
padding-left: 12px;
}
@media (max-width: 575px) {
.woocommerce-EditAccountForm .form-row.form-row-first, .woocommerce-EditAccountForm .form-row.form-row-last,
.woocommerce-EditAccountForm fieldset.form-row-first,
.woocommerce-EditAccountForm fieldset.form-row-last,
.woocommerce-address-fields .form-row.form-row-first,
.woocommerce-address-fields .form-row.form-row-last,
.woocommerce-address-fields fieldset.form-row-first,
.woocommerce-address-fields fieldset.form-row-last,
.wd-form-address .form-row.form-row-first,
.wd-form-address .form-row.form-row-last,
.wd-form-address fieldset.form-row-first,
.wd-form-address fieldset.form-row-last {
width: 100%;
padding: 0;
}
}
.woocommerce-EditAccountForm .form-row label,
.woocommerce-EditAccountForm fieldset label,
.woocommerce-address-fields .form-row label,
.woocommerce-address-fields fieldset label,
.wd-form-address .form-row label,
.wd-form-address fieldset label {
font-size: 16px;
line-height: 19px;
margin-bottom: 10px;
}
.woocommerce-EditAccountForm .form-row input,
.woocommerce-EditAccountForm fieldset input,
.woocommerce-address-fields .form-row input,
.woocommerce-address-fields fieldset input,
.wd-form-address .form-row input,
.wd-form-address fieldset input {
border: 1px solid var(--line);
color: var(--dark);
padding: 12px 20px;
}
.woocommerce-EditAccountForm .form-row .select2-container .select2-selection--single,
.woocommerce-EditAccountForm fieldset .select2-container .select2-selection--single,
.woocommerce-address-fields .form-row .select2-container .select2-selection--single,
.woocommerce-address-fields fieldset .select2-container .select2-selection--single,
.wd-form-address .form-row .select2-container .select2-selection--single,
.wd-form-address fieldset .select2-container .select2-selection--single {
color: #444;
height: 50px;
}
.woocommerce-EditAccountForm .form-row .select2-container--default .select2-selection--single .select2-selection__rendered,
.woocommerce-EditAccountForm fieldset .select2-container--default .select2-selection--single .select2-selection__rendered,
.woocommerce-address-fields .form-row .select2-container--default .select2-selection--single .select2-selection__rendered,
.woocommerce-address-fields fieldset .select2-container--default .select2-selection--single .select2-selection__rendered,
.wd-form-address .form-row .select2-container--default .select2-selection--single .select2-selection__rendered,
.wd-form-address fieldset .select2-container--default .select2-selection--single .select2-selection__rendered {
padding: 10px 20px;
border-radius: 0;
}
.woocommerce-EditAccountForm .form-row .select2-container--default .select2-selection--single .select2-selection__arrow,
.woocommerce-EditAccountForm fieldset .select2-container--default .select2-selection--single .select2-selection__arrow,
.woocommerce-address-fields .form-row .select2-container--default .select2-selection--single .select2-selection__arrow,
.woocommerce-address-fields fieldset .select2-container--default .select2-selection--single .select2-selection__arrow,
.wd-form-address .form-row .select2-container--default .select2-selection--single .select2-selection__arrow,
.wd-form-address fieldset .select2-container--default .select2-selection--single .select2-selection__arrow {
height: 50px;
border-radius: 0;
}
.woocommerce-EditAccountForm .form-row legend,
.woocommerce-EditAccountForm fieldset legend,
.woocommerce-address-fields .form-row legend,
.woocommerce-address-fields fieldset legend,
.wd-form-address .form-row legend,
.wd-form-address fieldset legend {
margin-top: 10px;
margin-bottom: 20px;
font-size: 20px;
line-height: 19px;
font-weight: 500;
}
.woocommerce-EditAccountForm .form-row .show-password-input,
.woocommerce-EditAccountForm fieldset .show-password-input,
.woocommerce-address-fields .form-row .show-password-input,
.woocommerce-address-fields fieldset .show-password-input,
.wd-form-address .form-row .show-password-input,
.wd-form-address fieldset .show-password-input {
display: none;
}
.woocommerce-EditAccountForm .form-row #account_display_name_description,
.woocommerce-EditAccountForm fieldset #account_display_name_description,
.woocommerce-address-fields .form-row #account_display_name_description,
.woocommerce-address-fields fieldset #account_display_name_description,
.wd-form-address .form-row #account_display_name_description,
.wd-form-address fieldset #account_display_name_description {
margin-top: 10px;
display: block;
}
.woocommerce-EditAccountForm .tf-cart-checkbox,
.woocommerce-address-fields .tf-cart-checkbox,
.wd-form-address .tf-cart-checkbox {
margin-bottom: 24px;
display: flex;
gap: 10px;
align-items: center;
cursor: pointer;
}
.woocommerce-EditAccountForm .box-btn,
.woocommerce-address-fields .box-btn,
.wd-form-address .box-btn {
display: flex;
gap: 12px;
}
.show-form-address,
.edit-form-address {
display: none;
}
.edit-form-address {
margin-top: 24px;
}
.account-address .title-account {
margin-bottom: 23px;
}
.cols {
display: flex;
gap: 15px 10px;
}
.cols > * {
width: 100%;
}
.woocommerce-view-order .woocommerce-order-details {
margin-top: 25px;
}
.woocommerce-view-order .cross-sells {
display: none;
}
.woocommerce-view-order .cart-box {
padding: 24px 15px;
border: 1px solid var(--line);
}
.woocommerce-view-order .cart-box:not(:last-child) {
margin-bottom: 24px;
}
.woocommerce-view-order .order-total strong,
.woocommerce-view-order .total strong {
font-weight: 500;
}
.woocommerce-view-order .shipping-cart-box .title {
margin-bottom: 24px;
}
.woocommerce-view-order .shipping-cart-box .field label {
margin-bottom: 8px;
}
.woocommerce-view-order .shipping-cart-box .field:not(:last-child) {
margin-bottom: 20px;
}
.woocommerce-view-order .shipping-cart-box input {
padding-left: 10px;
padding-right: 10px;
}
.woocommerce-view-order .shipping-cart-box input::placeholder {
opacity: 1;
}
.woocommerce-view-order .shipping-cart-box .tf-btn {
margin-top: 8px;
}
.woocommerce-view-order .checkout-cart-box .cart-head {
padding-bottom: 15px;
margin-bottom: 15px;
border-bottom: 1px solid rgba(161, 161, 161, 0.2);
}
.woocommerce-view-order .checkout-cart-box .total-discount {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
margin-bottom: 10px;
}
.woocommerce-view-order .checkout-cart-box .check-agree {
display: flex;
gap: 8px;
align-items: center;
}
.woocommerce-view-order .checkout-cart-box .check-agree label {
font-size: 14px;
line-height: 22.4px;
}
.woocommerce-view-order .checkout-cart-box .check-agree label a {
text-decoration: underline;
}
.woocommerce-view-order .checkout-cart-box .checkout-btn {
margin-top: 32px;
margin-bottom: 20px;
}
.woocommerce-view-order .checkout-cart-box .cart-list-social {
display: flex;
justify-content: center;
gap: 10px;
margin-top: 12px;
}
.woocommerce-view-order .checkout-cart-box .cart-list-social .payment-card {
border: 1px solid #D9D9D9;
border-radius: 2.5px;
width: 45px;
height: 31.3px;
}
.woocommerce-view-order .fee td,
.woocommerce-view-order .cart-discount td,
.woocommerce-view-order table.shop_table .order-total td,
.woocommerce-view-order .cart-subtotal td {
text-align: end;
}
.woocommerce-view-order .testimonial-cart-box {
border-color: transparent;
background: linear-gradient(113.78deg, #fff6d4 0%, #ffe3e3 100%);
}
.woocommerce-view-order .testimonial-cart-box .box-testimonial-main {
gap: 24px;
}
.woocommerce-view-order .testimonial-cart-box .box-testimonial-main .quote {
font-size: 42px;
}
.woocommerce-view-order .testimonial-cart-box .box-testimonial-main .icon-star {
color: #ecb100;
}
.woocommerce-view-order .testimonial-cart-box .box-author {
display: flex;
align-items: center;
gap: 5px;
}
.woocommerce-view-order .testimonial-cart-box .box-author .img {
width: 32px;
height: 32px;
border-radius: 50%;
}
.woocommerce-view-order .testimonial-cart-box .box-navigation {
gap: 10px;
margin-top: 24px;
}
.woocommerce-view-order .testimonial-cart-box .box-nav-swiper {
display: flex;
margin-top: 24px;
gap: 10px;
}
.woocommerce-view-order .testimonial-cart-box .nav-swiper {
position: unset;
margin: 0;
width: 32px;
height: 32px;
}
.woocommerce-view-order .testimonial-cart-box .nav-swiper::after {
font-size: 10px;
}
.woocommerce-view-order .order-box .title {
margin-bottom: 24px;
}
.woocommerce-view-order .order-box .list-order-product {
padding-bottom: 24px;
margin-bottom: 32px;
border-bottom: 1px solid #1F1F1F;
}
.woocommerce-view-order .order-box .order-item {
display: flex;
gap: 10px;
align-items: flex-start;
}
.woocommerce-view-order .order-box .order-item:not(:last-child) {
margin-bottom: 24px;
padding-bottom: 24px;
border-bottom: 1px solid #EBEBEB;
}
.woocommerce-view-order .order-box .order-item .img-product {
width: 80px;
height: 80px;
position: relative;
flex-shrink: 0;
max-width: unset;
}
@media (min-width: 1200px) {
.woocommerce-view-order .order-box .order-item .img-product {
width: 142px;
height: 142px;
}
}
.woocommerce-view-order .order-box .order-item .img-product img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 4px;
}
.woocommerce-view-order .order-box .order-item .img-product .quantity {
position: absolute;
width: 24px;
height: 24px;
right: -12px;
top: -12px;
border-radius: 999px;
background-color: var(--primary);
color: var(--white);
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
line-height: 20px;
font-weight: 500;
}
.woocommerce-view-order .order-box .order-item .content {
flex-grow: 1;
display: flex;
justify-content: left;
align-content: center;
gap: 20px;
}
.woocommerce-view-order .order-box .order-item .info .name {
margin-bottom: 0px;
font-size: 18px;
line-height: 28px;
}
.woocommerce-view-order .order-box .order-item .info .name a {
color: #000;
}
.woocommerce-view-order .order-box .order-item .info .name a:hover {
color: var(--primary);
}
.woocommerce-view-order .order-box .order-item .info .variant {
font-size: 16px;
line-height: 24px;
}
.woocommerce-view-order .order-box .order-item .info .variant .wc-item-meta li {
display: flex;
gap: 8px;
}
.woocommerce-view-order .order-box .order-item .info .variant .wc-item-meta li .wc-item-meta-label {
display: block;
font-weight: 400;
}
.woocommerce-view-order .order-box .list-total {
padding-bottom: 24px;
margin-bottom: 24px;
border-bottom: 1px solid rgba(161, 161, 161, 0.2);
display: flex;
flex-direction: column;
gap: 12px;
font-weight: 400;
font-size: 18px;
line-height: 28px;
text-transform: uppercase;
}
.woocommerce-view-order .order-box .btn-order {
margin-top: 32px;
}
.woocommerce-form-coupon-toggle {
margin-top: 50px;
margin-bottom: 0;
}
.checkout_coupon {
padding-bottom: 50px;
}
.checkout_coupon .coupon-wrap {
display: flex;
gap: 24px;
flex-wrap: wrap;
}
.checkout_coupon .coupon-wrap .form-row-first {
min-width: 400px;
}
@media (max-width: 575px) {
.checkout_coupon .coupon-wrap .form-row-first {
min-width: 100%;
}
}
.checkout_coupon .coupon-wrap .coupon-error-notice {
display: block;
margin-top: 5px;
}
.tf-checkout-cart-main .tf-field-label {
margin-bottom: 10px;
}
.tf-checkout-cart-main .woocommerce-additional-fields h3 {
margin-bottom: 20px;
}
.tf-checkout-cart-main .select2-selection--single {
border-radius: 0px !important;
}
.woocommerce-orders-table tr:nth-child(even) {
background: unset;
}
.woocommerce-orders-table tr {
border-bottom: 1px solid #EBEBEB;
}
.woocommerce-orders-table td, .woocommerce-orders-table th {
padding: 15.5px 14px;
text-align: center;
}
.woocommerce-orders-table .woocommerce-button.view {
background: transparent;
color: #000000;
width: 35px;
padding: 0;
}
.woocommerce-orders-table .woocommerce-button.view::after {
content: "\e907";
font-family: "vemus";
background: #fff;
width: 50px;
height: 40px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: flex;
align-items: center;
justify-content: center;
font-size: 32px;
}
.woocommerce-cart-form .wrap-coupon {
display: flex;
align-items: center;
gap: 20px 30px;
justify-content: space-between;
flex-wrap: wrap;
}
.woocommerce-cart-form .wrap-coupon .box-ip-discount {
width: 60%;
display: flex;
align-items: center;
flex-wrap: wrap;
}
@media (max-width: 767px) {
.woocommerce-cart-form .wrap-coupon .box-ip-discount {
width: 100%;
}
}
.woocommerce-cart-form .wrap-coupon .box-ip-discount input {
width: 60%;
}
@media (max-width: 575px) {
.woocommerce-cart-form .wrap-coupon .box-ip-discount input {
width: 250px;
}
}
.woocommerce-cart-form .wrap-coupon .box-ip-discount .coupon-error-notice {
width: 100%;
margin-top: 5px;
}
.woocommerce-cart-form .wrap-coupon .tf-btn {
flex-shrink: 0;
}
.tf-page-cart-main .table-shop-cart.table-order-detail {
max-width: unset;
overflow-x: unset;
table-layout: unset;
display: unset;
}
.tf-btn-line.tf-login-form {
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: -0.32px;
}
.form-login .subscribe-button:hover {
background: #000;
color: #fff;
border-color: #000;
}
.wpcf7-not-valid-tip {
position: absolute;
}
.woocommerce-checkout-review-order .wc_payment_methods li .input-radio {
height: 18px !important;
width: 18px !important;
}
.woocommerce-checkout-review-order .wc_payment_methods li .input-radio::before {
width: 8px !important;
height: 8px !important;
}
.filter-size-box .pa_size-check .count-wrap {
display: none;
}
.tf-totals-total-value .woocommerce-remove-coupon {
color: red;
}
.woocommerce-notices-wrapper .woocommerce-message,
.thank-wrap {
margin-top: 50px;
}
@media (max-width: 767px) {
.tf-page-cart-main .woocommerce-cart-form.form-cart {
overflow-x: scroll;
}
.woocommerce-checkout .tf-checkout-cart-main {
padding: 15px !important;
}
}   .nice-select {
-webkit-tap-highlight-color: transparent;
background-color: #fff;
border: 0;
padding: 0;
padding-right: 16px;
box-sizing: border-box;
clear: both;
cursor: pointer;
display: flex;
font-size: 14px;
line-height: 22px;
font-weight: 500;
outline: none;
position: relative;
transition: all linear 0.2s;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
white-space: nowrap;
width: max-content;
border-radius: 0;
color: var(--main);
}
.nice-select:active,
.nice-select.open,
.nice-select:focus {
border-color: var(--line);
}
.nice-select:after {
border-bottom: 1.7px solid var(--main);
border-right: 1.7px solid var(--main);
content: "";
height: 8px;
width: 8px;
margin-top: -6px;
pointer-events: none;
position: absolute;
right: 0;
top: 50%;
-webkit-transform-origin: 66% 66%;
-ms-transform-origin: 66% 66%;
transform-origin: 66% 66%;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-transition: all 0.15s ease-in-out;
transition: all 0.15s ease-in-out;
}
.nice-select.open:after {
-webkit-transform: rotate(-135deg);
-ms-transform: rotate(-135deg);
transform: rotate(-135deg);
-moz-transform: rotate(-135deg);
-o-transform: rotate(-135deg);
}
.nice-select.open .list {
opacity: 1;
z-index: 10;
pointer-events: auto;
-webkit-transform: scale(1) translateY(0);
-ms-transform: scale(1) translateY(0);
transform: scale(1) translateY(0);
width: 100%;
-moz-transform: scale(1) translateY(0);
-o-transform: scale(1) translateY(0);
}
.nice-select.disabled {
border-color: #ededed;
color: #999;
pointer-events: none;
}
.nice-select.disabled:after {
border-color: #cccccc;
}
.nice-select.wide {
width: 100%;
}
.nice-select.wide .list {
left: 0 !important;
right: 0 !important;
}
.nice-select.right {
float: right;
}
.nice-select.right .list {
left: auto;
right: 0;
}
.nice-select.small {
font-size: 12px;
height: 36px;
line-height: 34px;
}
.nice-select.small:after {
height: 4px;
width: 4px;
}
.nice-select.small .option {
line-height: 34px;
min-height: 34px;
}
.nice-select .list {
background-color: var(--white);
border-radius: 5px;
box-shadow: 0 0 0 1px rgba(68, 68, 68, 0.11);
box-sizing: border-box;
margin-top: 4px;
opacity: 0;
overflow: hidden;
padding: 0;
pointer-events: none;
position: absolute;
top: 100%;
left: 0;
-webkit-transform-origin: 50% 0;
-ms-transform-origin: 50% 0;
transform-origin: 50% 0;
-webkit-transform: scale(0.75) translateY(-21px);
-ms-transform: scale(0.75) translateY(-21px);
transform: scale(0.75) translateY(-21px);
-webkit-transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out;
transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out;
z-index: 9;
width: 100%;
font-size: 14px;
max-height: 155px;
overflow: auto;
}
.nice-select .list.style {
max-height: unset;
}
.nice-select .list::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
background-color: #f5f5f5;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
}
.nice-select .list::-webkit-scrollbar-thumb {
background-color: #a7a7a7;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
}
.nice-select .list::-webkit-scrollbar {
width: 6px;
height: 4px;
background-color: #f5f5f5;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
}
.nice-select .option {
cursor: pointer;
font-weight: 500;
line-height: 40px;
list-style: none;
min-height: 40px;
outline: none;
padding-left: 18px;
padding-right: 29px;
font-size: 16px;
text-align: left;
-webkit-transition: all 0.2s;
transition: all 0.2s;
color: var(--main);
}
.nice-select .option:hover,
.nice-select .option.focus,
.nice-select .option.selected.focus {
background-color: var(--white);
color: var(--primary);
}
.nice-select .option.selected {
font-weight: 600;
}
.nice-select .option.disabled {
color: var(--main);
cursor: default;
}
.no-csspointerevents .nice-select .list {
display: none;
}
.no-csspointerevents .nice-select.open .list {
display: block;
}
.tf-dropdown-select.style-default {
width: unset !important;
display: flex;
}
.tf-dropdown-select.style-default > select {
display: none !important;
}
.tf-dropdown-select.style-default > .dropdown-toggle {
padding: 0px;
padding-right: 14px;
background-color: transparent !important;
border: 0;
outline: none !important;
color: var(--main);
}
.tf-dropdown-select.style-default > .dropdown-toggle::after {
border: 0;
position: absolute;
right: 0;
content: "\e928";
font-family: "vemus";
font-size: 8px;
color: var(--main);
margin-left: 0px;
top: 50%;
transform: translateY(-50%);
}
.tf-dropdown-select.style-default .filter-option-inner-inner {
display: flex;
align-items: center;
justify-content: start;
font-weight: 400;
font-size: 14px;
line-height: 20px;
}
.tf-dropdown-select.style-default > .dropdown-menu {
overflow: unset !important;
margin-top: 17px !important;
margin-bottom: 17px !important;
padding: 15px 20px;
border-radius: 0;
border: 0;
background-color: var(--white);
box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 18px 0px;
}
.tf-dropdown-select.style-default > .dropdown-menu a {
padding: 5px 0;
}
.tf-dropdown-select.style-default > .dropdown-menu a .text {
display: flex;
align-items: center;
justify-content: start;
gap: 5px;
font-weight: 400;
font-size: 14px;
line-height: 16px;
}
.tf-dropdown-select.style-default > .dropdown-menu a .text img {
width: 16px;
height: 12px;
}
.tf-dropdown-select.style-default > .dropdown-menu a:hover, .tf-dropdown-select.style-default > .dropdown-menu a:active, .tf-dropdown-select.style-default > .dropdown-menu a.active {
color: var(--primary) !important;
background-color: unset !important;
}
.tf-dropdown-select.style-default > .dropdown-menu::after {
position: absolute;
content: "";
width: 16px;
height: 16px;
transform: translate(-50%, -50%) rotate(45deg);
background-color: var(--white);
top: 0;
left: 50%;
z-index: 2;
}
.tf-dropdown-select.style-default > .dropdown-menu[data-popper-placement=top-start]::after {
display: none;
}
.tf-dropdown-select.style-default > .dropdown-menu[data-popper-placement=top-start]::before {
position: absolute;
content: "";
width: 16px;
height: 16px;
transform: translate(-50%, 50%) rotate(45deg);
background-color: var(--white);
bottom: 0%;
left: 50%;
z-index: 2;
}
.tf-dropdown-select.style-default .dropdown-menu > .inner {
overflow-y: hidden !important;
}
.tf-dropdown-select.type-currencies > .dropdown-menu {
width: 180px !important;
}
.tf-dropdown-select.type-languages > .dropdown-menu {
width: 96px !important;
margin-left: -20px !important;
}
.tf-dropdown-select.color-white > .dropdown-toggle {
color: var(--white);
}
.tf-dropdown-select.color-white > .dropdown-toggle::after {
color: var(--white);
}
.tf-dropdown-wrap {
display: flex;
gap: 20px;
}
.tf-dropdown-sort {
padding: 7px 12px;
min-width: 100px;
border: 1px solid var(--line);
cursor: pointer;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-dropdown-sort .icon {
font-size: 12px;
display: inline-block;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
margin-bottom: 2px;
}
.tf-dropdown-sort .btn-select {
display: flex;
align-items: center;
text-wrap: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 16px;
line-height: 20px;
gap: 20px;
}
.tf-dropdown-sort .btn-select .icon {
font-size: 12px;
}
.tf-dropdown-sort.show .btn-select .icon {
transform: rotate(180deg);
}
.tf-dropdown-sort .text-sort-value {
text-wrap: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-weight: 400;
font-size: 14px;
line-height: 24px;
letter-spacing: 0%;
text-transform: uppercase;
}
.tf-dropdown-sort .dropdown-menu {
min-width: 180px;
border: 1px solid var(--line);
padding: 10px 5px;
border-radius: 0px;
max-height: 68vh;
isolation: isolate;
overscroll-behavior-y: contain;
overflow-y: auto;
z-index: 99;
}
.tf-dropdown-sort .dropdown-menu::-webkit-scrollbar {
width: 5px;
}
.tf-dropdown-sort .dropdown-menu::-webkit-scrollbar-thumb {
border-radius: 4px;
}
.tf-dropdown-sort .select-item {
position: relative;
font-size: 14px;
font-weight: 400;
text-transform: capitalize;
color: var(--black);
padding: 0 15px;
line-height: 30px;
width: 100%;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-dropdown-sort .select-item:hover, .tf-dropdown-sort .select-item.active {
color: var(--white);
background-color: var(--primary);
}
.tf-dropdown-sort:hover {
border-color: var(--primary);
}
@media (min-width: 1200px) {
.tf-dropdown-sort .text-sort-value {
font-size: 16px;
}
}   .swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0px;
}
.sw-auto .swiper-wrapper {
align-items: center;
}
.sw-auto .swiper-slide {
width: auto;
transition-timing-function: linear;
}
.slider-auto-vertical .swiper-slide {
height: max-content !important;
}
.layout-sw-center {
overflow: hidden;
}   .offcanvas {
border: none !important;
color: var(--black);
z-index: 3000;
}
.offcanvas .icon-close-popup {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
cursor: pointer;
background: transparent;
font-size: 16px;
padding: 16px;
border: none;
color: var(--black);
z-index: 10;
}
.offcanvas .icon-close-popup:hover {
color: var(--primary);
}
.offcanvas .icon-close-popup.type-right {
top: 16px;
right: 16px;
}
@media (min-width: 1200px) {
.offcanvas .icon-close-popup {
font-size: 16px !important;
}
}
.offcanvas .offcanvas-content {
height: 100%;
}
.offcanvas-search .popup-content .results-product {
flex: 4 !important;
}
.offcanvas-backdrop {
z-index: 2999;
cursor: url(//www.zefiro-accessori.it/wp-content/themes/vemus/images/cursor-close.svg), auto;
}
.overflow-x-auto::-webkit-scrollbar,
.overflow-y-auto::-webkit-scrollbar {
width: 0px;
}
.modal {
cursor: url(//www.zefiro-accessori.it/wp-content/themes/vemus/images/cursor-close.svg), auto;
}
.modal .icon-close-popup {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
cursor: pointer;
background: transparent;
font-size: 16px;
padding: 16px;
border: none;
color: var(--black);
z-index: 10;
position: absolute;
top: 0px;
right: 0px;
}
.modal .icon-close-popup:hover {
color: var(--primary);
}
@media (min-width: 576px) {
.modal .icon-close-popup {
top: 10px;
right: 10px;
}
}
.modal .modal-content {
border: 0;
}
.modal .modal-body {
padding: 0;
}
.modal.fullRight .modal-dialog {
transform: translate(100%, 0);
min-width: 100%;
height: 100%;
margin: 0;
transition: transform 1s ease-out;
}
.modal.fullRight .modal-dialog .modal-content {
border-radius: 0;
border: 0;
margin: auto;
overflow: hidden;
position: absolute;
right: 0;
bottom: 0;
top: 0;
padding: 0;
}
.modal.fullRight .modal-dialog .modal-content .modal-body {
overflow: auto;
padding: 0;
padding-bottom: 30px;
}
.modal.fullRight.show .modal-dialog {
transform: none;
transition: transform 0.4s ease-out;
}
.modal.fullLeft .modal-dialog {
transform: translate(-100%, 0) !important;
min-width: 100%;
height: 100%;
margin: 0;
transition: all 0.3s !important;
}
.modal.fullLeft .modal-content {
border-radius: 0;
border: 0;
margin: auto;
overflow: hidden;
position: absolute;
left: 0;
bottom: 0;
top: 0;
padding: 0;
}
.modal.fullLeft .modal-body {
overflow: auto;
padding: 0;
padding-bottom: 30px;
}
.modal.fullLeft.show .modal-dialog {
transform: translate(0, 0) !important;
}
.modal.fullBottom .modal-dialog {
transform: translate(0, 100%);
min-width: 100%;
height: 100%;
max-height: unset;
margin: 0;
transition: transform 0.3s linear !important;
}
.modal.fullBottom .modal-content {
border-radius: 0;
border: 0;
margin: auto;
overflow: hidden;
position: absolute;
right: 0;
bottom: 0;
padding: 0;
max-height: max-content;
}
.modal.fullBottom .modal-body {
overflow: auto;
padding: 0;
padding-bottom: 30px;
}
.modal.fullBottom.show .modal-dialog {
transform: translate(0, 0);
}
.modal.modalCentered .modal-dialog {
transform: translate(0, 0) !important;
}
.modal.fade:not(.show) {
opacity: 0;
}
.modal .modal-content {
cursor: default !important;
border-radius: 0px;
position: relative;
}
.modal .modal-content .btn-hide-popup {
position: absolute;
top: 0;
right: 0;
cursor: pointer;
padding: 20px;
z-index: 999;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.modal .modal-content .btn-hide-popup:hover {
color: var(--primary);
}
.canvas-sidebar {
max-width: 320px;
width: 100%;
}
.canvas-sidebar .blog-sidebar {
max-width: unset;
}
@media (min-width: 992px) {
.canvas-sidebar {
max-width: 535px;
width: 100% !important;
}
}
.canvas-wrapper {
padding: 0;
isolation: isolate;
height: 100%;
width: 100%;
max-height: none;
display: grid;
grid-auto-rows: auto minmax(0, 1fr) auto;
align-content: start;
}
.canvas-wrapper .canvas-body .widget {
margin-bottom: 30px;
}
.canvas-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 20px;
position: relative;
text-transform: capitalize;
font-size: 20px;
line-height: 30px;
font-weight: 500;
color: var(--black);
}
.canvas-header .icon-close-popup {
font-size: 12px;
height: 32px;
width: 32px;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
}
@media (min-width: 1200px) {
.canvas-header {
padding: 32px;
}
}
.canvas-body {
background-color: var(--white);
padding: 10px 20px;
overscroll-behavior-y: contain;
overflow-y: auto;
}
.canvas-body::-webkit-scrollbar {
width: 5px;
}
.canvas-body::-webkit-scrollbar-track {
background-color: var(--white);
}
.canvas-body::-webkit-scrollbar-thumb {
background: var(--primary);
border-radius: 4px;
}
@media (min-width: 1200px) {
.canvas-body {
padding: 12px 32px 15px;
}
}
.canvas-bottom {
padding: 15px 20px 20px;
}
@media (min-width: 1200px) {
.canvas-bottom {
padding: 15px 32px 32px;
}
}
.modal-log .modal-top .title {
margin-bottom: 30px;
}
.modal-log .modal-content {
padding: 32px;
}
.modal-log .modal-bottom {
width: 100%;
max-width: 440px;
margin: 0 auto;
}
.modal-log .other-login {
display: grid;
gap: 15px;
margin-bottom: 40px;
}
@media (min-width: 768px) {
.modal-log .modal-top .title {
margin-bottom: 52px;
}
}
@media (min-width: 1200px) {
.modal-log .modal-content {
padding-bottom: 100px;
}
.modal-log .modal-dialog {
max-width: 934px;
}
}
@media (max-width: 575px) {
.modal-log .modal-content {
padding: 20px 15px;
}
}
.canvas-sidebar .sub-title {
margin-bottom: 20px;
}
@media (min-width: 1200px) {
.canvas-sidebar .sub-title {
margin-bottom: 32px;
}
}
.popup-body {
overscroll-behavior-y: contain;
overflow-y: auto;
padding: 20px;
}
@media (min-width: 1200px) {
.popup-body {
padding: 20px 32px;
}
}
.popup-shopping-cart {
max-width: 320px;
}
.popup-shopping-cart .tf-mini-cart-threshold {
padding: 20px;
}
.popup-shopping-cart .tf-mini-cart-threshold .text {
margin-bottom: 20px;
}
@media (min-width: 1200px) {
.popup-shopping-cart .tf-mini-cart-threshold .text {
margin-bottom: 35px;
}
}
@media (max-width: 575px) {
.popup-shopping-cart .tf-mini-cart-threshold .text {
font-size: 16px;
line-height: 26px;
}
}
.popup-shopping-cart .tf-progress-ship {
margin-bottom: 40px;
}
@media (max-width: 767px) {
.popup-shopping-cart .tf-progress-ship {
margin-bottom: 30px;
}
}
.popup-shopping-cart .tf-number-count {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 20px;
border-bottom: 1px solid var(--line);
}
.popup-shopping-cart .wrap {
display: flex;
flex-direction: column;
}
.popup-shopping-cart .tf-mini-cart-wrap {
display: flex;
flex-direction: column;
flex-grow: 1;
position: relative;
}
.popup-shopping-cart .tf-mini-cart-bottom {
box-shadow: 0px -4px 10px 0px rgba(212, 212, 212, 0.2509803922);
}
.popup-shopping-cart .tf-cart-totals-discounts {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20px;
}
@media (min-width: 1200px) {
.popup-shopping-cart .tf-cart-totals-discounts {
margin-bottom: 32px;
}
}
.popup-shopping-cart .tf-mini-cart-bottom-wrap {
padding: 20px;
}
@media (min-width: 1200px) {
.popup-shopping-cart .tf-mini-cart-bottom-wrap {
padding: 24px 32px 32px;
}
}
.popup-shopping-cart .tf-mini-cart-view-checkout {
display: grid;
gap: 10px;
}
@media (min-width: 576px) {
.popup-shopping-cart {
max-width: 535px;
width: 100% !important;
}
}
@media (min-width: 1200px) {
.popup-shopping-cart .tf-mini-cart-threshold {
padding: 0px 32px;
}
.popup-shopping-cart .tf-mini-cart-bottom {
gap: 32px;
}
.popup-shopping-cart .tf-progress-ship {
margin-bottom: 63px;
}
}
.tf-mini-cart-main {
flex: 1 1 auto;
position: relative;
}
.tf-mini-cart-sroll {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
overflow: auto;
padding: 20px;
}
.tf-mini-cart-sroll::-webkit-scrollbar {
width: 5px;
}
.tf-mini-cart-sroll::-webkit-scrollbar-thumb {
background-color: var(--primary);
border-radius: 5px;
}
@media (min-width: 1200px) {
.tf-mini-cart-sroll {
padding: 20px 32px 40px;
}
}
.tf-mini-cart-items {
display: flex;
gap: 20px;
flex-direction: column;
}
.tf-mini-cart-tool {
padding: 20px 20px 20px;
display: flex;
align-items: center;
justify-content: center;
gap: 30px;
border-bottom: 1px solid var(--line-8);
}
@media (min-width: 1200px) {
.tf-mini-cart-tool {
gap: 72px;
}
}
.tf-mini-cart-tool-btn {
display: flex;
flex-direction: column;
align-items: center;
gap: 6px;
cursor: pointer;
}
.tf-mini-cart-tool-btn .icon {
font-size: 24px;
}
.tf-mini-cart-tool-openable {
position: absolute;
bottom: 0;
left: 0;
right: 0;
transform: translateY(100%);
transition: transform 0.25s ease-in-out;
z-index: 70;
}
.tf-mini-cart-tool-openable.open {
transform: translateY(0);
}
.tf-mini-cart-tool-openable.open > .overlay {
opacity: 1;
visibility: visible;
}
.tf-mini-cart-tool-openable.open .tf-mini-cart-tool-content {
box-shadow: 0px -4px 10px 0px rgba(212, 212, 212, 0.2509803922);
}
.tf-mini-cart-tool-openable > .overlay {
position: absolute;
left: 0;
bottom: 0;
height: 200vh;
right: 0;
background-color: transparent;
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-mini-cart-tool-openable .tf-mini-cart-tool-close {
cursor: pointer;
}
.tf-mini-cart-tool-openable .tf-mini-cart-tool-content {
position: relative;
z-index: 80;
padding: 20px;
background-color: var(--white);
}
.tf-mini-cart-tool-openable .tf-mini-cart-tool-content .tf-mini-cart-tool-text {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 16px;
color: #101828;
}
.tf-mini-cart-tool-openable .tf-mini-cart-tool-content .tf-mini-cart-tool-text .icon {
width: 33px;
height: 33px;
border: 1px solid var(--black);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
color: var(--black);
}
.tf-mini-cart-tool-openable .tf-mini-cart-tool-content .tf-cart-tool-btns {
display: flex;
gap: 10px;
align-items: center;
}
.tf-mini-cart-tool-openable .tf-mini-cart-tool-content .tf-cart-tool-btns .tf-btn {
text-transform: uppercase;
}
@media (max-width: 575px) {
.tf-mini-cart-tool-openable .tf-mini-cart-tool-content .tf-cart-tool-btns {
flex-wrap: wrap;
}
.tf-mini-cart-tool-openable .tf-mini-cart-tool-content .tf-cart-tool-btns > * {
width: 100%;
}
}
@media (min-width: 768px) {
.tf-mini-cart-tool-openable .tf-mini-cart-tool-content {
padding: 32px;
}
}
.tf-mini-cart-tool-openable.add-note textarea {
height: 148px;
margin-bottom: 24px;
}
.tf-mini-cart-tool-openable.coupon .tf-mini-cart-tool-text1 {
margin-bottom: 7px;
color: #475467;
}
.tf-mini-cart-tool-openable.coupon input {
margin-bottom: 90px;
}
.tf-mini-cart-tool-openable.add-gift .tf-mini-cart-tool-text1 {
margin-bottom: 50px;
color: #777777;
}
@media (min-width: 1200px) {
.tf-mini-cart-tool-openable.add-gift .tf-mini-cart-tool-text1 {
margin-bottom: 111px;
}
}
.tf-mini-cart-tool-openable.estimate-shipping select {
height: 56px;
color: #777777;
}
.tf-mini-cart-tool-openable.estimate-shipping .field {
margin-bottom: 14px;
}
.tf-mini-cart-tool-openable.estimate-shipping .field p {
margin-bottom: 10px;
color: #252525;
}
.tf-mini-cart-tool-openable.estimate-shipping .tf-cart-tool-btns {
margin-top: 30px;
}
.tf-mini-cart-tool-openable.estimate-shipping .error {
margin-top: 20px;
color: #FF6F61;
}
.tf-mini-cart-tool-openable.estimate-shipping .success {
margin-top: 20px;
}
.tf-mini-cart-tool-openable.estimate-shipping .success .standard {
color: #1CAA23;
margin-top: 4px;
}
.canvas-size .canvas-body {
display: grid;
gap: 40px;
padding-bottom: 32px;
}
.canvas-size .canvas-body .title {
margin-bottom: 12px;
}
.canvas-size .resize-info-list {
display: grid;
gap: 12px;
color: var(--main-4);
margin-bottom: 12px;
}
.canvas-size .tf-table-res-df {
margin-bottom: -16px;
}
.canvas-size .tf-table-res-df .sub {
margin-bottom: 24px;
}
.canvas-size .tf-sizeguide-table {
white-space: nowrap;
overflow: auto;
width: 100%;
height: max-content;
}
.canvas-delivery .delivery-list {
display: grid;
gap: 20px;
}
.canvas-delivery .delivery-list li {
display: grid;
gap: 4px;
}
@media (min-width: 992px) {
.canvas-delivery .delivery-list {
gap: 40px;
}
}
.canvas-pickup .store-list {
display: grid;
gap: 35px;
}
@media (min-width: 992px) {
.canvas-pickup .store-list {
gap: 48px;
}
}
.canvas-pickup .store-ready-item {
display: flex;
flex-direction: column;
align-items: start;
gap: 10px;
}
@media (min-width: 768px) {
.canvas-pickup .store-ready-item {
gap: 20px;
}
}
.canvas-pickup .store-status {
display: flex;
align-items: center;
gap: 10px;
}
.canvas-pickup .store-status .icon {
width: 20px;
height: 20px;
display: flex;
align-items: center;
justify-content: center;
color: #148710;
border: 1px solid #148710;
flex-shrink: 0;
}
.canvas-pickup .store-status .icon i {
font-size: 8px;
}
@media (max-width: 991px) {
.canvas-pickup .store-status .text {
font-size: 14px;
}
}
.canvas-description .des-list {
display: grid;
gap: 30px;
}
.canvas-description .des-list li {
display: grid;
gap: 4px;
}
@media (min-width: 992px) {
.canvas-description .des-list {
gap: 40px;
}
}
.canvas-engrave .engrave-list {
display: grid;
gap: 20px;
}
.canvas-engrave .engrave-list li {
display: grid;
gap: 15px;
}
.canvas-engrave .engrave-more-infor {
display: grid;
gap: 9px;
}
.canvas-engrave .engrave-more-infor li {
position: relative;
padding-left: 10px;
color: var(--main-4);
}
.canvas-engrave .engrave-more-infor li::after {
content: "";
top: 50%;
transform: translateY(-50%);
position: absolute;
width: 2px;
height: 2px;
background-color: var(--main-4);
}
@media (min-width: 992px) {
.canvas-engrave .engrave-list {
gap: 40px;
}
}
.tf-mini-cart-item {
display: flex;
align-items: center;
gap: 20px;
}
.tf-mini-cart-item .tf-mini-cart-image {
max-width: 100px;
}
.tf-mini-cart-item .tf-mini-cart-image img {
width: 100%;
aspect-ratio: 0.8333333333;
}
.tf-mini-cart-item .tf-mini-cart-info {
display: flex;
flex-direction: column;
align-items: start;
gap: 8px;
flex: 1;
}
.tf-mini-cart-item .tf-mini-cart-info .prd-name {
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
display: -webkit-box;
overflow: hidden;
}
.tf-mini-cart-item .prd-quantity {
display: flex;
align-items: center;
gap: 16px;
}
@media (min-width: 1200px) {
.tf-mini-cart-item .prd-quantity {
margin-bottom: 7px;
}
}
@media (max-width: 575px) {
.tf-mini-cart-item {
gap: 10px;
}
.tf-mini-cart-item .tf-mini-cart-info {
gap: 3px;
}
}
.canvas-filter .canvas-bottom {
display: flex;
align-items: center;
gap: 10px;
}
.canvas-filter .canvas-bottom > * {
width: 100%;
}
.canvas-filter .apply-filter-wrap {
margin-bottom: 40px;
}
.canvas-filter .apply-filter-wrap .count-text {
margin-bottom: 16px;
}
.canvas-filter .apply-filter-wrap .title {
margin-bottom: 18px;
}
@media (min-width: 1200px) {
.canvas-filter .apply-filter-wrap {
margin-bottom: 64px;
}
}
.modal-quick-view .icon-close-popup {
top: 0;
right: 0;
}
.modal-quick-view .variant-picker-item:first-child {
border-top: unset;
}
.modal-quick-view .product-infor-sub {
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
display: -webkit-box;
overflow: hidden;
}
.modal-quick-view .tf-product-info-list .tf-product-info-heading {
margin-bottom: 22px;
}
.modal-quick-view .modal-dialog {
margin: 15px auto;
padding-left: 15px;
padding-right: 15px;
max-width: 1153px;
}
.modal-quick-view .modal-content {
display: flex;
border-radius: unset;
}
.modal-quick-view .tf-product-media-wrap .tf-single-slide {
height: 100%;
}
.modal-quick-view .tf-product-media-wrap .item {
height: 100%;
}
.modal-quick-view .tf-product-media-wrap .item img {
width: 100%;
height: 100%;
object-fit: cover;
}
.modal-quick-view .tf-product-info-wrap {
flex: 0 0 auto;
max-width: 100%;
flex-grow: 1;
position: relative;
margin: 0;
}
.modal-quick-view .tf-product-info-inner {
padding: 20px 15px;
margin-bottom: 0;
}
.modal-quick-view .tf-product-info-inner .tf-product-info-heading {
gap: 10px 20px;
}
.modal-quick-view .tf-product-info-inner .tf-product-info-heading .product-info-name {
padding-right: 25px;
}
@media (min-width: 768px) {
.modal-quick-view .tf-product-media-wrap {
width: 55%;
max-width: 611px;
}
.modal-quick-view .tf-product-info-wrap {
width: 45%;
}
.modal-quick-view .modal-content {
flex-direction: row;
}
}
@media (min-width: 1200px) {
.modal-quick-view .tf-product-info-inner {
padding: 48px 40px;
}
}
.modal-quick-add .modal-content {
padding: 30px 20px;
}
.modal-quick-add .variant-picker-item:first-child {
border-top: unset;
}
.modal-quick-add .tf-product-mini-view {
margin-bottom: 24px;
position: relative;
padding-right: 20px;
}
.modal-quick-add .tf-product-mini-view .icon-close-popup {
top: 0;
right: 0;
padding: 0;
}
@media (min-width: 768px) {
.modal-quick-add .modal-dialog {
max-width: 537px;
}
.modal-quick-add .modal-content {
padding: 40px;
}
}
.modal-auto-product .modal-dialog {
max-width: 1413px;
}
.modal-auto-product .modal-content {
padding: 40px 15px 20px;
}
.modal-auto-product .title,
.modal-auto-product .countdown-V03 {
margin-bottom: 24px;
}
@media (min-width: 768px) {
.modal-auto-product .modal-content {
padding: 40px;
}
}
@media (min-width: 1200px) {
.modal-auto-product .modal-content {
padding: 83px 80px;
}
.modal-auto-product .countdown-V03 {
margin-bottom: 48px;
}
}
.modal-auto-newletter .modal-dialog {
max-width: 985px;
}
.modal-auto-newletter .modal-body {
display: flex;
}
.modal-auto-newletter .content {
padding: 40px 20px 20px 20px;
width: 100%;
display: flex;
flex-direction: column;
gap: 20px;
}
.modal-auto-newletter .heading {
display: grid;
gap: 24px;
}
@media (min-width: 768px) {
.modal-auto-newletter .image {
flex: 1;
}
.modal-auto-newletter .image img {
height: 100%;
aspect-ratio: 0.7821428571;
}
.modal-auto-newletter .content {
max-width: 547px;
width: 100%;
padding: 40px;
flex: 1;
}
}
@media (min-width: 1200px) {
.modal-auto-newletter .content {
padding: 82px 54px;
}
.modal-auto-newletter .heading {
margin-bottom: 12px;
}
.modal-auto-newletter .form-newleter {
margin-bottom: 20px;
}
}
@media (max-width: 767px) {
.modal-auto-newletter .modal-body {
flex-direction: column;
}
}
.modal-before-leave .modal-dialog {
max-width: 1086px;
}
.modal-before-leave .modal-content {
border: 0;
}
.modal-before-leave .modal-body {
display: flex;
}
.modal-before-leave .image-coupon {
position: relative;
width: 100%;
}
.modal-before-leave .image-coupon .image {
height: 100%;
}
.modal-before-leave .image-coupon .image img {
width: 100%;
height: 100%;
object-fit: cover;
min-height: 400px;
max-height: 560px;
}
.modal-before-leave .image-coupon .wrap {
position: absolute;
left: 15px;
right: 15px;
top: 50%;
transform: translateY(-50%);
}
@media (min-width: 768px) {
.modal-before-leave .image-coupon .wrap {
left: 30px;
right: 30px;
}
}
@media (min-width: 1200px) {
.modal-before-leave .image-coupon .wrap {
left: 60px;
right: 60px;
}
}
.modal-before-leave .title,
.modal-before-leave .sub-title,
.modal-before-leave .coupon-copy-wrap {
margin-bottom: 24px;
}
.modal-before-leave .content {
padding: 25px 15px;
width: 100%;
display: flex;
flex-direction: column;
position: relative;
}
.modal-before-leave .wrapper-leave-main {
min-height: 350px;
}
.modal-before-leave .wrapper-leave-scroll {
display: grid;
gap: 24px;
}
@media (min-width: 1200px) {
.modal-before-leave .image-coupon {
max-width: 560px;
flex: 2;
}
.modal-before-leave .image-coupon img {
aspect-ratio: 1;
}
.modal-before-leave .image-coupon .title {
line-height: 60px;
}
.modal-before-leave .sub-title {
margin-bottom: 32px;
}
.modal-before-leave .coupon-copy-wrap {
margin-bottom: 40px;
}
.modal-before-leave .content {
padding: 32px;
flex: 1;
}
.modal-before-leave .content .title {
margin-bottom: 48px;
}
.modal-before-leave .tf-product-mini-view .prd-image {
max-width: 139px;
}
}
@media (max-width: 767px) {
.modal-before-leave .modal-body {
flex-direction: column;
}
}
.coupon-copy-wrap {
display: flex;
align-items: center;
justify-content: center;
width: max-content;
gap: 12px;
padding: 13px 20px;
background-color: var(--white);
cursor: pointer;
}
.coupon-copy-wrap .coupon-code {
color: var(--primary);
}
.coupon-copy-wrap .icon {
font-size: 23px;
}
.modal-compare .modal-dialog {
max-width: 1104px;
}
.modal-compare .modal-content {
padding: 30px 15px;
}
.modal-compare .title {
margin-bottom: 24px;
}
.modal-compare .group-btn {
display: flex;
align-items: center;
justify-content: center;
gap: 15px;
}
@media (min-width: 992px) {
.modal-compare .modal-content {
padding: 32px;
}
.modal-compare .title {
margin-bottom: 48px;
}
}
.tf-compare-inner {
overflow-x: auto;
padding-bottom: 30px;
margin-bottom: 30px;
}
.tf-compare-inner::-webkit-scrollbar {
width: 4px;
height: 4px;
}
.tf-compare-inner::-webkit-scrollbar-thumb {
background-color: var(--primary);
cursor: grab;
}
.tf-compare-inner .tf-compare-list {
display: flex;
gap: 15px;
width: max-content;
}
.tf-compare-inner .tf-compare-item {
max-width: 200px;
}
@media (min-width: 768px) {
.tf-compare-inner .tf-compare-item {
max-width: 250px;
}
}
@media (min-width: 1200px) {
.tf-compare-inner {
padding-bottom: 66px;
margin-bottom: 64px;
}
.tf-compare-inner .tf-compare-list {
gap: 24px;
}
}
.modal-order-detail .modal-dialog {
max-width: 1094px;
}
.modal-order-detail .modal-top {
margin-bottom: 24px;
}
.modal-order-detail .modal-content {
padding: 30px 15px;
}
.modal-order-detail .list-infor {
display: flex;
align-items: center;
justify-content: center;
flex-wrap: wrap;
gap: 10px;
margin-bottom: 24px;
}
.modal-order-detail .list-infor .br-line {
height: 16px;
width: 1px;
background-color: var(--line-8);
}
@media (min-width: 1200px) {
.modal-order-detail .list-infor {
gap: 15px;
}
}
.modal-order-detail .order-total-wrap {
margin-top: 20px;
margin-bottom: 40px;
display: flex;
align-items: center;
justify-content: flex-end;
}
.modal-order-detail .order-total-wrap .text,
.modal-order-detail .order-total-wrap .order-total {
padding-left: 24px;
}
.modal-order-detail .order-total-wrap .text {
max-width: 183px;
width: 100%;
}
.modal-order-detail .order-total-wrap .order-total {
max-width: 220px;
width: 100%;
}
@media (min-width: 992px) {
.modal-order-detail .modal-content {
padding: 32px;
}
}
@media (min-width: 1200px) {
.modal-order-detail .list-infor {
gap: 24px;
margin-bottom: 48px;
}
.modal-order-detail .modal-top {
margin-bottom: 48px;
}
.modal-order-detail .order-total-wrap {
margin-top: 32px;
margin-bottom: 64px;
}
}
.tf-compare-item.card_product--V01 .remove {
top: 10px;
right: 10px;
}
.table-order-detail {
overflow-y: auto;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.table-order-detail.account {
border-bottom: 1px solid var(--main);
}
.table-order-detail.account::-webkit-scrollbar-thumb {
background-color: #AEAEAE;
}
.table-order-detail.account tr,
.table-order-detail.account td {
padding: 24px;
}
.table-order-detail::-webkit-scrollbar {
width: 4px;
height: 0px;
}
.table-order-detail::-webkit-scrollbar-thumb {
background-color: var(--primary);
cursor: grab;
}
.table-order-detail thead th {
text-transform: uppercase;
}
.table-order-detail tbody tr {
background-color: var(--white) !important;
}
.table-order-detail tfoot {
position: sticky;
bottom: 0px;
background-color: var(--white);
border-color: var(--white);
}
.table-order-detail th,
.table-order-detail td {
padding: 10px;
}
.table-order-detail th:nth-child(1),
.table-order-detail td:nth-child(1) {
min-width: 300px;
}
.table-order-detail th:nth-child(2),
.table-order-detail td:nth-child(2) {
min-width: 100px;
}
.table-order-detail th:nth-child(3),
.table-order-detail td:nth-child(3) {
min-width: 100px;
}
.table-order-detail th:nth-child(4),
.table-order-detail td:nth-child(4) {
min-width: 100px;
}
@media (min-width: 1200px) {
.table-order-detail th,
.table-order-detail td {
padding: 16px 24px;
}
.table-order-detail th:nth-child(2),
.table-order-detail td:nth-child(2) {
min-width: 183px;
width: 183px;
}
.table-order-detail th:nth-child(3),
.table-order-detail td:nth-child(3) {
min-width: 184px;
width: 184px;
}
.table-order-detail th:nth-child(4),
.table-order-detail td:nth-child(4) {
min-width: 220px;
}
}
.table-order-detail tr:not(:last-child) {
border-bottom: 1px solid var(--line-8);
}
.table-order-detail td {
vertical-align: top;
}
.table-order-detail td:first-child {
padding: 10px 0px;
}
@media (min-width: 1200px) {
.table-order-detail td:first-child {
padding: 24px 0px;
}
}
.table-order-detail .order_product {
display: flex;
gap: 10px;
}
.table-order-detail .order_product .image {
max-width: 100px;
}
.table-order-detail .order_product .image img {
width: 100%;
object-fit: cover;
aspect-ratio: 1;
}
.table-order-detail .order_product .infor {
display: flex;
flex-direction: column;
gap: 8px;
}
@media (min-width: 1200px) {
.table-order-detail .order_product {
gap: 20px;
}
.table-order-detail .order_product .image {
max-width: 142px;
}
}
.order_status.delivered {
color: #008A00;
}
.offcanvas-search {
height: 100vh !important;
background-color: transparent;
}
.offcanvas-search.offcanvas-top {
height: 504px;
}
.offcanvas-search .offcanvas-content {
padding: 40px 0px;
overflow-y: auto;
}
.offcanvas-search .popup-content {
max-width: 776px;
width: 100%;
margin: 0 auto;
padding: 0 15px;
}
.offcanvas-search .form-search {
margin-bottom: 30px;
}
.offcanvas-search .form-search .icon-close-popup {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
}
.offcanvas-search .feature-wrap .title {
margin-bottom: 15px;
font-weight: 500;
}
.offcanvas-search .quick-link-list {
display: grid;
gap: 10px;
}
.offcanvas-search .product-list {
display: grid;
gap: 16px;
}
.offcanvas-search .tf-product-mini-view .prd-image {
max-width: 94px;
}
.offcanvas-search .offcanvas-content {
height: auto;
background-color: var(--white);
}
.offcanvas-search .close {
flex: 1;
cursor: url(//www.zefiro-accessori.it/wp-content/themes/vemus/images/cursor-close.svg), auto;
}
.offcanvas-search .quick-link-list a {
font-weight: 400;
font-size: 16px;
line-height: 24px;
color: var(--main-4);
}
.offcanvas-search .quick-link-list a:hover {
color: var(--primary);
}
@media (min-width: 1200px) {
.offcanvas-search .offcanvas-content {
padding: 64px 0px;
}
.offcanvas-search .form-search {
margin-bottom: 64px;
}
}
@media (min-width: 1200px) and (max-width: 1199px) {
.offcanvas-search .form-search {
max-width: 80%;
}
}
@media (min-width: 1200px) {
.offcanvas-search .feature-wrap .title {
margin-bottom: 26px;
}
}
@media (max-width: 1199px) {
.offcanvas-search .tf-search-container {
gap: 25px !important;
}
.offcanvas-search .tf-search-container .tf-product-mini-view .prd-name {
font-size: 14px;
line-height: 22px;
}
.offcanvas-search .tf-search-container .tf-product-mini-view .price-wrap {
font-size: 13px;
}
.offcanvas-search .tf-search-container .results-suggestion {
flex: 1.2;
}
}
@media (max-width: 1439px) {
.offcanvas-search .feature-wrap .title {
font-size: 15px;
}
.offcanvas-search .tf-search-container {
flex-wrap: wrap;
}
.offcanvas-search .popup-content .results-product {
flex: unset !important;
order: -1;
width: 100%;
}
.offcanvas-search .popup-content .results-suggestion {
flex: 1.5;
}
}
.tf-toolbar-bottom {
display: none;
padding: 12px 15px 12px;
position: fixed;
z-index: 200;
bottom: 0;
right: 0;
left: 0;
border-top: 1px solid #eeeeee;
background-color: var(--white);
box-shadow: 0px 4px 20px 0px rgba(163, 163, 163, 0.2784313725);
}
.tf-toolbar-bottom .toolbar-item {
flex: 1 0 20%;
position: relative;
}
.tf-toolbar-bottom a {
width: 100%;
padding-right: 10px;
padding-left: 10px;
gap: 5px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
.tf-toolbar-bottom .toolbar-icon {
font-size: 20px;
position: relative;
display: flex;
}
.tf-toolbar-bottom .toolbar-icon .count-box {
position: absolute;
top: -6px;
right: -7px;
width: 16px;
height: 16px;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--secondary-2);
border-radius: 50%;
font-size: 10px;
font-weight: 500;
line-height: 15px;
color: var(--white);
}
.tf-toolbar-bottom .toolbar-count {
position: absolute;
top: -6px;
right: -10px;
width: 16px;
height: 16px;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--secondary-2);
border-radius: 50%;
font-size: 10px;
font-weight: 500;
line-height: 15px;
color: var(--white);
}
.tf-toolbar-bottom .toolbar-label {
font-size: 13px;
font-weight: 500;
line-height: 18px;
}
@media (max-width: 1199px) {
.tf-toolbar-bottom {
display: flex;
}
}
.modal-unavailable .tf-product-notify {
border: 0;
}
.modal-unavailable .modal-dialog {
max-width: 678px;
}
.cookie-banner {
position: fixed;
bottom: 20px;
left: 20px;
right: 20px;
max-width: 368px;
background-color: #000;
z-index: 99999;
}
.cookie-banner .overplay {
position: fixed;
inset: 0;
background-color: rgba(0, 0, 0, 0.4);
}
.cookie-banner .content {
position: relative;
padding: 20px;
}
.cookie-banner p {
margin-bottom: 20px;
color: var(--white);
}
.cookie-banner .button-group {
display: flex;
gap: 10px;
align-items: center;
}
.cookie-banner .button-group .tf-btn {
font-size: 14px;
font-weight: 500;
line-height: 24px;
width: 100%;
padding: 7px 7px;
border-color: #fff;
color: #fff;
}
.cookie-banner .button-group .tf-btn:hover {
background: #fff;
border-color: #fff;
color: #000;
}
.canvas-sidebar-account-wrap,
.sidebar-account-wrap {
max-width: 270px;
width: 100%;
height: max-content;
border-radius: 0;
}
@media (max-width: 575px) {
.canvas-sidebar-account-wrap,
.sidebar-account-wrap {
border: 1px solid var(--line);
max-width: 100%;
}
}
.canvas-sidebar-account-wrap .woocommerce-MyAccount-navigation-link .my-account-nav-item,
.sidebar-account-wrap .woocommerce-MyAccount-navigation-link .my-account-nav-item {
padding: 15px 12px;
display: block;
}
.canvas-sidebar-account-wrap .woocommerce-MyAccount-navigation-link .my-account-nav-item:hover,
.sidebar-account-wrap .woocommerce-MyAccount-navigation-link .my-account-nav-item:hover {
background-color: var(--primary);
color: #fff !important;
}
.canvas-sidebar-account-wrap li,
.sidebar-account-wrap li {
border-top: 1px solid var(--line);
}
.canvas-sidebar-account-wrap {
border: 0;
max-width: unset;
}
.woocommerce-MyAccount-navigation-link.is-active a {
background-color: var(--primary);
color: #fff !important;
}
.offcanvas-search .offcanvas-content .tf-close-canvas {
right: 50px;
top: 50px;
}
@media (max-width: 1439px) {
.offcanvas-search .offcanvas-content .tf-close-canvas {
right: 10px;
top: 40px;
}
}
@media (max-width: 767px) {
.offcanvas-search .offcanvas-content .tf-close-canvas {
right: 0px;
top: 40px;
}
}
@media (max-width: 1199px) {
.offcanvas-search .popup-content .form-search {
width: 80%;
}
}
#filterShop {
z-index: 100000;
}   .box-icon {
display: flex;
align-items: center;
justify-content: center;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
cursor: pointer;
}
.tf-icon-box {
display: flex;
flex-direction: column;
gap: 20px;
align-items: center;
}
.tf-icon-box .icon-box {
font-size: 40px;
}
.tf-icon-box .content {
display: grid;
gap: 8px;
}
.tf-icon-box.style-2 {
flex-direction: row;
align-items: flex-start;
justify-content: center;
gap: 12px;
}
.tf-icon-box.style-2 .icon-box {
flex-shrink: 0;
width: 64px;
height: 64px;
border-radius: 50%;
border: 1px solid var(--line);
display: flex;
align-items: center;
justify-content: center;
}
.tf-icon-box.style-2.type-column {
flex-direction: column;
gap: 22px;
}
.tf-icon-box.style-3 {
padding-right: 20px;
gap: 12px;
}
.tf-icon-box.style-3 .icon-box {
padding: 12px;
}
.slider-icon-box {
padding: 30px;
border-radius: 16px;
}
.tf-social-icon {
display: inline-flex;
gap: 15px;
--facebook-cl: rgb(59, 89, 152);
--x-cl: rgb(85, 85, 85);
--instagram-cl: linear-gradient(#8a3ab9, #e95950, #fccc63);
--threads-cl: rgb(224, 53, 102);
--youtube-cl: rgb(205, 32, 31);
--tiktok-cl: linear-gradient(#25f4ee, #000, #fe2c55);
--tiktok-cl2: rgb(254, 44, 85);
--pinterest-cl: rgb(203, 32, 39);
--tumblr-cl: rgb(55, 69, 92);
--vimeo-cl: rgb(26, 183, 234);
--snapchat-cl: rgb(255, 221, 0);
--whatsapp-cl: rgb(0, 230, 118);
--linked_in-cl: rgb(23, 106, 255);
--wechat-cl: rgb(26, 173, 24);
--reddit-cl: rgb(255, 69, 0);
--line-cl: rgb(0, 195, 77);
--spotify-cl: rgb(30, 125, 96);
}
.tf-social-icon a {
display: flex;
align-items: center;
justify-content: center;
width: 38px;
height: 38px;
border-radius: 50%;
border: 1px solid var(--line-3);
position: relative;
}
.tf-social-icon a .icon {
display: inline-flex;
position: relative;
z-index: 1;
font-size: 16px;
}
.tf-social-icon a::after {
content: "";
border-radius: 50%;
position: absolute;
background: transparent;
top: -1px;
left: -1px;
right: -1px;
bottom: -1px;
z-index: 0;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
opacity: 0;
visibility: hidden;
}
.tf-social-icon .social-facebook::after {
background: var(--facebook-cl);
}
.tf-social-icon .social-facebook:hover {
color: var(--white);
}
.tf-social-icon .social-facebook:hover::after {
opacity: 1;
visibility: visible;
}
.tf-social-icon .social-instagram::after {
background: var(--instagram-cl);
}
.tf-social-icon .social-instagram:hover {
color: var(--white);
}
.tf-social-icon .social-instagram:hover::after {
opacity: 1;
visibility: visible;
}
.tf-social-icon .social-x::after {
background: var(--x-cl);
}
.tf-social-icon .social-x:hover {
color: var(--white);
}
.tf-social-icon .social-x:hover::after {
opacity: 1;
visibility: visible;
}
.tf-social-icon .social-snapchat::after {
background: var(--snapchat-cl);
}
.tf-social-icon .social-snapchat:hover {
color: var(--white);
}
.tf-social-icon .social-snapchat:hover::after {
opacity: 1;
visibility: visible;
}
.tf-social-icon .social-pinterest::after {
background: var(--pinterest-cl);
}
.tf-social-icon .social-pinterest:hover {
color: var(--white);
}
.tf-social-icon .social-pinterest:hover::after {
opacity: 1;
visibility: visible;
}
.tf-social-icon .social-linkin::after {
background: var(--linked_in-cl);
}
.tf-social-icon .social-linkin:hover {
color: var(--white);
}
.tf-social-icon .social-linkin:hover::after {
opacity: 1;
visibility: visible;
}
.tf-social-icon.style-white a {
color: var(--white);
border-color: var(--line-4);
}
@media (min-width: 1200px) {
.tf-social-icon.style-large a {
width: 48px;
height: 48px;
}
.tf-social-icon.style-large a i {
font-size: 20px;
}
}
.tf-social-icon.style-large a i {
position: relative;
z-index: 222;
}   .hover-img .img-style {
overflow: hidden;
}
.hover-img .img-style > img {
width: 100%;
height: 100%;
object-fit: cover;
-webkit-transition: opacity 0.5s ease, transform 1.5s cubic-bezier(0, 0, 0.44, 1.18);
transition: opacity 0.5s ease, transform 1.5s cubic-bezier(0, 0, 0.44, 1.18);
}
.hover-img:hover .img-style > img {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
.hover-img .img-style2 {
overflow: hidden;
border-radius: 10px;
}
.hover-img .img-style2 .img-hv {
width: 100%;
object-fit: cover;
-webkit-transition: all 1s cubic-bezier(0.3, 1, 0.35, 1) 0s;
transition: all 1s cubic-bezier(0.3, 1, 0.35, 1) 0s;
transition: transform 500ms ease;
}
.hover-img2 .img-style2 {
overflow: hidden;
border-radius: 8px;
}
.hover-img2 .img-style2 .img2 {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.hover-img2:hover .img2 {
transform: scale(1.1) rotate(3deg);
}
.hover-img3 .img-style3 {
border-radius: 8px;
overflow: hidden;
}
.hover-img3 .img-style3 img {
width: 100%;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.hover-img3:hover img {
transform: scale(1.075);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.hover-img4 .img-style4 {
position: relative;
overflow: hidden;
}
.hover-img4 .img-style4:after {
content: "";
position: absolute;
width: 200%;
height: 0%;
left: 50%;
top: 50%;
background-color: rgba(255, 255, 255, 0.3);
transform: translate(-50%, -50%) rotate(-45deg);
z-index: 1;
pointer-events: none;
}
.hover-img4 .img-style4 img {
width: 100%;
height: 100%;
object-fit: cover;
transition: all 1s;
}
.hover-img4:hover .img-style4:after {
height: 250%;
transition: all 600ms linear;
background-color: transparent;
}
.hover-img4:hover .img-style4 img {
transform: scale(1.1);
}
.pagi2 .swiper-pagination2:hover .box-img .icon-practice,
.swiper-button-next2:hover .box-img .icon-practice,
.swiper-button-prev2:hover .box-img .icon-practice,
.hv-one:hover .box-img .icon-practice {
opacity: 1;
z-index: 99;
top: 50%;
transition-delay: 0.5s;
}
.pagi2 .swiper-pagination2:hover .img-style::before,
.swiper-button-next2:hover .img-style::before,
.swiper-button-prev2:hover .img-style::before,
.hv-one:hover .img-style::before {
opacity: 1;
}
.pagi2 .swiper-pagination2 .img-style,
.swiper-button-next2 .img-style,
.swiper-button-prev2 .img-style,
.hv-one .img-style {
border-radius: 10px;
overflow: hidden;
}
.pagi2 .swiper-pagination2 .img-style::before,
.swiper-button-next2 .img-style::before,
.swiper-button-prev2 .img-style::before,
.hv-one .img-style::before {
content: "";
top: 0;
right: 0;
left: 0;
bottom: 0;
position: absolute;
background: rgba(0, 0, 0, 0.5019607843);
width: 100%;
height: 100%;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
transition: all 0.5s ease;
z-index: 99;
opacity: 0;
border-radius: 10px;
}
.pagi2 .swiper-pagination2 .img-style.s-one::before,
.swiper-button-next2 .img-style.s-one::before,
.swiper-button-prev2 .img-style.s-one::before,
.hv-one .img-style.s-one::before {
border-radius: 50%;
}
.hv-one2:hover .img-style2::before {
opacity: 1;
visibility: visible;
}
.hv-one2 .img-style2::before {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
-webkit-transition: all 0.4s ease-out 0s;
-moz-transition: all 0.4s ease-out 0s;
-ms-transition: all 0.4s ease-out 0s;
-o-transition: all 0.4s ease-out 0s;
transition: all 0.4s ease-out 0s;
opacity: 0;
visibility: hidden;
background: rgba(0, 0, 0, 0.5);
z-index: 1;
border-radius: 10px;
}
.hv-tool {
position: relative;
transition: all 0.3s ease;
}
.hover-tooltip {
position: relative;
}
.hover-tooltip .tooltip {
font-family: "Jost", sans-serif;
position: absolute;
white-space: nowrap;
padding: 0px 8.5px;
border-radius: 2px;
bottom: calc(100% + 7px);
left: 50%;
transform: translateX(-50%);
opacity: 0;
visibility: hidden;
color: var(--white);
max-width: 250px;
width: max-content;
background-color: var(--main);
transition: transform 0.3s ease 0.1s, opacity 0.3s ease 0.1s;
z-index: 5;
font-size: 12px;
line-height: 24px;
}
.hover-tooltip .tooltip::before {
content: "";
left: 50%;
transform: translateX(-50%) rotate(45deg);
top: 20px;
position: absolute;
background: var(--main);
width: 8px;
height: 8px;
z-index: -1;
}
.hover-tooltip:hover .tooltip {
opacity: 1;
visibility: visible;
}
.hover-tooltip.tooltip-bot .tooltip {
top: calc(100% + 5px);
bottom: unset;
}
.hover-tooltip.tooltip-bot .tooltip::before {
top: -2px;
}
.hover-tooltip.tooltip-left .tooltip {
right: 100%;
bottom: auto;
transform: translateX(0px);
left: unset;
}
.hover-tooltip.tooltip-left .tooltip::before {
top: 50%;
left: auto;
transform: translateY(-50%) rotate(45deg);
right: -2px;
}
.hover-tooltip.tooltip-left:hover .tooltip {
transform: translateX(-8px);
}
.hover-tooltip.tooltip-right .tooltip {
left: 100%;
bottom: auto;
transform: translateX(0px);
}
.hover-tooltip.tooltip-right .tooltip::before {
top: 50%;
right: auto;
transform: translateY(-50%) rotate(45deg);
left: -2px;
}
.hover-tooltip.tooltip-right:hover .tooltip {
transform: translateX(8px);
}
.hover-overlay {
position: relative;
}
.hover-overlay::before {
position: absolute;
z-index: 2;
content: "";
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.1);
top: 0;
left: 0;
transition: 0.4s ease 0.1s;
opacity: 0;
visibility: hidden;
}
.hover-overlay:hover::before {
opacity: 1;
visibility: visible;
}
.hover-cursor-img .hover-image {
display: none;
}
@media (min-width: 1200px) {
.hover-cursor-img {
position: relative;
}
.hover-cursor-img .hover-image {
position: fixed;
display: block;
transform: scale(0);
pointer-events: none;
opacity: 0;
transition: transform 0.3s ease, opacity 0.3s ease;
z-index: 1000;
}
.hover-cursor-img .hover-image img {
border-radius: 50%;
max-width: 150px;
box-shadow: 0px 10px 25px 0px rgba(43, 52, 74, 0.1215686275);
}
}   .tf-main-product.section-image-zoom .tf-main-product-grid .single_variation_wrap .btn-add-to-cart {
padding: 13px 10px;
}
@media (max-width: 1199px) {
.tf-main-product.section-image-zoom .tf-main-product-grid .single_variation_wrap .btn-add-to-cart {
font-size: 14px;
}
}
.tf-product-fbt .tf-bundle-products .bundle-info select {
border-color: #1f1f1f;
}
.tf-product-fbt .tf-bundle-product-item .bundle-info {
width: 100%;
}
.tf-product-fbt .tf-bundle-product-item .tf-select select {
padding: 10px 10px;
}
.stagger-wrap .stagger-item {
transition: 0.3s ease-in-out;
transform: scale(0.5) rotate(90deg) skew(15deg);
opacity: 0;
}
.stagger-wrap .stagger-item.stagger-finished {
transform: scale(1) rotate(0deg) skew(0deg);
opacity: 1;
}
.card_product--V01 {
display: flex;
flex-direction: column;
gap: 20px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.card_product--V01 .remove {
position: absolute;
top: 8px;
right: 8px;
z-index: 21;
cursor: pointer;
border: 1px solid var(--line-11);
font-size: 10px;
background-color: var(--white);
padding: 9px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.card_product--V01 .remove:hover {
background-color: var(--primary);
color: var(--white);
border-color: var(--primary);
}
@media (min-width: 1200px) {
.card_product--V01 .remove {
top: 20px;
right: 20px;
}
}
.card_product--V01 .card_product-wrapper {
aspect-ratio: 0.7933333333;
position: relative;
overflow: hidden;
z-index: 20;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.card_product--V01 .card_product-wrapper img {
display: block;
height: 100%;
width: 100%;
object-fit: cover;
object-position: center;
transition-duration: 700ms;
}
.card_product--V01 .card_product-wrapper:hover .img-hover {
display: block;
z-index: 1;
opacity: 1;
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
.card_product--V01 .product-img {
display: flex;
width: 100%;
height: 100%;
position: relative;
align-items: stretch;
}
.card_product--V01 .img-hover {
position: absolute;
inset: 0;
opacity: 0;
}
.card_product--V01 .list-product-btn {
position: absolute;
display: flex;
align-items: center;
flex-direction: column;
gap: 12px;
top: 50%;
transform: translateY(-50%);
right: 8px;
z-index: 6;
}
.card_product--V01 .list-product-btn.center {
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
@media (max-width: 575px) {
.card_product--V01 .list-product-btn {
display: none;
}
}
.card_product--V01 .box-icon {
width: 35px;
height: 35px;
background-color: var(--white);
color: var(--black);
position: relative;
box-shadow: 0px 1px 4px 0px rgba(200, 200, 200, 0.2509803922);
}
.card_product--V01 .box-icon .icon {
font-size: 14px;
}
.card_product--V01 .box-icon:hover {
background-color: var(--black);
color: var(--white);
border-color: var(--black);
}
@media (max-width: 575px) {
.card_product--V01 .box-icon {
width: 30px;
height: 30px;
}
.card_product--V01 .box-icon .icon {
font-size: 11px;
}
}
.card_product--V01 .variant-box {
position: absolute;
bottom: 0;
left: 0;
right: 0;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
backdrop-filter: blur(4px);
z-index: 3;
}
.card_product--V01 .variant-box .size-box {
padding: 5px 5px;
background-color: var(--bg-12);
}
.card_product--V01 .marquee-sale {
display: flex;
align-items: center;
flex-wrap: nowrap;
white-space: nowrap;
padding: 5px 0px;
gap: 10px;
}
.card_product--V01 .marquee-sale .marqee-item i {
font-size: 14px;
}
@media (min-width: 768px) {
.card_product--V01 .marquee-sale {
gap: 24px;
}
.card_product--V01 .marquee-sale.type-2 {
padding: 13px 0px;
}
}
.card_product--V01 .card_product-info {
display: grid;
gap: 10px;
}
.card_product--V01.out-of-stock .card_product-wrapper > *:not(.stock, .remove) {
opacity: 0.5;
}
.card_product--V01.out-of-stock .variant-box {
padding: 5px 10px;
transform: unset !important;
z-index: 21;
}
@media (min-width: 576px) {
.card_product--V01.out-of-stock .variant-box {
padding: 14px 15px;
}
.card_product--V01.out-of-stock .variant-box.type-sp-2 {
padding: 13px 15px;
}
}
.card_product--V01 .count-down {
position: absolute;
bottom: 10px;
left: 10px;
right: 10px;
display: flex;
justify-content: center;
}
@media (min-width: 992px) {
.card_product--V01 .count-down {
bottom: 20px;
}
}
@media (min-width: 1200px) {
.card_product--V01 .count-down {
bottom: 24px;
}
}
@media (max-width: 1199px) {
.card_product--V01 .count-down {
display: none;
}
}
.card_product--V01.style_2 {
padding: 15px;
border: 1px solid transparent;
}
.card_product--V01.style_2 .price-wrap {
margin-bottom: 5px;
}
.card_product--V01.style_2 .card_product-wrapper {
aspect-ratio: 1;
}
.card_product--V01.style_2:hover, .card_product--V01.style_2.active {
border-color: var(--primary);
background-color: var(--white);
}
@media (max-width: 575px) {
.card_product--V01.style_2 {
border-color: transparent;
background-color: transparent;
padding: 0;
}
.card_product--V01.style_2:hover, .card_product--V01.style_2.active {
border-color: transparent;
background-color: transparent;
padding: 0;
}
}
@media (min-width: 992px) {
.card_product--V01 .box-icon {
width: 40px;
height: 40px;
}
.card_product--V01 .box-icon .icon {
font-size: 16px;
}
}
@media (min-width: 1200px) {
.card_product--V01.style-2 {
gap: 30px;
}
.card_product--V01 .box-icon {
width: 48px;
height: 48px;
}
.card_product--V01 .box-icon .icon {
font-size: 18px;
}
.card_product--V01 .box-icon .icon.icon-view {
font-size: 20px;
}
.card_product--V01 .list-product-btn {
right: 12px;
}
.card_product--V01 .list-product-btn li {
opacity: 0;
visibility: hidden;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.card_product--V01 .list-product-btn li:nth-child(1) {
transform: translate(50%, -50%);
}
.card_product--V01 .list-product-btn li:nth-child(2) {
transform: translate(50%, -20%);
}
.card_product--V01 .list-product-btn li:nth-child(3) {
transform: translate(50%, 20%);
}
.card_product--V01 .list-product-btn li:nth-child(4) {
transform: translate(50%, 50%);
}
.card_product--V01 .list-product-btn.center li {
transform: translateY(10px);
}
.card_product--V01:hover .list-product-btn li {
opacity: 1;
visibility: visible;
}
.card_product--V01:hover .list-product-btn li:nth-child(1) {
transform: translate(0px);
}
.card_product--V01:hover .list-product-btn li:nth-child(2) {
transform: translate(0px);
}
.card_product--V01:hover .list-product-btn li:nth-child(3) {
transform: translate(0px);
}
.card_product--V01:hover .list-product-btn li:nth-child(4) {
transform: translate(0px);
}
.card_product--V01:hover .list-product-btn.center li {
transform: translateY(0px);
}
.card_product--V01.type-space-30 {
gap: 30px;
}
.card_product--V01.type-space-35 {
gap: 35px;
}
.card_product--V01.type-space-35 .card_product-wrapper {
aspect-ratio: 0.8150684932;
}
}
@media (max-width: 767px) {
.card_product--V01 .tooltip {
display: none;
}
.card_product--V01:not(.file-delete) .list-product-btn:not(.center) {
top: 10px;
transform: unset;
}
.card_product--V01:not(.style_2) .list-product-btn .wishlist,
.card_product--V01:not(.style_2) .list-product-btn .compare {
display: none;
}
}
@media (max-width: 575px) {
.card_product--V01 {
gap: 15px;
}
.card_product--V01 .name-product {
font-size: 16px;
line-height: 24px;
}
.card_product--V01 .price-wrap .price-new {
font-size: 14px;
line-height: 22px;
}
.card_product--V01 .price-wrap .price-old {
font-size: 12px;
line-height: 18px;
}
}
.badge-box {
display: flex;
gap: 10px;
position: absolute;
top: 10px;
left: 10px;
z-index: 21;
}
@media (max-width: 767px) {
.badge-box {
gap: 6px;
}
}
@media (max-width: 575px) {
.badge-box {
flex-wrap: wrap;
}
}
.badge-box > * {
display: block;
padding: 4px 12px;
font-size: 14px;
line-height: 20px;
letter-spacing: 0px;
color: var(--white);
}
@media (max-width: 1199px) {
.badge-box > * {
font-size: 12px;
padding: 4px 10px;
}
}
@media (max-width: 575px) {
.badge-box > * {
padding: 2px 8px;
}
}
.badge-box .new {
background-color: #9D5100;
}
.badge-box .sale {
background-color: #9F834F;
}
.price-wrap {
display: inline-flex;
align-items: center;
flex-wrap: wrap;
gap: 0px 10px;
}
.price-wrap .price-old {
color: var(--main-7);
display: inline;
position: relative;
}
.price-wrap .price-old::after {
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
right: 0;
width: 100%;
height: 1px;
background-color: var(--main-7);
}
.price-wrap .badges-on-sale {
font-weight: 500;
font-size: 14px;
line-height: 20px;
display: flex;
align-items: center;
gap: 6px;
padding: 3px 7px;
border-radius: 4px;
background-color: var(--bg-17);
color: var(--white);
}
.price-wrap.style-white {
color: var(--white);
}
.price-wrap.style-white .price-old {
color: rgba(255, 255, 255, 0.6);
}
.price-wrap.style-white .price-old::after {
background-color: rgba(255, 255, 255, 0.6);
}
.rate-wrap {
display: inline-flex;
gap: 5px;
}
.rate-wrap li {
display: flex;
}
.rate-wrap i {
font-size: 15px;
}
.icon_play {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 50px;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
background-color: var(--white);
color: var(--black);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.icon_play i {
transform: translateX(1px);
}
.icon_play:hover {
background-color: var(--primary);
color: var(--white);
}
@media (min-width: 1200px) {
.icon_play {
width: 62px;
height: 62px;
}
}
.card_product--V02 {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: 20px;
}
.card_product--V02 .card_product-wrapper {
position: relative;
}
.card_product--V02 .content {
display: flex;
align-items: center;
flex-direction: column;
gap: 10px;
}
.card_product--V02 .tf-btn {
width: 100%;
}
.card_product--V02 .rate-wrap {
padding: 5px 0px;
}
.card_product--V03 {
position: relative;
}
.card_product--V03 .card_product-info {
position: absolute;
left: 10px;
right: 10px;
bottom: 15px;
display: flex;
align-items: center;
gap: 10px;
justify-content: space-between;
}
@media (max-width: 767px) {
.card_product--V03 .card_product-info {
left: 20px;
right: 20px;
}
}
.card_product--V03 .info-product {
display: grid;
gap: 10px;
}
.card_product--V03 .img-prd {
width: 100%;
max-width: 80px;
height: 80px;
display: flex;
overflow: hidden;
}
.card_product--V03 .img-prd img {
aspect-ratio: unset;
width: 100%;
object-fit: cover;
object-position: center;
}
@media (min-width: 1200px) {
.card_product--V03 .img-prd {
max-width: 105px;
height: 113px;
display: inline;
}
}
.card_product--V03.style_2 .card_product-info {
padding: 15px;
background-color: var(--white);
}
.card_product--V03.style_2 .info-product {
gap: 8px;
}
.card_product--V03.style_2 .infor {
display: flex;
gap: 10px;
align-items: center;
}
@media (min-width: 992px) {
.card_product--V03 .card_product-info {
gap: 25px;
}
.card_product--V03.style-2 .infor {
gap: 20px;
}
}
@media (min-width: 1200px) {
.card_product--V03.style_2 .card_product-info {
padding: 20px;
bottom: 32px;
left: 32px;
right: 32px;
}
.card_product--V03.style_2 .infor {
gap: 35px;
}
.card_product--V03 .card_product-info {
left: 24px;
right: 24px;
bottom: 24px;
}
}
.text-hurry-up {
padding-left: 14px;
position: relative;
display: block;
}
.text-hurry-up::after {
position: absolute;
content: "";
width: 5px;
height: 5px;
left: 0;
top: 50%;
transform: translateY(-50%);
background-color: #FF6D6D;
animation: tf-ani-flash 2s infinite;
}
.text-hurry-up .number-left {
color: var(--secondary-3);
}
.text-hurry-up.type-dot-2::after {
background-color: #FF6D6D;
}
.box_collection--V01 {
display: flex;
flex-direction: column;
gap: 20px;
}
.box_collection--V01 .name {
display: inline-flex;
align-items: start;
gap: 5px;
}
.box_collection--V01.style_2 {
align-items: center;
}
.box_collection--V01.style_2 .image {
border-radius: 50%;
}
.box_collection--V01.style_3 {
align-items: center;
}
.box_collection--V01.style_3 .image {
border-radius: 50%;
}
@media (min-width: 1200px) {
.box_collection--V01.style_3 {
gap: 32px;
}
}
.box_collection--V02 {
display: flex;
align-items: center;
gap: 15px;
}
.box_collection--V02 .image {
width: 150px;
border-radius: 70px;
overflow: hidden;
}
.box_collection--V02 .image img {
aspect-ratio: 2.3265306122;
width: 100%;
object-fit: cover;
}
.box_collection--V02 .name-cls {
font-size: clamp(20px, 3vw, 48px);
line-height: clamp(30px, 3.5vw, 60px);
}
@media (min-width: 1200px) {
.box_collection--V02 {
gap: 22px;
}
.box_collection--V02 .image {
width: 228px;
}
}
.tf-product-info-wrap {
position: relative;
}
@media (min-width: 1440px) {
.tf-product-info-wrap {
max-width: 678px;
width: 100%;
margin-left: auto;
}
}
@media (max-width: 767px) {
.tf-product-info-wrap {
margin-top: 40px;
}
}
.flat-wrap-media-product {
position: relative;
}
.flat-wrap-media-product .tf-product-media-main .swiper-slide {
height: auto;
}
.flat-wrap-media-product .tf-product-media-main .item {
height: 100%;
display: flex;
overflow: hidden;
aspect-ratio: 1.2546374368;
}
.flat-wrap-media-product .tf-product-media-main .item img {
width: 100%;
height: 100%;
object-fit: cover;
}
.flat-wrap-media-product .tf-product-media-main .slide-3d,
.flat-wrap-media-product .tf-product-media-main .slide-video {
height: auto;
}
.tf-product-media-thumbs {
width: 100%;
flex-shrink: 0;
}
.tf-product-media-thumbs .swiper-slide .item {
position: relative;
aspect-ratio: 1;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-product-media-thumbs .swiper-slide .item img {
width: 100%;
height: 100%;
object-fit: cover;
}
.tf-product-media-thumbs .swiper-slide .item::after {
position: absolute;
content: "";
top: 0;
right: 0;
left: 0;
bottom: 0;
border: 1px solid transparent;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-product-media-thumbs .swiper-slide:not(.swiper-slide-thumb-active) .item {
opacity: 0.6;
}
.tf-product-media-thumbs .swiper-slide.swiper-slide-thumb-active .item::after {
border-color: rgba(0, 0, 0, 0.4);
}
.thumbs-slider {
display: flex;
flex-direction: column;
gap: 15px;
}
@media (min-width: 1200px) {
.thumbs-slider.thumbs-right {
flex-direction: row;
}
.thumbs-slider.thumbs-right .flat-wrap-media-product {
width: calc(67.36% - 15px);
}
.thumbs-slider.thumbs-right .flat-wrap-media-product .tf-product-media-main {
height: 100%;
}
.thumbs-slider.thumbs-right .flat-wrap-media-product .tf-product-media-main .item {
aspect-ratio: unset;
display: flex;
width: 100%;
height: 100%;
max-height: 744px;
}
.thumbs-slider.thumbs-right .flat-wrap-media-product .tf-product-media-main .item img {
aspect-ratio: unset;
}
.thumbs-slider.thumbs-right .tf-product-media-thumbs {
max-width: 238px;
max-height: 744px;
width: 32.64%;
}
.thumbs-slider.thumbs-right .tf-product-media-thumbs .item {
width: 100%;
height: 100%;
}
}
.tf-product-info-list {
margin-bottom: 60px;
}
.tf-product-info-list .tf-product-info-heading {
display: grid;
gap: 20px;
margin-bottom: 30px;
}
@media (min-width: 768px) {
.tf-product-info-list .tf-product-info-heading {
gap: 24px;
margin-bottom: 37px;
}
}
.tf-product-info-list .product-info-progress-sale {
display: grid;
gap: 10px;
}
.tf-product-total-quantity {
margin-bottom: 32px;
}
.tf-product-total-quantity .group-btn {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 15px;
}
.tf-product-total-quantity .group-btn > a {
flex-grow: 1;
}
.tf-product-total-quantity .group-btn-action {
display: flex;
gap: 10px;
}
.progress-cart {
width: 100%;
background-color: var(--bg-15);
height: 3px;
position: relative;
}
.progress-cart .value {
position: relative;
height: 100%;
background-color: var(--green);
transition: width 2s ease;
}
.tf-product-info-variant {
margin-bottom: 30px;
}
.tf-product-info-variant > * {
display: flex;
align-items: center;
justify-content: space-between;
padding: 10px 0px;
min-height: 70px;
border-bottom: 1px solid var(--line);
}
.tf-product-info-variant > *:first-child {
border-top: 1px solid var(--line);
}
@media (max-width: 575px) {
.tf-product-info-variant > * {
min-height: 60px;
}
}
@media (min-width: 768px) {
.tf-product-info-variant {
margin-bottom: 40px;
}
}
.variant-picker-item .variant-picker-values {
display: flex;
align-items: center;
gap: 10px;
}
.variant-picker-item.variant-size .variant-picker-values {
flex-direction: column;
gap: 6px;
align-items: end;
}
.variant-picker-item.variant-size .btn-group {
display: flex;
align-items: center;
gap: 10px;
}
.variant-picker-item .variant-picker-label-value {
text-transform: capitalize;
font-weight: 500;
}
.variant-picker-item .color-btn {
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
position: relative;
border: 1px solid transparent;
border-radius: 50%;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
cursor: pointer;
}
.variant-picker-item .color-btn .check-color {
border-radius: 50%;
width: 32px;
height: 32px;
overflow: hidden;
border: 1px solid var(--line);
}
.variant-picker-item .color-btn.active {
border-color: var(--black);
}
.variant-picker-item .size-btn {
display: flex;
align-items: center;
justify-content: center;
font-size: 18px;
line-height: 28px;
color: var(--black);
background-color: var(--white);
width: 48px;
height: 48px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
cursor: pointer;
}
.variant-picker-item .size-btn.active {
background-color: var(--black);
color: var(--white);
}
@media (max-width: 767px) {
.variant-picker-item .size-btn {
width: 40px;
height: 40px;
font-size: 16px;
line-height: 24px;
}
}
.wg-quantity {
display: flex;
justify-content: space-between;
align-items: center;
background-color: var(--line-3);
overflow: hidden;
padding: 10px;
}
.wg-quantity .quantity-product {
padding: 0;
background-color: transparent;
border: 0;
width: 50px;
text-align: center;
font-weight: 400;
font-size: 18px;
line-height: 28px;
color: var(--black);
pointer-events: none;
}
.wg-quantity .btn-quantity {
padding: 0;
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
cursor: pointer;
background-color: transparent;
border: 1px solid transparent;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.wg-quantity .btn-quantity:hover {
color: var(--primary);
}
.wg-quantity.style-2 {
padding: 0;
background-color: unset;
gap: 8px;
justify-content: unset;
}
.wg-quantity.style-2 .quantity-product {
width: 20px;
}
.wg-quantity.style-2 .quantity-product {
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: -0.32px;
}
.wg-quantity.style-2 .btn-quantity {
font-size: 10px;
}
.tf-product-accordion {
margin-bottom: 48px;
}
.tf-product-fbt .title {
margin-bottom: 24px;
}
.tf-product-fbt .bundle-image {
max-width: 129px;
flex-shrink: 0;
}
.tf-product-fbt .bundle-image img {
aspect-ratio: 1;
width: 100%;
object-fit: cover;
}
@media (max-width: 575px) {
.tf-product-fbt .bundle-image {
max-width: 100px;
}
}
.tf-product-fbt .tf-product-form-bundle {
background-color: var(--bg-16);
padding: 20px 15px;
}
@media (min-width: 576px) {
.tf-product-fbt .tf-product-form-bundle {
padding: 30px;
}
}
@media (min-width: 1200px) {
.tf-product-fbt .tf-product-form-bundle {
padding: 64px;
}
}
.tf-product-fbt .tf-bundle-products {
margin-bottom: 40px;
}
.tf-product-fbt .tf-bundle-product-item {
display: flex;
align-items: center;
gap: 20px;
}
.tf-product-fbt .tf-bundle-product-item:not(:last-child) {
margin-bottom: 25px;
}
.tf-product-fbt .tf-bundle-product-item .bundle-info {
display: grid;
gap: 10px;
}
.tf-product-fbt .tf-bundle-product-item .bundle-info .name {
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
display: -webkit-box;
overflow: hidden;
}
@media (max-width: 575px) {
.tf-product-fbt .tf-bundle-product-item {
gap: 10px;
}
}
.flat-single-grid {
display: grid;
gap: 10px;
}
.flat-single-grid .item img {
width: 100%;
object-fit: cover;
aspect-ratio: 1;
}
.tf-main-product-2 .tf-product-info-list {
margin-bottom: 48px;
}
.tf-main-product-2 .breadcrumbs {
margin-bottom: 20px;
}
.tf-main-product-2 .product-infor-sub {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0px 25px;
}
.tf-main-product-2 .text-sub {
display: flex;
align-items: center;
gap: 5px 10px;
flex-wrap: wrap;
}
.tf-main-product-2 .product-info-progress-sale {
margin-bottom: 48px;
}
.tf-main-product-2 .tf-product-info-wrap {
margin-top: 40px;
width: 100%;
}
@media (min-width: 992px) {
.tf-main-product-2 .tf-product-info-wrap {
max-width: 540px;
}
}
@media (min-width: 1921px) {
.tf-main-product-2 .tf-product-info-wrap {
max-width: 100%;
}
}
@media (min-width: 1200px) {
.tf-main-product-2 {
gap: 44px;
}
}
.tf-product-more-infor {
display: grid;
gap: 32px;
}
.tf-product-more-infor > .br-line {
background-color: var(--line);
}
@media (min-width: 1200px) {
.tf-product-more-infor .tf-product-share {
margin-bottom: 8px;
}
}
.tf-product-pickup-store .store-pickup-item {
display: flex;
gap: 10px;
}
.tf-product-pickup-store .store-pickup-item .store-info {
display: flex;
flex-direction: column;
align-items: start;
}
.tf-product-pickup-store .store-pickup-item .dot {
position: relative;
top: 13px;
display: block;
width: 4px;
height: 4px;
background-color: #24BD1E;
animation: tf-ani-flash 2s infinite;
}
.tf-product-pickup-store .store-pickup-item .address-avaiable {
margin-bottom: 4px;
}
.tf-product-pickup-store .store-pickup-item .address-ready {
margin-bottom: 10px;
}
.tf-product-info-extra-link {
display: flex;
align-items: center;
gap: 10px 20px;
flex-wrap: wrap;
}
.tf-product-info-extra-link .product-extra-icon {
display: flex;
align-items: center;
gap: 6px;
}
@media (min-width: 1200px) {
.tf-product-info-extra-link {
gap: 32px;
}
}
.tf-product-info-delivery {
display: grid;
gap: 10px;
}
.tf-product-info-delivery li {
display: flex;
gap: 15px;
align-items: center;
}
.tf-product-info-delivery .icon {
font-size: 24px;
color: var(--primary);
}
@media (min-width: 992px) {
.tf-product-info-delivery {
gap: 20px;
}
}
.card_product_row--V01 {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
background-color: var(--bg-16);
padding: 15px;
}
.card_product_row--V01 .product-info {
display: grid;
gap: 10px;
}
.card_product_row--V01 .card_product-wrapper {
display: flex;
align-items: center;
gap: 10px;
}
.card_product_row--V01 .card_product-wrapper .product-img {
max-width: 129px;
width: 100%;
}
.card_product_row--V01 .card_product-wrapper .product-img img {
width: 100%;
aspect-ratio: 1;
object-fit: cover;
}
@media (min-width: 1200px) {
.card_product_row--V01 {
gap: 16px;
}
.card_product_row--V01 .card_product-wrapper {
gap: 20px;
}
}
@media (min-width: 768px) {
.card_product_row--V01 {
padding: 24px;
}
}
.tf-product-piw .title {
margin-bottom: 24px;
}
.tf-product-payment-method {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 10px 20px;
}
.tf-product-payment-method .text-guarantee {
display: flex;
align-items: center;
gap: 5px 10px;
}
.tf-product-payment-method .text-guarantee .icon {
font-size: 24px;
color: var(--primary);
}
.tf-main-product-grid {
display: flex;
gap: 30px;
}
@media (min-width: 1600px) {
.tf-main-product-grid {
gap: 48px;
}
}
@media (max-width: 1199px) {
.tf-main-product-grid {
display: grid;
gap: 30px;
grid-template-columns: calc(50% - 15px) calc(50% - 15px);
grid-template-areas: "aa bb" "aa cc";
}
.tf-main-product-grid .main-grid-a,
.tf-main-product-grid .main-grid-b,
.tf-main-product-grid .main-grid-c {
width: auto;
}
}
@media (max-width: 767px) {
.tf-main-product-grid {
display: unset;
}
}
.main-grid-a {
grid-area: aa;
width: calc(37.5% - 22.5px);
}
@media (min-width: 1600px) {
.main-grid-a {
width: calc(37.5% - 36px);
}
}
.main-grid-b {
order: -1;
grid-area: bb;
}
.main-grid-c {
grid-area: cc;
}
.main-grid-b,
.main-grid-c {
width: calc(31.25% - 18.75px);
}
@media (min-width: 1600px) {
.main-grid-b,
.main-grid-c {
width: calc(31.25% - 30px);
}
}
.tf-main-product-grid {
margin-bottom: 0;
}
.tf-main-product-grid .breadcrumbs {
padding-top: 40px;
}
.tf-main-product-grid .main-product-info {
padding-top: 20px;
}
.tf-main-product-grid .product-info-progress-sale {
margin-bottom: 32px;
}
.tf-main-product-grid .tf-product-info-delivery {
margin-bottom: 40px;
}
.tf-main-product-grid .tf-product-total-quantity,
.tf-main-product-grid .tf-product-payment-method {
margin-bottom: 24px;
}
@media (min-width: 768px) {
.tf-main-product-grid .breadcrumbs {
padding-top: 20px;
}
.tf-main-product-grid .main-product-info {
padding-top: 40px;
}
.tf-main-product-grid .tf-product-media-main .item {
aspect-ratio: 0.69527897;
}
}
@media (min-width: 1200px) {
.tf-main-product-grid .main-product-info {
padding-top: 63px;
}
}
@media (min-width: 1440px) {
.tf-main-product-grid .tf-product-info-heading,
.tf-main-product-grid .tf-product-accordion {
margin-bottom: 73px;
}
.tf-main-product-grid .tf-product-info-delivery {
margin-bottom: 83px;
}
}
.tf-product-mini-view {
display: flex;
gap: 10px;
}
.tf-product-mini-view .prd-name {
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
display: -webkit-box;
overflow: hidden;
}
.tf-product-mini-view .prd-image {
max-width: 107px;
width: 100%;
}
.tf-product-mini-view .prd-image img {
aspect-ratio: 1;
width: 100%;
object-fit: cover;
}
.tf-product-mini-view .prd-content {
display: flex;
flex-direction: column;
}
.tf-product-mini-view .prd-content .price-wrap {
flex-direction: row-reverse;
justify-content: left;
}
.tf-product-mini-view .prd-content .price-wrap del {
font-size: 14px;
line-height: 20px;
letter-spacing: 0px;
color: var(--main-7);
}
.tf-product-mini-view .prd-content .price-wrap ins {
text-decoration: unset;
}
@media (min-width: 576px) {
.tf-product-mini-view {
gap: 15px;
}
.tf-product-mini-view .prd-content {
gap: 8px;
}
}
.product-unavailable .tf-product-share,
.product-unavailable .tf-product-info-heading {
margin-bottom: 32px;
}
@media (max-width: 991px) {
.product-unavailable .group-btn {
flex-wrap: wrap;
}
.product-unavailable .group-btn-action,
.product-unavailable .btn-add-wishlist {
width: 100%;
}
}
.tf-product-notify {
padding: 30px 15px;
border: 1px solid var(--black);
display: grid;
gap: 24px;
}
.tf-product-notify .title {
font-weight: normal;
text-transform: uppercase;
}
@media (min-width: 1200px) {
.tf-product-notify {
padding: 30px;
}
}
@media (min-width: 1440px) {
.tf-product-notify {
padding: 48px 46px;
}
}
.form-group-product .tf-product-total-quantity {
display: grid;
gap: 12px;
}
.form-group-product .table-group-product {
margin-bottom: 24px;
overflow: auto;
}
.form-group-product .item-product {
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
}
.form-group-product .item-product:not(:last-child) {
margin-bottom: 16px;
}
.form-group-product .item-product .img-product {
width: 83px;
height: 83px;
border-radius: 4px;
}
.form-group-product .item-product .item-product-name {
display: flex;
align-items: center;
gap: 16px;
max-width: 250px;
width: 100%;
flex-shrink: 0;
}
.form-group-product .item-product .item-product-content {
flex-grow: 1;
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
}
.form-group-product .item-product .item-product-price {
max-width: 150px;
width: 100%;
flex-shrink: 0;
}
.form-group-product .item-product .price-old {
text-decoration: line-through;
}
.form-group-product .item-product .note {
margin-top: 6px;
font-size: 12px;
line-height: 18px;
}
.form-group-product .item-product .available {
color: var(--primary);
}
.form-group-product .item-product .in-stock {
color: #34a853;
}
.form-group-product .item-product .tf-btn,
.form-group-product .item-product .wg-quantity {
flex-shrink: 0;
}
.form-group-product .item-product .item-product-action {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
}
.form-buyX-getY {
border-radius: 16px;
border: 1px solid #272727;
padding: 30px 20px;
}
.form-buyX-getY .title-buyX-getY {
text-align: center;
margin-bottom: 32px;
}
.form-buyX-getY .tf-btn {
width: 100%;
}
.form-buyX-getY .item-product {
text-align: center;
padding: 12px;
border: 1px solid var(--line);
border-radius: 10px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
position: relative;
}
.form-buyX-getY .item-product:hover {
box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.1019607843);
}
.form-buyX-getY .item-product img {
width: 100%;
height: 100%;
object-fit: cover;
}
.form-buyX-getY .item-product .img-product {
border-radius: 8px;
overflow: hidden;
}
.form-buyX-getY .item-product select {
padding-top: 7px;
padding-bottom: 7px;
font-size: 14px;
line-height: 20px;
color: rgba(102, 112, 133, 0.8);
border-radius: 6px;
}
.form-buyX-getY .item-product .info-product {
padding-top: 20px;
}
.form-buyX-getY .item-product .name-product {
margin-bottom: 10px;
display: block;
}
.form-buyX-getY .item-product .price-product {
display: inline-flex;
gap: 6px;
}
.form-buyX-getY .item-product .variant-product {
margin-top: 14px;
}
.form-buyX-getY .item-product .old-price {
text-decoration: line-through;
}
.form-buyX-getY .item-product .ribbon {
position: absolute;
top: -7px;
left: -7px;
background-color: #a78bfa;
color: var(--white);
padding: 5px;
padding-left: 14px;
padding-right: 28px;
text-transform: uppercase;
font-weight: 500;
clip-path: polygon(100% 0%, 86% 50%, 100% 100%, 0 100%, 0% 50%, 0 0);
z-index: 2;
}
.form-buyX-getY .item-product::before {
content: "";
position: absolute;
top: 26px;
left: -7px;
border-top: 7px solid #7154b4;
border-right: 7px solid transparent;
-webkit-transform: rotate(45deg);
transform: rotate(90deg);
}
.form-buyX-getY .group-item-product {
display: flex;
align-items: center;
justify-content: center;
gap: 6px;
margin-bottom: 32px;
}
.form-buyX-getY .group-item-product .arrow {
width: 52px;
height: 52px;
margin-left: -12px;
}
@media (min-width: 768px) and (max-width: 991px) {
.form-buyX-getY .group-item-product {
flex-direction: column;
align-items: unset;
}
.form-buyX-getY .group-item-product .arrow {
margin-top: -12px;
margin-left: auto;
margin-right: auto;
transform: rotate(90deg);
}
}
@media (min-width: 1200px) {
.form-buyX-getY {
padding: 36px 32px;
}
.form-buyX-getY .title-buyX-getY {
margin-bottom: 47px;
}
.form-buyX-getY .group-item-product {
margin-bottom: 55px;
}
}
@media (max-width: 575px) {
.form-buyX-getY .group-item-product {
flex-direction: column;
align-items: unset;
}
.form-buyX-getY .group-item-product .arrow {
margin-top: -12px;
margin-left: auto;
margin-right: auto;
transform: rotate(90deg);
}
}
.single-product #themesflat-content .content-area {
padding-left: 0;
padding-right: 0;
}
.tf-product-info-heading .tf-grouped-form.form-group-product {
overflow: hidden;
}
.tf-product-info-heading .breadcrumb-list.breadcrumb-trail.breadcrumbs {
margin-bottom: 0px;
}
.tf-product-info-heading .breadcrumbs .bread-wrap {
margin-bottom: 0px;
}
.single-product .woocommerce-notices-wrapper {
margin-bottom: 0;
}
.tf-sticky-btn-atc {
position: fixed;
width: 100%;
bottom: 0;
z-index: 999;
box-shadow: 4px -4px 5px rgba(0, 0, 0, 0.03);
background-color: var(--white);
transition: all 0.3s linear;
transform: translateY(100%);
}
.tf-sticky-btn-atc .tf-height-observer {
padding: 14px 0;
column-gap: 5px;
}
.tf-sticky-btn-atc .tf-sticky-atc-product {
flex: 1 0 0%;
gap: 15px;
}
.tf-sticky-btn-atc select {
padding: 9px 10px;
}
.tf-sticky-btn-atc .tf-sticky-atc-img {
width: 72px;
height: 72px;
flex-shrink: 0;
}
.tf-sticky-btn-atc .tf-sticky-atc-img img {
width: 100%;
height: 100%;
object-fit: cover;
}
.tf-sticky-btn-atc .tf-sticky-atc-variant-price {
min-width: 249px;
}
.tf-sticky-btn-atc .tf-sticky-atc-title {
font-size: 16px;
line-height: 19px;
}
.tf-sticky-btn-atc .tf-sticky-atc-btns,
.tf-sticky-btn-atc .tf-sticky-atc-infos form {
display: flex;
gap: 12px;
align-items: center;
}
.tf-sticky-btn-atc .tf-btn {
min-width: 190px;
}
.tf-sticky-btn-atc.show {
transform: translateY(0);
}
@media (max-width: 1199px) {
.tf-sticky-btn-atc {
bottom: 68px;
}
}
@media (max-width: 991px) {
.tf-sticky-btn-atc .s-shop-cart .checkout-sidebar {
margin-top: 50px;
}
}
@media (max-width: 767px) {
.tf-sticky-btn-atc .tf-sticky-atc-product {
display: none !important;
}
.tf-sticky-btn-atc .tf-sticky-atc-infos {
width: 100%;
}
.tf-sticky-btn-atc .tf-sticky-atc-infos form {
flex-direction: column;
}
.tf-sticky-btn-atc .wg-quantity {
padding: 9px 10px;
}
}
@media (max-width: 1199px) {
.vemus-product-grid-heading.vemus-product-heading-vertical {
writing-mode: unset !important;
}
}
@media (max-width: 767px) {
.wg-list-collection .cls-wrap {
padding-bottom: 30px;
}
.single_add_to_cart_button .dynamic-price {
display: none;
}
}   .article-blog {
display: flex;
flex-direction: column;
align-items: start;
gap: 15px;
}
.article-blog.style-row-2 .entry_image img {
height: 395px;
width: 100%;
}
.article-blog.style-row .entry_image {
width: 50%;
flex-shrink: 0;
}
@media (max-width: 575px) {
.article-blog.style-row .entry_image {
width: 100%;
}
}
.article-blog.style-row .entry-title {
font-size: 36px;
line-height: 1.2222222222em;
}
@media (max-width: 767px) {
.article-blog.style-row .entry-title {
font-size: 20px;
}
}
.article-blog.style-row .post-content {
-webkit-line-clamp: 3;
}
.article-blog .entry_image {
position: relative;
width: 100%;
}
.article-blog .entry_image .image {
display: flex;
}
.article-blog .entry_tag {
position: absolute;
display: flex;
flex-wrap: wrap;
z-index: 2;
left: 12px;
bottom: 12px;
gap: 6px;
}
.article-blog .name-tag {
display: flex;
padding: 6px 10px;
background-color: var(--white);
}
.article-blog .blog-content {
display: flex;
flex-direction: column;
align-items: start;
gap: 15px;
}
.article-blog .box-title {
display: grid;
gap: 10px;
}
.article-blog .meta-list {
display: flex;
align-items: center;
gap: 10px 20px;
flex-wrap: wrap;
}
.article-blog .meta-list .br-line {
width: 1px;
height: 16px;
background-color: var(--line);
}
.article-blog .meta-list .entry_author {
display: flex;
align-items: center;
gap: 10px;
}
.article-blog .meta-list .avt {
width: 39px;
height: 38px;
border-radius: 50%;
overflow: hidden;
}
.article-blog .meta-list .avt img {
object-fit: cover;
}
.article-blog.style-row {
padding-bottom: 32px;
margin-bottom: 16px;
border-bottom: 1px solid var(--line);
}
.article-blog.style-2 .entry_tag {
bottom: unset;
top: 16px;
left: 16px;
}
.article-blog.style-2 .image {
aspect-ratio: 1.2493573265;
}
.article-blog.style-2 .meta-list {
gap: 10px;
}
.article-blog.style-2 .meta-list > .icon {
font-size: 6px;
color: var(--main-4);
}
.article-blog.style-2 .box-title {
gap: 12px;
}
@media (min-width: 768px) {
.article-blog {
gap: 24px;
}
.article-blog .blog-content {
gap: 11px;
}
.article-blog.style-2 .blog-content {
gap: 20px;
}
}
@media (min-width: 576px) {
.article-blog.style-row {
flex-direction: row;
align-items: center;
padding-bottom: 32px;
margin-bottom: 16px;
border-bottom: 1px solid var(--line);
}
.article-blog.style-row .meta-list {
margin-bottom: 14px;
}
.article-blog.style-row .entry_image {
height: 100%;
max-width: 759px;
}
.article-blog.style-row .entry_image .image {
width: 100%;
height: 100%;
aspect-ratio: 759/395;
}
}
@media (max-width: 991px) {
.article-blog .meta-list {
gap: 10px;
}
}
@media (max-width: 575px) {
.article-blog .entry_image img {
aspect-ratio: 972/790;
}
}
.wg-pagination {
display: flex;
align-items: center;
justify-content: center;
gap: 32px;
margin-top: 10px;
}
.wg-pagination .pagition-list {
display: flex;
gap: 10px;
}
.wg-pagination .pagination-item {
color: var(--main-4);
position: relative;
}
.wg-pagination .pagination-item.active {
color: var(--main);
}
.wg-pagination .pagination-item::after {
content: "";
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: calc(100% + 10px);
height: 100%;
}
.s-blog-detail .blog-single {
width: 100%;
}
.blog-sidebar .sidebar-item {
display: grid;
gap: 24px;
}
.blog-sidebar .sidebar-item:not(:last-child) {
margin-bottom: 32px;
padding-bottom: 31px;
border-bottom: 1px solid var(--line);
}
.blog-sidebar .sb-category {
display: grid;
gap: 5px;
}
.blog-sidebar .sb-tag {
display: flex;
gap: 10px;
flex-wrap: wrap;
}
.blog-sidebar .sb-recent {
display: grid;
gap: 24px;
}
.blog-sidebar .sb-author {
display: flex;
flex-direction: column;
align-items: center;
gap: 40px;
padding: 36px;
background-color: var(--bg-11);
}
.blog-sidebar .sb-author .entry_author {
display: grid;
gap: 22px;
}
.blog-sidebar .sb-author .name {
margin-bottom: 4px;
}
.blog-sidebar .sb-author .avatar {
max-width: 200px;
border-radius: 50%;
overflow: hidden;
}
.blog-sidebar .sb-author .avatar img {
object-fit: cover;
}
@media (min-width: 992px) {
.blog-sidebar {
max-width: 366px;
margin-left: auto;
width: 100%;
}
}
.wg-recent {
display: flex;
gap: 20px;
align-items: start;
}
.wg-recent .image {
display: flex;
max-width: 98px;
width: 100%;
height: 98px;
}
.wg-recent .image img {
object-fit: cover;
}
.wg-recent .content {
display: grid;
gap: 10px;
}
.wg-recent .entry_meta {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0px 4px;
}
@media (max-width: 767px) {
.wg-recent {
gap: 16px;
}
}
.btn-sidebar-mb {
position: fixed;
top: 30%;
left: 0;
z-index: 150;
}
.btn-sidebar-mb button {
width: 40px;
height: 40px;
border: 1px solid var(--black);
background-color: var(--black);
color: var(--white);
display: flex;
justify-content: center;
align-items: center;
}
.btn-sidebar-mb button i {
font-size: 20px;
}
.btn-sidebar-mb button:hover {
background-color: var(--white);
color: var(--black);
}
.btn-sidebar-mb.right {
left: unset;
right: 0;
transform: rotate(180deg);
}
.themesflat-button.themesflat-archive:hover,
.remove.tf-btn-line:hover {
color: var(--primary);
}
.wg-pagination .next.page-numbers:hover::after, .wg-pagination .prev.page-numbers:hover::after {
background-color: var(--primary);
}
.s-blog-detail {
display: flex;
gap: 30px;
}
.s-blog-detail .entry_image img {
max-height: 395px;
object-fit: cover;
width: 100%;
}
.s-blog-detail .single-wrap {
display: grid;
gap: 30px;
margin-bottom: 64px;
}
.s-blog-detail .main-post p {
color: var(--main-4);
font-weight: 400;
font-size: 16px;
line-height: 24px;
margin-bottom: 1.875em;
}
.s-blog-detail .entry_meta {
display: flex;
align-items: center;
gap: 10px 15px;
flex-wrap: wrap;
}
.s-blog-detail .entry_meta li {
display: flex;
align-items: center;
gap: 10px;
}
.s-blog-detail .entry_meta .icon {
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
border-radius: 50%;
background-color: var(--primary);
color: var(--white);
flex-shrink: 0;
}
.s-blog-detail .entry_meta .icon i {
font-size: 12px;
}
.s-blog-detail .box-title {
display: grid;
gap: 30px;
}
.s-blog-detail .box-text {
display: grid;
gap: 24px;
}
.s-blog-detail .box-text .box-btn {
display: grid;
gap: 16px;
}
.s-blog-detail .list-info {
display: grid;
gap: 15px;
}
.s-blog-detail .list-info li {
position: relative;
padding-left: 25px;
}
.s-blog-detail .list-info li::after {
content: "";
position: absolute;
width: 2px;
height: 2px;
top: 50%;
transform: translateY(-50%);
left: 12px;
background-color: var(--main);
}
.s-blog-detail .entry_tag {
display: flex;
gap: 6px;
}
.s-blog-detail .entry_tag a {
display: flex;
padding: 6px 20px;
background-color: var(--main);
color: var(--white);
}
.s-blog-detail .entry_tag a:hover {
background-color: var(--primary);
}
.s-blog-detail .entry_social {
display: flex;
align-items: center;
gap: 20px;
}
.s-blog-detail .tf-social-icon {
gap: 6px;
}
.s-blog-detail .entry_image {
gap: 20px;
}
.s-blog-detail .entry_media {
margin-bottom: 32px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
flex-wrap: wrap;
}
.s-blog-detail .post-navigator {
margin-top: 32px;
}
.s-blog-detail .related-post {
padding: 15px 0px;
border-top: 1px solid var(--line);
border-bottom: 1px solid var(--line);
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 5px;
}
.s-blog-detail .related-post a {
letter-spacing: 0;
display: flex;
align-items: center;
gap: 5px;
}
.s-blog-detail .related-post a .icon {
font-size: 30px;
}
@media (min-width: 768px) {
.s-blog-detail .related-post {
padding: 31px 0px;
}
.s-blog-detail .related-post a {
gap: 20px;
}
.s-blog-detail .related-post a .icon {
font-size: 48px;
}
.s-blog-detail .related-post a p {
font-size: 18px;
line-height: 28px;
}
}
@media (min-width: 1200px) {
.s-blog-detail .box-title {
gap: 40px;
}
.s-blog-detail .entry_meta .icon {
width: 38px;
height: 38px;
}
.s-blog-detail .entry_meta .icon i {
font-size: 16px;
}
}
@media (min-width: 1440px) {
.s-blog-detail {
gap: 64px;
}
}
.blog-post .block-quote,
.blog-post .wp-block-quote {
position: relative;
display: flex;
flex-wrap: wrap;
gap: 15px 30px;
background-color: var(--bg-9);
padding: 30px;
border: none;
}
.blog-post .block-quote i,
.blog-post .wp-block-quote i {
font-size: 64px;
color: var(--bg-10);
}
.blog-post .block-quote::after,
.blog-post .wp-block-quote::after {
content: "\e913";
font-family: "vemus";
font-size: 64px;
color: var(--bg-10);
position: absolute;
top: 70px;
left: 5.5%;
}
.blog-post .block-quote p,
.blog-post .wp-block-quote p {
font-weight: 400;
font-size: 24px;
line-height: 32px;
}
.blog-post .block-quote .quote,
.blog-post .wp-block-quote .quote {
display: grid;
gap: 24px;
max-width: 692px;
width: 100%;
}
.blog-post .block-quote .quote .br-line,
.blog-post .wp-block-quote .quote .br-line {
background-color: var(--line-7);
}
@media (min-width: 1200px) {
.blog-post .block-quote,
.blog-post .wp-block-quote {
gap: 74px;
padding: 54px 61px;
padding-left: 198px;
}
}
@media (min-width: 1440px) {
.blog-grid-layout {
gap: 94px 30px;
}
}
.sidebar-content-wrap .widget-title {
margin-bottom: 21px;
}
.sidebar-content-wrap .widget {
border-bottom: 1px solid rgba(17, 17, 17, 0.1490196078);
padding-bottom: 28px;
margin-bottom: 33px;
}
.sidebar-content-wrap .widget:last-child {
padding-bottom: 0;
border: none;
margin-bottom: 0;
}
.sidebar-content-wrap .wp-block-categories a {
color: var(--main-4);
}
.sidebar-content-wrap .wp-block-categories a:hover {
color: var(--primary);
}
.no-reverse,
.blog #themesflat-content .container .row {
flex-direction: unset !important;
}
.sidebar-mobile-append.blog-sidebar .wp-block-categories-list {
margin-top: 0 !important;
}
.sidebar-mobile-append.blog-sidebar .widget-title {
margin-bottom: 20px;
}
.sidebar-mobile-append.blog-sidebar .recent-news::after {
display: none;
}
.wg-pagination .wg-pagination {
margin-top: 0 !important;
}   .box_testimonial--V01 {
display: flex;
background-color: var(--white);
align-items: center;
}
.box_testimonial--V01 .tf-btn-line::before {
display: none;
}
.box_testimonial--V01 .tf-btn-line::after {
right: unset;
width: 0%;
background: var(--primary);
}
.box_testimonial--V01 .tf-btn-line:hover::after {
width: 100%;
}
.box_testimonial--V01 .box_testimonial-image {
height: 100%;
max-width: 281px;
width: 100%;
}
.box_testimonial--V01 .box_testimonial-image img {
width: 100%;
height: 100%;
object-fit: cover;
}
.box_testimonial--V01 .box_testimonial-content {
padding: 20px 15px 20px;
display: flex;
flex-direction: column;
gap: 20px;
}
.box_testimonial--V01 .title {
font-weight: normal;
}
.box_testimonial--V01 .text {
color: var(--main-4);
}
.box_testimonial--V01 .br-line {
width: 100%;
height: 1px;
background-color: var(--line);
}
.box_testimonial--V01 .author-avatar {
max-width: 48px;
border-radius: 50%;
overflow: hidden;
}
.box_testimonial--V01 .rate-wrap i {
color: #C8C8C8;
}
.box_testimonial--V01 .tes-bottom {
display: flex;
align-items: center;
gap: 10px;
}
.box_testimonial--V01 .author-info {
display: grid;
gap: 6px;
}
.box_testimonial--V01 .wrap-name {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 10px;
}
.box_testimonial--V01 .wrap-name .verify {
display: flex;
align-items: center;
gap: 4px;
color: #48B02C;
}
.box_testimonial--V01 .wrap-item {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0px 6px;
}
@media (min-width: 992px) {
.box_testimonial--V01 .box_testimonial-content {
padding: 48px 32px 29px;
gap: 23px;
}
.box_testimonial--V01 .box_testimonial-content .title {
margin-top: -3px;
}
.box_testimonial--V01 .tf-btn-line {
line-height: 20px;
}
.box_testimonial--V01 .wrap-name {
gap: 20px;
}
}
@media (max-width: 575px) {
.box_testimonial--V01 {
flex-direction: column;
}
.box_testimonial--V01 .box_testimonial-image {
max-width: 100%;
height: 273px;
}
}
.box_testimonial--V02 {
display: flex;
flex-direction: column;
background-color: var(--white);
}
.box_testimonial--V02 .box_testimonial-content {
display: grid;
gap: 24px;
padding: 20px 15px;
border-bottom: 1px solid var(--line);
}
.box_testimonial--V02 .tes-head,
.box_testimonial--V02 .tes-text {
display: grid;
gap: 16px;
}
.box_testimonial--V02 .rate-wrap i {
color: #C8C8C8;
}
.box_testimonial--V02 .text {
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
display: -webkit-box;
overflow: hidden;
color: var(--main-4);
}
.box_testimonial--V02 .author-info {
display: flex;
align-items: center;
justify-content: space-between;
}
.box_testimonial--V02 .author-info .name {
font-weight: 500;
}
.box_testimonial--V02 .author-info .verify {
display: flex;
align-items: center;
gap: 8px;
font-weight: 400;
font-size: 14px;
line-height: 30px;
color: #48B02C;
}
.box_testimonial--V02 .box_testimonial-item {
padding: 20px 15px;
display: flex;
gap: 12px;
align-items: center;
}
.box_testimonial--V02 .box_testimonial-item .image-item {
max-width: 48px;
border-radius: 50%;
overflow: hidden;
}
.box_testimonial--V02 .box_testimonial-item .image-item img {
aspect-ratio: 1;
}
.box_testimonial--V02 .box_testimonial-item .info-item {
display: flex;
flex-direction: column;
gap: 4px;
}
@media (min-width: 1200px) {
.box_testimonial--V02 .box_testimonial-content {
padding: 32px 24px;
}
.box_testimonial--V02 .box_testimonial-item {
padding: 24px;
}
}
.box_testimonial--V03 {
display: flex;
flex-direction: column;
gap: 20px;
}
.box_testimonial--V03 .title {
font-family: "Playfair Display", serif;
color: var(--primary-2);
font-weight: normal;
}
.box_testimonial--V03 .text {
text-transform: uppercase;
color: var(--main-4);
font-weight: normal;
}
.box_testimonial--V03 .br-line {
background-color: var(--line-9);
}
.box_testimonial--V03 .tes-author {
display: flex;
align-items: center;
gap: 12px;
}
.box_testimonial--V03 .tes-author .avatar {
max-width: 42px;
width: 100%;
border-radius: 50%;
overflow: hidden;
}
@media (min-width: 1200px) {
.box_testimonial--V03 {
gap: 40px;
}
}
.box_testimonial--V04 .tes-text,
.box_testimonial--V04 .tes-top {
margin-bottom: 20px;
}
.box_testimonial--V04 .tes-top {
display: flex;
align-items: center;
justify-content: space-between;
}
.box_testimonial--V04 .icon {
font-size: 64px;
}
.box_testimonial--V04 .author-avt {
max-width: 42px;
width: 100%;
overflow: hidden;
border-radius: 50%;
letter-spacing: 0;
}
.box_testimonial--V04 .tes-author {
display: flex;
align-items: center;
gap: 10px;
}
@media (min-width: 1200px) {
.box_testimonial--V04 .tes-text,
.box_testimonial--V04 .tes-top {
margin-bottom: 32px;
}
}
.box_testimonial--V05 {
text-align: center;
}
.box_testimonial--V05 .icon {
display: block;
margin-bottom: 24px;
font-size: clamp(40px, 6vw, 64px);
color: var(--primary);
}
.box_testimonial--V05 .tes-title {
margin-bottom: 16px;
}
.box_testimonial--V05 .tes-text {
margin-bottom: 24px;
font-weight: normal;
}
.box_testimonial--V05 .tes-author {
font-weight: 500;
letter-spacing: 0;
}
@media (min-width: 1200px) {
.box_testimonial--V05 {
max-width: 717px;
margin: 0 auto;
}
}   .widget-accordion {
border-bottom: 1px solid var(--line);
}
.widget-accordion .accordion-title {
display: flex;
align-items: center;
gap: 30px;
padding: 32px 0px;
font-weight: 400;
font-size: clamp(20px, 3vw, 28px);
line-height: clamp(26px, 3.2vw, 32px);
text-transform: uppercase;
cursor: pointer;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
@media (max-width: 767px) {
.widget-accordion .accordion-title {
padding: 20px 0px;
}
}
.widget-accordion .accordion-title .icon {
font-size: clamp(16px, 3vw, 22px);
transition: transform 0.35s linear;
}
.widget-accordion .accordion-title:not(.collapsed) {
color: var(--primary);
}
.widget-accordion .accordion-title:not(.collapsed) .icon {
transform: rotate(-90deg);
}
.widget-accordion .accordion-body {
padding: 10px 0px 20px;
}
.widget-accordion:first-child {
border-top: 1px solid var(--line);
}
.widget-accordion.style-2 .accordion-title {
padding: 16px 0px;
justify-content: space-between;
font-size: 18px;
line-height: 28px;
cursor: pointer;
}
.widget-accordion.style-2 .accordion-title .icon {
font-size: 16px;
}
.widget-accordion.style-2:first-child {
border-top: unset;
}
.cls-accordion .accordion-body {
padding: 0;
display: flex;
justify-content: flex-end;
padding-bottom: 30px;
gap: 30px;
flex-wrap: wrap;
}
@media (min-width: 1200px) {
.cls-accordion .accordion-body {
gap: 97px;
}
}
.cls-accordion .accordion-title {
padding: 32px 0px 31px 0px;
}
.cls-accordion .accordion-title .icon {
font-size: 24px;
}
.cls-accordion .cls-info {
display: flex;
flex-direction: column;
justify-content: space-between;
gap: 15px;
}
.cls-accordion .count-item {
font-weight: normal;
}
@media (min-width: 768px) {
.cls-accordion .accordion-body {
flex-wrap: nowrap;
}
.cls-accordion .cls-info {
text-align: end;
}
.cls-accordion .image,
.cls-accordion .cls-info {
max-width: 441px;
width: 100%;
}
}
@media (min-width: 1200px) {
.cls-accordion .accordion-title {
position: relative;
z-index: 2;
flex: 1;
}
.cls-accordion .accordion-body {
padding-top: 32px;
}
.cls-accordion .widget-accordion {
display: flex;
align-items: start;
}
}
.widget-accordion-2 {
border-bottom: 1px solid var(--line);
}
.widget-accordion-2 .accordion-title {
display: flex;
align-items: center;
justify-content: space-between;
padding-top: 32px;
padding-bottom: 0;
margin-bottom: 24px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.widget-accordion-2 .accordion-title .icon::before {
transform: rotate(90deg);
}
.widget-accordion-2 .accordion-title .icon::after {
transform: rotate(180deg);
}
.widget-accordion-2 .accordion-title.collapsed {
margin-bottom: 0px;
padding-bottom: 32px;
}
.widget-accordion-2 .accordion-title.collapsed .icon::before {
transform: rotate(0deg);
}
.widget-accordion-2 .accordion-title.collapsed .icon::after {
transform: rotate(0deg);
}
@media (max-width: 991px) {
.widget-accordion-2 .accordion-title {
padding-top: 20px;
}
.widget-accordion-2 .accordion-title.collapsed {
padding-bottom: 20px;
}
}
.widget-accordion-2.style-2:first-child {
border-top: 1px solid var(--line);
}
.widget-accordion-2.style-2 .accordion-title {
padding-top: 20px;
letter-spacing: 0;
cursor: pointer;
}
.widget-accordion-2.style-2 .accordion-title.collapsed {
padding-bottom: 19px;
}
.widget-accordion-2.style-2 .accordion-body {
padding-bottom: 20px;
}
@media (max-width: 767px) {
.widget-accordion-2.style-2 .accordion-title {
padding-top: 15px;
margin-bottom: 15px;
}
.widget-accordion-2.style-2 .accordion-title.collapsed {
padding-bottom: 15px;
margin-bottom: 0;
}
.widget-accordion-2.style-2 .accordion-body {
padding-bottom: 15px;
}
}
.widget-accordion-2.style-3 .accordion-title {
text-transform: uppercase;
padding: 16px 0px;
justify-content: space-between;
font-size: 18px;
line-height: 28px;
margin-bottom: 8px;
}
.widget-accordion-2.style-3 .accordion-title .icon {
font-size: 16px;
}
.widget-accordion-2.style-3 .accordion-title.collapsed {
margin-bottom: 0px;
}
.widget-accordion-2.style-3 .accordion-body {
padding-top: 0;
padding-bottom: 16px;
}
.store-accordion .btn-get-dir {
margin-bottom: 31px;
}
.store-accordion .store-info-list {
margin-bottom: 21px;
}
.store-accordion .widget-accordion-2 {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.store-accordion .widget-accordion-2:hover {
border-color: var(--primary);
}
.store-accordion .widget-accordion-2:hover .accordion-title {
color: var(--primary);
}
.store-accordion .widget-accordion-2:hover .ic-accordion-custom::after, .store-accordion .widget-accordion-2:hover .ic-accordion-custom::before {
background-color: var(--primary);
}
@media (min-width: 1200px) {
.store-accordion {
padding-right: 24px;
}
}
.tab-img-store {
margin-bottom: 30px;
}
.store-info-list {
display: grid;
gap: 8px;
}
.store-info-list .caption {
font-weight: 500;
letter-spacing: 0;
}
.wd-product-descriptions .review-post-list {
margin-bottom: 22px;
padding-bottom: 22px;
border-bottom: 1px solid var(--line);
}
.wd-product-descriptions .accordion-title {
letter-spacing: 0;
}
.wd-product-descriptions .accordion-title .icon {
font-size: 24px;
}
@media (min-width: 1200px) {
.wd-product-descriptions {
display: flex;
justify-content: space-between;
align-items: start;
}
.wd-product-descriptions .accordion-title {
flex: 1;
}
.wd-product-descriptions > *:nth-child(2) {
flex: 3;
max-width: 680px;
width: 100%;
}
.wd-product-descriptions .accordion-body {
padding: 31px 0px;
margin-left: auto;
}
.wd-product-descriptions .widget-review {
max-width: 1127px;
}
}
.widget-review .accordion-body {
display: flex;
align-items: start;
gap: 30px;
}
.widget-review .title {
margin-bottom: 24px;
font-weight: 400;
text-transform: uppercase;
}
@media (min-width: 1200px) {
.widget-review .accordion-body {
gap: 60px;
}
}
@media (min-width: 1440px) {
.widget-review .accordion-body {
gap: 128px;
}
}
@media (max-width: 991px) {
.widget-review .accordion-body {
flex-direction: column;
}
}
.table-material tr {
background-color: transparent !important;
}
.table-material td {
border: 1px solid var(--line-8);
font-weight: normal;
padding: 10px 20px 9px;
}
.table-material td:first-child {
background-color: var(--bg-26);
border-top: 0;
border-left: 0;
}
@media (min-width: 1440px) {
.table-material {
table-layout: fixed;
}
}
.wd-rating-review {
width: 100%;
}
.wd-rating-review .rate-wrap i {
font-size: 14px;
}
.wd-rating-review .rate-head {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 24px;
}
.wd-rating-review .rating-progress {
margin-bottom: 25px;
}
@media (min-width: 992px) {
.wd-rating-review {
max-width: 319px;
}
}
@media (min-width: 1200px) {
.wd-rating-review {
padding-left: 30px;
}
.wd-rating-review .rating-progress {
margin-bottom: 40px;
}
}
.review-post-list .post-review-item:not(:last-child) {
margin-bottom: 24px;
}
.review-post-comment .sub-title {
margin-bottom: 24px;
color: var(--main-4);
font-weight: normal;
}
.review-post-comment .your-rate {
display: flex;
align-items: center;
gap: 20px;
margin-bottom: 24px;
}
.rating-progress {
display: grid;
gap: 6px;
}
.rating-progress li {
display: flex;
align-items: center;
gap: 10px;
}
.rating-progress .rate-number {
display: flex;
align-items: center;
gap: 5px;
}
.rating-progress .icon-star {
font-size: 14px;
}
.line-progress-rate {
flex: 1;
display: block;
height: 4px;
background-color: var(--line-8);
}
.line-progress-rate .progress-bar {
height: 4px;
background-color: var(--primary);
}
.post-review-item {
display: flex;
align-items: start;
gap: 15px;
}
.post-review-item .rv-image {
max-width: 48px;
width: 100%;
border-radius: 50%;
overflow: hidden;
}
.post-review-item .meta {
display: flex;
align-items: center;
gap: 10px;
}
.post-review-item .br-line {
height: 14px;
width: 1px;
background-color: var(--line-8);
}
.post-review-item .entry_name {
font-weight: normal;
}
.post-review-item .rv-content {
display: grid;
gap: 15px;
}
.post-review-item .rv-text {
font-weight: normal;
color: var(--main-4);
}
.handle-rating .star {
color: #D2D2D2;
cursor: pointer;
transition: color 0.2s;
}
.widget-material .accordion-body {
white-space: nowrap;
overflow: auto;
}   .tf-zoom-main {
position: sticky;
z-index: 50;
}
.tf-zoom-main .drift-zoom-pane {
top: 0;
left: 0;
height: 520px;
max-width: 520px;
width: 100%;
background: #fff;
-webkit-transform: translate3d(0, 0, 0);
box-shadow: 0 1px 5px rgba(127, 127, 127, 0.0196078431), 0 5px 18px rgba(127, 127, 127, 0.2);
z-index: 3;
}
.drift-bounding-box.drift-open {
background: rgba(255, 255, 255, 0.2509803922);
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.4) inset;
z-index: 5000;
}
.drift-zoom-pane {
z-index: 5000;
}
.section-image-zoom .other-image-zoom {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
@media (min-width: 1200px) {
.section-image-zoom.zoom-active .other-image-zoom {
opacity: 0.3;
}
}
.pswp__bg {
background: var(--white);
}
.pswp__icn {
fill: rgb(34, 34, 34);
color: var(--white);
}
.pswp__icn .pswp__icn-shadow {
stroke: var(--white);
stroke-width: 1px;
fill: none;
}
.pswp__counter {
color: #222;
text-shadow: 1px 1px 3px #ffffff;
}
.tf-model-viewer {
width: 100%;
height: 100%;
position: relative;
}
.tf-model-viewer model-viewer {
display: block;
position: relative;
z-index: 5;
width: 100%;
height: 100%;
}
.tf-model-viewer model-viewer.disabled {
pointer-events: none;
}
.tf-model-viewer.active model-viewer {
pointer-events: all;
}
.tf-model-viewer.active .wrap-btn-viewer {
display: none;
}   .noUi-target,
.noUi-target * {
-webkit-touch-callout: none;
-webkit-tap-highlight-color: transparent;
-webkit-user-select: none;
-ms-touch-action: none;
touch-action: none;
-ms-user-select: none;
-moz-user-select: none;
user-select: none;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.noUi-target {
position: relative;
direction: ltr;
}
.noUi-base,
.noUi-connects {
width: 100%;
height: 100%;
position: relative;
z-index: 1;
}
.noUi-connects {
overflow: hidden;
z-index: 0;
}
.noUi-connect,
.noUi-origin {
will-change: transform;
position: absolute;
z-index: 1;
top: 0;
left: 0;
height: 100%;
width: 100%;
-ms-transform-origin: 0 0;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
}
html:not([dir=rtl]) .noUi-horizontal .noUi-origin {
left: auto;
right: 0;
}
.noUi-vertical .noUi-origin {
width: 0;
}
.noUi-horizontal .noUi-origin {
height: 0;
}
.noUi-handle {
position: absolute;
}
.noUi-state-tap .noUi-connect,
.noUi-state-tap .noUi-origin {
-webkit-transition: transform 0.3s;
transition: transform 0.3s;
}
.noUi-state-drag * {
cursor: inherit !important;
}
.noUi-horizontal {
height: 18px;
}
.noUi-horizontal .noUi-handle {
width: 34px;
height: 28px;
left: -17px;
top: -6px;
}
.noUi-vertical {
width: 18px;
}
.noUi-vertical .noUi-handle {
width: 28px;
height: 34px;
left: -6px;
top: -17px;
}
html:not([dir=rtl]) .noUi-horizontal .noUi-handle {
right: -17px;
left: auto;
}
.noUi-draggable {
cursor: ew-resize;
}
.noUi-vertical .noUi-draggable {
cursor: ns-resize;
}
.noUi-handle:after {
left: 17px;
}
.noUi-vertical .noUi-handle:after,
.noUi-vertical .noUi-handle:before {
width: 14px;
height: 1px;
left: 6px;
top: 14px;
}
.noUi-vertical .noUi-handle:after {
top: 17px;
}
[disabled] .noUi-connect {
background: #b8b8b8;
}
[disabled] .noUi-handle,
[disabled].noUi-handle,
[disabled].noUi-target {
cursor: not-allowed;
}
.noUi-pips,
.noUi-pips * {
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.noUi-pips {
position: absolute;
color: #999;
}
.noUi-value {
position: absolute;
white-space: nowrap;
text-align: center;
}
.noUi-value-sub {
color: #ccc;
font-size: 10px;
}
.noUi-marker {
position: absolute;
background: #ccc;
}
.noUi-marker-sub {
background: #aaa;
}
.noUi-marker-large {
background: #aaa;
}
.noUi-pips-horizontal {
padding: 10px 0;
height: 80px;
top: 100%;
left: 0;
width: 100%;
}
.noUi-value-horizontal {
-webkit-transform: translate(-50%, 50%);
transform: translate(-50%, 50%);
}
.noUi-rtl .noUi-value-horizontal {
-webkit-transform: translate(50%, 50%);
transform: translate(50%, 50%);
}
.noUi-marker-horizontal.noUi-marker {
margin-left: -1px;
width: 2px;
height: 5px;
}
.noUi-marker-horizontal.noUi-marker-sub {
height: 10px;
}
.noUi-marker-horizontal.noUi-marker-large {
height: 15px;
}
.noUi-pips-vertical {
padding: 0 10px;
height: 100%;
top: 0;
left: 100%;
}
.noUi-value-vertical {
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%, 0);
padding-left: 25px;
}
.noUi-rtl .noUi-value-vertical {
-webkit-transform: translate(0, 50%);
transform: translate(0, 50%);
}
.noUi-marker-vertical.noUi-marker {
width: 5px;
height: 2px;
margin-top: -1px;
}
.noUi-marker-vertical.noUi-marker-sub {
width: 10px;
}
.noUi-marker-vertical.noUi-marker-large {
width: 15px;
}
.noUi-tooltip {
display: block;
position: absolute;
border: 1px solid #d9d9d9;
border-radius: 3px;
background: #fff;
color: #000;
padding: 5px;
text-align: center;
white-space: nowrap;
}
.noUi-horizontal .noUi-tooltip {
-webkit-transform: translate(-50%, 0);
transform: translate(-50%, 0);
left: 50%;
bottom: 120%;
}
.noUi-vertical .noUi-tooltip {
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
top: 50%;
right: 120%;
}
.noUi-horizontal {
height: 4px;
}
.noUi-target {
border: 0;
}
.noUi-base .noUi-connects {
border-radius: 999px;
background-color: var(--line);
}
.noUi-connect {
background-color: var(--main);
}
.noUi-horizontal .noUi-handle,
.noUi-vertical .noUi-handle {
height: 16px;
width: 16px;
border-radius: 50px;
border: 2px solid var(--main);
background-color: var(--white);
box-shadow: unset;
cursor: pointer;
}
.noUi-horizontal .noUi-handle::before, .noUi-horizontal .noUi-handle::after,
.noUi-vertical .noUi-handle::before,
.noUi-vertical .noUi-handle::after {
content: none;
}
html:not([dir=rtl]) .noUi-horizontal .noUi-handle {
right: -8px;
}
.tf-btn-filter {
display: inline-flex;
align-items: center;
gap: 4px;
text-transform: capitalize;
background-color: var(--white);
max-width: 100%;
text-wrap: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.tf-btn-filter .icon {
font-size: 16px;
}
.tf-btn-filter .icon-close {
font-size: 14px;
}
.tf-btn-filter:hover {
border-color: var(--main);
}
.tf-btn-filter.active {
background-color: var(--main);
border-color: var(--main);
color: var(--white);
}
@media (min-width: 1200px) {
.tf-btn-filter {
gap: 8px;
}
}
#filterDropdown {
min-width: 93px;
}
.tf-shop-control {
display: flex;
align-items: center;
justify-content: space-between;
gap: 15px 8px;
padding: 20px 0px;
border-top: 1px solid var(--line);
margin-bottom: 10px;
flex-wrap: wrap;
}
.tf-shop-control.no-top-category {
border-top: none;
padding-top: 0;
}
.tf-shop-control .tf-group-layout {
display: flex;
align-items: center;
gap: 15px;
}
@media (max-width: 767px) {
.tf-shop-control .tf-group-layout {
flex-direction: column;
row-gap: 10px;
align-items: end;
}
.tf-shop-control .tf-group-layout .count-text-total {
margin-right: 0;
}
}
@media (min-width: 768px) {
.tf-shop-control .tf-group-layout {
gap: 40px;
}
}
@media (min-width: 1200px) {
.tf-shop-control .tf-group-layout {
gap: 80px;
}
}
@media (max-width: 767px) {
.tf-shop-control .tf-group-layout .tf-control-layout {
display: none;
}
}
@media (max-width: 1199px) {
.tf-shop-control .tf-group-layout.type-drop {
width: 100%;
justify-content: space-between;
}
}
@media (max-width: 767px) {
.tf-shop-control .tf-group-layout.type-drop {
gap: 0;
}
.tf-shop-control .tf-group-layout.type-drop .tf-control-layout {
display: none;
}
}
.tf-shop-control .tf-control-sorting {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 12px;
}
@media (min-width: 1200px) {
.tf-shop-control {
padding: 31px 0px 32px;
}
}
.tf-control-layout {
display: flex;
align-items: center;
gap: 15px;
}
.tf-control-layout .tf-view-layout-switch {
display: flex;
align-items: center;
justify-content: center;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
cursor: pointer;
}
.tf-control-layout .tf-view-layout-switch:hover .item span, .tf-control-layout .tf-view-layout-switch.active .item span {
background-color: var(--primary);
}
@media (min-width: 992px) {
.tf-control-layout {
gap: 24px;
}
}
.wrapper-shop {
transition: all 0.3s ease-in-out;
animation: fadeShop 0.5s ease-in-out;
}
.wrapper-shop.tf-col-2 .card_product-wrapper {
aspect-ratio: 1;
}
.wrapper-shop.tf-col-2 .box_image--V02 .box_image-image img {
aspect-ratio: 0.821641791;
}
.wrapper-shop.tf-col-2 .box_image--V02.style-2 .box_image-image img {
aspect-ratio: 2.0944444444;
}
@media (max-width: 575px) {
.wrapper-shop {
gap: 15px 10px;
}
.wrapper-shop .card_product-wrapper {
aspect-ratio: 0.7 !important;
}
}
.wrapper-control-shop {
position: relative;
}
.wrapper-control-shop .tf-list-layout .card_product--V01 {
margin-bottom: 30px;
padding-bottom: 30px;
border-bottom: 1px solid var(--line);
}
.wrapper-control-shop .tf-list-layout .card_product--V01.last-visible, .wrapper-control-shop .tf-list-layout .card_product--V01:last-of-type {
padding-bottom: 0;
border: 0;
margin-bottom: 0;
}
.wrapper-control-shop .tf-list-layout .load-more-btn,
.wrapper-control-shop .tf-list-layout .wg-pagination {
margin-top: 30px;
}
.wrapper-control-shop .tf-grid-layout .btn-loadmore {
max-width: 252px;
width: 100%;
}
.wrapper-control-shop .tf-grid-layout .wg-pagination {
gap: 20px;
}
.wrapper-control-shop.loading-shop * {
display: none;
}
.wrapper-control-shop.loading-shop::after {
content: "";
position: absolute;
display: block;
top: 50%;
left: 50%;
width: 30px;
height: 30px;
border: 2px solid transparent;
border-top: 2px solid var(--black);
border-right: 2px solid var(--black);
border-radius: 50%;
animation: spin 0.5s linear infinite;
transform: translate(-50%, -50%);
z-index: 10000;
}
@media (min-width: 1200px) {
.wrapper-control-shop .tf-grid-layout .wg-pagination {
margin-top: 16px;
gap: 40px 20px;
}
}
@keyframes fadeShop {
0% {
opacity: 0;
transform: translateY(30px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
.listLayout-wrapper #product-count-grid {
display: none;
}
.listLayout-wrapper #product-count-list {
display: block;
}
.gridLayout-wrapper #product-count-grid {
display: block;
}
.gridLayout-wrapper #product-count-list {
display: none;
}
.tf-progress-ship {
width: 100%;
background-color: var(--line);
height: 8px;
position: relative;
border-radius: 16px;
}
.tf-progress-ship .value {
height: 100%;
background: var(--primary);
position: relative;
transition: width 2s ease;
}
.tf-progress-ship .icon {
position: absolute;
left: calc(100% - 34px);
top: 50%;
transform: translateY(-50%);
width: 34px;
height: 34px;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--primary);
font-size: 20px;
color: var(--white);
}
.icon-grid-2 {
display: grid;
gap: 2px;
grid-template-columns: 1fr 1fr;
}
.icon-grid-2 span {
display: inline-block;
width: 5px;
height: 23px;
background-color: var(--line-3);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.icon-grid-3 {
display: grid;
gap: 2px;
grid-template-columns: 1fr 1fr 1fr;
}
.icon-grid-3 span {
display: inline-block;
width: 5px;
height: 23px;
background-color: var(--line-3);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.icon-grid-4 {
display: grid;
gap: 2px;
grid-template-columns: repeat(4, 1fr);
}
.icon-grid-4 span {
display: inline-block;
width: 5px;
height: 23px;
background-color: var(--line-3);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.ic-accordion-custom {
position: relative;
width: 16px;
height: 16px;
display: flex;
align-items: center;
justify-content: center;
transition: transform 0.35s linear;
}
.ic-accordion-custom::after, .ic-accordion-custom::before {
content: "";
position: absolute;
background-color: var(--main);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.ic-accordion-custom::before {
height: 100%;
width: 2px;
}
.ic-accordion-custom::after {
height: 2px;
width: 100%;
}
.widget-facet:not(:last-child) {
border-bottom: 1px solid var(--line);
}
.widget-facet .tf-check.style-2:checked {
border-color: var(--main);
background-color: var(--main);
}
.widget-facet .tf-check.style-2:checked::before {
opacity: 1;
transform: scale(1);
}
.widget-facet .facet-title {
display: flex;
align-items: center;
justify-content: space-between;
padding: 16px 0px;
margin-bottom: 16px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.widget-facet .facet-title .icon::before {
transform: rotate(90deg);
}
.widget-facet .facet-title .icon::after {
transform: rotate(180deg);
}
.widget-facet .facet-title.collapsed {
margin-bottom: 0px;
}
.widget-facet .facet-title.collapsed .icon::before {
transform: rotate(0deg);
}
.widget-facet .facet-title.collapsed .icon::after {
transform: rotate(0deg);
}
.widget-facet .filter-group-check {
padding-bottom: 31px;
}
.filter-group-check .list-item {
display: flex;
gap: 15px;
align-items: center;
cursor: pointer;
letter-spacing: 0;
}
.filter-group-check .list-item:not(:last-child) {
margin-bottom: 15px;
}
.filter-group-check .label {
cursor: pointer;
font-weight: 400;
font-size: 18px;
line-height: 28px;
display: flex;
align-items: center;
gap: 10px;
}
@media (max-width: 1199px) {
.filter-group-check .label {
font-size: 16px;
}
}
.filter-group-check .count-wrap {
color: var(--main-4);
}
.filter-group-check .img-check {
max-width: 24px;
border-radius: 50%;
aspect-ratio: 1;
overflow: hidden;
}
.filter-size-box {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 10px;
}
.filter-size-box .size-item {
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid var(--line);
background-color: var(--white);
cursor: pointer;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
position: relative;
}
@media (max-width: 1199px) {
.filter-size-box .size-item {
width: 35px;
height: 35px;
}
}
.filter-size-box .size-item .count {
font-weight: 400;
font-size: 18px;
line-height: 28px;
}
@media (max-width: 1199px) {
.filter-size-box .size-item .count {
font-size: 16px;
}
}
.filter-size-box .size-item.active, .filter-size-box .size-item:hover {
background-color: var(--main);
color: var(--white);
}
.filter-size-box .size-item.disabled {
color: var(--main-4);
pointer-events: none;
}
.filter-size-box .size-item.disabled::after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 53.568px;
height: 1px;
background-color: var(--main-4);
transform: rotate(45deg);
transform-origin: top left;
}
.tf-control-filter {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 10px 20px;
}
@media (min-width: 1200px) {
.tf-control-filter {
gap: 40px;
}
}
.meta-filter-shop {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 20px;
}
.meta-filter-shop #applied-filters {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 10px;
}
.meta-filter-shop .filter-tag {
display: flex;
align-items: center;
text-transform: capitalize;
gap: 10px;
padding: 6px 20px;
border-radius: 30px;
background-color: var(--bg-18);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
cursor: pointer;
}
.meta-filter-shop .filter-tag .icon {
font-size: 10px;
}
.meta-filter-shop .filter-tag .remove-tag {
font-size: 10px;
order: 1;
}
.meta-filter-shop .filter-tag:hover {
background-color: var(--main);
color: var(--white);
}
.meta-filter-shop.type-drop {
margin-bottom: 20px;
}
.loadItem.hidden {
display: none;
}
.sidebar-filter {
background-color: var(--white);
transition: transform 0.3s ease-in-out;
}
@media (min-width: 1200px) {
.sidebar-filter .canvas-body {
padding: 0;
}
}
@media (max-width: 1199px) {
.sidebar-filter {
position: fixed;
bottom: 0;
z-index: 3000;
display: flex;
flex-direction: column;
background-clip: padding-box;
outline: 0;
}
.sidebar-filter.left {
top: 0;
left: 0;
transform: translateX(-100%);
}
.sidebar-filter.right {
top: 0;
right: 0;
transform: translateX(100%);
}
.sidebar-filter.show {
transform: none;
}
}
.overlay-filter {
position: fixed;
top: 0;
left: 0;
z-index: 2000;
width: 100vw;
height: 100vh;
background-color: rgba(0, 0, 0, 0.4);
visibility: hidden;
opacity: 0;
transition: opacity 0.15s linear;
}
.overlay-filter.show {
opacity: 1;
visibility: visible;
}
.tf-filter-dropdown {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 20px;
}
@media (min-width: 1200px) {
.tf-filter-dropdown {
gap: 40px;
}
}
.meta-dropdown-filter {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 10px;
}
@media (min-width: 1200px) {
.meta-dropdown-filter {
gap: 10px 20px;
}
}
.dropdown-filter .dropdown-toggle {
letter-spacing: 0px;
display: flex;
align-items: center;
gap: 10px;
padding: 4px 8px;
border: 1px solid var(--line);
cursor: pointer;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.dropdown-filter .dropdown-toggle::after {
content: none;
}
.dropdown-filter .dropdown-toggle .icon {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
font-size: 12px;
}
.dropdown-filter .dropdown-toggle:hover, .dropdown-filter .dropdown-toggle.show {
border-color: var(--main);
}
.dropdown-filter .dropdown-toggle.show .icon {
transform: rotate(180deg);
}
@media (min-width: 1200px) {
.dropdown-filter .dropdown-toggle {
gap: 20px;
padding: 7px 15px 7px 12px;
}
}
.dropdown-filter .dropdown-menu {
min-width: unset;
padding: 32px;
box-shadow: 2px 4px 24px 0px rgba(175, 175, 175, 0.2509803922);
border-radius: unset;
border: 1px solid var(--line);
z-index: 99;
width: max-content;
}
@media (max-width: 1199px) {
.dropdown-filter .dropdown-menu {
padding: 15px;
}
}
@media (min-width: 1440px) {
.dropdown-filter > .dropdown-menu {
inset: auto auto 0px 0px !important;
transform: translate(0px, -42px) !important;
}
}
.feedback-message {
margin-top: 10px;
text-align: center;
}
.feedback-message.error {
color: #ff5757;
}
.feedback-message.success {
color: #46ba4c;
}
.form_message {
margin-bottom: 10px;
}
.form_message.error {
color: #ff5757;
}
.form_message.success {
color: #46ba4c;
}
.wg-show-more {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
gap: 30px;
}
@media (min-width: 1200px) {
.wg-show-more {
gap: 40px;
}
.wg-show-more .tf-btn {
padding: 13px 80px;
}
}
#live-sales-container {
position: relative;
z-index: 997;
}
#live-sales-container .live-notification {
display: flex;
gap: 20px;
align-items: center;
min-width: 383px;
max-width: 100%;
overflow: hidden;
position: fixed;
bottom: 30px;
left: 30px;
padding: 18px 28px 18px 12px;
border-radius: 0px;
background-color: var(--white);
box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.1019607843);
}
#live-sales-container .live-notification .icon-close-notification {
position: absolute;
right: 16px;
top: 18px;
cursor: pointer;
font-size: 14px !important;
}
#live-sales-container .live-notification .live-notification-featured img {
width: 82px;
height: 101px;
border-radius: 0px;
overflow: hidden;
object-fit: cover;
}
#live-sales-container .live-notification .live-notification-name {
font-weight: 500;
font-size: 16px;
line-height: 24px;
color: #000;
margin-bottom: 20px;
}
#live-sales-container .live-notification .live-notification-name:hover {
color: var(--primary);
}
#live-sales-container .live-notification .user {
color: #000;
margin-bottom: 6px;
font-weight: 400;
font-size: 14px;
line-height: 20px;
}
#live-sales-container .live-notification .live-notification-time {
display: flex;
align-items: center;
gap: 5px;
font-weight: 400;
font-size: 12px;
line-height: 18px;
color: #000;
}
#live-sales-container .live-notification.active {
animation-play-state: paused;
transition: none;
}
@media (max-width: 1599px) {
.main-grid-b .group-breadcrumb .tooltip,
.col-lg-5.col-xxl-4.right-col .group-breadcrumb .tooltip {
left: unset;
right: 0;
transform: unset;
}
.main-grid-b .group-breadcrumb .tooltip::before,
.col-lg-5.col-xxl-4.right-col .group-breadcrumb .tooltip::before {
left: unset;
right: 10px;
transform: translateX(0%) rotate(45deg);
}
}
@media (max-width: 767px) {
#live-sales-container .live-notification {
min-width: 320px;
left: 15px;
}
}
@-webkit-keyframes fadeInLeft {
from {
opacity: 0;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
to {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes fadeInLeft {
from {
opacity: 0;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
to {
opacity: 1;
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
.tf-fade-in-left {
-webkit-animation-name: fadeInLeft;
animation-name: fadeInLeft;
}
@-webkit-keyframes fadeOutLeft {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
@keyframes fadeOutLeft {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translateX(-100%);
transform: translateX(-100%);
}
}
.tf-fade-out-left {
-webkit-animation-name: fadeOutLeft;
animation-name: fadeOutLeft;
}
.tax-product .tf-shop-control,
.tax-product_cat .tf-shop-control {
border-top: none;
}
.tax-product #themesflat-content,
.tax-product_cat #themesflat-content {
padding-top: 0;
}
.single-product .tf-page-title {
padding-top: 62px;
}
.single-product .tf-page-title .page-title {
padding-bottom: 0;
border-bottom: none;
}
.single-product .tf-page-title .page-title .bread-wrap {
margin-bottom: 0;
}
.attribute-button-type-list .tf-attribute-filter.pa_size-check .count-wrap {
display: none;
}
.tf-mini-cart-main .cart-item-inner {
display: flex;
justify-content: space-between;
gap: 20px;
}
.card_product--V03.style_2 .card_product-info {
opacity: 0;
visibility: hidden;
transform: scale(0.85) translateY(10px);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.swiper-slide-active .card_product--V03.style_2 .card_product-info {
opacity: 1;
visibility: visible;
transform: scale(1) translateY(0px);
transition-delay: 0.6s;
}
.vemus-shop-pagination.woocommerce-pagination .pagition-list {
gap: 40px;
}
.vemus-shop-pagination.woocommerce-pagination .page-numbers {
gap: 15px;
}
.vemus-shop-pagination.woocommerce-pagination .page-numbers .next {
margin-left: 10px !important;
}
.vemus-shop-pagination.woocommerce-pagination .page-numbers .prev {
margin-right: 10px !important;
}
.vemus-shop-pagination.woocommerce-pagination .page-numbers .tf-btn-line {
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: -0.07px;
}
.vemus-shop-pagination.woocommerce-pagination .page-numbers .tf-btn-line::after {
display: none;
}
.tf-product-info-heading .product-info-view .icon-view {
position: relative;
font-size: 18px;
top: 2px;
color: #222;
font-weight: 600;
}
.tf-add-to-cart-loading .spinner {
width: 20px !important;
height: 20px !important;
}
.wocommerce-wishlist .wcboost-wishlist-form {
margin-bottom: 60px;
}
.form-feedback .tf-check-rounded {
height: 18px !important;
width: 18px !important;
}
.form-feedback .tf-check-rounded::before {
width: 8px !important;
height: 8px !important;
}
.remove-all-filters {
background: #1f1f1f;
color: #fff;
padding: 6px 20px;
border-radius: 30px;
padding-right: 35px;
position: relative;
}
.remove-all-filters span {
color: #fff !important;
}
.remove-all-filters::after, .remove-all-filters::before {
content: " ";
position: absolute;
top: 50%;
right: 0px;
display: inline-block;
margin-top: -1px;
width: 12px;
height: 1px;
background-color: currentcolor;
transform: rotate(45deg);
transition: background-color 0.2s ease-in-out, transform 0.2s ease-in-out, width 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out;
}
.remove-all-filters::before, .remove-all-filters::after {
right: 12px;
}
.remove-all-filters::after {
transform: rotate(-45deg);
}
.remove-all-filters:hover::after, .remove-all-filters:hover::before {
transform: rotate(0deg);
}
.single-product .page-title {
flex-direction: unset !important;
align-items: center !important;
overflow: hidden;
}
.single-product .page-title .group-breadcrumb .product-navigation {
display: flex;
align-items: center;
gap: 10px;
}
.single-product .main-grid-b .main-product-info.tf-product-info-list.sticky-top {
padding-top: 0 !important;
z-index: 99;
}
.single-product .main-grid-b .tf-product-info-heading {
position: relative;
}
.single-product .main-grid-b .tf-product-info-heading .breadcrumb-list.breadcrumb-trail.breadcrumbs {
padding-top: 20px !important;
}
.single-product .main-grid-b .tf-product-info-heading .group-breadcrumb {
top: 19px;
}
.group-breadcrumb .product-navigation {
display: flex;
align-items: center;
gap: 10px;
}
.single-product .main-grid-c.right-col {
padding-top: 60px;
}
@media (max-width: 1199px) {
.single-product .main-grid-c.right-col {
padding-top: 0px;
}
}
@media (max-width: 1199px) {
.post-type-archive-product .tf-page-title.tfwc-page-title,
.archive.woocommerce .tf-page-title.tfwc-page-title {
padding-top: 50px;
padding-bottom: 28px;
}
.post-type-archive-product .tf-page-title.tfwc-page-title .page-title,
.archive.woocommerce .tf-page-title.tfwc-page-title .page-title {
padding-bottom: 0;
}
}
@media (max-width: 1199px) {
.single-product .tf-page-title.tfwc-page-title {
padding-top: 20px;
}
.single-product #themesflat-content {
padding-top: 15px;
}
}
@media (max-width: 1199px) {
.tf-mini-cart-tool {
padding: 15px;
}
}
@media (max-width: 767px) {
.tf-mini-cart-bottom-wrap .tf-cart-total-text,
.tf-mini-cart-bottom-wrap .tf-totals-total-value {
font-size: 14px;
}
.tf-mini-cart-bottom-wrap .tf-cart-totals-discounts .woocs_special_price_code {
font-size: 16px;
}
.tf-mini-cart-item .tf-mini-cart-image {
max-width: 90px;
}
.popup-shopping-cart .tf-mini-cart-main .tf-mini-cart-item .tf-mini-card-price span {
font-size: 16px;
}
.tf-mini-cart-main .cart-item-inner {
flex-direction: column;
gap: 10px;
}
.tf-mini-cart-main .cart-item-inner .tf-mini-card-price {
justify-content: left;
}
.post-type-archive-product .products-content {
overflow: hidden;
}
.card-product .price-wrap span {
font-size: 14px;
gap: 0px 5px;
}
}
.product-info-sold svg {
animation: 3s infinite tf-ani-flash;
}
@keyframes tf-ani-flash {
0%, 100%, 50% {
opacity: 1;
transform: scale(1);
}
25%, 75% {
opacity: 0.3;
transform: scale(0.8);
}
}
.single_variation_wrap .woocommerce-variation-add-to-cart .tf-buy-now-btn {
border-color: #ccc;
}
.single_variation_wrap .woocommerce-variation-add-to-cart .tf-buy-now-btn:hover {
border-color: #1f1f1f;
}
.tf-buyx-gety-wrapper .form-buyX-getY {
border: 1px solid #EBEBEB;
padding: 32px;
border-radius: 0;
}
@media (max-width: 1199px) {
.tf-buyx-gety-wrapper .form-buyX-getY {
padding: 20px;
}
}
.tf-buyx-gety-wrapper .form-buyX-getY .title-buyX-getY {
text-align: left;
font-weight: 400;
font-size: 24px;
line-height: 32px;
text-transform: uppercase;
margin-bottom: 44px;
}
.tf-buyx-gety-wrapper .form-buyX-getY .group-item-product {
column-gap: 43px;
row-gap: 50px;
margin-bottom: 42px;
}
@media (max-width: 1199px) {
.tf-buyx-gety-wrapper .form-buyX-getY .group-item-product {
column-gap: 20px;
margin-bottom: 30px;
}
}
.tf-buyx-gety-wrapper .form-buyX-getY .group-item-product .arrow {
display: none;
}
.tf-buyx-gety-wrapper .form-buyX-getY .group-item-product .ribbon {
background: var(--primary);
font-weight: 600;
font-size: 16px;
line-height: 24px;
text-align: center;
text-transform: uppercase;
top: -13px;
left: -9px;
}
.tf-buyx-gety-wrapper .form-buyX-getY .group-item-product .item-product {
border: 1px solid #EBEBEB;
padding: 10px;
border-radius: 0;
}
.tf-buyx-gety-wrapper .form-buyX-getY .group-item-product .item-product::before {
border-top: 8px solid var(--primary);
top: 19.7px;
left: -8px;
}
.tf-buyx-gety-wrapper .form-buyX-getY .group-item-product .item-product .img-product {
border-radius: 0;
}
.tf-buyx-gety-wrapper .form-buyX-getY .group-item-product .item-product .info-product {
padding-top: 22px;
}
.tf-buyx-gety-wrapper .form-buyX-getY .group-item-product .item-product .name-product {
font-weight: 400;
font-size: 20px;
line-height: 30px;
text-align: left;
margin-bottom: 9px;
}
.tf-buyx-gety-wrapper .form-buyX-getY .group-item-product .item-product .name-product:hover {
color: var(--primary);
}
.tf-buyx-gety-wrapper .form-buyX-getY .group-item-product .item-product .price-product {
font-weight: 500;
font-size: 18px;
line-height: 28px;
justify-content: left;
width: 100%;
margin-bottom: 10px;
}
.tf-buyx-gety-wrapper .form-buyX-getY .group-item-product .item-product .price-product .woocs_price_code {
display: flex;
align-items: center;
gap: 10px;
justify-content: left;
}
.tf-buyx-gety-wrapper .form-buyX-getY .group-item-product .item-product .price-product del {
font-weight: 400;
font-size: 14px;
line-height: 22px;
color: rgba(28, 28, 28, 0.6);
}
.tf-buyx-gety-wrapper .form-buyX-getY .group-item-product .item-product .variant-product select {
border: 1px solid #EBEBEB;
border-radius: 0;
font-weight: 400;
font-size: 16px;
line-height: 24px;
text-transform: uppercase;
color: #1F1F1F;
padding: 3px 13px;
}
.s-shop-cart.each-list-prd {
padding-left: 15px;
padding-right: 15px;
}
.woocommerce .tf-main-product .product-info-countdown {
border: 1px solid rgba(232, 53, 36, 0.4);
border-radius: 0;
padding: 20px 32px;
padding-bottom: 14px;
min-width: 353px;
margin-bottom: 8px !important;
}
@media (max-width: 1199px) {
.woocommerce .tf-main-product .product-info-countdown {
min-width: unset;
}
}
.woocommerce .tf-main-product .product-info-countdown .countdown-title {
gap: 8px;
margin-bottom: 5px;
}
.woocommerce .tf-main-product .product-info-countdown .countdown-title .text-xs {
font-weight: 500;
font-size: 18px;
line-height: 28px;
color: #101828;
}
.woocommerce .tf-main-product .product-info-countdown .countdown-title .text-xs .text-primary {
color: #101828 !important;
}
.woocommerce .tf-main-product .product-info-countdown .countdown__timer {
gap: unset;
}
.woocommerce .tf-main-product .product-info-countdown .countdown__timer .countdown__item {
width: unset;
color: #E83524;
background-color: unset;
border-radius: unset;
font-weight: 500;
font-size: 16px;
line-height: 24px;
}
.woocommerce .tf-main-product .product-info-countdown .countdown__timer .countdown__item::after {
color: #E83524;
margin: 0 10px;
position: unset;
transform: unset;
}
.single-product #goTop {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
bottom: 110px;
}
@media (max-width: 1199px) {
.single-product #goTop.sticky-btn-atc-show {
bottom: 210px;
right: 15px;
}
}
.tf-page-cart-main .extra-fields textarea {
height: 206px;
}
.compare-item .woocs_price_code {
display: flex;
align-items: baseline;
gap: 10px;
}
.tf-main-product .group-breadcrumb {
overflow: unset !important;
}
.tf-product-volume-discount {
border: 1px solid #EBEBEB;
padding: 32px;
}
@media (max-width: 1199px) {
.tf-product-volume-discount {
padding: 20px;
}
}
.tf-product-volume-discount .title-discount {
font-weight: 400;
font-size: 24px;
line-height: 32px;
text-transform: uppercase;
margin-bottom: 32px;
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item {
border: 1px solid rgba(174, 135, 62, 0.4);
padding: 22.7px 20px;
display: flex;
align-items: center;
gap: 16px;
position: relative;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
cursor: pointer;
}
@media (max-width: 1199px) {
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item {
padding: 15px;
}
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item.active, .tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item:hover {
background: var(--primary);
border-color: var(--primary);
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item.active .check, .tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item:hover .check {
border-color: #fff;
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item.active .check span, .tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item:hover .check span {
opacity: 1;
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item.active .name,
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item.active .text,
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item.active .price-new,
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item.active .price-old, .tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item:hover .name,
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item:hover .text,
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item:hover .price-new,
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item:hover .price-old {
color: #fff !important;
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item.active .tag-shipping, .tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item:hover .tag-shipping {
color: #fff !important;
border: 1px solid #fff !important;
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item:not(:last-child) {
margin-bottom: 12px;
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item .check {
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
width: 23px;
height: 23px;
border: 1px solid #AE873E;
background-color: transparent;
flex-shrink: 0;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item .check span {
width: 15px;
height: 15px;
background: #fff;
border-radius: 50%;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item .content-discount {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px 30px;
width: 100%;
flex-wrap: wrap;
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item .content-discount .name {
font-weight: 500;
font-size: 16px;
line-height: 26px;
color: #252525;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item .content-discount .text {
font-weight: 400;
font-size: 15px;
line-height: 25px;
color: #252525;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item .content-discount .tag-shipping {
font-weight: 500;
font-size: 11px;
line-height: 18px;
color: #AE873E;
border: 1px solid #AE873E;
padding: 3px 8px;
text-transform: uppercase;
flex-shrink: 0;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item .content-discount .discount-price {
display: flex;
flex-direction: column;
gap: 2px;
align-items: flex-end;
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item .content-discount .discount-price .price-new {
font-weight: 500;
font-size: 22px;
line-height: 30px;
color: #252525;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
@media (max-width: 1199px) {
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item .content-discount .discount-price .price-new {
font-size: 18px;
}
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item .content-discount .discount-price .price-old {
font-weight: 400;
font-size: 15px;
line-height: 25px;
text-decoration: line-through;
color: #252525;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item .content-discount .tag-sale {
font-weight: 500;
font-size: 14px;
letter-spacing: -0.7px;
color: #fff;
text-transform: uppercase;
position: absolute;
top: 0;
right: 17%;
letter-spacing: -0.3px;
padding: 2px 9px;
top: -8px;
border-radius: 0 0 4px 4px;
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item .content-discount .tag-sale::after {
content: "";
position: absolute;
top: 26px;
left: -7px;
border-top: 7px solid #7154b4;
border-right: 8px solid transparent;
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
border-top: 8px solid #7A0A17;
top: -0.3px;
left: -8px;
}
.tf-product-volume-discount .flat-check-list.list-volume-discount .volume-discount-list-item .content-discount .tag-sale::before {
content: "";
position: absolute;
top: 26px;
right: -8px;
border-top: 7px solid #7154b4;
border-right: 8px solid transparent;
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
border-top: 8px solid #7A0A17;
top: -0.3px;
}
.tf-sticky-filter-btn {
left: 0 !important;
}
.tf-sticky-filter-btn > a {
width: 40px;
height: 40px;
border: 1px solid var(--black);
background-color: var(--black);
color: var(--white);
display: flex;
justify-content: center;
align-items: center;
font-size: 22px;
}   @keyframes sliderShape {
0%, 100% {
border-radius: 42% 58% 70% 30%/45% 45% 55% 55%;
transform: translate3d(0, 0, 0) rotateZ(0.01deg);
}
34% {
border-radius: 70% 30% 46% 54%/30% 29% 71% 70%;
transform: translate3d(0, 5px, 0) rotateZ(0.01deg);
}
50% {
transform: translate3d(0, 0, 0) rotateZ(0.01deg);
}
67% {
border-radius: 100% 60% 60% 100%/100% 100% 60% 60%;
transform: translate3d(0, -3px, 0) rotateZ(0.01deg);
}
}
@keyframes tf-animate-zoom-in-out {
0% {
transform: scale(1);
}
50% {
transform: scale(1.2);
}
100% {
transform: scale(1);
}
}
@keyframes ripple-line {
to {
transform: scale(2);
opacity: 0;
}
}   .page-title {
display: flex;
justify-content: space-between;
align-items: end;
padding-bottom: 58px;
border-bottom: 1px solid var(--line);
gap: 20px;
}
@media (max-width: 1439px) {
.page-title .page-title {
flex-wrap: wrap;
}
}
.page-title .box-text .text-main-4 {
letter-spacing: -0.2px;
}
.page-title .heading {
display: flex;
gap: 10px;
text-transform: uppercase;
word-break: break-all;
}
.page-title .heading .number-count {
font-size: 16px;
line-height: 24px;
letter-spacing: 0.32px;
}
.page-title.type-2 {
padding-bottom: 0;
border: 0;
}
@media (min-width: 1600px) {
.page-title .box-text {
max-width: 622px;
width: 100%;
}
}
.breadcrumbs {
letter-spacing: 0px;
}
.breadcrumbs.no-desc {
width: 100%;
}
.breadcrumbs .bread-wrap {
display: flex;
align-items: center;
gap: 5px 10px;
margin-bottom: 20px;
flex-wrap: wrap;
}
.breadcrumbs .sep.dot .br-line {
display: inline-block;
vertical-align: middle;
}
.breadcrumbs a {
color: #818181;
}
.breadcrumbs a:hover {
color: var(--secondary);
}
@media (min-width: 1200px) {
.breadcrumbs .bread-wrap {
margin-bottom: 40px;
}
}
.leave-comment-wrap {
display: grid;
gap: 32px;
}
.box_icon--V01 {
display: flex;
align-items: center;
gap: 15px;
}
.box_icon--V01 .wrap-icon {
flex-shrink: 0;
}
.box_icon--V01 .icon {
font-size: 35px;
transition-duration: 0.5s;
color: var(--primary);
}
.box_icon--V01 .content {
display: grid;
gap: 4px;
}
.box_icon--V01 .text {
color: #444444;
}
.box_icon--V01:hover .icon {
transform: scale(1.1);
transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
}
.box_icon--V01.style_2 .icon {
width: 64px;
height: 64px;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--white);
color: var(--primary-2);
border-radius: 50%;
transform: unset;
}
.box_icon--V01.style_2 i {
font-size: 22px;
transition-duration: 0.5s;
}
.box_icon--V01.style_2:hover i {
transform: scale(1.2);
transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
}
.box_icon--V01.style-white .icon,
.box_icon--V01.style-white .text,
.box_icon--V01.style-white .title {
color: var(--white);
}
@media (min-width: 1200px) {
.box_icon--V01 {
gap: 24px;
}
.box_icon--V01 .icon {
font-size: 42px;
}
}
@media (max-width: 1199px) {
.box_icon--V01 {
flex-direction: column;
justify-content: center;
text-align: center;
}
}
.box_icon--V02 {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
gap: 20px;
}
.box_icon--V02 .icon {
color: var(--primary-2);
font-size: 42px;
transition-duration: 0.5s;
}
.box_icon--V02 .content {
display: grid;
gap: 8px;
}
.box_icon--V02 .title {
font-weight: normal;
}
.box_icon--V02 .text {
color: var(--main-4);
}
.box_icon--V02:hover .icon {
transform: scale(1.1);
transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
}
.box_icon--V02.style_2 {
border: 1px solid var(--line);
padding: 20px 15px;
}
@media (min-width: 1200px) {
.box_icon--V02.style_2 {
padding: 29px 15px;
}
}
@media (min-width: 1200px) {
.box_icon--V02 {
gap: 32px;
}
}
.tf_marquee-V01 {
display: flex;
align-items: center;
white-space: nowrap;
gap: 40px;
padding: 24px 0px;
}
.tf_marquee-V01 i {
font-size: 24px;
color: var(--primary);
}
.tf_marquee-V01 p {
font-family: "Playfair Display", serif;
font-weight: 400;
font-size: clamp(36px, 4vw, 60px);
line-height: clamp(44px, 5vw, 72px);
color: #5A5A5A;
}
.tf_marquee-V01 p:not(.text-clip) {
font-style: italic;
}
.tf_marquee-V01.style_2 {
padding: 24px 0px;
}
.tf_marquee-V01.style_2 p {
color: var(--white);
font-size: clamp(40px, 5vw, 72px);
line-height: clamp(50px, 6vw, 90px);
}
.tf_marquee-V01.style_2 i {
color: var(--white);
}
@media (max-width: 1024px) {
.tf_marquee-V01.style_2 .img-ic {
max-width: 50px;
}
}
.tf_marquee-V01.style_3 p {
font-family: "Hero";
font-style: normal;
}
.tf_marquee-V01.style_3 p:not(.text-clip) {
font-weight: 700;
}
@media (min-width: 1200px) {
.tf_marquee-V01 {
padding: 48px 0px;
gap: 64px;
}
}
.text-clip {
color: white !important;
text-shadow: -1px -1px 0 #5A5A5A, 1px -1px 0 #5A5A5A, -1px 1px 0 #5A5A5A, 1px 1px 0 #5A5A5A;
}
.text-clip.style-white {
color: var(--bg-3) !important;
text-shadow: -1px -1px 0 var(--white), 1px -1px 0 var(--white), -1px 1px 0 var(--white), 1px 1px 0 var(--white);
}
.text-clip.type-2 {
color: var(--bg-14) !important;
}
.gallery-V01 {
position: relative;
overflow: hidden;
}
.gallery-V01 .content {
position: absolute;
padding: 20px 15px;
background-color: var(--white);
bottom: 0;
right: 0;
left: 0;
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
transform: translateY(0%);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.gallery-V01 .image {
min-height: 400px;
}
.gallery-V01 .wrap-name {
display: grid;
gap: 5px;
}
.gallery-V01 .wrap-name p {
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
display: -webkit-box;
overflow: hidden;
}
@media (min-width: 1440px) {
.gallery-V01 .content {
padding: 40px 32px 33px;
transform: translateY(100%);
}
.gallery-V01:hover .content {
transform: translateY(0%);
}
}
.mega-imagebox .content {
left: 27px !important;
bottom: 26px !important;
}
.box_image--V01 {
position: relative;
}
.box_image--V01 .content {
display: flex;
flex-direction: column;
align-items: start;
position: absolute;
bottom: 20px;
left: 20px;
right: 20px;
gap: 10px;
}
.box_image--V01 .box-text {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 0px 10px;
}
.box_image--V01 img {
height: 100%;
object-fit: cover;
}
@media (min-width: 992px) {
.box_image--V01 .content {
left: 40px;
right: 40px;
bottom: 40px;
}
.box_image--V01.style-2 .content {
left: 42px;
right: 42px;
bottom: 42px;
}
.box_image--V01.style-3 .content {
left: 24px;
right: 24px;
bottom: 24px;
gap: 10px;
}
}
.box_image--V02 {
position: relative;
display: flex;
}
.box_image--V02 .box_image-image {
height: 100%;
width: 100%;
min-height: 300px;
}
.box_image--V02 .box_image-image img {
object-fit: cover;
}
.box_image--V02 .box_image-content {
position: absolute;
bottom: 20px;
right: 15px;
left: 15px;
display: flex;
flex-direction: column;
align-items: start;
z-index: 2;
}
.box_image--V02 .title {
margin-bottom: 15px;
}
.box_image--V02 .heading {
margin-bottom: 15px;
}
.box_image--V02 .heading .title {
margin-bottom: 0px;
}
.box_image--V02.style-2::after {
position: absolute;
background: rgba(0, 0, 0, 0.2);
content: "";
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
}
@media (min-width: 1200px) {
.box_image--V02 .title {
margin-bottom: 24px;
}
.box_image--V02 .box_image-content {
bottom: 40px;
}
.box_image--V02 .box_image-content.type-left {
left: 40px;
}
.box_image--V02 .heading {
margin-bottom: 40px;
}
}
.hero-banner {
position: relative;
}
.hero-banner .hero-main {
padding-top: 189px;
padding-bottom: 60px;
}
.hero-banner .img_item {
position: absolute;
}
.hero-banner .img_item.item-1 {
max-width: clamp(100px, 15vw, 356px);
top: 10%;
left: 15px;
}
.hero-banner .img_item.item-2 {
max-width: clamp(100px, 15vw, 292px);
top: 73%;
left: 25%;
}
.hero-banner .img_item.item-3 {
max-width: clamp(100px, 15vw, 208px);
top: 69%;
right: 20%;
}
.hero-banner .img_item.item-4 {
max-width: clamp(100px, 15vw, 256px);
top: 10%;
right: 15px;
}
.hero-banner .hero-content {
width: 100%;
margin: 0 auto;
text-align: center;
position: relative;
z-index: 2;
}
.hero-banner .title {
margin-bottom: 15px;
}
.hero-banner .sub {
margin-bottom: 25px;
}
.hero-banner .btn-group {
display: flex;
align-items: center;
justify-content: center;
gap: 20px;
}
@media (min-width: 768px) {
.hero-banner .sub {
margin-bottom: 40px;
}
}
@media (min-width: 992px) {
.hero-banner .hero-main {
padding-bottom: 200px;
}
}
@media (min-width: 1200px) {
.hero-banner .btn-group {
gap: 34px;
}
.hero-banner .hero-main {
padding-top: 289px;
padding-bottom: 289px;
}
.hero-banner .title {
margin-bottom: 24px;
}
.hero-banner .sub {
margin-bottom: 60px;
}
}
@media (min-width: 1440px) {
.hero-banner .img_item.item-2 {
top: 76.1%;
left: 23.63%;
}
.hero-banner .img_item.item-3 {
top: 73.2%;
right: 28.98%;
}
}
@media (min-width: 1600px) {
.hero-banner .img_item.item-1 {
top: 16.8%;
left: 8.53%;
}
.hero-banner .img_item.item-4 {
top: 22%;
right: 12%;
}
}
@media (max-width: 1024px) {
.hero-banner .img_item.item-1, .hero-banner .img_item.item-4 {
filter: blur(3px);
}
}
@media (max-width: 575px) {
.hero-banner .img_item.item-1 {
top: 6%;
}
.hero-banner .img_item.item-4 {
top: 2%;
}
.hero-banner .img_item.item-1, .hero-banner .img_item.item-4 {
filter: blur(0px);
}
} .countdown-V01 {
display: flex;
align-items: center;
justify-content: center;
gap: 5px;
}
.countdown-V01 .countdown__timer {
display: flex;
gap: 5px;
}
.countdown-V01 .countdown__timer .countdown__item:last-child {
display: inline-flex;
width: 22px;
}
.countdown-V02 {
padding: 9px 20px;
background-color: var(--white);
border: 1px solid var(--line-8);
}
@media (max-width: 767px) {
.countdown-V02 {
padding: 5px 20px;
}
}
.countdown-V02 .countdown__item {
color: var(--primary);
font-weight: 500;
font-size: 18px;
line-height: 28px;
}
@media (max-width: 767px) {
.countdown-V02 .countdown__item {
font-size: 14px;
}
}
.countdown-V02 .countdown__timer {
display: inline-flex;
gap: 7px;
}
.countdown-V02 .countdown__timer .countdown__item:last-child {
display: inline-flex;
width: 22px;
}
@media (min-width: 1200px) {
.countdown-V02 {
padding: 9px 30px;
}
}
.countdown-V03 .countdown__timer {
display: flex;
justify-content: center;
gap: 5px;
}
.countdown-V03 .countdown__item {
display: flex;
align-items: center;
flex-direction: column;
gap: 4px;
padding: 10px;
border: 1px solid var(--line);
min-width: 55px;
max-width: 102px;
width: 100%;
}
@media (min-width: 768px) {
.countdown-V03 .countdown__item {
padding: 20px;
}
}
.countdown-V03 .countdown__value {
font-size: clamp(30px, 3vw, 48px);
line-height: clamp(40px, 3.5vw, 60px);
color: var(--primary);
font-weight: 500;
}
.countdown-V03 .countdown__label {
font-weight: 400;
font-size: 14px;
line-height: 20px;
text-transform: uppercase;
}
.countdown__custom {
font-weight: 500;
font-size: 20px;
line-height: 100%;
text-align: center;
text-transform: capitalize;
margin-top: 32px;
min-width: 10px;
}
@media (min-width: 576px) {
.countdown__custom {
min-width: 25px;
}
}
@media (min-width: 1440px) {
.countdown__custom {
line-height: 30px;
}
}
.countdown-V04 .countdown__timer {
display: inline-flex;
gap: 2px;
padding: 16px 32px;
border: 1px solid rgba(255, 255, 255, 0.4);
}
.countdown-V04 .countdown__item {
display: flex;
flex-direction: column;
align-items: center;
gap: 4px;
min-width: 40px;
}
@media (min-width: 1440px) {
.countdown-V04 .countdown__item:last-child {
min-width: 50px;
}
}
@media (min-width: 1600px) {
.countdown-V04 .countdown__item:last-child {
min-width: 60px;
}
}
.countdown-V04 .countdown__value {
font-size: clamp(30px, 3vw, 48px);
line-height: clamp(40px, 3.5vw, 60px);
color: var(--primary);
font-weight: 500;
}
.countdown-V04 .countdown__custom {
margin-top: 9px;
}
.countdown-V04 .countdown__label {
font-weight: 400;
font-size: 14px;
line-height: 20px;
text-transform: uppercase;
}
.countdown-V04.style-2 .countdown__timer {
border-color: rgb(209, 209, 209);
}
.countdown-V04.style-2 .countdown__value {
color: var(--primary) !important;
}
@media (min-width: 1200px) {
.countdown-V04 .countdown__custom {
margin-top: 15px;
}
}
.countdown-V05 .countdown__timer {
display: flex;
align-items: center;
}
.countdown-V05 .countdown__value {
font-size: clamp(24px, 2.5vw, 32px);
line-height: clamp(28px, 3vw, 30px);
letter-spacing: 0;
color: var(--main);
}
.countdown-V05 .countdown__label {
font-size: 14px;
line-height: 10px;
color: var(--main);
letter-spacing: 0;
}
.countdown-V05 .countdown__item {
display: flex;
flex-direction: column;
align-items: center;
gap: 10px;
}
.countdown-V05 .countdown__custom {
font-weight: 400;
font-size: 20px;
line-height: 30px;
letter-spacing: 0;
margin-top: 0;
}
@media (min-width: 576px) {
.countdown-V05 .countdown__custom {
min-width: 23px;
}
}
.countdown-V06 .countdown__timer {
display: flex;
align-items: center;
justify-content: center;
gap: 5px;
}
.countdown-V06 .countdown__value {
font-size: clamp(24px, 2vw, 36px);
line-height: clamp(32px, 2.5vw, 44px);
color: var(--primary);
}
.countdown-V06 .countdown__item {
display: flex;
flex-direction: column;
gap: 4px;
max-width: 120px;
width: 100%;
border: 1px solid #DEDEDE;
padding: 10px 10px;
}
@media (min-width: 576px) {
.countdown-V06 .countdown__timer {
gap: 10px;
}
}
@media (min-width: 992px) {
.countdown-V06 .countdown__timer {
gap: 20px;
}
.countdown-V06 .countdown__item {
padding: 22px 24px;
}
} .pagination-tes {
font-size: 48px;
}
.sw-tes-thumb {
border-radius: 301px;
overflow: hidden;
margin-bottom: 30px;
}
@media (min-width: 1200px) {
.sw-tes-thumb {
margin-bottom: 48px;
}
}
.sw-tes {
text-align: center;
}
.sw-tes .tes-text {
font-weight: normal;
}
.sw-tes .tes-author,
.sw-tes .tes-text {
margin-bottom: 20px;
}
@media (min-width: 1200px) {
.sw-tes .tes-author,
.sw-tes .tes-text {
margin-bottom: 32px;
}
}
.tes_thumb {
max-width: 952px;
width: 100%;
margin: 0 auto;
}
.tes_thumb .sw-tes-thumb {
max-width: 782px;
width: 100%;
margin: 0 auto;
margin-bottom: 48px;
}
.sw-group-pagination {
display: flex;
gap: 16px;
justify-content: center;
}
.tes_thumb-V02 .sw-main-thumb,
.tes_thumb-V02 .sw-thumb {
width: 100%;
}
.tes_thumb-V02 .sw-thumb {
margin-bottom: 30px;
}
@media (min-width: 768px) {
.tes_thumb-V02 .sw-main-thumb {
max-width: 744px;
}
}
.pagination-tes {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.pagination-tes:not(.swiper-button-disabled):hover {
color: var(--primary);
}
.pagination-tes.swiper-button-disabled {
opacity: 0.4;
} .banner_countdown {
display: grid;
}
.banner_countdown > * {
width: 100%;
}
.banner_countdown .bn_image {
height: 100%;
order: -1;
}
.banner_countdown .bn_image img {
height: 100%;
width: 100%;
object-fit: cover;
}
.banner_countdown .bn_content {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
text-align: center;
padding: 60px 15px;
background: linear-gradient(138.03deg, #FFEBD4 23.68%, #E7B992 100%);
height: 100%;
}
@media (min-width: 576px) {
.banner_countdown .bn_content {
padding: 60px;
}
}
@media (min-width: 1440px) {
.banner_countdown .bn_content {
padding: 149px 139px;
}
}
.banner_countdown .heading,
.banner_countdown .countdown-V04 {
margin-bottom: 25px;
}
.banner_countdown .heading .countdown__value,
.banner_countdown .countdown-V04 .countdown__value {
color: var(--primary-2);
}
.banner_countdown .sub-title {
color: var(--main-4);
}
.banner_countdown .text-top {
margin-bottom: 16px;
}
.banner_countdown .title {
margin-bottom: 24px;
}
@media (min-width: 768px) {
.banner_countdown {
display: grid;
grid-template-columns: 1fr 1fr;
}
.banner_countdown .bn_image {
order: unset;
}
}
@media (min-width: 1200px) {
.banner_countdown .heading,
.banner_countdown .countdown-V04 {
margin-bottom: 40px;
}
}
.banner_countdown-v2 .bn_image {
width: 100%;
position: relative;
}
.banner_countdown-v2 .item-square {
position: absolute;
display: block;
width: clamp(100px, 25vw, 322px);
height: clamp(120px, 25vw, 355px);
bottom: 0;
right: 0;
background: rgba(255, 255, 255, 0.02);
backdrop-filter: blur(17px);
cursor: pointer;
}
.banner_countdown-v2 .sub-title {
color: var(--main-4);
}
.banner_countdown-v2 .btn-group {
display: flex;
align-items: center;
gap: 15px;
}
.banner_countdown-v2 .countdown-V03 {
margin-bottom: 30px;
}
.banner_countdown-v2 .countdown-V03 .countdown__item {
min-width: 60px;
}
.banner_countdown-v2 .countdown__timer {
justify-content: flex-start;
}
.banner_countdown-v2 .heading {
display: grid;
gap: 24px;
margin-bottom: 30px;
}
.banner_countdown-v2 .img img {
width: 100%;
height: 100%;
object-fit: cover;
}
.banner_countdown-v3 {
background-color: var(--bg-24);
display: flex;
gap: 30px;
align-items: center;
padding: 60px 15px;
}
.banner_countdown-v3 .bn_content {
text-align: center;
}
.banner_countdown-v3 .text-top {
margin-bottom: 16px;
}
.banner_countdown-v3 .title {
font-size: clamp(24px, 2.8vw, 32px);
line-height: clamp(28px, 3.5vw, 42px);
margin-bottom: 12px;
}
.banner_countdown-v3 .sub-title {
margin-bottom: 25px;
}
.banner_countdown-v3 .countdown__timer {
border-color: var(--primary);
}
.banner_countdown-v3 .countdown__value {
color: var(--main);
}
@media (min-width: 1200px) {
.banner_countdown-v3 {
padding: 60px;
gap: 60px;
}
.banner_countdown-v3 .sub-title {
margin-bottom: 40px;
}
}
@media (min-width: 1440px) {
.banner_countdown-v3 {
padding: 70px 68px 69px 68px;
gap: 104px;
}
}
@media (max-width: 767px) {
.banner_countdown-v3 {
flex-wrap: wrap;
justify-content: center;
}
}
.cls_videoV01 {
overflow: hidden;
position: relative;
font-family: "Jost", sans-serif;
height: 486px;
}
.cls_videoV01 .hover-video {
height: 486px;
}
.cls_videoV01 img {
width: 100%;
height: 100%;
object-fit: cover;
}
.cls_videoV01 .poster {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
z-index: 2;
transition: opacity 0.5s ease;
cursor: pointer;
}
.cls_videoV01 .poster.hide {
opacity: 0;
pointer-events: none;
}
.cls_videoV01 .cls-content {
position: absolute;
bottom: 0px;
right: 0px;
left: 0px;
z-index: 3;
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
background-color: var(--bg-6);
backdrop-filter: blur(10px);
padding: 15px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.cls_videoV01 .box-product {
display: flex;
align-items: center;
gap: 12px;
}
.cls_videoV01 .img-product {
overflow: hidden;
max-width: 82px;
}
.cls_videoV01 .img-product img {
aspect-ratio: 1;
}
.cls_videoV01 .info-product {
display: grid;
gap: 10px;
}
@media (min-width: 1200px) {
.cls_videoV01 {
height: 814px;
aspect-ratio: 0.5970515971;
}
.cls_videoV01 .cls-content {
padding: 16px;
}
.cls_videoV01 .cls-content,
.cls_videoV01 .box-product {
gap: 24px;
}
.cls_videoV01 .hover-video {
height: 814px;
}
}
.banner_V01 {
display: flex;
flex-wrap: wrap;
}
.banner_V01 > * {
width: 100%;
}
.banner_V01 .bn-image {
overflow: hidden;
}
.banner_V01 .bn-image img {
min-height: 300px;
width: 100%;
height: 100%;
object-fit: cover;
animation: tf-animate-zoom-in-out 30s linear infinite;
}
.banner_V01 .bn-content {
display: flex;
flex-direction: column;
justify-content: center;
padding: 60px 15px;
}
.banner_V01 .caption,
.banner_V01 .title,
.banner_V01 .sub-title {
margin-bottom: 15px;
}
@media (min-width: 768px) {
.banner_V01 .bn-content {
padding: 60px 30px;
}
.banner_V01 > * {
width: 50%;
}
}
@media (min-width: 992px) {
.banner_V01 .bn-content {
padding: 60px;
}
}
@media (min-width: 1200px) {
.banner_V01 .caption {
margin-bottom: 16px;
}
.banner_V01 .title {
margin-bottom: 24px;
}
.banner_V01 .sub-title {
margin-bottom: 20px;
}
.banner_V01 .bn-content {
padding: 58px 102px;
}
.banner_V01 .bn-content > * {
max-width: 447px;
width: 100%;
}
.banner_V01 .form-email {
max-width: 389px;
}
}
.banner_V02 {
display: flex;
flex-wrap: wrap;
}
.banner_V02 > * {
width: 100%;
}
.banner_V02 .bn-image-blur {
display: flex;
align-items: center;
justify-content: center;
padding: 30px;
position: relative;
overflow: hidden;
}
.banner_V02 .bn-image-blur::after {
content: "";
backdrop-filter: blur(20px);
background: var(--black-2);
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 1;
}
.banner_V02 .bn-image-blur .span-image-blur {
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 0;
position: absolute;
background-size: cover;
background-position: center;
animation: tf-animate-zoom-in-out 30s linear infinite;
}
.banner_V02 .blur {
position: relative;
z-index: 2;
overflow: hidden;
}
.banner_V02 .blur img {
max-height: 300px;
animation: tf-animate-zoom-in-out 30s linear infinite;
}
.banner_V02 .bn-content {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
padding: 60px 15px;
text-align: center;
}
.banner_V02 .caption,
.banner_V02 .title {
margin-bottom: 15px;
}
.banner_V02 .sub-title {
margin-bottom: 20px;
}
@media (min-width: 768px) {
.banner_V02 > * {
width: 50%;
}
.banner_V02 .bn-image-blur {
padding: 60px;
}
.banner_V02 .blur {
max-width: 482px;
width: 100%;
}
.banner_V02 .blur img {
max-height: unset;
}
}
@media (min-width: 992px) {
.banner_V02 .bn-content {
padding: 60px;
}
}
@media (min-width: 1200px) {
.banner_V02 .bn-image-blur {
padding: 93px;
}
.banner_V02 .caption {
margin-bottom: 16px;
}
.banner_V02 .title {
margin-bottom: 24px;
}
.banner_V02 .sub-title {
margin-bottom: 40px;
}
}
@media (min-width: 1440px) {
.banner_V02 .bn-content {
padding: 138px;
}
}
.banner_V03 {
display: flex;
flex-wrap: wrap;
gap: 30px;
}
.banner_V03 > * {
width: 100%;
}
.banner_V03 .bn-content {
position: sticky;
top: 100px;
margin-bottom: auto;
}
.banner_V03 .bn-content > *:not(:last-child) {
margin-bottom: 24px;
}
@media (min-width: 768px) {
.banner_V03 > * {
width: calc(50% - 15px);
}
}
.banner_V04 {
padding: 60px 15px;
position: relative;
overflow: hidden;
}
.banner_V04 .background-banner {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
animation: tf-animate-zoom-in-out 40s linear infinite;
z-index: 0;
}
.banner_V04 .background-banner img {
width: 100%;
height: 100%;
}
.banner_V04 .bn-content {
padding: 30px 15px;
backdrop-filter: blur(24px);
background: rgba(1, 1, 1, 0.3019607843);
max-width: 1150px;
margin: auto;
width: 100%;
text-align: center;
position: relative;
z-index: 1;
}
.banner_V04 .title {
margin-bottom: 30px;
}
@media (min-width: 768px) {
.banner_V04 {
padding: 60px 30px;
}
.banner_V04 .bn-content {
padding: 60px 30px;
}
}
@media (min-width: 992px) {
.banner_V04 {
padding: 60px;
}
.banner_V04 .bn-content {
padding: 60px;
}
}
@media (min-width: 1200px) {
.banner_V04 {
padding: 74px;
}
.banner_V04 .title {
margin-bottom: 50px;
}
}
@media (min-width: 1440px) {
.banner_V04 .bn-content {
padding: 93px 74px;
}
}
.banner_V05 {
display: flex;
justify-content: center;
align-items: center;
gap: 30px;
flex-wrap: wrap;
}
.banner_V05 > * {
width: 100%;
}
.banner_V05 .title {
margin-bottom: 16px;
}
.banner_V05 .sub-title {
margin-bottom: 30px;
}
@media (min-width: 768px) {
.banner_V05 {
flex-wrap: nowrap;
}
}
@media (min-width: 1200px) {
.banner_V05 {
gap: 100px;
}
.banner_V05 .bn-content {
max-width: 432px;
}
.banner_V05.style-2 .bn-content {
max-width: 585px;
}
.banner_V05.style-2 .title {
margin-bottom: 24px;
}
.banner_V05.style-2 .sub-title {
margin-bottom: 60px;
}
.banner_V05 .sub-title {
margin-bottom: 49px;
}
}
@media (min-width: 1440px) {
.banner_V05 {
gap: 154px;
}
.banner_V05.style-2 {
gap: 100px;
}
}
.shape-image {
position: relative;
}
.shape-image .image {
max-width: 546px;
width: 100%;
border-radius: 50%;
overflow: hidden;
position: relative;
z-index: 3;
}
.shape-image .image img {
aspect-ratio: 1;
width: 100%;
object-fit: cover;
}
.shape-image .line-circle {
display: block;
max-width: 546px;
width: 100%;
height: 100%;
border: 1px solid var(--primary);
border-radius: 50%;
position: absolute;
right: 0;
top: 0;
animation: sliderShape 3s linear infinite;
z-index: 2;
}
.shape-image .img-ic-star {
position: absolute;
top: 3.7%;
right: 11%;
z-index: 2;
}
@media (min-width: 1200px) {
.shape-image {
max-width: 705px;
width: 100%;
height: 546px;
}
}
.banner_V06 {
position: relative;
overflow: hidden;
padding: 60px 0px;
}
.banner_V06 .caption {
margin-bottom: 10px;
}
.banner_V06 .title {
margin-bottom: 17px;
}
.banner_V06 .sub-title {
margin-bottom: 30px;
}
.banner_V06 .bn-image {
margin-bottom: 30px;
}
.banner_V06 .bn-image img {
object-fit: cover;
height: 100%;
width: 100%;
min-height: 300px;
object-position: left;
}
.banner_V06 .bn-content {
position: relative;
z-index: 2;
display: flex;
margin: 0px -15px;
}
@media (min-width: 768px) {
.banner_V06 .bn-image {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
.banner_V06 .bn-content {
margin: 0;
}
.banner_V06 .bn-image {
padding: 0;
}
.banner_V06 .bn-image img {
object-position: unset;
}
}
@media (min-width: 992px) {
.banner_V06 {
padding: 100px 0px;
}
}
@media (min-width: 1200px) {
.banner_V06 {
padding: 169px 0px;
}
.banner_V06 .sub-title {
margin-bottom: 48px;
}
.banner_V06 .wrap {
padding-left: 81px;
}
}
@media (max-width: 767px) {
.banner_V06 {
padding: 0;
}
}
.banner_V07 .bn-image-text {
position: relative;
}
.banner_V07 .bn-image-text .image {
height: 100%;
}
.banner_V07 .bn-image-text .image img {
height: 100%;
width: 100%;
object-fit: cover;
min-height: 350px;
}
.banner_V07 .bn-image-text .caption {
margin-bottom: 9px;
}
.banner_V07 .bn-image-text .content {
position: absolute;
left: 30px;
top: 60px;
}
@media (min-width: 992px) {
.banner_V07 .bn-image-text .content {
left: 60px;
}
}
@media (min-width: 1440px) {
.banner_V07 .bn-image-text .content {
top: 100px;
left: 100px;
}
}
.banner_V07 .bn-image-text .title {
margin-bottom: 50px;
}
.banner_V07 .wrap {
display: flex;
align-items: center;
justify-content: center;
background-color: rgba(40, 28, 6, 0.8);
padding: 60px 15px;
}
@media (min-width: 768px) {
.banner_V07 {
display: flex;
}
.banner_V07 > * {
width: 50%;
}
}
@media (min-width: 1200px) {
.banner_V07 .tf-swiper {
max-width: 403px;
width: 100%;
}
}
.banner_promo {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
}
.banner_promo .title {
margin-bottom: 15px;
}
.banner_promo .sub-title {
margin-bottom: 25px;
}
@media (min-width: 1200px) {
.banner_promo .title {
margin-bottom: 20px;
}
.banner_promo .sub-title {
margin-bottom: 40px;
}
}
.banner_text {
display: flex;
align-items: center;
justify-content: center;
gap: 30px;
flex-wrap: wrap;
text-align: center;
}
.banner_text.style-2 {
max-width: 1397px;
width: 100%;
margin: 0 auto;
}
.banner_text.style-2 .tf-btn {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.banner_text.style-2 .tf-btn svg,
.banner_text.style-2 .tf-btn path {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.banner_text.style-2 .tf-btn:hover {
border-color: var(--secondary) !important;
}
.banner_text.style-2 .tf-btn:hover path {
fill: var(--secondary);
}
.banner_text .text-color-change {
margin-bottom: 35px;
}
@media (min-width: 1200px) {
.banner_text {
gap: 115px;
}
.banner_text.style-2 {
gap: 120px;
}
}
@media (min-width: 1600px) {
.banner_text:not(.style-2) {
padding-right: 95px;
justify-content: space-between;
}
}
.banner_lookbook .image-left {
margin-bottom: 30px;
position: relative;
}
@media (min-width: 768px) {
.banner_lookbook {
display: flex;
gap: 30px;
}
.banner_lookbook .image-left {
width: calc(60% - 15px);
margin-bottom: 0;
}
.banner_lookbook .image {
height: 100%;
}
.banner_lookbook .image img {
width: 100%;
height: 100%;
object-fit: cover;
}
.banner_lookbook .product-right {
width: calc(40% - 15px);
}
}
@media (min-width: 1200px) {
.banner_lookbook .s-title {
padding-left: 15px;
}
.banner_lookbook .sw-look {
margin-right: -15px;
}
.banner_lookbook .image-left {
max-width: 710px;
width: 100%;
}
.banner_lookbook .product-right {
max-width: 759px;
width: 100%;
}
}
@media (min-width: 1440px) {
.banner_lookbook {
gap: 49px;
}
}
.lookbook-item {
position: absolute;
}
.lookbook-item.position1 {
top: 20%;
left: 54%;
}
.lookbook-item.position2 {
bottom: 21%;
right: 41%;
} .s-title {
margin-bottom: 30px;
font-weight: normal;
text-transform: uppercase;
}
@media (min-width: 1200px) {
.s-title {
margin-bottom: 48px;
}
}
.s-title-2 {
font-size: clamp(34px, 5.5vw, 76px);
line-height: clamp(42px, 6vw, 84px);
margin-bottom: 40px;
}
.s-title-2 span {
color: var(--primary-2);
font-style: italic;
}
@media (min-width: 992px) {
.s-title-2 {
margin-bottom: 48px;
}
}
@media (min-width: 1440px) {
.s-title-2 {
margin-bottom: 113px;
}
}
.s-sub-title {
color: var(--main-4);
}
.sect-top {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 10px 15px;
margin-bottom: 30px;
}
.sect-top .s-title {
margin-bottom: 0;
}
.sect-top.center {
flex-direction: column;
gap: 24px;
}
@media (min-width: 1200px) {
.sect-top {
margin-bottom: 30px;
}
}
.sect-border {
padding: 0px 15px 30px;
border: 1px solid var(--primary);
}
.sect-border .sect-head {
display: flex;
justify-content: center;
}
.sect-border .s-title {
padding: 10px 0px;
margin-bottom: 7px;
background-color: var(--white);
position: relative;
text-align: center;
}
.sect-border .s-title::after, .sect-border .s-title::before {
content: "\e905";
font-family: "vemus";
position: absolute;
top: 50%;
transform: translateY(-50%);
font-size: 18px;
color: var(--primary);
}
.sect-border .s-title::before {
left: -20px;
}
.sect-border .s-title::after {
right: -20px;
}
@media (min-width: 576px) {
.sect-border .s-title {
transform: translateY(-50%);
padding: 10px 42px;
}
.sect-border .s-title::before {
left: 0;
}
.sect-border .s-title::after {
right: 0;
}
}
@media (min-width: 992px) {
.sect-border {
padding: 0px 60px 60px;
}
}
@media (min-width: 1200px) {
.sect-border {
margin-top: 40px;
}
}
@media (min-width: 1440px) {
.sect-border {
padding: 0px 97px 78px;
}
}
@media (max-width: 575px) {
.sect-border {
padding-top: 20px;
}
}
.slide_wrap .swiper,
.slide_wrap .wrap {
width: 100%;
}
.slide_wrap .wrap {
padding-left: 30px;
}
@media (min-width: 1200px) {
.slide_wrap {
display: flex;
}
.slide_wrap .wrap {
padding-left: 48px;
}
.slide_wrap .title-left {
display: block;
}
.slide_wrap .title {
writing-mode: sideways-lr;
text-orientation: mixed;
}
}
@media (max-width: 1199px) {
.slide_wrap .wrap {
padding: 0 !important;
}
.slide_wrap .title-left {
margin-bottom: 30px;
}
} @media (min-width: 992px) {
section .box_image--V01.style-2 .image {
height: 100%;
}
}
@media (max-width: 991px) {
section .box_image--V01.style-2, section .box_image--V01.style-3 {
margin-bottom: 30px;
}
section .box_image--V01.style-3 .image img {
max-height: 400px;
}
}
.parallaxie {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
.cls-wrap {
display: flex;
flex-wrap: wrap;
gap: 30px;
justify-content: center;
}
@media (min-width: 1200px) {
.cls-wrap {
gap: 30px 70px;
}
}
@media (min-width: 1600px) {
.cls-wrap {
gap: 54px 100px;
justify-content: start;
}
.cls-wrap > *:nth-child(1) {
padding-left: 29px;
}
.cls-wrap > *:nth-child(3) {
padding-left: 128px;
}
.cls-wrap > *:nth-child(4) {
padding-left: 40px;
}
.cls-wrap > *:nth-child(5) {
padding-left: 81px;
}
}
@media (max-width: 767px) {
.cls-wrap {
gap: 20px;
overflow-x: scroll;
flex-wrap: nowrap;
justify-content: start;
}
.cls-wrap .box_collection--V02 {
flex-wrap: nowrap;
white-space: nowrap;
}
}
.flat-animate-tab {
overflow: hidden;
}
.flat-animate-tab .tab-content {
position: relative;
}
.flat-animate-tab .tab-pane {
display: block;
pointer-events: none;
opacity: 0;
visibility: hidden;
position: absolute;
z-index: 1;
top: 0;
left: 0;
right: 0;
-webkit-transform: translateY(30px);
-ms-transform: translateY(30px);
transform: translateY(30px);
transition-timing-function: ease-in;
transition-duration: 0.2s;
}
.flat-animate-tab .tab-pane.active {
pointer-events: auto;
opacity: 1;
visibility: visible;
position: relative;
z-index: 2;
-webkit-transform: none;
-ms-transform: none;
transform: none;
transition-timing-function: ease-out;
transition-duration: 0.3s;
transition-delay: 0.3s;
}
.flat-animate-tab-2 {
overflow: hidden;
}
.flat-animate-tab-2 .tab-content {
position: relative;
}
.flat-animate-tab-2 .tab-pane {
display: block;
pointer-events: none;
opacity: 0;
visibility: hidden;
position: absolute;
z-index: 1;
top: 0;
left: 0;
right: 0;
transition-timing-function: ease-in;
transition-duration: 0.2s;
}
.flat-animate-tab-2 .tab-pane.active {
pointer-events: auto;
opacity: 1;
visibility: visible;
position: relative;
z-index: 2;
-webkit-transform: none;
-ms-transform: none;
transform: none;
transition-timing-function: ease-out;
transition-duration: 0.3s;
transition-delay: 0.3s;
}
.tf-btn-tab {
padding: 10px 0px 9px;
border: 1px solid transparent;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
display: flex;
align-items: center;
justify-content: space-between;
cursor: pointer;
}
.tf-btn-tab .text {
font-weight: normal;
display: flex;
gap: 4px;
align-items: start;
}
.tf-btn-tab .count {
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: -2%;
}
.tf-btn-tab .icon {
font-size: clamp(20px, 2vw, 28px);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
transform: scale(0);
}
.tf-btn-tab.active {
border-bottom: 1px solid var(--line);
color: var(--primary);
}
.tf-btn-tab.active .icon {
transform: scale(1);
color: var(--primary);
}
.tf-btn-tab.active .icon:hover {
transform: rotate(45deg);
}
@media (min-width: 1200px) {
.tf-btn-tab {
padding: 17px 0px 15px;
}
}
.cls-tablist {
display: flex;
align-items: center;
gap: 30px;
overflow: visible;
justify-content: center;
flex-wrap: wrap-reverse;
}
.cls-tablist .shape-image {
margin-left: auto;
display: block;
}
.cls-tablist .tab-cls {
width: 100%;
}
.cls-tablist .tab-content {
width: 100%;
}
@media (min-width: 768px) {
.cls-tablist {
flex-wrap: nowrap;
}
.cls-tablist .tab-cls {
max-width: 581px;
}
}
@media (min-width: 992px) {
.cls-tablist {
gap: 50px;
}
}
@media (min-width: 1200px) {
.cls-tablist {
gap: 100px;
}
}
@media (min-width: 1440px) {
.cls-tablist {
gap: 172px;
}
.cls-tablist .tab-cls {
padding-left: 60px;
max-width: 641px;
}
}
.product-tablist .tab-prd {
display: flex;
align-items: center;
overflow: auto;
gap: 20px;
}
.product-tablist .btn-tab {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
padding: 6px 0px 4px;
border-bottom: 1px solid transparent;
font-weight: normal;
text-transform: uppercase;
}
.product-tablist .btn-tab.active {
color: var(--primary);
border-bottom: 1px solid var(--primary);
}
@media (min-width: 1200px) {
.product-tablist .tab-prd {
gap: 40px;
}
}
.promo-circle {
display: flex;
align-items: center;
justify-content: center;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
flex-direction: column;
text-align: center;
border: 1px solid var(--line);
border-radius: 50%;
width: 100%;
max-width: 100%;
max-height: 100%;
aspect-ratio: 1;
padding: 20px;
}
.promo-circle .image {
border-radius: 75px;
overflow: hidden;
max-width: 111px;
}
.promo-circle .image img {
width: 100%;
object-fit: cover;
}
.promo-circle .title,
.promo-circle .image,
.promo-circle .sub-title {
margin-bottom: 16px;
}
.promo-circle .sub-title {
color: #646464;
}
.promo-circle .title {
font-weight: normal;
}
.promo-circle .tf-btn i {
padding-bottom: 2px;
font-size: 12px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.promo-circle .tf-btn:hover {
background-color: transparent;
}
.promo-circle:hover {
border-color: var(--primary);
}
.promo-circle:hover .tf-btn {
color: var(--primary);
}
.promo-circle:hover .tf-btn i {
transform: rotate(45deg);
}
@media (min-width: 1200px) {
.promo-circle {
padding: 50px;
max-width: 506px;
max-height: 506px;
}
.promo-circle .image,
.promo-circle .sub-title {
margin-bottom: 24px;
}
}
.wg-category {
display: flex;
flex-direction: column;
gap: 10px;
position: relative;
overflow: hidden;
}
.wg-category img {
object-fit: cover;
}
.wg-category .btn-view {
padding-top: 10px;
font-weight: normal;
}
@media (min-width: 1200px) {
.wg-category .btn-view {
position: absolute;
bottom: 0;
left: 0;
right: 0;
background-color: var(--white);
transform: translateY(20px);
opacity: 0;
visibility: hidden;
}
.wg-category:hover .btn-view {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
}
@media (max-width: 1199px) {
.wg-category {
height: 100%;
}
.wg-category .image {
height: 100%;
}
.wg-category img {
height: 100%;
}
}
@media (max-width: 575px) {
.wg-category img {
max-height: 350px;
aspect-ratio: 1;
}
}
.btn-view {
display: flex;
align-items: center;
justify-content: space-between;
}
.btn-view .icon {
font-size: clamp(20px, 2.2vw, 30px);
}
.category-grid > * {
display: flex;
flex-direction: column;
gap: 30px;
}
@media (min-width: 576px) {
.category-grid .item_3 {
flex-direction: row;
grid-column: 1/-1;
}
.category-grid .item_3 > * {
width: calc(100% - 30px);
}
}
@media (min-width: 1200px) {
.category-grid .item_3 {
flex-direction: column;
grid-column: unset;
}
.category-grid .item_3 > * {
width: 100%;
}
}
.wg-cls {
display: flex;
flex-direction: column;
gap: 20px;
}
.wg-cls .title {
font-weight: normal;
}
.wg-cls .name {
display: flex;
align-items: start;
font-weight: normal;
gap: 4px;
}
.wg-cls .image {
min-height: 250px;
}
@media (max-width: 1199px) {
.wg-cls .image {
min-height: unset;
}
}
.wg-cls .content {
display: flex;
flex-direction: column;
align-items: start;
}
@media (min-width: 1200px) {
.wg-cls .content {
gap: 16px;
}
}
.s-brand-intro {
overflow: hidden;
}
.s-brand-intro .brand-intro_image {
padding: 12px;
border: 1px solid var(--primary);
border-radius: 331px 331px 0 0;
position: relative;
width: 100%;
margin-bottom: 30px;
}
.s-brand-intro .intro-photo {
border-radius: 331px 331px 0 0;
}
.s-brand-intro .brand-box {
position: absolute;
bottom: -66px;
right: -60px;
max-width: clamp(280px, 80vw, 460px);
width: 100%;
transform: rotate(-17.36deg);
pointer-events: none;
}
.s-brand-intro .brand-intro_subtitle,
.s-brand-intro .brand-intro_title {
margin-bottom: 15px;
text-transform: uppercase;
font-weight: normal;
}
.s-brand-intro .brand-intro_text {
color: var(--main-4);
}
.s-brand-intro .br-line {
background-color: var(--line);
display: block;
margin-top: 20px;
margin-bottom: 20px;
}
.s-brand-intro .brand-intro_author {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 15px;
}
.s-brand-intro .author-info {
display: flex;
align-items: center;
flex-shrink: 0;
gap: 15px;
}
.s-brand-intro .img-author {
max-width: 64px;
width: 100%;
aspect-ratio: 1;
border-radius: 50%;
}
@media (min-width: 768px) {
.s-brand-intro .brand-intro_image {
max-width: 485px;
}
}
@media (min-width: 1200px) {
.s-brand-intro .brand-box {
top: 43%;
left: 50%;
right: unset;
bottom: unset;
}
.s-brand-intro .br-line {
margin-top: 40px;
margin-bottom: 40px;
}
.s-brand-intro .brand-intro_subtitle,
.s-brand-intro .brand-intro_title {
margin-bottom: 24px;
}
.s-brand-intro .author-info {
gap: 20px;
}
}
@media (min-width: 1440px) {
.s-brand-intro .brand-intro_subtitle,
.s-brand-intro .brand-intro_title,
.s-brand-intro .brand-intro_text,
.s-brand-intro .br-line,
.s-brand-intro .brand-intro_author {
margin-left: -30px;
}
}
.s-established {
text-align: center;
}
.s-established .established-title {
margin-bottom: 24px;
text-transform: uppercase;
font-weight: normal;
}
.s-established .established-description,
.s-established .established-summary {
color: var(--main-4);
}
.s-core-values .values-grid {
gap: 0;
}
.s-core-values .core-values-image {
grid-column: 1/-1;
max-height: 350px;
}
.s-core-values .core-values-image img {
width: 100%;
height: 100%;
object-fit: cover;
}
.s-core-values .br-line {
max-width: 60px;
width: 100%;
display: block;
margin: 15px 0px;
background: var(--main);
}
.s-core-values .value-box {
background-color: var(--bg-23);
padding: 50px 15px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
flex-direction: column;
}
.s-core-values .value-box.hightlight {
background-color: var(--primary);
color: var(--white);
}
.s-core-values .value-box.hightlight .br-line {
background-color: var(--white);
}
.s-core-values .value-title,
.s-core-values .value-description {
font-weight: normal;
}
.s-core-values .value-description {
line-height: 26px;
letter-spacing: 0;
font-family: "Poppins", sans-serif;
}
@media (min-width: 1200px) {
.s-core-values .br-line {
margin: 32px 0px;
}
.s-core-values .core-values-image {
grid-column: unset;
grid-row: span 2;
max-height: unset;
}
}
@media (min-width: 1440px) {
.s-core-values .value-box {
padding: 64px 32px;
}
}
.feature-intro .visual-content {
width: 100%;
position: relative;
aspect-ratio: 1;
margin-bottom: 30px;
}
.feature-intro .img-visual {
border-radius: 50%;
}
.feature-intro .feature-title {
margin-bottom: 15px;
font-weight: normal;
}
.feature-intro .feature-subtitle {
margin-bottom: 20px;
}
.feature-intro .feature-subtitle {
color: var(--main-4);
}
.feature-intro .brand-box {
position: absolute;
bottom: -11%;
left: -10%;
max-width: clamp(160px, 40vw, 401px);
}
@media (min-width: 768px) {
.feature-intro .visual-content {
max-width: 486px;
margin-left: auto;
}
.feature-intro .brand-box {
bottom: -26%;
left: -36%;
}
}
@media (min-width: 1200px) {
.feature-intro .feature-title {
margin-bottom: 24px;
}
.feature-intro .feature-subtitle {
margin-bottom: 40px;
}
}
.wg-map {
padding: 0px 15px;
margin-bottom: 30px;
}
@media (min-width: 1200px) {
.wg-map {
margin-bottom: 51px;
padding: 0px 30px;
}
}
@media (min-width: 1440px) {
.wg-map {
padding: 0px 60px;
}
}
.s-contact-us .title,
.s-contact-us .sub-title {
margin-bottom: 16px;
}
.s-contact-us .store-info-list {
margin-bottom: 20px;
}
.s-contact-us .left-col {
margin-bottom: 30px;
}
@media (min-width: 1200px) {
.s-contact-us .title,
.s-contact-us .sub-title {
margin-bottom: 32px;
}
.s-contact-us .store-info-list {
margin-bottom: 39px;
gap: 16px;
}
}
.tf-table-compare {
overflow-x: auto;
max-width: 1441px;
width: 100%;
margin: 0px auto;
}
.tf-table-compare::-webkit-scrollbar {
width: 4px;
height: 4px;
}
.tf-table-compare::-webkit-scrollbar-thumb {
background-color: var(--primary);
cursor: grab;
}
.tf-table-compare table {
width: 100%;
}
.tf-table-compare thead {
background-color: unset;
}
.tf-table-compare tbody tr:nth-child(even) {
background-color: unset;
}
.tf-table-compare tbody tr:nth-child(odd) {
background-color: #F4F4F4;
}
.tf-table-compare th,
.tf-table-compare td {
border: 1px solid var(--line-8);
}
.tf-table-compare .compare-item {
text-align: center;
}
.tf-table-compare .compare-col {
vertical-align: middle;
}
.tf-table-compare .item_image {
aspect-ratio: 1;
position: relative;
margin-bottom: 20px;
}
.tf-table-compare .item_image img {
width: 100%;
height: 100%;
object-fit: cover;
}
.tf-table-compare .item_name {
margin-bottom: 10px;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
display: -webkit-box;
overflow: hidden;
}
.tf-table-compare .item_price {
margin-bottom: 24px;
}
.tf-table-compare .remove {
position: absolute;
top: 10px;
right: 10px;
width: 30px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
font-size: 9px;
border: 1px solid #CACACA;
background-color: var(--white);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
cursor: pointer;
}
.tf-table-compare .remove:hover {
background-color: var(--primary);
color: var(--white);
}
.tf-table-compare .compare-title {
font-weight: 500;
letter-spacing: 0;
}
.tf-table-compare .compare_stock {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
color: #91C283;
}
.tf-table-compare .compare_stock.out-stock {
color: #E46565;
}
.tf-table-compare .compare-value {
text-align: center;
}
.tf-table-compare .compare-col {
max-width: 240px;
min-width: 240px;
}
.tf-table-compare .icon {
display: inline-flex;
}
@media (min-width: 768px) {
.tf-table-compare .compare-col {
min-width: 300px;
}
}
@media (min-width: 1200px) {
.tf-table-compare td,
.tf-table-compare th {
padding: 18px 20px 21px 20px;
}
.tf-table-compare .compare-head {
padding: 30px 20px;
}
.tf-table-compare .compare-col {
min-width: 360px;
}
}
@media (max-width: 575px) {
.tf-table-compare td:first-child,
.tf-table-compare th:first-child {
min-width: 120px;
}
}
.sb-contact {
padding: 20px 15px;
background-color: #FFF6E4;
width: 100%;
}
.sb-contact .title,
.sb-contact .sub-title {
margin-bottom: 20px;
}
.sb-contact .group-btn {
display: flex;
align-items: center;
gap: 15px;
flex-wrap: wrap;
}
.sb-contact .group-btn > * {
width: 100%;
}
@media (min-width: 768px) {
.sb-contact {
max-width: 501px;
}
}
@media (min-width: 1200px) {
.sb-contact {
padding: 40px;
}
.sb-contact .title {
margin-bottom: 32px;
}
.sb-contact .sub-title {
margin-bottom: 44px;
}
}
@media (max-width: 767px) {
.sb-contact {
position: unset !important;
}
}
.s-faq {
display: flex;
align-items: start;
gap: 50px 30px;
flex-wrap: wrap;
}
.s-faq .faq-list {
width: 100%;
}
@media (min-width: 1200px) {
.s-faq {
gap: 60px;
}
}
@media (min-width: 1440px) {
.s-faq {
gap: 120px;
}
}
.name-faq {
margin-bottom: 20px;
font-weight: normal;
}
@media (min-width: 1200px) {
.name-faq {
margin-bottom: 40px;
}
}
.main-legal {
max-width: 1008px;
width: 100%;
margin: 0 auto;
display: grid;
gap: 30px;
}
.main-legal .legal-title {
font-weight: normal;
margin-bottom: 24px;
}
.main-legal .legal-sub {
color: var(--main-6);
}
@media (min-width: 1200px) {
.main-legal {
gap: 52px;
}
}
@media (max-width: 767px) {
.main-legal .legal-title {
margin-bottom: 15px;
}
}
.box-delivery .text {
margin-bottom: 20px;
}
@media (min-width: 1200px) {
.box-delivery {
max-width: 456px;
width: 100%;
padding-bottom: 16px;
}
.box-delivery .text {
margin-bottom: 35px;
}
}
.tf-wishlist-empty {
grid-column: 1/-1;
width: 100%;
}
.tf-wishlist-empty .text-notice {
margin-bottom: 32px;
font-weight: normal;
letter-spacing: 0;
}
.tf-wishlist-empty .btn-back-shop {
font-weight: 500;
}
.wg-404 .image {
overflow: hidden;
}
.wg-404 > * {
width: 100%;
}
.wg-404 img {
width: 100%;
height: 100%;
object-fit: cover;
}
.wg-404 .heading {
font-weight: normal;
text-transform: uppercase;
margin-bottom: 15px;
}
.wg-404 .sub-head {
color: #646464;
margin-bottom: 30px;
}
.wg-404 .content {
padding: 60px 15px;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
@media (min-width: 992px) {
.wg-404 .content {
padding: 60px 30px;
}
}
@media (min-width: 1200px) {
.wg-404 .content {
padding: 60px;
}
.wg-404 .content > * {
max-width: 705px;
}
.wg-404 .sub-head {
margin-bottom: 48px;
}
.wg-404 .heading {
margin-bottom: 24px;
}
}
.error404 .tf-page-title,
.error404 .footer_background {
display: none !important;
}
.error404 .main-header-absolute .header-absolute,
.error404 .main-header-absolute .header-absolute-2,
.error404 .main-header-absolute .header-default.tf-header {
margin-bottom: 0px;
}
.error404 .tf-header {
background: #fff !important;
border-bottom: 1px solid #EBEBEB;
}
.wg-coming {
padding: 60px 0px;
position: relative;
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
}
.wg-coming .image {
position: absolute;
top: 0;
left: 0;
right: 0;
overflow: hidden;
bottom: 0;
z-index: 1;
height: 100%;
width: 100%;
}
.wg-coming .image img {
width: 100%;
height: 100%;
object-fit: cover;
animation: tf-animate-zoom-in-out 30s linear infinite;
}
.wg-coming .content {
position: relative;
z-index: 2;
max-width: 756px;
width: 100%;
margin: 0px auto;
padding: 30px 15px;
text-align: center;
background: rgba(255, 255, 255, 0.8509803922);
backdrop-filter: blur(34px);
}
.wg-coming .head {
font-weight: normal;
text-transform: uppercase;
margin-bottom: 15px;
}
.wg-coming .sub-head {
color: var(--main-6);
}
.wg-coming .form-notify {
max-width: 499px;
width: 100%;
margin: 0 auto;
}
.wg-coming .sub-head,
.wg-coming .countdown-V06,
.wg-coming .form-notify {
margin-bottom: 30px;
}
@media (min-width: 1200px) {
.wg-coming {
padding: 80px 0px;
}
.wg-coming .head {
margin-bottom: 24px;
}
.wg-coming .sub-head {
margin-bottom: 40px;
}
.wg-coming .countdown-V06,
.wg-coming .form-notify {
margin-bottom: 55px;
}
.wg-coming .content {
padding: 80px 15px;
}
}
@media (min-width: 1440px) {
.wg-coming {
padding: 110px 0px;
}
.wg-coming .sub-head {
margin-bottom: 60px;
}
.wg-coming .form-notify {
margin-bottom: 92px;
}
}
.table-shop-cart::-webkit-scrollbar {
width: 4px;
height: 4px;
}
.table-shop-cart::-webkit-scrollbar-thumb {
background-color: var(--black);
height: 4px;
}
.table-shop-cart .order_price,
.table-shop-cart .order_subtotal {
font-weight: 400;
font-size: 18px;
line-height: 28px;
letter-spacing: 0px;
}
.table-shop-cart .order_quantity {
display: flex;
align-items: center;
gap: 10px;
}
.table-shop-cart tr {
border-bottom: 1px solid var(--line-8);
}
@media (min-width: 1200px) {
.table-shop-cart .order_quantity {
gap: 24px;
}
.table-shop-cart td:nth-child(2), .table-shop-cart td:nth-child(4), .table-shop-cart td:nth-child(3) {
padding-top: 24px;
padding-bottom: 24px;
}
.table-shop-cart td:nth-child(3) {
padding-left: 0;
padding-right: 0;
}
.table-shop-cart td:last-child,
.table-shop-cart th:last-child {
min-width: unset;
}
}
.s-shop-cart .left {
display: grid;
gap: 20px;
margin-bottom: 30px;
}
.s-shop-cart .tes-slider {
padding: 30px 15px;
background: var(--linear-4);
}
.s-shop-cart .checkout-sidebar {
margin-bottom: 24px;
}
.s-shop-cart .checkout-sidebar .form-checkout-sidebar {
margin-bottom: 0;
}
.s-shop-cart .checkout-sidebar .form-checkout-sidebar .form-content {
margin-bottom: 0;
}
.s-shop-cart .checkout-sidebar .cart-subtotal .subtotal-value {
text-align: right;
}
.s-shop-cart .checkout-sidebar .order-total {
background: unset;
margin-bottom: 20px;
}
.s-shop-cart .checkout-sidebar .order-total th, .s-shop-cart .checkout-sidebar .order-total td {
padding: 0;
}
.s-shop-cart .checkout-sidebar .order-total .title-total {
font-weight: 400;
font-size: 24px;
line-height: 32px;
text-transform: uppercase;
}
.s-shop-cart .checkout-sidebar .order-total .total-value {
text-align: right;
font-weight: 500;
font-size: 24px;
line-height: 32px;
}
.s-shop-cart .checkout-sidebar .order-total .total-value strong {
font-weight: 500;
}
.s-shop-cart .checkout-sidebar .checkbox-wrap {
padding-top: 20px;
border-top: 1px solid #EBEBEB;
margin-bottom: 32px;
margin-top: 20px;
}
.s-shop-cart .checkout-sidebar .checkbox-wrap label {
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: -0.4px;
}
.s-shop-cart .checkout-sidebar .wc-proceed-to-checkout {
margin-bottom: 24px;
}
.s-shop-cart .checkout-sidebar .cart-imgtrust .payment-card {
width: 45px;
height: 31px;
border: 1px solid #D9D9D9;
border-radius: 3px;
}
@media (min-width: 992px) {
.s-shop-cart .tes-slider {
padding: 32px;
}
}
@media (min-width: 1200px) {
.s-shop-cart .left {
gap: 32px;
}
}
@media (min-width: 1440px) {
.s-shop-cart .left {
margin-right: -27px;
}
.s-shop-cart .right {
padding-left: 22px;
}
}
.checkout-sidebar {
padding: 30px 15px;
border: 1px solid var(--line-8);
}
.checkout-sidebar .br-line {
background-color: var(--line-8);
}
.checkout-sidebar .title-total {
display: flex;
align-items: center;
justify-content: space-between;
}
.checkout-sidebar .form-checkout-sidebar {
margin-bottom: 24px;
}
.checkout-sidebar .text-we-accept {
margin-bottom: 12px;
}
@media (min-width: 992px) {
.checkout-sidebar {
padding: 32px;
}
}
.s-checkout {
display: flex;
align-items: start;
gap: 24px;
flex-wrap: wrap;
}
.s-checkout .left-col,
.s-checkout .right-col {
width: 100%;
}
.s-checkout .right-col > *:not(:last-child) {
margin-bottom: 24px;
}
.s-checkout .checkout-title {
margin-bottom: 24px;
font-weight: normal;
display: flex;
align-items: center;
justify-content: space-between;
}
.s-checkout .checkout-subtitle {
margin-bottom: 24px;
color: var(--main-4);
}
.s-checkout .title {
margin-bottom: 12px;
}
.s-checkout .sub-title {
margin-bottom: 24px;
}
.s-checkout .br-line {
margin-top: 20px;
margin-bottom: 20px;
background-color: rgba(161, 161, 161, 0.2);
display: block;
}
.s-checkout .last-total {
margin-bottom: 20px;
font-weight: normal;
}
.s-checkout .s-wrap {
padding: 20px 15px;
border: 1px solid var(--line-8);
}
@media (min-width: 1200px) {
.s-checkout .s-wrap {
padding: 32px;
}
.s-checkout .last-total {
margin-bottom: 32px;
}
.s-checkout .br-line {
margin-top: 32px;
margin-bottom: 32px;
}
.s-checkout .left-col {
width: calc(66.66666667% - 12px);
}
.s-checkout .right-col {
width: calc(33.33333333% - 12px);
}
}
@media (min-width: 1440px) {
.s-checkout {
flex-wrap: nowrap;
}
.s-checkout .right-col {
max-width: 543px;
width: 100%;
}
.s-checkout .left-col {
max-width: 952px;
width: 100%;
}
}
.tf-page-cart-sidebar {
padding: 20px 15px;
border: 1px solid var(--line-8);
}
@media (min-width: 1200px) {
.tf-page-cart-sidebar {
padding: 32px;
}
}
.list-order-product .order-item {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
}
.list-order-product .order-item:not(:last-child) {
margin-bottom: 20px;
}
.list-order-product .prd {
aspect-ratio: 1;
}
.list-order-product .name {
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
display: -webkit-box;
overflow: hidden;
}
.list-order-product .quantity {
position: absolute;
width: 24px;
height: 24px;
right: -12px;
top: -12px;
border-radius: 50%;
background-color: var(--primary);
color: var(--white);
display: flex;
align-items: center;
justify-content: center;
font-weight: 500;
}
.list-order-product .info {
display: flex;
flex-direction: column;
gap: 8px;
}
.list-order-product .variant {
font-size: 14px;
line-height: 20px;
letter-spacing: 0px;
}
.list-order-product .img-product {
max-width: 80px;
position: relative;
}
.list-order-product .content {
display: flex;
justify-content: space-between;
align-items: center;
gap: 10px;
}
@media (min-width: 576px) {
.list-order-product .content {
align-items: start;
}
.list-order-product .name {
-webkit-line-clamp: 2;
}
.list-order-product .img-product {
max-width: 96px;
}
}
@media (min-width: 1200px) {
.list-order-product {
padding-top: 12px;
}
.list-order-product .content {
gap: 20px;
}
}
@media (max-width: 575px) {
.list-order-product .price {
font-size: 16px;
}
}
.list-total {
display: grid;
gap: 15px;
}
.list-total .total-item {
display: flex;
align-items: center;
justify-content: space-between;
}
.thank-wrap {
text-align: center;
}
.thank-wrap .icon {
font-size: clamp(60px, 10vw, 140px);
color: var(--primary);
}
.thank-wrap .title {
font-weight: normal;
}
.thank-wrap .sub-title {
color: var(--main-4);
}
.thank-wrap .icon,
.thank-wrap .title {
margin-bottom: 15px;
}
@media (min-width: 1200px) {
.thank-wrap .icon {
margin-bottom: 32px;
}
.thank-wrap .title {
margin-bottom: 24px;
}
}
.table-order-finish {
text-align: center;
overflow: auto;
}
.table-order-finish th {
font-weight: normal;
text-transform: uppercase;
}
.table-order-finish td,
.table-order-finish th {
min-width: 150px;
white-space: nowrap;
}
.table-order-finish td:last-child,
.table-order-finish th:last-child {
width: 369px;
}
@media (min-width: 1200px) {
.table-order-finish table {
table-layout: fixed;
}
.table-order-finish th,
.table-order-finish td {
padding: 16px;
}
}
.delivery-progress {
max-width: 628px;
width: 100%;
margin: 0 auto;
display: flex;
justify-content: space-between;
position: relative;
gap: 10px;
}
.delivery-progress .checkout-bar {
position: absolute;
height: 1px;
background-color: var(--line-12);
width: 80%;
display: block;
top: 30px;
left: 50%;
transform: translateX(-50%);
}
@media (min-width: 1200px) {
.delivery-progress .checkout-bar {
top: 42px;
}
}
.delivery-step {
text-align: center;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
position: relative;
z-index: 2;
}
.delivery-step .box-icon {
max-width: 60px;
width: 100%;
aspect-ratio: 1;
background-color: #EFEFEF;
color: var(--primary);
border-radius: 50%;
font-size: 22px;
margin-bottom: 20px;
}
.delivery-step .title {
font-weight: normal;
text-transform: uppercase;
color: var(--black);
margin-bottom: 4px;
}
.delivery-step.confirmed .box-icon {
background-color: var(--primary);
color: var(--white);
}
.delivery-step.confirmed .title {
color: var(--primary);
}
@media (min-width: 1200px) {
.delivery-step .box-icon {
max-width: 83px;
font-size: 28px;
}
}
.box-ship-address {
display: flex;
justify-content: space-between;
gap: 15px 0px;
flex-wrap: wrap;
}
@media (min-width: 1440px) {
.box-ship-address > * {
max-width: 299px !important;
width: 100%;
}
}
.ship-address-item {
width: 100%;
}
.ship-address-item .address-title {
font-weight: normal;
text-transform: uppercase;
margin-bottom: 12px;
}
.ship-address-item .list-address {
display: grid;
gap: 6px;
color: var(--main-4);
}
@media (min-width: 1200px) {
.ship-address-item .address-title {
margin-bottom: 24px;
}
}
@media (min-width: 576px) {
.ship-address-item {
max-width: 499px;
}
}
.feedback-sidebar .form-feedback {
margin-bottom: 30px;
}
@media (min-width: 1200px) {
.feedback-sidebar .form-feedback {
margin-bottom: 48px;
}
}
.my-account-nav {
display: grid;
}
.my-account-nav .link-account {
padding: 15px;
border: 1px solid var(--line-8);
text-transform: uppercase;
width: 100%;
}
.my-account-nav .link-account:hover, .my-account-nav .link-account.active {
background-color: var(--primary);
color: var(--white);
border-color: var(--primary);
}
.my-account-nav .text {
max-width: 220px;
width: 100%;
margin: 0 auto;
display: block;
}
@media (min-width: 1200px) {
.my-account-nav {
max-width: 357px;
width: 100%;
}
}
.my-acount-content .heading {
margin-bottom: 24px;
text-transform: uppercase;
}
@media (min-width: 1200px) {
.my-acount-content {
max-width: 912px;
width: 100%;
}
}
.account-dashboard .heading {
text-transform: none;
}
.account-dashboard > *:not(:last-child, .heading) {
margin-bottom: 30px;
}
.account-dashboard .banner_V02 .title {
font-size: clamp(24px, 2.8vw, 32px);
line-height: clamp(28px, 3.5vw, 42px);
margin-bottom: 12px;
}
@media (min-width: 992px) {
.account-dashboard .banner_V02 .bn-content {
padding: 60px 15px;
}
}
@media (min-width: 1200px) {
.account-dashboard > *:not(:last-child, .heading) {
margin-bottom: 48px;
}
.account-dashboard .banner_V02 .bn-content {
padding: 68px 59px 71px 60px;
}
}
.hello-name {
font-size: clamp(18px, 2.5vw, 24px);
line-height: clamp(26px, 3vw, 38px);
letter-spacing: 0;
font-weight: 500;
}
.hello-name span:not(.hello) {
font-size: 16px;
line-height: 24px;
font-weight: normal;
color: var(--main-4);
}
.hello-name span.name {
font-weight: 500;
}
.hello-name a {
font-weight: 400;
}
.box-check-list {
display: flex;
gap: 24px;
}
.box-check-list > * {
width: 100%;
}
@media (max-width: 575px) {
.box-check-list {
flex-wrap: wrap;
gap: 15px;
}
}
.box-check {
padding: 20px 15px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
text-align: center;
border: 1px solid var(--line-8);
}
.box-check .icon {
font-size: clamp(28px, 4vw, 48px);
margin-bottom: 20px;
display: block;
}
.box-check .name-type {
font-weight: normal;
text-transform: uppercase;
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
margin-bottom: 8px;
}
.box-check .count-number {
display: block;
width: 24px;
height: 24px;
background-color: var(--primary);
border-radius: 50%;
color: var(--white);
display: flex;
align-items: center;
justify-content: center;
font-weight: 500;
font-size: 14px;
line-height: 20px;
}
.box-check .sub-type {
color: var(--main-4);
}
.box-check:hover {
color: var(--primary);
border-color: var(--primary);
}
@media (min-width: 1200px) {
.box-check {
padding: 40px;
}
.box-check .icon {
margin-bottom: 32px;
}
}
@media (min-width: 1440px) {
.sidebar-account-wrap {
padding-left: 96px;
}
}
.account-order.empty {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
text-align: center;
}
.account-order.empty .title {
margin-bottom: 16px;
}
.account-order .ic-img {
margin-bottom: 0px;
}
.account-order .title {
text-transform: uppercase;
}
.account-order .sub-title {
color: var(--main-4);
margin-bottom: 16px;
}
@media (min-width: 1200px) {
.account-order.empty {
max-width: 623px;
width: 100%;
}
.account-order .ic-img {
margin-bottom: 40px;
}
.account-order .sub-title {
margin-bottom: 32px;
}
}
.table-order-history {
text-align: center;
overflow: auto;
white-space: nowrap;
}
.table-order-history .title-case {
font-weight: 400;
font-size: 18px;
line-height: 28px;
letter-spacing: 0px;
}
.table-order-history tbody tr {
background-color: transparent;
border-bottom: 1px solid var(--line-8);
}
.table-order-history .btn-action {
font-size: clamp(20px, 2.8vw, 32px);
display: flex;
justify-content: center;
}
@media (min-width: 1200px) {
.table-order-history td {
padding: 12px 0px 11px;
vertical-align: middle;
}
.table-order-history th {
padding: 16px;
}
.table-order-history th:nth-child(1),
.table-order-history td:nth-child(1) {
width: 196px;
}
.table-order-history th:nth-child(2),
.table-order-history td:nth-child(2) {
width: 234px;
}
.table-order-history th:nth-child(3),
.table-order-history td:nth-child(3) {
width: 162px;
}
.table-order-history th:nth-child(4),
.table-order-history td:nth-child(4) {
width: 169px;
}
.table-order-history th:nth-child(5),
.table-order-history td:nth-child(5) {
width: 150px;
}
}
.widget-inner-address .btn-add-address,
.widget-inner-address .wd-form-address {
margin-bottom: 30px;
}
@media (min-width: 1200px) {
.widget-inner-address .btn-add-address,
.widget-inner-address .wd-form-address {
margin-bottom: 48px;
}
}
.list-account-address {
gap: 23px;
}
.account-address-item {
border: 1px solid var(--line);
}
.account-address-item .title {
padding: 15px;
border-bottom: 1px solid var(--line);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.account-address-item .info-detail {
padding: 20px 15px;
display: grid;
gap: 24px;
}
.account-address-item .box-infor {
display: grid;
gap: 12px;
color: var(--main-4);
}
.account-address-item .box-btn {
display: flex;
gap: 12px;
}
.account-address-item.editing .title {
background-color: var(--primary);
color: var(--white);
border-color: var(--primary);
}
@media (min-width: 1200px) {
.account-address-item .info-detail {
padding: 23px;
}
.account-address-item .title {
padding: 15px 23px;
}
}
.show-form-address,
.edit-form-address {
display: none;
}
.faq-wrap .accordion-body {
color: var(--main-6);
}
.form-edit-account .form-name {
margin-bottom: 28px;
text-align: left;
}
.form-edit-account .form-pass {
text-align: left;
}
.form-edit-account .title-form {
margin-bottom: 32px;
text-align: left;
}
.form-edit-account .title-pass {
margin-top: 30px;
margin-bottom: 24px;
}
.form-edit-account .tf-field:not(:last-child) {
margin-bottom: 15px;
}
.form-edit-account .tf-btn {
margin-top: 32px;
} .sib-form {
padding: 0;
font-family: "Jost", sans-serif !important;
}
#sib-container {
background-color: unset;
padding: 0;
display: block;
}
.sib-form .entry__field {
background-color: unset;
border: 0;
box-shadow: none !important;
margin: 0;
}
.sib-form .sib-form-container .input {
outline: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
width: 100%;
padding: 11px 12px;
border: 1px solid var(--line-8);
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: 0.32px;
color: var(--main);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
border-radius: 0px;
height: unset;
text-align: center;
}
.sib-form .sib-form-container .input::placeholder {
font-weight: 400;
font-size: 16px;
line-height: 24px;
color: var(--main-4);
}
.sib-form .sib-form-container .input:focus {
border-color: var(--primary);
}
.sib-form .entry__specification,
.sib-form .entry__error,
.entry__specification,
.entry__label {
margin: 0 !important;
font-family: "Jost", sans-serif;
}
.sib-form-block {
padding: 0;
}
.sib-optin {
display: none;
}
#sib-form {
position: relative;
display: block;
}
#error-message {
color: #f03e3e;
}
#success-message {
color: #3dab25;
}
.sib-form-message-panel {
border: 0;
padding: 0;
}
.sib-form-message-panel .sib-form-message-panel__text {
justify-content: center;
padding: 0;
}
.sib-form-block__button .clickable__icon {
display: none;
}
.sib-input {
margin-bottom: 24px;
}
.form__label-row {
margin-bottom: 12px;
}
.form-newsletter .btn-group {
display: grid;
gap: 12px;
}
.form-newsletter .btn-group .close-modal {
text-decoration: unset;
color: var(--black);
}
.form-newsletter .btn-group .close-modal:hover {
color: var(--white);
}
@media (min-width: 1440px) {
.form-newsletter .btn-group {
margin-bottom: 20px;
}
}
.sib-form.form-email .sib-form-container .input {
outline: 0;
-webkit-box-shadow: none;
-moz-box-shadow: none;
box-shadow: none;
width: 100%;
padding: 13px 0px 12px;
font-weight: 400;
font-size: 16px;
line-height: 24px;
letter-spacing: -0.32px;
border: 0;
border-bottom: 1px solid var(--line);
color: var(--main);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
border-radius: 0px;
padding-top: 6px;
padding-bottom: 5px;
padding-right: 30px;
border-color: var(--main);
text-align: start;
}
.sib-form.form-email .sib-form-block__button {
position: absolute;
right: 0;
top: 0;
transform: none;
padding: 0px 0px;
}
.sib-form .btn-group {
position: unset;
}
.sib-form.form-notify .sib-form-block__button {
position: absolute;
top: 4px;
right: 4px;
}
.sib-form.form-notify .sib-form-container input {
padding: 15px 170px 15px 20px;
} .gallery-caption {
font-size: 14px;
line-height: 1.4;
color: #666;
text-align: center;
margin-top: 5px;
}
.bypostauthor {
border: 1px solid #ddd;
background: #f9f9f9;
padding: 10px;
}
.banner-build-home2 .elementor-widget.elementor-widget-image {
height: 100%;
}
.error404 #themesflat-content {
padding-top: 0px !important;
padding-bottom: 0px !important;
}
.form-contact-popup {
text-align: center;
}
.form-contact-popup input {
border: 1px solid rgba(17, 17, 17, 0.1490196078) !important;
text-align: center;
}
.form-contact-popup .tf-btn {
width: 100%;
margin-top: 24px;
}
.form-contact-popup .close-modal {
margin-bottom: 24px;
}
.home3-blog .article-blog .tf-btn-line {
gap: 8px;
}
.home3-blog .article-blog .tf-btn-line::before, .home3-blog .article-blog .tf-btn-line::after {
display: none;
}
@keyframes fadeInUp2 {
0% {
opacity: 0;
-webkit-transform: translateY(15px);
-ms-transform: translateY(15px);
transform: translateY(15px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes fadeInDown2 {
0% {
opacity: 0;
-webkit-transform: translateY(-15px);
-ms-transform: translateY(-15px);
transform: translateY(-15px);
}
100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes fadeInLeft2 {
0% {
opacity: 0;
-webkit-transform: translateX(-15px);
-ms-transform: translateX(-15px);
transform: translateX(-15px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes fadeInRight2 {
0% {
opacity: 0;
-webkit-transform: translateX(15px);
-ms-transform: translateX(15px);
transform: translateX(15px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}
.fadeInUp {
animation-name: fadeInUp2 !important;
}
.fadeInLeft {
animation-name: fadeInLeft2 !important;
}
.fadeInRight {
animation-name: fadeInRight2 !important;
}
.fadeInDown {
animation-name: fadeInDown2 !important;
}
.animated {
animation-duration: 0.8s !important;
}
.page-title.center {
justify-content: unset;
align-items: unset;
border-bottom: unset;
flex-direction: column;
align-items: center;
text-align: center;
}
.page-title.center .box-text {
display: none;
}
.page-title.center .breadcrumbs .bread-wrap {
justify-content: center;
}
.page-title.center .heading {
justify-content: center;
}
.page-title.center .heading .number-count {
display: none;
}
.page-title.right {
flex-direction: row-reverse;
}
@media (max-width: 767px) {
.page-title.right {
flex-direction: column;
}
}
.page-title.right .box-text {
text-align: left;
}
.page-title.right .heading {
justify-content: right;
flex-direction: row-reverse;
}
.page-title.right .breadcrumbs .bread-wrap {
justify-content: right;
}
@media (max-width: 767px) {
.page-title.right .breadcrumbs .bread-wrap {
justify-content: left;
}
}
.sticky-col {
position: sticky !important;
top: 100px !important;
margin-bottom: auto !important;
}