a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
border: 0;
font: inherit;
margin: 0;
padding: 0;
vertical-align: baseline
}
thead {
font-weight: 600
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block
}
body {
line-height: 1;
font-family: Quicksand !important;
}
ol,
ul {
list-style: none
}
blockquote,
q {
quotes: none
}
blockquote:after,
blockquote:before,
q:after,
q:before {
content: none
}
table {
border-spacing: 0
}
img {
max-width: 100%
}
input:focus::-moz-placeholder {
opacity: 0;
-moz-transition: .4s;
transition: .4s
}
a {
color: #B99B3C !important;
}
a:hover {
color: var(--color-brand-2)
}
li.hr span {
background-color: #e4e4e4;
display: block;
height: 1px;
margin: 20px 0;
width: 100%
}
::selection {
background: var(--color-brand);
color: #fff
}
::-moz-selection {
background: var(--color-brand);
color: #fff
}
::-moz-placeholder {
color: #838383
}
::placeholder {
color: #838383
}
.fix {
overflow: hidden
}
.hidden {
display: none
}
.clear {
clear: both
}
.section {
float: left;
width: 100%
}
.f-right {
float: right
}
.capitalize {
text-transform: capitalize
}
.uppercase {
text-transform: uppercase
}
.bg-img {
background-position: 50%;
background-size: cover
}
.position-relative {
position: relative
}
.height-100vh {
height: 100vh !important
}
.custom-select:focus,
:focus,
[contenteditable].form-control:focus,
[type=email].form-control:focus,
[type=password].form-control:focus,
[type=tel].form-control:focus,
[type=text].form-control:focus,
button:focus,
input.form-control:focus,
input[type=email]:focus,
input[type=number]:focus,
input[type=password]:focus,
input[type=text]:focus,
select:focus,
textarea.form-control:focus,
textarea:focus {
box-shadow: none;
outline: none !important
}
.bg-grey-9 {
background-color: var(--color-grey-9)
}
.border-radius {
border-radius: 4px
}
.border-radius-5 {
border-radius: 5px
}
.border-radius-10 {
border-radius: 10px
}
.border-radius-15 {
border-radius: 15px
}
.border-radius-20 {
border-radius: 20px
}
.img-hover-scale img {
transition: transform .5s
}
.img-hover-scale:hover img {
transform: scale(1.05);
transition: transform .5s
}
.hover-up,
.hover-up:hover {
transition: all .25s cubic-bezier(.02, .01, .47, 1)
}
.hover-up:hover {
transform: translateY(-5px)
}
.text-brand {
color: #253d4e !important;
}
.text-brand-2 {
color: var(--color-brand-2) !important
}
.text-primary {
color: var(--color-primary) !important
}
.text-warning {
color: var(--color-warning) !important
}
.text-danger {
color: #dc3545 !important
}
.text-success {
color: var(--color-success) !important
}
.text-info {
color: var(--color-info) !important
}
.text-grey-4 {
color: var(--color-grey-4) !important
}
.text-muted {
color: #B6B6B6 !important;
}
.text-7 {
color: #d77f7a !important
}
.text-8 {
color: #63a2c1 !important
}
.text-white {
color: #fff !important
}
.text-grey-5,
.text-grey-5 a,
.text-hover-grey-5:hover {
color: #a2a2a2 !important
}
.bg-brand {
background-color: var(--color-brand) !important
}
.bg-primary {
background-color: var(--color-primary) !important
}
.bg-warning {
background-color: var(--color-warning) !important
}
.bg-danger {
background-color: var(--color-danger) !important
}
.bg-success {
background-color: var(--color-success) !important
}
.bg-info {
background-color: var(--color-info) !important
}
.bg-grey-4 {
background-color: var(--color-grey-4) !important
}
.bg-1 {
background-color: #fddde4 !important
}
.bg-2 {
background-color: #cdebbc !important
}
.bg-3 {
background-color: #d1e8f2 !important
}
.bg-4 {
background-color: #cdd4f8 !important
}
.bg-5 {
background-color: #f6dbf6 !important
}
.bg-6 {
background-color: #fff2e5 !important
}
.bg-7 {
background-color: #d77f7a !important
}
.bg-8 {
background-color: #63a2c1 !important
}
.bg-9 {
background-color: #f2fce4 !important
}
.bg-10 {
background-color: #fffceb !important
}
.bg-11 {
background-color: #ecffec !important
}
.bg-12 {
background-color: #feefea !important
}
.bg-13 {
background-color: #fff3eb !important
}
.bg-14 {
background-color: #fff3ff !important
}
.bg-15 {
background-color: #f2fce4 !important
}
.bg-grey-9 {
background-color: var(--color-grey-9) !important
}
.box-shadow-none {
box-shadow: none !important
}
.flex-horizontal-center {
align-items: center;
display: flex
}
.w-36px {
max-width: 36px
}
.border {
border: 1px solid #ececec !important
}
.box-shadow-outer-6 {
box-shadow: 20px 20px 54px rgba(0, 0, 0, .03)
}
.box-shadow-outer-6:hover {
box-shadow: 20px 20px 54px rgba(0, 0, 0, .05)
}
.box-shadow-outer-7 {
box-shadow: 0 0 11px 0 rgba(78, 42, 222, .03), 0 8px 16px 0 rgba(78, 42, 222, .08)
}
.box-shadow-outer-7:hover {
box-shadow: 0 0 14px 0 rgba(78, 42, 222, .03), 0 8px 18px 0 rgba(78, 42, 222, .09)
}
.box-hover-shadow-outer-3:hover,
.box-shadow-outer-3 {
box-shadow: 0 5px 16px 0 rgba(118, 126, 173, .09)
}
.border-1 {
border-width: 1px !important
}
.border-2 {
border-width: 2px !important
}
.border-3 {
border-width: 3px !important
}
.border-dotted {
border-style: dotted !important
}
.border-solid {
border-style: solid !important
}
.border-double {
border-style: double !important
}
.border-dashed {
border-style: dashed !important
}
.border-brand {
border-color: var(--color-brand) !important
}
.border-muted {
border-color: #f7f8f9
}
.section-border {
border-bottom: 1px solid #e6e9ec;
border-top: 1px solid #e6e9ec
}
.border-color-1 {
border-color: #e0dede
}
a,
button,
h4,
img,
input,
span {
transition: all .3s ease 0s
}
@keyframes slideleft {
10% {
opacity: 0;
right: 0;
transform: scale(0)
}
50% {
opacity: 1;
transform: scale(1)
}
90% {
opacity: 0;
right: 100%;
transform: scale(0)
}
}
[data-loader=spinner] {
animation: spinner 1.2s ease-in-out infinite;
background: url(../imgs/favicon.html);
box-shadow: 0 0 10px #fff;
display: inline-block;
height: 35px;
width: 35px
}
@keyframes spinner {
0% {
transform: perspective(120px) rotateX(0) rotateY(0)
}
50% {
transform: perspective(120px) rotateX(-180deg) rotateY(0)
}
to {
transform: perspective(120px) rotateX(-180deg) rotateY(-180deg)
}
}
@keyframes shadow-pulse {
0% {
box-shadow: 0 0 0 0 rgba(239, 63, 72, .8)
}
to {
box-shadow: 0 0 0 5px transparent
}
}
@keyframes shadow-pulse-big {
0% {
box-shadow: 0 0 0 0 rgba(239, 63, 72, .1)
}
to {
box-shadow: 0 0 0 20px transparent
}
}
@keyframes jump {
0% {
transform: translate3d(0, 20%, 0)
}
to {
transform: translateZ(0)
}
}
.jump {
animation: jump .5s linear infinite alternate;
transform-origin: 0
}
body {
color: var(--color-text);
font-family: var(--font-text), sans-serif;
font-size: var(--body-font-size);
font-style: normal;
font-weight: 400;
line-height: 24px
}
.display-1,
.display-2,
.font-heading,
.heading-sm-1,
h1,
h2,
h3,
h4,
h5,
h6 {
color: var(--color-heading);
font-family: var(--font-heading), sans-serif;
font-weight: 700;
line-height: 1.2
}
h1 {
font-size: 48px
}
h2 {
font-size: 40px
}
h3 {
font-size: var(--heading-font-size)
}
h4 {
font-size: 24px
}
h5 {
font-size: 20px
}
h6 {
font-size: 16px
}
.display-1 {
font-size: 96px;
line-height: 1
}
.display-2 {
font-size: 50px;
line-height: 1
}
.heading-sm-1 {
font-size: 14px
}
p {
color: var(--color-text);
font-size: 1rem;
font-weight: 400;
line-height: 24px;
margin-bottom: 5px
}
.text-heading {
color: var(--color-heading)
}
p:last-child {
margin-bottom: 0
}
.font-weight-bold {
font-weight: 700
}
a,
button {
cursor: pointer;
text-decoration: none
}
b {
font-weight: 500
}
.fw-600,
strong {
font-weight: 600
}
.fw-900 {
font-weight: 900
}
.fw-300 {
font-weight: 300
}
.section-title {
-webkit-box-align: center;
-ms-flex-align: center;
display: flex;
justify-content: center;
position: relative
}
.section-title .title {
align-items: flex-end;
display: flex;
flex-flow: row
}
.section-title h2,
.section-title h3 {
font-size: 32px;
font-weight: 700;
margin-right: 30px;
color:#253D4E;
}
.section-title a.show-all {
color: var(--color-text);
font-size: 16px
}
.section-title a.show-all:hover {
color: var(--color-brand)
}
.section-title a.show-all i {
font-size: 12px;
margin-left: 5px
}
.section-title.style-1 {
border-bottom: 1px solid #ececec;
font-size: 24px;
padding-bottom: 20px;
position: relative
}
.section-title.style-1:after {
background-color: rgba(var(--color-brand-rgb), .4);
bottom: 0;
content: "";
height: 2px;
left: 0;
position: absolute;
width: 80px
}
.section-title span {
color: var(--color-brand)
}
h5.widget-title {
font-size: 18px;
font-weight: 600
}
.title.style-3 {
background-image: url(../imgs/theme/wave.png);
background-position: bottom;
background-repeat: no-repeat;
padding-bottom: 25px
}
.text-body {
color: #7E7E7E !important;
}
.font-xxs {
font-size: 12px
}
.font-xs {
font-size: 13px
}
.font-sm {
font-size: 14px
}
.font-md {
font-size: 16px
}
.font-lg {
font-size: 17px
}
.font-xl {
font-size: 19px
}
.font-xxl {
font-size: 58px
}
.text-hot {
color: #f74b81
}
.text-new {
color: #55bb90
}
.text-sale {
color: #67bcee
}
.text-best {
color: #f59758
}
.text-style-1 {
position: relative
}
.text-style-1:after {
background-color: #ffdabf;
bottom: 20%;
content: "";
display: block;
height: 20%;
left: -5%;
opacity: .8;
position: absolute;
transition: transform .5s;
width: 110%;
z-index: -1
}
.text-style-1:hover:after {
height: 30%;
transition: transform .5s
}
.fw-700 {
font-weight: 700
}
.btn-default {
background-color: var(--color-brand);
border-radius: 50px;
color: #fff;
font-family: var(--font-heading), sans-serif;
padding: 13px 28px
}
.btn-default i {
font-size: 12px;
font-weight: 400;
margin-left: 10px;
transition-duration: .2s
}
.btn-default:hover i {
margin-left: 15px;
transition-duration: .2s
}
.btn-lg {
font-size: 16px;
padding: 13px 28px
}
.btn-sm {
font-size: 12px;
padding: 8px 18px !important
}
.btn-md {
font-size: 12px;
padding: 10px 24px !important
}
.btn-outline {
background-color: transparent !important
}
.btn-check:focus+.btn,
.btn:focus {
box-shadow: none !important;
outline: 0
}
.btn {
font-family: var(--font-heading), sans-serif
}
.btn:hover {
color: #fff
}
.btn-shadow-brand {
border: 1px solid #f7f8f9;
box-shadow: 0 2px 6px 0 rgba(88, 151, 251, .16)
}
.btn-shadow-brand:hover {
border: 1px solid var(--color-brand)
}
.btn-brand {
background-color: var(--color-brand);
border-color: var(--color-brand)
}
.btn-heading,
button.btn-heading[type=submit] {
background-color: var(--color-heading);
border: 0;
font-weight: 700
}
button.submit,
button[type=submit] {
background-color: var(--color-brand);
border: none;
border: 1px solid #b8922f;
border-radius: 10px;
color: #fff;
font-size: 16px;
font-weight: 500;
padding: 15px 30px;
}
.btn-brand:hover,
button.submit:hover,
button[type=submit]:hover {
background-color: #a07f32 !important
}
.btn-login {
font-weight: 13px
}
.btn-login .btn {
min-width: unset
}
.btn-login li {
display: inline-block;
margin: 0 5px
}
.btn-login li a {
border-radius: 5px;
color: #fff;
display: block;
font-size: 14px;
letter-spacing: 0;
line-height: 1;
padding: 15px 25px;
text-transform: none
}
.btn,
.button {
background-color: var(--color-brand);
border: 1px solid transparent;
border-radius: 4px;
color: #fff;
cursor: pointer;
display: inline-block;
font-size: 14px;
font-weight: 700;
letter-spacing: .5px;
padding: 12px 30px;
transition: all .3s linear 0s
}
.btn:hover,
.button:hover {
background-color: var(--color-brand-2)
}
.btn.btn-sm,
.button.btn-sm {
font-size: 12px;
line-height: 1.8;
padding: 8px 18px;
text-transform: none
}
.btn.btn-xs,
.button.btn-xs {
display: inline-flex;
flex-wrap: wrap;
font-size: 12px;
line-height: 1.3;
padding: 7px 8px 7px 12px;
text-transform: none
}
.btn.btn-xs i,
.button.btn-xs i {
font-size: 14px !important;
line-height: 0
}
.btn.btn-rounded,
.button.btn-rounded {
border-radius: 50px
}
.btn.btn-secondary,
.button.btn-secondary {
background-color: var(--color-secondary);
border-color: var(--color-secondary)
}
.btn.btn-facebook,
.button.btn-facebook {
background: #3b5998;
border-color: #3b5998
}
.btn.btn-google,
.button.btn-google {
background: #d85040;
border-color: #d85040
}
.btn.btn-brush,
.button.btn-brush {
background-color: transparent;
background-repeat: no-repeat;
border: 0;
color: var(--color-brand);
font-family: var(--font-heading), sans-serif;
padding: 14px 80px 14px 65px
}
.btn.btn-brush i,
.button.btn-brush i {
margin: 3px 0 0 5px
}
.btn.btn-brush.btn-brush-1,
.button.btn-brush.btn-brush-1 {
background-image: url(../imgs/theme/btn-brush-bg-1.html)
}
.btn.btn-brush.btn-brush-2,
.button.btn-brush.btn-brush-2 {
background-image: url(../imgs/theme/btn-brush-bg-2.html)
}
.btn.btn-brush.btn-brush-3,
.button.btn-brush.btn-brush-3 {
background-image: url(../imgs/theme/btn-brush-bg-3.html)
}
.comments-area .btn-reply {
align-content: center;
align-items: center;
display: flex !important
}
.comments-area .btn-reply i {
font-size: 12px;
margin-left: 5px
}
.tags .btn,
.tags .button {
border-radius: 4px;
float: left
}
input:-moz-placeholder,
textarea:-moz-placeholder {
opacity: 1
}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
opacity: 1
}
input::-moz-placeholder,
textarea::-moz-placeholder {
opacity: 1
}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
opacity: 1
}
input {
border: 1px solid #ececec;
border-radius: 10px;
box-shadow: none;
font-size: 16px;
padding-left: .75rem;
width: 100%
}
input:focus {
background: transparent;
border: 1px solid rgba(var(--color-brand-rgb), .4)
}
input.square {
border-radius: 0
}
input.coupon {
height: 47px
}
select {
background: transparent;
border: 0 solid #ececec;
box-shadow: none;
color: var(--color-body);
width: 100%
}
option,
select {
font-size: 16px
}
option {
background: #fff;
border: 0 solid #626262;
padding-left: 10px
}
textarea {
border: 1px solid #ececec;
border-radius: 10px;
box-shadow: none;
font-size: 16px;
height: 50px;
min-height: 100px;
padding: 10px 10px 10px 20px;
width: 100%
}
textarea:focus {
background: transparent;
border: 1px solid rgba(var(--color-brand-rgb), .4)
}
.contact-from-area .contact-form-style button {
background-color: var(--color-heading);
border: none;
border-radius: 10px;
color: #fff;
font-family: var(--font-heading), sans-serif;
font-size: 17px;
font-weight: 500;
padding: 20px 40px
}
.contact-from-area .contact-form-style button:hover {
background-color: var(--color-brand) !important
}
.form-group {
margin-bottom: 1rem
}
.form-group input {
background: #F8F5EB;
box-shadow: none;
border: none;
font-size: 16px;
height: 55px;
padding-left: 20px;
width: 100%
}
.form-group input:focus {
background: transparent;
border: 2px solid #b8922f;
}
label {
margin-bottom: 5px
}
.custome-checkbox .form-check-label,
.custome-radio .form-check-label {
cursor: pointer;
position: relative
}
.custome-checkbox .form-check-label {
color: #687188;
cursor: pointer;
padding: 0;
position: relative;
vertical-align: middle
}
.custome-checkbox .form-check-label:before {
border: 2px solid #ced4da;
border-radius: 2px;
content: "";
display: inline-block;
height: 17px;
margin: 0 8px 0 0;
vertical-align: middle;
width: 17px
}
.custome-checkbox .form-check-label span {
vertical-align: middle
}
.custome-checkbox input[type=checkbox]+.form-check-label:after {
border-bottom: 2px solid #fff;
border-left: 2px solid #fff;
content: "";
height: 6px;
left: 3px;
opacity: 0;
position: absolute;
top: 13px;
transform: translateY(-65%) rotate(-45deg);
width: 11px
}
.custome-checkbox .form-check-input,
.custome-radio .form-check-input {
display: none
}
.login_footer {
align-items: center;
display: flex;
justify-content: space-between;
margin-bottom: 20px;
margin-top: 5px;
width: 100%
}
.custome-checkbox input[type=checkbox]:checked+.form-check-label:before {
background-color: var(--color-brand);
border-color: var(--color-brand)
}
.custome-checkbox input[type=checkbox]:checked+.form-check-label:after {
opacity: 1
}
.divider-text-center {
position: relative;
text-align: center
}
.divider-text-center:before {
border-top: 1px solid #ddd;
content: "";
left: 0;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%)
}
.divider-text-center span {
background-color: #fff;
padding: 0 15px;
position: relative;
text-transform: uppercase
}
.comments-area {
background: transparent;
border-top: 1px solid #ececec;
margin-top: 50px;
padding: 45px 0
}
.comments-area h5 {
font-size: 16px;
margin-bottom: 0
}
.comments-area .comment-list {
padding-bottom: 48px
}
.comments-area .comment-list:last-child {
padding-bottom: 0
}
.comments-area .comment-list.left-padding {
padding-left: 25px
}
.comments-area .comment-list .single-comment {
border: 1px solid #f2f2f2;
border-radius: 15px;
margin: 0 0 15px;
padding: 20px;
transition: .2s
}
.comments-area .comment-list .single-comment:not(:last-child) {
border-bottom: 1px solid #ececec
}
.comments-area .comment-list .single-comment .reply {
opacity: 0;
transition: .2s
}
.comments-area .comment-list .single-comment:hover {
transform: translateY(-5px);
transition: .2s
}
.comments-area .comment-list .single-comment:hover .reply {
opacity: 1;
transition: .2s
}
.comments-area p {
font-size: 16px !important
}
.comments-area .thumb {
margin-right: 20px
}
.comments-area .thumb img {
border-radius: 50%;
width: 70px
}
.comments-area .date {
color: #999;
font-size: 14px;
margin-bottom: 0;
margin-left: 20px
}
.comments-area .comment {
color: #777;
font-size: 15px;
margin-bottom: 10px
}
.comments-area .btn-reply {
background-color: transparent;
color: #888;
display: block;
font-size: 14px;
font-weight: 400;
padding: 5px 18px
}
.comments-area.style-2 {
border: 0;
margin-top: 0;
padding: 25px 0
}
.comments-area h4 {
color: #2a2a2a;
font-size: 18px;
margin-bottom: 35px
}
.comment-form .email {
padding-right: 0
}
.form-control {
background: transparent;
border: 1px solid #f0e9ff;
border-radius: 10px;
font-size: 16px;
height: 48px;
padding-left: 18px
}
.comment-form {
padding-top: 45px
}
.comment-form,
.comment-form .form-group {
margin-bottom: 20px
}
.comment-form textarea {
min-height: 200px;
padding-top: 15px
}
.comment-form textarea:focus {
background: transparent;
border-color: rgba(var(--color-brand-rgb), .4);
box-shadow: none;
outline: none !important
}
.form-control:focus {
box-shadow: none;
outline: 0;
border-color: #B99B3C !important;
}
.form-control::-moz-placeholder {
color: #777;
font-weight: 300
}
.form-control::placeholder {
color: #777;
font-weight: 300
}
.nice-select .list {
width: 100%
}
.button-contactForm {
background: var(--color-brand);
border-color: var(--color-brand);
color: #fff;
padding: 12px 25px
}
.search-form form {
position: relative
}
.search-form form input {
transition: all .25s cubic-bezier(.645, .045, .355, 1)
}
.search-form form button {
background-color: transparent;
border: none;
color: var(--color-grey-2);
font-size: 20px;
height: 100%;
padding: 0 24px;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%)
}
.search-form form button:hover {
color: #fff
}
form .search-form {
position: relative
}
form .search-form input {
transition: all .25s cubic-bezier(.645, .045, .355, 1)
}
form .search-form button {
background-color: transparent;
border: none;
color: var(--color-grey-2);
font-size: 20px;
height: 100%;
padding: 0 24px;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%)
}
form .search-form button:hover {
color: #fff
}
.single-animation-wrap.slick-active .slider-animated-1 h1 {
animation-delay: 1.4s;
animation-name: fadeInUp
}
.single-animation-wrap.slick-active .slider-animated-1 h2 {
animation-delay: 1.2s;
animation-name: fadeInUp
}
.single-animation-wrap.slick-active .slider-animated-1 h3,
.single-animation-wrap.slick-active .slider-animated-1 h4 {
animation-delay: 1s;
animation-name: fadeInUp
}
.single-animation-wrap.slick-active .slider-animated-1 span {
animation-delay: .5s;
animation-name: fadeInUp
}
.single-animation-wrap.slick-active .slider-animated-1 p {
animation-delay: 1.7s;
animation-name: fadeInUp
}
.single-animation-wrap.slick-active .slider-animated-1 a.btn {
animation-delay: 2s;
animation-name: fadeInUp
}
.single-animation-wrap.slick-active .slider-animated-1.slider-product-price {
animation-delay: 1.2s;
animation-name: flipInY
}
.single-animation-wrap.slick-active .slider-animated-1 .single-slider-img img {
animation-delay: 1.5s;
animation-name: fadeInUp
}
.single-animation-wrap.slick-active .slider-animated-1 .slider-product-offer-wrap,
.single-animation-wrap.slick-active .slider-animated-1 .slider-product-offer-wrap-2 {
animation-delay: 1s;
animation-name: fadeInUp
}
.hero-slider-1 {
position: relative
}
.hero-slider-1 .single-hero-slider {
background-position: 50%;
background-size: cover !important;
border-radius: 30px;
height: 395px
}
.hero-slider-1 .single-hero-slider.rectangle {
border-radius: 30px !important;
}
.hero-slider-1 .single-hero-slider.rectangle .slider-content {
left: 50%;
position: absolute;
text-align: center;
top: 50%;
transform: translateY(-50%) translateX(-50%)
}
.hero-slider-1 .single-hero-slider.rectangle .slider-content .form-subscribe {
margin: 0 auto
}
.hero-slider-1 img {
border-radius: 30px;
max-height: 538px
}
.hero-slider-1 .slider-content {
left: 6%;
position: absolute;
top: 50%;
transform: translateY(-50%)
}
.hero-slider-1 .slider-content p {
font-size: 30px
}
.hero-slider-1 .slider-content .form-subscribe {
background-color: #fff;
border-radius: 50px;
margin-bottom: 10px;
max-width: 450px
}
.hero-slider-1 .slider-content .form-subscribe input {
background: url(../imgs/theme/icons/icon-plane.png) no-repeat 25px;
border: 0;
border-radius: 50px 0 0 50px;
padding-left: 58px
}
.hero-slider-1 .slider-content .form-subscribe button {
border: 0;
border-radius: 50px
}
.hero-slider-1 .single-slider-img-1 {
height: 538px;
position: relative
}
.hero-slider-1 .single-slider-img-1 .slider-1-1 {
bottom: 30px;
position: absolute;
right: 0
}
.hero-slider-1 .single-slider-img-1 .slider-1-2 {
bottom: 20px;
position: absolute;
right: 0
}
.hero-slider-1 .single-slider-img-1 .slider-1-3 {
bottom: 30px;
position: absolute;
right: 0
}
.hero-slider-1.style-5 .display-2 {
font-size: 50px
}
.hero-slider-1.style-5 .slider-content p {
font-size: 24px
}
.hero-slider-1.style-5 .single-hero-slider,
.hero-slider-1.style-5 img {
border-radius: 10px
}
.dot-style-1 ul {
display: flex
}
.dot-style-1 ul li {
margin: 0 3px
}
.dot-style-1 ul li button {
background: none;
border: 1px solid;
border-color: var(--color-heading);
border-radius: 30px;
font-size: 0;
height: 15px;
padding: 0;
transition: all .3s linear;
width: 15px
}
.dot-style-1 ul li button:hover {
background: rgba(var(--color-brand-rgb), .4)
}
.dot-style-1 ul li.slick-active button {
background: var(--color-brand);
border-color: var(--color-brand)
}
.dot-style-1.dot-style-1-position-1 ul {
bottom: 15px;
left: 50%;
position: absolute;
transform: translateX(-50%)
}
.dot-style-1.dot-style-1-position-2 ul {
bottom: 15px;
left: 6%;
position: absolute
}
.dot-style-1.dot-style-1-center ul {
justify-content: center
}
.dot-style-1.dot-style-1-mt1 ul {
margin-top: 30px
}
.slider-arrow {
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 100%;
z-index: 2
}
.slider-arrow .slider-btn {
background: #f2f3f4;
border-radius: 50%;
color: var(--color-text);
cursor: pointer;
display: block;
font-size: 16px;
height: 45px;
line-height: 50px;
position: absolute;
text-align: center;
transition: all .2s ease-out;
width: 45px;
z-index: 100
}
.slider-arrow .slider-btn.slider-prev {
left: 20px
}
.slider-arrow .slider-btn.slider-prev i {
margin-right: 2px
}
.slider-arrow .slider-btn.slider-next {
right: 20px
}
.slider-arrow .slider-btn.slider-next i {
margin-left: 2px
}
.slider-arrow .slider-btn:hover {
background-color: var(--color-brand);
border-color: var(--color-brand);
color: #fff
}
.slider-arrow.slider-arrow-2 .slider-btn {
font-size: 24px;
height: 40px;
line-height: 44px;
width: 40px
}
.slider-arrow.slider-arrow-2.flex-right {
display: flex;
justify-content: flex-end;
max-width: 200px;
position: relative;
top: unset;
transform: unset
}
.slider-arrow.slider-arrow-2.flex-right .slider-btn {
left: unset;
position: relative;
right: unset
}
.slider-arrow.slider-arrow-2.flex-right .slider-btn.slider-prev {
margin-right: 10px
}
.slider-arrow.slider-arrow-3 .slider-btn {
font-size: 12px;
height: 30px;
line-height: 28px;
margin-top: -15px;
width: 30px
}
.slider-arrow.style-3 .slider-btn {
border: 1px solid #dcdeed;
font-size: 12px;
height: 40px;
line-height: 40px;
margin-top: -20px;
width: 40px
}
.home-slide-cover {
position: relative
}
.home-slide-cover .slider-arrow {
left: 0
}
.home-slide-cover .hero-slider-content-2 {
padding-left: 50px
}
.carousel-8-columns-cover .carousel-8-columns {
margin: 0 -12px;
overflow: hidden
}
.carousel-8-columns-cover .carousel-8-columns .card-1 {
margin-left: 12px;
margin-right: 12px
}
.carousel-8-columns-cover .product-img {
border: 1px solid #cce7d0
}
.carousel-8-columns-cover .slider-arrow {
top: -80px
}
.carousel-8-columns-cover .slider-arrow .slider-btn.slider-next {
right: 0
}
.carousel-8-columns-cover .slider-arrow .slider-btn.slider-prev {
left: unset;
right: 48px
}
.carousel-8-columns-cover.arrow-center .slider-arrow {
margin-top: -50px;
top: 50%;
transform: translateY(-50%)
}
.carousel-8-columns-cover.arrow-center .slider-arrow .slider-btn.slider-next {
right: -30px
}
.carousel-8-columns-cover.arrow-center .slider-arrow .slider-btn.slider-prev {
left: -30px
}
.carousel-8-columns-cover.arrow-center .slider-arrow.slider-arrow-3 {
margin-top: 0
}
.carousel-10-columns-cover .carousel-10-columns {
margin: 0 -12px;
overflow: hidden
}
.carousel-10-columns-cover .carousel-10-columns .card-2 {
margin-left: 12px;
margin-right: 12px
}
.carousel-4-columns-cover .carousel-4-columns {
margin: 0 -12px;
overflow: hidden
}
.carousel-4-columns-cover .carousel-4-columns .product-cart-wrap {
margin-left: 12px;
margin-right: 12px
}
.carousel-4-columns-cover .carousel-4-columns-arrow {
margin-top: -100px
}
.carousel-4-columns-cover .product-cart-wrap {
margin-bottom: 20px
}
.carousel-4-columns-cover .product-cart-wrap:hover {
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05)
}
.bg-grey-10 {
background-color: #d0f3ec
}
.home-slider .slider-arrow {
opacity: 0;
transition: .4s;
visibility: hidden
}
.home-slider:hover .slider-arrow {
opacity: 1;
transition: .4s;
visibility: visible
}
.home-slider.style-2 {
background-size: cover;
padding: 50px 0;
width: 100%
}
.carousel-3-columns-cover {
position: relative
}
.carousel-3-columns-cover .carousel-3-columns {
margin: 0 -12px;
overflow: hidden
}
.carousel-3-columns-cover .carousel-3-columns img {
margin-left: 12px;
margin-right: 12px
}
.carousel-3-columns-cover #carousel-3-columns-arrows {
margin-top: -20px;
position: absolute;
top: 50%;
width: 100%;
z-index: 3
}
.carousel-3-columns-cover .slider-btn {
background: #f2f3f4;
border-radius: 40px;
color: var(--color-brand);
display: inline-block;
font-size: 27px;
height: 40px;
line-height: 44px;
position: absolute;
text-align: center;
width: 40px
}
.carousel-3-columns-cover .slider-btn.slider-prev {
left: -20px
}
.carousel-3-columns-cover .slider-btn.slider-next {
right: -20px
}
.carousel-3-columns-cover .slider-btn:hover {
background: var(--color-brand);
color: #fff
}
.ads-carousel-section {
padding: 30px 0
}
.carousel-ads-cover {
position: relative
}
.carousel-ads-cover .carousel-ads {
margin: 0 -12px;
overflow: hidden
}
.carousel-ads-cover .carousel-ads .carousel-ad-item {
padding: 0 12px
}
.carousel-ads-cover .carousel-ads .slick-list {
margin: 0 -12px
}
.carousel-ads-cover .carousel-ads .slick-slide>div {
padding: 0 12px
}
.carousel-ads-cover .carousel-ads-arrow {
pointer-events: none;
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 100%;
z-index: 3
}
.carousel-ads-cover .carousel-ads-arrow .slider-btn {
pointer-events: auto
}
.carousel-ads-cover.arrow-center .slider-arrow {
margin-top: -30px;
top: 50%;
transform: translateY(-50%)
}
.carousel-ads-cover.arrow-center .slider-arrow .slider-btn.slider-next {
right: -15px
}
.carousel-ads-cover.arrow-center .slider-arrow .slider-btn.slider-prev {
left: -15px
}
.carousel-ads-cover .slick-dots {
display: flex !important;
justify-content: center;
list-style: none;
margin-top: 20px;
padding: 0
}
.carousel-ads-cover .slick-dots li {
margin: 0 5px
}
.carousel-ads-cover .slick-dots li button {
background: none;
border: 1px solid var(--color-heading);
border-radius: 50%;
cursor: pointer;
font-size: 0;
height: 12px;
padding: 0;
transition: all .3s ease;
width: 12px
}
.carousel-ads-cover .slick-dots li button:hover {
background: rgba(var(--color-brand-rgb), .4)
}
.carousel-ads-cover .slick-dots li.slick-active button {
background: var(--color-brand);
border-color: var(--color-brand)
}
@media(max-width:767px) {
.carousel-ads-cover.arrow-center .slider-arrow {
display: none
}
.carousel-ads-cover .slick-dots {
margin-top: 15px
}
.carousel-ads-cover .slick-dots li button {
height: 10px;
width: 10px
}
.ads-carousel-section {
padding: 20px 0
}
}
.card-1 {
background: #f4f6fa;
border: 1px solid #f4f6fa;
border-radius: 10px;
margin-bottom: 20px;
min-height: 215px;
padding: 40px 30px 25px;
position: relative;
text-align: center;
transition: .2s
}
.card-1:hover {
background: #fff;
border: 1px solid rgba(var(--color-brand-rgb), .4);
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
transition: .2s
}
.card-1 figure {
margin-bottom: 20px;
text-align: center
}
.card-1 figure img {
border-radius: 10px;
display: inline-block;
max-width: 80px
}
.card-1 h6 {
margin: 0
}
.card-1 h6 a {
color: var(--color-heading)
}
.card-1:hover a {
color: var(--color-brand)
}
.card-2 {
background: #f4f6fa;
border: 1px solid #f4f6fa;
border-radius: 10px;
margin-bottom: 20px;
min-height: 180px;
padding: 20px 0 18px;
position: relative;
text-align: center;
transition: .2s
}
.card-2:hover {
background: #fff;
border: 1px solid rgba(var(--color-brand-rgb), .4);
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
transition: .2s
}
.card-2 figure {
margin-bottom: 10px;
text-align: center
}
.card-2 figure img {
border-radius: 10px;
display: inline-block;
max-width: 80px
}
.card-2 .heading-card {
margin: 0
}
.card-2 .heading-card a {
color: var(--color-heading)
}
.card-2:hover a {
color: var(--color-brand)
}
.hero-card {
background: #fff;
border: 1px solid #eee;
border-radius: 10px;
padding: 30px;
position: relative;
transition: all .3s ease;
width: 100%
}
.hero-card:hover {
border: 1px solid var(--color-brand)
}
.hero-card .hero-card-icon {
align-items: center;
border-radius: 5px;
display: flex;
height: 65px;
justify-content: center;
margin-bottom: 20px;
transition: all .3s ease;
width: 65px
}
.hero-card .hero-card-icon.icon-left {
align-items: start;
width: 135px
}
.hero-card .hero-card-icon.icon-left-2 {
align-items: start;
width: 265px
}
.hero-card .hero-card-icon i {
color: #6143f7;
font-size: 25px
}
.card {
word-wrap: break-word;
background-clip: border-box;
background-color: #fff;
border: 1px solid #ececec;
border-radius: .25rem;
display: flex;
flex-direction: column;
min-width: 0;
position: relative
}
.card .card-header {
background-color: #f7f8f9;
border-bottom: 1px solid #ececec;
margin-bottom: 0;
padding: 1rem
}
.featured-card {
background: #fff;
border: 1px solid #ececec;
border-radius: 15px;
padding: 50px 30px
}
.featured-card img {
margin-bottom: 30px;
width: 100px
}
.featured-card h4,
.featured-card p {
margin-bottom: 30px
}
.featured-card p {
font-size: 17px
}
.featured-card a {
font-size: 16px
}
.featured-card:hover {
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05)
}
.team-card {
position: relative
}
.team-card img {
border-radius: 15px;
z-index: 1
}
.team-card:hover .content {
transform: translateY(-95px);
transition: .2s
}
.team-card .content {
background: #fff;
border-radius: 15px;
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
margin-left: auto;
margin-right: auto;
max-width: 80%;
padding: 30px;
position: relative;
transform: translateY(-90px);
transition: .2s;
z-index: 2
}
.team-card .content span {
font-size: 17px
}
.team-card .content .social-network a {
display: inline-block;
padding: 0 5px
}
.team-card .content .social-network a img {
max-width: 30px;
min-width: 20px
}
.account .card {
border: 0
}
.account .card .card-header {
background: none;
border: 0
}
.account .card table td,
.account .card table th {
border: 0
}
.account .card .table>thead {
font-family: var(--font-heading), sans-serif;
font-size: 17px
}
.card-login {
border: 1px solid #ececec;
border-radius: 15px;
margin-left: 30px;
padding: 50px
}
.card-login .social-login {
align-items: center;
border-radius: 10px;
display: flex;
font-family: var(--font-heading), sans-serif;
font-size: 20px;
font-weight: 700;
margin-bottom: 20px;
padding: 15px 25px;
transition: .3s;
width: 100%
}
.card-login .social-login img {
margin-right: 15px;
max-width: 28px;
min-width: 28px
}
.card-login .social-login.facebook-login {
background-color: #1877f2;
color: #fff
}
.card-login .social-login.google-login {
background-color: #fff;
border: 1px solid #f2f3f4;
color: var(--color-text)
}
.card-login .social-login.apple-login {
background-color: #000;
color: #fff;
margin-bottom: 0
}
.card-login .social-login.github-login,
.card-login .social-login.linkedin-login {
background-color: #fff;
border: 1px solid #f2f3f4;
color: var(--color-text)
}
.card-login .social-login:hover {
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
transform: translateY(-3px);
transition: .3s
}
.nav-tabs {
border: 0;
margin-bottom: 4px
}
.nav-tabs .nav-link {
background-color: #eee;
border: 0;
border-color: currentcolor;
border-radius: 4px;
color: #444;
font-family: var(--font-heading), sans-serif;
font-size: 15px;
font-weight: 600;
line-height: 1;
margin: 0 10px;
padding: 15px 24px;
transition: .2s
}
.nav-tabs .nav-link.active,
.nav-tabs .nav-link:hover {
background-color: #fde1bd;
color: var(--color-brand)
}
.nav-tabs .nav-link:hover {
transform: translateY(-3px);
transition: .2s
}
.nav-tabs .nav-link:first-child {
margin-left: 0 !important;
padding-left: 0 !important
}
.nav-tabs.links .nav-link {
background: none;
color: var(--color-heading);
font-size: 16px;
padding: 0 10px
}
.nav-tabs.links .nav-link.active,
.nav-tabs.links .nav-link:hover {
color: var(--color-brand)
}
.nav-tabs.no-border {
border: none
}
.nav-tabs.right .nav-item:last-child .nav-link {
margin-right: 0
}
.nav.right {
justify-content: end
}
.dashboard-menu ul {
margin: 0;
padding: 0
}
.dashboard-menu ul li {
border: 1px solid #ececec;
border-radius: 10px;
position: relative
}
.dashboard-menu ul li a {
color: var(--color-text);
font-family: var(--font-heading), sans-serif;
font-size: 16px;
font-weight: 700;
padding: 15px 30px
}
.dashboard-menu ul li a i {
color: var(--color-text);
font-size: 19px;
opacity: .6
}
.dashboard-menu ul li a.active {
background-color: #B99B3C;
border-radius: 10px;
color: #fff !important;
}
.dashboard-menu ul li a.active i {
color: #fff
}
.dashboard-menu ul li:not(:last-child) {
margin-bottom: 10px
}
.tab-header {
align-items: center;
display: flex;
justify-content: space-between
}
.tab-header .view-more {
border-bottom: 2px solid #cce7d0;
display: flex;
font-family: var(--font-heading), sans-serif;
font-size: 13px;
font-weight: 700;
margin-bottom: 20px
}
.tab-header .view-more i {
margin-left: 5px;
margin-top: 5px;
transition: .5s
}
.tab-header .view-more:hover i {
transform: translateX(5px);
transition: .5s
}
.deals-countdown .countdown-section {
background-color: #fff;
border: none;
border-radius: 4px;
font-size: 12px;
font-weight: 400;
line-height: 1;
margin-bottom: 2rem;
margin-left: 7px;
margin-right: 7px;
padding: 20px 5px 30px;
position: relative
}
.deals-countdown .countdown-section .countdown-amount {
color: var(--color-brand);
display: inline-block;
font-family: var(--font-heading), sans-serif;
font-size: 20px;
font-weight: 500;
height: 50px;
line-height: 1;
line-height: 50px;
margin-bottom: 15px;
text-align: center;
width: 50px
}
.deals-countdown .countdown-section .countdown-period {
bottom: 10px;
color: var(--color-text);
display: block;
font-size: 16px;
left: 0;
overflow: hidden;
padding-left: 0;
padding-right: 0;
position: absolute;
right: 0;
text-align: center;
text-transform: capitalize;
width: 100%
}
.img-grey-hover {
filter: grayscale(1);
opacity: .5;
transition-duration: .3s
}
.img-grey-hover:hover {
filter: none;
opacity: 1;
transition-duration: .3s
}
.brand-logo img {
display: inline-block;
padding: 10px 0;
width: auto
}
.heading-tab {
align-items: center;
flex-direction: row;
justify-content: space-between;
text-align: left
}
.preloader {
background-color: #fff;
bottom: 0;
height: 100%;
left: 0;
margin: 0 auto;
position: fixed;
right: 0;
top: 0;
transition: .6s;
width: 100%;
z-index: 999999
}
.preloader img.jump {
max-height: 100px
}
.bar,
.loader {
height: 20px;
width: 100px
}
.bar {
align-items: center;
display: flex;
position: absolute
}
.bar:after,
.bar:before {
animation: slideleft 3s ease-in-out infinite;
background: var(--color-brand);
border-radius: 10px;
content: "";
display: block;
height: 10px;
opacity: 0;
position: absolute;
width: 10px
}
.bar1:before {
animation-delay: 0s
}
.bar1:after {
animation-delay: .3s
}
.bar2:before {
animation-delay: .6s
}
.bar2:after {
animation-delay: .9s
}
.bar3:before {
animation-delay: 1.2s
}
.bar3:after {
animation-delay: 1.5s
}
.page-header .page-title {
font-size: 4rem;
font-weight: 900
}
.page-header.breadcrumb-wrap {
background-color: #fff;
border-bottom: 1px solid #ececec;
font-family: var(--font-heading), sans-serif;
padding: 20px
}
.breadcrumb {
background: none;
border-radius: 0;
color: var(--color-text);
display: inline-block;
font-size: 14px;
font-weight: 600;
margin: 0;
padding: 0;
text-transform: capitalize
}
.breadcrumb span {
padding: 0 10px;
position: relative;
text-align: center
}
/*.breadcrumb span:before {*/
/*content: "";*/
/*display: inline-block;*/
/*font-family: uicons-regular-straight !important;*/
/*font-size: 9px*/
/*}*/
.text-center.social-icons ul {
display: inline-block
}
.social-icons li {
float: left;
list-style: none
}
.social-icons li a {
background: 0 0;
border: 0;
border-radius: 4px;
color: #333;
float: left;
font-size: 16px;
margin: 0 4px 4px 0;
overflow: hidden;
text-align: center;
transition: all .3s ease
}
.dark .social-icons li a {
color: #fff
}
.social-icons.social-icons-colored a,
.social-icons.social-icons-colored-hover a:hover {
border: 0;
color: #fff !important
}
.social-icons.social-icons-colored .social-rss a,
.social-icons.social-icons-colored .social-snapchat a,
.social-icons.social-icons-colored-hover .social-rss a:hover,
.social-icons.social-icons-colored-hover .social-snapchat a:hover {
background-color: #faa33d
}
.social-icons.social-icons-colored .social-facebook a,
.social-icons.social-icons-colored-hover .social-facebook a:hover {
background-color: #5d82d1
}
.social-icons.social-icons-colored .social-twitter a,
.social-icons.social-icons-colored-hover .social-twitter a:hover {
background-color: #40bff5
}
.social-icons.social-icons-colored .social-vimeo a,
.social-icons.social-icons-colored-hover .social-vimeo a:hover {
background-color: #35c6ea
}
.social-icons.social-icons-colored .social-myspace a,
.social-icons.social-icons-colored-hover .social-myspace a:hover {
background-color: #008dde
}
.social-icons.social-icons-colored .social-youtube a,
.social-icons.social-icons-colored-hover .social-youtube a:hover {
background-color: #ef4e41
}
.social-icons.social-icons-colored .social-instagram a,
.social-icons.social-icons-colored-hover .social-instagram a:hover {
background-color: #e53d00
}
.social-icons.social-icons-colored .social-gplus a,
.social-icons.social-icons-colored-hover .social-gplus a:hover {
background-color: #d68400
}
.social-icons.social-icons-colored .social-stumbleupon a,
.social-icons.social-icons-colored-hover .social-stumbleupon a:hover {
background-color: #ff5c30
}
.social-icons.social-icons-colored .social-lastfm a,
.social-icons.social-icons-colored-hover .social-lastfm a:hover {
background-color: #f34320
}
.social-icons.social-icons-colored .social-pinterest a,
.social-icons.social-icons-colored-hover .social-pinterest a:hover {
background-color: #e13138
}
.social-icons.social-icons-colored .social-google a,
.social-icons.social-icons-colored-hover .social-google a:hover {
background-color: #eb5e4c
}
.social-icons.social-icons-colored .social-evernote a,
.social-icons.social-icons-colored-hover .social-evernote a:hover {
background-color: #9acf4f
}
.social-icons.social-icons-colored .social-dribbble a,
.social-icons.social-icons-colored-hover .social-dribbble a:hover {
background-color: #f7659c
}
.social-icons.social-icons-colored .social-skype a,
.social-icons.social-icons-colored-hover .social-skype a:hover {
background-color: #13c1f3
}
.social-icons.social-icons-colored .social-forrst a,
.social-icons.social-icons-colored-hover .social-forrst a:hover {
background-color: #45ad76
}
.social-icons.social-icons-colored .social-linkedin a,
.social-icons.social-icons-colored-hover .social-linkedin a:hover {
background-color: #238cc8
}
.social-icons.social-icons-colored .social-wordpress a,
.social-icons.social-icons-colored-hover .social-wordpress a:hover {
background-color: #2592c3
}
.social-icons.social-icons-colored .social-grooveshark a,
.social-icons.social-icons-colored-hover .social-grooveshark a:hover {
background-color: #ffb21d
}
.social-icons.social-icons-colored .social-delicious a,
.social-icons.social-icons-colored-hover .social-delicious a:hover {
background-color: #377bda
}
.social-icons.social-icons-colored .social-behance a,
.social-icons.social-icons-colored-hover .social-behance a:hover {
background-color: #1879fd
}
.social-icons.social-icons-colored .social-dropbox a,
.social-icons.social-icons-colored-hover .social-dropbox a:hover {
background-color: #17a3eb
}
.social-icons.social-icons-colored .social-soundcloud a,
.social-icons.social-icons-colored-hover .social-soundcloud a:hover {
background-color: #ff7e30
}
.social-icons.social-icons-colored .social-deviantart a,
.social-icons.social-icons-colored-hover .social-deviantart a:hover {
background-color: #6a8a7b
}
.social-icons.social-icons-colored .social-yahoo a,
.social-icons.social-icons-colored-hover .social-yahoo a:hover {
background-color: #ab47ac
}
.social-icons.social-icons-colored .social-flickr a,
.social-icons.social-icons-colored-hover .social-flickr a:hover {
background-color: #ff48a3
}
.social-icons.social-icons-colored .social-digg a,
.social-icons.social-icons-colored-hover .social-digg a:hover {
background-color: #75788d
}
.social-icons.social-icons-colored .social-blogger a,
.social-icons.social-icons-colored-hover .social-blogger a:hover {
background-color: #ff9233
}
.social-icons.social-icons-colored .social-tumblr a,
.social-icons.social-icons-colored-hover .social-tumblr a:hover {
background-color: #426d9b
}
.social-icons.social-icons-colored .social-quora a,
.social-icons.social-icons-colored-hover .social-quora a:hover {
background-color: #ea3d23
}
.social-icons.social-icons-colored .social-github a,
.social-icons.social-icons-colored-hover .social-github a:hover {
background-color: #3f91cb
}
.social-icons.social-icons-colored .social-amazon a,
.social-icons.social-icons-colored-hover .social-amazon a:hover {
background-color: #ff8e2e
}
.social-icons.social-icons-colored .social-xing a,
.social-icons.social-icons-colored-hover .social-xing a:hover {
background-color: #1a8e8c
}
.social-icons.social-icons-colored .social-wikipedia a,
.social-icons.social-icons-colored-hover .social-wikipedia a:hover {
background-color: #b3b5b8
}
.social-icons.social-icons-border li a {
background: 0 0;
border: 1px solid #d7d7d7;
color: #333
}
.dark .social-icons.social-icons-border li a {
border: 1px solid #333 !important
}
.dark .social-icons li a .social-icons.social-icons-dark li a {
background: #888;
color: #fff
}
.social-icons.social-icons-light li a {
background: #fff;
border: 1px solid #ececec;
color: #333
}
.social-icons.social-icons-rounded li a {
border-radius: 50%
}
.social-icons.social-icons-square li a {
border-radius: 0
}
.social-icons.social-icons-xs li a {
font-size: 12px;
height: 20px;
line-height: 20px;
width: 20px
}
.social-icons.social-icons-sm li a {
font-size: 13px;
height: 30px;
line-height: 30px;
width: 30px
}
.social-icons.social-icons-md li a {
font-size: 16px;
height: 38px;
line-height: 38px;
width: 38px
}
.social-icons.social-icons-lg li a {
font-size: 18px;
height: 42px;
line-height: 42px;
width: 42px
}
.social-icons.social-icons-xl li a {
font-size: 18px;
height: 48px;
line-height: 48px;
width: 48px
}
.dark .social-icons:not(.social-icons-colored):not(.social-icons-colored-hover) li a:hover {
background-color: #1f1f1f
}
.social-icons li:hover i {
animation: toTopFromBottom .2s forwards
}
.leaflet-map {
height: 350px;
width: 100%
}
table {
border-collapse: collapse;
margin-bottom: 1.5rem;
vertical-align: middle;
width: 100%
}
table td,
table th {
border: 1px solid #ececec;
padding: 10px 20px;
vertical-align: middle
}
table thead>tr>th {
border-bottom: 0;
vertical-align: middle
}
table p {
margin-bottom: 0
}
table.clean td,
table.clean th {
border: 0;
border-top: 1px solid #ececec
}
table .product-thumbnail img {
max-width: 80px
}
.divider {
height: 4px;
overflow: hidden;
position: relative;
z-index: 9
}
.divider.center_icon {
height: auto;
text-align: center
}
.divider:after,
.divider:before {
border-top: 1px solid #ececec;
content: "";
height: 0;
left: 0;
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 100%
}
.divider:before {
margin-top: -1px
}
.divider:after {
margin-top: 1px
}
.divider i {
background-color: #fff;
color: #aaa;
font-size: 20px;
line-height: 1;
padding: 0 20px;
position: relative;
z-index: 1
}
.divider-2 {
background-color: #ececec;
height: 1px;
width: 100%
}
.bg-square {
background-color: #f3fbf5;
bottom: auto;
height: 100%;
left: auto;
max-height: 1200px;
max-width: 45%;
min-width: 300px;
position: absolute;
right: 0;
top: 150px;
width: 100%;
z-index: -1
}
.mobile-promotion {
display: none
}
.bg-green {
background-color: #cee8e0
}
.custom-modal .modal-dialog {
border: 0;
border-radius: 0;
max-width: 888px !important;
overflow: hidden
}
.custom-modal .modal-dialog .modal-content {
border: 1px solid rgba(var(--color-brand-rgb), .4);
border-radius: 25px;
padding: 40px
}
.custom-modal .modal-dialog .btn-close {
position: absolute;
right: 30px;
top: 30px;
z-index: 2
}
.zoomContainer,
.zoomWindow {
z-index: 9999
}
.single-product .zoomContainer,
.single-product .zoomWindow {
z-index: 99
}
.banner-left-icon {
background: #B99B3C1A;
border-radius: 10px;
padding: 20px;
position: relative
}
.banner-left-icon:hover .banner-icon {
transform: translateY(-5px);
transition-duration: .3s
}
.banner-left-icon .banner-icon {
margin-right: 20px;
max-width: 60px;
transition-duration: .3s
}
.banner-left-icon .banner-text h3 {
color: var(--color-grey-2);
font-size: 18px;
font-weight: 600;
margin-bottom: 5px
}
.banner-left-icon .banner-text p {
color: var(--color-grey-4);
margin-bottom: 0;
font-size: 13px;
line-height: 1.2;
}
.banner-left-icon.style-2 {
border: 1px solid #ececec;
padding: 20px;
position: relative
}
.banner-img {
clear: both;
overflow: hidden;
position: relative
}
.banner-img,
.banner-img img {
border-radius: 10px
}
.banner-img:hover img {
opacity: .9
}
.banner-img.banner-1.home-3 {
border-radius: 10px;
margin-bottom: 24px;
max-height: 348px;
overflow: hidden
}
.banner-img.banner-2 .banner-text {
right: 10px
}
.banner-img .banner-text {
padding: 0 50px;
position: absolute;
top: 50%;
transform: translateY(-50%);
z-index: 2
}
.banner-img .banner-text span {
color: var(--color-grey-4)
}
.banner-img .banner-text h4 {
font-weight: 700;
margin-bottom: 15px;
min-height: 100px
}
.banner-img .banner-text:hover h4 {
transform: translateY(-5px)
}
.banner-img .banner-text a i {
font-size: 10px;
margin-left: 5px;
transition-duration: .3s
}
.banner-img .banner-text a:hover i {
margin-left: 10px;
transition-duration: .3s
}
.banner-img.style-2 {
background: url(../imgs/shop-banner.png) no-repeat bottom !important;
background-size: cover;
border-radius: 15px;
height: 400px;
overflow: hidden;
width: 100%
}
.banner-img.style-2 .banner-text {
top: 50px;
transform: none
}
.banner-img.style-3 {
background: url(../imgs/banner/banner-11.png) no-repeat bottom;
background-size: cover;
border-radius: 15px;
height: 538px;
overflow: hidden;
width: 100%
}
.banner-img.style-3 .banner-text {
top: 50px;
transform: none
}
.banner-img.style-4 .banner-text h4 {
font-size: 28px
}
.banner-img.style-5 .banner-text {
padding: 0 30px;
right: 0
}
.banner-img.style-6 .banner-text {
padding: 0 20px 0 0;
right: 0
}
.banner-img.style-6 .banner-text h6 {
font-size: 16px
}
.banner-big .btn {
background: var(--color-brand) !important;
border: 0;
border-radius: 3px;
color: #fff;
font-size: 13px;
padding: 10px 22px
}
.banner-big .btn:hover {
background: var(--color-brand-2) !important
}
.deal {
background-color: #fff;
background-position: 100%;
background-repeat: no-repeat;
background-size: contain;
display: flex;
flex-flow: row wrap;
min-height: 420px
}
.deal,
.deal>div {
width: 100%
}
.deal h2 {
color: var(--color-danger);
font-size: 26px;
font-weight: 600;
line-height: 1.1;
margin-bottom: 5px
}
.deal h5 {
color: var(--color-grey-2);
font-weight: 400;
letter-spacing: 0;
margin-bottom: 20px;
max-width: 240px
}
.deal .deal-content {
align-self: center
}
.deal .product-title {
font-size: 45px;
line-height: 1.23;
margin-bottom: 20px;
max-width: 57%
}
.deal .product-title a {
color: var(--color-grey-1)
}
.deal .btn {
background: var(--color-brand);
border: 0;
border-radius: 4px;
color: #fff;
font-size: 14px;
padding: 10px 24px
}
.deal .btn i {
font-size: 12px;
margin-left: 5px;
transition-duration: .3s
}
.deal .btn:hover i {
margin-left: 10px;
transition-duration: .3s
}
.deal .deal-bottom {
align-self: flex-end
}
.deal .deal-bottom .deals-countdown {
margin-bottom: 20px;
margin-left: -12px
}
.deal .deal-bottom .deals-countdown .countdown-section {
border: 2px solid var(--color-brand);
box-shadow: 20px 20px 54px rgba(0, 0, 0, .03)
}
.banner-bg {
background-position: 50%;
background-size: cover;
padding: 50px
}
.banner-features {
border: 1px solid #ececec;
border-radius: 4px;
box-shadow: 20px 20px 54px rgba(0, 0, 0, .03);
padding: 25px 15px;
text-align: center
}
.banner-features:hover {
box-shadow: 20px 20px 54px rgba(0, 0, 0, .05)
}
.banner-features img {
display: inline-block;
margin-bottom: 15px
}
.banner-features h4 {
border-radius: 4px;
color: var(--color-brand);
display: inline-block;
font-size: 13px;
font-weight: 700;
line-height: 1;
padding: 9px 8px 6px
}
.image-viewer__item {
background-color: #eee;
border: 1px solid #c4c6cf;
height: 70px;
margin-right: 2px;
margin-top: 5px;
position: relative;
text-align: initial;
transition: all .3s cubic-bezier(.46, .03, .52, .96);
width: 70px
}
.image-viewer__item img {
height: 100%;
-o-object-fit: contain;
object-fit: contain;
width: 100%
}
.image-upload__uploader-container {
display: inline-block
}
.image-upload__uploader-container:hover {
cursor: pointer
}
.image-upload__uploader-container .image-upload__uploader {
align-items: center;
border: 1px dashed #c4c6cf;
display: flex;
flex-direction: column;
height: 70px;
justify-content: center;
position: relative;
width: 70px
}
.image-upload__uploader-container .image-upload__uploader:hover {
background: #d9edf7
}
.image-upload__uploader-container .image-upload__uploader:hover .image-upload__file-input {
cursor: pointer
}
.image-upload__icon {
color: #333;
font-size: 20px;
margin-bottom: 8px
}
.image-upload__text {
color: #333;
font-size: 10px;
padding: 0 3px;
text-align: center
}
.image-upload__file-input {
height: 100%;
left: 0;
opacity: 0;
position: absolute;
top: 0;
width: 100%
}
.image-viewer__item {
display: inline-block
}
.image-viewer__list {
display: block;
width: 100%
}
.image-viewer__icon-remove {
cursor: pointer;
position: absolute;
right: 2px;
top: -1px;
z-index: 1
}
.image-viewer__icon-remove i {
background: #848484;
border-radius: 50%;
color: #fff;
display: inline-block;
font-size: 10px;
height: 20px;
line-height: 20px;
text-align: center;
width: 20px
}
.image-viewer__list.is-loading .loading {
display: block !important
}
.help-block {
background-color: #d9edf7;
border: 1px solid #bce8f1;
cursor: help;
display: block;
font-size: .9em;
margin-bottom: 10px;
margin-top: 5px;
padding: 5px
}
.image-upload__viewer .image-viewer__list .loading {
background-color: rgba(146, 162, 177, .52);
display: none;
position: absolute;
top: 0;
width: 100%
}
.image-upload__viewer .image-viewer__list .loading .half-circle-spinner {
height: 30px;
width: 30px
}
.block--review .block__header .block__info {
width: 100%
}
.block--review .lh-1 {
line-height: 1
}
.block--review .block__images a {
border: 1px solid #dee2e6;
border-radius: .25rem !important;
display: inline-block;
height: 100px;
margin-bottom: 5px;
margin-right: 5px;
width: 100px
}
.block--review .block__images a img {
border: none;
-o-object-fit: cover;
object-fit: cover
}
.block--review .block__images .more-review-images span {
align-items: center;
align-self: center;
background: rgba(0, 0, 0, .5);
bottom: 0;
color: #fff;
display: flex;
font-size: 22px;
justify-content: center;
left: 0;
position: absolute;
right: 0;
top: 0;
z-index: 1
}
.block--review .block__images.block__images_total a {
border: 0;
height: -moz-fit-content;
height: fit-content;
margin: 0;
padding: 1.5px;
width: inherit
}
.block__content {
position: relative
}
.block__content .review__loading {
align-items: center;
background: rgba(0, 0, 0, .03);
display: flex;
height: 100%;
position: absolute;
top: 0;
width: 100%;
z-index: 31
}
.product-reviews-container {
position: relative
}
.product-reviews-container .loading-spinner {
align-items: center;
background: hsla(0, 0%, 100%, .5);
display: flex;
height: 100%;
justify-content: center;
left: 0;
position: absolute;
top: 0;
width: 100%
}
.product-reviews-container .loading-spinner:after {
animation: lds-dual-ring .5s linear infinite;
border-color: var(--color-brand) transparent var(--color-brand) transparent;
border-radius: 50%;
border-style: solid;
border-width: 1px;
content: " ";
display: block;
height: 40px;
width: 40px
}
@keyframes lds-dual-ring {
0% {
transform: rotate(0deg)
}
to {
transform: rotate(1turn)
}
}
.hero-2 {
min-height: 640px;
padding: 160px 0 100px
}
.hero-3 {
align-items: center;
background: url(../imgs/page/home-6-bg.html) no-repeat 50%;
background-size: cover;
display: flex;
flex-basis: content;
flex-direction: column;
height: 330px;
justify-content: center
}
.hero-3 form {
background-color: #fff;
border-radius: 50px;
box-shadow: 20px 20px 40px rgba(0, 0, 0, .07);
max-width: 520px
}
.hero-3 form input {
background: url(../imgs/theme/icons/icon-search.png) no-repeat 25px;
border: 0;
border-radius: 50px 0 0 50px;
padding-left: 58px
}
.hero-3 form button {
border: 0;
border-radius: 50px
}
.hero-3 .nav-link {
font-size: 14px !important
}
.parallax-wrapper {
position: absolute;
width: 100%;
z-index: 3
}
.parallax-wrapper .parallax-img-area {
display: flex;
margin: 0 auto;
position: relative;
z-index: 2
}
.parallax-wrapper .parallax-img-area .parallax-img {
position: absolute;
text-align: right;
z-index: 2
}
.parallax-wrapper .parallax-img-area .parallax-img.img-1 {
right: 0;
top: 100px;
width: 52%;
z-index: 2
}
.parallax-wrapper .parallax-img-area .parallax-img.img-2 {
right: 220px;
top: 40px;
width: 52%;
z-index: 3
}
.parallax-wrapper .parallax-img-area .parallax-img.img-3 {
left: -210px;
opacity: .1 !important;
top: 193px;
width: 320px
}
.parallax-wrapper .parallax-img-area .parallax-img.img-4 {
left: 50%;
opacity: .08 !important;
width: 180px
}
.parallax-wrapper .parallax-img-area .parallax-img.img-5 {
bottom: 20%;
opacity: .3;
right: 0;
width: 12%;
z-index: 2
}
.parallax-wrapper .parallax-img-area .parallax-img.img-6 {
bottom: 0;
left: -150px;
opacity: .2;
width: 25%;
z-index: 3
}
.parallax-wrapper .parallax-img-area .parallax-img.img-7 {
left: 10%;
opacity: .2 !important;
top: 10%;
width: 16%
}
.parallax-wrapper .parallax-img-area .parallax-img.img-8 {
bottom: 40%;
left: 50%;
opacity: .2 !important;
width: 10%
}
.hero-content {
position: absolute;
width: 100%;
z-index: 4
}
.hero-content h1 {
line-height: 1.1
}
.about-count {
background: url(../imgs/page/about-9.html) no-repeat 50%;
border-radius: 15px;
color: #fff;
overflow: hidden;
padding: 100px 0;
position: relative;
z-index: 100
}
.about-count:after {
background: #4b675a;
bottom: 0;
content: "";
left: 0;
opacity: .8;
position: absolute;
right: 0;
top: 0;
z-index: 2
}
.about-count h1 {
color: #fff;
font-size: 72px
}
.about-count h4 {
color: #fff
}
.about-count .text-center {
position: relative;
z-index: 3
}
.hero-card-icon {
align-items: center;
border-radius: 5px;
display: flex;
height: 65px;
justify-content: center;
margin-bottom: 20px;
transition: all .3s ease;
width: 65px
}
.hero-card-icon.icon-left {
align-items: start;
width: 165px
}
.single-content>ol {
list-style-type: decimal;
margin-bottom: 30px;
padding-left: 1em
}
.single-content>ol li:not(:last-child) {
margin-bottom: 16px
}
.single-content>ol ol {
list-style-type: lower-alpha;
margin: 20px 0 30px;
padding-left: 25px
}
.single-content>ol ol ol {
list-style-type: lower-roman
}
.page-404 {
background-color: #fff
}
.page-404 img {
max-width: 300px
}
.page-404 img.logo {
max-width: 150px
}
.page-404 .search-form {
margin: 0 auto;
max-width: 400px
}
.product-cart-wrap {
background-color: #fff;
border: 1px solid #ececec;
border-radius: 15px;
overflow: hidden;
position: relative
}
.product-cart-wrap,
.product-cart-wrap:hover {
transition: .2s;
-moz-transition: .2s;
-webkit-transition: .2s;
-o-transition: .2s
}
.product-cart-wrap:hover {
border: 1px solid #b99b3c91;
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05)
}
.product-cart-wrap .product-img-action-wrap {
background-color: #fff;
max-height: 320px;
overflow: hidden;
padding: 25px 25px 0;
position: relative
}
.product-cart-wrap .product-img-action-wrap .product-img {
border-radius: 15px;
overflow: hidden;
position: relative
}
.product-cart-wrap .product-img-action-wrap .product-img a {
display: flex;
overflow: hidden
}
.product-cart-wrap .product-img-action-wrap .product-img a img {
width: 100%
}
.product-cart-wrap .product-img-action-wrap .product-img a img.hover-img {
left: 0;
opacity: 0;
position: absolute;
top: 0;
transition: opacity .25s, visibility .25s, transform 1.5s cubic-bezier(0, 0, .2, 1);
visibility: hidden;
z-index: 2
}
.product-cart-wrap .product-img-action-wrap .product-img-zoom a img {
transition: all 1.5s cubic-bezier(0, 0, .05, 1);
padding: 15px;
}
.product-cart-wrap .product-action-1 {
left: 0;
opacity: 0;
position: absolute;
right: 0;
top: 50%;
transition: all .3s ease 0s;
visibility: hidden;
z-index: 9
}
.product-cart-wrap .product-action-1 .product-action-wrap {
background-color: #fff;
border: 1px solid rgba(var(--color-brand-rgb), .4);
border-radius: 5px;
box-shadow: 20px 20px 40px rgba(0, 0, 0, .07);
margin: 0 auto;
max-width: 114px
}
.product-cart-wrap .product-action-1.show {
bottom: 26px;
left: unset;
opacity: 1;
right: 20px;
top: unset;
transform: none;
visibility: visible
}
.product-cart-wrap .product-action-1 a.action-btn,
.product-cart-wrap .product-action-1 button {
border-right: 1px solid rgba(var(--color-brand-rgb), .4);
display: inline-block;
height: 35px;
line-height: 40px;
position: relative;
text-align: center;
width: 35px
}
.product-cart-wrap .product-action-1 a.action-btn:last-child,
.product-cart-wrap .product-action-1 button:last-child {
border: none
}
.product-cart-wrap .product-action-1 a.action-btn.small,
.product-cart-wrap .product-action-1 button.small {
height: 32px;
line-height: 32px;
width: 32px
}
.product-cart-wrap .product-action-1 a.action-btn.small i,
.product-cart-wrap .product-action-1 button.small i {
font-size: 12px
}
.product-cart-wrap .product-action-1 a.action-btn:after,
.product-cart-wrap .product-action-1 button:after {
background-color: var(--color-brand);
border-radius: 5px;
bottom: 100%;
box-shadow: 4px 4px 8px rgba(0, 0, 0, .1);
color: #fff;
content: attr(aria-label);
font-size: 11px;
left: 50%;
line-height: 1.3;
opacity: 0;
padding: 7px 10px;
position: absolute;
transform: translateX(-50%) translateY(0);
transition-delay: .1s;
transition: opacity .3s ease, visibility .3s ease, transform .3s cubic-bezier(.71, 1.7, .77, 1.24);
visibility: hidden;
white-space: nowrap
}
.product-cart-wrap .product-action-1 a.action-btn:before,
.product-cart-wrap .product-action-1 button:before {
border: 7px solid transparent;
border-top: 7px solid var(--color-brand);
bottom: 100%;
content: "";
left: calc(50% - 7px);
margin-bottom: -13px;
opacity: 0;
position: absolute;
transition-delay: .1s;
transition: opacity .3s ease, visibility .3s ease, transform .3s cubic-bezier(.71, 1.7, .77, 1.24);
visibility: hidden;
z-index: 9
}
.product-cart-wrap .product-action-1 a.action-btn:last-child,
.product-cart-wrap .product-action-1 button:last-child {
margin-right: 0
}
.product-cart-wrap .product-action-1 a.action-btn i,
.product-cart-wrap .product-action-1 button i {
font-size: 15px;
margin-left: 1px
}
.product-cart-wrap .product-action-1 a.action-btn:hover,
.product-cart-wrap .product-action-1 button:hover {
color: var(--color-brand-2)
}
.product-cart-wrap .product-action-1 a.action-btn:hover:after,
.product-cart-wrap .product-action-1 button:hover:after {
opacity: 1;
transform: translateX(-50%) translateY(-8px);
visibility: visible
}
.product-cart-wrap .product-action-1 a.action-btn:hover:before,
.product-cart-wrap .product-action-1 button:hover:before {
opacity: 1;
transform: translateY(-8px);
visibility: visible
}
.product-cart-wrap .product-action-1 a.action-btn:hover i,
.product-cart-wrap .product-action-1 button:hover i {
color: var(--color-brand-2)
}
.product-cart-wrap .product-badges {
display: flex
}
.product-cart-wrap .product-badges.product-badges-mrg {
margin: 0 0 10px
}
.product-cart-wrap .product-badges.product-badges-position {
left: 0;
position: absolute;
top: 0;
z-index: 9
}
.product-cart-wrap .product-badges span {
border-radius: 15px 0 20px 0;
color: #fff;
display: inline-block;
font-size: 12px;
line-height: 1;
padding: 9px 20px 10px
}
.product-cart-wrap .product-badges span:last-child {
margin-right: 0
}
.product-cart-wrap .product-badges span.hot {
background-color: #f74b81
}
.product-cart-wrap .product-badges span.new {
background-color: var(--color-brand)
}
.product-cart-wrap .product-badges span.sale {
background-color: #67bcee
}
.product-cart-wrap .product-badges span.best {
background-color: #f59758
}
.product-cart-wrap .product-content-wrap {
padding: 0 20px 50px
}
.product-cart-wrap .product-content-wrap .product-category {
margin-bottom: 5px
}
.product-cart-wrap .product-content-wrap .product-category a {
color: var(--color-grey-4);
font-size: 12px
}
.product-cart-wrap .product-content-wrap .product-category a:hover {
color: var(--color-brand)
}
.product-cart-wrap .product-content-wrap h2 {
font-size: 15px;
font-weight: 700;
margin-bottom: 5px;
text-align: left;
}
.product-cart-wrap .product-content-wrap h2 a {
color: var(--color-heading)
}
.product-cart-wrap .product-content-wrap h2 a:hover {
color: var(--color-brand)
}
.product-cart-wrap .product-content-wrap .product-price {
padding-top: 0px;
padding-bottom: 0px;
}
.product-cart-wrap .product-content-wrap .product-price span {
color: var(--color-brand);
display: inline-block;
font-size: 18px;
font-weight: 700;
margin-inline-end: 7px;
white-space: nowrap
}
.product-cart-wrap .product-content-wrap .product-price span.new-price {
color: var(--color-brand)
}
.product-cart-wrap .product-content-wrap .product-price span.old-price {
color: var(--color-grey-4);
font-size: 14px;
margin-inline-end: 0;
text-decoration: line-through
}
.product-cart-wrap .product-content-wrap .rating-result {
display: flex
}
.product-cart-wrap .product-content-wrap .rating-result>span {
display: block;
margin-left: 5px;
overflow: hidden
}
.product-cart-wrap .product-content-wrap .rating-result:before {
color: var(--color-warning);
content: "" "" "" "" "";
font-family: uicons-regular-straight !important;
font-size: 11px;
letter-spacing: 2px
}
.product-cart-wrap .product-content-wrap .add-to-cart {
background-color: #f5f5f5;
border-radius: 5px;
bottom: 25px;
color: var(--color-grey-1);
display: block;
font-size: 16px;
font-weight: 300;
height: 44px;
line-height: 44px;
position: absolute;
right: 20px;
text-align: center;
width: 44px
}
.product-cart-wrap .product-content-wrap .add-to-cart:hover {
background-color: var(--color-brand);
color: #fff
}
.product-cart-wrap .product-content-wrap .add-to-cart img {
display: inline-block;
margin-top: 11px;
width: 20px
}
.product-cart-wrap .product-card-bottom {
align-items: center;
display: flex;
gap: 10px;
justify-content: space-between;
line-height: 20px;
margin-top: 15px
}
.product-cart-wrap .product-card-bottom .product-price {
padding-top: 0
}
.product-cart-wrap .product-card-bottom .add-cart {
cursor: pointer;
flex-shrink: 0
}
.product-cart-wrap .product-card-bottom .add-cart .add {
background-color: rgba(var(--color-brand-rgb), .2);
border-radius: 4px;
display: inline-block;
font-size: 14px;
font-weight: 700;
padding: 10px 20px;
position: relative
}
.product-cart-wrap .product-card-bottom .add-cart .add:hover {
background-color: var(--color-brand);
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
color: #fff;
transform: translateY(-3px)
}
.product-cart-wrap .product-stock .status-bar {
background-color: #ededed;
border-radius: 5px;
margin: 0 0 10px
}
.product-cart-wrap .product-stock .status-bar .sold-bar {
background-image: linear-gradient(235deg, var(--color-brand) 0, #77ccfd 100%);
border-radius: 4px;
height: 8px
}
.product-cart-wrap .product-stock .status-bar .sold-bar.sold-bar-width-33 {
width: 33.3333333333%
}
.product-cart-wrap .product-stock .status-bar .sold-bar.sold-bar-width-10 {
width: 10%
}
.product-cart-wrap .product-stock .status-bar .sold-bar.sold-bar-width-40 {
width: 40%
}
.product-cart-wrap .product-stock .status-bar .sold-bar.sold-bar-width-6 {
width: 6.6666666667%
}
.product-cart-wrap .product-stock .status-bar .sold-bar.sold-bar-width-42 {
width: 42.8571428571%
}
.product-cart-wrap .product-stock .product-stock-status {
display: flex;
flex-wrap: wrap
}
.product-cart-wrap .product-stock .product-stock-status .sold {
flex-grow: 1;
margin-right: 20px
}
.product-cart-wrap .product-stock .product-stock-status .available {
flex-shrink: 0
}
.product-cart-wrap .product-stock .product-stock-status .stock-status-same-style span {
font-size: 15px
}
.product-cart-wrap .product-stock .product-stock-status .stock-status-same-style span.label {
color: var(--color-heading)
}
.product-cart-wrap .product-stock .product-stock-status .stock-status-same-style span.value {
color: #333;
font-weight: 700
}
.product-cart-wrap .progress {
height: 5px
}
.product-cart-wrap:hover .product-img-action-wrap .product-action-1,
.product-cart-wrap:hover .product-img-action-wrap .product-img a img.hover-img {
opacity: 1;
visibility: visible
}
.product-cart-wrap:hover .product-img-zoom a img {
transform: scale3d(1.05, 1.05, 1.05) translateZ(0)
}
.product-cart-wrap.small {
border: 0;
text-align: center
}
.product-cart-wrap.small .rating-result {
justify-content: center
}
.product-cart-wrap.small .product-content-wrap {
padding: 5px 15px 0
}
.product-cart-wrap.small .product-price {
padding-top: 0
}
.product-cart-wrap.small:hover {
box-shadow: none
}
.product-cart-wrap.small h2 {
border-bottom: 0;
margin-bottom: 0;
padding: 0
}
.product-cart-wrap.small .product-badges span {
font-size: 10px
}
.product-cart-wrap.style-2 {
border: 0;
padding-bottom: 25px
}
.product-cart-wrap.style-2:hover {
border: 0;
box-shadow: none
}
.product-cart-wrap.style-2 .product-img-action-wrap {
max-height: unset;
padding: 0;
position: relative;
z-index: 1
}
.product-cart-wrap.style-2 .product-img-action-wrap img {
border-radius: 15px
}
.product-cart-wrap.style-2 .product-content-wrap {
margin-left: auto;
margin-right: auto;
margin-top: -90px;
max-width: 86%;
padding: 0;
position: relative;
transition: .3s;
-moz-transition: .3s;
-webkit-transition: .3s;
-o-transition: .3s;
z-index: 3
}
.product-cart-wrap.style-2 .product-content-wrap .deals-content {
background-color: #fff;
border-radius: 10px;
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
margin: 0 auto;
padding: 25px 30px
}
.product-cart-wrap.style-2 .product-content-wrap .deals-countdown-wrap {
position: absolute;
text-align: center;
top: -80px;
width: 100%
}
.product-cart-wrap.style-2:hover .product-content-wrap {
transform: translateY(-5px);
transition: .3s;
-moz-transition: .3s;
-webkit-transition: .3s;
-o-transition: .3s
}
.product-price {
font-family: var(--font-heading), sans-serif
}
.product-list-small article:not(:last-child) {
margin-bottom: 20px
}
.product-list-small h6 a {
color: var(--color-heading)
}
.product-list-small h6 a:hover {
color: var(--color-brand)
}
.product-list-small figure img {
border-radius: 10px
}
.product-list-small .product-price {
color: var(--color-brand);
font-size: 18px;
font-weight: 700;
margin-top: 10px
}
.product-list-small .product-price span.old-price {
color: var(--color-grey-4);
font-size: 14px;
margin: 0 0 0 7px;
text-decoration: line-through
}
.range .list-group-item {
background: none;
border: 0;
display: block;
padding: 0;
position: relative
}
.range .checkbox {
font-size: .8em
}
.range .price-filter {
display: block;
margin-top: 20px
}
.range #slider-range,
.range .slider-range {
background: var(--color-brand);
border: none;
border-radius: 0;
box-shadow: none;
color: var(--color-brand);
height: 4px
}
.range #slider-range .ui-slider-range,
.range .slider-range .ui-slider-range {
background: #222;
border: none;
border-radius: 0;
box-shadow: none
}
.range .ui-slider-handle.ui-state-default.ui-corner-all {
background: var(--color-brand);
border: none;
border-radius: 100%;
height: 14px;
line-height: 10px;
top: -5px;
width: 14px
}
.range .label-input {
margin-top: 15px
}
.range .label-input span {
color: #282828;
margin-right: 5px
}
.range .label-input input {
background: transparent;
border: none;
font-size: 14px;
font-weight: 600;
height: unset;
margin: 0;
padding-left: 0
}
.range .check-box-list {
margin-top: 15px
}
.range .check-box-list li {
margin-bottom: 5px
}
.range .check-box-list li:last-child {
margin: 0
}
.range .check-box-list li label {
color: #333;
cursor: pointer;
font-size: 14px;
font-weight: 400;
margin: 0
}
.range .check-box-list li label input {
display: inline-block;
margin-right: 6px;
position: relative;
top: 1px
}
.range .check-box-list .count {
color: #666;
margin-left: 5px
}
.btn.btn-small {
border-radius: 3px;
display: table;
line-height: 1;
min-width: unset;
padding: 10px 15px
}
.product-sidebar .single-post {
position: relative
}
.product-sidebar .single-post:not(:last-child) {
border-bottom: 1px dotted rgba(0, 0, 0, .15);
margin-bottom: 10px;
padding-bottom: 10px
}
.product-sidebar .single-post .content {
padding-left: 95px
}
.product-sidebar .single-post i {
font-size: 12px
}
.product-sidebar .image {
float: left;
height: 80px;
margin-right: 10px;
overflow: hidden;
width: 80px
}
.shop-product-filter {
align-items: center;
display: flex;
justify-content: space-between;
margin: 0 0 30px
}
.shop-product-filter.style-2 {
border-bottom: 1px solid #ececec;
padding-bottom: 20px
}
.shop-product-filter .sort-by-product-area {
display: flex;
position: relative
}
.shop-product-filter .sort-by-product-area .sort-by-cover {
position: relative
}
.shop-product-filter .sort-by-product-area .sort-by-product-wrap {
align-items: center;
background: #fff;
border: 1px solid #ececec;
border-radius: 10px;
color: #777;
cursor: pointer;
display: flex;
padding: 9px 16px;
transition: all .3s ease 0s
}
.shop-product-filter .sort-by-product-area .sort-by-product-wrap:hover {
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05)
}
.shop-product-filter .sort-by-product-area .sort-by-product-wrap .sort-by {
margin-right: 5px
}
.shop-product-filter .sort-by-product-area .sort-by-product-wrap .sort-by i {
color: #ababab;
font-size: 14px;
margin-right: 10px;
position: relative;
top: 2px
}
.shop-product-filter .sort-by-product-area .sort-by-product-wrap .sort-by span {
font-size: 13px;
font-weight: 500
}
.shop-product-filter .sort-by-product-area .sort-by-product-wrap .sort-by-dropdown-wrap span {
color: var(--color-text);
font-size: 13px;
font-weight: 500
}
.shop-product-filter .sort-by-product-area .sort-by-product-wrap .sort-by-dropdown-wrap span i {
color: var(--color-text);
font-size: 15px;
margin-left: 10px;
position: relative;
top: 2px
}
.sort-by-dropdown {
background: #fff;
border: 0;
border-radius: 5px;
box-shadow: 0 -3px 23px rgba(0, 0, 0, .06);
color: var(--color-text);
font-weight: 500;
left: 0;
min-width: 100%;
opacity: 0;
padding: 16px 0 21px;
position: absolute;
right: 0;
top: 100%;
visibility: hidden;
z-index: 99
}
.sort-by-dropdown.show {
opacity: 1;
visibility: visible
}
.sort-by-dropdown ul li {
display: block
}
.sort-by-dropdown ul li a {
color: var(--color-text);
display: block;
font-size: 13px;
font-weight: 500;
padding: 5px 30px;
position: relative
}
.sort-by-dropdown ul li a.active:before {
color: var(--color-brand);
content: "";
font-family: uicons-regular-straight !important;
font-size: 12px;
font-weight: 900;
left: 10px;
position: absolute;
top: 5px
}
.sort-by-dropdown ul li a.active:hover:before {
color: #fff
}
.sort-by-dropdown ul li a:hover {
background-color: var(--color-brand);
color: #fff
}
.product-list {
position: relative
}
.product-list .product-cart-wrap {
align-content: center;
align-items: center;
border: 0;
border-radius: 0;
display: flex;
overflow: unset
}
.product-list .product-cart-wrap:not(:last-child) {
margin-bottom: 30px
}
.product-list .product-cart-wrap:hover {
box-shadow: none
}
.product-list .product-cart-wrap:hover .product-img {
box-shadow: 0 0 20px rgba(0, 0, 0, .08)
}
.product-list .product-cart-wrap .product-badges.product-badges-position {
left: 0;
top: 0
}
.product-list .product-cart-wrap .product-img-action-wrap {
max-height: unset;
max-width: 28%;
padding: 0;
position: relative
}
.product-list .product-cart-wrap .product-img-action-wrap .product-img {
border: 1px solid #ececec;
border-radius: 15px
}
.product-list .product-cart-wrap .product-img-action-wrap .product-img .product-img-inner {
overflow: hidden;
padding: 10px
}
.product-list .product-cart-wrap .product-img-action-wrap .product-img .product-img-inner a img {
height: auto
}
.product-list .product-cart-wrap h2 {
font-size: var(--heading-font-size)
}
.product-list .product-cart-wrap .product-content-wrap .product-category a {
display: block;
font-size: 16px;
margin-top: 15px
}
.product-list .product-cart-wrap .product-content-wrap .product-price span {
font-size: var(--heading-font-size)
}
.product-list .product-cart-wrap .product-content-wrap .product-price span.old-price {
font-size: 20px
}
.product-list .product-cart-wrap .product-content-wrap .product-action-1 {
bottom: unset;
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
display: flex;
justify-content: space-between;
margin-top: 20px;
padding: 0 20px;
position: relative
}
.product-list .product-cart-wrap .product-content-wrap .product-action-1 a.action-btn {
background-color: var(--color-brand);
border: none;
border-radius: 50px;
color: #fff;
display: inline-block;
font-weight: 500;
height: 44px;
margin-right: 0;
padding: 0 23px;
position: relative;
text-align: center;
width: auto
}
.product-list .product-cart-wrap .product-content-wrap .product-action-1 a.action-btn i {
color: #fff;
margin-right: 8px
}
.detail-gallery {
position: relative
}
.detail-gallery .zoom-icon {
font-size: 22px;
opacity: .6;
position: absolute;
right: 20px;
top: 20px;
z-index: 2
}
.product-rate {
background-position: 0 -12px;
transition: all .5s ease-out 0s;
-webkit-transition: all .5s ease-out 0s;
width: 60px
}
.product-rate,
.product-rating {
background-image: url(../imgs/theme/rating-stars.png);
background-repeat: repeat-x;
height: 12px
}
.product-rating {
background-position: 0 0
}
.list-filter {
list-style: none;
margin: 0;
padding: 0
}
.list-filter li {
display: inline-block
}
.list-filter li a {
color: #555;
display: block;
min-width: 30px;
position: relative;
text-align: center;
transition: all .5s ease-out 0s;
-webkit-transition: all .5s ease-out 0s
}
.color-filter.list-filter a span {
border-radius: 40px;
display: block;
height: 26px;
width: 26px
}
.color-filter.list-filter a span.product-color-white {
border: 1px solid #ddd
}
.color-filter.list-filter li.active a:before {
background: #4cd964;
border: 1px solid #fff;
border-radius: 50%;
content: "";
display: inline-block;
font-style: normal;
font-variant: normal;
height: 10px;
line-height: 1;
position: absolute;
right: 3px;
text-rendering: auto;
top: -3px;
width: 10px
}
.size-filter.list-filter a {
background: #fff;
border-radius: 5px;
padding: 0 9px
}
.size-filter.list-filter li a {
color: var(--color-text);
height: 32px;
line-height: 32px;
min-width: 40px;
text-align: center
}
.size-filter.list-filter li a:hover,
.size-filter.list-filter li.active a {
background-color: var(--color-brand);
border-color: var(--color-brand);
color: #fff
}
.detail-qty {
border-radius: 5px;
max-width: 80px;
padding: 9px 20px;
position: relative;
width: 100%
}
.detail-qty>a {
color: var(--color-brand);
font-size: 16px;
position: absolute;
right: 8px
}
.detail-qty>a:hover {
color: var(--color-brand-dark)
}
.detail-qty>a.qty-up {
top: 0
}
.detail-qty>a.qty-down {
bottom: -4px
}
.attr-detail .select-box select {
height: 40px;
width: 100%
}
.attr-detail.attr-brand {
margin-top: 23px
}
.attr-detail.attr-brand .select-box {
display: block;
margin-bottom: 20px
}
.attr-detail.attr-color table {
margin-bottom: 15px
}
.detail-extralink>div {
display: inline-block;
vertical-align: top
}
.detail-extralink .detail-qty {
background: #fff;
border: 2px solid var(--color-brand) !important;
border-radius: 5px;
color: var(--color-brand);
font-size: 16px;
font-weight: 700;
margin: 0 6px 15px 0;
max-width: 90px;
padding: 11px 20px 11px 30px
}
.stock-status {
border-radius: 5px;
display: inline-block;
font-family: var(--font-heading), sans-serif;
font-size: 14px;
font-weight: 700;
line-height: 1;
margin-bottom: 20px;
padding: 8px 12px
}
.stock-status.in-stock {
background: #def9ec;
color: var(--color-brand)
}
.stock-status.out-stock {
background: #fde0e9;
color: #f74b81
}
.detail-info .product-price-cover {
align-items: center;
display: flex;
justify-content: space-between
}
.detail-info .product-price-cover .product-price {
line-height: 1
}
.detail-info .product-price {
align-items: center;
display: flex;
margin: 15px 0 30px
}
.detail-info .product-price .current-price {
font-size: 50px !important;
font-weight: 900;
text-decoration: none
}
.detail-info .product-price .old-price {
color: var(--color-muted);
display: block;
font-size: 22px;
font-weight: 600;
margin-left: 20px;
text-decoration: line-through
}
.detail-info .product-price .save-price {
color: var(--color-brand-2);
display: block;
font-size: 12px;
font-weight: 600;
margin-bottom: 6px
}
.detail-info .product-meta {
border-top: 1px solid #ececec;
padding-top: 15px
}
.button.button-add-to-cart {
padding: 8px 40px
}
.product-extra-link2 a {
background: #fff none repeat scroll 0 0;
border: 1px solid #f1f1f1;
border-radius: 5px;
color: #333;
display: inline-block;
line-height: 55px;
margin: 0 5px;
position: relative;
text-align: center;
transition: all .5s ease-out 0s;
-webkit-transition: all .5s ease-out 0s;
vertical-align: top;
width: 50px
}
.product-extra-link2 a:hover {
background-color: var(--color-brand);
color: #fff
}
.product-extra-link2 a:hover i {
opacity: 1
}
.product-extra-link2 a i {
font-size: 18px;
opacity: .6
}
.product-extra-link2 .button.button-add-to-cart {
border: 0;
border-radius: 5px;
font-family: var(--font-heading), sans-serif;
font-size: 16px;
font-weight: 700;
height: 50px;
line-height: 50px;
padding: 0 20px;
position: relative
}
.product-extra-link2 .button.button-add-to-cart i {
margin-right: 10px
}
.product-info {
border: 1px solid #ececec;
border-radius: 15px;
padding: 40px 50px
}
.tab-style3 .nav-tabs .nav-item a.active,
.tab-style3 .nav-tabs .nav-item a:hover {
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
color: var(--color-brand)
}
.tab-style3 .nav-tabs li.nav-item a {
background: #fff;
border: 1px solid #ececec;
border-radius: 30px;
color: var(--color-text);
display: block;
font-family: var(--font-heading), sans-serif;
font-size: 17px;
font-weight: 700;
padding: 13px 24px !important;
text-align: center;
text-transform: none
}
.tab-content.shop_info_tab {
margin-top: 40px
}
.tab-pane .comments-area {
border: 0;
padding-top: 0
}
.product-color-red {
background: #ff596d
}
.product-color-yellow {
background: #ffdb33
}
.product-color-white {
background: #fff
}
.product-color-orange {
background: #ffbb51
}
.product-color-cyan {
background: #80e6ff
}
.product-color-green {
background: #38cf46
}
.product-color-purple {
background: #ff8ff8
}
.mail-to-friend {
color: var(--color-grey-4);
font-size: 12px
}
.mail-to-friend i {
margin-right: 5px
}
.attr-color,
.attr-size,
.product-detail-rating {
align-items: center;
display: flex
}
.product-detail-rating {
justify-content: space-between;
padding: 15px 0
}
.product-detail .section-title.style-1 {
font-size: 22px
}
.product-more-infor {
padding: 0 0 0 14px
}
.product-more-infor li {
display: flex;
margin: 0 0 10px;
position: relative
}
.product-more-infor li :before {
background-color: #9b9b9b;
border-radius: 100%;
content: "";
height: 6px;
left: -14px;
position: absolute;
top: 9px;
width: 6px
}
.product-more-infor li span {
display: inline-block;
flex: 0 0 165px
}
.product-more-infor li:last-child {
margin: 0
}
.progress+.progress {
margin-top: 1rem
}
.progress span {
background: #fff;
line-height: 16px;
padding-right: 10px;
width: 45px
}
.progress-bar {
background-color: var(--color-brand)
}
.shop-filter-toggle {
align-items: center;
border: 1px solid #ececec;
border-radius: 30px;
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
display: inline-flex;
font-family: var(--font-heading), sans-serif;
font-size: 17px;
font-weight: 700;
margin-bottom: 20px;
padding: 10px 20px;
position: relative
}
.shop-filter-toggle i {
color: var(--color-muted);
margin-left: 5px
}
.shop-filter-toggle i.angle-up {
display: none;
opacity: 0;
visibility: hidden
}
.shop-filter-toggle .fi-rs-filter {
color: var(--color-muted);
font-size: 14px
}
.shop-filter-toggle.active i.angle-up {
display: inline-block;
opacity: 1;
visibility: visible
}
.shop-filter-toggle.active i.angle-down {
display: none;
opacity: 0;
visibility: hidden
}
.shop-product-filter-header .card {
border: 1px solid #ececec;
border-radius: 20px;
box-shadow: 20px 20px 54px rgba(0, 0, 0, .03);
margin-bottom: 50px;
padding: 30px 40px
}
.shop-product-filter-header .categor-list li {
font-size: 12px
}
.shop-product-filter-header .categor-list li+li {
border-top: 1px solid #f7f8f9;
margin-top: 5px;
padding-top: 5px
}
.shop-product-filter-header .categor-list li a {
color: var(--color-text);
font-size: 14px;
margin-right: 10px
}
.shop-product-filter-header .categor-list li a:hover {
color: var(--color-brand)
}
.shop-product-filter-header .color-filter {
border-bottom: 1px solid #ececec;
margin-bottom: 20px;
padding-bottom: 20px
}
.shop-product-filter-header .product-rate-cover+.product-rate-cover {
margin-top: 15px
}
.shopping-summery table>:not(caption)>*>* {
padding: 15px 0
}
.shopping-summery table td,
.shopping-summery table th,
.shopping-summery table thead {
border: 0
}
.shopping-summery table thead th {
background-color: #ececec;
color: var(--color-heading);
font-family: var(--font-heading), sans-serif;
font-size: 17px;
font-weight: 700;
padding: 18px 0
}
.shopping-summery table thead th.start {
border-radius: 10px 0 0 10px
}
.shopping-summery table thead th.end {
border-radius: 0 10px 10px 0
}
.shopping-summery table tbody tr img {
border: 1px solid #ececec;
border-radius: 15px;
max-width: 120px
}
table.no-border td,
table.no-border th,
table.no-border thead {
border: 0
}
.cart-totals {
border-radius: 15px;
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
padding: 30px 40px
}
.order_review {
border: 1px solid #ececec;
border-radius: 10px;
padding: 30px
}
.toggle_info {
background-color: #fff;
border: 1px solid #ececec;
border-radius: 10px;
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
padding: 12px 20px
}
.coupon_form .panel-body,
.login_form .panel-body {
border: 1px solid #ececec;
border-radius: 10px;
margin-top: 30px;
padding: 30px
}
.payment_option .custome-radio {
margin-bottom: 10px
}
.payment_option .custome-radio .form-check-label {
color: #292b2c;
font-weight: 600
}
.custome-radio .form-check-label:before {
border: 1px solid #908f8f;
border-radius: 100%;
content: "";
display: inline-block;
height: 16px;
margin-right: 8px;
vertical-align: middle;
width: 16px
}
.custome-radio input[type=radio]+.form-check-label:after {
border-radius: 100%;
content: "";
height: 10px;
left: 3px;
opacity: 0;
position: absolute;
top: 8.5px;
width: 10px
}
.custome-radio input[type=radio]:checked+.form-check-label:after {
background-color: #a07f32;
opacity: 1
}
.related-products .product-img-action-wrap {
margin-bottom: 15px;
padding: 0
}
.col-lg-4-5 .product-cart-wrap .product-action-1 a.action-btn {
width: 35px
}
.col-lg-4-5 .countdown-section .countdown-amount {
width: 38px
}
.zoomWindow {
border-radius: 15px;
overflow: hidden
}
.table-wishlist {
border: 0
}
.apply-coupon {
display: flex
}
.apply-coupon input {
background-image: url(../imgs/theme/icons/coupon.png);
background-position: 20px;
background-repeat: no-repeat;
border-radius: 10px 0 0 10px;
height: 51px;
padding-left: 50px
}
.apply-coupon button {
background-color: var(--color-heading);
border-radius: 0 10px 10px 0;
height: 51px;
min-width: 150px
}
.apply-coupon button:hover {
background-color: var(--color-brand)
}
.order_table table .product-thumbnail img {
border: 1px solid #ececec;
border-radius: 15px;
max-width: 120px;
padding: 5px
}
.order_table table .w-160 {
max-width: 160px
}
.table.table-compare {
border-radius: 15px
}
.table.table-compare>:not(caption)>*>* {
padding: 30px 0
}
.mw-200 {
min-width: 200px
}
.archive-header {
background: url(../imgs/home-banner.png) no-repeat 50%;
background-size: cover;
border-radius: 20px;
padding: 70px 80px
}
.tags-list li {
display: inline-block;
margin: 0 15px 0 0
}
.tags-list li a {
background-color: #fff;
border: 1px solid #ececec;
border-radius: 30px;
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
display: inline-block;
font-family: var(--font-heading), sans-serif;
font-size: 17px;
font-weight: 700;
padding: 10px 20px
}
.tags-list li a i {
color: var(--color-muted);
font-size: 10px
}
.tags-list li.active a {
color: var(--color-heading)
}
.post-list article:not(:last-child) {
margin-bottom: 20px
}
.post-list .post-thumb {
max-width: 221px;
overflow: hidden
}
.post-list .post-thumb a {
margin-bottom: 0
}
.post-list .post-title {
font-weight: 500
}
.post-list .post-title a {
color: var(--color-grey-1)
}
.single-content {
color: var(--color-heading);
font-size: 17px;
text-rendering: optimizeLegibility
}
.single-content h1 {
font-size: 56px;
line-height: 72px;
margin-bottom: 32px
}
.single-content h2 {
font-size: 48px;
line-height: 64px;
margin-bottom: 30px
}
.single-content h3 {
font-size: 36px;
line-height: 48px;
margin-bottom: 28px
}
.single-content h4 {
font-size: 24px;
line-height: 32px;
margin-bottom: 26px
}
.single-content h5 {
font-size: 20px;
line-height: 24px;
margin-bottom: 24px
}
.single-content h6 {
font-size: 14px;
letter-spacing: .5px;
line-height: 24px;
margin-bottom: 22px;
text-transform: uppercase
}
.single-content p {
font-weight: 400;
margin-bottom: 1.2em
}
.single-content ul {
font-size: 1rem;
list-style: circle;
padding-left: 1rem
}
.single-content ul li {
margin-bottom: 7px;
position: relative
}
.single-content ol li {
font-size: 1rem
}
.single-content .single-excerpt {
font-size: 24px;
line-height: 32px
}
.single-content p {
color: var(--color-heading);
font-size: 17px
}
.single-content blockquote {
background-color: #f4f6fa;
border-radius: 15px;
font-size: 24px;
margin: 30px auto;
max-width: 80%;
padding: 40px 60px
}
.single-content blockquote p {
color: var(--color-text);
font-size: 24px;
line-height: 32px;
margin-bottom: 0
}
.single-header {
margin-bottom: 30px
}
.single-header .entry-meta.meta-1 {
align-content: center;
align-items: center;
align-self: center;
display: flex
}
.single-header .single-header-meta {
align-items: center;
display: flex;
justify-content: space-between
}
.single-header .single-header-meta .social-icons ul {
margin-top: 15px
}
.single-thumbnail {
margin-bottom: 30px
}
.single-thumbnail img {
border-radius: 15px;
overflow: hidden
}
.entry-bottom {
align-items: center;
border-top: 1px solid #ececec;
display: flex;
justify-content: space-between;
padding-top: 20px
}
.entry-bottom .social-icons ul {
margin-top: 15px
}
.entry-bottom .social-icons ul img {
opacity: .6;
width: 20px
}
.author-bio {
border: 1px solid #ececec;
border-radius: 15px
}
.author-bio .author-image {
align-content: center;
align-items: center;
display: flex
}
.author-bio .author-image img {
margin-right: 10px
}
.author-bio .author-image p {
font-size: 14px
}
.entry-meta {
line-height: 1
}
.entry-meta.meta-2 .author-img img {
border-radius: 50%;
height: 40px;
width: 40px
}
.entry-meta.meta-2 .author-name {
display: inline-block;
font-size: 14px;
font-weight: 600;
margin-top: 5px;
text-transform: uppercase
}
.entry-meta.meta-2 a.btn {
align-items: center;
align-self: center;
display: flex
}
.entry-meta .author-add {
font-size: 12px
}
.entry-meta.meta-1 span {
margin-right: 10px
}
.entry-meta.meta-1 a.text-brand {
align-items: center;
display: flex
}
.entry-meta.meta-1 a.text-brand i {
margin-left: 5px
}
.entry-meta.meta-0 span {
border-radius: 30px;
font-size: 11px;
font-weight: 700;
letter-spacing: .8px;
margin-left: -5px;
padding: 4px 10px 4px 19px;
position: relative;
text-transform: uppercase
}
.entry-meta.meta-0 span:before {
background: none;
border: 1px solid var(--color-brand);
border-radius: 5px;
content: "";
display: inline-block;
height: 6px;
left: 8px;
margin-right: 3px;
margin-top: -3px;
position: absolute;
top: 50%;
width: 6px
}
.entry-meta .author-avatar img {
margin-right: 5px;
max-width: 30px
}
span.has-dot {
padding-left: 10px;
position: relative
}
span.has-dot:before {
background: #d2d2d2;
border-radius: 50%;
content: "";
display: block;
height: 4px;
left: -2px;
margin-top: -2px;
position: absolute;
top: 50%;
width: 4px
}
h6.post-title {
font-size: 14px
}
.post-title a {
color: var(--color-grey-1)
}
.post-title a:hover {
color: var(--color-brand)
}
.post-thumb {
overflow: hidden;
position: relative
}
.post-thumb.border-radius-5 img {
border-radius: 5px
}
.post-thumb a {
line-height: 1
}
.post-thumb .entry-meta {
left: 10px;
position: absolute;
top: 10px;
z-index: 2
}
.post-thumb .entry-meta a {
background-color: var(--color-brand-2);
border-radius: 4px;
color: #fff !important;
display: inline-block;
height: 32px;
line-height: 35px;
text-align: center;
width: 32px
}
.loop-grid {
position: relative
}
.loop-grid article {
background: #fff;
overflow: hidden;
position: relative
}
.loop-grid .entry-content {
padding: 30px
}
.loop-grid .entry-content-2 {
padding: 20px 30px
}
.loop-grid.loop-list {
position: relative
}
.loop-grid.loop-list article {
align-items: center;
border: 1px solid #ececec;
border-radius: 15px;
display: flex
}
.loop-grid.loop-list article:not(:last-child) {
margin-bottom: 30px
}
.loop-grid.loop-list article .post-thumb {
min-height: 366px;
min-width: 438px
}
.img-hover-slide,
.loop-grid.loop-list article .post-thumb {
background-position: 50%;
background-repeat: no-repeat;
background-size: cover;
overflow: hidden;
transition: all .4s ease;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-ms-transition: all .4s ease
}
.img-hover-slide {
min-height: 280px
}
.top-right-icon {
border-radius: 5px;
bottom: 15px;
color: #fff;
height: 30px;
line-height: 30px;
right: 15px;
transition: all .4s ease;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
transition-duration: .4s;
-ms-transition: all .4s ease;
width: 30px
}
.top-left-icon,
.top-right-icon {
position: absolute;
text-align: center;
z-index: 3
}
.top-left-icon {
background-color: var(--color-brand-2);
border-radius: 4px;
color: #fff !important;
display: inline-block;
height: 32px;
left: 20px;
line-height: 35px;
top: 20px;
width: 32px
}
.entry-meta.meta-1,
.entry-meta.meta-2 {
display: flex;
justify-content: space-between
}
.entry-meta a.read-more {
border: 1px solid #abd7ab;
border-radius: 30px;
color: #98ca98;
display: inline-block;
font-size: 12px;
font-weight: 600;
padding: 10px 15px
}
.vendor-wrap {
background-color: #fff;
border: 1px solid #ececec;
border-radius: 15px;
overflow: hidden;
position: relative
}
.vendor-wrap,
.vendor-wrap:hover {
transition: .2s;
-moz-transition: .2s;
-webkit-transition: .2s;
-o-transition: .2s
}
.vendor-wrap:hover {
border: 1px solid rgba(var(--color-brand-rgb), .4);
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05)
}
.vendor-wrap .vendor-img-action-wrap {
padding: 25px 25px 0
}
.vendor-wrap .vendor-img-action-wrap img {
max-width: 144px
}
.vendor-wrap .vendor-content-wrap {
padding: 20px 20px 30px
}
.vendor-wrap .vendor-content-wrap h4 a {
color: var(--color-heading)
}
.vendor-wrap .vendor-content-wrap h4 a:hover {
color: var(--color-brand)
}
.vendor-wrap .vendor-content-wrap .total-product {
background-color: #def9ec;
border-radius: 4px;
color: var(--color-brand);
display: inline-block;
font-size: 14px;
font-weight: 700;
min-width: 123px;
padding: 6px 20px;
position: relative
}
.vendor-wrap .product-badges.product-badges-position {
position: absolute;
right: 0;
top: 0;
z-index: 9
}
.vendor-wrap .product-badges.product-badges-position span {
background-color: var(--color-brand);
border-radius: 0 10px 0 20px;
color: #fff;
display: inline-block;
font-size: 12px;
line-height: 1;
padding: 9px 20px 10px
}
.vendor-wrap .product-badges.product-badges-position span.hot {
background-color: #f74b81
}
.vendor-wrap .product-badges.product-badges-position span.new {
background-color: var(--color-brand)
}
.vendor-wrap .product-badges.product-badges-position span.sale {
background-color: #67bcee
}
.vendor-wrap .product-badges.product-badges-position span.best {
background-color: #f59758
}
.vendor-wrap.style-2 {
display: flex
}
.vendor-wrap.style-2 .vendor-img-action-wrap {
padding: 20px;
position: relative
}
.vendor-wrap.style-2 .vendor-img-action-wrap .total-product {
background-color: #def9ec;
border-radius: 4px;
color: var(--color-brand);
display: inline-block;
font-size: 14px;
font-weight: 700;
min-width: 123px;
padding: 6px 20px;
position: relative
}
.vendor-wrap.style-2 .vendor-info .btn {
min-width: 105px;
padding: 8px 10px 8px 13px
}
.archive-header-2 .search-form input {
border-radius: 30px;
box-shadow: 20px 20px 40px rgba(0, 0, 0, .07);
padding-left: 30px
}
.archive-header-3 {
border-radius: 20px;
padding: 50px;
position: relative
}
.archive-header-3 .archive-header-3-inner {
display: flex
}
.header-top-ptb-1 {
border-bottom: 1px solid #ececec;
font-size: 13px;
line-height: 1;
padding: 7px 0
}
.header-top-ptb-1 #news-flash {
font-size: 14px;
font-weight: 600;
line-height: 10px;
min-width: 230px
}
.header-top-ptb-1 #news-flash li {
min-height: 14px
}
.header-top-ptb-1 #news-flash i {
line-height: 6px;
margin-right: 5px
}
.header-info-right {
display: flex;
justify-content: flex-end
}
.header-info>ul {
display: flex
}
.header-info>ul>li {
align-items: center;
display: flex;
margin-right: 20px;
position: relative
}
.header-info>ul>li:before {
background: #dedfe2;
content: "";
height: 10px;
position: absolute;
right: -10px;
top: 50%;
transform: translateY(-50%);
width: 1px
}
.header-info>ul>li:last-child {
margin-right: 0
}
.header-info>ul>li:last-child:before {
display: none
}
.header-info>ul>li a {
color: var(--color-text);
font-weight: 500
}
.header-info>ul>li a i {
font-size: 12px;
margin-right: 5px
}
.header-info>ul>li a.language-dropdown-active i.fa-chevron-down {
font-size: 8px;
margin-left: 5px
}
.header-info>ul>li>ul.language-dropdown {
background: #fff;
border: 1px solid #ececec;
border-radius: 0 0 4px 4px;
min-width: 120px;
opacity: 0;
padding: 10px 15px;
position: absolute;
right: 0;
top: 100%;
transform: translateY(20px);
transition: all .25s cubic-bezier(.645, .045, .355, 1);
visibility: hidden;
z-index: 2
}
.header-info>ul>li>ul li {
display: block
}
.header-info>ul>li>ul li a {
color: dimgray;
display: block;
padding: 5px
}
.header-info>ul>li>ul li a:hover {
background-color: none;
color: var(--color-brand)
}
.header-info>ul>li>ul li a img {
display: inline-block;
margin-right: 5px;
max-width: 15px
}
.header-info>ul>li:hover>a {
color: #333
}
.header-info>ul>li:hover>ul.language-dropdown {
opacity: 1;
top: 25px;
transform: translateY(0);
visibility: visible
}
.header-info i {
font-size: 12px;
line-height: 6px;
margin-right: 5px
}
.header-wrap,
.header-wrap .header-nav {
align-items: center;
display: flex
}
.header-wrap .header-nav {
align-content: center
}
.header-wrap .header-nav,
.header-wrap .header-right,
.header-wrap.header-space-between {
justify-content: space-between
}
.header-wrap .header-right {
align-items: center;
display: flex;
width: 100%
}
.logo a {
display: block
}
.logo.logo-width-1 {
margin-right: 70px
}
.logo.logo-width-1 a img {
max-width: 100%
}
.search-style-1 form {
position: relative;
width: 370px
}
.search-style-1 form input {
background-color: #f5f5f5;
border: 1px solid #f5f5f5;
border-radius: 26px;
color: var(--color-heading);
font-size: 16px;
height: 48px;
padding: 3px 50px 3px 20px;
transition: all .25s cubic-bezier(.645, .045, .355, 1)
}
.header-action .header-action-icon.header-action-mrg-none2,
.header-action .header-action-icon:last-child {
margin-right: 0
}
.header-action .header-action-icon>a span.pro-count {
border-radius: 100%;
bottom: -4px;
color: #fff;
font-size: 12px;
font-weight: 700;
height: 20px;
line-height: 20px;
position: absolute;
right: -5px;
text-align: center;
width: 20px
}
.header-action-2 {
align-items: center;
display: flex
}
.header-action-2 .header-action-icon-2 span.lable {
font-size: 16px;
margin: 5px 0 0 10px
}
.header-action-2 .header-action-icon-2:last-child {
padding: 0 0 0 8px
}
.header-action-2 .header-action-icon-2>a {
color: #333;
display: flex;
font-size: 30px;
line-height: 1;
position: relative
}
.header-action-2 .header-action-icon-2>a img {
max-width: 25px;
width: 100%
}
.header-action-2 .header-action-icon-2>a span {
color: var(--color-body);
font-size: 14px
}
.header-action-2 .header-action-icon-2>a span.pro-count {
border-radius: 100%;
color: #fff;
font-size: 12px;
font-weight: 500;
height: 20px;
line-height: 20px;
position: absolute;
right: -11px;
text-align: center;
top: -5px;
width: 20px
}
.cart-dropdown-wrap ul li {
display: flex;
flex-wrap: wrap;
margin: 0 0 20px
}
.cart-dropdown-wrap ul li .shopping-cart-img a {
display: block
}
.header-height-2 {
border-bottom: 1px solid #ececec
}
.header-height-3 {
min-height: 132px
}
.header-height-4 {
min-height: 120px
}
.search-popup-wrap.search-visible {
opacity: 1;
transition-delay: 0s;
visibility: visible
}
.mobile-header-wrapper-style.sidebar-visible {
opacity: 1;
transform: translate(0);
visibility: visible
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-top .mobile-header-logo a {
display: block
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav {
height: 100%
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .main-categories-wrap a i {
margin-right: 15px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .main-categories-wrap .categories-dropdown-active-small {
background-color: transparent;
box-shadow: none;
padding: 0
}
.header-action-right,
.header-action-right .search-location {
display: none
}
.search-style-1 {
margin-right: 28px
}
.search-style-1 form input::-moz-input-placeholder {
color: var(--color-heading);
opacity: 1
}
.search-style-1 form input::-webkit-input-placeholder {
color: var(--color-heading);
opacity: 1
}
.search-style-1 form input:focus {
background-color: #fff;
border: 1px solid var(--color-brand)
}
.search-style-1 form button {
background-color: transparent;
border: none;
color: var(--color-brand);
font-size: 19px;
height: 100%;
padding: 0 15px;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%)
}
.search-style-1 form button:hover {
color: var(--color-primary)
}
.header-action {
align-items: center;
display: flex
}
.header-action .header-action-icon {
display: flex;
margin-right: 28px;
position: relative
}
.header-action .header-action-icon.header-action-mrg-none {
margin-right: 13px
}
.header-action .header-action-icon>a {
color: #333;
display: inline-block;
font-size: 24px;
line-height: 1;
position: relative
}
.header-action .header-action-icon>a span.pro-count.blue {
background-color: var(--color-brand)
}
.header-action .header-action-icon:hover>a {
color: var(--color-brand)
}
.header-action .header-action-icon:hover .cart-dropdown-wrap {
opacity: 1;
top: calc(100% + 10px);
visibility: visible
}
.header-action.header-action-hm3 .header-action-icon.header-action-mrg-none2,
.header-action.header-action-hm3 .header-action-icon:last-child {
margin-right: 0
}
.header-action-2 .header-action-icon-2 {
display: flex;
padding: 0 10px;
position: relative
}
.header-action-2 .header-action-icon-2>a svg {
height: 1em;
width: 1em
}
.header-action-2 .header-action-icon-2>a span.pro-count.blue {
background-color: var(--color-brand)
}
.header-action-2 .header-action-icon-2:hover>a {
fill: var(--color-brand);
color: var(--color-brand)
}
.header-action-2 .header-action-icon-2:hover .cart-dropdown-wrap {
opacity: 1;
top: calc(100% + 10px);
visibility: visible
}
.header-middle-ptb-1 {
padding: 25px 0 0
}
.cart-dropdown-wrap {
background-color: #fff;
border: 1px solid #ececec;
border-radius: 10px;
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
opacity: 0;
padding: 30px 20px 27px;
position: absolute;
right: 0;
top: calc(100% + 20px);
transition: all .25s cubic-bezier(.645, .045, .355, 1);
visibility: hidden;
width: 320px;
z-index: 99
}
.cart-dropdown-wrap.cart-dropdown-hm2 {
right: 0
}
.cart-dropdown-wrap.account-dropdown {
width: 200px
}
.cart-dropdown-wrap.account-dropdown a {
color: var(--color-heading)
}
.cart-dropdown-wrap.account-dropdown a:hover {
color: var(--color-brand)
}
.cart-dropdown-wrap ul li:last-child {
margin: 0
}
.cart-dropdown-wrap ul li .shopping-cart-img {
flex: 0 0 80px;
margin-right: 20px
}
.cart-dropdown-wrap ul li .shopping-cart-img a img {
max-width: 100%
}
.cart-dropdown-wrap ul li .shopping-cart-title {
margin: 6px 0 0
}
.cart-dropdown-wrap ul li .shopping-cart-title h4 {
font-size: 16px;
font-weight: 500;
line-height: 1;
margin: 0 0 9px
}
.cart-dropdown-wrap ul li .shopping-cart-title h4 a {
color: var(--color-brand)
}
.cart-dropdown-wrap ul li .shopping-cart-title h4 a:hover {
color: var(--color-heading)
}
.cart-dropdown-wrap ul li .shopping-cart-title h3 {
color: var(--color-brand);
font-size: 18px;
font-weight: 700;
line-height: 1;
margin: 0
}
.cart-dropdown-wrap ul li .shopping-cart-title h3 span {
color: dimgray;
font-size: 16px;
font-weight: 400
}
.cart-dropdown-wrap ul li .shopping-cart-delete {
display: flex;
flex-grow: 100;
justify-content: flex-end;
margin: 6px 0 0
}
.cart-dropdown-wrap ul li .shopping-cart-delete a {
color: dimgray;
font-size: 18px
}
.cart-dropdown-wrap ul li .shopping-cart-delete a:hover {
color: #333
}
.cart-dropdown-wrap .shopping-cart-footer .shopping-cart-total {
border-top: 2px solid #f3f3f3;
margin: 25px 0;
padding: 17px 0 0
}
.cart-dropdown-wrap .shopping-cart-footer .shopping-cart-total h4 {
color: #9b9b9b;
font-size: 16px;
font-weight: 700;
margin: 0
}
.cart-dropdown-wrap .shopping-cart-footer .shopping-cart-total h4 span {
color: var(--color-brand);
float: right;
font-size: 18px
}
.cart-dropdown-wrap .shopping-cart-footer .shopping-cart-button {
align-items: center;
align-self: center;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin-top: 20px;
width: 100%
}
.cart-dropdown-wrap .shopping-cart-footer .shopping-cart-button a {
background-color: var(--color-brand);
border: 2px solid var(--color-brand);
border-radius: 4px;
color: #fff;
display: inline-block;
font-family: var(--font-heading), sans-serif;
font-size: 14px;
line-height: 1;
padding: 10px 20px
}
.cart-dropdown-wrap .shopping-cart-footer .shopping-cart-button a.outline {
background-color: transparent;
border: 2px solid var(--color-brand);
color: var(--color-brand)
}
.cart-dropdown-wrap .shopping-cart-footer .shopping-cart-button a.outline:hover {
color: #fff
}
.cart-dropdown-wrap .shopping-cart-footer .shopping-cart-button a:hover {
background-color: var(--color-brand-2)
}
.sticky-bar.stick {
animation: fadeInDown .7s ease-in-out 0s 1 normal none running;
background: #fff;
border-bottom: 2px solid var(--color-brand-2);
box-shadow: 0 8px 20px 0 rgba(0, 0, 0, .05);
left: 0;
position: fixed;
top: 0;
transition: all .3s ease 0s;
width: 100%;
z-index: 999
}
.sticky-bar.stick.sticky-white-bg {
background-color: #fff
}
.sticky-bar.stick.sticky-blue-bg {
background-color: #3286e0
}
.header-height-1 {
min-height: 133px
}
.search-style-2 {
width: 100%
}
.search-style-2 form {
display: flex;
position: relative;
width: 100%
}
.search-style-2 form select {
-moz-appearance: none;
-webkit-appearance: none;
background-color: #fff;
border: 1px solid #ececec;
border-radius: 4px 0 0 4px;
border-right: none;
color: var(--color-heading);
font-size: 16px;
font-weight: 700;
min-height: 50px;
padding: 3px 35px 3px 20px;
position: relative;
transition: all .3s ease 0s;
width: 140px
}
.search-style-2 form select:focus {
color: #333
}
.search-style-2 form select:after {
position: absolute
}
.search-style-2 form input {
font-size: 14px;
height: 50px;
line-height: 50px;
max-width: 683px;
padding-left: 0;
width: 100%
}
.search-style-2 form input::-moz-input-placeholder {
opacity: 1
}
.search-style-2 form input::-webkit-input-placeholder {
opacity: 1
}
.search-style-2 form input:focus {
border: solid #414648;
border-width: 0 0 3px
}
.search-style-2 form button {
background-color: transparent;
border: none;
color: var(--color-brand);
height: 100%;
padding: 5px 17px;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%)
}
.search-style-2 form button:hover {
background-color: transparent !important;
color: var(--color-brand) !important
}
.header-bottom-shadow {
box-shadow: 0 1px 20px rgba(0, 0, 0, .05)
}
.header-bottom .header-action-right a span.pro-count {
background-color: var(--color-brand);
color: #fff
}
.search-style-3 {
margin-bottom: 10px
}
.search-style-3 form {
position: relative
}
.search-style-3 form input {
background-color: #f2f3f4;
border: 0;
border-radius: 5px;
color: var(--color-heading);
font-size: 14px;
height: 45px;
padding: 3px 50px 3px 20px;
transition: all .25s cubic-bezier(.645, .045, .355, 1)
}
.search-style-3 form input::-moz-input-placeholder {
color: var(--color-heading);
opacity: 1
}
.search-style-3 form input::-webkit-input-placeholder {
color: var(--color-heading);
opacity: 1
}
.search-style-3 form input:focus {
border: 1px solid rgba(var(--color-brand-rgb), .4)
}
.search-style-3 form button {
background-color: transparent;
border: none;
color: #333;
font-size: 16px;
height: 100%;
padding: 0 14px;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%)
}
.search-style-3 form button:hover {
color: var(--color-brand)
}
.search-popup-wrap {
align-items: center;
background-color: #fff;
display: flex;
height: 100%;
justify-content: center;
left: 0;
opacity: 0;
position: fixed;
top: 0;
transition: all .5s ease-in-out;
visibility: hidden;
width: 100%;
z-index: 99999
}
.search-popup-wrap .search-popup-content form input {
background-color: transparent;
border: 0;
border-bottom: 3px solid var(--color-brand);
color: #919191;
font-size: 50px;
font-weight: 300;
height: auto;
max-width: 100%;
opacity: 0;
padding: 21px 50px 16px 0;
transform: translateY(50px);
transition-delay: 0s;
transition: all .5s ease-in-out, opacity .5s linear;
width: 1170px
}
.search-popup-wrap .search-popup-content form input::-moz-input-placeholder {
color: #919191;
opacity: 1
}
.search-popup-wrap .search-popup-content form input::-webkit-input-placeholder {
color: #919191;
opacity: 1
}
.search-popup-wrap.search-visible .search-popup-content form input {
opacity: 1;
transform: none;
transition-delay: .6s
}
.close-style-wrap {
position: absolute;
right: 55px;
top: 40px
}
.close-style-wrap.close-style-position-inherit {
position: inherit
}
.close-style-wrap .close-style {
background-color: transparent;
background-color: #F1EBD8;
border: none;
border-radius: 30px;
height: 26px;
padding: 0;
position: relative;
width: 26px
}
.close-style-wrap .close-style>i {
display: block;
height: 1px;
left: 50%;
margin: 0 !important;
overflow: hidden;
position: absolute;
top: 50%;
transform-origin: center;
width: 10px
}
.close-style-wrap .close-style>i.icon-top {
transform: translate(-50%, -50%) rotate(45deg)
}
.close-style-wrap .close-style>i.icon-top:before {
transform: scaleX(1) translateZ(0);
transform-origin: right;
transition: transform .6s cubic-bezier(.165, .84, .44, 1) .2s
}
.close-style-wrap .close-style>i.icon-top:after {
transform: scaleX(0) translateZ(0);
transform-origin: left;
transition: transform .6s cubic-bezier(.165, .84, .44, 1)
}
.close-style-wrap .close-style>i.icon-bottom {
transform: translate(-50%, -50%) rotate(-45deg)
}
.close-style-wrap .close-style>i.icon-bottom:before {
transform: scaleX(1) translateZ(0);
transform-origin: right;
transition: transform .6s cubic-bezier(.165, .84, .44, 1) .2s
}
.close-style-wrap .close-style>i.icon-bottom:after {
transform: scaleX(0) translateZ(0);
transform-origin: left;
transition: transform .6s cubic-bezier(.165, .84, .44, 1)
}
.close-style-wrap .close-style:hover {
transform: rotate(1turn)
}
.close-style-wrap .close-style>i:after,
.close-style-wrap .close-style>i:before {
background-color: #111;
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%
}
.burger-icon {
cursor: pointer;
height: 20px;
position: relative;
transition: all .25s cubic-bezier(.645, .045, .355, 1);
width: 24px
}
.burger-icon>span {
display: block;
height: 2px;
left: 0;
position: absolute;
width: 100%
}
.burger-icon>span.burger-icon-top {
top: 2px
}
.burger-icon>span.burger-icon-bottom {
bottom: 2px
}
.burger-icon>span.burger-icon-mid {
top: 9px
}
.burger-icon>span:after,
.burger-icon>span:before {
background-color: #333;
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%
}
.burger-icon.burger-icon-white>span:after,
.burger-icon.burger-icon-white>span:before {
background-color: #000;
}
.body-overlay-1 {
background: rgba(0, 0, 0, .7) none repeat scroll 0 0;
cursor: crosshair;
height: 100%;
left: 0;
opacity: 0;
position: fixed;
top: 0;
transition: all .25s cubic-bezier(.645, .045, .355, 1);
visibility: hidden;
width: 100%;
z-index: 9999
}
.mobile-menu-active .body-overlay-1 {
opacity: 1;
visibility: visible
}
.main-wrapper,
.mobile-header-wrapper-style {
transition: all .25s cubic-bezier(.645, .045, .355, 1)
}
.mobile-header-wrapper-style {
background-color: #fff;
bottom: 0;
box-shadow: 0 0 15px 0 rgba(0, 0, 0, .09);
left: 0;
min-height: 100vh;
opacity: 0;
position: fixed;
top: 0;
transform: translate(-200px);
visibility: hidden;
width: 360px;
z-index: 99999
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner {
height: 100%;
overflow-x: hidden;
overflow-y: auto;
padding: 0 0 30px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-top {
align-items: center;
background-color: #fff;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 20px 30px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-top .mobile-header-logo a img {
width: 100px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area {
padding: 30px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li {
border-bottom: 1px solid #ececec;
display: block;
padding: 13px 0;
position: relative
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li:last-child {
border-bottom: none
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li.menu-item-has-children .menu-expand {
color: var(--color-heading);
cursor: pointer;
display: block;
font-size: 12px;
height: 30px;
line-height: 38px;
position: absolute;
right: 0;
text-align: center;
top: 5px;
width: 30px;
z-index: 9
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li.menu-item-has-children .menu-expand i {
font-size: 14px;
font-weight: 300
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li.menu-item-has-children.active>.menu-expand {
background: hsla(0, 0%, 100%, .2)
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li.menu-item-has-children.active>.menu-expand i:before {
content: ""
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li a {
color: var(--color-heading);
display: inline-block;
font-size: 14px;
font-weight: 700;
line-height: 1;
position: relative;
text-transform: capitalize
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li a i {
margin-right: 5px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li ul {
padding: 10px 0 0 10px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li ul li {
border-bottom: none;
padding: 10px 0
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li ul li.menu-item-has-children .menu-expand {
top: 0
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li ul li a {
display: block;
font-size: 14px;
font-weight: 500
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li ul li ul {
margin-top: 0
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li ul li.menu-item-has-children.active {
padding-bottom: 0
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li:hover>a {
color: var(--color-brand)
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .categories-dropdown-wrap ul li a {
padding: 5px 15px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap {
border: 1px solid #ececec;
border-radius: 5px;
margin: 17px 0 30px;
padding: 20px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info {
margin-bottom: 13px;
position: relative
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info:last-child {
margin-bottom: 0
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info a {
color: var(--color-heading);
display: block;
font-size: 16px;
font-weight: 500
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info a:hover {
color: var(--color-brand)
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info a i {
color: var(--color-brand);
font-size: 14px;
margin-right: 8px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info .lang-curr-dropdown {
background-color: transparent;
box-shadow: none;
display: none;
margin-top: 5px;
padding: 10px 0 0;
width: 100%;
z-index: 11
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info .lang-curr-dropdown ul li {
padding-bottom: 10px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info .lang-curr-dropdown ul li:last-child {
padding-bottom: 0
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info .lang-curr-dropdown ul li a {
color: hsla(0, 0%, 100%, .7);
font-size: 16px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info .lang-curr-dropdown ul li a:hover {
color: var(--color-brand)
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info:hover>a {
color: var(--color-heading)
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-border {
border-bottom: 1px solid hsla(0, 0%, 100%, .15)
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .site-copyright {
color: #000;
font-size: 13px
}
.mobile-social-icon a {
align-content: center;
/* background: var(--color-brand); */
border-radius: 30px;
display: inline-flex;
height: 30px;
justify-content: center;
line-height: 1;
margin-right: 5px;
width: 30px
}
.mobile-social-icon a img {
max-width: 16px
}
.mobile-social-icon a img:hover {
opacity: .8
}
.mobile-social-icon a:hover {
margin-top: -2px;
transform: translateY(-2px);
transition-duration: .5s
}
.mobile-social-icon a:last-child {
margin-right: 0
}
.mobile-search {
padding: 0 0 10px
}
.hotline img {
margin-right: 12px;
min-width: 35px
}
.hotline p {
color: var(--color-brand);
display: block;
font-family: var(--font-heading), sans-serif;
font-size: 26px;
font-weight: 700;
line-height: 1
}
.hotline p span {
color: var(--color-text);
display: block;
font-family: var(--font-text), sans-serif;
font-size: 12px;
font-weight: 500;
letter-spacing: .9px
}
.header-style-1 {
position: relative
}
.header-style-1.header-height-2 {
border-bottom: 0
}
.header-style-1 .header-top-ptb-1 {
background-image: none;
padding: 10px 0
}
.header-style-1 .header-top-ptb-1 .language-dropdown a {
color: var(--color-grey-1)
}
.header-style-1 .header-middle-ptb-1 {
padding: 10px 0;
}
.header-style-1 .search-style-2 form {
background-color: #fff;
border: 2px solid rgba(var(--color-brand-rgb), .4);
border-radius: 4px;
max-width: 700px
}
.header-style-1 .search-style-2 form input {
background-color: #fff;
border: none;
border-radius: 0 5px 5px 0;
margin-left: 20px;
max-width: 600px
}
.header-style-1 .header-bottom-bg-color {
background-color: #fff;
border-bottom: 1px solid #ececec;
border-top: 1px solid #ececec
}
.header-style-1 .main-categories-wrap>a {
background: var(--color-brand);
color: #fff;
line-height: 70px;
padding: 0 30px
}
.header-style-1 .main-categories-wrap>a i.up {
right: 30px
}
.header-style-1 .main-categories-wrap>a.categories-button-active {
border-radius: 5px;
font-family: var(--font-heading), sans-serif;
font-size: 16px;
line-height: 44px;
padding: 0 20px
}
.header-style-1 .main-categories-wrap>a.categories-button-active i {
color: #fff;
font-size: 10px;
margin-bottom: 5px;
margin-left: 12px
}
.header-style-1 .main-categories-wrap>a:hover {
background-color: var(--color-brand-dark)
}
.header-style-1 .main-menu.main-menu-light-white>nav>ul>li>a {
color: #494949
}
.header-style-1 .stick .main-menu.main-menu-light-white>nav>ul>li>a {
color: #fff !important
}
.header-style-1 .categories-dropdown-active-large {
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
top: 100%
}
.header-style-1 .hotline p {
color: var(--color-brand) !important
}
.header-style-1 .main-categories-wrap>a span {
color: #fff !important
}
.header-style-1.header-style-5 .header-bottom-bg-color {
background-color: var(--color-brand) !important
}
.header-style-1.header-style-5 .header-bottom-bg-color .main-categories-wrap>a {
background: var(--color-brand-2)
}
.header-style-1.header-style-5 .main-menu>nav>ul>li>a {
color: #fff
}
.header-style-1.header-style-5 .hotline p,
.header-style-1.header-style-5 .hotline p span {
color: #fff !important
}
span.fi-rs-apps {
font-size: 16px
}
.hotline i {
opacity: .7
}
.main-menu.main-menu-mrg-1 {
margin: 0 0 0 27px
}
.main-menu>nav>ul>li.hot-deals {
padding-right: 30px !important
}
.main-menu>nav>ul>li.hot-deals img {
margin-bottom: -4px;
margin-right: 8px;
position: relative
}
.main-menu>nav>ul>li.position-static {
position: static
}
.main-menu>nav>ul>li>a {
color: var(--color-heading);
display: inline-block;
font-family: var(--font-heading), sans-serif;
font-size: 16px;
font-weight: 700
}
.main-menu>nav>ul>li>a i {
font-size: 8px;
margin-left: 4px;
position: relative
}
.main-menu>nav>ul>li>a.active {
color: var(--color-brand)
}
.main-menu>nav>ul>li ul.sub-menu {
background-color: #fff;
border: 1px solid #ececec;
border-radius: 10px;
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
left: 0;
margin-top: 20px;
min-width: 250px;
opacity: 0;
padding: 25px 15px;
position: absolute;
top: 100%;
transition: all .25s ease 0s;
visibility: hidden;
z-index: 999
}
.main-menu>nav>ul>li ul.sub-menu li {
display: block;
line-height: 1;
margin-bottom: 21px;
position: relative
}
.main-menu>nav>ul>li ul.sub-menu li:last-child {
margin-bottom: 0
}
.main-menu>nav>ul>li ul.sub-menu li ul.level-menu {
background-color: #fff;
border: 1px solid #ececec;
border-radius: 10px;
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
left: 100%;
margin-top: 20px;
opacity: 0;
padding: 33px 0 35px;
position: absolute;
top: -110px;
transition: all .25s ease 0s;
visibility: hidden;
width: 240px
}
.main-menu>nav>ul>li ul.sub-menu li ul.level-menu.level-menu-modify {
top: -25px
}
.main-menu>nav>ul>li ul.sub-menu li a i {
float: right;
font-size: 9px;
position: relative;
top: 4px
}
.main-menu>nav>ul>li ul.sub-menu li:hover>a {
color: #000
}
.main-menu>nav>ul>li ul.sub-menu li:hover>ul.level-menu {
margin-top: 0;
opacity: 1;
visibility: visible
}
.main-menu>nav>ul>li ul.mega-menu {
background-color: #fff;
border: 1px solid #ececec;
border-radius: 0 0 10px 10px;
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
left: 0;
margin-top: 20px;
opacity: 0;
padding: 35px 25px 35px 35px;
position: absolute;
top: 100%;
transition: all .25s ease 0s;
visibility: hidden;
width: 100%;
z-index: 999
}
.main-menu>nav>ul>li ul.mega-menu li {
display: block;
float: left;
line-height: 1;
padding-right: 10px;
position: relative
}
.main-menu>nav>ul>li ul.mega-menu li:last-child {
margin-bottom: 0
}
.main-menu>nav>ul>li ul.mega-menu li.sub-mega-menu-width-22 {
width: 22%
}
.main-menu>nav>ul>li ul.mega-menu li.sub-mega-menu-width-34 {
width: 34%
}
.main-menu>nav>ul>li ul.mega-menu li a.menu-title {
display: block;
font-size: 19px;
font-weight: 700
}
.main-menu>nav>ul>li ul.mega-menu li ul {
margin-top: 28px
}
.main-menu>nav>ul>li ul.mega-menu li ul li {
display: block;
float: none;
line-height: 1;
margin-bottom: 14px
}
.main-menu>nav>ul>li ul.mega-menu li ul li:last-child {
margin-bottom: 0
}
.main-menu>nav>ul>li ul.mega-menu li ul li a {
color: var(--color-body);
display: block;
font-size: 15px;
line-height: 1.4
}
.main-menu>nav>ul>li ul.mega-menu li ul li a:hover {
color: var(--color-brand)
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap {
overflow: hidden;
position: relative
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap a {
display: block
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap a img {
width: 100%
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap .menu-banner-content {
left: 30px;
position: absolute;
top: 32px
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap .menu-banner-content h3 {
font-size: 24px;
font-weight: 700;
line-height: 1.5;
margin: 5px 0 11px
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap .menu-banner-content .menu-banner-price span.old-price {
color: dimgray;
font-size: 19px;
font-weight: 400;
margin-left: 5px;
text-decoration: line-through
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap .menu-banner-content .menu-banner-btn a {
background-color: var(--color-brand);
border-radius: 26px;
color: #fff;
display: inline-block;
font-size: 16px;
font-weight: 700;
padding: 12px 22px 14px
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap .menu-banner-discount h3 span {
display: block;
font-size: 20px;
font-weight: 700;
line-height: 1;
margin: 0 0 3px
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap:hover .menu-banner-btn a {
background-color: var(--color-danger)
}
.main-menu>nav>ul>li:hover>a {
color: var(--color-brand)
}
.main-menu>nav>ul>li:hover ul.sub-menu {
margin-top: 12px;
opacity: 1;
visibility: visible
}
.main-menu>nav>ul>li:hover ul.mega-menu {
margin-top: 0;
opacity: 1;
visibility: visible
}
.main-menu.hover-boder>nav>ul>li>a {
position: relative
}
.main-menu.hover-boder>nav>ul>li>a:after {
background: var(--color-brand);
bottom: 34px;
content: none;
height: 1px;
left: auto;
position: absolute;
right: 0;
transition: width .6s cubic-bezier(.25, .8, .25, 1) 0s;
width: 0
}
.main-menu.hover-boder>nav>ul>li:hover>a:after {
left: 0;
right: auto;
width: 100%
}
.main-menu.hover-boder.hover-boder-white>nav>ul>li>a:after {
background: #fff;
bottom: 18px
}
.main-menu.hover-boder.hover-boder-modify>nav>ul>li>a:after {
bottom: 28px
}
.main-menu.main-menu-light-white>nav>ul>li>a {
color: #fff
}
.main-menu.main-menu-padding-1>nav>ul>li {
padding: 0 17px
}
.main-menu.main-menu-padding-1>nav>ul>li:first-child {
padding-left: 0 !important
}
.main-menu.main-menu-lh-2>nav>ul>li {
line-height: 70px
}
.main-menu.main-menu-lh-3>nav>ul>li {
line-height: 80px
}
.main-menu.main-menu-grow {
flex-grow: 1
}
.main-menu>nav>ul>li {
display: inline-block;
position: relative
}
.main-menu>nav>ul>li ul.sub-menu li a {
color: var(--color-text);
display: block;
font-size: 14px;
padding: 0 15px
}
.main-menu>nav>ul>li ul.sub-menu li a:hover {
color: var(--color-brand)
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap .menu-banner-content h4 {
font-size: 16px;
font-weight: 500;
margin: 0;
text-transform: uppercase
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap .menu-banner-content .menu-banner-price {
margin: 0 0 28px
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap .menu-banner-content .menu-banner-price span.new-price {
color: var(--color-danger);
font-size: 24px;
font-weight: 700
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap .menu-banner-discount {
align-items: center;
background-color: #ffd55a;
border-radius: 100%;
display: flex;
height: 80px;
justify-content: center;
line-height: 80px;
position: absolute;
right: 7%;
top: 13%;
width: 80px
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap .menu-banner-discount h3 {
color: #333;
font-size: 19px;
font-weight: 600;
line-height: 1;
margin: 0;
text-align: center
}
.main-menu.main-menu-lh-1>nav>ul>li {
line-height: 70px
}
.main-categories-wrap {
margin-right: 35px;
position: relative
}
.main-categories-wrap>a {
align-items: center;
display: flex !important;
font-size: 18px;
font-weight: 700
}
.main-categories-wrap>a span {
color: var(--color-body);
margin-right: 7px
}
.main-categories-wrap>a>i {
color: #999;
margin-left: 5px;
margin-top: 7px
}
.main-categories-wrap>a>i.up {
opacity: 0;
position: absolute;
right: 0;
top: 40%;
transform: translateY(-50%);
visibility: hidden
}
.main-categories-wrap>a.open>i {
transform: rotate(180deg)
}
.main-categories-wrap .categories-dropdown-inner {
display: flex;
min-width: 412px
}
.categories-dropdown-active-large {
background: #fff;
border: 1px solid rgba(var(--color-brand-rgb), .4);
border-radius: 10px;
font-size: 16px;
left: 0;
list-style-type: none;
margin: 26px 0 0;
min-width: 270px;
opacity: 0;
padding: 30px;
position: absolute;
top: 177%;
transition: all .25s cubic-bezier(.645, .045, .355, 1);
visibility: hidden;
z-index: 99
}
.categories-dropdown-active-large.open {
opacity: 1;
visibility: visible
}
.categories-dropdown-active-small {
background: #fff;
border-radius: 5px;
box-shadow: 20px 20px 40px rgba(0, 0, 0, .07);
display: none;
font-size: 16px;
font-weight: 400;
margin: 0;
padding: 14px 0 23px;
width: 100%;
z-index: 9
}
.categories-dropdown-wrap ul li {
align-items: center;
border: 1px solid #f2f3f4;
border-radius: 5px;
display: flex;
height: 50px;
line-height: 48px;
margin: 0 15px 15px 0;
padding: 9px 18px
}
.categories-dropdown-wrap ul li,
.categories-dropdown-wrap ul li:hover {
transition: .3s;
-moz-transition: .3s;
-webkit-transition: .3s;
-o-transition: .3s
}
.categories-dropdown-wrap ul li:hover {
border: 1px solid rgba(var(--color-brand-rgb), .4);
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05)
}
.categories-dropdown-wrap ul li:hover a {
color: var(--color-brand)
}
.categories-dropdown-wrap ul li a {
align-items: center;
color: var(--color-heading);
display: flex;
font-size: 14px;
line-height: 1.5;
padding: 0
}
.categories-dropdown-wrap ul li a:hover {
background-color: transparent;
color: var(--color-brand)
}
.categories-dropdown-wrap ul li a img {
margin-right: 15px;
max-width: 30px
}
.categories-dropdown-wrap ul li:hover .dropdown-menu {
display: block;
margin-top: 0;
opacity: 1;
pointer-events: auto;
visibility: visible
}
.categories-dropdown-wrap ul li.has-children {
position: relative
}
.categories-dropdown-wrap ul li.has-children>a:after {
content: "";
font-family: uicons-regular-straight !important;
margin-top: -10px;
position: absolute;
right: 30px;
top: 50%
}
.categories-dropdown-wrap ul li.has-children .dropdown-menu {
border: 1px solid #ececec;
border-radius: 0;
left: 100%;
margin: 0;
min-width: 800px;
padding: 20px;
right: 0;
top: 0;
width: 100%
}
.categories-dropdown-wrap ul li.has-children .dropdown-menu .submenu-title {
color: var(--color-brand);
display: block;
font-size: 19px;
font-weight: 700;
padding: 5px 34px
}
.categories-dropdown-wrap ul li.has-children .dropdown-menu .header-banner2 {
display: block;
margin-bottom: 15px;
position: relative
}
.categories-dropdown-wrap ul li.has-children .dropdown-menu .header-banner2 .banne_info {
padding: 15px;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%)
}
.categories-dropdown-wrap ul li.has-children .dropdown-menu .header-banner2 .banne_info a {
color: #272a2c !important;
padding: 0;
position: relative;
text-transform: capitalize
}
.categories-dropdown-wrap ul li.has-children .dropdown-menu .header-banner2 .banne_info a:before {
background-color: #272a2c;
bottom: 0;
content: "";
height: 1px;
left: 0;
position: absolute;
right: 0;
transition: all .5s ease-in-out;
width: 50%
}
.categories-dropdown-wrap ul.end li {
margin-right: 0
}
.categories-dropdown-wrap .more_categories {
align-items: center;
color: var(--color-brand);
cursor: pointer;
display: flex;
font-family: var(--font-heading), sans-serif;
font-size: 13px;
justify-content: center;
margin-top: 15px;
position: relative
}
.categories-dropdown-wrap .more_categories span.icon {
border: 2px solid;
border-radius: 30px;
display: inline-block;
height: 24px;
margin-right: 5px;
position: relative;
width: 24px
}
.categories-dropdown-wrap .more_categories span.icon:before {
background-color: #3bb77e;
content: "";
height: 2px;
position: absolute;
right: 4px;
top: 9px;
width: 12px
}
.categories-dropdown-wrap .more_categories span.icon:after {
background-color: #3bb77e;
content: "";
height: 12px;
position: absolute;
right: 9px;
top: 4px;
width: 2px
}
.categories-dropdown-wrap .more_categories.show span.icon:after {
content: none;
display: none
}
.categories-dropdown-wrap.style-2 {
border: 1px solid rgba(var(--color-brand-rgb), .4);
border-radius: 10px;
padding: 30px
}
.categories-dropdown-wrap.style-2 ul li {
border: 0;
border-radius: 0;
height: 24px;
line-height: 24px;
margin-bottom: 16px;
padding: 0
}
.categories-dropdown-wrap.style-2 ul li:hover {
box-shadow: none
}
.categories-dropdown-wrap.style-2 ul li a {
font-weight: 500
}
.categories-dropdown-wrap.style-2 ul li img {
max-height: 20px
}
.categories-dropdown-wrap.style-2 .more_categories {
justify-content: left
}
.categories-dropdown-wrap.style-2 .more_categories .icon {
transform: scale(.7)
}
.pagination-area .page-item {
margin: 0 5px
}
.pagination-area .page-item:first-child {
margin-left: 0
}
.pagination-area .page-item:first-child .page-link {
border-bottom-left-radius: 4px;
border-top-left-radius: 4px
}
.pagination-area .page-item:last-child .page-link {
border-bottom-right-radius: 50%;
border-top-right-radius: 50%
}
.pagination-area .page-item.active .page-link,
.pagination-area .page-item:hover .page-link {
background: var(--color-brand);
color: #fff
}
.pagination-area .page-item:last-child .page-link {
border-bottom-right-radius: 40px;
border-top-right-radius: 40px;
line-height: 43px
}
.pagination-area .page-item:first-child .page-link {
border-bottom-left-radius: 40px;
border-top-left-radius: 40px;
line-height: 43px
}
.pagination-area .page-link {
background-color: #f2f3f4;
border: 0;
border-radius: 40px;
box-shadow: none;
color: var(--color-text);
display: block;
font-family: var(--font-heading), sans-serif;
font-size: 16px;
font-weight: 700;
height: 40px;
line-height: 40px;
outline: 0;
padding: 0 10px;
text-align: center;
width: 40px
}
.pagination-area .page-link.dot {
background-color: transparent;
color: var(--color-text);
letter-spacing: 2px
}
.widget-category ul>li {
padding: 6px 0;
transition-duration: .2s
}
.widget-category ul>li:hover {
padding-left: 5px;
transition-duration: .2s
}
.widget-category ul>li a {
color: var(--color-grey-2)
}
.widget-category ul>li a:hover {
color: var(--color-brand)
}
.primary-sidebar .sidebar-widget {
border: 1px solid #ececec;
border-radius: 15px;
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
padding: 30px;
position: relative
}
.widget-category-2 ul li {
align-items: center;
border: 1px solid #f2f3f4;
border-radius: 5px;
display: flex;
justify-content: space-between;
line-height: 48px;
margin: 0 0 15px;
padding: 9px 18px;
transition: .3s;
-moz-transition: .3s;
-webkit-transition: .3s;
-o-transition: .3s
}
.widget-category-2 ul li:last-child {
margin-bottom: 0 !important
}
.widget-category-2 ul li:hover {
border: 1px solid rgba(var(--color-brand-rgb), .4);
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
transition: .3s;
-moz-transition: .3s;
-webkit-transition: .3s;
-o-transition: .3s
}
.widget-category-2 ul li:hover a {
color: var(--color-brand)
}
.widget-category-2 ul li a {
align-items: center;
color: var(--color-heading);
display: flex;
font-size: 14px;
line-height: 1.5;
padding: 0
}
.widget-category-2 ul li a:hover {
background-color: transparent;
color: var(--color-brand)
}
.widget-category-2 ul li a img {
margin-right: 15px;
max-width: 30px
}
.widget-category-2 ul li:hover .dropdown-menu {
display: block;
margin-top: 0;
opacity: 1;
pointer-events: auto;
visibility: visible
}
.widget-category-2 ul li.has-children {
position: relative
}
.widget-category-2 ul li.has-children>a:after {
content: "";
font-family: uicons-regular-straight !important;
margin-top: -10px;
position: absolute;
right: 30px;
top: 50%
}
.widget-category-2 ul li.has-children .dropdown-menu {
border: 1px solid #ececec;
border-radius: 0;
left: 100%;
margin: 0;
min-width: 800px;
padding: 20px;
right: 0;
top: 0;
width: 100%
}
.widget-category-2 ul li.has-children .dropdown-menu .submenu-title {
color: var(--color-brand);
display: block;
font-size: 19px;
font-weight: 700;
padding: 5px 34px
}
.widget-category-2 ul li.has-children .dropdown-menu .header-banner2 {
display: block;
margin-bottom: 15px;
position: relative
}
.widget-category-2 ul li.has-children .dropdown-menu .header-banner2 .banne_info {
padding: 15px;
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%)
}
.widget-category-2 ul li.has-children .dropdown-menu .header-banner2 .banne_info a {
color: #272a2c !important;
padding: 0;
position: relative;
text-transform: capitalize
}
.widget-category-2 ul li.has-children .dropdown-menu .header-banner2 .banne_info a:before {
background-color: #272a2c;
bottom: 0;
content: "";
height: 1px;
left: 0;
position: absolute;
right: 0;
transition: all .5s ease-in-out;
width: 50%
}
.widget-category-2 ul.end li {
margin-right: 0
}
.widget-category-2 .count {
background-color: rgba(var(--color-brand-rgb), .4);
border-radius: 20px;
color: var(--color-heading);
display: inline-block;
font-size: 12px;
height: 24px;
line-height: 24px;
margin-left: 5px;
text-align: center;
width: 24px
}
.follow-us a {
border-radius: 5px;
color: #fff;
display: block;
font-size: 11px;
height: 46px;
overflow: hidden;
padding: 12px 10px;
width: 50%
}
.follow-us a .social-count {
font-weight: 700
}
.follow-us a:hover i {
transform: translateY(-35px) !important
}
.follow-us a i {
backface-visibility: hidden;
display: inline-block;
font-size: 16px;
transform: translateY(0);
transition: .2s cubic-bezier(.65, .23, .31, .88);
vertical-align: middle
}
.follow-us a i.nth-2 {
left: 0;
position: absolute;
top: 38px
}
.follow-us i.v-align-space {
border-right: 1px solid hsla(0, 0%, 100%, .5);
line-height: 1;
padding-right: 4px
}
.follow-us .social-icon {
display: inline-block;
position: relative;
transition: all .5s ease-in-out;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
-ms-transition: all .5s ease-in-out
}
.follow-us a.follow-us-facebook,
.single-social-share a.facebook-icon {
background: #305c99
}
.follow-us a.follow-us-twitter,
.single-social-share a.twitter-icon {
background: #00cdff
}
.follow-us a.follow-us-instagram,
.single-social-share a.instagram-icon {
background: #3f729b
}
.follow-us a.follow-us-youtube,
.single-social-share a.pinterest-icon {
background: #e22b26
}
.sidebar-widget .widget-header {
border-bottom: 1px solid #ececec
}
.sidebar-widget .widget-header h5 {
font-size: 14px;
margin-bottom: 0;
text-transform: uppercase
}
.sidebar-widget .banner-img {
float: none
}
.widget_archive li,
.widget_categories li.cat-item,
.widget_nav_menu li,
.widget_pages li,
.widget_recent_comments li {
border-bottom: 1px dotted rgba(0, 0, 0, .15);
display: table;
font-size: 14px;
padding: 7px 0;
text-align: right;
width: 100%
}
.widget_categories li.cat-item:last-child {
border: none
}
.widget_archive li a,
.widget_categories li.cat-item a,
.widget_pages li a {
float: left;
padding: 0;
text-align: left
}
.widget-tags li {
margin: 0 20px 20px 0
}
.widget_instagram .insta-feed {
display: flex;
flex-wrap: wrap;
margin: -2px;
padding-top: 5px
}
.widget_instagram .insta-feed li {
margin: 5px;
width: 29.33%
}
.widget_instagram .insta-feed li img {
width: 100%
}
.social-network li {
display: inline-block;
margin: 0 5px 0 0
}
.vendor-logo img {
max-width: 150px
}
footer .mobile-social-icon {
align-items: center;
align-self: center;
display: flex;
justify-content: flex-end
}
footer .mobile-social-icon h6 {
display: inline-block;
margin-right: 15px
}
footer .hotline {
min-width: 200px
}
footer .hotline img {
margin-right: 12px;
max-width: 30px;
min-width: 10px;
opacity: .5
}
.newsletter {
position: relative
}
.newsletter .newsletter-inner {
background: url(../imgs/banner/banner-10.png) no-repeat 50%;
background-size: cover;
border-radius: 20px;
clear: both;
display: table;
min-height: 230px;
overflow: hidden;
padding: 84px 78px;
width: 100%
}
.newsletter .newsletter-inner img {
bottom: 0;
max-width: 40%;
position: absolute;
right: 50px
}
.newsletter .newsletter-inner .newsletter-content p {
font-size: 18px
}
.newsletter .newsletter-inner .newsletter-content .form-subscribe {
background-color: #fff;
border-radius: 50px;
margin-bottom: 10px;
max-width: 450px;
position: relative;
z-index: 4
}
.newsletter .newsletter-inner .newsletter-content .form-subscribe input {
background: url(../imgs/theme/icons/icon-plane.png) no-repeat 25px;
border: 0;
border-radius: 50px 0 0 50px;
padding-left: 58px
}
.newsletter .newsletter-inner .newsletter-content .form-subscribe button {
border: 0;
border-radius: 50px;
font-weight: 700
}
.widget-about {
font-size: 15px;
min-width: 300px
}
.widget-install-app {
min-width: 310px
}
.contact-infor {
color: var(--color-heading);
font-size: 15px
}
.contact-infor li:not(:last-child) {
margin-bottom: 10px
}
.contact-infor li img {
margin-right: 8px;
max-width: 16px
}
.footer-link-widget:not(:last-child) {
margin-right: 50px
}
.footer-link-widget p {
color: var(--color-heading);
font-size: 15px
}
.download-app {
display: flex;
flex-wrap: wrap;
margin: 25px 0 33px
}
.download-app a {
display: block;
margin-right: 12px
}
.download-app a img {
max-width: 128px
}
.footer-list {
list-style: none outside none;
margin: 0;
min-width: 170px;
padding: 0
}
.footer-list li {
display: block;
margin: 0 0 13px;
transition-duration: .3s
}
.footer-list li:last-child {
margin: 0
}
.footer-list li:hover {
padding-left: 5px;
transition-duration: .3s
}
.footer-list li a {
color: var(--color-heading);
display: block;
font-size: 15px
}
.footer-list li a:hover {
color: var(--color-brand)
}
.footer-bottom {
border-top: 1px solid rgba(var(--color-brand-rgb), .4)
}
#scrollUp {
background-color: #fff;
border: 2px solid var(--color-heading);
border-radius: 30px;
bottom: 30px;
color: var(--color-heading);
height: 32px;
overflow: hidden;
right: 30px;
text-align: center;
width: 32px;
z-index: 999 !important
}
#scrollUp i {
display: block;
font-size: 25px;
line-height: 40px !important
}
#scrollUp:hover {
transform: translateY(-5px)
}
.footer-mid .widget-title {
margin: 15px 0 20px
}
.section-padding-30 {
padding: 30px 0
}
.section-padding-50 {
padding: 50px 0
}
.section-padding-60 {
padding: 60px 0
}
.section-padding {
padding: 25px 0
}
.ptb-0 {
padding: 0
}
.ptb-10 {
padding: 10px 0
}
.ptb-20 {
padding: 20px 0
}
.ptb-30 {
padding: 30px 0
}
.ptb-35 {
padding: 35px 0
}
.ptb-32 {
padding: 32px 0
}
.ptb-40 {
padding: 40px 0
}
.ptb-50 {
padding: 50px 0
}
.ptb-60 {
padding: 60px 0
}
.ptb-70 {
padding: 70px 0
}
.ptb-80 {
padding: 80px 0
}
.ptb-90 {
padding: 90px 0
}
.ptb-100 {
padding: 100px 0
}
.ptb-110 {
padding: 110px 0
}
.ptb-120 {
padding: 120px 0
}
.ptb-130 {
padding: 130px 0
}
.ptb-140 {
padding: 140px 0
}
.ptb-150 {
padding: 150px 0
}
.ptb-160 {
padding: 160px 0
}
.ptb-170 {
padding: 170px 0
}
.ptb-177 {
padding: 177px 0
}
.ptb-180 {
padding: 180px 0
}
.ptb-190 {
padding: 190px 0
}
.ptb-200 {
padding: 200px 0
}
.ptb-210 {
padding: 210px 0
}
.ptb-220 {
padding: 220px 0
}
.ptb-290 {
padding: 290px 0
}
.ptb-310 {
padding: 310px 0
}
.p-10 {
padding: 10px !important
}
.p-15 {
padding: 15px !important
}
.p-20 {
padding: 20px !important
}
.p-25 {
padding: 25px !important
}
.p-30 {
padding: 30px !important
}
.p-40 {
padding: 40px !important
}
.p-65 {
padding: 65px !important
}
.pt-5 {
padding-top: 5px !important
}
.pt-10 {
padding-top: 10px !important
}
.pt-15 {
padding-top: 15px !important
}
.pt-20 {
padding-top: 20px !important
}
.pt-25 {
padding-top: 25px !important
}
.pt-30 {
padding-top: 30px !important
}
.pt-35 {
padding-top: 35px !important
}
.pt-40 {
padding-top: 40px !important
}
.pt-45 {
padding-top: 45px !important
}
.pt-50 {
padding-top: 50px !important
}
.pt-55 {
padding-top: 55px !important
}
.pt-60 {
padding-top: 60px !important
}
.pt-65 {
padding-top: 65px !important
}
.pt-70 {
padding-top: 70px !important
}
.pt-75 {
padding-top: 75px !important
}
.pt-80 {
padding-top: 80px !important
}
.pt-85 {
padding-top: 85px !important
}
.pt-90 {
padding-top: 90px !important
}
.pt-95 {
padding-top: 95px !important
}
.pt-100 {
padding-top: 100px !important
}
.pt-105 {
padding-top: 105px !important
}
.pt-110 {
padding-top: 110px !important
}
.pt-115 {
padding-top: 115px !important
}
.pt-120 {
padding-top: 120px !important
}
.pt-125 {
padding-top: 125px !important
}
.pt-130 {
padding-top: 130px !important
}
.pt-135 {
padding-top: 135px !important
}
.pt-140 {
padding-top: 140px !important
}
.pt-145 {
padding-top: 145px !important
}
.pt-150 {
padding-top: 150px !important
}
.pt-155 {
padding-top: 155px !important
}
.pt-160 {
padding-top: 160px !important
}
.pt-165 {
padding-top: 165px !important
}
.pt-170 {
padding-top: 170px !important
}
.pt-175 {
padding-top: 175px !important
}
.pt-180 {
padding-top: 180px !important
}
.pt-185 {
padding-top: 185px !important
}
.pt-190 {
padding-top: 190px !important
}
.pt-195 {
padding-top: 195px !important
}
.pt-200 {
padding-top: 200px !important
}
.pt-260 {
padding-top: 260px !important
}
.pb-5 {
padding-bottom: 5px !important
}
.pb-10 {
padding-bottom: 10px !important
}
.pb-15 {
padding-bottom: 15px !important
}
.pb-20 {
padding-bottom: 20px !important
}
.pb-25 {
padding-bottom: 25px !important
}
.pb-30 {
padding-bottom: 30px !important
}
.pb-35 {
padding-bottom: 35px !important
}
.pb-40 {
padding-bottom: 40px !important
}
.pb-45 {
padding-bottom: 45px !important
}
.pb-50 {
padding-bottom: 50px !important
}
.pb-55 {
padding-bottom: 55px !important
}
.pb-60 {
padding-bottom: 60px !important
}
.pb-65 {
padding-bottom: 65px !important
}
.pb-70 {
padding-bottom: 70px !important
}
.pb-75 {
padding-bottom: 75px !important
}
.pb-80 {
padding-bottom: 80px !important
}
.pb-85 {
padding-bottom: 85px !important
}
.pb-90 {
padding-bottom: 90px !important
}
.pb-95 {
padding-bottom: 95px !important
}
.pb-100 {
padding-bottom: 100px !important
}
.pb-105 {
padding-bottom: 105px !important
}
.pb-110 {
padding-bottom: 110px !important
}
.pb-115 {
padding-bottom: 115px !important
}
.pb-120 {
padding-bottom: 120px !important
}
.pb-125 {
padding-bottom: 125px !important
}
.pb-130 {
padding-bottom: 130px !important
}
.pb-135 {
padding-bottom: 135px !important
}
.pb-140 {
padding-bottom: 140px !important
}
.pb-145 {
padding-bottom: 145px !important
}
.pb-150 {
padding-bottom: 150px !important
}
.pb-155 {
padding-bottom: 155px !important
}
.pb-160 {
padding-bottom: 160px !important
}
.pb-165 {
padding-bottom: 165px !important
}
.pb-170 {
padding-bottom: 170px !important
}
.pb-175 {
padding-bottom: 175px !important
}
.pb-180 {
padding-bottom: 180px !important
}
.pb-185 {
padding-bottom: 185px !important
}
.pb-190 {
padding-bottom: 190px !important
}
.pb-195 {
padding-bottom: 195px !important
}
.pb-200 {
padding-bottom: 200px !important
}
.pl-5 {
padding-left: 5px !important
}
.pl-10 {
padding-left: 10px !important
}
.pl-15 {
padding-left: 15px !important
}
.pl-20 {
padding-left: 20px !important
}
.pl-25 {
padding-left: 25px !important
}
.pl-30 {
padding-left: 30px !important
}
.pl-35 {
padding-left: 35px !important
}
.pl-40 {
padding-left: 40px !important
}
.pl-45 {
padding-left: 45px !important
}
.pl-50 {
padding-left: 50px !important
}
.pl-55 {
padding-left: 55px !important
}
.pl-60 {
padding-left: 60px !important
}
.pl-65 {
padding-left: 65px !important
}
.pl-70 {
padding-left: 70px !important
}
.pl-75 {
padding-left: 75px !important
}
.pl-80 {
padding-left: 80px !important
}
.pl-85 {
padding-left: 85px !important
}
.pl-90 {
padding-left: 90px !important
}
.pl-95 {
padding-left: 95px !important
}
.pl-100 {
padding-left: 100px !important
}
.pl-105 {
padding-left: 105px !important
}
.pl-110 {
padding-left: 110px !important
}
.pl-115 {
padding-left: 115px !important
}
.pl-120 {
padding-left: 120px !important
}
.pl-125 {
padding-left: 125px !important
}
.pl-130 {
padding-left: 130px !important
}
.pl-135 {
padding-left: 135px !important
}
.pl-140 {
padding-left: 140px !important
}
.pl-145 {
padding-left: 145px !important
}
.pl-150 {
padding-left: 150px !important
}
.pl-155 {
padding-left: 155px !important
}
.pl-160 {
padding-left: 160px !important
}
.pl-165 {
padding-left: 165px !important
}
.pl-170 {
padding-left: 170px !important
}
.pl-175 {
padding-left: 175px !important
}
.pl-180 {
padding-left: 180px !important
}
.pl-185 {
padding-left: 185px !important
}
.pl-190 {
padding-left: 190px !important
}
.pl-195 {
padding-left: 195px !important
}
.pl-200 {
padding-left: 200px !important
}
.pr-5 {
padding-right: 5px !important
}
.pr-10 {
padding-right: 10px !important
}
.pr-15 {
padding-right: 15px !important
}
.pr-20 {
padding-right: 20px !important
}
.pr-25 {
padding-right: 25px !important
}
.pr-30 {
padding-right: 30px !important
}
.pr-35 {
padding-right: 35px !important
}
.pr-40 {
padding-right: 40px !important
}
.pr-45 {
padding-right: 45px !important
}
.pr-50 {
padding-right: 50px !important
}
.pr-55 {
padding-right: 55px !important
}
.pr-60 {
padding-right: 60px !important
}
.pr-65 {
padding-right: 65px !important
}
.pr-70 {
padding-right: 70px !important
}
.pr-75 {
padding-right: 75px !important
}
.pr-80 {
padding-right: 80px !important
}
.pr-85 {
padding-right: 85px !important
}
.pr-90 {
padding-right: 90px !important
}
.pr-95 {
padding-right: 95px !important
}
.pr-100 {
padding-right: 100px !important
}
.pr-105 {
padding-right: 105px !important
}
.pr-110 {
padding-right: 110px !important
}
.pr-115 {
padding-right: 115px !important
}
.pr-120 {
padding-right: 120px !important
}
.pr-125 {
padding-right: 125px !important
}
.pr-130 {
padding-right: 130px !important
}
.pr-135 {
padding-right: 135px !important
}
.pr-140 {
padding-right: 140px !important
}
.pr-145 {
padding-right: 145px !important
}
.pr-150 {
padding-right: 150px !important
}
.pr-155 {
padding-right: 155px !important
}
.pr-160 {
padding-right: 160px !important
}
.pr-165 {
padding-right: 165px !important
}
.pr-170 {
padding-right: 170px !important
}
.pr-175 {
padding-right: 175px !important
}
.pr-180 {
padding-right: 180px !important
}
.pr-185 {
padding-right: 185px !important
}
.pr-190 {
padding-right: 190px !important
}
.pr-195 {
padding-right: 195px !important
}
.pr-200 {
padding-right: 200px !important
}
.plr-5-percent {
padding: 0 5%
}
.mtb-0 {
margin: 0
}
.mtb-10 {
margin: 10px 0
}
.mtb-15 {
margin: 15px 0
}
.mtb-20 {
margin: 20px 0
}
.mtb-30 {
margin: 30px 0
}
.mtb-40 {
margin: 40px 0
}
.mtb-50 {
margin: 50px 0
}
.mtb-60 {
margin: 60px 0
}
.mtb-70 {
margin: 70px 0
}
.mtb-80 {
margin: 80px 0
}
.mtb-90 {
margin: 90px 0
}
.mtb-100 {
margin: 100px 0
}
.mtb-110 {
margin: 110px 0
}
.mtb-120 {
margin: 120px 0
}
.mtb-130 {
margin: 130px 0
}
.mtb-140 {
margin: 140px 0
}
.mtb-150 {
margin: 150px 0
}
.mtb-290 {
margin: 290px 0
}
.mb-24 {
margin-bottom: 24px
}
.mt-5 {
margin-top: 5px !important
}
.mt-10 {
margin-top: 10px !important
}
.mt-15 {
margin-top: 15px !important
}
.mt-20 {
margin-top: 20px !important
}
.mt-25 {
margin-top: 25px !important
}
.mt-30 {
margin-top: 30px !important
}
.mt-35 {
margin-top: 35px !important
}
.mt-40 {
margin-top: 40px !important
}
.mt-45 {
margin-top: 45px !important
}
.mt-50 {
margin-top: 50px !important
}
.mt-55 {
margin-top: 55px !important
}
.mt-60 {
margin-top: 60px !important
}
.mt-65 {
margin-top: 65px !important
}
.mt-70 {
margin-top: 70px !important
}
.mt-75 {
margin-top: 75px !important
}
.mt-80 {
margin-top: 80px !important
}
.mt-85 {
margin-top: 85px !important
}
.mt-90 {
margin-top: 90px !important
}
.mt-95 {
margin-top: 95px !important
}
.mt-100 {
margin-top: 100px !important
}
.mt-105 {
margin-top: 105px !important
}
.mt-110 {
margin-top: 110px !important
}
.mt-115 {
margin-top: 115px !important
}
.mt-120 {
margin-top: 120px !important
}
.mt-125 {
margin-top: 125px !important
}
.mt-130 {
margin-top: 130px !important
}
.mt-135 {
margin-top: 135px !important
}
.mt-140 {
margin-top: 140px !important
}
.mt-145 {
margin-top: 145px !important
}
.mt-150 {
margin-top: 150px !important
}
.mt-155 {
margin-top: 155px !important
}
.mt-160 {
margin-top: 160px !important
}
.mt-165 {
margin-top: 165px !important
}
.mt-170 {
margin-top: 170px !important
}
.mt-175 {
margin-top: 175px !important
}
.mt-180 {
margin-top: 180px !important
}
.mt-185 {
margin-top: 185px !important
}
.mt-190 {
margin-top: 190px !important
}
.mt-195 {
margin-top: 195px !important
}
.mt-200 {
margin-top: 200px !important
}
.mb-5 {
margin-bottom: 5px !important
}
.mb-10 {
margin-bottom: 10px !important
}
.mb-15 {
margin-bottom: 15px !important
}
.mb-20 {
margin-bottom: 20px !important
}
.mb-25 {
margin-bottom: 25px !important
}
.mb-30 {
margin-bottom: 30px !important
}
.mb-35 {
margin-bottom: 35px !important
}
.mb-40 {
margin-bottom: 40px !important
}
.mb-45 {
margin-bottom: 45px !important
}
.mb-50 {
margin-bottom: 50px !important
}
.mb-55 {
margin-bottom: 55px !important
}
.mb-60 {
margin-bottom: 60px !important
}
.mb-65 {
margin-bottom: 65px !important
}
.mb-70 {
margin-bottom: 70px !important
}
.mb-75 {
margin-bottom: 75px !important
}
.mb-80 {
margin-bottom: 80px !important
}
.mb-85 {
margin-bottom: 85px !important
}
.mb-90 {
margin-bottom: 90px !important
}
.mb-95 {
margin-bottom: 95px !important
}
.mb-100 {
margin-bottom: 100px !important
}
.mb-105 {
margin-bottom: 105px !important
}
.mb-110 {
margin-bottom: 110px !important
}
.mb-115 {
margin-bottom: 115px !important
}
.mb-120 {
margin-bottom: 120px !important
}
.mb-125 {
margin-bottom: 125px !important
}
.mb-130 {
margin-bottom: 130px !important
}
.mb-135 {
margin-bottom: 135px !important
}
.mb-140 {
margin-bottom: 140px !important
}
.mb-145 {
margin-bottom: 145px !important
}
.mb-150 {
margin-bottom: 150px !important
}
.mb-155 {
margin-bottom: 155px !important
}
.mb-160 {
margin-bottom: 160px !important
}
.mb-165 {
margin-bottom: 165px !important
}
.mb-170 {
margin-bottom: 170px !important
}
.mb-175 {
margin-bottom: 175px !important
}
.mb-180 {
margin-bottom: 180px !important
}
.mb-185 {
margin-bottom: 185px !important
}
.mb-190 {
margin-bottom: 190px !important
}
.mb-195 {
margin-bottom: 195px !important
}
.mb-200 {
margin-bottom: 200px !important
}
.ml-0 {
margin-left: 0 !important
}
.ml-5 {
margin-left: 5px !important
}
.ml-10 {
margin-left: 10px !important
}
.ml-15 {
margin-left: 15px !important
}
.ml-20 {
margin-left: 20px !important
}
.ml-25 {
margin-left: 25px !important
}
.ml-30 {
margin-left: 30px !important
}
.ml-35 {
margin-left: 35px !important
}
.ml-40 {
margin-left: 40px !important
}
.ml-45 {
margin-left: 45px !important
}
.ml-50 {
margin-left: 50px !important
}
.ml-55 {
margin-left: 55px !important
}
.ml-60 {
margin-left: 60px !important
}
.ml-65 {
margin-left: 65px !important
}
.ml-70 {
margin-left: 70px !important
}
.ml-75 {
margin-left: 75px !important
}
.ml-80 {
margin-left: 80px !important
}
.ml-85 {
margin-left: 85px !important
}
.ml-90 {
margin-left: 90px !important
}
.ml-95 {
margin-left: 95px !important
}
.ml-100 {
margin-left: 100px !important
}
.ml-105 {
margin-left: 105px !important
}
.ml-110 {
margin-left: 110px !important
}
.ml-115 {
margin-left: 115px !important
}
.ml-120 {
margin-left: 120px !important
}
.ml-125 {
margin-left: 125px !important
}
.ml-130 {
margin-left: 130px !important
}
.ml-135 {
margin-left: 135px !important
}
.ml-140 {
margin-left: 140px !important
}
.ml-145 {
margin-left: 145px !important
}
.ml-150 {
margin-left: 150px !important
}
.ml-155 {
margin-left: 155px !important
}
.ml-160 {
margin-left: 160px !important
}
.ml-165 {
margin-left: 165px !important
}
.ml-170 {
margin-left: 170px !important
}
.ml-175 {
margin-left: 175px !important
}
.ml-180 {
margin-left: 180px !important
}
.ml-185 {
margin-left: 185px !important
}
.ml-190 {
margin-left: 190px !important
}
.ml-195 {
margin-left: 195px !important
}
.ml-200 {
margin-left: 200px !important
}
.mr-5 {
margin-right: 5px !important
}
.mr-10 {
margin-right: 10px !important
}
.mr-15 {
margin-right: 15px !important
}
.mr-20 {
margin-right: 20px !important
}
.mr-25 {
margin-right: 25px !important
}
.mr-30 {
margin-right: 30px !important
}
.mr-35 {
margin-right: 35px !important
}
.mr-40 {
margin-right: 40px !important
}
.mr-45 {
margin-right: 45px !important
}
.mr-50 {
margin-right: 50px !important
}
.mr-55 {
margin-right: 55px !important
}
.mr-60 {
margin-right: 60px !important
}
.mr-65 {
margin-right: 65px !important
}
.mr-70 {
margin-right: 70px !important
}
.mr-75 {
margin-right: 75px !important
}
.mr-80 {
margin-right: 80px !important
}
.mr-85 {
margin-right: 85px !important
}
.mr-90 {
margin-right: 90px !important
}
.mr-95 {
margin-right: 95px !important
}
.mr-100 {
margin-right: 100px !important
}
.mr-105 {
margin-right: 105px !important
}
.mr-110 {
margin-right: 110px !important
}
.mr-115 {
margin-right: 115px !important
}
.mr-120 {
margin-right: 120px !important
}
.mr-125 {
margin-right: 125px !important
}
.mr-130 {
margin-right: 130px !important
}
.mr-135 {
margin-right: 135px !important
}
.mr-140 {
margin-right: 140px !important
}
.mr-145 {
margin-right: 145px !important
}
.mr-150 {
margin-right: 150px !important
}
.mr-155 {
margin-right: 155px !important
}
.mr-160 {
margin-right: 160px !important
}
.mr-165 {
margin-right: 165px !important
}
.mr-170 {
margin-right: 170px !important
}
.mr-175 {
margin-right: 175px !important
}
.mr-180 {
margin-right: 180px !important
}
.mr-185 {
margin-right: 185px !important
}
.mr-190 {
margin-right: 190px !important
}
.mr-195 {
margin-right: 195px !important
}
.mr-200 {
margin-right: 200px !important
}
@media only screen and (max-width:992px) {
.logo.logo-width-1 {
left: 120px;
margin-right: 0;
position: absolute;
transform: translateX(-50%)
}
.logo.logo-width-1 a img {
min-width: 150px;
width: 150px
}
}
@media only screen and (max-width:768px) {
.total-product h2 {
font-size: 28px
}
.loop-grid.loop-list article .post-thumb {
min-height: 220px;
min-width: 300px
}
.loop-grid.loop-list article h3.post-title {
font-size: 22px;
margin-bottom: 30px !important
}
.loop-grid.loop-list article .post-exerpt {
display: none
}
.loop-grid.loop-list article .entry-content-2.pl-50 {
padding-left: 30px !important
}
.loop-big h2.post-title {
font-size: var(--heading-font-size)
}
.header-style-1 .header-bottom-bg-color {
box-shadow: 0 2px 5px rgba(0, 0, 0, .07)
}
.header-action-2 .header-action-icon-2:last-child {
padding: 0
}
.header-bottom {
padding: 10px 0
}
.header-action .header-action-icon,
.header-action .header-action-icon.header-action-mrg-none,
.header-action .header-action-icon.header-action-mrg-none2 {
margin-right: 15px
}
.header-action .header-action-icon>a {
font-size: 20px
}
.header-action-2 .header-action-icon-2 {
padding: 0 6px
}
.header-action-2 .header-action-icon-2:last-child {
padding: 0 0 0 6px
}
.header-action-2 .header-action-icon-2>a {
fill: #fff;
color: #fff;
font-size: 22px;
margin-right: 10px
}
.cart-dropdown-wrap {
right: -39px;
width: 290px
}
.cart-dropdown-wrap ul li .shopping-cart-img {
flex: 0 0 60px;
margin-right: 10px
}
.cart-dropdown-wrap .shopping-cart-footer .shopping-cart-button a {
padding: 12px 22px 13px
}
.categories-dropdown-wrap ul li a {
padding: 5px 12px
}
.search-popup-wrap .search-popup-content form input {
font-size: 25px;
padding: 21px 20px 12px 0;
width: 270px
}
.mobile-header-wrapper-style {
width: 380px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-top {
border-bottom: 1px solid #ececec;
padding: 15px 30px 13px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-top .mobile-header-logo a img {
width: 140px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area {
padding: 30px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .main-categories-wrap {
border-bottom: 1px solid #ececec;
margin: 0
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .main-categories-wrap .categories-dropdown-wrap {
padding: 10px 0
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .main-categories-wrap .categories-dropdown-wrap ul.categories-dropdown {
padding: 0;
padding-inline-start: 15px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .main-categories-wrap .categories-dropdown-wrap ul.categories-dropdown li {
border: none;
height: auto;
line-height: 30px;
padding: 0
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .main-categories-wrap .categories-dropdown-wrap ul.categories-dropdown li:hover {
box-shadow: none
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .main-categories-wrap .categories-dropdown-wrap ul.categories-dropdown li:hover a {
color: var(--primary-color)
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .main-categories-wrap .categories-dropdown-wrap ul.categories-dropdown li:last-child {
border-bottom: none
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .main-categories-wrap .categories-dropdown-wrap ul.categories-dropdown li a {
align-items: center;
color: var(--color-heading);
display: flex;
font-size: 14px;
line-height: 1;
padding: 5px 0
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .main-categories-wrap .categories-dropdown-wrap ul.categories-dropdown li a img {
margin-right: 15px;
max-width: 30px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .main-categories-wrap .categories-dropdown-wrap ul.categories-dropdown li a i {
color: var(--color-brand);
font-size: 20px;
margin: 0;
margin-inline-end: 10px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .main-categories-wrap .categories-dropdown-wrap ul.categories-dropdown li a:hover {
color: var(--color-brand)
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .main-categories-wrap .categories-button-active-2 {
align-items: center;
color: var(--color-heading);
display: flex;
font-size: 14px;
padding: 10px 0
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .main-categories-wrap .categories-button-active-2 i {
margin-left: 0;
margin-top: 0;
padding: 0
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .main-categories-wrap .categories-button-active-2 i.fi-rs-angle-down {
color: #253d4e;
font-size: 14px;
height: 30px;
line-height: 38px !important;
margin-left: auto;
margin-right: 0;
margin-inline-end: 8px;
text-align: end;
width: 30px
}
.header-height-1,
.header-height-2 {
min-height: 65px
}
.home-slider.pt-50 {
padding-top: 0 !important
}
.hero-slider-content-2 h1 {
font-size: var(--heading-font-size);
line-height: 1.2
}
.hero-slider-content-2 h2 {
font-size: 30px;
line-height: 1.2;
margin-bottom: 10px
}
.hero-slider-content-2 h4 {
font-size: 16px;
margin: 0 0 10px
}
.hero-slider-content-2 .btn-default {
background-color: var(--color-brand);
border-radius: 50px;
color: #fff;
font-size: 14px;
padding: 10px 22px
}
.hero-slider-content-2 p {
font-size: 14px;
line-height: 1.3
}
.banner-big h4 {
font-size: 12px
}
.banner-big h2 {
font-size: 16px
}
.banner-big .btn {
background-color: var(--color-brand);
border: 0;
border-radius: 3px;
color: #fff;
font-size: 13px;
padding: 10px 22px
}
.home-slider .slider-arrow {
display: none
}
.home-slider .hero-slider-1.style-2 {
height: 400px
}
.home-slider .hero-slider-1.style-2 .hero-slider-content-2 {
padding-left: 0;
padding-top: 100px
}
.home-slider .hero-slider-1.style-2 .single-slider-img img {
max-width: 400px
}
.home-slider .hero-slider-1.style-2 .slider-1-height-2 {
height: 400px;
position: relative
}
.banner-img {
float: left
}
.banner-img.f-none {
float: none
}
.hero-slider-1.style-3 .slider-1-height-3 {
height: 390px
}
.hero-slider-1.style-3 .hero-slider-content-2 {
padding-left: 20px
}
.home-slide-cover .hero-slider-1.style-4 .hero-slider-content-2 {
padding-left: 0
}
.home-slide-cover .hero-slider-1.style-4 .hero-slider-content-2 h1 {
font-size: 30px
}
.home-slide-cover .hero-slider-1.style-4 .hero-slider-content-2 h2 {
font-size: 14px
}
.home-slide-cover .hero-slider-1.style-4 .hero-slider-content-2 h4 {
font-size: 12px
}
.header-style-3 .header-bottom-bg-color {
border-bottom: 2px solid var(--color-brand)
}
.header-style-3 .main-nav {
border: none !important
}
.header-style-3 .sticky-bar.stick.sticky-blue-bg {
background-color: var(--color-brand)
}
.header-style-4 .main-nav {
border: none !important
}
.header-style-4 .sticky-bar.stick.sticky-blue-bg {
background-color: var(--color-brand)
}
.font-xxl {
font-size: 38px
}
.single-page.pl-30,
.single-page.pr-30 {
padding-left: 0 !important;
padding-right: 0 !important
}
.download-app {
margin-bottom: 0 !important
}
.footer-mid .logo img {
max-width: 150px
}
.footer-mid .widget-about,
.footer-mid .widget-install-app {
min-width: 205px
}
.footer-mid .widget-about strong {
display: none
}
.product-list .product-cart-wrap {
align-items: start
}
.product-list .product-cart-wrap .product-img-action-wrap {
max-width: 45%
}
.product-list .product-cart-wrap h2 {
font-size: 24px
}
.product-list .product-cart-wrap p.mt-15 {
display: none
}
.product-list .product-cart-wrap .product-rate-cover {
margin-bottom: 20px
}
.detail-info {
padding: 0 !important
}
.detail-info h2 {
font-size: 30px
}
.detail-info .detail-extralink .detail-qty {
max-width: 60px;
padding: 11px 20px 11px 10px
}
.detail-info .product-extra-link2 .button.button-add-to-cart {
padding: 0 15px
}
.detail-info .product-extra-link2 .button.button-add-to-cart i {
display: none
}
.shopping-summery table tbody tr img {
margin-right: 15px;
max-width: 80px
}
.shopping-summery .form-check-label {
display: none
}
.shopping-summery h6 {
font-size: 14px
}
.shopping-summery td.pl-30 {
padding-left: 0 !important
}
.shopping-summery button.btn {
margin-left: 15px;
width: 120px
}
.custom-modal .modal-dialog {
max-width: 720px !important
}
}
@media only screen and (min-width:768px)and (max-width:992px) {
.mobile-promotion {
background: var(--color-brand);
color: #fff;
display: block;
padding: 7px 0;
text-align: center
}
}
@media only screen and (min-width:576px)and (max-width:767px) {
.header-action .header-action-icon,
.header-action .header-action-icon.header-action-mrg-none,
.header-action .header-action-icon.header-action-mrg-none2 {
margin-right: 20px
}
.header-action .header-action-icon>a {
font-size: 22px
}
.header-action-2 .header-action-icon-2 {
padding: 0 10px
}
.header-action-2 .header-action-icon-2:last-child {
padding: 0 0 0 10px
}
.header-action-2 .header-action-icon-2>a {
font-size: 22px
}
.cart-dropdown-wrap {
width: 310px
}
.search-popup-wrap .search-popup-content form input {
font-size: 25px;
padding: 21px 20px 12px 0;
width: 480px
}
.comment-form .name {
margin-bottom: 1rem;
padding-right: 0
}
.header-style-5 .search-style-2 {
display: none
}
}
@media only screen and (min-width:768px)and (max-width:991px) {
.header-action .header-action-icon,
.header-action .header-action-icon.header-action-mrg-none,
.header-action .header-action-icon.header-action-mrg-none2 {
margin-right: 33px
}
.header-action-2 .header-action-icon-2>a {
fill: #fff;
color: #fff
}
.search-popup-wrap .search-popup-content form input {
font-size: 35px;
width: 650px
}
.header-height-1 {
min-height: 50px
}
.header-height-2 {
border-bottom: 2px solid var(--color-brand);
min-height: 50px
}
.header-height-3,
.header-height-4 {
min-height: 50px
}
.header-style-5 .header-bottom {
border-bottom: 1px solid #f7f8f9;
padding: 5px 0
}
.comment-form .email {
padding-left: 0
}
.loop-grid.pr-30 {
padding-right: 0 !important
}
}
@media only screen and (min-width:992px)and (max-width:1199px) {
.total-product h2 {
font-size: 28px
}
.loop-grid.loop-list article .post-thumb {
min-height: 220px;
min-width: 300px
}
.loop-grid.loop-list article h3.post-title {
font-size: 22px;
margin-bottom: 30px !important
}
.loop-grid.loop-list article .post-exerpt {
display: none
}
.loop-grid.loop-list article .entry-content-2.pl-50 {
padding-left: 30px !important
}
.logo.logo-hm3 a img {
width: 120px
}
.header-style-5 .search-style-2 {
display: none
}
.main-menu.main-menu-mrg-1 {
margin: 0 0 0 15px
}
.main-menu>nav>ul>li ul.sub-menu li ul.level-menu.level-menu-modify {
width: 165px
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap .menu-banner-content {
left: 20px;
top: 22px
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap .menu-banner-content h3 {
font-size: 20px;
line-height: 1.3;
margin: 5px 0 7px
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap .menu-banner-content .menu-banner-price {
margin: 0 0 10px
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap .menu-banner-content .menu-banner-btn a {
padding: 10px 16px 13px
}
.main-menu>nav>ul>li ul.mega-menu li .menu-banner-wrap .menu-banner-discount {
height: 70px;
line-height: 70px;
width: 70px
}
.main-menu.main-menu-padding-1>nav>ul>li {
padding: 0 8px
}
.main-menu.main-menu-padding-1.hm3-menu-padding>nav>ul>li {
padding: 0 6px
}
.search-style-1 {
margin-right: 15px
}
.search-style-1 form {
width: 170px
}
.header-action.header-action-hm3 .header-action-icon {
margin-right: 15px
}
.header-action.header-action-hm3 .header-action-icon.header-action-mrg-none2,
.header-action.header-action-hm3 .header-action-icon:last-child {
margin-right: 0
}
.search-style-2 form input {
width: 340px
}
.hotline p {
font-size: 15px
}
.search-popup-wrap .search-popup-content form input {
width: 820px
}
.header-height-1 {
min-height: 157px
}
.header-height-3 {
min-height: 133px
}
.header-height-4 {
min-height: 144px
}
}
@media(min-width:992px) {
.col-md-1-5 {
width: 20%
}
.col-md-2-5 {
width: 40%
}
.col-md-3-5 {
width: 60%
}
.col-md-4-5 {
width: 80%
}
.col-md-5-5 {
width: 100%
}
}
@media only screen and (min-width:1600px) {
.header-action-right .search-location {
display: block
}
}
@media only screen and (min-width:1200px) {
.container {
max-width: 1610px
}
.col-lg-1-5 {
width: 20%
}
.col-lg-2-5 {
width: 40%
}
.col-lg-3-5 {
width: 60%
}
.col-lg-4-5 {
width: 80%
}
.col-lg-5-5 {
width: 100%
}
.header-action-right {
align-items: center;
display: flex;
flex-shrink: 0;
justify-content: flex-end
}
}
@media only screen and (min-width:1200px)and (max-width:1365px) {
.main-menu.main-menu-padding-1>nav>ul>li {
padding: 0 14px
}
}
@media only screen and (max-width:1400px) {
.product-cart-wrap.style-2 .product-content-wrap {
max-width: 94%
}
.hero-slider-1 .single-hero-slider {
height: 400px
}
.display-2 {
font-size: 64px
}
.banner-img.style-2 {
height: 400px
}
.slider-nav-thumbnails button.slick-arrow.slick-prev {
left: 10px
}
.slider-nav-thumbnails button.slick-arrow.slick-next {
right: 10px
}
.zoomContainer {
display: none
}
.detail-info h2 {
font-size: 30px
}
.tab-style3 .nav-item {
margin-bottom: 15px
}
}
@media only screen and (max-width:1024px) {
.header-style-1 .main-categories-wrap {
margin-right: 20px
}
.product-cart-wrap .product-action-1 .product-action-wrap {
max-width: 111px
}
.product-cart-wrap .product-action-1 .product-action-wrap a.action-btn {
font-size: 13px;
height: 34px;
line-height: 40px;
width: 34px
}
.banner-big h1 {
font-size: 22px
}
.banner-big .btn {
border: 0;
border-radius: 3px;
font-size: 12px;
padding: 6px 12px
}
.banner-img .banner-text h4 {
margin-top: 0 !important
}
.footer-link-cover {
display: block
}
.footer-link-cover .footer-link-widget {
float: left;
margin-bottom: 30px;
margin-right: 30px
}
.footer-link-cover .footer-link-widget:not(:last-child) {
margin-right: 30px
}
.et,
.header-action-2 .header-action-icon-2 span.lable,
.hotline,
li.hot-deals {
display: none !important
}
.main-menu.main-menu-padding-1>nav>ul>li {
padding: 0 10px
}
.hero-slider-1 .single-hero-slider {
height: 350px
}
.hero-slider-1 .single-hero-slider .display-2 {
font-size: 46px;
margin-bottom: 5px !important
}
.hero-slider-1 .single-hero-slider .slider-content p {
font-size: 22px;
margin-bottom: 40px !important
}
.banner-img .banner-text h4 {
font-size: 18px;
min-height: 50px
}
.header-style-1 .search-style-2 form {
max-width: 450px
}
.header-action-2 .header-action-icon-2:last-child {
padding: 0 0 0 8px
}
.nav-tabs.links .nav-link {
font-size: 14px;
padding: 0 7px
}
.deals-countdown .countdown-section {
margin-left: 2px;
margin-right: 2px;
padding: 20px 2px 30px
}
.section-title.style-1 {
font-size: 20px;
padding-bottom: 15px
}
.product-list-small h6 {
font-size: 14px
}
.product-list-small .product-rate-cover {
display: none
}
.section-title.style-2 {
display: block
}
.section-title.style-2 h2,
.section-title.style-2 h3 {
font-size: 28px;
margin-bottom: 25px
}
.modal-open .modal {
padding-right: 0 !important
}
.vendor-wrap.style-2 {
display: block
}
}
@media only screen and (max-width:480px) {
.archive-header {
padding: 30px
}
.mobile-promotion {
background: var(--color-brand);
color: #fff;
display: block;
padding: 7px 0;
text-align: center
}
.loop-big h2.post-title {
font-size: 22px
}
.entry-meta.meta-1 {
justify-content: start
}
.single-header-meta .single-share {
display: none
}
.single-content blockquote {
border-radius: 15px;
font-size: 16px;
margin: 20px auto;
max-width: 100%;
padding: 20px 30px
}
.single-content blockquote p {
font-size: 16px;
line-height: 22px
}
.hero-slider-1 .single-hero-slider .display-2 {
font-size: var(--heading-font-size)
}
.hero-slider-1 .single-hero-slider .slider-content p {
font-size: 16px;
margin-bottom: 8px !important
}
.hero-slider-1 .single-hero-slider .slider-content .form-subscribe {
max-width: 310px
}
.hero-slider-1 .single-hero-slider .slider-content .form-subscribe button.submit,
.hero-slider-1 .single-hero-slider .slider-content .form-subscribe button[type=submit] {
padding: 12px 20px
}
.security-code {
padding: 0 20px
}
.post-list .post-thumb {
margin-right: 0 !important;
max-width: unset
}
.entry-meta.meta-2 a.btn {
align-items: center;
align-self: center;
display: inline-block
}
.entry-meta.meta-2 .font-xs {
line-height: 1.3;
max-width: 150px
}
.banner-bg h2 {
font-size: 20px
}
.entry-bottom,
.single-header .single-header-meta {
display: block
}
.carousel-4-columns,
.carousel-6-columns {
max-width: 375px;
overflow: hidden
}
.hero-slider-1 {
height: unset
}
.hero-slider-content-2 {
padding-top: 20px;
text-align: center
}
.hero-slider-content-2 p {
width: 100%
}
.header-height-2 {
min-height: 40px
}
.banner-img,
.banner-left-icon {
margin-bottom: 15px
}
.header-action-2 .header-action-icon-2:last-child {
padding: 0
}
.popular-categories .slider-btn.slider-prev {
left: unset !important;
right: 50px !important
}
.mb-sm-0 {
margin-bottom: 0 !important
}
.mb-sm-4 {
margin-bottom: 1rem
}
.mb-sm-5 {
margin-bottom: 2rem
}
.heading-tab {
display: block !important
}
.heading-tab h2.section-title,
.heading-tab h3.section-title {
margin-bottom: 15px !important
}
.nav.right {
justify-content: start
}
.hero-slider-1.style-2 .single-slider-img {
display: none
}
ul.footer-list {
margin-bottom: 30px
}
.section-padding-60 {
padding: 30px 0
}
.pt-40,
.pt-60 {
padding-top: 30px !important
}
.pb-60 {
padding-bottom: 30px !important
}
.mb-60 {
margin-bottom: 30px !important
}
.hero-slider-1.style-3 .slider-1-height-3 {
height: 220px
}
.hero-slider-1.style-3 .hero-slider-content-2 {
padding-left: 15px;
padding-top: 0;
position: relative;
text-align: left
}
.hero-slider-1.style-3 .hero-slider-content-2 h1 {
font-size: 18px
}
.hero-slider-1.style-3 .hero-slider-content-2 h2 {
font-size: 16px
}
.hero-slider-1.style-3 .hero-slider-content-2 h4 {
font-size: 14px
}
.hero-slider-1.style-3 .hero-slider-content-2 p {
font-size: 11px
}
.header-style-5 .search-style-2,
.hero-slider-1.style-3 .hero-slider-content-2 a.btn {
display: none
}
.header-style-5 .header-action-2 .header-action-icon-2>a {
font-size: 18px
}
.header-style-5 .sticky-bar.stick.sticky-white-bg {
background-color: #fff;
padding: 15px 0
}
.font-xxl {
font-size: 28px
}
.w-50 {
width: 100% !important
}
.product-list .product-cart-wrap {
display: block
}
.product-list .product-cart-wrap .product-img-action-wrap {
max-width: 100%
}
.shop-product-filter {
display: block
}
.shop-product-filter .total-product {
margin-bottom: 15px
}
.table td {
display: block;
text-align: center;
width: 100%
}
.table td:before {
content: attr(data-title) " ";
float: left;
font-weight: 700;
margin-right: 15px
}
.table thead {
display: none
}
.loop-grid.pr-30 {
padding-right: 0 !important
}
.loop-grid.loop-list article {
display: block
}
.d-sm-none {
display: none
}
.banner-features {
margin-bottom: 15px
}
.mb-xs-30,
.product-cart-wrap:not(:last-child) {
margin-bottom: 30px !important
}
.slick-track .product-cart-wrap {
margin-bottom: 0 !important
}
.first-post .btn.btn-sm,
.first-post .meta-1 .font-sm {
display: none
}
.loop-grid .entry-content {
padding: 20px 20px 0
}
.img-hover-slide {
min-height: 232px
}
.comments-area .thumb {
min-width: 100px
}
.hero-slider-1 .single-slider-img-1 {
height: 300px
}
.featured .col-lg-2 {
width: 50%
}
.nav-tabs .nav-link {
font-size: 13px;
padding: 10px 12px
}
.deal {
background-position: 0 100%
}
.deals-countdown .countdown-section {
margin-left: 2px;
margin-right: 2px;
padding: 20px 2px 30px
}
.banner-bg {
padding: 30px
}
.product-list-small figure {
margin-bottom: 20px !important
}
.product-list-small .title-small {
font-size: 16px;
font-weight: 600
}
.newsletter .des {
display: none
}
.newsletter form {
margin: 15px 0
}
footer .col-lg-2.col-md-3 {
width: 50%
}
footer .download-app a img {
width: 150px
}
.home-slider .hero-slider-1.style-2 .hero-slider-content-2 {
padding-left: 0;
padding-top: 50px
}
.home-slider .hero-slider-1.style-2 .hero-slider-content-2 h3 {
line-height: 1.4
}
.hero-slider-1.style-3.dot-style-1.dot-style-1-position-1 ul {
bottom: 0
}
.banner-img.banner-big .banner-text,
.single-content .banner-text {
display: none
}
.comments-area {
margin-top: 0;
padding: 25px 0
}
.entry-bottom {
margin-bottom: 0 !important
}
section.pt-150.pb-150 {
padding: 50px 0 !important
}
.product-detail .single-share {
margin-bottom: 20px
}
.product-detail .tab-style3 .nav-tabs li.nav-item a {
padding: .5rem;
text-transform: none
}
.related-products .product-cart-wrap {
margin-bottom: 30px
}
.mb-sm-15,
.section-title {
margin-bottom: 15px
}
.section-title,
.section-title .title {
display: block
}
.section-title h2,
.section-title h3 {
font-size: 22px;
margin-bottom: 20px;
text-align: center;
}
.section-title .show-all {
display: none
}
.nav-tabs.links .nav-link {
margin-bottom: 10px
}
.slider-arrow.slider-arrow-2.flex-right {
display: none
}
.product-grid-4 .product-cart-wrap {
margin-bottom: 30px
}
.product-list-small figure.col-md-4 {
float: left;
margin: 0 !important;
max-width: 30%
}
.product-list-small .col-md-8 {
float: left;
max-width: 70%
}
.newsletter .newsletter-inner {
padding: 20px
}
.newsletter .newsletter-inner h2 {
font-size: 22px
}
.newsletter .newsletter-inner .newsletter-content p {
font-size: 14px;
margin-bottom: 25px !important
}
.newsletter .newsletter-inner button.submit,
.newsletter .newsletter-inner button[type=submit] {
padding: 12px 20px
}
.footer-link-widget:not(:last-child) {
margin-right: 0
}
.widget-about {
margin-bottom: 30px
}
footer p.font-md {
font-size: 13px
}
.hero-slider-1 .single-hero-slider.rectangle .slider-content {
width: 100%
}
.product-info {
border: 0;
padding: 0
}
.product-info .tab-style3 .nav-tabs li.nav-item a {
font-size: 13px;
padding: 11px 12px !important
}
.cart-totals {
padding: 15px
}
.cart-totals .table-responsive {
padding: 0 !important
}
.cart-totals .table-responsive table tr td {
display: inline-block;
text-align: start;
width: 50%
}
.cart-totals .table-responsive table tr td.cart_total_amount {
text-align: end
}
.shopping-summery {
padding: 0 !important
}
.shopping-summery table tbody tr {
--bs-bg-opacity: 1;
background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
border-bottom: 1px solid #dee2e6
}
.shopping-summery table tbody tr:last-child {
border-bottom: 0
}
.shopping-summery table tbody tr td {
padding: 15px !important;
text-align: end
}
.shopping-summery table tbody tr td.action.text-center {
text-align: end !important
}
.shopping-summery table tbody tr td.image.product-thumbnail,
.shopping-summery table tbody tr td.product-des.product-name {
text-align: center
}
.shopping-summery table tbody tr td.detail-info .detail-extralink {
margin-right: 0 !important;
text-align: right
}
.shopping-summery table tbody tr td img {
margin-right: 0;
max-width: 180px
}
.apply-coupon .font-lg,
.apply-coupon input,
.toggle_info .font-lg,
.toggle_info input {
font-size: 14px !important
}
.cart-totals.ml-30 {
margin-left: 0 !important;
text-align: center
}
.order_table table .w-160 {
margin: 0 auto
}
.modal-open .modal {
padding-right: 0 !important
}
.archive-header-3 {
padding: 30px
}
.archive-header-3 .archive-header-3-inner {
display: block
}
}
@media only screen and (min-width:480px)and (max-width:667px) {
.header-height-2 {
min-height: 40px
}
.banner-features,
.col-lg-4 .banner-img {
margin-bottom: 30px
}
.modal-open .modal {
padding-right: 0 !important
}
}
@media only screen and (max-width:375px) {
.entry-meta .hit-count,
.entry-meta.meta-2 .font-xs {
display: none
}
.deal {
padding: 30px
}
.custom-modal .modal-dialog .modal-content {
padding: 0
}
.deal .product-title {
font-size: 25px;
max-width: unset
}
.modal-open .modal {
padding-right: 0 !important
}
}
@media only screen and (min-width:375px)and (max-width:667px) {
.deal .product-title {
font-size: 35px;
max-width: 100%
}
}
p:empty {
margin-bottom: 0
}
.required:after {
color: #fc655e;
content: " *"
}
.product-attributes ul {
list-style: none;
padding-left: 0
}
.half-circle-spinner,
.half-circle-spinner * {
box-sizing: border-box
}
.half-circle-spinner {
border-radius: 100%;
height: 60px !important;
margin: 20px auto;
position: relative !important;
width: 60px !important
}
.half-circle-spinner:after {
display: none !important
}
.half-circle-spinner .circle {
border: 3px solid transparent;
border-radius: 100%;
content: "";
height: 100%;
position: absolute;
width: 100%
}
.half-circle-spinner .circle.circle-1 {
animation: half-circle-spinner-animation 1s infinite;
border-top-color: var(--color-brand)
}
.half-circle-spinner .circle.circle-2 {
animation: half-circle-spinner-animation 1s infinite alternate;
border-bottom-color: var(--color-brand)
}
@keyframes half-circle-spinner-animation {
0% {
transform: rotate(0deg)
}
to {
transform: rotate(1turn)
}
}
.btn-loading,
.button-loading {
border: 1px solid #c4cdd5;
color: transparent !important;
cursor: default;
position: relative;
text-shadow: none;
transition: border-color .2s ease-out
}
.btn-loading span,
.button-loading span {
color: transparent !important
}
.btn-loading,
.btn-loading:active,
.btn-loading:focus,
.btn-loading:hover,
.button-loading,
.button-loading:active,
.button-loading:focus,
.button-loading:hover {
color: transparent
}
.btn-loading:before,
.button-loading:before {
animation: button-loading-spinner 1s linear infinite;
border: 3px solid;
border-color: #fff #fff transparent;
border-radius: 50%;
content: "";
height: 18px;
left: 50%;
margin-left: -9px;
margin-top: -9px;
position: absolute;
top: 50%;
width: 18px
}
.btn-loading.btn-fill-out,
.button-loading.btn-fill-out {
border: 1px solid var(--color-brand);
color: transparent !important
}
.btn-loading.btn-fill-out:before,
.button-loading.btn-fill-out:before {
background-color: transparent;
border-color: var(--color-brand);
border-bottom-color: transparent;
width: 18px
}
.btn-loading.btn-fill-out:after,
.button-loading.btn-fill-out:after {
display: none
}
@keyframes button-loading-spinner {
0% {
transform: rotate(0deg)
}
to {
transform: rotate(1turn)
}
}
#alert-container {
position: fixed;
right: 5px;
top: 100px;
z-index: 9999999
}
#alert-container .alert {
box-shadow: 0 4px 10px 0 rgba(3, 3, 3, .1);
font-weight: 400;
margin-bottom: 10px;
max-width: 450px !important;
min-height: 45px !important;
padding: 15px 40px 15px 60px;
position: relative
}
#alert-container .alert.alert-success {
background-color: #bff9d0;
color: #299c77
}
#alert-container .alert .message-icon {
fill: #299c77;
stroke: #299c77;
font-size: 20px;
left: 5%;
position: absolute;
top: 30%
}
#alert-container .alert.alert-dismissible .close {
font-size: 10px;
padding: 0;
position: absolute;
right: 15px;
top: 5px
}
body.show-admin-bar #alert-container {
top: 140px
}
body.show-admin-bar .mobile-header-wrapper-style,
body.show-admin-bar .sticky-bar.stick {
top: 40px
}
.widget__title {
font-size: 1.25rem;
font-weight: 600;
letter-spacing: .3px;
margin-bottom: 20px;
text-transform: capitalize
}
.attribute-name {
margin-bottom: 5px
}
.attribute-values ul {
list-style: none;
margin: 0;
padding: 0 0 0 5px
}
.widget--colors .color-swatch li {
display: inline-block;
margin-bottom: 5px;
margin-right: 10px;
vertical-align: top
}
.custom-checkbox input[type=checkbox],
.custom-checkbox input[type=radio],
.custom-radio input[type=checkbox],
.custom-radio input[type=radio] {
display: none
}
.custom-checkbox label,
.custom-radio label {
display: block
}
.custom-checkbox span,
.custom-radio span {
border-radius: 50%;
cursor: pointer;
display: block;
height: 25px;
position: relative;
width: 25px
}
.custom-checkbox input[type=checkbox]:checked~span:before,
.custom-checkbox input[type=radio]:checked~span:before,
.custom-radio input[type=checkbox]:checked~span:before,
.custom-radio input[type=radio]:checked~span:before {
background: var(--color-brand);
border: 1px solid #fff;
border-radius: 50%;
content: "";
display: inline-block;
font-style: normal;
font-variant: normal;
height: 10px;
line-height: 1;
position: absolute;
right: 3px;
text-rendering: auto;
top: -3px;
width: 10px
}
.custom-checkbox.disabled label,
.custom-radio.disabled label {
position: relative
}
.custom-checkbox.disabled label:after,
.custom-checkbox.disabled label:before,
.custom-radio.disabled label:after,
.custom-radio.disabled label:before {
background-color: var(--hover-main-color);
content: "";
height: 90%;
left: 50%;
position: absolute;
top: 50%;
transform-origin: 50% 50%;
transition: all .4s ease;
width: 1px;
z-index: 20
}
.custom-checkbox.disabled label:before,
.custom-radio.disabled label:before {
transform: translate(-50%, -50%) rotate(45deg)
}
.custom-checkbox.disabled label:after,
.custom-radio.disabled label:after {
transform: translate(-50%, -50%) rotate(-45deg)
}
.custom-checkbox.disabled span,
.custom-radio.disabled span {
opacity: .9
}
.custom-checkbox.disabled input[type=checkbox]:checked~span:before,
.custom-checkbox.disabled input[type=radio]:checked~span:before,
.custom-radio.disabled input[type=checkbox]:checked~span:before,
.custom-radio.disabled input[type=radio]:checked~span:before {
display: none
}
.rating_wrap .rating {
display: inline-block;
font-family: uicons-regular-straight !important;
height: 20px;
overflow: hidden;
position: relative;
vertical-align: top;
width: 80px
}
.rating_wrap .rating:before {
color: #d2d2d2;
content: "";
float: left;
font-size: 12px;
font-weight: 900;
left: 0;
letter-spacing: 2px;
position: absolute;
top: 0
}
.rating_wrap .rating_num {
color: dimgray;
display: inline-block;
font-size: 12px
}
.rating_wrap .product_rate {
color: #edb867;
font-family: uicons-regular-straight !important;
left: 0;
overflow: hidden;
padding-top: 1.5em;
position: absolute;
top: 0
}
.rating_wrap .product_rate:before {
content: "";
font-size: 12px;
font-weight: 900;
left: 0;
letter-spacing: 2px;
position: absolute;
top: 0
}
.ps-checkbox {
display: block;
position: relative
}
.ps-checkbox>input {
box-sizing: border-box;
position: absolute;
visibility: hidden
}
.ps-checkbox label {
cursor: pointer;
font-weight: 400;
margin-bottom: 0;
padding-left: 30px;
position: relative
}
.ps-checkbox label:before {
border: 1px solid #000;
height: 20px;
left: 0;
top: 0;
width: 20px
}
.ps-checkbox label:after,
.ps-checkbox label:before {
content: "";
display: block;
position: absolute;
transition: all .4s ease;
z-index: 10
}
.ps-checkbox label:after {
border: 2px solid #fff;
border-left: none;
border-top: none;
height: 10px;
left: 7px;
opacity: 0;
top: 4px;
transform: rotate(0deg);
width: 6px
}
.ps-checkbox input[type=checkbox]:checked~label:before {
background-color: #222;
border-color: #222
}
.ps-checkbox input[type=checkbox]:checked~label:after {
opacity: 1;
transform: rotate(45deg)
}
.ps-my-account {
margin-top: 40px
}
.customer-page .profile-sidebar .profile-usermenu li.list-group-item a.active {
color: var(--color-brand)
}
.bb-customer-page .text-muted {
color: #4b5563 !important
}
.bb-customer-page .bb-customer-profile-wrapper {
margin-bottom: 2rem
}
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile {
background: linear-gradient(135deg, #f8fafc, #fff);
border: 1px solid #e5e7eb;
transition: all .3s ease
}
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile:hover {
border-color: #d1d5db
}
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile .bb-customer-profile-avatar {
height: 96px;
margin: 0 auto;
position: relative;
width: 96px
}
@media(min-width:768px) {
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile .bb-customer-profile-avatar {
margin: 0
}
}
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile .bb-customer-profile-avatar .bb-customer-profile-avatar-img {
border: 3px solid #fff;
border-radius: 50%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
transition: transform .3s ease;
width: 100%
}
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile .bb-customer-profile-avatar .bb-customer-profile-avatar-img:hover {
transform: scale(1.05)
}
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile .bb-customer-profile-avatar .bb-customer-profile-avatar-overlay {
align-items: center;
background: var(--color-brand);
border: 3px solid #fff;
border-radius: 50%;
bottom: 0;
cursor: pointer;
display: flex;
height: 32px;
justify-content: center;
position: absolute;
right: 0;
transition: all .3s ease;
width: 32px
}
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile .bb-customer-profile-avatar .bb-customer-profile-avatar-overlay:hover {
filter: brightness(.9);
transform: scale(1.1)
}
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile .bb-customer-profile-avatar .bb-customer-profile-avatar-overlay input[type=file] {
display: none
}
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile .bb-customer-profile-avatar .bb-customer-profile-avatar-overlay label {
align-items: center;
color: #fff;
cursor: pointer;
display: flex;
font-size: 14px;
height: 100%;
justify-content: center;
margin: 0;
width: 100%
}
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile .bb-customer-profile-avatar .bb-customer-profile-avatar-overlay label i,
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile .bb-customer-profile-avatar .bb-customer-profile-avatar-overlay label svg {
height: 16px;
width: 16px
}
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile .bb-customer-profile-info h2,
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile .bb-customer-profile-info h4 {
color: var(--color-heading);
font-weight: 700;
margin-bottom: .5rem
}
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile .bb-customer-profile-info h2 strong,
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile .bb-customer-profile-info h4 strong {
color: var(--color-brand);
font-weight: 700
}
.bb-customer-page .bb-customer-profile-wrapper .bb-customer-profile .bb-customer-profile-info p {
color: #4b5563;
line-height: 1.6;
margin-bottom: 0
}
.bb-customer-page .card.bg-primary.bg-opacity-10 {
background-color: #cce5ff !important;
border-color: #9cf;
transition: all .3s ease
}
.bb-customer-page .card.bg-primary.bg-opacity-10:hover {
border-color: #66b3ff;
transform: translateY(-2px)
}
.bb-customer-page .card.bg-primary.bg-opacity-10 .bg-primary.bg-opacity-20 {
background-color: #b3d9ff !important
}
.bb-customer-page .card.bg-primary.bg-opacity-10 .card-body .card-title {
color: #004085 !important;
font-weight: 600
}
.bb-customer-page .card.bg-primary.bg-opacity-10 .card-body .card-text {
color: #00366d !important
}
.bb-customer-page .card.bg-primary.bg-opacity-10 .btn-primary {
background-color: var(--color-primary);
border-color: var(--color-primary);
transition: all .3s ease
}
.bb-customer-page .card.bg-primary.bg-opacity-10 .btn-primary:hover {
filter: brightness(.9);
transform: translateY(-1px)
}
.bb-customer-page .card.bg-success.bg-opacity-10 {
background-color: #b8e6cc !important;
border-color: #85d9a8;
transition: all .3s ease
}
.bb-customer-page .card.bg-success.bg-opacity-10:hover {
border-color: #5ccc8f;
transform: translateY(-2px)
}
.bb-customer-page .card.bg-success.bg-opacity-10 .bg-success.bg-opacity-20 {
background-color: #9fdfb8 !important
}
.bb-customer-page .card.bg-success.bg-opacity-10 .card-body .card-title {
color: #0f5132 !important;
font-weight: 600
}
.bb-customer-page .card.bg-success.bg-opacity-10 .card-body .card-text {
color: #0a3d26 !important
}
.bb-customer-page .card.bg-success.bg-opacity-10 .btn-success {
background-color: var(--color-success);
border-color: var(--color-success);
transition: all .3s ease
}
.bb-customer-page .card.bg-success.bg-opacity-10 .btn-success:hover {
filter: brightness(.9);
transform: translateY(-1px)
}
.bb-customer-page .card.bg-warning.bg-opacity-10 {
background-color: #ffe9b8 !important;
border-color: #ffd88a;
transition: all .3s ease
}
.bb-customer-page .card.bg-warning.bg-opacity-10:hover {
border-color: #ffc966;
transform: translateY(-2px)
}
.bb-customer-page .card.bg-warning.bg-opacity-10 .bg-warning.bg-opacity-20 {
background-color: #fd9 !important
}
.bb-customer-page .card.bg-warning.bg-opacity-10 .card-body .card-title {
color: #8b5a00 !important;
font-weight: 600
}
.bb-customer-page .card.bg-warning.bg-opacity-10 .card-body .card-text {
color: #664200 !important
}
.bb-customer-page .card.bg-warning.bg-opacity-10 .btn-warning {
background-color: var(--color-warning);
border-color: var(--color-warning);
color: #fff;
transition: all .3s ease
}
.bb-customer-page .card.bg-warning.bg-opacity-10 .btn-warning:hover {
filter: brightness(.9);
transform: translateY(-1px)
}
.bb-customer-page .card.bg-info.bg-opacity-10 {
background-color: #b8e0e8 !important;
border-color: #8dccd9;
transition: all .3s ease
}
.bb-customer-page .card.bg-info.bg-opacity-10:hover {
border-color: #66bccb;
transform: translateY(-2px)
}
.bb-customer-page .card.bg-info.bg-opacity-10 .bg-info.bg-opacity-20 {
background-color: #a3d6df !important
}
.bb-customer-page .card.bg-info.bg-opacity-10 .card-body .card-title {
color: #055160 !important;
font-weight: 600
}
.bb-customer-page .card.bg-info.bg-opacity-10 .card-body .card-text {
color: #033d47 !important
}
.bb-customer-page .card.bg-info.bg-opacity-10 .btn-info {
background-color: var(--color-info);
border-color: var(--color-info);
color: #fff;
transition: all .3s ease
}
.bb-customer-page .card.bg-info.bg-opacity-10 .btn-info:hover {
filter: brightness(.9);
transform: translateY(-1px)
}
.bb-customer-page .rounded-circle.p-3 {
align-items: center;
display: inline-flex;
height: 56px;
justify-content: center;
width: 56px
}
.bb-customer-page .rounded-circle.p-3 i,
.bb-customer-page .rounded-circle.p-3 svg {
font-size: 24px
}
.bb-customer-page .rounded-circle.d-inline-flex {
display: inline-flex !important
}
.bb-customer-page .text-white {
color: #fff !important
}
.bb-customer-page .text-white i,
.bb-customer-page .text-white svg {
stroke: #fff !important;
fill: #fff !important;
color: #fff !important
}
.avatar-upload .avatar-input {
border: none
}
.list-content-loading {
background: rgba(0, 0, 0, .3);
border-radius: 3px;
bottom: 0;
display: none;
left: 0;
margin: -15px;
position: absolute;
right: 0;
top: 0;
z-index: 10
}
.list-content-loading .half-circle-spinner .circle.circle-1 {
border-top-color: #fff
}
.list-content-loading .half-circle-spinner .circle.circle-2 {
border-bottom-color: #fff
}
.list-content-loading .half-circle-spinner {
left: 0;
position: absolute;
right: 0;
top: 200px
}
.list-content-loading .half-circle-spinner .circle {
border: 5px solid transparent
}
@media screen and (max-width:768px) {
.list-content-loading {
top: 15px
}
.post-list .post-thumb {
max-width: 100%
}
}
.product-cart-wrap .product-action-1 a.action-btn.button-loading,
.product-cart-wrap .product-action-1 button.button-loading {
background-color: var(--color-brand) !important;
text-indent: -9999px
}
.product-cart-wrap .product-action-1 a.action-btn.button-loading:before,
.product-cart-wrap .product-action-1 button.button-loading:before {
animation: button-loading-spinner 1s linear infinite;
border: 3px solid;
border-color: #fff #fff transparent;
left: 50%;
margin-bottom: 0;
opacity: 1;
visibility: visible
}
.product-cart-wrap .product-action-1 a.action-btn.button-loading:after,
.product-cart-wrap .product-action-1 button.button-loading:after {
display: none
}
.cart-dropdown-wrap .shopping-cart-footer .shopping-cart-total h5 {
color: #9b9b9b;
font-size: 12px;
font-weight: 500;
margin: 0 0 5px
}
.cart-dropdown-wrap .shopping-cart-footer .shopping-cart-total h5 span {
float: right;
font-size: 15px
}
.cart-dropdown-wrap li.content-loading {
position: relative
}
.cart-dropdown-wrap li.content-loading:before {
animation: button-loading-spinner 1s linear infinite;
border-color: var(--color-brand);
border-bottom-color: transparent;
border-radius: 50%;
border-style: solid;
border-width: 1px;
content: "";
height: 18px;
left: 50%;
margin-left: -9px;
margin-top: -9px;
position: absolute;
top: 50%;
width: 18px
}
.cart-dropdown-wrap li.content-loading:after {
background: rgba(0, 0, 0, .02);
bottom: -10px;
content: "";
left: -10px;
position: absolute;
right: -10px;
top: -10px
}
.cart-dropdown-wrap ul li .shopping-cart-title h3 small {
color: #9b9b9b;
font-size: 80%
}
.product__attribute .attribute-swatch-item.pe-none {
cursor: not-allowed !important
}
.product__attribute .attribute-swatch-item.pe-none>div {
pointer-events: none !important
}
.cart-dropdown-wrap small {
font-size: 80%
}
.slick-slide figure a {
display: block
}
.slick-slide img {
display: block;
margin: 0 auto
}
@media only screen and (max-width:480px) {
.carousel-4-columns,
.carousel-6-columns {
max-width: none
}
}
.progress span {
min-width: 45px;
width: auto
}
.rate {
display: flex
}
.rate>input {
display: none
}
.rate>label {
color: #ffc700;
cursor: pointer;
font-size: 0;
line-height: 0;
overflow: hidden;
white-space: nowrap
}
.rate>label:before {
color: inherit;
content: "★";
display: inline-block;
font-size: 20px;
line-height: 1;
text-align: center;
transition: color .35s ease;
width: 20px
}
.rate>input:checked~label {
color: #ccc
}
.rate>input:checked+label {
color: #ffc700
}
.rate:hover>label {
color: #ffc700 !important
}
.rate>input:hover~label {
color: #ccc !important
}
.rate>input:hover+label {
color: #ffc700 !important
}
small {
font-size: 80%
}
.text-left {
text-align: left
}
.product-cart-wrap .product-content-wrap h2 {
line-height: 25px
}
.single-content article.entry-wraper ol,
.single-content article.entry-wraper ul {
list-style: disc;
margin-bottom: 25px;
padding-left: 25px
}
.single-content article.entry-wraper ol li,
.single-content article.entry-wraper ul li {
font-weight: 400;
list-style: disc
}
.single-content article.entry-wraper ol,
.single-content article.entry-wraper ol li {
list-style: decimal
}
.single-content article.entry-wraper table {
background-color: transparent;
border: 1px solid #dee2e6;
border-collapse: collapse;
margin-bottom: 1rem;
max-width: 100%;
width: 100%
}
.single-content article.entry-wraper table caption {
caption-side: top;
color: #6c757d;
font-size: 90%;
font-weight: 500;
padding: 10px 0;
text-align: center
}
.single-content article.entry-wraper table th {
border: solid #dee2e6;
border-width: 1px 1px 2px;
padding: .75rem;
vertical-align: bottom
}
.single-content article.entry-wraper table td {
border: 1px solid #dee2e6
}
.single-content article.entry-wraper table tbody tr th {
border-bottom-width: 1px
}
.single-content article.entry-wraper table blockquote {
border: solid #ccc;
border-width: 0 0 0 5px;
font-style: italic;
margin: 0 0 1rem;
padding: 2px 8px 2px 20px
}
.single-content article.entry-wraper table blockquote p {
font-size: 14px;
line-height: 40px;
margin-bottom: 0
}
.single-content article.entry-wraper h2 {
font-size: 1.75rem;
margin-bottom: 10px
}
.single-content article.entry-wraper h3 {
font-size: 1.5rem;
margin-bottom: 10px
}
.single-content article.entry-wraper h4 {
font-size: 1.25rem;
margin-bottom: 10px
}
.single-content article.entry-wraper h5 {
font-size: 1rem;
margin-bottom: 10px
}
.single-content article.entry-wraper h6 {
font-size: .9rem;
margin-bottom: 10px
}
.single-content article.entry-wraper p {
margin-bottom: 8px
}
.single-content article.entry-wraper .single-more-articles ul {
list-style: none
}
#quick-view-modal .modal-body.modal-empty {
align-items: center;
display: flex;
justify-content: center;
min-height: 500px
}
#quick-view-modal .form-group {
margin-bottom: 0
}
.form-subscribe button {
white-space: nowrap
}
.header-info.header-info-right>ul>li img {
margin-top: 1px;
vertical-align: top
}
.header-wrap {
min-height: 60px
}
.categories-dropdown-wrap ul li.has-children .dropdown-menu {
min-width: 0
}
.categories-dropdown-wrap .mega-menu-col ul li {
width: 100%
}
.post-thumb .entry-meta a {
white-space: nowrap
}
.entry-meta.meta-1 span:last-child:before {
display: none
}
.section--shopping-cart .table-responsive {
padding: 0 10px
}
.section--shopping-cart .table-responsive .table--cart.content-loading:after {
left: -10px;
right: -10px
}
.section--shopping-cart .table--cart.content-loading {
position: relative
}
.section--shopping-cart .table--cart.content-loading:before {
animation: button-loading-spinner 1s linear infinite;
border-color: var(--color-brand);
border-bottom-color: transparent;
border-radius: 50%;
border-style: solid;
border-width: 1px;
content: "";
height: 18px;
left: 50%;
margin-left: -9px;
margin-top: -9px;
position: absolute;
top: 50%;
width: 18px
}
.section--shopping-cart .table--cart.content-loading:after {
background: rgba(0, 0, 0, .02);
bottom: 0;
content: "";
left: 0;
position: absolute;
right: 0;
top: -10px
}
.product-extra-link2 a {
height: 44px;
line-height: 44px
}
.has-buy-now-button .button.button-buy-now {
background-color: var(--color-primary);
border: 0;
border-radius: 5px;
font-family: var(--font-heading), sans-serif;
font-size: 16px;
font-weight: 700;
height: 50px;
line-height: 50px;
padding: 0 20px;
position: relative
}
.deal-co {
margin: 15px 0
}
.popular-categories .card-1 h5 {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.preloader {
z-index: 9999999
}
.header-info>ul>li>ul.language-dropdown {
border-radius: 0;
padding: 0
}
@media screen and (max-width:768px) {
.hero-slider-content,
.hero-slider-content-2 {
margin-bottom: 20px
}
}
.image-upload__uploader-container .image-upload__uploader {
line-height: 13px
}
.block--review {
border-bottom: 1px solid #e5e5e5;
margin-bottom: 25px;
padding-bottom: 25px
}
.block--review .block__header {
align-items: center;
display: flex;
justify-content: flex-start
}
.block--review .block__header img {
border: 1px solid #ddd;
border-radius: 50%
}
.block--review .block__header h5 {
color: var(--color-heading);
font-size: 14px;
font-weight: 600;
line-height: 1.6em;
margin-bottom: 0
}
.block--review .block__header .block__info {
padding-left: 15px
}
.block--review .block__content {
padding-top: 10px
}
.block--review:last-child {
border-bottom: none;
margin-bottom: 25px;
padding-bottom: 25px
}
.block--review .block__content {
padding-top: 0
}
.block--review .block__header {
align-items: start
}
.block--review>.block__header {
padding-bottom: 15px
}
.block--review>.block__header p {
color: var(--color-heading)
}
.block--review>.block__header p i {
font-size: 16px;
margin-right: 0
}
.block--review>.block__header p span {
color: var(--color-heading);
font-weight: inherit;
margin-left: .5em
}
.btn.btn-danger {
background: #fff;
border-color: #b02a37;
color: #b02a37
}
.btn.btn-danger:hover {
background-color: #bb2d3b;
color: #fff
}
.categories-dropdown-inner>ul {
width: 50%
}
.header-top-ptb-1 #news-flash li {
margin-top: 2px !important;
min-height: 15px
}
.header-top-ptb-1 #news-flash li i {
margin-top: -2px;
vertical-align: top
}
.mobile-social-icon a {
align-items: center;
border-radius: 3px;
color: #fff;
display: inline-block;
font-size: 14px;
height: 34px;
line-height: 34px;
margin-right: 10px;
text-align: center;
transition-duration: .5s;
vertical-align: middle;
width: 34px
}
.mobile-social-icon a img {
height: 16px;
width: 16px
}
.mobile-social-icon a.linkedin {
background-color: #0e76a8;
border: 1px solid #0e76a8
}
.mobile-social-icon a.facebook {
background-color: #3b5999;
border: 1px solid #3b5999
}
.mobile-social-icon a.twitter {
background-color: #55acee;
border: 1px solid #55acee
}
.mobile-social-icon a.tumblr {
background-color: #35465c;
border: 1px solid #35465c
}
.mobile-social-icon a.instagram {
background-color: #e4405f;
border: 1px solid #e4405f
}
.card-2 .heading-card {
overflow: hidden;
padding: 0 10px;
text-overflow: ellipsis;
white-space: nowrap
}
.range .label-input span.from,
.range .label-input span.to {
font-weight: 600
}
.range .label-input span.to:before {
content: "- "
}
.shop-product-filter-header button.submit,
.shop-product-filter-header button[type=submit] {
border-radius: 4px
}
.shop-product-filter-header .card {
margin-bottom: 20px
}
.shop-filter-toggle.is-filtering .title {
position: relative
}
.shop-filter-toggle.is-filtering .title:after {
background: #f74b81;
border-radius: 50%;
content: " ";
height: 7px;
position: absolute;
top: 10%;
width: 7px
}
.list-of-suggestions li {
cursor: pointer;
font-weight: 500
}
.list-of-suggestions li:hover {
background-color: #ececec
}
@media only screen and (min-width:1400px) {
.col-xxl-1-5 {
width: 20%
}
.col-xxl-2-5 {
width: 40%
}
.col-xxl-3-5 {
width: 60%
}
.col-xxl-4-5 {
width: 80%
}
.col-xxl-5-5 {
width: 100%
}
}
.tags-checkbox input[type=checkbox],
.tags-checkbox input[type=radio],
.tags-radio input[type=checkbox],
.tags-radio input[type=radio] {
display: none
}
.tags-checkbox label,
.tags-radio label {
display: block
}
.tags-checkbox span,
.tags-radio span {
border: 1px solid #ececec;
border-radius: 30px;
box-shadow: 5px 5px 15px rgba(0, 0, 0, .05);
cursor: pointer;
display: inline-block;
font-family: var(--font-heading), sans-serif;
font-size: 17px;
font-weight: 700;
padding: 10px 20px
}
.tags-checkbox span i,
.tags-radio span i {
color: var(--color-muted);
font-size: 10px
}
.tags-checkbox span i:before,
.tags-radio span i:before {
content: ""
}
.tags-checkbox input[type=checkbox]:checked~span,
.tags-checkbox input[type=checkbox]:checked~span i,
.tags-checkbox input[type=radio]:checked~span,
.tags-checkbox input[type=radio]:checked~span i,
.tags-radio input[type=checkbox]:checked~span,
.tags-radio input[type=checkbox]:checked~span i,
.tags-radio input[type=radio]:checked~span,
.tags-radio input[type=radio]:checked~span i {
color: var(--color-brand)
}
.tags-checkbox input[type=checkbox]:checked~span i:before,
.tags-checkbox input[type=radio]:checked~span i:before,
.tags-radio input[type=checkbox]:checked~span i:before,
.tags-radio input[type=radio]:checked~span i:before {
content: ""
}
.tags-checkbox.disabled label,
.tags-radio.disabled label {
position: relative
}
.tags-checkbox.disabled label:after,
.tags-checkbox.disabled label:before,
.tags-radio.disabled label:after,
.tags-radio.disabled label:before {
background-color: var(--hover-main-color);
content: "";
height: 90%;
left: 50%;
position: absolute;
top: 50%;
transform-origin: 50% 50%;
transition: all .4s ease;
width: 1px;
z-index: 20
}
.tags-checkbox.disabled label:before,
.tags-radio.disabled label:before {
transform: translate(-50%, -50%) rotate(45deg)
}
.tags-checkbox.disabled label:after,
.tags-radio.disabled label:after {
transform: translate(-50%, -50%) rotate(-45deg)
}
.tags-checkbox.disabled span,
.tags-radio.disabled span {
opacity: .9
}
.tags-checkbox.disabled input[type=checkbox]:checked~span:before,
.tags-checkbox.disabled input[type=radio]:checked~span:before,
.tags-radio.disabled input[type=checkbox]:checked~span:before,
.tags-radio.disabled input[type=radio]:checked~span:before {
display: none
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info .mobile-language-active {
position: relative
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info .mobile-language-active span {
display: inline-block;
position: absolute;
right: 0;
top: 5px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info .mobile-language-active span i {
font-size: 13px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info .lang-curr-dropdown ul {
padding-left: 15px
}
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info .lang-curr-dropdown ul li a {
color: #253d4e;
font-size: 13px;
font-weight: 400
}
@media only screen and (max-width:768px) {
.header-action-2 .header-action-icon-2:first-child {
padding: 0
}
.header-action-2 .header-action-icon-2>a span.pro-count {
font-size: 11px;
height: 16px;
line-height: 16px;
width: 16px
}
.header-action-2 .header-action-icon-2>a img {
max-width: 20px
}
.logo.logo-width-1 a img {
max-width: 150px;
min-width: 0;
width: auto
}
}
.comment-form input {
background: #f4f5f9;
border: 2px solid #f4f5f9;
border-radius: 50px;
box-shadow: none;
color: #4f5d77;
font-size: 13px;
height: 45px;
padding-left: 20px;
width: 100%
}
.comment-form button {
background-color: var(--color-brand);
border: none;
border-radius: 50px;
color: #fff;
font-size: 15px;
font-weight: 500;
padding: 12px 40px
}
.comment-form button:hover {
background-color: var(--color-primary) !important;
border: none !important
}
.form-group--icon .product-cat-label {
-moz-appearance: none;
-webkit-appearance: none;
border-right: none;
color: #444;
font-size: 14px;
line-height: 42px;
min-height: 42px;
padding: 3px 35px 3px 20px;
position: relative;
transition: all .3s ease 0s;
white-space: nowrap
}
.form-group--icon .product-cat-label:after {
color: #444;
content: "";
display: inline-block;
font-family: uicons-regular-straight !important;
font-size: 10px;
position: absolute;
right: 12px;
top: 3px
}
.form-group--icon .product-cat-label:before {
background-color: #cacaca;
content: "";
height: 20px;
position: absolute;
right: 0;
top: 15px;
width: 1px
}
.form-group--icon .product-category-select {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
cursor: pointer;
height: 100%;
left: 0;
min-height: 42px;
opacity: 0;
padding-left: 10px;
position: absolute;
top: 0;
width: 100%;
z-index: 10
}
.shop-product-filter-header {
border: 1px solid #eee;
border-radius: 10px;
box-shadow: 0 -3px 23px rgba(0, 0, 0, .06);
margin-bottom: 50px;
padding: 30px
}
.shop-product-filter-header .custome-checkbox {
max-height: 300px;
overflow: auto
}
.shop-product-filter-header .show-advanced-filters {
display: inline-block;
margin-bottom: 20px;
margin-top: 30px
}
.shop-product-filter-header .show-advanced-filters i {
font-size: 8px
}
.shop-product-filter-header .show-advanced-filters .angle-down {
display: none
}
.shop-product-filter-header .show-advanced-filters.active .angle-down {
display: inline-block
}
.shop-product-filter-header .show-advanced-filters.active .angle-up {
display: none
}
.shop-product-filter-header .advanced-search-widgets {
margin-bottom: 40px
}
.shop-product-filter-header .advanced-search-widgets .card {
border: none;
border-radius: 0;
box-shadow: none;
padding: 0
}
.faqs-list h4 {
margin-bottom: 10px;
margin-top: 30px
}
.faqs-list h4:first-child {
margin-top: 0
}
.faqs-list .card {
border: 1px solid rgba(0, 0, 0, .125) !important;
margin-bottom: 10px
}
.faqs-list .card .card-header {
background: #fff;
border-radius: 0
}
.faqs-list .card .card-header h2 button {
background: #fff;
border: none;
color: #333;
display: block;
font-size: 16px;
font-weight: 600;
padding: 0;
padding-inline-end: 45px;
position: relative;
text-decoration: none !important;
text-transform: none;
width: 100%
}
.faqs-list .card .card-header h2 button:after {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M8 0a1 1 0 0 1 1 1v6h6a1 1 0 1 1 0 2H9v6a1 1 0 1 1-2 0V9H1a1 1 0 0 1 0-2h6V1a1 1 0 0 1 1-1z' clip-rule='evenodd'/%3E%3C/svg%3E");
background-position: 50%;
background-repeat: no-repeat;
background-size: 1.25rem;
border: 1px solid #ced4da;
border-radius: 50%;
color: #ced4da;
content: "";
height: 40px;
line-height: 30px;
position: absolute;
right: 0;
top: -7px;
transform: scale(.7) !important;
transition: transform .2s ease-in-out;
width: 40px
}
.faqs-list .card .card-header h2 button:not(.collapsed):after {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23333' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M0 8a1 1 0 0 1 1-1h14a1 1 0 1 1 0 2H1a1 1 0 0 1-1-1z' clip-rule='evenodd'/%3E%3C/svg%3E")
}
.products-listing {
margin-bottom: 80px
}
body.modal-open {
overflow: hidden !important
}
/*.product-cart-wrap {*/
/*height: calc(100% - 30px)*/
/*}*/
.product-cart-wrap {
    height: calc(100% - 0px);
}
.product-cart-wrap.style-2 {
height: 100%
}
.product-cart-wrap.style-2 .product-content-wrap h2 {
min-height: 50px
}
.block--review .block__images.block__images_total a {
height: auto
}
.pagination-area .pagination .page-item.disabled .page-link {
background-color: #f2f3f4
}
.pagination-area .pagination .page-item .page-link {
border-radius: 40px !important;
line-height: 40px !important
}
@media screen and (min-width:993px) {
.mobile-header-wrapper-style.sidebar-visible {
opacity: 0;
transform: translate(200px);
visibility: hidden
}
.mobile-menu-active .body-overlay-1 {
opacity: 0;
visibility: hidden
}
}
.product-cart-wrap .product-img-action-wrap {
margin-bottom: 25px;
max-height: none;
padding: 0
}
.product-detail .title-detail {
font-size: 25px
}
.product-detail .detail-info .product-price .current-price {
font-size: 35px
}
.product-detail .detail-info .product-badges {
display: inline-block;
margin-bottom: 20px;
margin-right: 10px
}
.product-detail .detail-info .product-badges span {
border-radius: 20px;
color: #fff;
display: inline-block;
font-size: 12px;
line-height: 1;
padding: 9px 20px 10px
}
.main-menu nav ul li a {
line-height: 20px
}
.main-menu>nav>ul>li ul.sub-menu li {
margin-bottom: 15px
}
.main-menu>nav>ul>li ul.sub-menu li ul.level-menu {
padding: 15px 0
}
.product-extra-link2 a {
height: 50px;
line-height: 50px
}
.widget-area .single-post h5 {
font-size: 15px
}
.cart-dropdown-wrap ul li {
flex-wrap: nowrap
}
@media only screen and (max-width:768px) {
.header-action-right .cart-dropdown-wrap ul {
max-height: 300px;
overflow-x: hidden;
overflow-y: scroll
}
}
@media(max-width:1440px) {
.banner-left-icon {
display: flex !important;
text-align: left;
}
.banner-left-icon .banner-icon {
margin-right: 0;
max-width: 100%
}
.banner-left-icon .banner-icon img {
max-width: 60px
}
}
@media only screen and (max-width:1200px) {
.main-categories-wrap .et {
display: none !important
}
}
.mfp-bg {
z-index: 10400 !important
}
.mfp-wrap {
z-index: 10500 !important
}
.ps-custom-scrollbar {
max-height: 250px;
overflow-y: scroll
}
.ps-custom-scrollbar .mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: #666
}
.ps-custom-scrollbar .mCS-dark.mCSB_scrollTools .mCSB_draggerRail {
background: hsla(0, 0%, 80%, .9)
}
.ps-custom-scrollbar .mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.ps-custom-scrollbar .mCS-dark.mCSB_scrollTools .mCSB_draggerRail {
border-radius: 0 !important;
opacity: 1 !important;
width: 6px
}
select.form-control {
-webkit-appearance: inherit;
-moz-appearance: inherit;
appearance: auto;
height: 32px
}
.alert-dismissible .btn-close {
cursor: pointer
}
@media(min-width:1400px) {
.product-grid-2 .col-xxl-3 {
width: 50%
}
.product-grid-3 .col-xxl-3 {
width: 33.3333333333%
}
.product-grid-5 .col-xxl-3 {
width: 20%
}
.product-grid-6 .col-xxl-3 {
width: 16.6666666667%
}
}
main#main-section .product-info .entry-main-content ul,
main#main-section .single-page .single-content ul {
margin: 10px 0;
padding-left: 25px
}
main#main-section ul.pagination {
flex-wrap: wrap
}
main#main-section ul.pagination .page-item {
margin: 5px
}
main#main-section ul.pagination .page-item .page-link {
display: inline-block;
min-width: 40px;
width: auto
}
@media only screen and (max-width:480px) {
.slider-arrow.slider-arrow-2.flex-right {
display: flex;
max-width: 70px;
position: absolute;
right: 0;
top: 0
}
.popular-categories .slider-btn.slider-prev {
right: unset !important
}
.slider-arrow.slider-arrow-2 .slider-btn {
font-size: 17px;
height: 30px;
line-height: 35px;
margin-right: 5px !important;
width: 30px
}
}
footer.main {
overflow: hidden
}
input.qty-input::-webkit-inner-spin-button,
input.qty-input::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0
}
input.qty-input[type=number] {
-moz-appearance: textfield;
background: transparent;
border: none;
color: var(--color-brand);
font-size: 16px;
font-weight: 700;
height: 20px;
padding-left: 10px
}
.detail-extralink .detail-qty {
padding: 11px 20px 11px 10px
}
.hero-slider-1.dot-style-1 .single-hero-slider.single-animation-wrap,
.hero-slider-1.style-4 .single-hero-slider.single-animation-wrap,
.hero-slider-1.style-5 .single-hero-slider.single-animation-wrap {
background-color: #f2f3f4
}
.button.btn-disabled {
cursor: not-allowed;
opacity: .7
}
.main-menu>nav>ul>li>a i.menu-icon {
font-size: 14px
}
.panel--search-result {
background-color: #fff;
border: 1px solid #eaeaea;
left: 0;
opacity: 0;
position: absolute;
top: 100%;
transform: scaleZ(0);
transition: all .4s ease;
visibility: hidden;
width: 100%;
z-index: 999
}
.panel--search-result .panel__content {
max-height: 400px;
overflow-y: auto
}
.panel--search-result .panel__footer {
border-top: 1px solid #eaeaea;
padding: 10px 0;
text-align: center
}
.panel--search-result.active {
opacity: 1;
transform: scaleX(1);
visibility: visible
}
.header-right .panel--search-result {
border: 2px solid rgba(var(--color-brand-rgb), .4);
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
border-top: 0;
left: -2px;
width: calc(100% + 4px)
}
.mobile-search .product-cart-wrap:not(:last-child) {
margin-bottom: 0 !important
}
.mobile-search .panel--search-result {
border-bottom-left-radius: 3px;
border-bottom-right-radius: 5px;
border-color: rgba(var(--color-brand-rgb), .4);
border-top: 0;
top: 97%
}
.product-tabs .nav-tabs .nav-link {
margin-bottom: 15px;
padding-left: 15px !important
}
.grecaptcha-badge {
bottom: 75px !important
}
input.qty-input[type=number] {
line-height: 20px
}
.slider-nav-thumbnails button.slick-arrow {
border-radius: 50%;
display: block;
padding: 0;
text-align: center
}
.product-image-slider img {
opacity: 0
}
.product-image-slider .slick-slide img {
margin: 0 auto;
opacity: 1
}
@media only screen and (max-width:768px) {
.detail-info .detail-extralink .detail-qty {
max-width: 70px
}
.product-extra-link2 a,
.product-extra-link2 button {
margin-bottom: 20px
}
}
.product-detail .short-desc ol,
.product-detail .short-desc ul {
list-style: disc;
margin-bottom: 25px;
padding-left: 25px
}
.product-detail .short-desc ol li,
.product-detail .short-desc ul li {
font-weight: 400;
list-style: disc
}
.product-detail .short-desc ol,
.product-detail .short-desc ol li {
list-style: decimal
}
.product-detail .short-desc table {
background-color: transparent;
border: 1px solid #dee2e6;
border-collapse: collapse;
margin-bottom: 1rem;
max-width: 100%;
width: 100%
}
.product-detail .short-desc table caption {
caption-side: top;
color: #6c757d;
font-size: 90%;
font-weight: 500;
padding: 10px 0;
text-align: center
}
.product-detail .short-desc table th {
border: solid #dee2e6;
border-width: 1px 1px 2px;
padding: .75rem;
vertical-align: bottom
}
.product-detail .short-desc table td {
border: 1px solid #dee2e6
}
.product-detail .short-desc table tbody tr th {
border-bottom-width: 1px
}
.product-detail .short-desc table blockquote {
border: solid #ccc;
border-width: 0 0 0 5px;
font-style: italic;
margin: 0 0 1rem;
padding: 2px 8px 2px 20px
}
.product-detail .short-desc table blockquote p {
font-size: 14px;
line-height: 40px;
margin-bottom: 0
}
.product-detail .short-desc h2 {
font-size: 1.75rem;
margin-bottom: 10px
}
.product-detail .short-desc h3 {
font-size: 1.5rem;
margin-bottom: 10px
}
.product-detail .short-desc h4 {
font-size: 1.25rem;
margin-bottom: 10px
}
.product-detail .short-desc h5 {
font-size: 1rem;
margin-bottom: 10px
}
.product-detail .short-desc h6 {
font-size: .9rem;
margin-bottom: 10px
}
.product-detail .short-desc p {
margin-bottom: 8px
}
.product-detail .shop_info_tab.entry-main-content #Description ol,
.product-detail .shop_info_tab.entry-main-content #Description ul {
list-style: disc;
margin-bottom: 25px;
padding-left: 25px
}
.product-detail .shop_info_tab.entry-main-content #Description ol li,
.product-detail .shop_info_tab.entry-main-content #Description ul li {
font-weight: 400;
list-style: disc
}
.product-detail .shop_info_tab.entry-main-content #Description ol,
.product-detail .shop_info_tab.entry-main-content #Description ol li {
list-style: decimal
}
.product-detail .shop_info_tab.entry-main-content #Description table {
background-color: transparent;
border: 1px solid #dee2e6;
border-collapse: collapse;
margin-bottom: 1rem;
max-width: 100%;
width: 100%
}
.product-detail .shop_info_tab.entry-main-content #Description table caption {
caption-side: top;
color: #6c757d;
font-size: 90%;
font-weight: 500;
padding: 10px 0;
text-align: center
}
.product-detail .shop_info_tab.entry-main-content #Description table th {
border: solid #dee2e6;
border-width: 1px 1px 2px;
padding: .75rem;
vertical-align: bottom
}
.product-detail .shop_info_tab.entry-main-content #Description table td {
border: 1px solid #dee2e6
}
.product-detail .shop_info_tab.entry-main-content #Description table tbody tr th {
border-bottom-width: 1px
}
.product-detail .shop_info_tab.entry-main-content #Description table blockquote {
border: solid #ccc;
border-width: 0 0 0 5px;
font-style: italic;
margin: 0 0 1rem;
padding: 2px 8px 2px 20px
}
.product-detail .shop_info_tab.entry-main-content #Description table blockquote p {
font-size: 14px;
line-height: 40px;
margin-bottom: 0
}
.product-detail .shop_info_tab.entry-main-content #Description h2 {
font-size: 1.75rem;
margin-bottom: 10px
}
.product-detail .shop_info_tab.entry-main-content #Description h3 {
font-size: 1.5rem;
margin-bottom: 10px
}
.product-detail .shop_info_tab.entry-main-content #Description h4 {
font-size: 1.25rem;
margin-bottom: 10px
}
.product-detail .shop_info_tab.entry-main-content #Description h5 {
font-size: 1rem;
margin-bottom: 10px
}
.product-detail .shop_info_tab.entry-main-content #Description h6 {
font-size: .9rem;
margin-bottom: 10px
}
.product-detail .shop_info_tab.entry-main-content #Description p {
margin-bottom: 8px
}
.product-option input {
height: auto;
width: auto
}
.pagination-area.pagination-page .pagination {
display: inline-block
}
.pagination-area.pagination-page .pagination .page-item {
display: inline-block;
margin-bottom: 15px
}
.dot-style-1 ul li,
.nav.nav-tabs li {
list-style: none
}
.mobile-social-icon a img {
margin-bottom: 2px;
vertical-align: middle
}
@media only screen and (max-width:992px) {
.logo.logo-width-1 a img {
max-height: 60px;
vertical-align: middle
}
}
.vendor-info ul {
list-style: none
}
.product-sidebar .custome-checkbox.ps-custom-scrollbar {
margin-left: -1.5rem;
overflow-y: hidden
}
.shop-product-filter-header .custome-checkbox .ps-list--categories>.form-check {
padding-left: 0
}
.section-flash-sale-products .product-cart-wrap .product-img-action-wrap {
margin-bottom: 0
}
.section-flash-sale-products .product-cart-wrap .product-content-wrap .product-price {
margin-top: 0 !important
}
.section-flash-sale-products .product-cart-wrap .product-content-wrap .sold.mt-15.mb-15 {
margin: 13px 0 14px !important
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
font-family: var(--primary-font), sans-serif
}
.select2-search.select2-search--dropdown {
margin-bottom: 10px;
padding: 0
}
.select2-container--default .select2-search--dropdown .select2-search__field {
border: thin solid #e0e6f6;
border-radius: 4px;
height: 40px;
padding-left: 15px
}
.select2-dropdown {
border-color: #fff;
box-shadow: 0 10px 20px -5px rgba(10, 42, 105, .06)
}
.select2-container--open .select2-dropdown--below {
border: thin solid #ececec;
border-radius: 4px;
margin-top: 10px;
min-width: 200px;
padding: 15px
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
color: #4f5e64;
font-family: var(--font-text), sans-serif;
font-size: 14px;
line-height: 26px
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
border-color: #bbb transparent transparent;
border-style: solid;
border-width: 6px 5px 0;
height: 0;
left: 50%;
margin-left: -4px;
margin-top: -2px;
position: absolute;
top: 50%;
width: 0
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
height: 26px;
position: absolute;
right: 10px;
top: 6px;
width: 20px
}
.select2-container--default .select2-selection--single {
background: none;
border: none;
border-radius: 0;
height: 40px
}
.form-select {
border-radius: 0;
padding: .6rem 2.25rem .6rem .75rem
}
.select2-container .select2-selection--single .select2-selection__rendered {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: #fff;
background-position: right .75rem center;
background-repeat: no-repeat;
background-size: 16px 12px;
border: 1px solid #ced4da;
border-radius: 0;
color: #212529;
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
padding: .6rem 2.25rem .6rem .75rem;
width: 100%
}
.product-list .product-cart-wrap .product-img-action-wrap {
margin-bottom: 0
}
.product-list .product-cart-wrap .product-img-action-wrap .product-img .product-img-inner {
max-width: 230px
}
.product-list .product-cart-wrap .product-content-wrap {
padding-bottom: 0
}
.product-list .product-cart-wrap .product-content-wrap .product-category a {
margin-top: 0
}
.product-list .product-cart-wrap .product-content-wrap {
max-width: 72%
}
.product-list .product-cart-wrap .product-content-wrap h2 {
line-height: 36px
}
.w-full {
width: 100% !important
}
.nav-link:focus,
.nav-link:hover {
color: var(--color-brand-2)
}
@media only screen and (max-width:992px) {
.banner-img .banner-text {
padding: 0 5px
}
}
.review-container .btn-primary {
border-radius: 5px
}
.quick-view-content .product-detail .detail-info .short-desc {
-webkit-line-clamp: 10;
-webkit-box-orient: vertical;
display: -webkit-box;
overflow: hidden
}
.product-extra-link2 a,
.product-extra-link2 button {
margin-bottom: 15px
}
.newsletter-form .captcha-render-section .form-control {
background: #fff;
max-width: 450px
}
.newsletter-form .captcha-disclaimer {
background: #fff !important;
max-width: 450px
}
.header-style-1 .header-middle-ptb-1.sticky-bar.stick {
border-bottom: none;
padding: 5px 0
}
.customer-page .nav-tabs .nav-item .nav-link {
padding: 10px 20px !important
}
.customer-page .delete-account-section {
border: 1px solid #dee2e6
}
.customer-page .delete-account-section .customer-page-title {
font-size: 20px
}
.customer-page .delete-account-section h2 {
margin-bottom: .5rem
}
.customer-page .delete-account-section p {
margin-bottom: 15px
}
.customer-page button.btn.btn-outline-danger {
background: #fff;
border: 1px solid #dc3545;
color: #dc3545
}
.customer-page button.btn.btn-outline-danger:hover {
background: #dc3545;
border-color: #dc3545;
color: #fff
}
.form-select {
border: 1px solid #f0e9ff;
border-radius: 10px
}
.auth-card form .auth-input-icon {
top: 6px
}
.account .dashboard-address .card {
background: #f1f1f1;
border: 0
}
.tp-product-details-additional-info table {
border: 1px solid #e0e2e3;
width: 100%
}
.tp-product-details-additional-info table tr:not(:last-child) {
border-bottom: 1px solid #eceded
}
.tp-product-details-additional-info table td {
padding: 12px 34px
}
.tp-product-details-additional-info table td:first-child {
background-color: #f9f9f9;
color: #000;
font-size: 16px;
width: 306px
}
.tp-product-details-additional-info table td:last-child {
font-size: 16px
}
.menu-icon-image {
height: 15px;
margin-top: 5px;
margin-inline-end: 2px;
vertical-align: top;
width: 15px
}
.mobile-menu .menu-icon-image {
margin-top: 0
}
.main-menu .menu-icon-image {
margin-top: 2px
}
.slider-content .display-2 {
line-height: 1.3
}
.hero-slider-1 .slider-content p {
line-height: 1.5
}
.shop-product-filter .sort-by-product-area .sort-by-product-wrap .sort-by-dropdown-wrap {
min-width: 45px
}
@media(max-width:429px) {
.shop-product-filter .sort-by-product-area {
display: block
}
.shop-product-filter .sort-by-product-area .sort-by-cover {
display: inline-block
}
.shop-product-filter .sort-by-product-area .sort-by-cover:first-child {
margin-bottom: 15px
}
}
.brand-logo img {
max-width: 200px
}
.main-menu ul li a svg {
height: 18px;
margin-top: 1px;
vertical-align: top;
width: 18px
}
#news-flash ul li svg {
height: 18px;
margin-top: -2px;
vertical-align: middle;
width: 18px
}
.bb-product-filter-items li label:after,
.bb-product-filter-items li label:before {
top: 4px !important
}
@media only screen and (max-width:768px) {
.top-products-group .top-products-group-item {
margin-bottom: 40px
}
}
.auth-card__header .auth-card__header-description {
color: #6f6c6c !important;
margin: 15px 0
}
@media(max-width:768px) {
section.home-slider.style-2.position-relative.mb-50 {
margin-bottom: 0 !important;
padding: 30px 0
}
.product-grid-5 .mb-sm-5 {
margin-bottom: 0
}
.footer-social-links {
margin: 20px 0 0px;
text-align: start !important
}
.footer-social-links .mobile-social-icon {
justify-content: flex-start
}
}
.product-tabs .nav-tabs .nav-link {
background: none;
padding: 10px !important
}
main#main-section .single-page .single-content ul.bb-social-sharing {
margin: 0;
padding: 0
}
body:has(.box-coming-soon) .footer-mobile {
display: none
}
.box-coming-soon {
margin-left: auto;
margin-right: auto;
max-width: 1320px;
padding-bottom: 100px;
padding-top: 100px
}
.box-coming-soon ul {
list-style: none;
padding-left: 0
}
.box-coming-soon .coming-soon-image {
border-radius: 20px;
box-shadow: 0 8px 24px rgba(0, 0, 0, .06);
width: 100%
}
.box-coming-soon .coming-soon-title {
color: var(--color-brand-2, #253d4e);
font-size: 32px;
font-weight: 700;
line-height: 1.3;
margin-bottom: 10px
}
.box-coming-soon .coming-soon-subtitle {
color: #687188;
font-size: 15px;
line-height: 1.7;
margin-bottom: 25px
}
.box-coming-soon .form-control {
height: 56px
}
.box-coming-soon .coming-soon-newsletter {
margin-bottom: 35px
}
.box-coming-soon .coming-soon-contact-info {
margin-bottom: 25px
}
.box-coming-soon .coming-soon-contact-info ul {
margin: 0
}
.box-coming-soon .coming-soon-contact-info li+li {
margin-top: 12px
}
.box-coming-soon .coming-soon-contact-item {
align-items: center;
color: #687188;
display: flex;
font-size: 14px;
gap: 10px;
line-height: 1.6
}
.box-coming-soon .coming-soon-contact-item a {
color: var(--primary-color)
}
.box-coming-soon .coming-soon-contact-item a:hover {
text-decoration: underline
}
.box-coming-soon .coming-soon-contact-icon {
align-items: center;
background-color: rgba(var(--primary-color-rgb, 59, 183, 126), .1);
border-radius: 50%;
color: var(--primary-color);
display: flex;
font-size: 16px;
height: 36px;
justify-content: center;
min-width: 36px;
width: 36px
}
.box-coming-soon .coming-soon-social {
margin-top: 10px
}
.box-coming-soon p {
font-size: 14px;
font-weight: 400;
line-height: 26px;
margin-bottom: 15px
}
.box-coming-soon .deals-countdown {
display: flex;
gap: 10px;
margin-bottom: 35px
}
.box-coming-soon .deals-countdown .countdown-section {
background-color: var(--primary-color);
border-radius: 12px;
box-shadow: 0 2px 8px rgba(var(--primary-color-rgb, 59, 183, 126), .15);
color: #fff;
flex: 1;
padding: 18px 10px 28px;
text-align: center
}
.box-coming-soon .deals-countdown .countdown-section span {
color: #fff
}
.box-coming-soon .deals-countdown .countdown-section span.countdown-amount {
font-size: 28px;
font-weight: 700;
margin-bottom: 0
}
.box-coming-soon .deals-countdown .countdown-section span.countdown-period {
font-size: 11px;
letter-spacing: .5px;
opacity: .85;
text-transform: uppercase
}
@media screen and (max-width:767px) {
.box-coming-soon {
padding-bottom: 60px;
padding-top: 60px
}
.box-coming-soon .coming-soon-title {
font-size: 26px
}
.box-coming-soon .deals-countdown .countdown-section {
padding: 12px 8px 22px
}
.box-coming-soon .deals-countdown .countdown-section span.countdown-amount {
font-size: 20px
}
}
@media screen and (max-width:400px) {
.box-coming-soon {
padding-bottom: 40px;
padding-top: 40px
}
.box-coming-soon .coming-soon-title {
font-size: 22px
}
.box-coming-soon .deals-countdown {
gap: 6px
}
.box-coming-soon .deals-countdown .countdown-section {
border-radius: 8px;
padding: 10px 4px 20px
}
.box-coming-soon .deals-countdown .countdown-section span.countdown-amount {
font-size: 18px
}
.box-coming-soon .deals-countdown .countdown-section span.countdown-period {
font-size: 9px
}
.box-coming-soon .newsletter .form-subcriber {
flex-direction: column
}
.box-coming-soon .newsletter .form-subcriber input {
border-radius: 50px;
width: 100%
}
.box-coming-soon .newsletter .form-subcriber button {
border-radius: 50px;
margin-top: 10px;
width: 100%
}
}
.ck-content ol {
padding-inline-start: 25px
}
[data-bb-toggle=quick-shop-modal] .modal-dialog {
max-width: 700px !important
}
[data-bb-toggle=quick-shop-modal] .modal-content {
border-radius: 15px;
overflow: hidden;
padding: 0
}
[data-bb-toggle=quick-shop-modal] .btn-close {
align-items: center;
border-radius: 50%;
display: flex;
height: 30px;
justify-content: center;
position: absolute;
right: 15px;
top: 15px;
width: 30px;
z-index: 10
}
[data-bb-toggle=quick-shop-modal] .modal-body.modal-empty {
align-items: center;
display: flex;
justify-content: center;
min-height: 200px
}
[data-bb-toggle=quick-shop-modal] .modal-body {
padding: 0
}
[data-bb-toggle=quick-shop-modal] .product-detail {
padding-top: 30px
}
[data-bb-toggle=quick-shop-modal] .product-detail .title-detail {
color: var(--color-heading);
font-size: 24px;
line-height: 1.3;
margin-bottom: 15px
}
[data-bb-toggle=quick-shop-modal] .product-detail .pr_switch_wrap {
margin-bottom: 20px
}
[data-bb-toggle=quick-shop-modal] .product-detail .detail-extralink {
align-items: center;
display: flex;
gap: 15px;
margin-bottom: 20px;
margin-top: 20px
}
[data-bb-toggle=quick-shop-modal] .product-detail .detail-qty {
flex-shrink: 0
}
[data-bb-toggle=quick-shop-modal] .product-detail .detail-qty .qty-val {
text-align: center;
width: 50px
}
[data-bb-toggle=quick-shop-modal] .product-detail .product-extra-link2 {
flex-grow: 1
}
[data-bb-toggle=quick-shop-modal] .product-detail .product-extra-link2.has-buy-now-button {
display: flex;
gap: 10px
}
[data-bb-toggle=quick-shop-modal] .product-detail .product-extra-link2.has-buy-now-button .button {
flex: 1
}
[data-bb-toggle=quick-shop-modal] .product-detail .button-add-to-cart:hover:not(.btn-disabled) {
box-shadow: 0 5px 15px rgba(0, 0, 0, .1);
transform: translateY(-2px)
}
[data-bb-toggle=quick-shop-modal] .product-detail .button-loading {
opacity: .7;
pointer-events: none
}
[data-bb-toggle=quick-shop-modal] .product-detail .font-xs {
border-top: 1px solid #f0f0f0;
margin-top: 15px;
padding-top: 15px
}
[data-bb-toggle=quick-shop-modal] .product-detail .font-xs a {
align-items: center;
color: var(--color-brand);
display: flex;
font-size: 14px;
font-weight: 600;
gap: 5px;
text-decoration: none;
transition: all .3s
}
[data-bb-toggle=quick-shop-modal] .product-detail .font-xs a:hover {
color: var(--color-brand-dark)
}
[data-bb-toggle=quick-shop-modal] .product-detail .font-xs a:hover i {
transform: translateX(3px)
}
[data-bb-toggle=quick-shop-modal] .product-detail .font-xs a i {
transition: transform .3s
}
@media(max-width:576px) {
[data-bb-toggle=quick-shop-modal] .modal-dialog {
margin: 10px auto;
max-width: calc(100% - 20px)
}
[data-bb-toggle=quick-shop-modal] .product-detail {
padding: 20px
}
[data-bb-toggle=quick-shop-modal] .product-detail .title-detail {
font-size: 20px;
margin-bottom: 12px
}
[data-bb-toggle=quick-shop-modal] .product-detail .detail-extralink {
flex-wrap: wrap;
gap: 10px
}
[data-bb-toggle=quick-shop-modal] .product-detail .product-extra-link2 {
width: 100%
}
[data-bb-toggle=quick-shop-modal] .product-detail .product-extra-link2.has-buy-now-button {
flex-direction: column
}
[data-bb-toggle=quick-shop-modal] .product-detail .product-extra-link2.has-buy-now-button .button {
width: 100%
}
}
.testimonials-slider .slick-track {
display: flex !important
}
.testimonials-slider .slick-slide {
display: flex !important;
height: inherit !important
}
.testimonials-slider .slick-slide>div {
height: 100%;
width: 100%
}
.ec-upsell-bundle {
background: linear-gradient(135deg, #f8f9fa, #fff);
border: 1px solid #e9ecef;
border-radius: 16px;
box-shadow: 0 4px 15px rgba(0, 0, 0, .05);
margin-bottom: 30px;
padding: 30px
}
.ec-upsell-bundle .ec-upsell-title {
border-bottom: 2px solid var(--color-brand);
color: var(--color-heading);
display: inline-block;
font-size: 24px;
font-weight: 700;
margin-bottom: 25px;
padding-bottom: 15px
}
.ec-upsell-bundle .ec-upsell-products {
align-items: stretch;
display: flex;
flex-wrap: wrap;
gap: 20px;
margin-bottom: 25px
}
.ec-upsell-bundle .ec-upsell-item,
.ec-upsell-bundle .ec-upsell-main-product {
background: #fff;
border: 1px solid #eee;
border-radius: 12px;
flex: 1;
max-width: 280px;
min-width: 200px;
padding: 20px;
text-align: center;
transition: all .3s ease
}
.ec-upsell-bundle .ec-upsell-item:hover,
.ec-upsell-bundle .ec-upsell-main-product:hover {
box-shadow: 0 8px 25px rgba(0, 0, 0, .1);
transform: translateY(-3px)
}
.ec-upsell-bundle .ec-upsell-item img,
.ec-upsell-bundle .ec-upsell-main-product img {
border-radius: 8px;
height: auto;
margin-bottom: 15px;
max-width: 150px
}
.ec-upsell-bundle .ec-upsell-item .ec-upsell-product-name,
.ec-upsell-bundle .ec-upsell-main-product .ec-upsell-product-name {
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
color: var(--color-heading);
display: -webkit-box;
font-size: 15px;
font-weight: 600;
line-height: 1.4;
margin-bottom: 10px;
min-height: 42px;
overflow: hidden
}
.ec-upsell-bundle .ec-upsell-item .ec-upsell-product-name a,
.ec-upsell-bundle .ec-upsell-main-product .ec-upsell-product-name a {
color: inherit;
text-decoration: none
}
.ec-upsell-bundle .ec-upsell-item .ec-upsell-product-name a:hover,
.ec-upsell-bundle .ec-upsell-main-product .ec-upsell-product-name a:hover {
color: var(--color-brand)
}
.ec-upsell-bundle .ec-upsell-item .ec-upsell-product-price,
.ec-upsell-bundle .ec-upsell-main-product .ec-upsell-product-price {
color: var(--color-brand);
font-size: 18px;
font-weight: 700
}
.ec-upsell-bundle .ec-upsell-item .ec-upsell-product-price del,
.ec-upsell-bundle .ec-upsell-main-product .ec-upsell-product-price del {
color: #999;
font-size: 14px;
font-weight: 400;
margin-left: 8px
}
.ec-upsell-bundle .ec-upsell-item {
position: relative
}
.ec-upsell-bundle .ec-upsell-item .ec-upsell-checkbox {
left: 15px;
position: absolute;
top: 15px;
z-index: 2
}
.ec-upsell-bundle .ec-upsell-item .ec-upsell-checkbox input[type=checkbox] {
accent-color: var(--color-brand);
cursor: pointer;
height: 22px;
width: 22px
}
.ec-upsell-bundle .ec-upsell-item.unchecked {
background: #f8f8f8;
opacity: .5
}
.ec-upsell-bundle .ec-upsell-item.unchecked:hover {
opacity: .7
}
.ec-upsell-bundle .ec-upsell-plus-sign {
align-items: center;
color: var(--color-brand);
display: flex;
font-size: 28px;
font-weight: 700;
justify-content: center;
padding: 0 10px
}
.ec-upsell-bundle .ec-upsell-summary {
align-items: center;
background: linear-gradient(135deg, var(--color-brand) 0, var(--color-brand-dark, #2b8a3e) 100%);
border-radius: 12px;
display: flex;
flex-wrap: wrap;
gap: 20px;
justify-content: space-between;
padding: 25px 30px
}
.ec-upsell-bundle .ec-upsell-summary .ec-upsell-total .ec-upsell-total-label {
color: hsla(0, 0%, 100%, .8);
font-size: 14px;
margin-bottom: 5px
}
.ec-upsell-bundle .ec-upsell-summary .ec-upsell-total .ec-upsell-total-price {
color: #fff;
font-size: 28px;
font-weight: 700
}
.ec-upsell-bundle .ec-upsell-summary .ec-upsell-total .ec-upsell-total-price del {
color: hsla(0, 0%, 100%, .6);
font-size: 18px;
font-weight: 400;
margin-left: 10px
}
.ec-upsell-bundle .ec-upsell-summary .ec-upsell-actions {
display: flex;
flex-wrap: wrap;
gap: 12px
}
.ec-upsell-bundle .ec-upsell-summary .ec-upsell-actions .btn {
border-radius: 8px;
font-weight: 600;
padding: 12px 25px;
transition: all .3s ease
}
.ec-upsell-bundle .ec-upsell-summary .ec-upsell-actions .btn.btn-add-selected {
background: #fff;
border: 2px solid #fff;
color: var(--color-brand)
}
.ec-upsell-bundle .ec-upsell-summary .ec-upsell-actions .btn.btn-add-selected:hover {
background: transparent;
color: #fff
}
.ec-upsell-bundle .ec-upsell-summary .ec-upsell-actions .btn.btn-add-all {
background: hsla(0, 0%, 100%, .2);
border: 2px solid hsla(0, 0%, 100%, .4);
color: #fff
}
.ec-upsell-bundle .ec-upsell-summary .ec-upsell-actions .btn.btn-add-all:hover {
background: #fff;
border-color: #fff;
color: var(--color-brand)
}
.ec-upsell-bundle .ec-upsell-summary .ec-upsell-actions .btn:disabled {
cursor: not-allowed;
opacity: .5
}
@media(max-width:992px) {
.ec-upsell-bundle .ec-upsell-products {
justify-content: center
}
.ec-upsell-bundle .ec-upsell-item,
.ec-upsell-bundle .ec-upsell-main-product {
max-width: 220px;
min-width: 180px
}
}
@media(max-width:768px) {
.ec-upsell-bundle {
padding: 20px
}
.ec-upsell-bundle .ec-upsell-title {
font-size: 20px
}
.ec-upsell-bundle .ec-upsell-summary {
flex-direction: column;
text-align: center
}
.ec-upsell-bundle .ec-upsell-summary .ec-upsell-actions {
justify-content: center;
width: 100%
}
.ec-upsell-bundle .ec-upsell-summary .ec-upsell-actions .btn {
flex: 1;
min-width: 140px
}
}
@media(max-width:576px) {
.ec-upsell-bundle .ec-upsell-item,
.ec-upsell-bundle .ec-upsell-main-product {
max-width: 100%;
min-width: 100%
}
.ec-upsell-bundle .ec-upsell-plus-sign {
padding: 10px 0;
width: 100%
}
}
.ec-upsell-attributes {
border-top: 1px solid #eee;
margin-top: 15px;
padding-top: 15px;
text-align: left
}
.ec-upsell-attributes .ec-upsell-attribute-group {
margin-bottom: 12px
}
.ec-upsell-attributes .ec-upsell-attribute-group:last-child {
margin-bottom: 0
}
.ec-upsell-attributes .ec-upsell-attribute-group label {
color: #666;
display: block;
font-size: 12px;
font-weight: 600;
margin-bottom: 6px;
text-transform: uppercase
}
.ec-upsell-attributes .ec-upsell-attribute-group select {
background-color: #fff;
border: 1px solid #ddd;
border-radius: 6px;
color: var(--color-heading);
cursor: pointer;
font-size: 13px;
padding: 8px 12px;
transition: all .3s ease;
width: 100%
}
.ec-upsell-attributes .ec-upsell-attribute-group select:hover {
border-color: var(--color-brand)
}
.ec-upsell-attributes .ec-upsell-attribute-group select:focus {
border-color: var(--color-brand);
box-shadow: 0 0 0 3px rgba(var(--color-brand-rgb, 59, 183, 126), .1);
outline: none
}
.ec-cross-sale-section {
margin-bottom: 50px;
margin-top: 60px
}
.ec-cross-sale-section .ec-cross-sale-wrapper {
position: relative
}
.ec-cross-sale-section .ec-cross-sale-header {
align-items: center;
display: flex;
justify-content: space-between;
margin-bottom: 30px
}
.ec-cross-sale-section .ec-cross-sale-header .section-title {
margin-bottom: 0;
padding-bottom: 0
}
.ec-cross-sale-section .ec-cross-sale-header .section-title:after {
display: none
}
.ec-cross-sale-section .ec-cross-sale-arrows {
display: flex;
gap: 10px
}
.ec-cross-sale-section .ec-cross-sale-arrows .slick-arrow {
align-items: center;
background: #fff;
border: 1px solid #ececec;
border-radius: 4px;
cursor: pointer;
display: flex;
height: 40px;
justify-content: center;
position: relative;
transition: all .3s ease;
width: 40px
}
.ec-cross-sale-section .ec-cross-sale-arrows .slick-arrow i {
color: var(--color-heading);
font-size: 16px;
transition: color .3s ease
}
.ec-cross-sale-section .ec-cross-sale-arrows .slick-arrow:hover {
background: var(--color-brand);
border-color: var(--color-brand)
}
.ec-cross-sale-section .ec-cross-sale-arrows .slick-arrow:hover i {
color: #fff
}
.ec-cross-sale-section .ec-cross-sale-arrows .slick-arrow.slick-disabled {
cursor: not-allowed;
opacity: .5
}
.ec-cross-sale-section .ec-cross-sale-arrows .slick-arrow.slick-disabled:hover {
background: #fff;
border-color: #ececec
}
.ec-cross-sale-section .ec-cross-sale-arrows .slick-arrow.slick-disabled:hover i {
color: var(--color-heading)
}
.ec-cross-sale-section .ec-cross-sale-slider {
margin: 0 -15px
}
.ec-cross-sale-section .ec-cross-sale-carousel .slick-track {
display: flex !important
}
.ec-cross-sale-section .ec-cross-sale-carousel .slick-slide {
height: inherit !important;
padding: 0 15px
}
.ec-cross-sale-section .ec-cross-sale-carousel .ec-cross-sale-slide,
.ec-cross-sale-section .ec-cross-sale-carousel .slick-slide>div {
height: 100%
}
.ec-cross-sale-section .ec-cross-sale-carousel .ec-cross-sale-slide .product-cart-wrap {
height: 100%;
margin-bottom: 0
}
.ec-cross-sale-section .ec-cross-sale-carousel .slick-list {
margin: 0
}
.ec-cross-sale-skeleton {
margin-top: 60px
}
.ec-cross-sale-skeleton .ec-cross-sale-skeleton-wrapper {
position: relative
}
.ec-cross-sale-skeleton .ec-cross-sale-skeleton-header {
margin-bottom: 30px
}
.ec-cross-sale-skeleton .ec-cross-sale-skeleton-slider {
display: grid;
gap: 30px;
grid-template-columns: repeat(4, 1fr)
}
@media(max-width:1199px) {
.ec-cross-sale-skeleton .ec-cross-sale-skeleton-slider {
grid-template-columns: repeat(3, 1fr)
}
}
@media(max-width:991px) {
.ec-cross-sale-skeleton .ec-cross-sale-skeleton-slider {
grid-template-columns: repeat(2, 1fr)
}
}
@media(max-width:575px) {
.ec-cross-sale-skeleton .ec-cross-sale-skeleton-slider {
grid-template-columns: 1fr
}
}
.ec-cross-sale-skeleton .ec-cross-sale-skeleton-card {
background: #fff;
border: 1px solid #ececec;
border-radius: 15px;
overflow: hidden;
padding: 15px
}
.ec-cross-sale-skeleton .ec-cross-sale-skeleton-card .skeleton-thumb {
border-radius: 10px;
height: 200px;
margin-bottom: 15px;
width: 100%
}
.ec-cross-sale-skeleton .ec-cross-sale-skeleton-card .skeleton-content .skeleton-name {
height: 18px;
margin-bottom: 10px;
width: 80%
}
.ec-cross-sale-skeleton .ec-cross-sale-skeleton-card .skeleton-content .skeleton-price {
height: 22px;
width: 50%
}
.ec-cross-sale-skeleton .skeleton {
animation: skeleton-loading 1.5s infinite;
background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
background-size: 200% 100%;
border-radius: 4px
}
@keyframes skeleton-loading {
0% {
background-position: 200% 0
}
to {
background-position: -200% 0
}
}
.bundle-badge,
.cart-bundle-badge {
align-items: center;
background: linear-gradient(135deg, #28a745, #20c997);
border-radius: 20px;
box-shadow: 0 2px 8px rgba(40, 167, 69, .3);
color: #fff;
display: inline-flex;
font-size: 12px;
font-weight: 600;
gap: 6px;
margin-top: 8px;
padding: 6px 12px
}
.bundle-badge .icon,
.bundle-badge i,
.cart-bundle-badge .icon,
.cart-bundle-badge i {
flex-shrink: 0;
font-size: 14px;
margin-bottom: 0 !important
}
.bundle-badge svg,
.cart-bundle-badge svg {
flex-shrink: 0;
height: 14px;
width: 14px
}
.section--shopping-cart .table--cart tbody tr.bundle-item {
background-color: #f8f9fa
}
.section--shopping-cart .table--cart tbody tr.bundle-item td {
opacity: .9
}
.section--shopping-cart .table-responsive .table--cart thead tr.main-heading th {
background: #f8f9fa;
border-bottom: 2px solid #e9ecef;
color: var(--color-heading);
font-weight: 600;
padding: 15px 20px
}
.section--shopping-cart .table-responsive .table--cart tbody tr {
border-bottom: 1px solid #eee;
transition: background-color .3s ease
}
.section--shopping-cart .table-responsive .table--cart tbody tr:hover {
background-color: #fafafa
}
.section--shopping-cart .table-responsive .table--cart tbody tr td {
padding: 20px 15px;
vertical-align: middle
}
.section--shopping-cart .table-responsive .table--cart tbody tr td.image {
width: 100px
}
.section--shopping-cart .table-responsive .table--cart tbody tr td.image img {
border: 1px solid #eee;
border-radius: 8px
}
.section--shopping-cart .table-responsive .table--cart tbody tr td.product-des .product-name {
color: var(--color-heading);
font-weight: 600
}
.section--shopping-cart .table-responsive .table--cart tbody tr td.product-des .product-name a:hover {
color: var(--color-brand)
}
.section--shopping-cart .table-responsive .table--cart tbody tr td.price h4 {
font-weight: 700
}
.section--shopping-cart .table-responsive .table--cart tbody tr td.action .remove-cart-button {
align-items: center;
background: #fff;
border: 1px solid #e9ecef;
border-radius: 50%;
color: #999;
display: inline-flex;
height: 36px;
justify-content: center;
transition: all .3s ease;
width: 36px
}
.section--shopping-cart .table-responsive .table--cart tbody tr td.action .remove-cart-button:hover {
background: #dc3545;
border-color: #dc3545;
color: #fff
}
.cart-dropdown-wrap ul li .shopping-cart-title .bundle-badge,
.cart-dropdown-wrap ul li .shopping-cart-title .cart-bundle-badge {
display: inline-flex;
font-size: 10px;
margin-top: 5px;
padding: 4px 8px
}
.cart-dropdown-wrap ul li .shopping-cart-title .bundle-badge .icon,
.cart-dropdown-wrap ul li .shopping-cart-title .bundle-badge i,
.cart-dropdown-wrap ul li .shopping-cart-title .cart-bundle-badge .icon,
.cart-dropdown-wrap ul li .shopping-cart-title .cart-bundle-badge i {
font-size: 12px
}
.cart-dropdown-wrap ul li .shopping-cart-title .bundle-badge svg,
.cart-dropdown-wrap ul li .shopping-cart-title .cart-bundle-badge svg {
height: 12px;
width: 12px
}
[data-bb-toggle=block-lazy-loading] {
min-height: 200px;
position: relative
}
[data-bb-toggle=block-lazy-loading].loading:after {
animation: spin 1s linear infinite;
border: 3px solid #f3f3f3;
border-radius: 50%;
border-top: 3px solid var(--color-brand);
content: "";
height: 40px;
left: 50%;
margin: -20px 0 0 -20px;
position: absolute;
top: 50%;
width: 40px
}
@keyframes spin {
0% {
transform: rotate(0deg)
}
to {
transform: rotate(1turn)
}
}
/* Start Custom CSS */
/* WhatsApp Header Button */
.whatsapp-btn-wrapper {
margin-left: 20px;
}
.whatsapp-btn {
display: flex;
align-items: center;
background: linear-gradient(90deg, #5AD165, #26B23C);
padding: 5px 15px;
border-radius: 60px;
text-decoration: none;
transition: 0.3s ease;
}
.whatsapp-btn:hover {
transform: scale(1.05);
}
.wa-icon {
width: 40px;
height: 40px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-right: 5px;
}
.wa-icon img {
width: 38px;
height: 38px;
object-fit: contain;
}
.wa-text {
color: #ffffff;
font-size: 14px;
font-weight: 500;
font-family: 'Quicksand', sans-serif;
letter-spacing: 1px;
}
.logo-size {
max-height: 70px !important;
}
/* Home banner */
.banner-heading {
color: #ffffff;
font-size: 40px;
}
.banner-description {
font-size: 16px !important;
color: #ffffff;
max-width: 600px;
line-height: 1.6;
font-weight: 400;
font-family: 'Quicksand', sans-serif;
;
}
.banner-tagline {
font-size: 24px !important;
font-weight: 600;
color: #ffffff;
font-family: 'Quicksand', sans-serif;
;
}
/* Footer */
.certficate-footer {
background-color: #ffffff;
border-radius: 10px;
max-width: 1200px;
width: 100%;
height: 142px;
padding: 0 30px;
}
.certificate-title {
font-weight: 700;
font-size: 32px;
margin: 0;
}
.certificate-logos img {
width: 105px;
height: 109px;
object-fit: contain;
}
.bg-remove a {
background-color: transparent !important;
}
.footer-main-logo {
max-width: 180px;
}
.footer-title {
color: #000 !important;
margin-bottom: 15px;
}
.footer-links a,
.footer-contact li {
color: #000 !important;
font-weight: 500;
text-decoration: none;
margin-bottom: 10px;
display: block;
}
.footer-contact li a {
    color: #000 !important;
    font-weight: 500;
}
.payment-method img {
width: 300px;
max-width: 100%;
}
.footer-mid {
background-image: url("../imgs/footerbg.png");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
padding: 40px 0 5px;
}
.footer-bottom {
background-color: #B99B3C33;
border-top: 1px solid #000;
padding: 12px 0;
font-size: 14px;
visibility: visible !important;
opacity: 1 !important;
animation-name: none;
}
.footer-bottom p {
color: #333;
margin-bottom: 0;
}
.brand-link {
color: #d32f2f;
/* Red color */
text-decoration: none;
font-weight: 500;
}
.brand-link:hover {
text-decoration: none;
}
.footer-links a {
color: #333;
text-decoration: none;
margin: 3px 5px;
display: inline-block;
}
.footer-links a:hover {
color: #B99B3C;
}
.footer-social-links a {
margin: 0px 8px;
}
.list-unstyled img {
margin-right: 10px;
}
.footer-about {
padding: 0px 30px;
}
.shop-banner-text {
color: #ffffff;
}
.product-description {
font-size: 14px;
}
.product-price .old-price {
color: #ADADAD !important;
font-size: 15px;
}
.journey-card {
border: 1.5px solid #DDA15E;
/* simple border only */
padding: 15px;
/* small spacing inside */
width: 250px;
border-radius: 40px;
margin: 10px;
background-color: #FEFAE07A;
height: 345px;
display: grid;
justify-content: center;
}
.journey-img {
height: 200px;
width: 200px auto;
padding: 25px;
display: grid;
justify-content: center;
text-align: center;
}
.journey-wrapper {
position: relative;
display: inline-block;
/* keeps it tight around card */
justify-content: center;
text-align: center;
}
.journey-card {
border: 1px solid #DDA15E;
/* keeping your simple border */
padding: 20px;
position: relative;
}
.step-img {
position: absolute;
top: 3px;
/* move upward */
left: -5px;
/* move to left corner */
z-index: 2;
/* bring in front */
height: 50px;
width: 50px;
}
.journey-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 40px;
}
/* ABOUT US section */
.ag2-product-section {
width: 100%;
padding: 40px 0;
display: flex;
justify-content: center;
background-color: #f3efe7;
position: relative;
overflow: hidden;
}
.ag2-container-wrapper {
width: 100%;
max-width: 1200px;
padding: 0 20px;
display: grid;
grid-template-columns: 1fr 1fr;
align-items: center;
gap: 80px;
}
/* Image Side */
.ag2-image-box {
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
}
.ag2-product-main-image {
position: relative;
z-index: 2;
width: 420px;
height: auto;
border-radius: 12px;
filter: drop-shadow(0 20px 30px rgba(0, 0, 0, 0.1));
object-fit: cover;
}
/* Text Side */
.ag2-text-content-area {
display: flex;
flex-direction: column;
align-items: flex-start;
text-align: left;
}
.ag2-small-label {
font-size: 14px;
letter-spacing: 2px;
text-transform: uppercase;
color: #8c826a;
margin-bottom: 16px;
font-weight: 500;
}
.ag2-main-heading {
font-size: 30px;
line-height: 1.2;
margin-bottom: 24px;
font-weight: 700;
color: #111;
}
.ag2-description-text {
font-size: 16px;
color: #6d6a63;
font-family: quicksand;
line-height: 1.8;
max-width: 500px;
margin-bottom: 22px;
}
.ag2-benefits-list {
list-style: none;
margin-bottom: 32px;
width: 100%;
max-width: 480px;
}
.ag2-benefits-list li {
display: flex;
align-items: center;
margin-bottom: 15px;
font-size: 16px;
}
.ag2-check-icon-box {
display: inline-flex;
justify-content: center;
align-items: center;
width: 24px;
height: 24px;
color: #b9973e;
margin-right: 12px;
flex-shrink: 0;
}
.ag2-shop-button {
display: inline-block;
background-color: #b9973e;
color: #ffffff !important;
padding: 14px 28px;
border-radius: 6px;
text-decoration: none;
font-weight: 600;
font-size: 16px;
border: none;
cursor: pointer;
transition: background-color 0.3s ease;
}
.ag2-shop-button:hover {
background-color: #a07f32;
color: #fff !important;
}
/* =========================
Tablet Responsive (≤ 992px)
========================= */
@media (max-width: 992px) {
.ag2-container-wrapper {
grid-template-columns: 1fr;
gap: 50px;
text-align: center;
}
.ag2-description-text,
.ag2-benefits-list {
max-width: 100%;
}
.ag2-product-main-image {
width: 320px;
}
.ag2-main-heading {
font-size: 26px;
}
.ag2-description-text {
font-size: 15px;
}
}
/* =========================
Mobile Responsive (≤ 576px)
========================= */
@media (max-width: 576px) {
.ag2-container-wrapper {
gap: 35px;
}
.ag2-product-main-image {
width: 300px;
}
.ag2-main-heading {
font-size: 22px;
}
.ag2-small-label {
font-size: 12px;
letter-spacing: 1.5px;
}
.ag2-description-text {
font-size: 14px;
line-height: 1.6;
text-align: justify;
}
.ag2-benefits-list li {
font-size: 14px;
margin-bottom: 12px;
}
.ag2-shop-button {
padding: 12px 22px;
font-size: 14px;
}
}
.description {
text-align: center;
font-weight: 100;
font-size: 10px;
margin: 20px;
}
.purity-wrapper {
display: flex;
justify-content: center;
gap: 30px;
flex-wrap: nowrap;
/* Force single row */
}
.purity-card {
border: 1px solid #E1E1E1;
width: 200px;
display: flex;
flex-direction: column;
align-items: center;
padding: 10px 0;
border-radius: 8px;
margin: 10px;
margin-bottom: 80px;
}
.purity {
height: 100px;
width: 100px;
margin: 20px;
}
/* =========================
Tablet Responsive (≤ 992px)
========================= */
@media (max-width: 992px) {
.purity-wrapper {
flex-direction: row;
align-items: center;
gap: 20px;
flex-wrap: wrap;
/* allow wrap */
}
.purity-card {
width: 80%;
max-width: 330px;
margin-bottom: 30px;
}
}
/* =========================
Mobile Responsive (≤ 576px)
========================= */
@media (max-width: 576px) {
.purity-wrapper {
flex-direction: column;
align-items: center;
gap: 20px;
}
.purity-card {
width: 70%;
margin-bottom: 25px;
padding: 15px 10px;
}
.purity {
width: 80px;
height: 80px;
margin: 15px;
}
}
/* why girpur section */
.ag3-product-section {
width: 100%;
padding: 80px 0;
display: flex;
justify-content: center;
background-color: #f3efe7;
}
.ag3-container-wrapper {
width: 100%;
max-width: 1200px;
padding: 0 20px;
display: grid;
grid-template-columns: 1fr 1fr;
align-items: center;
gap: 80px;
}
/* Image Side */
.ag3-image-box {
display: flex;
justify-content: center;
align-items: center;
}
.ag3-product-main-image {
width: 420px;
height: auto;
border-radius: 12px;
filter: drop-shadow(0 20px 30px rgba(0, 0, 0, 0.1));
object-fit: cover;
}
/* Text Side */
.ag3-text-content-area {
display: flex;
flex-direction: column;
align-items: flex-start;
}
.ag3-small-label {
font-size: 14px;
letter-spacing: 2px;
text-transform: uppercase;
color: #8c826a;
margin-bottom: 16px;
font-weight: 500;
}
.ag3-main-heading {
font-size: 30px;
line-height: 1.2;
font-weight: 700;
color: #111;
}
.ag3-description-text {
font-size: 20px;
color: #000000;
line-height: 1.8;
max-width: 600px;
font-weight: 500;
margin-bottom: 32px;
font-family: Quicksand;
}
.ag3-benefits-list {
list-style: none;
margin-bottom: 32px;
width: 100%;
max-width: 480px;
}
.ag3-benefits-list li {
display: flex;
align-items: center;
margin-bottom: 15px;
font-size: 16px;
}
.ag3-check-icon-box {
display: inline-flex;
justify-content: center;
align-items: center;
width: 24px;
height: 24px;
color: #b9973e;
margin-right: 12px;
flex-shrink: 0;
}
.ag3-shop-button {
display: inline-block;
background-color: #b9973e;
color: #ffffff !important;
padding: 14px 28px;
border-radius: 6px;
text-decoration: none;
font-weight: 600;
font-size: 16px;
transition: background-color 0.3s ease;
}
.ag3-shop-button:hover {
background-color: #a07f32;
color: #fff !important;
}
.ag3-text-content-area {
max-width: 600px;
}
.ag3-feature-list {
margin-top: 30px;
}
.ag3-feature-item {
display: flex;
align-items: flex-start;
gap: 15px;
margin-bottom: 15px;
}
.ag3-feature-item img {
width: 40px;
height: 40px;
object-fit: contain;
}
.ag3-feature-item h4 {
margin: 0 0 5px;
font-size: 16px;
font-weight: 600;
color: #000000;
}
.ag3-feature-item p {
margin: 0;
font-size: 14px;
color: #555;
line-height: 1.6;
}
/* =========================
Tablet Responsive (≤ 992px)
========================= */
@media (max-width: 992px) {
.ag3-container-wrapper {
grid-template-columns: 1fr;
gap: 50px;
text-align: left;
}
/* Image top, text bottom (optional reverse remove if not needed) */
.ag3-image-box {
order: -1;
}
.ag3-text-content-area {
align-items: left !important;
max-width: 100%;
}
.ag3-description-text,
.ag3-benefits-list {
max-width: 100%;
}
.ag3-product-main-image {
width: 320px;
}
.ag3-main-heading {
font-size: 26px;
}
.ag3-description-text {
font-size: 18px;
}
}
/* =========================
Mobile Responsive (≤ 576px)
========================= */
@media (max-width: 576px) {
.ag3-product-section {
padding: 50px 0;
}
.ag3-container-wrapper {
gap: 35px;
}
.ag3-product-main-image {
width: 300px;
}
.ag3-small-label {
font-size: 12px;
letter-spacing: 1.5px;
}
.ag3-main-heading {
font-size: 22px;
line-height: 1.3;
}
.ag3-description-text {
font-size: 16px;
line-height: 1.6;
}
.ag3-benefits-list li {
font-size: 14px;
margin-bottom: 12px;
}
.ag3-shop-button {
padding: 12px 22px;
font-size: 14px;
}
.ag3-feature-item p {
text-align: left;
}
.ag3-feature-item h4 {
text-align: left;
}
}
/* why choose us section */
/* Section */
.why-choose {
padding: 60px 20px;
background-image: url(../images/bg-overlay.png);
background-repeat: no-repeat;
background-position: right 20px bottom 10px;
background-size: 500px;
}
/* Container */
.container {
max-width: 1350px;
margin: 0 auto;
}
.container-1 {
max-width: 1150px;
margin: 0 auto;
}
.container2 {
max-width: 1100px;
margin: 0 auto;
}
/* Header */
.section-header {
text-align: center;
margin-bottom: 60px;
}
.section-header h2 {
font-size: 36px;
font-weight: 700;
color: #222;
margin-bottom: 15px;
}
.section-header p {
max-width: 750px;
margin: 0 auto;
font-size: 16px;
color: #666;
line-height: 1.6;
}
/* Cards Layout using Flexbox */
.cards {
display: flex;
flex-wrap: wrap;
justify-content: center;
/* Centers second row automatically */
gap: 30px;
}
/* Card Styling */
.card {
flex: 0 0 calc(25% - 22.5px);
/* 4 per row on desktop */
background: #ffffff;
border-radius: 12px;
padding: 20px;
text-align: center;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
border: 1px solid #dcdcdc;
transition: all 0.3s ease;
}
.card:hover {
transform: translateY(-5px);
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.12);
}
/* Card Image */
.card img {
width: 100%;
height: 160px;
object-fit: cover;
border-radius: 10px;
margin-bottom: 20px;
}
/* Card Title */
.card h3 {
font-size: 18px;
font-weight: 600;
color: #222;
margin-bottom: 10px;
}
/* Card Description */
.card p {
font-size: 14px;
color: #666;
line-height: 1.6;
}
/* Tablet */
@media (max-width: 992px) {
.card {
flex: 0 0 calc(50% - 15px);
/* 2 per row */
}
}
/* Mobile */
@media (max-width: 600px) {
.card {
flex: 0 0 100%;
/* 1 per row */
}
}
/* Our Story Section */
.our-story {
background-image: url("../imgs/ourstory.png");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
padding: 100px 20px;
color: #ffffff;
width: 100%;
position: relative;
}
/* Optional overlay for better text readability */
.our-story .container {
max-width: 1200px;
margin: 0 auto;
position: relative;
z-index: 2;
}
/* Content Box */
.story-content {
max-width: 700px;
padding: 40px;
}
/* Heading */
.story-content h3 {
font-size: 32px;
font-weight: 600;
margin-bottom: 20px;
}
/* Paragraph */
.story-content p {
font-size: 15px;
line-height: 1.8;
font-weight: 300;
margin-bottom: 30px;
font-family: quicksand;
}
/* Button */
.story-btn {
background-color: #2F3E10;
color: #ffffff;
border: none;
padding: 12px 20px;
border-radius: 6px;
letter-spacing: 2px;
text-transform: uppercase;
font-size: 12px;
cursor: pointer;
transition: all 0.3s ease;
}
.story-btn:hover {
background-color: #1f2a0b;
}
/* Responsive */
@media (max-width: 992px) {
.our-story {
padding: 80px 20px;
}
.story-content {
max-width: 100%;
padding: 20px;
}
.story-content h3 {
font-size: 26px;
}
.story-content p {
font-size: 14px;
}
}
@media (max-width: 576px) {
.our-story {
padding: 60px 15px;
}
.story-content h3 {
font-size: 22px;
}
.story-btn {
width: 100%;
}
.story-content p {
text-align: justify;
}
.our-story {
background-position: center right;
}
}
.benefits-img {
width: 100%;
max-width: 1000px;
height: auto;
margin-left: 150px;
}
.carousel-3-columns .product-cart-wrap {
width: 33.33% !important;
}
.product-action-1 {
display: none;
}
.awarenees-videos {
background-color: #F8F5EB;
padding: 40px 20px;
}
.awarenees-vidios {
display: flex;
justify-content: center;
margin-bottom: 30px;
}
.videos-awareness-row {
display: flex;
gap: 20px;
justify-content: center;
flex-wrap: nowrap;
}
.videos-awareness {
display: flex;
justify-content: center;
}
/* CARD STYLE */
.awareness-card {
background-color: #fff;
width: 300px;
border-radius: 10px;
overflow: hidden;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
padding: 15px;
display: flex;
flex-direction: column;
gap: 10px;
text-align: left;
transition: all 0.4s ease;
cursor: pointer;
}
/* HOVER EFFECT */
.awareness-card:hover {
transform: translateY(-10px);
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
}
/* VIDEO STYLE */
.video-wrapper {
overflow: hidden;
border-radius: 10px;
}
.video-wrapper video {
width: 100%;
border-radius: 10px;
transition: transform 0.4s ease;
}
/* Zoom video on hover */
.awareness-card:hover video {
transform: scale(1.05);
}
.awareness-meta {
display: flex;
justify-content: space-between;
gap: 10px;
}
.awareness-card h6 {
font-size: 15px;
font-weight: 400;
display: flex;
align-items: center;
gap: 5px;
}
.awareness-title span {
line-height: 1.4;
}
/* =========================
Tablet Responsive (≤ 992px)
========================= */
/* =========================
Mobile Responsive (≤ 576px)
========================= */
@media (max-width: 576px) {
.awarenees-videos {
padding: 30px 15px;
}
.videos-awareness-row {
flex-direction: column;
align-items: center;
gap: 25px;
}
.awareness-card {
width: 95%;
padding: 12px;
}
.awareness-card h6 {
font-size: 13px;
}
.awareness-title span {
font-size: 14px;
}
}
/* article section */
.article-section {
background-color: #fff;
}
/* TITLE */
.article-section-title {
display: flex;
justify-content: center;
margin-bottom: 30px;
}
/* ROW */
.article-card-row {
display: flex;
gap: 20px;
justify-content: center;
flex-wrap: nowrap;
}
/* COLUMN */
.article-card-col {
display: flex;
justify-content: center;
}
/* CARD */
.article-card {
background-color: #fff;
width: 300px;
border-radius: 10px;
overflow: hidden;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
padding: 15px;
display: flex;
flex-direction: column;
gap: 10px;
text-align: left;
transition: all 0.4s ease;
cursor: pointer;
}
/* HOVER EFFECT */
.article-card:hover {
transform: translateY(-10px);
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
}
/* IMAGE */
.article-image-box {
overflow: hidden;
border-radius: 10px;
}
.article-image-box img {
width: 100%;
display: block;
border-radius: 10px;
transition: transform 0.4s ease;
}
/* Image Zoom on Hover */
.article-card:hover img {
transform: scale(1.05);
}
/* META INFO */
.article-meta {
display: flex;
justify-content: space-between;
gap: 10px;
}
.article-meta h6 {
font-size: 15px;
font-weight: 400;
display: flex;
align-items: center;
gap: 5px;
}
.article-title span {
font-family: quicksand;
color: #000;
font-size: 14px;
font-weight: 600;
}
.article-title p {
font-size: 13px;
line-height: 1.3;
margin-top: 5px;
font-family: quicksand;
}
/* =========================
Mobile Responsive (≤ 576px)
========================= */
@media (max-width: 576px) {
.article-section {
padding: 30px 15px;
}
.article-card-row {
flex-direction: column;
align-items: center;
gap: 25px;
}
.article-card {
width: 95%;
padding: 12px;
}
.article-meta h6 {
font-size: 13px;
}
.article-title span {
font-size: 14px;
}
.article-title p {
font-size: 13px;
line-height: 1.5;
}
}
/* ===== FAQ ===== */
.faq {
padding: 80px 0;
background: #fff;
}
.accordion-button {
font-weight: 700;
font-size: 14px;
color: #2c2c2c;
}
.accordion-button:not(.collapsed) {
background: #fdf8ef;
color: var(--green-dark);
box-shadow: none;
}
.accordion-body {
font-size: 14px;
color: #666;
}
.faq-contact {
background: #fdf8ef;
border-radius: 20px;
padding: 40px;
text-align: center;
}
.faq-contact h4 {
color: var(--green-dark);
}
/* FAQ WhatsApp Button */
.faq-whatsapp-wrapper {
display: flex;
justify-content: center;
margin-top: 15px;
}
.faq-whatsapp-btn {
display: inline-flex;
align-items: center;
background: linear-gradient(90deg, #5AD165, #26B23C);
padding: 6px 18px;
border-radius: 60px;
text-decoration: none;
transition: 0.3s ease;
}
.faq-whatsapp-btn:hover {
transform: translateY(-2px);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}
.faq-wa-icon {
width: 40px;
height: 40px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-right: 8px;
}
.faq-wa-icon img {
width: 32px;
height: 32px;
object-fit: contain;
}
.faq-wa-text {
color: #ffffff;
font-size: 14px;
font-weight: 600;
font-family: 'Quicksand', sans-serif;
letter-spacing: 1px;
}
/* Testimonial */
/* Section */
.testimonial-section {
width: 100%;
padding: 30px 20px;
text-align: center;
background-color: #F8F5EB;
}
/* Header */
.section-header {
margin-bottom: 50px;
}
.section-header h2 {
font-size: 2.5rem;
font-weight: 800;
letter-spacing: -0.02em;
text-transform: uppercase;
margin-bottom: 10px;
}
/* Slider */
.slider-wrapper {
position: relative;
overflow: hidden;
padding: 0px 0 0px 0;
}
.slider-track {
display: flex;
transition: transform 0.5s ease-in-out;
gap: 30px;
width: 100%;
}
/* Card */
.testimonial-card {
background: #FFFFFF;
padding: 40px 30px;
border-radius: 12px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
flex-shrink: 0;
width: calc(33.333% - 20px);
display: flex;
flex-direction: column;
align-items: flex-start;
text-align: left;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.testimonial-card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}
/* Stars */
.stars {
color: #F59E0B;
margin-bottom: 20px;
display: flex;
gap: 4px;
}
.stars svg {
width: 20px;
height: 20px;
fill: currentColor;
}
/* Review Text */
.review-text {
font-size: 15px;
line-height: 1.6;
color: #808080;
margin-bottom: 15px;
position: relative;
}
.review-text::before {
content: "“";
font-size: 4rem;
position: absolute;
top: -30px;
left: -10px;
color: #E2E8F0;
font-family: serif;
z-index: -1;
}
/* Customer Info */
.customer-info {
margin-top: auto;
border-top: 1px solid #F1F5F9;
padding-top: 10px;
width: 100%;
}
.customer-name {
font-weight: 800;
font-size: 18px;
color: #0F172A;
margin-bottom: 4px;
font-family: quicksand;
}
.customer-role {
font-size: 14px;
color: #808080;
font-weight: 500;
font-family: quicksand;
}
/* Controls */
.slider-controls {
display: flex;
justify-content: center;
gap: 15px;
margin-top: 20px;
}
.control-btn {
background-color: #FFFFFF;
border: 1px solid #E2E8F0;
color: #0F172A;
width: 50px;
height: 50px;
border-radius: 50%;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.2s ease;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}
.control-btn:hover {
background-color: #0F172A;
color: #FFFFFF;
border-color: #0F172A;
}
.control-btn:focus {
outline: 2px solid #F59E0B;
outline-offset: 2px;
}
.control-btn svg {
width: 24px;
height: 24px;
fill: none;
stroke: currentColor;
stroke-width: 2;
stroke-linecap: round;
stroke-linejoin: round;
}
/* Dots */
.slider-dots {
display: flex;
justify-content: center;
gap: 10px;
margin-top: 25px;
}
.dot {
width: 10px;
height: 10px;
background-color: #CBD5E1;
border-radius: 50%;
cursor: pointer;
transition: background-color 0.3s, transform 0.3s;
}
.dot.active {
background-color: #0F172A;
transform: scale(1.2);
}
/* Responsive */
@media (max-width: 992px) {
.testimonial-card {
width: calc(50% - 15px);
}
}
@media (max-width: 768px) {
.section-header h2 {
font-size: 1.8rem;
}
.testimonial-card {
width: 100%;
}
.slider-wrapper {
padding-bottom: 20px;
}
}
/* Contact form section */
.sample-section {
padding: 80px 0;
background: #fff;
}
/* .container {
max-width: 1350px;
margin: auto;
padding: 0 20px;
} */
.sample-wrapper {
display: flex;
align-items: center;
justify-content: space-between;
gap: 60px;
}
/* LEFT IMAGE */
.sample-image img {
max-width: 100%;
height: auto;
}
/* RIGHT CONTENT */
.sample-content {
max-width: 520px;
}
.sample-content h2 {
font-size: 32px;
font-weight: 700;
color: #134E63;
margin-bottom: 10px;
text-align: left;
}
.sample-content p {
font-size: 14px;
color: #555;
margin-bottom: 30px;
}
/* FORM CONTAINER */
.form-box {
background: #ffffff;
padding: 30px;
width: 400px;
border-radius: 10px;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
}
h2 {
margin-bottom: 20px;
text-align: center;
}
/* FORM */
form {
width: 100%;
}
.form-row {
display: flex;
gap: 15px;
}
.form-group {
flex: 1;
display: inline;
flex-direction: column;
margin-bottom: 15px;
}
.form-group.full {
width: 100%;
}
/* INPUTS */
input,
textarea {
background: #F8F5EB;
border: 2px solid transparent;
padding: 12px;
border-radius: 6px;
font-size: 14px;
}
input:focus,
textarea:focus {
border: 2px solid #b8922f;
}
/* ERROR */
.error-text {
font-size: 12px;
color: red;
display: none;
margin-top: 5px;
}
.form-group.error input,
.form-group.error textarea {
border: 2px solid red;
}
.form-group.error .error-text {
display: block;
}
/* SUCCESS MESSAGE */
.success-message {
margin-top: 10px;
font-size: 14px;
color: #56cf62;
margin-bottom: 30px;
font-family: sans-serif;
font-weight: 400;
text-align: left;
}
/* BUTTON */
.btn-submit {
display: inline-block;
width: 40%;
background-color: #b9973e !important;
color: #ffffff !important;
padding: 14px 28px;
border-radius: 6px;
border: none !important;
font-weight: 600;
font-size: 16px;
cursor: pointer;
transition: background-color 0.3s ease;
}
.btn-submit:hover {
background-color: #a07f32 !important;
color: #ffffff !important;
}
/* RESPONSIVE */
@media(max-width:600px) {
.form-row {
flex-direction: column;
}
.sample-wrapper {
display: block;
}
}
/* Breadcrumb Banner */
.breadcrumb-banner {
position: relative;
width: 1300px;
height: 300px;
background: url(../imgs/home-banner.png) center / cover no-repeat;
border-radius: 25px;
overflow: hidden;
margin: 0px 20px;
}
/* Overlay */
.breadcrumb-overlay {
position: absolute;
inset: 0;
background: rgba(0, 0, 0, 0.35);
}
/* Content Center */
.breadcrumb-content {
position: relative;
z-index: 2;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: baseline;
color: #ffffff;
text-align: start;
margin-left: 150px;
}
/* Title */
.breadcrumb-content h1 {
font-size: 42px;
font-weight: 600;
margin-bottom: 10px;
color: #fff;
}
.separator {
color: #fff;
}
.current {
color: #fff;
}
/* Breadcrumb */
.breadcrumb {
display: flex;
align-items: center;
font-size: 14px;
}
.breadcrumb a {
color: #ffffff;
text-decoration: none;
opacity: 0.9;
transition: 0.3s;
}
.breadcrumb a:hover {
opacity: 1;
text-decoration: underline;
}
.separator {
opacity: 0.8;
}
.current {
opacity: 0.9;
}
/* Responsive */
@media (max-width: 768px) {
.breadcrumb-banner {
height: 200px;
/*width: 320px;*/
width: auto;
border-radius: 15px;
margin-top: 10px;
}
.breadcrumb-content h1 {
font-size: 28px;
}
.pl-0 {
padding: 0px !important;
}
}
/* contact page form section */
/* SECTION */
.agc-contact-section {
padding: 50px 0;
}
.agc-contact-container {
width: 1200px;
margin: auto;
display: flex;
gap: 50px;
}
/* LEFT SIDE */
.agc-contact-left {
flex: 1;
}
.agc-contact-heading {
font-size: 22px;
margin-bottom: 30px;
}
.agc-contact-item {
display: flex;
gap: 18px;
margin-bottom: 28px;
align-items: flex-start;
}
.agc-contact-icon {
width: 40px;
min-width: 40px;
}
.agc-contact-icon img {
width: 22px;
height: 22px;
object-fit: contain;
}
.agc-contact-item h4 {
margin: 0 0 4px;
font-size: 17px;
font-weight: 600;
color: #000;
}
.agc-contact-item p {
margin: 0;
font-size: 14px;
color: #000;
line-height: 1.5;
}
/* RIGHT SIDE */
.agc-contact-right {
flex: 1;
background: #f9f9ebb5;
padding: 35px 40px;
}
.agc-form-title {
margin: 0 0 6px;
font-size: 24px;
}
.agc-form-subtitle {
font-size: 13px;
color: #666;
margin-bottom: 20px;
/* reduced space */
}
.map-section {
margin: 0px 0px 30px;
}
.map-container {
width: 100%;
max-width: auto;
margin: auto;
}
.map-container iframe {
width: 100%;
height: 350px;
}
.banner-img.style-2::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
/* Example: dark gradient from top to bottom */
background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.3));
z-index: 1;
}
.banner-text {
margin-left: 10px;
}
.footer-contact li a {
color: inherit;
/* Same as normal text color */
text-decoration: none !important;
transition: color 0.3s ease;
}
.footer-contact li a:hover,
.footer-contact li a:focus {
color: #B99B3C;
text-decoration: none;
/* Optional for clarity */
outline: none;
}
.footer-social-links img {
width: 20px;
margin-left: -10px;
}
@media(max-width:767px) {
.home-slider {
margin-top: 20px;
}
.benefits-img {
margin-left: 0px;
}
.sample-section {
padding: 80px 25px 20px;
}
.sample-content h2 {
font-size: 28px;
}
.footer-about {
padding: 0px;
}
.mtm-0 {
margin-top: 0px;
}
.mtb-60 {
margin: 0 !important;
}
.agc-contact-section {
padding: 10px 10px;
}
.agc-contact-container {
gap: 0px;
}
}
/* Default: sab jagah hide */
.header-bottom {
display: none;
}
/* @media (max-width: 992px) {
.agc-contact-container {
flex-direction: column;
}
.agc-contact-left,
.agc-contact-right {
width: 28%;
}
.agc-contact-right {
margin: 20px 15px;
}
.agc-contact-left {
margin: 0px 20px;
}
} */
@media (max-width: 992px) {
.agc-contact-container {
width: 100%;
padding: 0 30px;
flex-direction: column;
gap: 40px;
}
.agc-contact-left,
.agc-contact-right {
width: 100%;
/* IMPORTANT */
}
.agc-contact-right {
padding: 30px;
}
}
/* Mobile + Tablet (0px se 991px tak) */
@media (max-width: 991px) {
.header-bottom {
display: block !important;
position: fixed;
/* Sticky banane ke liye */
top: 0;
/* Top sticky */
left: 0;
width: 100%;
z-index: 9999;
background: #fff;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
/* Page content hide na ho isliye */
body {
padding-top: 80px;
/* Header ki height ke hisab se adjust kare */
}
}
/* Desktop (992px se upar) */
@media (min-width: 992px) {
.header-bottom {
display: none !important;
}
}
/* Main Box */
.certficate-footer {
width: 100%;
max-width: 1300px;
background: #fff;
padding: 25px 40px;
border-radius: 12px;
}
/* Title */
.certificate-title {
font-size: 28px;
font-weight: 600;
color: #1f2d3d;
margin: 0;
}
/* Logos */
.certificate-logos img {
height: 65px;
object-fit: contain;
transition: 0.3s ease;
}
/* ============================= */
/* Tablet Responsive */
/* ============================= */
@media (max-width: 991px) {
.certficate-footer {
flex-direction: column;
text-align: center;
padding: 25px;
}
.certificate-title {
margin-bottom: 20px;
font-size: 24px;
}
.certificate-logos {
justify-content: center;
}
.certificate-logos img {
height: 55px;
}
.certficate-footer {
display: flex;
align-items: center;
justify-content: space-between;
}
}
/* ============================= */
/* Mobile Responsive */
/* ============================= */
@media (max-width: 576px) {
.certficate-footer {
padding: 20px 0px;
border-radius: 10px;
margin: 0px 12px;
}
.certificate-title {
font-size: 20px;
}
.certificate-logos {
gap: 15px;
}
.certificate-logos img {
height: 45px;
}
}
.certficate-footer {
display: block;
}
/* Desktop only */
@media (min-width: 992px) {
.certficate-footer {
display: flex;
align-items: center;
justify-content: space-between;
}
}
/* ============================= */
/* TABLET VIEW (768px – 1024px) */
/* ============================= */
@media (min-width: 768px) and (max-width: 1024px) {
.ag2-container-wrapper {
grid-template-columns: 1fr 1fr;
/* 2 column hi rahe */
gap: 40px;
/* desktop se thoda kam gap */
padding: 0 40px;
align-items: center;
}
.ag2-text-content-area {
align-items: flex-start;
text-align: left;
}
.ag3-container-wrapper {
display: grid;
grid-template-columns: 1fr 1fr;
/* 2 column maintain */
gap: 40px;
align-items: center;
padding: 0 40px;
}
.ag3-text-content-area {
text-align: left !important;
}
.benefits-img {
margin-left: 0px;
}
.awareness-card,
.article-card {
width: 230px;
}
.sample-section {
padding: 80px 50px;
}
.banner-left-icon {
padding: 14px;
}
.banner-left-icon .banner-text h3 {
font-size: 13px;
}
.banner-left-icon .banner-text p {
font-size: 10px;
}
.certficate-footer {
margin: 0px 20px;
}
.breadcrumb-banner {
width: 795px;
}
.journey-container {
gap: 18px;
}
.article-meta h6 {
font-size: 12px;
}
.sample-content h2{
font-size: 28px;
text-align: left;
}
.awareness-card h6{
font-size: 11px;
}
.footer-about {
padding: 0px 30px 0px 0px;
}
}
/* login page */
.login-card {
width: 100%;
max-width: 400px;
padding: 30px;
border-radius: 15px;
box-shadow: 0 10px 30px rgba(0,0,0,0.1);
background: #ffffff;
}
.login-title {
font-weight: 600;
margin-bottom: 10px;
}
.btn-primary {
background-color: #4f46e5;
border: none;
padding: 10px;
border-radius: 8px;
}
.btn-primary:hover {
background-color: #4338ca;
}
.btn:hover{
border-color: #b8922f;
}
@media (max-width: 576px){
.login-card{
max-width: 340px;
}
.ag2-text-content-area, .ag3-text-content-area{
align-items: center;
}
.ag3-main-heading, .ag3-description-text{
text-align:center;
}
.agc-contact-container{
gap: 10px;
padding: 20px 30px;
}
.cart-sidebar{
top: 80px !important;
height: 90% !important;
}
}
.cart-overlay{
position:fixed;
width:100%;
height:100%;
background:rgba(0,0,0,0.4);
top:0;
left:0;
opacity:0;
visibility:hidden;
transition:0.3s;
z-index:999;
}
.cart-overlay.active{
opacity:1;
visibility:visible;
}
.cart-sidebar{
position:fixed;
top:0;
right:-400px;
width:380px;
height:100%;
background:#fff;
box-shadow:-5px 0 15px rgba(0,0,0,0.1);
transition:0.4s;
z-index:1000;
display:flex;
flex-direction:column;
}
.cart-sidebar.active{
right:0;
}
.cart-header{
padding:15px;
border-bottom:1px solid #eee;
display:flex;
justify-content:space-between;
align-items:center;
}
.cart-body{
flex:1;
overflow-y:auto;
padding:15px;
}
.cart-item{
display:flex;
gap:10px;
margin-bottom:15px;
border-bottom:1px solid #eee;
padding-bottom:10px;
}
.cart-item img{
width:70px;
height:70px;
object-fit:cover;
border-radius:6px;
}
.cart-item-title{
font-size:14px;
font-weight:600;
}
.cart-footer{
padding:15px;
border-top:1px solid #eee;
}
.checkout-btn{
display:block;
width:100%;
background:#b99b3c;
color:#fff;
text-align:center;
padding:10px;
border-radius:6px;
text-decoration:none;
margin-top:10px;
}
.qty-wrapper{
display:flex;
align-items:center;
gap:8px;
margin-top:6px;
}
.qty-btn{
width:30px;
height:30px;
border:none;
background:#f3f3f3;
border-radius:6px;
cursor:pointer;
font-weight:bold;
}
.qty-number{
width:35px;
height:30px;
background:#b99b3c;
color:#fff;
display:flex;
align-items:center;
justify-content:center;
border-radius:6px;
font-weight:600;
}
.story-content h3, p{
color:#000 !important;
font-weight: 500;
}
.header-style-1 .header-middle-ptb-1 {
background: #ffffff !important;
}
.logo.logo-width-1 a img {
padding-left: 0px !important;
width: 100% !important;
}
.main-menu > nav > ul > li > a:before {
content: none !important;
}
.header-action-2 .header-action-icon-2 {
padding-top: 9px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
/* padding: 0 10px; */
border: 0;
position: relative;
height: 40px;
/* line-height: 36px; */
padding-left: 0px;
padding-right: 0px;
width: 150px;
/* max-width: unset; */
/* border-radius: 5px; */
/* background: #fff; */
margin-right: 0px; 
-webkit-box-shadow: 0px 0px 0px rgb(0 0 0 / 1%) !important;
/* box-shadow: -1px 0px 13px 14px rgb(255 255 255 / 10%); */
text-overflow: ellipsis;
/* overflow: hidden; */
/* white-space: nowrap; */
transition: all ease 0.4s;
backdrop-filter: blur(10px);
}
.header-action-login{
-webkit-box-shadow:none !important;
}
.pro-count{
background-color: #b99b3c !important;
margin-left: 0px !important;
font-size: 11px;
height: 16px;
width: 16px;
line-height: 15px;
padding-left: 5px;
}
.header-action-2 .header-action-login > a{
color: #7e7e7e !important;
}
.rounded-circle {
border-radius: 50% !important;
}
.lable {
margin-top: 5px;
font-size: 16px;
color: #7e7e7e !important;
}
.header-cart{
margin-left:50px !important;
}
.hover-img{
display:none !important;
}
.product-width{
width:280px !important;
flex:0 0 280px;
max-width:280px;
margin-right:20px;
}
.carausel-3-columns-cover .carausel-3-columns img{
margin:0px !important;
}
.slick-slide{
height:400px !important;
}
.home-slide-cover{
max-width:1360px;
margin:auto;
padding:0 20px;
}
.single-hero-slider{
border-radius:25px;
overflow:hidden;
}
.accordion-button:focus {
border-color:none !important;
}
.empty-img img{
width: 250px;
height: 350px;
}
.accordion-button:focus{
border-color: #b9973e !important;  
}
.mobile-social-icon a{
    background: #B99B3C;
}
@media only screen and (max-width: 480px) {
    .mobile-promotion {
        background: #B99B3C;
    }
    .hero-slider-1 .single-hero-slider {
        height: 150px;
    }
    .hero-slider-1 .single-hero-slider.rectangle {
        border-radius: 20px !important;
    }
    .carausel-3-columns-cover .carausel-3-columns{
        margin: 0 27px !important;
    }
    .header-action-2 .header-action-icon-2{
        width:70px !important;
    }
    .icon-cart img{
        max-width:40px !important;
    }
    .pro-count{
        padding-left:1px !important;
    }
    .header-cart{
        margin-left:0px !important;
    }
    .top-space{
        margin-top: -40px;
    }
}
.custom-breadcrumb a {
    color: #B99B3C;
}
.detail-info h2 {
    margin-bottom:0px !important;
}
.title-detail{
    text-align:left !important;
}
.current-price{
    color:#B99B3C !important;
}
.view-add-group .product-add{
    margin-left: 25px !important;
}
.product-image-slider img {
    width: 100%;
}
.checkout-btn{
    background-color: #B99B3C !important;
}
.checkout-btn:hover,
.checkout-btn:active,
.checkout-btn:focus {
    background-color: #a07f32 !important;
}
.text-size h1 {
    font-size: 20px !important;
    color: #253D4E !important;
    font-weight: 700 !important;
}
.text-order h4{
    font-size: 18px !important;
    color: #253D4E !important;
    font-weight: 700 !important;
}
.text-brand{
    font-size: 18px;
}
.card {
    border: 1px solid #eee;
    border-radius: 6px;
}

.card-header {
    background: #fff;
    border-bottom: 1px solid #eee;
}

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 6px;
    display: block;
}

.form-control {
    height: 45px;
    border-radius: 6px;
    border: 1px solid #ddd;
}

.form-control:focus {
    border-color: #B99B3C !important;
    box-shadow: none;
}

.required {
    color: red;
}

.submit-btn {
    background: #B99B3C;
    border: none;
    padding: 12px 40px;
    color: white;
    border-radius: 5px;
}.submit-btn:hover,
.submit-btn:focus,
.submit-btn:active {
    background-color: #a07f32 !important;
    border-color: #a07f32 !important;
    color: #fff;
}
#submit{
    background-color: #B99B3C;
    border-color: #B99B3C;
    color: #fff;
}

#submit:hover,
#submit:focus,
#submit:active{
    background-color: #a07f32 !important;
    border-color: #a07f32 !important;
    color: #fff;
}
#account_detail label{
    text-align: left;
    display: block;
}
.location{
    display: none !important;
}
.popup .popup__content .close span{
    background: #B99B3C !important;
}
/* Show text selection properly */
::selection {
    background: #0d6efd !important;   /* blue highlight */
    color: #ffffff !important;
}

/* For Firefox */
::-moz-selection {
    background: #0d6efd !important;
    color: #ffffff !important;
}
/* Header menu link color */
.main-menu nav ul li a {
    color: #000 !important;
    text-decoration: none;
}

/* Hover color */
.main-menu nav ul li a.active,
.main-menu nav ul li a:hover {
    color: #B99B3C !important;
}
@media (min-width: 1401px) and (max-width: 1800px) {
    .hero-slider-1 .single-hero-slider {
        height: 400px !important;
    }
}
.btn-pd{
    padding: 8px 0px !important;
    width: 85% !important;
}

.variant-section {
	max-width: 520px;
}

.variant-title {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 12px;
	color: #333;
}

/* ===== Grid Layout ===== */
.variant-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px;
}

/* ===== Card ===== */
.variant-card {
	border: 1px solid #d6d6d6;
	border-radius: 12px;
	overflow: hidden;
	background: #e5e5e5;
	cursor: pointer;
	transition: all .2s ease;
}

/* Hover */
.variant-card:hover {
	background: #b89b3b;
    border-color: #8a7a2a;
	box-shadow: 0 3px 8px rgba(0, 0, 0, 0.08);
}

/* ===== Card Top ===== */
.variant-top {
	padding: 5px 13px !important;
	font-size: 14px;
	font-weight: 600;
}
.variant-top:hover{
    color: #fff;
}

/* ===== Price Section ===== */
.variant-bottom {
	background: #f7f7f7;
	border-top: 1px solid #dcdcdc;
    padding: 5px 13px !important;
	display: flex;
	align-items: center;
	gap: 8px;
}

/* Price */
.price {
	font-weight: 700;
	font-size: 14px;
}

/* Old Price */
.old-price {
	font-size: 12px;
	text-decoration: line-through;
	color: #7a7a7a;
}

/* Discount */
.discount {
	font-size: 12px;
	color: #4CAF50;
	font-weight: 600;
}

/* ===== Active State ===== */
.variant-card.active {
	background: #b89b3b;
	border-color: #8a7a2a;
}

.variant-card.active .variant-top {
	color: #ffffff;
}

.variant-card.active .variant-bottom {
	background: #ffffff;
	border-top: 1px solid #dcdcdc;
}

/* ===== Responsive ===== */
@media (max-width:768px) {
	.variant-section {
		max-width: 100%;
	}

	.variant-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width:480px) {
	/*.variant-grid {*/
	/*	grid-template-columns: unset !important; */
	/*}*/
}
.benefit-of-ghee {
    width:100vw;
    margin-left:calc(-50vw + 50%);
    margin-top: 35px;
    margin-bottom: 35px;
}
.benefit-of-ghee img{
    width:100%;
    height:auto;
    display:block;
}
.a2-ghee-comparison {
    width:100vw;
    margin-left:calc(-50vw + 50%);
    margin-top: 35px;
}

.a2-ghee-comparison img{
    width:100%;
    height:auto;
    display:block;
}
.product-center-section .slick-track{
    display:flex !important;
    justify-content:center;
}

.product-center-section .slick-slide{
    float:none !important;
}
.text-yellow{
    color: #B99B3C !important;
}
.privacy-content h2{
    font-size: 20px !important;
    text-align: start !important;
}
.invoice-3 .invoice-table thead{
    background-color: #B89B3B !important;
}
.invoice-content .btn-download {
    background: #B89B3B !important;
}
.invoice-content .btn-lg{
    color: #fff !important;
}
.invoice-content .btn-download:after{
    background: #000000 !important;
}
.invoice-content .btn-print:after{
    background:#B89B3B !important;
}
.btn:hover, .button:hover {
    background-color: #B89B3B !important;
}
.invoice-numb{
    color: #000;
}
.next-wrapper .one_half {
    width: 100%;
}

.next-wrapper .btn {
    width: 100%;
    display: block;
}
.agc-contact-left a {
    color: #000 !important;
}
.agc-contact-left a:hover {
    color: #B99B3C !important;
}
.header-action-right {
    position: relative;
    z-index: 1 !important;
}

.cart-dropdown-wrap {
    z-index: 9999 !important; 
}
.login-popup,
.modal,
.popup-wrapper {
    z-index: 99999 !important;
    position: fixed; /* important */
}

.account-dropdown:hover .cart-dropdown-wrap {
    opacity: 1;
    visibility: visible;
    top: 100%;
}
#response1 {
  color: red;
  font-size: 12px;
  min-height: 18px; /* space reserve */
  /*margin-top: 4px;*/
}
.login-phone:after, .login-phone:before {
    top: 30% !important;
}
.breadcrumb span::before {
    content: none !important;
}
.custom-product-section .product-width {
    width: 223px !important;
}
.product-cart-wrap .product-img-action-wrap .product-img-zoom a img{
    height: 270px !important;
}
.required:after{
    content: none !important;
}
.testimonial-card .stars{
    display: none !important;
}
/* Mobile devices (up to 767px) */
@media (max-width: 767px) {
  .slick-slide {
    height: 325px !important;
}
.breadcrumb-content{
    margin-left: 0;
    align-items: center;
    text-align: center;
}
}