/*---------------------------------------------------------------
Template Name: onlybox
Template URL: 
Description: 
Author: 
Author URL: 
Version: 1.0.0
---------------------------------------------------------------*/
/*=============================================================*/
body{
font-family: var(--font-primary) !important;
font-size:var(--body-font) !important;
}
a{
text-decoration: none !important;
color: var(--color-dark);
}
a:hover{
color: var(--color-primary);
}
input:focus {
outline:none;
}
.is-hidden{
display:none;
}
figure{
margin:0 !important;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
font-weight:700 !important;
font-family:var(--font-secondary) !important;
}
@media (min-width: 1200px) {
.container, .container-lg, .container-md, .container-sm, .container-xl {
max-width: 1270px;
}
}
/*=============================================================*/
.bg-gray-100{
background:var(--color-gray-100);
}
.tx-10{
font-size:10px;
}
.tx-11{
font-size:11px;
}
.tx-12{
font-size:12px;
}
.tx-13{
font-size:13px;
}
.tx-14{
font-size:14px;
}
.tx-16{
font-size:16px;
}
.tx-gray-500{
color:var(--color-gray-500);
}
.tx-gray-600{
color:var(--color-gray-600);
}
.tx-gray-700{
color:var(--color-gray-700);
}
.tx-primary{
color:var(--color-primary) !important;
}
.tx-success{
color:var(--color-success) !important;
}
.text-right{
text-align:right;
}
.fw700{
font-weight:700 !important;
}
.ml-auto{
margin-left:auto;
}
.btn{
border-radius:5px;
}
.btn-lg{
padding:14px 30px;
font-size:16px;
}
.btn-md{
padding:10px 20px;
font-size:14px;
}
.btn-sm{
padding:7px 15px;
font-size:12px;
}
.btn-full{
width:100%;
}
.btn-primary{
background:var(--color-primary);
border-color:var(--color-primary);
}

.btn-outline-primary{
border-color:var(--color-primary);
color:var(--color-primary);
}
.overlay-zoom {
overflow: hidden
}
.overlay-zoom figure {
overflow: hidden
}
.overlay-zoom img {
transition: transform 0.3s
}
.overlay-zoom:hover img {
transform: scale(1.08)
}
.img-fluid{
width:100%;
}
.wd-100{
width:100px;
}
.wd-150{
width:150px;
}
.wd-175{
width:175px;
}
.wd-200{
width:200px;
}
.wd-250{
width:250px;
}
.divider03{
background:var(--color-gray-100);
height:3px;
width:100%;
}
.divider05{
background:var(--color-gray-100);
height:5px;
width:100%;
}
.border-top{
border-top:1px solid var(--color-gray-100) !important;
}
.border-bottom{
border-bottom:1px solid var(--color-gray-100) !important;
}
/*=============================================================*/
.loaderbutton {
position: relative;
}
.loaderbutton::after {
content: '';
display: block;
width: 1.1em;
height: 1.1em;
position: absolute;
left: calc(50% - 0.5em);
top: calc(50% - 0.5em);
border: 0.2em solid transparent;
border-right-color: white;
border-radius: 50%;
animation: loader-animation 0.7s linear infinite;
opacity: 0;
}
.loaderbuttonnew {
position: relative;
}
.loaderbuttonnew::after {
    content: '';
display: block;
width: 1.1em;
height: 1.1em;
position: absolute;
left: calc(50% - 0.5em);
top: calc(50% - 0.5em);
border: 0.2em solid transparent;
border-right-color: #1b8057;
border-radius: 50%;
animation: loader-animation 0.7s linear infinite;
opacity: 0; 
}
.loaderbuttonnew.loading {
color: transparent;
}
.loaderbuttonnew.loading::after {
opacity: 1;
}
@keyframes loader-animation {
from {
transform: rotate(0);
}
to {
transform: rotate(360deg);
}
}
.loaderbutton.loading {
color: transparent;
}
.loaderbutton.loading::after {
opacity: 1;
}
/*=============================================================*/
.section-title{
width:100%;
position:relative;
display:inline-block;
margin-bottom:40px;
}
.section-title h2{
font-size:24px;
}
@media (max-width: 991px){
.section-title h2{
font-size:18px;
}	
}
.page-title{
width:100%;
position:relative;
display:flex;
align-items:center;
justify-content:space-between;
}
.page-title h1{
font-size:1.8rem;
}
/*=============================================================*/
.shortby {
justify-content:space-between;
align-items: center;
display: flex;
margin-bottom: 20px;
position: relative;
width: 100%;
}
.shortbydrop .shortbydrop-inner {
align-items: center;
display: flex;
gap:10px;
}
.shortbydrop label{
margin-right:10px;
}
.shortbydrop select {
appearance: none;
outline: 0;
border: 0;
box-shadow: none;
/* Personalize */
flex: 1;
padding: 0 1em;
color: #000;
background-color: var(--color-gray-100);
background-image: none;
cursor: pointer;
height: 40px;
border-radius:5px 0px 0px 5px;
}
/* Remove IE arrow */
.shortbydrop select::-ms-expand {
display: none;
}
/* Custom Select wrapper */
.select {
position: relative;
display: flex;
width: 17em;
height: 40px;
border-radius:0px 5px 5px 0px;
overflow: hidden;
}
/* Arrow */
.select::after {
content: "\ea4e";
position: absolute;
top: 0;
right: 0;
background-color:var(--color-gray-100);
transition: .25s all ease;
pointer-events: none;
font-family: remixicon !important;
font-style: normal;
-webkit-font-smoothing: antialiased;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
height:40px;
width:40px;
display:flex;
align-items:center;
justify-content:center;
}
/* Transition */
.select:hover::after {
color:var(--color-primary);
}

/*=============================================================*/
.cols-1>* {
max-width:100%;
flex:0 0 100%
}
.cols-2>* {
max-width:50%;
flex:0 0 50%
}
.cols-3>* {
max-width:33.3333%;
flex:0 0 33.3333%
}
.cols-4>* {
max-width:25%;
flex:0 0 25%
}
.cols-5>* {
max-width:20%;
flex:0 0 20%
}
.cols-6>* {
max-width:16.6667%;
flex:0 0 16.6667%
}
.cols-7>* {
max-width:14.2857%;
flex:0 0 14.2857%
}
.cols-8>* {
max-width:12.5%;
flex:0 0 12.5%
}
@media (min-width:480px) {
.cols-xs-1>* {
max-width:100%;
flex:0 0 100%
}
.cols-xs-2>* {
max-width:50%;
flex:0 0 50%
}
.cols-xs-3>* {
max-width:33.3333%;
flex:0 0 33.3333%
}
.cols-xs-4>* {
max-width:25%;
flex:0 0 25%
}
.cols-xs-5>* {
max-width:20%;
flex:0 0 20%
}
.cols-xs-6>* {
max-width:16.6667%;
flex:0 0 16.6667%
}
.cols-xs-7>* {
max-width:14.2857%;
flex:0 0 14.2857%
}
.cols-xs-8>* {
max-width:12.5%;
flex:0 0 12.5%
}
}
@media (min-width:576px) {
.cols-sm-1>* {
max-width:100%;
flex:0 0 100%
}
.cols-sm-2>* {
max-width:50%;
flex:0 0 50%
}
.cols-sm-3>* {
max-width:33.3333%;
flex:0 0 33.3333%
}
.cols-sm-4>* {
max-width:25%;
flex:0 0 25%
}
.cols-sm-5>* {
max-width:20%;
flex:0 0 20%
}
.cols-sm-6>* {
max-width:16.6667%;
flex:0 0 16.6667%
}
.cols-sm-7>* {
max-width:14.2857%;
flex:0 0 14.2857%
}
.cols-sm-8>* {
max-width:12.5%;
flex:0 0 12.5%
}
}
@media (min-width:768px) {
.cols-md-1>* {
max-width:100%;
flex:0 0 100%
}
.cols-md-2>* {
max-width:50%;
flex:0 0 50%
}
.cols-md-3>* {
max-width:33.3333%;
flex:0 0 33.3333%
}
.cols-md-4>* {
max-width:25%;
flex:0 0 25%
}
.cols-md-5>* {
max-width:20%;
flex:0 0 20%
}
.cols-md-6>* {
max-width:16.6667%;
flex:0 0 16.6667%
}
.cols-md-7>* {
max-width:14.2857%;
flex:0 0 14.2857%
}
.cols-md-8>* {
max-width:12.5%;
flex:0 0 12.5%
}
}
@media (min-width:992px) {
.cols-lg-1>* {
max-width:100%;
flex:0 0 100%
}
.cols-lg-2>* {
max-width:50%;
flex:0 0 50%
}
.cols-lg-3>* {
max-width:33.3333%;
flex:0 0 33.3333%
}
.cols-lg-4>* {
max-width:25%;
flex:0 0 25%
}
.cols-lg-5>* {
max-width:20%;
flex:0 0 20%
}
.cols-lg-6>* {
max-width:16.6667%;
flex:0 0 16.6667%
}
.cols-lg-7>* {
max-width:14.2857%;
flex:0 0 14.2857%
}
.cols-lg-8>* {
max-width:12.5%;
flex:0 0 12.5%
}
}
@media (min-width:1200px) {
.cols-xl-1>* {
max-width:100%;
flex:0 0 100%
}
.cols-xl-2>* {
max-width:50%;
flex:0 0 50%
}
.cols-xl-3>* {
max-width:33.3333%;
flex:0 0 33.3333%
}
.cols-xl-4>* {
max-width:25%;
flex:0 0 25%
}
.cols-xl-5>* {
max-width:20%;
flex:0 0 20%
}
.cols-xl-6>* {
max-width:16.6667%;
flex:0 0 16.6667%
}
.cols-xl-7>* {
max-width:14.2857%;
flex:0 0 14.2857%
}
.cols-xl-8>* {
max-width:12.5%;
flex:0 0 12.5%
}
}
@media (min-width:1600px) {
.cols-xxl-1>* {
max-width:100%;
flex:0 0 100%
}
.cols-xxl-2>* {
max-width:50%;
flex:0 0 50%
}
.cols-xxl-3>* {
max-width:33.3333%;
flex:0 0 33.3333%
}
.cols-xxl-4>* {
max-width:25%;
flex:0 0 25%
}
.cols-xxl-5>* {
max-width:20%;
flex:0 0 20%
}
.cols-xxl-6>* {
max-width:16.6667%;
flex:0 0 16.6667%
}
.cols-xxl-7>* {
max-width:14.2857%;
flex:0 0 14.2857%
}
.cols-xxl-8>* {
max-width:12.5%;
flex:0 0 12.5%
}
}
.order-first {
order:-1
}
.order-last {
order:9
}
@media (min-width:576px) {
.order-sm-auto {
order:0
}
.order-sm-first {
order:-1
}
.order-sm-last {
order:9
}
}
@media (min-width:768px) {
.order-md-auto {
order:0
}
.order-md-first {
order:-1
}
.order-md-last {
order:9
}
}
@media (min-width:992px) {
.order-lg-auto {
order:0
}
.order-lg-first {
order:-1
}
.order-lg-last {
order:9
}
}
@media (min-width:1200px) {
.order-xl-auto {
order:0
}
.order-xl-first {
order:-1
}
.order-xl-last {
order:9
}
}
/*=============================================================*/
.navbar {
padding: 0 !important;
position: static !important;
width: 100%;
font-size:var(--menu-font);
}
.nav-link{
padding:1.5rem 0.7rem !important;
color:var(--color-dark);
}
.dropdown-toggle::after {
border: 0px !important;
}
.dropdown-hover:hover>.dropdown-menu {
display: inline-block;
}
.dropdown-hover>.dropdown-toggle:active {
pointer-events: none;
}
.submenu {
border: 0px !important;
background: var(--color-white) !important;
margin: 0 !important;
min-width: 15rem !important;
padding: 0 !important;
border-radius: 0px !important;
}
.submenu .dropdown-item {
display: block;
width: 100%;
padding: 7px 15px;
clear: both;
font-weight: 400;
text-align: inherit;
text-decoration: none;
white-space: nowrap;
background-color: transparent;
border: 0;
font-size: 14px;
}
.submenu .dropdown-item:hover {
background: var(--color-white) !important;
color: var(--color-primary) !important;
}
.mega-dropdown {
position: static !important;
}
.mega-menu {
width: 100%;
left: 0;
border: 0px !important;
margin: 0 !important;
padding: 25px 0px !important;
background: var(--color-white) !important;
border-radius: 0px !important;
border-top: 1px dashed var(--color-gray-200) !important;
}
.mega-menu .container {
display: block !important;
}
.mlist{
width: 100%;
position: relative;
}
.mlist .title{
font-weight: 600 !important;
font-size:15px;
}
.mlist ul{
margin: 0;
padding: 0;
list-style: none;
}
.mlist ul li{
display: flex;
align-items: center;
font-size:13px;
line-height:28px;
}
.mlist ul li a{
display:inline-block;
width:100%;
}
.mega-menu-imgbox{
width:100%;
position:relative;
text-align:center;
}
/*=============================================================*/
.section-gap-large {
padding: 80px 0px;
}
.section-gap-medium {
padding: 60px 0px;
}
.section-gap-small {
padding: 30px 0px;
}
.sectiontop-gap-large {
padding-top: 80px;
}
.sectiontop-gap-medium {
padding-top: 60px;
}
.sectiontop-gap-small {
padding-top: 30px;
}
.sectionbottom-gap-large {
padding-bottom: 80px;
}
.sectionbottom-gap-medium {
padding-bottom: 60px;
}
.sectionbottom-gap-small {
padding-bottom: 30px;
}
.section-mdgap-small{
padding:15px 0px;
}
/*=============================================================*/
main.wapper{
padding-bottom:80px;
}
/*=============================================================*/
.header{
width: 100%;
position: relative;
z-index:99;
background:var(--color-white);
box-shadow: 0 0 5px 0px rgba(0,0,0,.1);
}
.header.checkoutHeader{
box-shadow: 0 0 10px 1px rgba(0,0,0,.1);
}
.header .container,
.header .container-fluid,
.header .inner-wrap {
display:flex;
align-items:center
}
.header-center,
.header-left,
.header-right {
display:flex;
align-items:center
}
.header-right {
margin-left:auto
}
.header-left, .header-right {
flex:1
}
.header-top{
width: 100%;
position: relative;
background: var(--color-primary);
}
.header-middle {
height:70px;
display: flex;
align-items: center;
width: 100%;
position: relative;
}
.header.checkoutHeader .header-middle{
height:70px;
}
.headerLeftlist{
margin: 0;
padding: 0;
list-style: none;
gap: 15px;
display: flex;
align-items: center;
}
.headerLeftlist li a {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
position: relative;
}
.headerLeftlist li a i {
font-size: 33px;
}
.headerRightlist{
margin: 0;
padding: 0;
list-style: none;
gap: 20px;
display: flex;
align-items: center;
}
.headerRightlist li a {
align-items: center;
display: flex;
justify-content: center;
position: relative;
font-size: 12px;
}
.headerRightlist li a i {
font-size: 33px;
}
.csQty{
width: 18px;
height: 18px;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
background: var(--color-dark);
border-radius: 50%;
bottom: -3px;
left: 0px;
color: var(--color-white);
font-size: 11px;
}
.hText{
flex-direction: column;
}
.hText i{
font-size: 26px !important;
}
.hText .csQty{
top: -2px;
right: 0px;
left: auto;
}
.cart-total{
flex-direction: row !important;
gap: 10px;
}
.cart-total .cart-total-qty{
font-weight: 600;
}
.header-style-2 .navbar-nav{
margin-left: auto;
margin-right: auto;
}
.header-style-3 .logo{
margin-right:75px;
}
.header-style-3 .header-bottom{
border-top:1px solid var(--color-gray-100);
}
.header-style-3 .header-right{
flex: inherit;
}
.header-style-3 .navbar-nav{
width:100%;
justify-content:center;
}
.header-style-3 .nav-link{
padding:0.8rem !important
}
@media screen and (max-width: 991px) {
.header-style-3 .header-bottom{
border-top:0px solid var(--color-gray-100);
padding:0px 0px 10px;
}
}
.header-search {
position: relative;
flex: 1;
margin-right: 2rem;
max-width: 32.2rem;
}
.header-search input {
background-color: var(--color-gray-100);
border: 1px solid var(--color-gray-200);
border-radius:10px;
color: #333;
font-size: 14px;
height: 50px;
padding: 10px 15px 10px 15px;
width: 100%;
}
.header-search .btn-search {
position: absolute;
background: transparent;
color: var(--color-primary);
min-width: 48px;
height: 100%;
border-radius: 5px;
right: 0;
font-size: 22px;
}
.header-search .header-placeholder{
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
transition: all .3s ease;
pointer-events: none;
padding-left:15px;
overflow: hidden;
width: 100%;
color:var(--color-gray-500);
}
.header-placeholder .header-placeholder-text{
display: inline-block;
}
.header-placeholder .header-placeholder-animated{
display: inline-block;
}
@keyframes slideUpplaceholder {
0%, 20% { transform: translateY(30px); opacity: 0; }
20%, 40% { transform: translateY(0); opacity: 1; }
60%, 80% { transform: translateY(-30px); opacity: 0; }
}
.placeholder-text {
position: absolute;
top: 0;
opacity: 0;
animation: slideUpplaceholder 3.36s linear infinite;
}
.placeholder-text:nth-child(2) {
animation-delay: 1.12s; 
}
.placeholder-text:nth-child(3) {
animation-delay: 2.24s;
}

@media screen and (max-width: 991px) {
.header-style-3 .header-search{
max-width: 100%;
width:100%;
margin:0px;
}
}
.header-top-slider{
width:100%;
position:relative;
height: 35px;
overflow: hidden;
color:var(--color-white);
line-height: 35px;
}
.header-top-slider .swiper-wrapper{
height: 35px;
}
@media only screen and (max-width:968px) {
.header-middle{
height:59px;
}
.headerRightlist{
gap:10px;
}
.headerRightlist li a i{
font-size:27px;
}
.csQty{
width:14px;
height:14px;
}
}
.menu-toggle{
min-width: 26px;
display: -ms-flexbox;
display: flex;
padding: 0;
-ms-flex-align: center;
align-items: center;
height: 30px;
margin-right:15px;
}
.menu-toggle [class*="icon"] {
font-size: 22px;
}
.popular-choices{
position: absolute;
left: 0px;
top: 100%;
width: 100%;
background: rgb(255, 255, 255);
z-index: 9;
padding:15px;
}
.popular-choices ul{
margin:0;
padding:0;
list-style:none;
display:flex;
align-items:center;
flex-wrap:wrap;
gap:10px;
}
.popular-choices ul li{
display:inline-block;
position:relative;
}
.popular-choices ul li a{
display:flex;
justify-content:center;
align-items:center;
gap:5px;
color:var(--color-white);
background:var(--color-primary);
padding:5px 10px;
border-radius:50px;
font-size:12px;
}
.popular-choices ul li a i{
font-size:14px;
}
/*=============================================================*/
.header-title{
display:flex;
align-items:center;
gap:15px;
}
.header-title .header-title-text{
flex:1;
}
.header-title .title{
font-size:16px;
margin-bottom:0px;
}
.header-title .back-arrow{
font-size:24px;
}
/*=============================================================*/
.search-container-open{
position: absolute;
transition: transform .2s;
transform: translateY(20px);
opacity: 0;
width: 100%;
left: 0;
padding: 10px 0px;
top:70px;
box-shadow: 0 30px 35px rgba(0, 0, 0, .07);
background: var(--color-white);
z-index: 9;
}
.search-container .search {
position: relative;
width: 100%;
max-width: 800px;
margin-right: auto;
margin-left: auto;
padding: 0 50px 0 0;
}
.search-container .search-input[type] {
font-size: 18px;
font-weight: normal;
line-height: 50px;
display: inline-block;
width: 100%;
margin: 0;
padding: 0 50px 0 0;
transition: .2s;
vertical-align: top;
color: #7e7e7e;
border: 0;
border-bottom-width: 0px;
border-bottom-style: none;
border-bottom-color: currentcolor;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #e8e8e8;
background-color: transparent;
}
.search-container .search-close {
position: absolute;
top: 0;
right: 0;
}
.search-container .search-close i{
font-size: 45px;
}
.is-hovered .search-container-open{
transform: translate3d(0, 0, 0);
pointer-events: all;
opacity: 1;
}
@media only screen and (max-width:968px) {
.search-container .search{
padding: 0 35px 0 0;
}
.search-container-open{
top:65px;
}
.search-container .search-input[type]{
font-size:14px;
line-height: 35px;
}
.search-container .search-close i {
font-size: 28px;
}
.search-container .search-close {
top: 5px;
}
}
/*=============================================================*/
.footer{
width:100%;
position:relative;
}
.footer.footer-dark{
color:var(--color-white);
}
.footer .footer-top{
width:100%;
position:relative;
}
.footerIocnBox {
align-items: center;
display: flex;
padding: 25px 0;
position: relative;
width: 100%;
}
.footerIocnBox.center{
flex-direction:column;
text-align:center;
}
.footerIocnBox.center .ficon{
margin-right:0px;
margin-bottom:10px;
}
.footerIocnBox .ficon {
height: 60px;
margin-right: 15px;
position: relative;
width: 60px;
overflow:hidden;
}
.footerIocnBox .ficon img {
height: 100%;
width: 100%;
}
.footerIocnBox .ftext {
flex: 1 1;
}
.footer .footer-middle{
width:100%;
position:relative;
padding:60px 0px;
}
.footer-bottom{
width:100%;
position:relative;
padding:30px 0px;
}
.footer-logo{
display:block;
}
.paymet-icon {
text-align: right;
}
.footer-social {
width: 100%;
position: relative;
}
.footer-social ul {
margin: 0;
padding: 0;
list-style: none;
}
.footer-social ul li {
display: inline-block;
margin: 0px 10px 0px 0px;
position: relative;
}
.footer-social ul li a {
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
border: 1px solid #ddd;
border-radius: 5px;
-webkit-transition: border-top-left-radius .1s linear 0s, border-top-right-radius .1s linear .1s, border-bottom-right-radius .1s linear .2s, border-bottom-left-radius .1s linear .3s;
-o-transition: border-top-left-radius .1s linear 0s, border-top-right-radius .1s linear .1s, border-bottom-right-radius .1s linear .2s, border-bottom-left-radius .1s linear .3s;
transition: border-top-left-radius .1s linear 0s, border-top-right-radius .1s linear .1s, border-bottom-right-radius .1s linear .2s, border-bottom-left-radius .1s linear .3s
}
.footer-social ul li a i {
font-size: 16px;
}
.footer-social li:hover a {
background: var(--color-primary);
border-radius: 5px;
color:var(--color-white);
}
.footer-dark .footer-social ul li a{
color:var(--color-white);
}
.footer-dark .footer-social li:hover a {
background: var(--color-primary);
border-radius: 5px;
color:var(--color-white) !important;
}
.footer-title{
font-size:18px;
margin-bottom:20px;
}
.footer-list{
margin:0;
padding:0;
list-style:none;
}
.footer-list li{
display:inline-block;
width:100%;
position:relative;
line-height:28px;
}
.footer-dark .footer-list li a{
color:var(--color-white);
display:inline-block;
}
.collapsed-mobile .toggle-arrow{
display: none;
}
@media (max-width: 991px){
.footer .collapsed-mobile{
position: relative;
}
.collapsed-mobile{
position: relative;
overflow: hidden;
}
.collapsed-mobile .title{
cursor: pointer;
}
.collapsed-mobile .title h2{
margin: 0 0 10px 0;
padding: 0 0 10px;
}
.collapsed-mobile .collapsed-content{
position: absolute;
top: -10000px;
visibility: hidden;
width: 100%;
padding: 0 0 20px;
transition: opacity .3s ease; 
opacity: 0;
}
.collapsed-mobile .toggle-arrow{
position: absolute;
z-index: 100;
top: 0;
right: 0;
display: block;
width: 50px;
height: 50px;
cursor: pointer;
transition: all .2s ease;
}
.collapsed-mobile .toggle-arrow span:first-child{
position: absolute;
top: 50%;
left: 50%;
width: 14px;
height: 2px;
margin-top: -1px;
margin-left: -7px;
transition: .2s;
transform: rotate(-90deg); 
opacity: 1;
background-color: #282828;
}
.collapsed-mobile .toggle-arrow span:last-child{
position: absolute;
top: 50%;
left: 50%;
width: 2px;
height: 14px;
margin-top: -7px;
margin-left: -1px;
transition: .35s ease-in-out;
transform: rotate(-90deg); 
background-color: #282828;
}
.collapsed-mobile.open .collapsed-content{
position: relative;
top: 0;
visibility: visible;
opacity: 1;
}
.collapsed-mobile.open .toggle-arrow span:first-child{
transition: .35s ease-in-out;
transform: rotate(90deg); 
opacity: 0;
}
.collapsed-mobile.open .toggle-arrow span:last-child{
transform: rotate(90deg);
}
.footer-block ul:not[class] li a{
width: 100%;
}
.footer .container > .row > [class*='col-']:last-child .footer-block.collapsed-mobile:only-child{
margin-bottom: 0;
border-bottom: 0;
}
.footer .collapsed-mobile .collapsed-content{
margin-bottom: 0;
}
.footer .collapsed-mobile .toggle-arrow{
right: -5px;
padding-top: 0;
}
}
/*=============================================================*/
/*=============================================================*/
.product{
width:100%;
height:100%;
position:relative;
overflow:hidden;
transition: 0.3s;
}
.product .product-media{
display: block;
overflow: hidden;
position: relative;
border-radius:7px;
}
.product .product-media::before {
content: "";
display: block;
padding-top: 115%;
}
.product .product-media .product-media-item {
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
background:var(--color-gray-100);
}
.product .product-media .product-media-item img{
width: 100%;
height: 100%;
margin: 0 auto;
object-fit: contain;
transition:all 0.5s;
mix-blend-mode: darken;
}
.product-media-item img:last-child {
position:absolute;
opacity:0;
left:0;
right:0;
top:0;
left:0;
object-fit:cover;
}
.product-media .product-media-item img:first-child {
position:relative;
opacity:1
}
.product-media:hover .product-media-item img:first-child {
opacity:0
}
.product-media:hover .product-media-item img:last-child {
opacity:1
}
.product-label{
position: absolute;
top: 10px;
left: 10px;
display: flex;
flex-direction: column;
gap:5px;
}
.product-label [class*="label-"] {
font-size: 10px;
font-weight: 600;
line-height: 106%;
display: flex;
flex-direction: column;
width: fit-content;
min-width: 44px;
padding: 5px 9px;
text-transform: uppercase;
flex-wrap: wrap;
text-align: center;
border-radius: 5px;
}
.product-label .label-new {
color: #fff;
background-color:var(--color-primary);
}
.product-label .label-sale {
color: #fff;
background-color:var(--color-secondary);
}
.product-action-vertical {
position: absolute;
top: 10px;
right: 10px;
transition: opacity 0.3s,visibility 0.3s;
opacity: 0;
visibility: hidden;
}
.product:hover .product-action,
.product:hover .product-action-vertical {
visibility:visible;
opacity:1
}
.btn-product-icon {
display: flex;
align-items: center;
justify-content: center;
width: 34px;
height: 34px;
border: 1px solid #e1e1e1;
border-radius: 50%;
background-color: #fff;
color: #999;
font-size:18px;
transition: border-color 0.3s,color 0.3s,background-color 0.3s;
box-shadow: 0 4px 4px rgba(0, 0, 0, .05);
}
.btn-product-icon i{
margin-top: 0.15rem;
margin-left: -1px;
}
.btn-wishlist i {
margin-top:2px;
}
.product-action {
position: absolute;
left: 0;
right: 0;
bottom: 0;
display: flex;
align-items: center;
justify-content:center;
background-color: transparent;
z-index: 10;
transition: opacity 0.3s,visibility 0.3s;
opacity: 0;
}
.btn-product {
display: flex;
align-items: center;
justify-content: center;
flex: 1;
padding:12px 0px;
background-color: var(--color-primary);
color: #fff;
font-size: 12px;
line-height: 1.2;
letter-spacing: -0.025em;
text-transform: uppercase;
transition: opacity 0.3s;
}
.btn-quickview {
opacity: 0.8;
transition: opacity 0.3s;
}
.product:hover .product-action .btn-product{
color:#fff !important;
}
.product-details {
position: relative;
padding-top: 10px;
}
.product-details .product-name{
font-size:14px;
line-height:22px;
height:45px;
}
.product-details .product-name a{
display:inline-block;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.product .product-footer {
align-items: center;
display: flex;
justify-content: space-between;
margin-top: .7rem;
}
.product-price {
color: #222;
display: flex;
flex-direction: column;
font-size: 14px;
font-weight: 600;
line-height: 18px;
}
.product-price .new-price {
text-decoration: none;
}
.product-price .old-price {
color: #aaa;
font-size: 12px;
font-weight: 500 !important;
}
.qtyadd{
border: 1px solid rgb(49, 134, 22);
color: rgb(49, 134, 22);
height: 35px;
width: 75px;
background-color: rgb(247, 255, 249);
border-radius: 0.375rem;
display: flex;
justify-content: center;
align-items: center;
font-weight: 600;
cursor: pointer;
font-size: 0.83rem;
}
.qtyadd.qtyaddBig{
height: 45px;
width: 105px;  
font-size: 1rem;
}
.qtyadd-increse{
justify-content: space-between;
background: rgb(49, 134, 22);
color: #fff;
}
.qtyadd-increse span{
display: flex;
align-items: center;
justify-content: center;
width: 25px;
cursor: pointer;
}
.qtyadd-increse span i{
margin-top: 1px;
}
.qtyadd-increse span.number{
margin-top: -1px;
}
.qtyaddBig  span {
display: flex;
align-items: center;
justify-content: center;
width: 35px;
cursor: pointer;
}
@media (max-width: 991px){
.product .product-media::before {
content: "";
display: block;
padding-top: 100%;
}
.product-action-vertical{
opacity:1;
visibility: visible;
top: 5px;
right: 5px;
}
.btn-product-icon {
border: 0px solid #e1e1e1;
background-color: rgba(255,255,255,0.5);
}
.btn-product-icon{
box-shadow:none;
width:20px;
height:20px;
font-size: 12px;
}
.btn-product-icon i {
margin-top: 0.05rem;
margin-left: 0px;
}
.product-action{
display:none;
}
.product-label{
position: absolute;
top: 0;
left: 0;
display: flex;
flex-direction: column;
gap:3px;
}
.product-label [class*="label-"] {
font-size: 8px;
font-weight: 600;
line-height: 106%;
display: flex;
flex-direction: column;
width: fit-content;
min-width: 30px;
padding: 4px 5px 4px;
text-transform: uppercase;
flex-wrap: wrap;
text-align: center;
border-radius: 5px 0px;
}
.product-details .product-name {
font-size: 13px;
line-height:20px;
margin-bottom:5px;
font-weight:700;
}
.product-price{
font-size: 13px;
gap: 0;
line-height: 18px;
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
}
.product-price .old-price {
color: #aaa;
font-size: 12px;
font-weight: 500;
}
}
.single-product .product-details{
width:100%;
position:relative;
margin:0;
padding:0px;
}
.single-product .product-details .breadcrumb{
margin-bottom:10px;
}
.single-product .product-details .product-name{
font-size:24px;
line-height:34px;
}
.product-meta {
margin-bottom:10px;
color:#999;
font-size:12px;
}
.product-meta span {
margin:0 15px 0 0px
}
.single-product .product-price{
font-size:24px;
justify-content: flex-start;
font-weight:700;
margin-bottom:0px;
}
.list-lighlight{
margin:0;
padding:0;
list-style:none;
}
.list-lighlight li {
font-size: 14px;
line-height: 28px;
position: relative;
padding-left: 24px;
list-style: none;
}
.list-lighlight li::before {
font-family: remixicon!important;
font-size: 14px;
position: absolute;
top: 0;
left: 0;
content: '\eb7b';
color: #282828;
}
.product-divider{
border-top: 1px solid var(--color-gray-300);
}
.product-bottom{
width:100%;
position:relative;
display: flex;
align-items:center;
gap:10px;
}
.pqty{
align-content: center;
border: 1px solid var(--color-gray-200);
border-radius: 5px;
display: flex;
height: 60px;
justify-content: space-between;
width:120px;
font-size: 18px;
cursor:pointer;
}
.pqty span {
align-items: center;
display: flex;
height: 60px;
justify-content: center;
width: 100%;
}
.pqty .plus{
border-left:1px solid var(--color-gray-200);
border-right:1px solid var(--color-gray-200);
}
.btn-cart{
padding:10px 15px;
width:200px;
height:60px;
}
.btn-buy{
padding:10px 15px;
width:150px;
height:60px;
}
@media (max-width: 991px){
.btn-cart{
width:100%;
max-width: 100%;
}
.btn-buy{
width:100%;
max-width: 100%;
}
}
.btn-add-to-wishlist{
width:50px;
height:60px;
font-size:32px;
align-items: center;
display: flex;
justify-content:center;
}
.btn-add-to-wishlist:hover i {
transform: scaleX(-1);
transition: .2s;
}
.product-footer{
position:relative;
display:flex;
align-items:center;
gap:15px;
}
.product-footer .addwishlist{
display: flex;
align-items: center;
gap: 10px;
font-size: 15px;
}
.product-footer .addwishlist i{
font-size:20px;
}
.product-social-links {
display:flex;
align-items:center;
gap:10px;
border-right:1px solid var(--color-gray-200);
padding-right:15px;
line-height:20px;
}
.product-social-links i{
font-size:20px;
}
.sizeguide{
display:flex;
align-items:center;
gap:5px;
line-height:20px;
}
.sizeguide i{
font-size:20px
}

@media (max-width: 991px){
.single-product .product-details .product-name{
font-size:16px;
line-height:26px;
}
.single-product .product-price {
font-size: 18px;
justify-content: flex-start;
font-weight: 600;
margin-bottom: 0px;
gap: 10px;
}
.product-bottom{
width:100%;
position:fixed;
bottom:0;
left:0;
height:80px;
padding:0px 15px;
display: flex;
align-items:center;
gap:10px;
background:var(--color-white);
z-index:99;
border-top:1px solid var(--color-gray-100);
}
}
/*=============================================================*/
.product-tabs{
width:100%;
position:relative;
}
.product-tabs .accordion{
border:0px;
border-radius:0px;
}
.product-tabs .accordion-item{
border-radius:0px;
border:0px;
border-bottom:1px solid var(--color-gray-200);
background:var(--color-white);
}
.product-tabs .accordion-button{
border-radius:0px !important;
font-size:14px;
}
.accordion-button:focus{
box-shadow:none;
}
.accordion-button:not(.collapsed){
background:var(--color-white);
color:var(--color-dark);
}
/*=============================================================*/
.variation-block{
margin-top: 28px;
width:100%;
position:relative;
display: flex;
flex-wrap: wrap;
}
.variation-block .variation-option{
width:100%;
display: flex;
flex-direction: column;
gap:5px;
margin-bottom:10px;
}
.variation-option .option-label{
font-size: 14px;
font-weight: 600;
line-height: 22px;
width: 100%;
padding-right: 10px;
}
.variation-option-meta{
align-items: center;
display: flex;
gap: 10px;
}
.variation-option-meta .color{
width: 30px;
height: 30px;
border-radius: 50%;
transition:0.3s;
}
.variation-option-meta .color.active{
box-shadow: inset 0 0 0 2px #fff;
border: 1px solid var(--color-primary);
}
.variation-option-meta .color:hover{
box-shadow: inset 0 0 0 2px #fff;
border: 1px solid var(--color-primary);
}
.variation-option-meta .text{
width: 30px;
height: 30px;
border-radius: 2px;
transition:0.3s;
border: 1px solid var(--color-gray-300);
display: flex;
align-items: center;
justify-content: center;
}
.variation-option-meta .text.active{
box-shadow: inset 0 0 0 2px #fff;
border: 1px solid var(--color-primary);
}
.variation-option-meta .text:hover{
box-shadow: inset 0 0 0 2px #fff;
border: 1px solid var(--color-primary);
}
.variation-option-meta .swatch{
width: 55px;
height: 55px;
border-radius: 5px;
transition:0.3s;
border: 1px solid var(--color-gray-300);
display: flex;
align-items: center;
justify-content: center;
overflow:hidden;
}
.variation-option-meta .swatch img{
width: 100%;
height: 100%;
object-fit:cover;
}
.variation-option-meta .swatch.active{
box-shadow: inset 0 0 0 2px #fff;
border: 1px solid var(--color-primary);
}
.variation-option-meta .swatch:hover{
box-shadow: inset 0 0 0 2px #fff;
border: 1px solid var(--color-primary);
}
/*=============================================================*/
.ratings-container {
display:flex;
align-items:center;
line-height:1.1;
margin-bottom:1.2rem;
font-size:16px;
letter-spacing:-1px;
}
.ratings-full {
cursor:pointer
}
.ratings,
.ratings-full {
position:relative;
font-family:"riode"
}
.ratings-full+.rating-reviews {
margin-left:0.2rem
}
.ratings-full:before {
content:"\f18c" "\f18c" "\f18c" "\f18c" "\f18c";
color:rgba(0,0,0,0.16);
font-family:remixicon!important;
}
.ratings {
position:absolute;
top:0;
left:0;
white-space:nowrap;
overflow:hidden
}
.ratings:before {
content:"\f18c" "\f18c" "\f18c" "\f18c" "\f18c";
color:#ffa41c;
font-family:remixicon!important;
}
.rating-reviews {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size:12px;
color: #aaa;
text-transform: capitalize;
}
/*=============================================================*/
.avg-rating-container {
display:flex;
align-items:center;
margin-bottom:1rem
}
.avg-rating-container mark {
font-size: 5rem;
font-weight: 700;
line-height: 1;
color: var(--color-primary);
background: none;
padding:0;
margin-right:15px;
}
.avg-rating-title{
font-size:16px;
margin-bottom:10px;
}
.avg-rating-container .rating-reviews:hover {
color:#999
}
.ratings-item {
display:flex;
align-items:center;
padding:3px 0px;
}
.ratings-item .ratings-container {
margin-right:1rem;
}
.ratings-item .progress-value {
width: 60px;
text-align: left;
margin-left:10px;
}
.rating-percent {
background:#eee;
height:0.5rem;
width:20rem;
max-width:100%;
border-radius:1rem
}
.rating-percent span {
display:block;
height:100%;
border-radius:inherit;
background:#999
}
/*=============================================================*/
.comments-list{
margin:0;
padding:0;
list-style:none;
}
.comments-list li {
padding-bottom: 0rem;
margin-bottom: 1rem;
width: 100%;
position: relative;
border-bottom: 1px dotted var(--color-gray-300);
}
.comments-list li:last-child{
border-bottom:0px;
}
.comment {
position:relative;
display:flex;
align-items:flex-start
}
.comment-media {
max-width: 3rem;
flex: 0 0 3rem;
height: 3rem;
overflow: hidden;
}
.comment p:last-child {
margin-bottom:0
}
.comment-body {
position:relative;
flex:1 1 auto;
padding:0rem 0 0 1rem
}
.comment-rating, .card-reviews .comment-rating {
margin-bottom: 0.5rem;
}
.comment-user {
margin-bottom:1rem
}
.comment-user h4 {
margin-bottom:1rem;
font-weight:700;
line-height:1;
letter-spacing:0
}
.comment-user h4 a:focus,
.comment-user h4 a:hover {
color:#26c
}
.comment-user h4 span {
display:block
}
.comment-date {
display:block;
margin-bottom:0.5rem;
color:#999;
line-height:1
}
.comments .file-input-wrappers {
display:flex
}
.comments .file-input-wrappers>* {
width:6rem;
height:6rem;
margin-right:1rem;
cursor:zoom-in
}
.comments .file-input-wrappers img {
height:100%
}
@media only screen and (max-width:968px) {
.avg-rating-container mark{
font-size:3rem;
}
.comment-media {
max-width: 2.5rem;
flex: 0 0 2rem;
height: 2rem;
overflow: hidden;
}
.comment-body {
padding: 0rem 0 0 1rem;
}
.comment-rating{
margin-bottom: 0.3rem;
font-size: 13px;
}
.comment-date{
font-size:12px;
margin-bottom:0px;
}
.comment-user{
margin-bottom:0.5rem !important;
}
.comment-content{
font-size:12px;
}
.comment-content p{
font-size:12px;
}
}
/*=============================================================*/
.product-gallery{
display: flex;
flex-wrap: wrap;
gap:10px;
position: sticky;
}
.galerySwiper, .thumbSwiper{
flex-basis: 100%;
max-width: 100%;
}
.product-gallery .galerySwiper{
max-width: calc(100% - 119px);
}
.product-gallery .thumbSwiper {
order: -1;
max-width: 109px;
}

.product-gallery .product-image {
display: block;
overflow: hidden;
position: relative;
height: 100%;
display:flex;
align-items:center;
justify-content:center;
}
.product-gallery .product-image::before {
content: "";
display: block;
padding-top: 100%;
}
.product-gallery .product-image .product-image-item {
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
background: var(--color-gray-100);
}
.product-gallery .product-image .product-image-item img{
width:100%;
height:100%;
object-fit:contain;
transition: all 0.5s;
mix-blend-mode: darken;
}
.thumbSwiper .swiper-slide{
position:relative;
}
.thumbSwiper .swiper-slide::before{
content: "";
transition: border-color 0.3s;
border: 1px solid transparent;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 9;
}
.thumbSwiper .swiper-slide.swiper-slide-thumb-active::before{
border-color:var(--color-primary);
}
@media only screen and (max-width:968px) {
.product-gallery{
position:relative;
display: block;
}
}
/*=============================================================*/
.product-tabs .nav-tabs{
border-bottom: 1px solid var(--color-gray-100) !important;
border-top: 1px solid var(--color-gray-100) !important;
}
.product-tabs .nav-tabs .nav-link {
border: 0px !important;
margin: 0 !important;
font-size: 16px;
padding: 1rem 1rem !important;
}
.product-tabs .nav-tabs .nav-link.active{
color:var(--color-primary) !important;
}
/*=============================================================*/
.noreviews{
width:100%;
height:100%;
display:flex;
align-items:center;
justify-content:center;
padding:50px;
flex-direction:column;
text-align:center;
}
.noreviews .ratings-container{
font-size:24px;
}
/*=============================================================*/
.mfooter-bottom {
width: 100%;
position: fixed;
bottom: 0;
left: 0;
height: 70px;
padding: 0px 15px;
display: flex;
align-items: center;
gap: 10px;
background: var(--color-white);
z-index: 99;
border-top: 1px solid var(--color-gray-100);
}
/*=============================================================*/
.modal.left .modal-dialog,
.modal.right .modal-dialog {
position: fixed;
margin: auto;
width: 420px;
height: 100%;
-webkit-transform: translate3d(0%, 0, 0);
-ms-transform: translate3d(0%, 0, 0);
-o-transform: translate3d(0%, 0, 0);
transform: translate3d(0%, 0, 0);
}
.modal.left .modal-content,
.modal.right .modal-content {
height: 100%;
overflow-y: auto;
}
/*Left*/
.modal.left.fade .modal-dialog{
left: -320px;
-webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
-moz-transition: opacity 0.3s linear, left 0.3s ease-out;
-o-transition: opacity 0.3s linear, left 0.3s ease-out;
transition: opacity 0.3s linear, left 0.3s ease-out;
}
.modal.left.fade.show .modal-dialog{
left: 0;
}
/*Right*/
.modal.right.fade .modal-dialog {
right: -420px;
-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
-moz-transition: opacity 0.3s linear, right 0.3s ease-out;
-o-transition: opacity 0.3s linear, right 0.3s ease-out;
transition: opacity 0.3s linear, right 0.3s ease-out;
}
.modal.right.fade.show .modal-dialog {
right: 0;
}
/*=============================================================*/
.reviewModal.modal.left .modal-dialog,
.reviewModal.modal.right .modal-dialog {
position: fixed;
margin: auto;
width: 520px;
height: 100%;
-webkit-transform: translate3d(0%, 0, 0);
-ms-transform: translate3d(0%, 0, 0);
-o-transform: translate3d(0%, 0, 0);
transform: translate3d(0%, 0, 0);
}
.reviewModal.modal.left .modal-content,
.reviewModal.modal.right .modal-content {
height: 100%;
overflow-y: auto;
}
.reviewModal.modal.right.fade .modal-dialog {
right: -520px;
-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
-moz-transition: opacity 0.3s linear, right 0.3s ease-out;
-o-transition: opacity 0.3s linear, right 0.3s ease-out;
transition: opacity 0.3s linear, right 0.3s ease-out;
}
.reviewModal.modal.right.fade.show .modal-dialog {
right: 0;
}
.reviewModal .modal-content {
background: #fff;
background: var(--color-white);
border: 0;
border-radius: 0;
}
.reviewModal .reviewModalHeader{
display:flex;
align-items:flex-start;
justify-content:space-between;
padding:15px 25px;
}
.reviewModalHeader .reviewModaltext{
padding-right:20px;
}
.reviewModal .reviewModalBody{
padding:0px 25px 25px 25px;
}
.reviewModal-close{
background:transparent;
border:0px;
padding:0px;
font-size:24px;
flex:1;
}
.review-form {
width: 100%;
position: relative;
}
.review-form label {
width: 100%;
position: relative;
margin-bottom: 0.5rem;
display: inline-block;
}
.review-form textarea {
width: 100%;
border: 1px solid #ddd;
background: var(--color-white);
height: 150px;
border-radius: 5px;
}
.vi-box-section {
display: flex;
flex-wrap: wrap;
}
.vi-box {
position: relative;
width: 20.5%;
margin-bottom: 10px;
text-align: center;
margin-right: 10px;
}
.vi-box .vi-box-inner {
background: #fff;
border: 1px solid #ddd;
border-radius: 5px;
height: 70px;
margin-bottom: 3px;
overflow: hidden;
position: relative;
width: 100%;
}
.vi-box img {
border-radius: 5px;
height: 70px;
object-fit: cover;
width: 100%;
}
.vi-box .remove {
position: absolute;
top: 5px;
right: 5px;
color: #fff;
background: #ef4b46;
border-radius: 50%;
width: 16px;
height: 16px;
display: flex;
align-items: center;
justify-content: center;
font-size: 11px;
}
.vi-box .remove i {
margin-top:2px;
margin-left:1px;
}
@media (max-width: 991px){
.reviewModal.modal.left .modal-dialog,
.reviewModal.modal.right .modal-dialog {
width: 100%;
}
.reviewModal .reviewModalHeader{
padding:15px;
}
.reviewModal .reviewModalBody {
padding: 0px 15px 15px 15px;
}
}
/*=============================================================*/
.sideModal.modal.left .modal-dialog,
.sideModal.modal.right .modal-dialog {
position: fixed;
margin: auto;
width: 320px;
height: 100%;
-webkit-transform: translate3d(0%, 0, 0);
-ms-transform: translate3d(0%, 0, 0);
-o-transform: translate3d(0%, 0, 0);
transform: translate3d(0%, 0, 0);
}
.sideModal.modal.left .modal-content,
.sideModal.modal.right .modal-content {
height: 100%;
overflow-y: auto;
}
/*Left*/
.sideModal.modal.left.fade .modal-dialog{
left: -320px;
-webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
-moz-transition: opacity 0.3s linear, left 0.3s ease-out;
-o-transition: opacity 0.3s linear, left 0.3s ease-out;
transition: opacity 0.3s linear, left 0.3s ease-out;
}
.sideModal.modal.left.fade.show .modal-dialog{
left: 0;
}
.sideModal .modal-content {
background: #fff;
background: var(--color-white);
border: 0;
border-radius: 0;
}
.sideModalHeader{
width:100%;
position:relative;
display:flex;
align-items:center;
padding:10px 15px; 
border-bottom:1px solid var(--color-gray-100);
margin-bottom:10px;
}
.sideModalLogo img{
width:75px;
height:auto;
}
.sideMenu{
width:100%;
position:relative;
}
.sideMenu ul{
margin:0;
padding:0;
list-style:none;
}
.sideMenu ul li{
display:inline-block;
width:100%;
position:relative;
}
.sideMenu ul li .sideMenu-items{
display:flex;
align-items:center;
justify-content:space-between;
height:35px;
padding:0px 15px;
}
.toggle-arrow{
font-size:18px;
}
.sideMenu ul li ul{
margin:0;
padding:0px 0px 0px 15px;
list-style:none;
}
.sideMenu ul li ul li .sideMenu-items{
font-size:12px;
}
.sideMenu ul li ul li .toggle-arrow{
font-size:16px;
}
/*=============================================================*/
.cartModal.modal.left .modal-dialog,
.cartModal.modal.right .modal-dialog {
position: fixed;
margin: auto;
width: 420px;
height: 100%;
-webkit-transform: translate3d(0%, 0, 0);
-ms-transform: translate3d(0%, 0, 0);
-o-transform: translate3d(0%, 0, 0);
transform: translate3d(0%, 0, 0);
}
.cartModal.modal.left .modal-content,
.cartModal.modal.right .modal-content {
height: 100%;
overflow-y: auto;
}
.cartModal.modal.right.fade .modal-dialog {
right: -420px;
-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
-moz-transition: opacity 0.3s linear, right 0.3s ease-out;
-o-transition: opacity 0.3s linear, right 0.3s ease-out;
transition: opacity 0.3s linear, right 0.3s ease-out;
}
.cartModal.modal.right.fade.show .modal-dialog {
right: 0;
}
@media (max-width: 991px){
.cartModal.modal.left .modal-dialog,
.cartModal.modal.right .modal-dialog {
position: fixed;
margin: auto;
width: 350px;
height: 100%;
-webkit-transform: translate3d(0%, 0, 0);
-ms-transform: translate3d(0%, 0, 0);
-o-transform: translate3d(0%, 0, 0);
transform: translate3d(0%, 0, 0);
}
.cartModal.modal.left .modal-content,
.cartModal.modal.right .modal-content {
height: 100%;
overflow-y: auto;
}
.cartModal.modal.right.fade .modal-dialog {
right: -350px;
-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
-moz-transition: opacity 0.3s linear, right 0.3s ease-out;
-o-transition: opacity 0.3s linear, right 0.3s ease-out;
transition: opacity 0.3s linear, right 0.3s ease-out;
}
.cartModal.modal.right.fade.show .modal-dialog {
right: 0;
}	
}
/*=============================================================*/
.cartModal .modal-content {
background: #fff;
background: var(--color-white);
border: 0;
border-radius: 0;
}
.cartModal .modal-header{
padding:15px 15px;
border-bottom:1px dotted var(--color-gray-200);
}
.cartModal .modal-title{
font-size:18px;
}
.cartModal .modal-footer{
border:0px !important;	
justify-content:center;
padding: 15px 15px;
}
.cartModal .modal-footer>div{
margin:0;
width:100%;
}
.cartbox-action-btn{
border-bottom: 2px solid var(--color-primary);
display: inline-block;
margin-bottom: 20px;
}
.cartbox-total{
display:flex;
align-items:center;
justify-content:space-between;
padding:10px 0px;
font-weight:600;
border-bottom:1px solid var(--color-gray-200);
border-top:1px solid var(--color-gray-200);
font-size:16px;
}
.total-price{
font-size:18px;
}
/*=============================================================*/
.cartProduct{
padding:10px 0px;
width:100%;
position:relative;
border-bottom: 1px dotted var(--color-gray-200);
}
.cartProduct:last-child{
border-bottom:0px;
}
.cartProduct .cartProductMedia{
width:75px;
height:75px;
overflow:hidden;
border-radius:5px;
position:relative;
}
.cartProductMedia img{
width:100%;
height:100%;
object-fit:cover;
}
.cartProduct .cartProductDetails{
flex:1;
}
.cartProduct .title{
font-size:14px;
margin-right:25px;
display:inline-block;
line-height:22px;
}
.cartProduct .title a{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.cartProductRemove{
position: absolute;
top: 5px;
right: 0;
font-size: 18px;
}
.cartProduct-footer{
display:flex;
align-items:center;
justify-content:space-between;
margin-top:10px;
}
.cartProduct-price {
display: flex;
flex-wrap: wrap;
font-size: 14px;
font-weight: 600;
line-height: 16px;
flex-direction: column;
}
.cartProduct-price .new-price {
text-decoration: none;
}
.cartProduct-price .old-price {
color: #aaa;
font-weight:500 !important;
font-size:12px;
}
.cartProductqty {
align-content:center;
border:1px solid var(--color-gray-200);
border-radius:5px;
display:flex;
height:30px;
justify-content:space-between;
width:70px;
font-size:14px;
}
.cartProductqty span {
align-items:center;
display:flex;
height:30px;
justify-content:center;
width:100%;
}
/*=============================================================*/
.quickViewModal .modal-dialog{
max-width:1000px;
}
.quickViewModal .modal-content{
overflow:hidden;
border:0px;
}
.quickViewModal .quickViewModalContent{
width:100%;
position:relative;
overflow:hidden;
}
.quickViewModal .modal-close{
position:absolute;
top:5px;
right:10px;
z-index:999;
border:0px;
background:transparent;
font-size:28px;
}
.quickViewModal .product-details{
padding:35px;
}
.quickViewModal .product-details .product-name {
font-size:18px;
line-height:28px;
}
/*=============================================================*/
.couponsModal .couponsModal-header{
padding:20px;
border-bottom:1px dotted var(--color-gray-200);
display:flex;
align-items:center;
justify-content:space-between;
}
.couponsModal-close{
background: transparent;
border: 0px;
font-size: 24px;
padding: 0;
}
.couponsModal .couponModal-search {
width: 100%;
position: relative;
padding:20px;
background:var(--color-gray-100);
}
.couponModal-search input {
width: 100%;
height: 50px;
border: 1px solid #ddd;
border-radius: 5px;
padding: 0px 15px;
}
.couponsModal .couponModal-search button {
position: absolute;
top: 20px;
right: 20px;
height: 50px;
border: 0px;
width: 75px;
background:transparent;
color:var(--color-primary);
}
.apply-coupons-list {
width: 100%;
position: relative;
}
.apply-coupons-list ul {
margin: 0;
padding: 0;
list-style: none;
}
.apply-coupons-list ul li {
display: inline-block;
width: 100%;
position: relative;
border-bottom:1px dotted var(--color-gray-200);
}
.apply-coupons-list ul li .aclbox {
padding:20px;
border-radius: 5px;
position: relative;
width: 100%;
}
.apply-coupons-list ul li .aclbox .aclbox-coupon {
border: 1px dashed var(--color-primary) !important;
display: inline-block;
padding: 3px 10px;
border-radius: 5px;
margin-bottom: 10px;
font-weight: 600;
}
.apply-coupons-list ul li .aclbox .aclbox-apply {
position: absolute;
top: 20px;
right: 20px;
color: var(--color-dark);
cursor: pointer;
}

/*=============================================================*/
.heroSlider{
position:relative;
width:100%;
}
.heroSlider-slide{
position:relative;
width:100%;
height:100%;
overflow:hidden;
}
.heroSlider-slide img{
width:100%;
height:100%;
object-fit:cover;
}
.heroSlider .slick-arrow{
position: absolute;
top: 50%;
right: 0;
left: 0;
height: 48px;
margin-top: -24px;
}
.heroSlider .slick-prev{
left:15px;
}
.heroSlider .slick-next{
right:15px;
left:auto;
}
.heroSlider .slick-prev, .heroSlider .slick-next{
font-size: 0;
line-height: 0;
position: absolute;
z-index: 1;
top: 50%;
display: block;
width: 27px;
height: 27px;
padding: 0;
cursor: pointer;
transition: opacity .2s;
transform: translate(0, -50%);
color: transparent;
border: 0;
outline: none;
background: transparent;
}
.heroSlider .slick-prev::before, .heroSlider .slick-next::before {
font-size: 20px;
position: absolute;
top: 0;
display: -ms-flexbox;
display: flex;
width: 48px;
height: 48px;
transition: .2s;
opacity: 1;
color: #282828;
border-radius: 50%;
background-color: rgba(255, 255, 255, .55);
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: center;
justify-content: center;
}
.heroSlider .slick-prev::before, .heroSlider .slick-next::before {
font-family: 'icon-foxic';
font-size: 27px;
line-height: 1;
transition: .2s;
opacity: 1;
color: #2d2c2c;
}
.heroSlider .slick-prev::before {
left: 0;
padding-right: 2px;
content: '\e907';
}
.heroSlider .slick-next::before {
right: 0;
content: '\e919';
}
.heroSlider .slick-prev:hover:before,
.heroSlider .slick-prev:hover:not(.slick-disabled):before,
.heroSlider .slick-next:hover:before,
.heroSlider .slick-next:hover:not(.slick-disabled):before
{
color:var(--color-white);
background-color:var(--color-primary);
}
.heroSlider .slick-dots{
position: absolute;
bottom: 10px;
display: block;
left: 50%;
width: auto;
margin: 0;
padding: 0;
list-style: none;
text-align: center;
transform: translateX(-50%);
border-radius: 13px;
background-color: rgba(255, 255, 255, .55);
}
.heroSlider .slick-dots li{
position: relative;
display: inline-block;
box-sizing: content-box;
width: 27px;
height: 27px;
margin: 0;
padding: 0;
vertical-align: top;
padding: 0;
cursor: pointer;
pointer-events: all;
}
.heroSlider .slick-dots li:not(.slick-active) button{
margin: 11px auto;
background-color: #282828;
}

.heroSlider .slick-dots li button {
font-size: 0;
line-height: 0;
display: block;
width: 5px;
height: 5px;
margin: 5px;
padding: 0;
cursor: pointer;
transition: .15s;
color: transparent;
border: 0;
border-top-width: 0px;
border-top-style: none;
border-top-color: currentcolor;
border-right-width: 0px;
border-right-style: none;
border-right-color: currentcolor;
border-bottom-width: 0px;
border-bottom-style: none;
border-bottom-color: currentcolor;
border-left-width: 0px;
border-left-style: none;
border-left-color: currentcolor;
border-radius: 50%;
outline: none;
background-color: #bfbfbf;
}
.heroSlider .slick-dots li.slick-active button {
width: 15px;
height: 15px;
margin: 0;
border-width: 2px;
border-style: solid;
border-color: #17c6aa;
background-color: transparent;
}
.heroSlider .slick-dots li.slick-active button{
margin: 6px auto;
}
.heroSlider .swiper-button-next, .heroSlider .swiper-button-prev{
color:var(--color-gray-300)!important;
}
.heroSlider .swiper-button-next:hover, .heroSlider .swiper-button-prev:hover{
color:var(--color-primary) !important;
}
/*=============================================================*/
.cartSection{
position: relative;
z-index: 0;
height:100%;
}
.cartSection:after, .cartSection:before {
position: fixed;
top: 0;
bottom: 0;
left: 0;
background: #ffffff;
content: '';
z-index: 0
}
.cartSection:before { right:auto;}
.cartSection:after {
left: auto;
right: 0;
width: 42.5%;
background: #f4f4f4;
}
.cartSection .container{
position:relative;
z-index:22;
}
.cartSection .cartSectionRight{
padding:25px 0px 25px 25px;
width:100%;
position:relative;
}
.cartSection .cartSectionLeft{
padding:25px 25px 25px 0px;
width:100%;
position:relative;
}
.cartSectionCoupon{
display: flex;
align-items: center;
gap: 10px;
}
.cartSectionCoupon input{
width: 100%;
position: relative;
height: 55px;
border-radius: 5px;
border: 1px solid var(--color-gray-200);
padding: 0px 15px;
}
.cartSectionCoupon button{
height: 55px;
width: 100px;
background: var(--color-primary);
border: 1px solid var(--color-primary);
border-radius: 5px;
color:var(--color-white);
}
.cartSectionPrice{
margin: 0;
padding: 0;
list-style: none;
}
.cartSectionPrice li{
display: flex;
align-items: center;
justify-content: space-between;
height: 30px;
}
.cartSectionPrice li.bigrow{
font-size: 16px;
font-weight: 600;
}
.checkoutProduct{
width: 100%;
position: relative;
display: flex;
margin-bottom: 15px;
gap: 15px;
}
.checkoutProduct .checkoutProductMedia{
display: block;
position: relative;
border-radius: 7px;
width: 75px;
height: 75px;
}
.checkoutProduct .checkoutProductMedia::before {
content: "";
display: block;
padding-top: 115%;
}
.checkoutProduct .checkoutProductMedia .checkoutProductMedia-item {
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
background: var(--color-gray-100);
border-radius: 7px;
}
.checkoutProduct .checkoutProductMedia img{
width: 100%;
height: 100%;
margin: 0 auto;
object-fit: cover;
transition: all 0.5s;
mix-blend-mode: darken;
border-radius: 7px;
}
.checkoutProductContent{
position: relative;
flex: 1;
padding-right: 30px;
}
.checkoutProductContent .title{
font-size: 14px;
margin-bottom: 5px;
line-height: 22px;
margin-top: -5px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.checkoutProduct .price {
display: flex;
align-items: end;
font-weight: 600;
font-size: 16px;
flex-direction: column;
text-align: right;
}
.checkoutProduct .price .new-price {
text-decoration: none;
}
.checkoutProduct .price .old-price {
color: #aaa;
font-size: 12px;
}
.chqty{
position:absolute;
top:-10px;
right:-10px;
width:20px;
height:20px;
background:rgba(255,255,255,0.9);
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
border:1px solid var(--color-gray-200)
}
.cartSectionTitle{
display: flex;
align-items: center;
justify-content: space-between;
}
/*=============================================================*/
.categorySlideBox{
width:100%;
height:100%;
position:relative;
}
.category{
position:relative;
width:100%;
overflow: hidden;
}
.category.cat-style-1{
transition: all 0.5s;
}
.cat-style-1 .category-media{
position: relative;
overflow: hidden;
border-radius: 20px;
}
.category .category-media img{
width: 100%;
height: 100%;
object-fit:cover;
}
.cat-style-1 .category-media img {
-webkit-transition: all 0.5s;
-ms-transition: all 0.5s;
transition: all 0.5s;
}
.cat-style-1:hover .category-media img {
transform: scale(1.2); 
}
.cat-style-1 .category-content {
-webkit-transition: all 0.5s;
-ms-transition: all 0.5s;
transition: all 0.5s;
padding: 13px 20px 10px 20px;
position: absolute;
bottom:0;
left: 0;
width: 85%;
border-radius: 0 20px;
z-index: 1;
background: rgba(255,255,255,0.7);
}
.cat-style-1 .title{
font-size:14px;
margin:0;
}
.cat-style-1 .title a{
display:block;
}
.cat-style-2 .category-media{
position: relative;
overflow: hidden;
border-radius: 50%;
}
.cat-style-2 .category-media img {
transition: transform 0.3s;
}
.cat-style-2:hover .category-media img {
transform: scale(0.9);
}
.cat-style-2 .category-content {
padding:10px;
width:100%;
position:relative;
text-align:center;
}
.cat-style-2 .title{
font-size:16px;
margin:0;
}
.cat-style-2 .title a{
display:block;
}
.category.cat-style-3{
transition: all 0.5s;
position:relative;
}
.category.cat-style-3 a{
color:var(--color-white);
}
.cat-style-3 .category-media{
position: relative;
overflow: hidden;
border-radius:5px;
}
.cat-style-3 .category-media img{
transition: transform 0.4s cubic-bezier(0.83, 0.26, 0.19, 0.87), -webkit-transform 0.4s cubic-bezier(0.83, 0.26, 0.19, 0.87);
height: auto;
max-width: 100%;
border: none;
border-radius: 0;
box-shadow: none;
}
.cat-style-3 .category-content{
position: absolute;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
width: 100%;
height: 100%;
top: 0;
left: 0;
padding: .9375rem;
z-index: 1
}
.cat-style-3 .title{
font-size:18px;
margin:0;
}
.cat-style-3 .title a{
display:block;
}
.cat-style-3 .category-content .button-text {
font-size: 12px;
font-weight: 600;
text-transform: uppercase;
padding:10px 0px 0px;
border-bottom: 1px solid;
}
.catSlider{
position:relative;
}
.catSlider .slick-dots {
position: absolute;
bottom: -25px;
display: block;
width: 100%;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
}
.catSlider .slick-dots li{
position: relative;
display: inline-block;
width: 20px;
height: 20px;
margin: 0 5px;
padding: 0;
cursor: pointer;
}
.catSlider .slick-dots li button{
font-size: 0;
line-height: 0;
display: block;
width: 20px;
height: 20px;
padding: 5px;
cursor: pointer;
color: transparent;
border: 0;
outline: none;
background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus{
outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before{
opacity: 1;
}
.slick-dots li button:before{
font-family: 'slick';
font-size: 42px;
line-height: 20px;
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 20px;
content: '•';
text-align: center;
opacity: .25;
color: var(--color-primary);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before{
opacity: .75;
color: var(--color-primary);
}
@media (max-width: 991px){
.cat-style-2 .title {
font-size: 12px;
margin: 0;
}
.cat-style-2 .category-content{
padding: 5px 0px 0px 0px;
}
}
/*=============================================================*/
.loginModal .modal-dialog{
max-width:700px;
}
.loginModal .modal-close{
position:absolute;
top:10px;
right:15px;
background:transparent;
border:0;
z-index: 9;
}
.loginModal .modal-img{
border-radius:0.5rem 0 0 0.5rem;
overflow:hidden;
width:100%;
height:100%;
}
.loginModalContent{
padding:50px;
width:100%;
position:relative;
}
@media only screen and (max-width:968px) {
.loginModalContent{
padding:25px;
width:100%;
position:relative;
}	
}
/*=============================================================*/
.form-group{
width:100%;
position:relative;
}
.form-group label{
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:0.5rem;
}
.form-group input{
width:100%;
height:55px;
border-radius:7px;
border:1px solid var(--color-gray-200);
background:var(--color-white);
padding:15px;
}
.form-group select{
width:100%;
height:50px;
border-radius:5px;
border:1px solid var(--color-gray-200);
background:var(--color-white);
padding:12px;
}
.form-group textarea{
width:100%;
height:110px;
border-radius:5px;
border:1px solid var(--color-gray-200);
background:var(--color-white);
padding:12px;
}
.form-group.otp-input{
display:flex;
align-items:center;
gap:10px;
}
.form-group.otp-input input{
text-align:center;
}
.form-group.country-input input {
padding-left: 60px;
}
.form-group .country-code {
align-items: center;
border-right: 1px solid var(--color-gray-200);
display: flex;
height: 55px;
justify-content: center;
left: 0;
position: absolute;
top: 0;
width: 50px;
}
/*=============================================================*/
.subHeader{
width:100%;
position:relative;
background:var(--color-gray-100);
padding:25px 0px;
text-align:center;
}
.subHeader .breadcrumb{
margin:0;
justify-content: center;
font-size: 14px;
}
.subHeader.subHeaderSmall{
padding:10px 0px;
}
/*=============================================================*/
.noImg{
width:100%;
position:relative;
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
text-align:center;
padding:50px;
}
/*=============================================================*/
.cartRemove.loader {
width: 100%;
height: 100%;
display:flex;
align-items:center;
justify-content:center;
position:absolute;
left:0;
top:0;
background:rgba(0,0,0,0.4);
}
#loader span{
display: inline-block;
width: 10px;
height: 10px;
border-radius: 100%;
background-color: #fff;
margin:0px 3px;
}
#loader span:nth-child(1){
animation: bounce 1s ease-in-out infinite;
}
#loader span:nth-child(2){
animation: bounce 1s ease-in-out 0.33s infinite;
}
#loader span:nth-child(3){
animation: bounce 1s ease-in-out 0.66s infinite;
}
@keyframes bounce{
0%, 75%, 100%{
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0);
}
25%{
-webkit-transform: translateY(-7px);
-ms-transform: translateY(-7px);
-o-transform: translateY(-7px);
transform: translateY(-7px);
}
}
/*=============================================================*/
.accountSubheader{
width:100%;
position:relative;
padding: 40px 0px;
}
.accountSubheader::before{
content: "";
background: url(../../img/ecomdoodle.jpg);
background-size: auto;
background-size: 15%;
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
opacity: 0.3;
}
.accountSubheader .accountSubheader-inner{
position:relative;
}
.aionBox{
display:flex;
align-items:center;
padding:15px;
border:1px solid var(--color-gray-200);
border-radius:10px;
margin-bottom:5px;
}
.aionBox .aionBoxIcon{
width:60px;
height:60px;
overflow:hidden;
background:var(--color-gray-100);
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
}
.aionBox .aionBoxIcon img{
width:42px;
height:42px;
}
.aionBox .aionBoxContent{
flex:1;
}
/*=============================================================*/
.thankubox{
width:100%;
position:relative;
padding:15px;
border-radius:10px;
padding:15px;
background:var(--color-gray-100);
}
/*=============================================================*/
.step-by {
display: flex;
justify-content: center;
flex-wrap: wrap;
padding: 10px;
}
.step-by .title-step {
margin: 0 3.8rem 0 0rem;
margin-left: 1rem;
font-size: 14px;
text-transform: uppercase;
padding: .4rem 0;
position: relative;
}
.step-by .title-step:first-child {
margin-left: 0;
}
.step-by .title-step.active a {
color: var(--color-primary) !important;
}
.title-simple {
display: block;
}
.step-by .title-step:not(:last-child)::after {
content: '\ea6e';
display: inline-block;
position: absolute;
right: -3rem;
top:50%;
line-height: 0;
vertical-align: middle;
font-family: remixicon !important;
font-style: normal;
-webkit-font-smoothing: antialiased;
font-size: 1.5rem;
background-color: #fff;
color: #ccc;
}
.secure-img {
width: 125px;
}
@media only screen and (max-width:968px) {
.secure-img {
width: 100px;
}	
}
/*=============================================================*/
.checkoutSection{
display: grid;
grid-template-columns:60% 40%;
grid-template-areas:"left""right";
}
.checkoutSection .checkoutSectionLeft{
padding:25px 25px 25px 0px
}
.checkoutSection .checkoutSectionRight{
border-left:1px solid var(--color-gray-100);
position: sticky;
width:100%;
padding:25px 0px 25px 25px;
}
.checkProduct{
border:1px solid var(--color-gray-100);
padding:15px;
width:100%;
position:relative;
margin-top:15px;
display:flex;
border-radius:10px;
gap:15px;
}
.checkProduct figure{
display: block;
overflow: hidden;
position: relative;
width: 120px;
height:120px;
border-radius:10px;
}
.checkProduct figure::before {
content: "";
display: block;
padding-top: 115%;
}
.checkProduct .checkProductMedia{
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
background: var(--color-gray-100);
}
.checkProduct .checkProductMedia img {
width: 100%;
height: 100%;
margin: 0 auto;
object-fit: cover;
transition: all 0.5s;
mix-blend-mode: darken;
}
.checkProductContent{
flex:1;
position:relative;
}
.checkProductContent .title{
font-size:14px;
line-height:24px;
}
.checkProductContent .title a{
display:inline-block;
}
.checkProduct .checkProductFooter{
display:flex;
align-items:center;
justify-content:space-between;
position:relative;
margin-top:20px;
}
.checkwishlist{
width:24px;
height:24px;
font-size:24px;
}
.checkProduct .product-price{
font-size:16px;
justify-content: flex-start;
font-weight:700;
margin-bottom:0px;
}
.checkremove{
display:flex;
align-items:center;
gap:5px;
}
.applycouponsbox{
padding:15px 20px;
width:100%;
position:relative;
border:1px solid var(--color-gray-100);
display:flex;
align-items:center;
gap:10px;
cursor:pointer;
border-radius:10px;
margin-bottom:15px;
}
.cartSummary{
width:100%;
border:1px solid var(--color-gray-100);
border-radius:10px;
}
.cartSummary .cartSummaryHeader{
padding:20px 20px 0px 20px;	
}
.cartSummary .cartSummaryBody{
padding:20px;
}
.cartSummary ul{
margin:0;
padding:0;
list-style:none;
}
.cartSummary ul li{
display:flex;
align-items:center;
justify-content:space-between;
height:35px;
}
@media only screen and (max-width:968px) {
.cart-title{
display:none;
}
.checkProduct{
margin-top:0px;
border:0px;
border-radius:0px;
border-bottom:3px solid var(--color-gray-100);
}
.checkProduct figure{
width:75px;
height:75px;
}
.checkProductContent .title a{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.checkProduct .product-price {
font-size: 14px;
font-weight: 600;
}
.applycouponsbox {
padding: 15px;
border:0px;
border-radius: 0px;
border-bottom:3px solid var(--color-gray-100);
height:70px;
margin-bottom:0px;
}
.cartSummary{
border:0px;
}
.cartSummary .cartSummaryHeader {
padding: 15px 15px 0px 15px;
}
.cartSummary .cartSummaryBody {
padding: 15px;
}
.mFooter{
position:fixed;
bottom:0;
left:0;
width:100%;
height:80px;
background:var(--color-white);
border-top: 1px solid var(--color-gray-100);
padding:0px 15px;
display:flex;
align-items:center;
z-index:99;
}
}
/*=============================================================*/
.crsection{
width:100%;
position:relative;
margin-bottom:30px;
}
.crsection .crsection-header{
width:100%;
position:relative;
display:flex;
align-items:center;
justify-content:space-between;
}
.crsection-header .title{
font-size:18px;
}
.crform{
width:100%;
position:relative;
margin-bottom:5px;
}
.crform .form-control{
font-size:14px;
border: 1px solid var(--color-gray-200);
line-height: 1.25;
}
.crform .form-select{
font-size:14px;
border: 1px solid var(--color-gray-200);	
}
.crsection .btn-login{
width: 100%;
height: 100%;
font-size: 14px;
}
.crsection .checkboxgroup{
display:flex;
align-items:center;
gap:10px;
}
.crsection .crsaccount-info{
width:100%;
position:relative;
border-bottom:5px solid var(--color-gray-100);
padding-bottom:15px;
}
.crsection .crsaccount-info-details{
display:flex;
align-items:center;
gap:10px;
font-size:13px;
}
.crsection .craddress{
padding-bottom:15px;
width:100%;
position:relative;
border-bottom:1px dotted var(--color-gray-300);
}
.crsection .craddressbox{
width:100%;
position:relative;
margin-bottom:15px;
background:var(--color-gray-100);
padding:15px;
border:1px solid var(--color-gray-200);
border-radius:10px;
cursor:pointer;
}
.craddressbox .craddressbox-inner{
padding-right:50px;
}
.craddressbox input[type="radio"]{
width: 20px;
height: 20px;
position: absolute;
right: 15px;
top: 15px;
}
.craddressbox-footer{
display:flex;
align-items:center;
gap:15px;
}
.craddressbox-footer a{
display:flex;
align-items:center;
gap:5px;
}
.crsection.mcrsection{
border-bottom:5px solid var(--color-gray-100);
}
@media (max-width: 991px){
.crsection-header .title{
font-size:14px;
}
.crsection .crsaccount-info{
border-bottom:0px;
padding-bottom:0px;
}
}
/*=============================================================*/
.addressbox{
border-radius:10px;
padding:15px;
width:100%;
position:relative;
border:1px solid var(--color-gray-200);
background:var(--color-gray-100);
}
.addressbox-footer{
display:flex;
align-items:center;
gap:20px;
margin-top:15px;
}
.addressbox-footer a{
display:flex;
align-items:center;
gap:5px;
}
@media (max-width: 991px){
.addressbox{
border-radius:0px;
padding:15px;
width:100%;
position:relative;
border:0px;
border-bottom:5px solid var(--color-gray-200);
background:var(--color-white);
}
}
/*=============================================================*/
.order-box {
position: relative;
background: var(--color-gray-100);
width: 100%;
display: flex;
border-radius: 5px;
margin-bottom: 20px;
}
.order-box .info {
position: relative;
width: 75%;
border-right: 1px dashed #e3e3e3;
padding: 15px;
}
.order-box .bcode {
position: relative;
width: 25%;
padding: 25px;
text-align: center;
}
.order-box .orderid-box {
background: var(--color-gray-01);
border-radius: 5px;
padding: 15px 10px 10px 10px;
}
.bs-wizard {
padding: 0;
}
.bs-wizard>.bs-wizard-step {
padding: 0;
position: relative;
}
.bs-wizard>.bs-wizard-step+.bs-wizard-step {}
.bs-wizard>.bs-wizard-step .bs-wizard-stepnum {
color: #595959;
font-size: 16px;
margin-bottom: 5px;
}
.bs-wizard>.bs-wizard-step .bs-wizard-info {
font-size: 14px;
margin-top: 15px;
}
.bs-wizard>.bs-wizard-step>.bs-wizard-dot {
position: absolute;
width: 20px;
height: 20px;
display: block;
background: #fbe8aa;
top: 17px;
left: 50%;
margin-top: -15px;
margin-left: -15px;
border-radius: 50%;
}
.bs-wizard>.bs-wizard-step>.bs-wizard-dot:after {
content: ' ';
width: 12px;
height: 12px;
background: #fbbd19;
border-radius: 50px;
position: absolute;
top: 4px;
left: 4px;
}
.bs-wizard>.bs-wizard-step>.progress {
position: relative;
border-radius: 0px;
height: 4px;
box-shadow: none;
margin: 10px 0;
}
.bs-wizard>.bs-wizard-step>.progress>.progress-bar {
width: 0px;
box-shadow: none;
background: #fbe8aa;
}
.bs-wizard>.bs-wizard-step.complete>.progress>.progress-bar {
width: 100%;
}
.bs-wizard>.bs-wizard-step.active>.progress>.progress-bar {
width: 50%;
}
.bs-wizard>.bs-wizard-step:first-child.active>.progress>.progress-bar {
width: 0%;
}
.bs-wizard>.bs-wizard-step:last-child.active>.progress>.progress-bar {
width: 100%;
}
.bs-wizard>.bs-wizard-step.disabled>.bs-wizard-dot {
background-color: var(--color-gray-200);
}
.bs-wizard>.bs-wizard-step.disabled>.bs-wizard-dot:after {
opacity: 0;
}
.bs-wizard>.bs-wizard-step:first-child>.progress {
left: 50%;
width: 50%;
}
.bs-wizard>.bs-wizard-step:last-child>.progress {
width: 50%;
}
.bs-wizard>.bs-wizard-step.disabled a.bs-wizard-dot {
pointer-events: none;
}
/*=============================================================*/
.order-table{
width:100%;
position:relative;
border-radius:10px;
border: 1px solid #ddd;
}
.order-table table {
border-collapse: collapse;
width: 100%;
}

.order-table table td, .order-table table th {

border-bottom: 1px solid #ddd;
padding: 8px;
}
.order-table table th {
padding-top: 12px;
padding-bottom: 12px;
text-align: left;
background-color: #f5f5f5;
}
.otitem{
display:flex;
align-items:center;
gap:10px;
}
.otitem .otitem-img{
width:52px;
height:52px;
border-radius:5px;
overflow:hidden;
}
.otitem .otitem-img img{
width:100%;
height:100%;
object-fit:cover;
}
.otitem .otitem-details{
flex:1;
}
/*=============================================================*/
.morderbox{
padding:15px;
background:var(--color-white);
border-bottom:5px solid var(--color-gray-100);
}
.morderbox .morderbox-header{
display:flex;
align-items:center;
justify-content:space-between;
border-bottom:1px dotted var(--color-gray-300);
width:100%;
position:relative;
padding-bottom:10px;
margin-bottom:10px;
}
/*=============================================================*/
.paymentoptionbox{
border: 1px solid var(--color-gray-200);
width: 100%;
position:relative;
border-radius:10px;
margin-bottom:15px;
}
.paymentoptionbox .paymentoptionbox-header{
display: flex;
align-items: center;
height: 70px;
padding: 0 15px;
width: 100%;
}
.paymentoptionimg {
align-items:center;
display:flex;
gap:5px;
margin-left:auto
}
.paymentoptionbox-body {
border-top:1px solid var(--color-gray-200);
padding:25px;
position:relative;
text-align:center;
width:100%
}
.paymentoptionbox-body svg {
margin-bottom:10px;
width:150px
}
.radioBox input[type="radio"]{
width:16px;
height:16px;
}
/*=============================================================*/
.couponPopup{
width:100%;
height:100%;
position:fixed;
top:0;
left:0;
background:rgba(0,0,0,0.5);
z-index:9999;
}
.couponPopup .couponPopup-inner{
display:flex;
align-items:center;
justify-content:center;
width:100%;
height:100%;
}
.couponPopup .couponPopupBox{
max-width:350px;
width:100%;
height:300px;
background:var(--color-white);
border-radius:10px;
padding:50px;
text-align:center;
display:flex;
align-items:center;
justify-content:center;
position:relative;
}
.couponbutton{
background:transparent;
border:0px;
color:var(--color-primary);
font-size:16px;
font-weight:700;
}
.coupon-close{
background:transparent;
border:0px;
font-size:24px;
position:absolute;
top:10px;
right:15px;	
}
/*=============================================================*/
.ordersummaryToggle {
position: relative;
width: 100%;
}
.ordersummaryToggle .ordersummaryToggleHed{
align-items: center;
background: var(--color-white);
border-bottom:1px solid var(--color-gray-200);
display: flex;
justify-content: space-between;
padding: 15px;
position: relative;
width: 100%;
}
.ordersummaryToggleHed i{
font-size:20px;
}
.ordersummaryToggle .ordersummaryTogglecont {
background: var(--color-white);
border-bottom:1px solid var(--color-gray-200);
}
/*=============================================================*/
.account-user {
background: var(--color-white);
box-shadow: rgba(33, 33, 33, .06) 0 4px 24px 5px;
width: 100%;
position: relative;
border-radius: 10px;
padding: 15px;
display: flex;
align-items: center;
}
.account-user .au-imag {
width: 50px;
height: 50px;
background: var(--color-gray);
border-radius: 50%;
}
.account-user .au-imag img {
width: 50px;
height: 50px;
border-radius: 50%;
object-fit: cover;
}
.account-user .au-content {
flex: 1;
margin-left: 15px;
}
.aclist {
background: var(--color-white);
box-shadow: rgba(33, 33, 33, .06) 0 4px 24px 5px;
width: 100%;
position: relative;
border-radius: 10px;
padding: 15px 20px;
}
.aclist ul {
margin: 0;
padding: 0;
list-style: none;
}
.aclist ul li {
display: inline-block;
width: 100%;
}
.aclist ul li a {
display: flex;
align-items: center;
padding: 7px 0px;
justify-content: space-between;
}
.aclist ul li.active a {
color: var(--color-primary) !important;
}
.acpanel {
background: var(--color-white);
box-shadow: rgba(33, 33, 33, .06) 0 4px 24px 5px;
width: 100%;
position: relative;
border-radius: 10px;
}
.acpanel .acpanel-header {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
padding: 20px;
border-bottom: 1px solid #eee;
}
.acpanel .acpanel-header h4 {
margin-bottom: 0px;
font-size: 20px;
}
.acpanel .acpanel-body {
padding: 20px;
width: 100%;
position: relative;
}
.aobox {
width: 100%;
height: 170px;
background: #f5f5f5;
border-radius: 5px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
text-align: center;
padding: 0px 15px;
}
.aobox h6 {
margin-bottom:5px;
font-size: 16px;
}
.aobox img {
width:62px;
height:62px;
}
@media (max-width: 991px){
.account-user{
box-shadow:none;
border-radius:0px;
}
}
.userprofile{
display:flex;
align-items:center;
gap:15px;
}
.userprofile .userprofileMedia{
width:65px;
height:65px;
overflow:hidden;
border-radius:50%;
}
.userprofileMedia img{
width:100%;
height:100%;
object-fit:cover;
}
.userprofile .userprofileContent{
flex:1;
}
.mclist{
margin:0;
padding:0;
list-style:none;
}
.mclist li{
display:inline-block;
width:100%;
position:relative;
border-bottom:1px dotted var(--color-gray-300);
}
.mclist li a{
display:flex;
align-items:center;
justify-content:space-between;
padding:7px 15px;
}
.mclist li h6{
font-size:0.9rem;
}
.mclistbox{
display:flex;
align-items:center;
gap:10px;
}
.mclistbox .mclistbox-icon{
width:52px;
height:52px;
overflow:hidden;
border-radius:50%;
background:var(--color-gray-100);
display:flex;
align-items:center;
justify-content:center;
}
.mclistbox .mclistbox-icon img{
width:24px;
height:24px;
}
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
@font-face {
font-family:"riode";
src:url("../fonts/riode.eot?5gap68");
src:url("../fonts/riode.eot?5gap68#iefix") format("embedded-opentype"),
url("../fonts/riode.ttf?5gap68") format("truetype"),
url("../fonts/riode.woff?5gap68") format("woff"),
url("../fonts/riode.svg?5gap68#riode") format("svg");
font-weight:normal;
font-style:normal;
font-display:block
}
[class*=" d-icon-"],
[class^=d-icon-] {
display:inline-block;
line-height:1
}
[class*=" d-icon-"]:before,
[class^=d-icon-]:before {
font-family:"riode"!important;
speak:never;
font-style:normal;
font-weight:normal;
font-variant:normal;
text-transform:none;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale
}
.d-icon-truck:before {
content:""
}
.d-icon-service:before {
content:""
}
.d-icon-secure:before {
content:""
}
.d-icon-lock:before {
content:""
}
.d-icon-percent:before {
content:""
}
.d-icon-layer:before {
content:""
}
.d-icon-alert:before {
content:""
}
.d-icon-database:before {
content:""
}
.d-icon-money:before {
content:""
}
.d-icon-shoppingbag:before {
content:""
}
.d-icon-t-shirt1:before {
content:""
}
.d-icon-t-shirt2:before {
content:""
}
.d-icon-hat:before {
content:""
}
.d-icon-officebag:before {
content:""
}
.d-icon-handbag:before {
content:""
}
.d-icon-backpack:before {
content:""
}
.d-icon-shoes:before {
content:""
}
.d-icon-pillow:before {
content:""
}
.d-icon-dress:before {
content:""
}
.d-icon-loungewear:before {
content:""
}
.d-icon-desktop:before {
content:""
}
.d-icon-laptop:before {
content:""
}
.d-icon-gamepad1:before {
content:""
}
.d-icon-wireless:before {
content:""
}
.d-icon-projector:before {
content:""
}
.d-icon-drone1:before {
content:""
}
.d-icon-drone2:before {
content:""
}
.d-icon-radio:before {
content:""
}
.d-icon-battery:before {
content:""
}
.d-icon-plugin:before {
content:""
}
.d-icon-memory:before {
content:""
}
.d-icon-ball:before {
content:""
}
.d-icon-basketball1:before {
content:""
}
.d-icon-babycare:before {
content:""
}
.d-icon-card:before {
content:""
}
.d-icon-gamepad2:before {
content:""
}
.d-icon-camera1:before {
content:""
}
.d-icon-camera2:before {
content:""
}
.d-icon-babywear:before {
content:""
}
.d-icon-abacus:before {
content:""
}
.d-icon-pot:before {
content:""
}
.d-icon-freezer:before {
content:""
}
.d-icon-cook:before {
content:""
}
.d-icon-student:before {
content:""
}
.d-icon-category:before {
content:""
}
.d-icon-basketball2:before {
content:""
}
.d-icon-watch:before {
content:""
}
.d-icon-tcard:before {
content:""
}
.d-icon-heartbeat:before {
content:""
}
.d-icon-watch-round:before {
content:""
}
.d-icon-washbowl:before {
content:""
}
.d-icon-bridge-lamp:before {
content:""
}
.d-icon-lamp:before {
content:""
}
.d-icon-sofa:before {
content:""
}
.d-icon-sofa2:before {
content:""
}
.d-icon-bed:before {
content:""
}
.d-icon-table:before {
content:""
}
.d-icon-table-lamp:before {
content:""
}
.d-icon-table-tv:before {
content:""
}
.d-icon-mirror:before {
content:""
}
.d-icon-volume:before {
content:""
}
.d-icon-bars2:before {
content:""
}
.d-icon-bars:before {
content:""
}
.d-icon-phone:before {
content:""
}
.d-icon-user:before {
content:""
}
.d-icon-search:before {
content:""
}
.d-icon-search2:before {
content:""
}
.d-icon-bag:before {
content:""
}
.d-icon-map:before {
content:""
}
.d-icon-info:before {
content:""
}
.d-icon-refresh:before {
content:""
}
.d-icon-left-arrow:before {
content:""
}
.d-icon-right-arrow:before {
content:""
}
.d-icon-down-arrow:before {
content:""
}
.d-icon-up-arrow:before {
content:""
}
.d-icon-ruler:before {
content:""
}
.d-icon-zoom:before {
content:""
}
.d-icon-right-circle:before {
content:""
}
.d-icon-left-circle:before {
content:""
}
.d-icon-up-circle:before {
content:""
}
.d-icon-down-circle:before {
content:""
}
.d-icon-angle-right:before {
content:""
}
.d-icon-angle-left:before {
content:""
}
.d-icon-angle-up:before {
content:""
}
.d-icon-angle-down:before {
content:""
}
.d-icon-star:before {
content:""
}
.d-icon-star-full:before {
content:""
}
.d-icon-heart:before {
content:""
}
.d-icon-heart-full:before {
content:""
}
.d-icon-close:before {
content:""
}
.d-icon-play-circle:before {
content:""
}
.d-icon-home:before {
content:""
}
.d-icon-filter-2:before {
content:""
}
.d-icon-switch:before {
content:""
}
.d-icon-switch-left-on:before {
content:""
}
.d-icon-switch-right-on:before {
content:""
}
.d-icon-filter-3:before {
content:""
}
.d-icon-check:before {
content:""
}
.d-icon-alert-solid:before {
content:""
}
.d-icon-headphone:before {
content:""
}
.d-icon-mode-grid:before {
content:""
}
.d-icon-mode-list:before {
content:""
}
.d-icon-cancel:before {
content:""
}
.d-icon-instagram:before {
content:""
}
.d-icon-solid-check:before {
content:""
}
.d-icon-play-solid:before {
content:""
}
.d-icon-mobile:before {
content:""
}
.d-icon-minus:before {
content:""
}
.d-icon-plus:before {
content:""
}
.d-icon-wifi:before {
content:""
}
.d-icon-times:before {
content:""
}
.d-icon-times-circle:before {
content:""
}
.d-icon-random:before {
content:""
}
.d-icon-th-list:before {
content:""
}
.d-icon-rocket:before {
content:""
}
.d-icon-map-marker:before {
content:""
}
.d-icon-birthday-cake:before {
content:""
}
.d-icon-gift:before {
content:""
}
.d-icon-female:before {
content:""
}
.d-icon-clock:before {
content:""
}
.d-icon-comments:before {
content:""
}
.d-icon-rotate-left:before {
content:""
}
.d-icon-rotate-right:before {
content:""
}
.d-icon-reading:before {
content:""
}
.d-icon-feeder:before {
content:""
}
.d-icon-birthday-cake2:before {
content:""
}
.d-icon-skirt:before {
content:""
}
.d-icon-toy:before {
content:""
}
.d-icon-butterfly:before {
content:""
}
.d-icon-babycare2:before {
content:""
}
.d-icon-butterfly2:before {
content:""
}
.d-icon-dinner-set:before {
content:""
}
.d-icon-ball2:before {
content:""
}
.d-icon-apple:before {
content:""
}
.d-icon-icecream:before {
content:""
}
.d-icon-cake:before {
content:""
}
.d-icon-meat:before {
content:""
}
.d-icon-bread:before {
content:""
}
.d-icon-cocktail:before {
content:""
}
.d-icon-food:before {
content:""
}
.d-icon-birthday-cake3:before {
content:""
}
.d-icon-cash:before {
content:""
}
.d-icon-service2:before {
content:""
}
.d-icon-car:before {
content:""
}
.d-icon-ball3:before {
content:""
}
.d-icon-compare:before {
content:""
}
.d-icon-jar:before {
content:""
}
.d-icon-radish:before {
content:""
}
.d-icon-arrow-down:before {
content:""
}
.d-icon-arrow-left:before {
content:""
}
.d-icon-arrow-right:before {
content:""
}
.d-icon-arrow-up:before {
content:""
}
.d-icon-earth:before {
content:""
}
.d-icon-long-arrow-left:before {
content:""
}
.d-icon-long-arrow-right:before {
content:""
}
.d-icon-long-arrow-down:before {
content:""
}
.d-icon-long-arrow-up:before {
content:""
}
.d-icon-pill:before {
content:""
}
.d-icon-cylinder:before {
content:""
}
.d-icon-medical-bag:before {
content:""
}
.d-icon-graph:before {
content:""
}
/*=============================================================*/
.thankusection{
width:100%;
display:flex;
align-items:center;
height:100%;
left:0;
top:0;
}
.thankusection .thankusection-left{
width:65%;
position:relative;
height:100%;
padding:50px 10px 50px 100px;
}
.thankusection .thankusection-right{
width:35%;
position:relative;
height:100%;
background:var(--color-black-light);
padding:50px 30px;
}
.tsleft-header{
width:100%;
position:relative;
display:flex;
align-items:center;
}
.tsleft-header-icon{
width:65px;
height:65px;
}
.tsleft-header-icon img{
width:65px;
height:65px;
border-radius:50%;
}
.tsleft-header-text{
flex:1;
padding-left:15px;
}
.tsleft-box{
width:100%;
position:relative;
border-radius:5px;
background:var(--color-light02);
}
.tsleft-box .tsleft-box-header{
padding:15px;
border-bottom:1px solid var(--color-black-light-02);
}
.tsleft-box .tsleft-box-body{
padding:15px;
}
.thankusection-footer{
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
}
@media (max-width: 991px){
.thankusection{
flex-direction: column;
padding: 15px;
}
.thankusection .thankusection-left{
width:100%;
position:relative;
height:auto;
padding: 0;
}
.thankusection .thankusection-right{
width:100%;
position:relative;
height:auto;
padding: 0;
background:var(--color-black);
margin-top: 0px;
}
.thankusection .cartsec{
padding: 10px 0px;
border-bottom: 1px solid var(--color-black-light-02);
}
.thankusection-footer{
flex-direction: column;
}
.tsleft-header{
width:100%;
position:relative;
display:flex;
align-items:center;
flex-direction: column;
justify-content: center;
text-align: center;
}
.tsleft-header-text{
flex:1;
padding-left:0px;
margin-top: 20px;
}
}
.form-group select{
width:100%;
height:50px;
border-radius:5px;
border:1px solid var(--color-gray-200);
background:var(--color-white);
padding:12px;
}

/*=============================================================*/
/*=============================================================*/
.shortby {
justify-content:space-between;
align-items: center;
display: flex;
margin-bottom: 20px;
position: relative;
width: 100%;
}
.shortbydrop .shortbydrop-inner {
align-items: center;
display: flex;
gap:10px;
}
.shortbydrop label{
margin-right:10px;
}
.shortbydrop select {
appearance: none;
outline: 0;
border: 0;
box-shadow: none;
/* Personalize */
flex: 1;
padding: 0 1em;
color: #000;
background-color: var(--color-gray-100);
background-image: none;
cursor: pointer;
height: 40px;
border-radius:5px 0px 0px 5px;
}
/* Remove IE arrow */
.shortbydrop select::-ms-expand {
display: none;
}
/* Custom Select wrapper */
.select {
position: relative;
display: flex;
width: 17em;
height: 40px;
border-radius:0px 5px 5px 0px;
overflow: hidden;
}
/* Arrow */
.select::after {
content: "\ea4e";
position: absolute;
top: 0;
right: 0;
background-color:var(--color-gray-100);
transition: .25s all ease;
pointer-events: none;
font-family: remixicon !important;
font-style: normal;
-webkit-font-smoothing: antialiased;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
height:40px;
width:40px;
display:flex;
align-items:center;
justify-content:center;
}
/* Transition */
.select:hover::after {
color:var(--color-primary);
}

/*=============================================================*/
.cols-1>* {
max-width:100%;
flex:0 0 100%
}
.cols-2>* {
max-width:50%;
flex:0 0 50%
}
.cols-3>* {
max-width:33.3333%;
flex:0 0 33.3333%
}
.cols-4>* {
max-width:25%;
flex:0 0 25%
}
.cols-5>* {
max-width:20%;
flex:0 0 20%
}
.cols-6>* {
max-width:16.6667%;
flex:0 0 16.6667%
}
.cols-7>* {
max-width:14.2857%;
flex:0 0 14.2857%
}
.cols-8>* {
max-width:12.5%;
flex:0 0 12.5%
}
@media (min-width:480px) {
.cols-xs-1>* {
max-width:100%;
flex:0 0 100%
}
.cols-xs-2>* {
max-width:50%;
flex:0 0 50%
}
.cols-xs-3>* {
max-width:33.3333%;
flex:0 0 33.3333%
}
.cols-xs-4>* {
max-width:25%;
flex:0 0 25%
}
.cols-xs-5>* {
max-width:20%;
flex:0 0 20%
}
.cols-xs-6>* {
max-width:16.6667%;
flex:0 0 16.6667%
}
.cols-xs-7>* {
max-width:14.2857%;
flex:0 0 14.2857%
}
.cols-xs-8>* {
max-width:12.5%;
flex:0 0 12.5%
}
}
@media (min-width:576px) {
.cols-sm-1>* {
max-width:100%;
flex:0 0 100%
}
.cols-sm-2>* {
max-width:50%;
flex:0 0 50%
}
.cols-sm-3>* {
max-width:33.3333%;
flex:0 0 33.3333%
}
.cols-sm-4>* {
max-width:25%;
flex:0 0 25%
}
.cols-sm-5>* {
max-width:20%;
flex:0 0 20%
}
.cols-sm-6>* {
max-width:16.6667%;
flex:0 0 16.6667%
}
.cols-sm-7>* {
max-width:14.2857%;
flex:0 0 14.2857%
}
.cols-sm-8>* {
max-width:12.5%;
flex:0 0 12.5%
}
}
@media (min-width:768px) {
.cols-md-1>* {
max-width:100%;
flex:0 0 100%
}
.cols-md-2>* {
max-width:50%;
flex:0 0 50%
}
.cols-md-3>* {
max-width:33.3333%;
flex:0 0 33.3333%
}
.cols-md-4>* {
max-width:25%;
flex:0 0 25%
}
.cols-md-5>* {
max-width:20%;
flex:0 0 20%
}
.cols-md-6>* {
max-width:16.6667%;
flex:0 0 16.6667%
}
.cols-md-7>* {
max-width:14.2857%;
flex:0 0 14.2857%
}
.cols-md-8>* {
max-width:12.5%;
flex:0 0 12.5%
}
}
@media (min-width:992px) {
.cols-lg-1>* {
max-width:100%;
flex:0 0 100%
}
.cols-lg-2>* {
max-width:50%;
flex:0 0 50%
}
.cols-lg-3>* {
max-width:33.3333%;
flex:0 0 33.3333%
}
.cols-lg-4>* {
max-width:25%;
flex:0 0 25%
}
.cols-lg-5>* {
max-width:20%;
flex:0 0 20%
}
.cols-lg-6>* {
max-width:16.6667%;
flex:0 0 16.6667%
}
.cols-lg-7>* {
max-width:14.2857%;
flex:0 0 14.2857%
}
.cols-lg-8>* {
max-width:12.5%;
flex:0 0 12.5%
}
}
@media (min-width:1200px) {
.cols-xl-1>* {
max-width:100%;
flex:0 0 100%
}
.cols-xl-2>* {
max-width:50%;
flex:0 0 50%
}
.cols-xl-3>* {
max-width:33.3333%;
flex:0 0 33.3333%
}
.cols-xl-4>* {
max-width:25%;
flex:0 0 25%
}
.cols-xl-5>* {
max-width:20%;
flex:0 0 20%
}
.cols-xl-6>* {
max-width:16.6667%;
flex:0 0 16.6667%
}
.cols-xl-7>* {
max-width:14.2857%;
flex:0 0 14.2857%
}
.cols-xl-8>* {
max-width:12.5%;
flex:0 0 12.5%
}
}
@media (min-width:1600px) {
.cols-xxl-1>* {
max-width:100%;
flex:0 0 100%
}
.cols-xxl-2>* {
max-width:50%;
flex:0 0 50%
}
.cols-xxl-3>* {
max-width:33.3333%;
flex:0 0 33.3333%
}
.cols-xxl-4>* {
max-width:25%;
flex:0 0 25%
}
.cols-xxl-5>* {
max-width:20%;
flex:0 0 20%
}
.cols-xxl-6>* {
max-width:16.6667%;
flex:0 0 16.6667%
}
.cols-xxl-7>* {
max-width:14.2857%;
flex:0 0 14.2857%
}
.cols-xxl-8>* {
max-width:12.5%;
flex:0 0 12.5%
}
}
.order-first {
order:-1
}
.order-last {
order:9
}
@media (min-width:576px) {
.order-sm-auto {
order:0
}
.order-sm-first {
order:-1
}
.order-sm-last {
order:9
}
}
@media (min-width:768px) {
.order-md-auto {
order:0
}
.order-md-first {
order:-1
}
.order-md-last {
order:9
}
}
@media (min-width:992px) {
.order-lg-auto {
order:0
}
.order-lg-first {
order:-1
}
.order-lg-last {
order:9
}
}
@media (min-width:1200px) {
.order-xl-auto {
order:0
}
.order-xl-first {
order:-1
}
.order-xl-last {
order:9
}
}
/*=============================================================*/
.navbar {
padding: 0 !important;
position: static !important;
width: 100%;
font-size:var(--menu-font);
}
.nav-link{
padding:1.5rem 0.7rem !important;
color:var(--color-dark);
}
.dropdown-toggle::after {
border: 0px !important;
}
.dropdown-hover:hover>.dropdown-menu {
display: inline-block;
}
.dropdown-hover>.dropdown-toggle:active {
pointer-events: none;
}
.submenu {
border: 0px !important;
background: var(--color-white) !important;
margin: 0 !important;
min-width: 15rem !important;
padding: 0 !important;
border-radius: 0px !important;
}
.submenu .dropdown-item {
display: block;
width: 100%;
padding: 7px 15px;
clear: both;
font-weight: 400;
text-align: inherit;
text-decoration: none;
white-space: nowrap;
background-color: transparent;
border: 0;
font-size: 14px;
}
.submenu .dropdown-item:hover {
background: var(--color-white) !important;
color: var(--color-primary) !important;
}
.mega-dropdown {
position: static !important;
}
.mega-menu {
width: 100%;
left: 0;
border: 0px !important;
margin: 0 !important;
padding: 25px 0px !important;
background: var(--color-white) !important;
border-radius: 0px !important;
border-top: 1px dashed var(--color-gray-200) !important;
}
.mega-menu .container {
display: block !important;
}
.mlist{
width: 100%;
position: relative;
}
.mlist .title{
font-weight: 600 !important;
font-size:15px;
}
.mlist ul{
margin: 0;
padding: 0;
list-style: none;
}
.mlist ul li{
display: flex;
align-items: center;
font-size:13px;
line-height:28px;
}
.mlist ul li a{
display:inline-block;
width:100%;
}
.mega-menu-imgbox{
width:100%;
position:relative;
text-align:center;
}
/*=============================================================*/
.section-gap-large {
padding: 80px 0px;
}
.section-gap-medium {
padding: 60px 0px;
}
.section-gap-small {
padding: 30px 0px;
}
.sectiontop-gap-large {
padding-top: 80px;
}
.sectiontop-gap-medium {
padding-top: 60px;
}
.sectiontop-gap-small {
padding-top: 30px;
}
.sectionbottom-gap-large {
padding-bottom: 80px;
}
.sectionbottom-gap-medium {
padding-bottom: 60px;
}
.sectionbottom-gap-small {
padding-bottom: 30px;
}
.section-mdgap-small{
padding:15px 0px;
}
/*=============================================================*/
main.wapper{
padding-bottom:80px;
}
/*=============================================================*/
.header{
width: 100%;
position: relative;
z-index:99;
background:var(--color-white);
box-shadow: 0 0 5px 0px rgba(0,0,0,.1);
}
.header.checkoutHeader{
box-shadow: 0 0 10px 1px rgba(0,0,0,.1);
}
.header .container,
.header .container-fluid,
.header .inner-wrap {
display:flex;
align-items:center
}
.header-center,
.header-left,
.header-right {
display:flex;
align-items:center
}
.header-right {
margin-left:auto
}
.header-left, .header-right {
flex:1
}
.header-top{
width: 100%;
position: relative;
background: var(--color-primary);
}
.header-middle {
height:70px;
display: flex;
align-items: center;
width: 100%;
position: relative;
}
.header.checkoutHeader .header-middle{
height:70px;
}
.headerLeftlist{
margin: 0;
padding: 0;
list-style: none;
gap: 15px;
display: flex;
align-items: center;
}
.headerLeftlist li a {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
position: relative;
}
.headerLeftlist li a i {
font-size: 33px;
}
.headerRightlist{
margin: 0;
padding: 0;
list-style: none;
gap: 20px;
display: flex;
align-items: center;
}
.headerRightlist li a {
align-items: center;
display: flex;
justify-content: center;
position: relative;
font-size: 12px;
}
.headerRightlist li a i {
font-size: 33px;
}
.csQty{
width: 18px;
height: 18px;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
background: var(--color-dark);
border-radius: 50%;
bottom: -3px;
left: 0px;
color: var(--color-white);
font-size: 11px;
}
.hText{
flex-direction: column;
}
.hText i{
font-size: 26px !important;
}
.hText .csQty{
top: -2px;
right: 0px;
left: auto;
}
.cart-total{
flex-direction: row !important;
gap: 10px;
}
.cart-total .cart-total-qty{
font-weight: 600;
}
.header-style-2 .navbar-nav{
margin-left: auto;
margin-right: auto;
}
.header-style-3 .logo{
margin-right:75px;
}
.header-style-3 .header-bottom{
border-top:1px solid var(--color-gray-100);
}
.header-style-3 .header-right{
flex: inherit;
}
.header-style-3 .navbar-nav{
width:100%;
justify-content:center;
}
.header-style-3 .nav-link{
padding:0.8rem !important
}
@media screen and (max-width: 991px) {
.header-style-3 .header-bottom{
border-top:0px solid var(--color-gray-100);
padding:0px 0px 10px;
}
}
.header-search {
position: relative;
flex: 1;
margin-right: 2rem;
max-width: 32.2rem;
}
.header-search input {
background-color: var(--color-gray-100);
border: 1px solid var(--color-gray-200);
border-radius:10px;
color: #333;
font-size: 14px;
height: 50px;
padding: 10px 15px 10px 15px;
width: 100%;
}
.header-search .btn-search {
position: absolute;
background: transparent;
color: var(--color-primary);
min-width: 48px;
height: 100%;
border-radius: 5px;
right: 0;
font-size: 22px;
}
.header-search .header-placeholder{
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
transition: all .3s ease;
pointer-events: none;
padding-left:15px;
overflow: hidden;
width: 100%;
color:var(--color-gray-500);
}
.header-placeholder .header-placeholder-text{
display: inline-block;
}
.header-placeholder .header-placeholder-animated{
display: inline-block;
}
@keyframes slideUpplaceholder {
0%, 20% { transform: translateY(30px); opacity: 0; }
20%, 40% { transform: translateY(0); opacity: 1; }
60%, 80% { transform: translateY(-30px); opacity: 0; }
}
.placeholder-text {
position: absolute;
top: 0;
opacity: 0;
animation: slideUpplaceholder 3.36s linear infinite;
}
.placeholder-text:nth-child(2) {
animation-delay: 1.12s; 
}
.placeholder-text:nth-child(3) {
animation-delay: 2.24s;
}

@media screen and (max-width: 991px) {
.header-style-3 .header-search{
max-width: 100%;
width:100%;
margin:0px;
}
}
.header-top-slider{
width:100%;
position:relative;
height: 35px;
overflow: hidden;
color:var(--color-white);
line-height: 35px;
}
.header-top-slider .swiper-wrapper{
height: 35px;
}
@media only screen and (max-width:968px) {
.header-middle{
height:59px;
}
.headerRightlist{
gap:10px;
}
.headerRightlist li a i{
font-size:27px;
}
.csQty{
width:14px;
height:14px;
}
}
.menu-toggle{
min-width: 26px;
display: -ms-flexbox;
display: flex;
padding: 0;
-ms-flex-align: center;
align-items: center;
height: 30px;
margin-right:15px;
}
.menu-toggle [class*="icon"] {
font-size: 22px;
}
/*=============================================================*/
.header-title{
display:flex;
align-items:center;
gap:15px;
}
.header-title .header-title-text{
flex:1;
}
.header-title .title{
font-size:16px;
margin-bottom:0px;
}
.header-title .back-arrow{
font-size:24px;
}
/*=============================================================*/
.search-container-open{
position: absolute;
transition: transform .2s;
transform: translateY(20px);
opacity: 0;
width: 100%;
left: 0;
padding: 10px 0px;
top:70px;
box-shadow: 0 30px 35px rgba(0, 0, 0, .07);
background: var(--color-white);
z-index: 9;
}
.search-container .search {
position: relative;
width: 100%;
max-width: 800px;
margin-right: auto;
margin-left: auto;
padding: 0 50px 0 0;
}
.search-container .search-input[type] {
font-size: 18px;
font-weight: normal;
line-height: 50px;
display: inline-block;
width: 100%;
margin: 0;
padding: 0 50px 0 0;
transition: .2s;
vertical-align: top;
color: #7e7e7e;
border: 0;
border-bottom-width: 0px;
border-bottom-style: none;
border-bottom-color: currentcolor;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #e8e8e8;
background-color: transparent;
}
.search-container .search-close {
position: absolute;
top: 0;
right: 0;
}
.search-container .search-close i{
font-size: 45px;
}
.is-hovered .search-container-open{
transform: translate3d(0, 0, 0);
pointer-events: all;
opacity: 1;
}
@media only screen and (max-width:968px) {
.search-container .search{
padding: 0 35px 0 0;
}
.search-container-open{
top:65px;
}
.search-container .search-input[type]{
font-size:14px;
line-height: 35px;
}
.search-container .search-close i {
font-size: 28px;
}
.search-container .search-close {
top: 5px;
}
}
/*=============================================================*/
.footer{
width:100%;
position:relative;
}
.footer.footer-dark{
color:var(--color-white);
}
.footer .footer-top{
width:100%;
position:relative;
}
.footerIocnBox {
align-items: center;
display: flex;
padding: 25px 0;
position: relative;
width: 100%;
}
.footerIocnBox.center{
flex-direction:column;
text-align:center;
}
.footerIocnBox.center .ficon{
margin-right:0px;
margin-bottom:10px;
}
.footerIocnBox .ficon {
height: 60px;
margin-right: 15px;
position: relative;
width: 60px;
overflow:hidden;
}
.footerIocnBox .ficon img {
height: 100%;
width: 100%;
}
.footerIocnBox .ftext {
flex: 1 1;
}
.footer .footer-middle{
width:100%;
position:relative;
padding:60px 0px;
}
.footer-bottom{
width:100%;
position:relative;
padding:30px 0px;
}
.footer-logo{
display:block;
}
.paymet-icon {
text-align: right;
}
.footer-social {
width: 100%;
position: relative;
}
.footer-social ul {
margin: 0;
padding: 0;
list-style: none;
}
.footer-social ul li {
display: inline-block;
margin: 0px 10px 0px 0px;
position: relative;
}
.footer-social ul li a {
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
border: 1px solid #ddd;
border-radius: 5px;
-webkit-transition: border-top-left-radius .1s linear 0s, border-top-right-radius .1s linear .1s, border-bottom-right-radius .1s linear .2s, border-bottom-left-radius .1s linear .3s;
-o-transition: border-top-left-radius .1s linear 0s, border-top-right-radius .1s linear .1s, border-bottom-right-radius .1s linear .2s, border-bottom-left-radius .1s linear .3s;
transition: border-top-left-radius .1s linear 0s, border-top-right-radius .1s linear .1s, border-bottom-right-radius .1s linear .2s, border-bottom-left-radius .1s linear .3s
}
.footer-social ul li a i {
font-size: 16px;
}
.footer-social li:hover a {
background: var(--color-primary);
border-radius: 5px;
color:var(--color-white);
}
.footer-dark .footer-social ul li a{
color:var(--color-white);
}
.footer-dark .footer-social li:hover a {
background: var(--color-primary);
border-radius: 5px;
color:var(--color-white) !important;
}
.footer-title{
font-size:18px;
margin-bottom:20px;
}
.footer-list{
margin:0;
padding:0;
list-style:none;
}
.footer-list li{
display:inline-block;
width:100%;
position:relative;
line-height:28px;
}
.footer-dark .footer-list li a{
color:var(--color-white);
display:inline-block;
}
.collapsed-mobile .toggle-arrow{
display: none;
}
@media (max-width: 991px){
.footer .collapsed-mobile{
position: relative;
}
.collapsed-mobile{
position: relative;
overflow: hidden;
}
.collapsed-mobile .title{
cursor: pointer;
}
.collapsed-mobile .title h2{
margin: 0 0 10px 0;
padding: 0 0 10px;
}
.collapsed-mobile .collapsed-content{
position: absolute;
top: -10000px;
visibility: hidden;
width: 100%;
padding: 0 0 20px;
transition: opacity .3s ease; 
opacity: 0;
}
.collapsed-mobile .toggle-arrow{
position: absolute;
z-index: 100;
top: 0;
right: 0;
display: block;
width: 50px;
height: 50px;
cursor: pointer;
transition: all .2s ease;
}
.collapsed-mobile .toggle-arrow span:first-child{
position: absolute;
top: 50%;
left: 50%;
width: 14px;
height: 2px;
margin-top: -1px;
margin-left: -7px;
transition: .2s;
transform: rotate(-90deg); 
opacity: 1;
background-color: #282828;
}
.collapsed-mobile .toggle-arrow span:last-child{
position: absolute;
top: 50%;
left: 50%;
width: 2px;
height: 14px;
margin-top: -7px;
margin-left: -1px;
transition: .35s ease-in-out;
transform: rotate(-90deg); 
background-color: #282828;
}
.collapsed-mobile.open .collapsed-content{
position: relative;
top: 0;
visibility: visible;
opacity: 1;
}
.collapsed-mobile.open .toggle-arrow span:first-child{
transition: .35s ease-in-out;
transform: rotate(90deg); 
opacity: 0;
}
.collapsed-mobile.open .toggle-arrow span:last-child{
transform: rotate(90deg);
}
.footer-block ul:not[class] li a{
width: 100%;
}
.footer .container > .row > [class*='col-']:last-child .footer-block.collapsed-mobile:only-child{
margin-bottom: 0;
border-bottom: 0;
}
.footer .collapsed-mobile .collapsed-content{
margin-bottom: 0;
}
.footer .collapsed-mobile .toggle-arrow{
right: -5px;
padding-top: 0;
}
}
/*=============================================================*/
/*=============================================================*/

/*=============================================================*/
.product-tabs{
width:100%;
position:relative;
}
.product-tabs .accordion{
border:0px;
border-radius:0px;
}
.product-tabs .accordion-item{
border-radius:0px;
border:0px;
border-bottom:1px solid var(--color-gray-200);
background:var(--color-white);
}
.product-tabs .accordion-button{
border-radius:0px !important;
font-size:14px;
}
.accordion-button:focus{
box-shadow:none;
}
.accordion-button:not(.collapsed){
background:var(--color-white);
color:var(--color-dark);
}
/*=============================================================*/
.variation-block{
margin-top: 28px;
width:100%;
position:relative;
display: flex;
flex-wrap: wrap;
}
.variation-block .variation-option{
width:100%;
display: flex;
flex-direction: column;
gap:5px;
margin-bottom:10px;
}
.variation-option .option-label{
font-size: 14px;
font-weight: 600;
line-height: 22px;
width: 100%;
padding-right: 10px;
}
.variation-option-meta{
align-items: center;
display: flex;
gap: 10px;
}
.variation-option-meta .color{
width: 30px;
height: 30px;
border-radius: 50%;
transition:0.3s;
}
.variation-option-meta .color.active{
box-shadow: inset 0 0 0 2px #fff;
border: 1px solid var(--color-primary);
}
.variation-option-meta .color:hover{
box-shadow: inset 0 0 0 2px #fff;
border: 1px solid var(--color-primary);
}
.variation-option-meta .text{
width: 30px;
height: 30px;
border-radius: 2px;
transition:0.3s;
border: 1px solid var(--color-gray-300);
display: flex;
align-items: center;
justify-content: center;
}
.variation-option-meta .text.active{
box-shadow: inset 0 0 0 2px #fff;
border: 1px solid var(--color-primary);
}
.variation-option-meta .text:hover{
box-shadow: inset 0 0 0 2px #fff;
border: 1px solid var(--color-primary);
}
.variation-option-meta .swatch{
width: 55px;
height: 55px;
border-radius: 5px;
transition:0.3s;
border: 1px solid var(--color-gray-300);
display: flex;
align-items: center;
justify-content: center;
overflow:hidden;
}
.variation-option-meta .swatch img{
width: 100%;
height: 100%;
object-fit:cover;
}
.variation-option-meta .swatch.active{
box-shadow: inset 0 0 0 2px #fff;
border: 1px solid var(--color-primary);
}
.variation-option-meta .swatch:hover{
box-shadow: inset 0 0 0 2px #fff;
border: 1px solid var(--color-primary);
}
/*=============================================================*/
.ratings-container {
display:flex;
align-items:center;
line-height:1.1;
margin-bottom:1.2rem;
font-size:16px;
letter-spacing:-1px;
}
.ratings-full {
cursor:pointer
}
.ratings,
.ratings-full {
position:relative;
font-family:"riode"
}
.ratings-full+.rating-reviews {
margin-left:0.2rem
}
.ratings-full:before {
content:"\f18c" "\f18c" "\f18c" "\f18c" "\f18c";
color:rgba(0,0,0,0.16);
font-family:remixicon!important;
}
.ratings {
position:absolute;
top:0;
left:0;
white-space:nowrap;
overflow:hidden
}
.ratings:before {
content:"\f18c" "\f18c" "\f18c" "\f18c" "\f18c";
color:#ffa41c;
font-family:remixicon!important;
}
.rating-reviews {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size:12px;
color: #aaa;
text-transform: capitalize;
}
/*=============================================================*/
.avg-rating-container {
display:flex;
align-items:center;
margin-bottom:1rem
}
.avg-rating-container mark {
font-size: 5rem;
font-weight: 700;
line-height: 1;
color: var(--color-primary);
background: none;
padding:0;
margin-right:15px;
}
.avg-rating-title{
font-size:16px;
margin-bottom:10px;
}
.avg-rating-container .rating-reviews:hover {
color:#999
}
.ratings-item {
display:flex;
align-items:center;
padding:3px 0px;
}
.ratings-item .ratings-container {
margin-right:1rem;
}
.ratings-item .progress-value {
width: 60px;
text-align: left;
margin-left:10px;
}
.rating-percent {
background:#eee;
height:0.5rem;
width:20rem;
max-width:100%;
border-radius:1rem
}
.rating-percent span {
display:block;
height:100%;
border-radius:inherit;
background:#999
}

/*=============================================================*/
.comments-list{
margin:0;
padding:0;
list-style:none;
}
.comments-list li {
padding-bottom: 0rem;
margin-bottom: 1rem;
width: 100%;
position: relative;
border-bottom: 1px dotted var(--color-gray-300);
}
.comments-list li:last-child{
border-bottom:0px;
}
.comment {
position:relative;
display:flex;
align-items:flex-start
}
.comment-media {
max-width: 3rem;
flex: 0 0 3rem;
height: 3rem;
overflow: hidden;
}
.comment p:last-child {
margin-bottom:0
}
.comment-body {
position:relative;
flex:1 1 auto;
padding:0rem 0 0 1rem
}
.comment-rating, .card-reviews .comment-rating {
margin-bottom: 0.5rem;
}
.comment-user {
margin-bottom:1rem
}
.comment-user h4 {
margin-bottom:1rem;
font-weight:700;
line-height:1;
letter-spacing:0
}
.comment-user h4 a:focus,
.comment-user h4 a:hover {
color:#26c
}
.comment-user h4 span {
display:block
}
.comment-date {
display:block;
margin-bottom:0.5rem;
color:#999;
line-height:1
}
.comments .file-input-wrappers {
display:flex
}
.comments .file-input-wrappers>* {
width:6rem;
height:6rem;
margin-right:1rem;
cursor:zoom-in
}
.comments .file-input-wrappers img {
height:100%
}
@media only screen and (max-width:968px) {
.avg-rating-container mark{
font-size:3rem;
}
.comment-media {
max-width: 2.5rem;
flex: 0 0 2rem;
height: 2rem;
overflow: hidden;
}
.comment-body {
padding: 0rem 0 0 1rem;
}
.comment-rating{
margin-bottom: 0.3rem;
font-size: 13px;
}
.comment-date{
font-size:12px;
margin-bottom:0px;
}
.comment-user{
margin-bottom:0.5rem !important;
}
.comment-content{
font-size:12px;
}
.comment-content p{
font-size:12px;
}
}
/*=============================================================*/
.product-gallery{
display: flex;
flex-wrap: wrap;
gap:10px;
position: sticky;
}
.galerySwiper, .thumbSwiper{
flex-basis: 100%;
max-width: 100%;
}
.product-gallery .galerySwiper{
max-width: calc(100% - 119px);
}
.product-gallery .thumbSwiper {
order: -1;
max-width: 109px;
}

.product-gallery .product-image {
display: block;
overflow: hidden;
position: relative;
height: 100%;
display:flex;
align-items:center;
justify-content:center;
}
.product-gallery .product-image::before {
content: "";
display: block;
padding-top: 100%;
}
.product-gallery .product-image .product-image-item {
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
background: var(--color-gray-100);
}
.product-gallery .product-image .product-image-item img{
width:100%;
height:100%;
object-fit:contain;
transition: all 0.5s;
mix-blend-mode: darken;
}
.thumbSwiper .swiper-slide{
position:relative;
}
.thumbSwiper .swiper-slide::before{
content: "";
transition: border-color 0.3s;
border: 1px solid transparent;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 9;
}
.thumbSwiper .swiper-slide.swiper-slide-thumb-active::before{
border-color:var(--color-primary);
}
@media only screen and (max-width:968px) {
.product-gallery{
position:relative;
display: block;
}
}
/*=============================================================*/
.product-tabs .nav-tabs{
border-bottom: 1px solid var(--color-gray-100) !important;
border-top: 1px solid var(--color-gray-100) !important;
}
.product-tabs .nav-tabs .nav-link {
border: 0px !important;
margin: 0 !important;
font-size: 16px;
padding: 1rem 1rem !important;
}
.product-tabs .nav-tabs .nav-link.active{
color:var(--color-primary) !important;
}
/*=============================================================*/
.noreviews{
width:100%;
height:100%;
display:flex;
align-items:center;
justify-content:center;
padding:50px;
flex-direction:column;
text-align:center;
}
.noreviews .ratings-container{
font-size:24px;
}
/*=============================================================*/
.sidebar .sidebarInner{
width:100%;
position:relative;
}
.sidebarWidget{
background: var(--color-white);
border-radius: 10px;
box-shadow: 0 4px 24px 5px rgba(33,33,33,.06);
position: relative;
width: 100%;
}
.sidebarWidget .sidebarWidgetHeader{
padding:15px;
width:100%;
position:relative;
display:flex;
align-items:center;
justify-content:space-between;
}
.sidebarWidgetHeader .title{
font-size:16px;
margin-bottom:0px;
}
.sidebarWidget .sidebarWidgetBody{
padding:0px 15px 15px 15px;
}
.filterList{
list-style: none;
margin: 0;
padding: 0;
}
.filterList li{
display:flex;
align-items:center;
padding:5px 0px;
}
.filterList input[type=checkbox] {
position: relative;
border-radius: 2px;
background: #bebebe;
cursor: pointer;
line-height: 0;
margin: 0 .6em 0 0;
outline: 0;
padding: 0 !important;
vertical-align: text-top;
height:18px;
width: 18px;
-webkit-appearance: none;
opacity: .5;
}
.filterList input[type=checkbox]:hover {
opacity: 1;
}
.filter-list input[type=checkbox]:checked {
background-color: #000;
opacity: 1;
}
.filterList input[type=checkbox]:before {
content: '';
position: absolute;
right: 50%;
top: 50%;
width: 4px;
height: 10px;
border: solid #bebebe;
border-width: 0 2px 2px 0;
margin: 0;
transform: rotate(45deg) translate(-50%, -50%);
z-index: 2;
}
.range-slider {
width: 100%;
position: relative;
}
.range-slider input[type=range] {
position: absolute;
pointer-events: none;
-webkit-appearance: none;
width: 100%;
height: 5px;
opacity: 1;
}
.slider-track {
position: absolute;
width: 100%;
height: 5px;
background: #ddd;
border-radius: 5px;
top: 50%;
transform: translateY(-50%);
}
.slider-range {
position: absolute;
height: 5px;
background: var(--color-primary);
border-radius: 5px;
top: 50%;
transform: translateY(-50%);
}
.range-slider input[type=range]::-webkit-slider-thumb {
pointer-events: all;
position: relative;
z-index: 1;
-webkit-appearance: none;
height: 14px;
width: 14px;
border-radius: 50%;
background: #ffffff;
border: 2px solid var(--color-primary);
cursor: pointer;
margin-top: -7px; /* Offset to align with track */
}
.range-slider input[type=range]::-moz-range-thumb {
pointer-events: all;
position: relative;
z-index: 1;
-moz-appearance: none;
height: 14px;
width: 14px;
border-radius: 50%;
background: #ffffff;
border: 2px solid var(--color-primary);
cursor: pointer;
}
.price-values{
margin-top:20px;
font-size:14px;
}
/*=============================================================*/
.modal.left .modal-dialog,
.modal.right .modal-dialog {
position: fixed;
margin: auto;
width: 420px;
height: 100%;
-webkit-transform: translate3d(0%, 0, 0);
-ms-transform: translate3d(0%, 0, 0);
-o-transform: translate3d(0%, 0, 0);
transform: translate3d(0%, 0, 0);
}
.modal.left .modal-content,
.modal.right .modal-content {
height: 100%;
overflow-y: auto;
}
/*Left*/
.modal.left.fade .modal-dialog{
left: -320px;
-webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
-moz-transition: opacity 0.3s linear, left 0.3s ease-out;
-o-transition: opacity 0.3s linear, left 0.3s ease-out;
transition: opacity 0.3s linear, left 0.3s ease-out;
}
.modal.left.fade.show .modal-dialog{
left: 0;
}
/*Right*/
.modal.right.fade .modal-dialog {
right: -420px;
-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
-moz-transition: opacity 0.3s linear, right 0.3s ease-out;
-o-transition: opacity 0.3s linear, right 0.3s ease-out;
transition: opacity 0.3s linear, right 0.3s ease-out;
}
.modal.right.fade.show .modal-dialog {
right: 0;
}
/*=============================================================*/
/*=============================================================*/
.sideModal.modal.left .modal-dialog,
.sideModal.modal.right .modal-dialog {
position: fixed;
margin: auto;
width: 320px;
height: 100%;
-webkit-transform: translate3d(0%, 0, 0);
-ms-transform: translate3d(0%, 0, 0);
-o-transform: translate3d(0%, 0, 0);
transform: translate3d(0%, 0, 0);
}
.sideModal.modal.left .modal-content,
.sideModal.modal.right .modal-content {
height: 100%;
overflow-y: auto;
}
/*Left*/
.sideModal.modal.left.fade .modal-dialog{
left: -320px;
-webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
-moz-transition: opacity 0.3s linear, left 0.3s ease-out;
-o-transition: opacity 0.3s linear, left 0.3s ease-out;
transition: opacity 0.3s linear, left 0.3s ease-out;
}
.sideModal.modal.left.fade.show .modal-dialog{
left: 0;
}
.sideModal .modal-content {
background: #fff;
background: var(--color-white);
border: 0;
border-radius: 0;
}
.sideModalHeader{
width:100%;
position:relative;
display:flex;
align-items:center;
padding:10px 15px; 
border-bottom:1px solid var(--color-gray-100);
margin-bottom:10px;
}
.sideModalLogo img{
width:75px;
height:auto;
}
.sideMenu{
width:100%;
position:relative;
}
.sideMenu ul{
margin:0;
padding:0;
list-style:none;
}
.sideMenu ul li{
display:inline-block;
width:100%;
position:relative;
}
.sideMenu ul li .sideMenu-items{
display:flex;
align-items:center;
justify-content:space-between;
height:35px;
padding:0px 15px;
}
.toggle-arrow{
font-size:18px;
}
.sideMenu ul li ul{
margin:0;
padding:0px 0px 0px 15px;
list-style:none;
}
.sideMenu ul li ul li .sideMenu-items{
font-size:12px;
}
.sideMenu ul li ul li .toggle-arrow{
font-size:16px;
}
/*=============================================================*/
.cartModal.modal.left .modal-dialog,
.cartModal.modal.right .modal-dialog {
position: fixed;
margin: auto;
width: 420px;
height: 100%;
-webkit-transform: translate3d(0%, 0, 0);
-ms-transform: translate3d(0%, 0, 0);
-o-transform: translate3d(0%, 0, 0);
transform: translate3d(0%, 0, 0);
}
.cartModal.modal.left .modal-content,
.cartModal.modal.right .modal-content {
height: 100%;
overflow-y: auto;
}
.cartModal.modal.right.fade .modal-dialog {
right: -420px;
-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
-moz-transition: opacity 0.3s linear, right 0.3s ease-out;
-o-transition: opacity 0.3s linear, right 0.3s ease-out;
transition: opacity 0.3s linear, right 0.3s ease-out;
}
.cartModal.modal.right.fade.show .modal-dialog {
right: 0;
}
@media (max-width: 991px){
.cartModal.modal.left .modal-dialog,
.cartModal.modal.right .modal-dialog {
position: fixed;
margin: auto;
width: 350px;
height: 100%;
-webkit-transform: translate3d(0%, 0, 0);
-ms-transform: translate3d(0%, 0, 0);
-o-transform: translate3d(0%, 0, 0);
transform: translate3d(0%, 0, 0);
}
.cartModal.modal.left .modal-content,
.cartModal.modal.right .modal-content {
height: 100%;
overflow-y: auto;
}
.cartModal.modal.right.fade .modal-dialog {
right: -350px;
-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
-moz-transition: opacity 0.3s linear, right 0.3s ease-out;
-o-transition: opacity 0.3s linear, right 0.3s ease-out;
transition: opacity 0.3s linear, right 0.3s ease-out;
}
.cartModal.modal.right.fade.show .modal-dialog {
right: 0;
}	
}
/*=============================================================*/
.addressModal.modal.left .modal-dialog,
.addressModal.modal.right .modal-dialog {
position: fixed;
margin: auto;
width: 420px;
height: 100%;
-webkit-transform: translate3d(0%, 0, 0);
-ms-transform: translate3d(0%, 0, 0);
-o-transform: translate3d(0%, 0, 0);
transform: translate3d(0%, 0, 0);
}
.addressModal.modal.left .modal-content,
.addressModal.modal.right .modal-content {
height: 100%;
overflow-y: auto;
}
.addressModal.modal.right.fade .modal-dialog {
right: -420px;
-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
-moz-transition: opacity 0.3s linear, right 0.3s ease-out;
-o-transition: opacity 0.3s linear, right 0.3s ease-out;
transition: opacity 0.3s linear, right 0.3s ease-out;
}
.addressModal.modal.right.fade.show .modal-dialog {
right: 0;
}
@media (max-width: 991px){
.addressModal.modal.left .modal-dialog,
.addressModal.modal.right .modal-dialog {
position: fixed;
margin: auto;
width: 100%;
height: 100%;
-webkit-transform: translate3d(0%, 0, 0);
-ms-transform: translate3d(0%, 0, 0);
-o-transform: translate3d(0%, 0, 0);
transform: translate3d(0%, 0, 0);
}
.addressModal.modal.left .modal-content,
.addressModal.modal.right .modal-content {
height: 100%;
overflow-y: auto;
}
.addressModal.modal.right.fade .modal-dialog {
right: 0;
-webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
-moz-transition: opacity 0.3s linear, right 0.3s ease-out;
-o-transition: opacity 0.3s linear, right 0.3s ease-out;
transition: opacity 0.3s linear, right 0.3s ease-out;
}
.addressModal.modal.right.fade.show .modal-dialog {
right: 0;
}	
}
/*=============================================================*/
.addressModal .modal-content {
background: #fff;
background: var(--color-white);
border: 0;
border-radius: 0;
}
.addressModal .modal-header{
padding:15px 15px;
border-bottom:1px dotted var(--color-gray-200);
}
.addressModal .modal-title{
font-size:18px;
}
/*=============================================================*/
.cartModal .modal-content {
background: #fff;
background: var(--color-white);
border: 0;
border-radius: 0;
}
.cartModal .modal-header{
padding:15px 15px;
border-bottom:1px dotted var(--color-gray-200);
}
.cartModal .modal-title{
font-size:18px;
}
.cartModal .modal-footer{
border:0px !important;	
justify-content:center;
padding: 15px 15px;
}
.cartModal .modal-footer>div{
margin:0;
width:100%;
}
.cartbox-action-btn{
border-bottom: 2px solid var(--color-primary);
display: inline-block;
margin-bottom: 20px;
}
.cartbox-total{
display:flex;
align-items:center;
justify-content:space-between;
padding:10px 0px;
font-weight:600;
border-bottom:1px solid var(--color-gray-200);
border-top:1px solid var(--color-gray-200);
font-size:16px;
}
.total-price{
font-size:18px;
}
/*=============================================================*/
.cartProduct{
padding:10px 0px;
width:100%;
position:relative;
border-bottom: 1px dotted var(--color-gray-200);
}
.cartProduct:last-child{
border-bottom:0px;
}
.cartProduct .cartProductMedia{
width:75px;
height:75px;
overflow:hidden;
border-radius:5px;
position:relative;
}
.cartProductMedia img{
width:100%;
height:100%;
object-fit:cover;
}
.cartProduct .cartProductDetails{
flex:1;
}
.cartProduct .title{
font-size:14px;
margin-right:25px;
display:inline-block;
line-height:22px;
}
.cartProduct .title a{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.cartProductRemove{
position: absolute;
top: 5px;
right: 0;
font-size: 18px;
}
.cartProduct-footer{
display:flex;
align-items:center;
justify-content:space-between;
margin-top:10px;
}
.cartProduct-price {
display: flex;
flex-wrap: wrap;
font-size: 14px;
font-weight: 600;
line-height: 16px;
flex-direction: column;
}
.cartProduct-price .new-price {
text-decoration: none;
}
.cartProduct-price .old-price {
color: #aaa;
font-weight:500 !important;
font-size:12px;
}
.cartProductqty {
align-content:center;
border:1px solid var(--color-gray-200);
border-radius:5px;
display:flex;
height:30px;
justify-content:space-between;
width:70px;
font-size:14px;
}
.cartProductqty span {
align-items:center;
display:flex;
height:30px;
justify-content:center;
width:100%;
}
/*=============================================================*/
.quickViewModal .modal-dialog{
max-width:1000px;
}
.quickViewModal .modal-content{
overflow:hidden;
border:0px;
}
.quickViewModal .quickViewModalContent{
width:100%;
position:relative;
overflow:hidden;
}
.quickViewModal .modal-close{
position:absolute;
top:5px;
right:10px;
z-index:999;
border:0px;
background:transparent;
font-size:28px;
}
.quickViewModal .product-details{
padding:35px;
}
.quickViewModal .product-details .product-name {
font-size:18px;
line-height:28px;
}
/*=============================================================*/
.couponsModal .couponsModal-header{
padding:20px;
border-bottom:1px dotted var(--color-gray-200);
display:flex;
align-items:center;
justify-content:space-between;
}
.couponsModal-close{
background: transparent;
border: 0px;
font-size: 24px;
padding: 0;
}
.couponsModal .couponModal-search {
width: 100%;
position: relative;
padding:20px;
background:var(--color-gray-100);
}
.couponModal-search input {
width: 100%;
height: 50px;
border: 1px solid #ddd;
border-radius: 5px;
padding: 0px 15px;
}
.couponsModal .couponModal-search button {
position: absolute;
top: 20px;
right: 20px;
height: 50px;
border: 0px;
width: 75px;
background:transparent;
color:var(--color-primary);
}
.apply-coupons-list {
width: 100%;
position: relative;
}
.apply-coupons-list ul {
margin: 0;
padding: 0;
list-style: none;
}
.apply-coupons-list ul li {
display: inline-block;
width: 100%;
position: relative;
border-bottom:1px dotted var(--color-gray-200);
}
.apply-coupons-list ul li .aclbox {
padding:20px;
border-radius: 5px;
position: relative;
width: 100%;
}
.apply-coupons-list ul li .aclbox .aclbox-coupon {
border: 1px dashed var(--color-primary) !important;
display: inline-block;
padding: 3px 10px;
border-radius: 5px;
margin-bottom: 10px;
font-weight: 600;
}
.apply-coupons-list ul li .aclbox .aclbox-apply {
position: absolute;
top: 20px;
right: 20px;
color: var(--color-dark);
cursor: pointer;
}

/*=============================================================*/
.heroSlider{
position:relative;
width:100%;
}
.heroSlider-slide{
position:relative;
width:100%;
height:100%;
overflow:hidden;
}
.heroSlider-slide img{
width:100%;
height:100%;
object-fit:cover;
}
.heroSlider .slick-arrow{
position: absolute;
top: 50%;
right: 0;
left: 0;
height: 48px;
margin-top: -24px;
}
.heroSlider .slick-prev{
left:15px;
}
.heroSlider .slick-next{
right:15px;
left:auto;
}
.heroSlider .slick-prev, .heroSlider .slick-next{
font-size: 0;
line-height: 0;
position: absolute;
z-index: 1;
top: 50%;
display: block;
width: 27px;
height: 27px;
padding: 0;
cursor: pointer;
transition: opacity .2s;
transform: translate(0, -50%);
color: transparent;
border: 0;
outline: none;
background: transparent;
}
.heroSlider .slick-prev::before, .heroSlider .slick-next::before {
font-size: 20px;
position: absolute;
top: 0;
display: -ms-flexbox;
display: flex;
width: 48px;
height: 48px;
transition: .2s;
opacity: 1;
color: #282828;
border-radius: 50%;
background-color: rgba(255, 255, 255, .55);
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: center;
justify-content: center;
}
.heroSlider .slick-prev::before, .heroSlider .slick-next::before {
font-family: 'icon-foxic';
font-size: 27px;
line-height: 1;
transition: .2s;
opacity: 1;
color: #2d2c2c;
}
.heroSlider .slick-prev::before {
left: 0;
padding-right: 2px;
content: '\e907';
}
.heroSlider .slick-next::before {
right: 0;
content: '\e919';
}
.heroSlider .slick-prev:hover:before,
.heroSlider .slick-prev:hover:not(.slick-disabled):before,
.heroSlider .slick-next:hover:before,
.heroSlider .slick-next:hover:not(.slick-disabled):before
{
color:var(--color-white);
background-color:var(--color-primary);
}
.heroSlider .slick-dots{
position: absolute;
bottom: 10px;
display: block;
left: 50%;
width: auto;
margin: 0;
padding: 0;
list-style: none;
text-align: center;
transform: translateX(-50%);
border-radius: 13px;
background-color: rgba(255, 255, 255, .55);
}
.heroSlider .slick-dots li{
position: relative;
display: inline-block;
box-sizing: content-box;
width: 27px;
height: 27px;
margin: 0;
padding: 0;
vertical-align: top;
padding: 0;
cursor: pointer;
pointer-events: all;
}
.heroSlider .slick-dots li:not(.slick-active) button{
margin: 11px auto;
background-color: #282828;
}

.heroSlider .slick-dots li button {
font-size: 0;
line-height: 0;
display: block;
width: 5px;
height: 5px;
margin: 5px;
padding: 0;
cursor: pointer;
transition: .15s;
color: transparent;
border: 0;
border-top-width: 0px;
border-top-style: none;
border-top-color: currentcolor;
border-right-width: 0px;
border-right-style: none;
border-right-color: currentcolor;
border-bottom-width: 0px;
border-bottom-style: none;
border-bottom-color: currentcolor;
border-left-width: 0px;
border-left-style: none;
border-left-color: currentcolor;
border-radius: 50%;
outline: none;
background-color: #bfbfbf;
}
.heroSlider .slick-dots li.slick-active button {
width: 15px;
height: 15px;
margin: 0;
border-width: 2px;
border-style: solid;
border-color: #17c6aa;
background-color: transparent;
}
.heroSlider .slick-dots li.slick-active button{
margin: 6px auto;
}
.heroSlider .swiper-button-next, .heroSlider .swiper-button-prev{
color:var(--color-gray-300)!important;
}
.heroSlider .swiper-button-next:hover, .heroSlider .swiper-button-prev:hover{
color:var(--color-primary) !important;
}
/*=============================================================*/
.cartSection{
position: relative;
z-index: 0;
height:100%;
}
.cartSection:after, .cartSection:before {
position: fixed;
top: 0;
bottom: 0;
left: 0;
background: #ffffff;
content: '';
z-index: 0
}
.cartSection:before { right:auto;}
.cartSection:after {
left: auto;
right: 0;
width: 42.5%;
background: #f4f4f4;
}
.cartSection .container{
position:relative;
z-index:22;
}
.cartSection .cartSectionRight{
padding:25px 0px 25px 25px;
width:100%;
position:relative;
}
.cartSection .cartSectionLeft{
padding:25px 25px 25px 0px;
width:100%;
position:relative;
}
.cartSectionCoupon{
display: flex;
align-items: center;
gap: 10px;
}
.cartSectionCoupon input{
width: 100%;
position: relative;
height: 55px;
border-radius: 5px;
border: 1px solid var(--color-gray-200);
padding: 0px 15px;
}
.cartSectionCoupon button{
height: 55px;
width: 100px;
background: var(--color-primary);
border: 1px solid var(--color-primary);
border-radius: 5px;
color:var(--color-white);
}
.cartSectionPrice{
margin: 0;
padding: 0;
list-style: none;
}
.cartSectionPrice li{
display: flex;
align-items: center;
justify-content: space-between;
height: 30px;
}
.cartSectionPrice li.bigrow{
font-size: 16px;
font-weight: 600;
}
.checkoutProduct{
width: 100%;
position: relative;
display: flex;
margin-bottom: 15px;
gap: 15px;
}
.checkoutProduct .checkoutProductMedia{
display: block;
position: relative;
border-radius: 7px;
width: 75px;
height: 75px;
}
.checkoutProduct .checkoutProductMedia::before {
content: "";
display: block;
padding-top: 115%;
}
.checkoutProduct .checkoutProductMedia .checkoutProductMedia-item {
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
background: var(--color-gray-100);
border-radius: 7px;
}
.checkoutProduct .checkoutProductMedia img{
width: 100%;
height: 100%;
margin: 0 auto;
object-fit: cover;
transition: all 0.5s;
mix-blend-mode: darken;
border-radius: 7px;
}
.checkoutProductContent{
position: relative;
flex: 1;
padding-right: 30px;
}
.checkoutProductContent .title{
font-size: 14px;
margin-bottom: 5px;
line-height: 22px;
margin-top: -5px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.checkoutProduct .price {
display: flex;
align-items: end;
font-weight: 600;
font-size: 16px;
flex-direction: column;
text-align: right;
}
.checkoutProduct .price .new-price {
text-decoration: none;
}
.checkoutProduct .price .old-price {
color: #aaa;
font-size: 12px;
}
.chqty{
position:absolute;
top:-10px;
right:-10px;
width:20px;
height:20px;
background:rgba(255,255,255,0.9);
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
border:1px solid var(--color-gray-200)
}
.cartSectionTitle{
display: flex;
align-items: center;
justify-content: space-between;
}
/*=============================================================*/
.categorySlideBox{
width:100%;
height:100%;
position:relative;
}
.category{
position:relative;
width:100%;
overflow: hidden;
}
.category.cat-style-1{
transition: all 0.5s;
}
.cat-style-1 .category-media{
position: relative;
overflow: hidden;
border-radius: 20px;
}
.category .category-media img{
width: 100%;
height: 100%;
object-fit:cover;
}
.cat-style-1 .category-media img {
-webkit-transition: all 0.5s;
-ms-transition: all 0.5s;
transition: all 0.5s;
}
.cat-style-1:hover .category-media img {
transform: scale(1.2); 
}
.cat-style-1 .category-content {
-webkit-transition: all 0.5s;
-ms-transition: all 0.5s;
transition: all 0.5s;
padding: 13px 20px 10px 20px;
position: absolute;
bottom:0;
left: 0;
width: 85%;
border-radius: 0 20px;
z-index: 1;
background: rgba(255,255,255,0.7);
}
.cat-style-1 .title{
font-size:14px;
margin:0;
}
.cat-style-1 .title a{
display:block;
}
.cat-style-2 .category-media{
position: relative;
overflow: hidden;
border-radius: 50%;
}
.cat-style-2 .category-media img {
transition: transform 0.3s;
}
.cat-style-2:hover .category-media img {
transform: scale(0.9);
}
.cat-style-2 .category-content {
padding:10px;
width:100%;
position:relative;
text-align:center;
}
.cat-style-2 .title{
font-size:16px;
margin:0;
}
.cat-style-2 .title a{
display:block;
}
.category.cat-style-3{
transition: all 0.5s;
position:relative;
}
.category.cat-style-3 a{
color:var(--color-white);
}
.cat-style-3 .category-media{
position: relative;
overflow: hidden;
border-radius:5px;
}
.cat-style-3 .category-media img{
transition: transform 0.4s cubic-bezier(0.83, 0.26, 0.19, 0.87), -webkit-transform 0.4s cubic-bezier(0.83, 0.26, 0.19, 0.87);
height: auto;
max-width: 100%;
border: none;
border-radius: 0;
box-shadow: none;
}
.cat-style-3 .category-content{
position: absolute;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
width: 100%;
height: 100%;
top: 0;
left: 0;
padding: .9375rem;
z-index: 1
}
.cat-style-3 .title{
font-size:18px;
margin:0;
}
.cat-style-3 .title a{
display:block;
}
.cat-style-3 .category-content .button-text {
font-size: 12px;
font-weight: 600;
text-transform: uppercase;
padding:10px 0px 0px;
border-bottom: 1px solid;
}
.catSlider{
position:relative;
}
.catSlider .slick-dots {
position: absolute;
bottom: -25px;
display: block;
width: 100%;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
}
.catSlider .slick-dots li{
position: relative;
display: inline-block;
width: 20px;
height: 20px;
margin: 0 5px;
padding: 0;
cursor: pointer;
}
.catSlider .slick-dots li button{
font-size: 0;
line-height: 0;
display: block;
width: 20px;
height: 20px;
padding: 5px;
cursor: pointer;
color: transparent;
border: 0;
outline: none;
background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus{
outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before{
opacity: 1;
}
.slick-dots li button:before{
font-family: 'slick';
font-size: 42px;
line-height: 20px;
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 20px;
content: '•';
text-align: center;
opacity: .25;
color: var(--color-primary);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before{
opacity: .75;
color: var(--color-primary);
}
@media (max-width: 991px){
.cat-style-2 .title {
font-size: 12px;
margin: 0;
}
.cat-style-2 .category-content{
padding: 5px 0px 0px 0px;
}
}
/*=============================================================*/

/*=============================================================*/
/*=============================================================*/
.subHeader{
width:100%;
position:relative;
background:var(--color-gray-100);
padding:25px 0px;
text-align:center;
}
.subHeader .breadcrumb{
margin:0;
justify-content: center;
}
/*=============================================================*/
.noImg{
width:100%;
position:relative;
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
text-align:center;
padding:50px;
}
/*=============================================================*/
.cartRemove.loader {
width: 100%;
height: 100%;
display:flex;
align-items:center;
justify-content:center;
position:absolute;
left:0;
top:0;
background:rgba(0,0,0,0.4);
}
#loader span{
display: inline-block;
width: 10px;
height: 10px;
border-radius: 100%;
background-color: #fff;
margin:0px 3px;
}
#loader span:nth-child(1){
animation: bounce 1s ease-in-out infinite;
}
#loader span:nth-child(2){
animation: bounce 1s ease-in-out 0.33s infinite;
}
#loader span:nth-child(3){
animation: bounce 1s ease-in-out 0.66s infinite;
}
@keyframes bounce{
0%, 75%, 100%{
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
transform: translateY(0);
}
25%{
-webkit-transform: translateY(-7px);
-ms-transform: translateY(-7px);
-o-transform: translateY(-7px);
transform: translateY(-7px);
}
}
/*=============================================================*/
.accountSubheader{
width:100%;
position:relative;
padding: 40px 0px;
}
.accountSubheader::before{
content: "";
background: url(../../img/ecomdoodle.jpg);
background-size: auto;
background-size: 15%;
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
opacity: 0.3;
}
.accountSubheader .accountSubheader-inner{
position:relative;
}
.aionBox{
display:flex;
align-items:center;
padding:15px;
border:1px solid var(--color-gray-200);
border-radius:10px;
margin-bottom:5px;
}
.aionBox .aionBoxIcon{
width:60px;
height:60px;
overflow:hidden;
background:var(--color-gray-100);
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
}
.aionBox .aionBoxIcon img{
width:42px;
height:42px;
}
.aionBox .aionBoxContent{
flex:1;
}
/*=============================================================*/
.step-by {
display: flex;
justify-content: center;
flex-wrap: wrap;
padding: 10px;
}
.step-by .title-step {
margin: 0 3.8rem 0 0rem;
margin-left: 1rem;
font-size: 14px;
text-transform: uppercase;
padding: .4rem 0;
position: relative;
}
.step-by .title-step:first-child {
margin-left: 0;
}
.step-by .title-step.active a {
color: var(--color-primary) !important;
}
.title-simple {
display: block;
}
.step-by .title-step:not(:last-child)::after {
content: '\ea6e';
display: inline-block;
position: absolute;
right: -3rem;
top:50%;
line-height: 0;
vertical-align: middle;
font-family: remixicon !important;
font-style: normal;
-webkit-font-smoothing: antialiased;
font-size: 1.5rem;
background-color: #fff;
color: #ccc;
}
.secure-img {
width: 125px;
}
@media only screen and (max-width:968px) {
.secure-img {
width: 100px;
}	
}
/*=============================================================*/
.checkoutSection{
display: grid;
grid-template-columns:60% 40%;
grid-template-areas:"left""right";
}
.checkoutSection .checkoutSectionLeft{
padding:25px 25px 25px 0px
}
.checkoutSection .checkoutSectionRight{
border-left:1px solid var(--color-gray-100);
position: sticky;
width:100%;
padding:25px 0px 25px 25px;
}
.checkProduct{
border:1px solid var(--color-gray-100);
padding:15px;
width:100%;
position:relative;
margin-top:15px;
display:flex;
border-radius:10px;
gap:15px;
}
.checkProduct figure{
display: block;
overflow: hidden;
position: relative;
width: 120px;
height:120px;
border-radius:10px;
}
.checkProduct figure::before {
content: "";
display: block;
padding-top: 115%;
}
.checkProduct .checkProductMedia{
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
background: var(--color-gray-100);
}
.checkProduct .checkProductMedia img {
width: 100%;
height: 100%;
margin: 0 auto;
object-fit: cover;
transition: all 0.5s;
mix-blend-mode: darken;
}
.checkProductContent{
flex:1;
position:relative;
}
.checkProductContent .title{
font-size:14px;
line-height:24px;
}
.checkProductContent .title a{
display:inline-block;
}
.checkProduct .checkProductFooter{
display:flex;
align-items:center;
justify-content:space-between;
position:relative;
margin-top:20px;
}
.checkwishlist{
width:24px;
height:24px;
font-size:24px;
}
.checkProduct .product-price{
font-size:16px;
justify-content: flex-start;
font-weight:700;
margin-bottom:0px;
}
.checkremove{
display:flex;
align-items:center;
gap:5px;
}
.applycouponsbox{
padding:15px 20px;
width:100%;
position:relative;
border:1px solid var(--color-gray-100);
display:flex;
align-items:center;
gap:10px;
cursor:pointer;
border-radius:10px;
margin-bottom:15px;
}
.cartSummary{
width:100%;
border:1px solid var(--color-gray-100);
border-radius:10px;
}
.cartSummary .cartSummaryHeader{
padding:20px 20px 0px 20px;	
}
.cartSummary .cartSummaryBody{
padding:20px;
}
.cartSummary ul{
margin:0;
padding:0;
list-style:none;
}
.cartSummary ul li{
display:flex;
align-items:center;
justify-content:space-between;
height:35px;
}
@media only screen and (max-width:968px) {
.cart-title{
display:none;
}
.checkProduct{
margin-top:0px;
border:0px;
border-radius:0px;
border-bottom:3px solid var(--color-gray-100);
}
.checkProduct figure{
width:75px;
height:75px;
}
.checkProductContent .title a{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.checkProduct .product-price {
font-size: 14px;
font-weight: 600;
}
.applycouponsbox {
padding: 15px;
border:0px;
border-radius: 0px;
border-bottom:3px solid var(--color-gray-100);
height:70px;
margin-bottom:0px;
}
.cartSummary{
border:0px;
}
.cartSummary .cartSummaryHeader {
padding: 15px 15px 0px 15px;
}
.cartSummary .cartSummaryBody {
padding: 15px;
}
}
/*=============================================================*/
/*=============================================================*/
.couponPopup{
width:100%;
height:100%;
position:fixed;
top:0;
left:0;
background:rgba(0,0,0,0.5);
z-index:9999;
}
.couponPopup .couponPopup-inner{
display:flex;
align-items:center;
justify-content:center;
width:100%;
height:100%;
}
.couponPopup .couponPopupBox{
max-width:350px;
width:100%;
height:300px;
background:var(--color-white);
border-radius:10px;
padding:50px;
text-align:center;
display:flex;
align-items:center;
justify-content:center;
position:relative;
}
.couponbutton{
background:transparent;
border:0px;
color:var(--color-primary);
font-size:16px;
font-weight:700;
}
.coupon-close{
background:transparent;
border:0px;
font-size:24px;
position:absolute;
top:10px;
right:15px;	
}
/*=============================================================*/
.ordersummaryToggle {
position: relative;
width: 100%;
}
.ordersummaryToggle .ordersummaryToggleHed{
align-items: center;
background: var(--color-white);
border-bottom:1px solid var(--color-gray-200);
display: flex;
justify-content: space-between;
padding: 15px;
position: relative;
width: 100%;
}
.ordersummaryToggleHed i{
font-size:20px;
}
.ordersummaryToggle .ordersummaryTogglecont {
background: var(--color-white);
border-bottom:1px solid var(--color-gray-200);
}
/*=============================================================*/
.reviews-card {
display: flex;
width: 100%;
min-height: 297px;
background-color: #fff;
padding: 24px;
margin: auto 0;
cursor: grab;
border: 1px solid var(--color-gray-200);
border-radius: 6px;
}
.reviews-card .reviews-card-inner{
display: flex;
flex-direction: column;
flex-grow: 1;
justify-content: space-between;
width: 100%;
}
.reviews-card .reviews-card-info{
display:flex;
align-items:center;
justify-content:space-between;
width:100%;
position:relative;
}
.reviews-card .ratings-container{
font-size:22px;
margin-top: 10px;
margin-left:-1px;
}
.reviews-card .review-content{
margin-top: 5px;
flex-grow: 1;
font-size: 14px;
line-height: 24px;
}
.reviews-card .reviews-product{
display: flex;
align-items: center;
height: 42px;
cursor: pointer;
gap:10px;
}
.reviews-card .reviews-product img{
width:42px;
height:42px;
border-radius:5px;
object-fit:cover;
}
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
/*=============================================================*/
.loginsection{
max-width: 700px;
position:relative;
border-radius:10px;
overflow:hidden;
box-shadow:rgba(33, 33, 33, .06) 0 4px 24px 5px;
margin:0 auto;
background:var(--color-white);
}
/*=============================================================*/
@font-face {
font-family:"riode";
src:url("../fonts/riode.eot?5gap68");
src:url("../fonts/riode.eot?5gap68#iefix") format("embedded-opentype"),
url("../fonts/riode.ttf?5gap68") format("truetype"),
url("../fonts/riode.woff?5gap68") format("woff"),
url("../fonts/riode.svg?5gap68#riode") format("svg");
font-weight:normal;
font-style:normal;
font-display:block
}
[class*=" d-icon-"],
[class^=d-icon-] {
display:inline-block;
line-height:1
}
[class*=" d-icon-"]:before,
[class^=d-icon-]:before {
font-family:"riode"!important;
speak:never;
font-style:normal;
font-weight:normal;
font-variant:normal;
text-transform:none;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale
}
.d-icon-truck:before {
content:""
}
.d-icon-service:before {
content:""
}
.d-icon-secure:before {
content:""
}
.d-icon-lock:before {
content:""
}
.d-icon-percent:before {
content:""
}
.d-icon-layer:before {
content:""
}
.d-icon-alert:before {
content:""
}
.d-icon-database:before {
content:""
}
.d-icon-money:before {
content:""
}
.d-icon-shoppingbag:before {
content:""
}
.d-icon-t-shirt1:before {
content:""
}
.d-icon-t-shirt2:before {
content:""
}
.d-icon-hat:before {
content:""
}
.d-icon-officebag:before {
content:""
}
.d-icon-handbag:before {
content:""
}
.d-icon-backpack:before {
content:""
}
.d-icon-shoes:before {
content:""
}
.d-icon-pillow:before {
content:""
}
.d-icon-dress:before {
content:""
}
.d-icon-loungewear:before {
content:""
}
.d-icon-desktop:before {
content:""
}
.d-icon-laptop:before {
content:""
}
.d-icon-gamepad1:before {
content:""
}
.d-icon-wireless:before {
content:""
}
.d-icon-projector:before {
content:""
}
.d-icon-drone1:before {
content:""
}
.d-icon-drone2:before {
content:""
}
.d-icon-radio:before {
content:""
}
.d-icon-battery:before {
content:""
}
.d-icon-plugin:before {
content:""
}
.d-icon-memory:before {
content:""
}
.d-icon-ball:before {
content:""
}
.d-icon-basketball1:before {
content:""
}
.d-icon-babycare:before {
content:""
}
.d-icon-card:before {
content:""
}
.d-icon-gamepad2:before {
content:""
}
.d-icon-camera1:before {
content:""
}
.d-icon-camera2:before {
content:""
}
.d-icon-babywear:before {
content:""
}
.d-icon-abacus:before {
content:""
}
.d-icon-pot:before {
content:""
}
.d-icon-freezer:before {
content:""
}
.d-icon-cook:before {
content:""
}
.d-icon-student:before {
content:""
}
.d-icon-category:before {
content:""
}
.d-icon-basketball2:before {
content:""
}
.d-icon-watch:before {
content:""
}
.d-icon-tcard:before {
content:""
}
.d-icon-heartbeat:before {
content:""
}
.d-icon-watch-round:before {
content:""
}
.d-icon-washbowl:before {
content:""
}
.d-icon-bridge-lamp:before {
content:""
}
.d-icon-lamp:before {
content:""
}
.d-icon-sofa:before {
content:""
}
.d-icon-sofa2:before {
content:""
}
.d-icon-bed:before {
content:""
}
.d-icon-table:before {
content:""
}
.d-icon-table-lamp:before {
content:""
}
.d-icon-table-tv:before {
content:""
}
.d-icon-mirror:before {
content:""
}
.d-icon-volume:before {
content:""
}
.d-icon-bars2:before {
content:""
}
.d-icon-bars:before {
content:""
}
.d-icon-phone:before {
content:""
}
.d-icon-user:before {
content:""
}
.d-icon-search:before {
content:""
}
.d-icon-search2:before {
content:""
}
.d-icon-bag:before {
content:""
}
.d-icon-map:before {
content:""
}
.d-icon-info:before {
content:""
}
.d-icon-refresh:before {
content:""
}
.d-icon-left-arrow:before {
content:""
}
.d-icon-right-arrow:before {
content:""
}
.d-icon-down-arrow:before {
content:""
}
.d-icon-up-arrow:before {
content:""
}
.d-icon-ruler:before {
content:""
}
.d-icon-zoom:before {
content:""
}
.d-icon-right-circle:before {
content:""
}
.d-icon-left-circle:before {
content:""
}
.d-icon-up-circle:before {
content:""
}
.d-icon-down-circle:before {
content:""
}
.d-icon-angle-right:before {
content:""
}
.d-icon-angle-left:before {
content:""
}
.d-icon-angle-up:before {
content:""
}
.d-icon-angle-down:before {
content:""
}
.d-icon-star:before {
content:""
}
.d-icon-star-full:before {
content:""
}
.d-icon-heart:before {
content:""
}
.d-icon-heart-full:before {
content:""
}
.d-icon-close:before {
content:""
}
.d-icon-play-circle:before {
content:""
}
.d-icon-home:before {
content:""
}
.d-icon-filter-2:before {
content:""
}
.d-icon-switch:before {
content:""
}
.d-icon-switch-left-on:before {
content:""
}
.d-icon-switch-right-on:before {
content:""
}
.d-icon-filter-3:before {
content:""
}
.d-icon-check:before {
content:""
}
.d-icon-alert-solid:before {
content:""
}
.d-icon-headphone:before {
content:""
}
.d-icon-mode-grid:before {
content:""
}
.d-icon-mode-list:before {
content:""
}
.d-icon-cancel:before {
content:""
}
.d-icon-instagram:before {
content:""
}
.d-icon-solid-check:before {
content:""
}
.d-icon-play-solid:before {
content:""
}
.d-icon-mobile:before {
content:""
}
.d-icon-minus:before {
content:""
}
.d-icon-plus:before {
content:""
}
.d-icon-wifi:before {
content:""
}
.d-icon-times:before {
content:""
}
.d-icon-times-circle:before {
content:""
}
.d-icon-random:before {
content:""
}
.d-icon-th-list:before {
content:""
}
.d-icon-rocket:before {
content:""
}
.d-icon-map-marker:before {
content:""
}
.d-icon-birthday-cake:before {
content:""
}
.d-icon-gift:before {
content:""
}
.d-icon-female:before {
content:""
}
.d-icon-clock:before {
content:""
}
.d-icon-comments:before {
content:""
}
.d-icon-rotate-left:before {
content:""
}
.d-icon-rotate-right:before {
content:""
}
.d-icon-reading:before {
content:""
}
.d-icon-feeder:before {
content:""
}
.d-icon-birthday-cake2:before {
content:""
}
.d-icon-skirt:before {
content:""
}
.d-icon-toy:before {
content:""
}
.d-icon-butterfly:before {
content:""
}
.d-icon-babycare2:before {
content:""
}
.d-icon-butterfly2:before {
content:""
}
.d-icon-dinner-set:before {
content:""
}
.d-icon-ball2:before {
content:""
}
.d-icon-apple:before {
content:""
}
.d-icon-icecream:before {
content:""
}
.d-icon-cake:before {
content:""
}
.d-icon-meat:before {
content:""
}
.d-icon-bread:before {
content:""
}
.d-icon-cocktail:before {
content:""
}
.d-icon-food:before {
content:""
}
.d-icon-birthday-cake3:before {
content:""
}
.d-icon-cash:before {
content:""
}
.d-icon-service2:before {
content:""
}
.d-icon-car:before {
content:""
}
.d-icon-ball3:before {
content:""
}
.d-icon-compare:before {
content:""
}
.d-icon-jar:before {
content:""
}
.d-icon-radish:before {
content:""
}
.d-icon-arrow-down:before {
content:""
}
.d-icon-arrow-left:before {
content:""
}
.d-icon-arrow-right:before {
content:""
}
.d-icon-arrow-up:before {
content:""
}
.d-icon-earth:before {
content:""
}
.d-icon-long-arrow-left:before {
content:""
}
.d-icon-long-arrow-right:before {
content:""
}
.d-icon-long-arrow-down:before {
content:""
}
.d-icon-long-arrow-up:before {
content:""
}
.d-icon-pill:before {
content:""
}
.d-icon-cylinder:before {
content:""
}
.d-icon-medical-bag:before {
content:""
}
.d-icon-graph:before {
content:""
}
/*=============================================================*/
.thankusection{
width:100%;
display:flex;
align-items:center;
height:100%;
left:0;
top:0;
}
.thankusection .thankusection-left{
width:65%;
position:relative;
height:100%;
padding:50px 10px 50px 100px;
}
.thankusection .thankusection-right{
width:35%;
position:relative;
height:100%;
background:var(--color-black-light);
padding:50px 30px;
}
.tsleft-header{
width:100%;
position:relative;
display:flex;
align-items:center;
}
.tsleft-header-icon{
width:65px;
height:65px;
}
.tsleft-header-icon img{
width:65px;
height:65px;
border-radius:50%;
}
.tsleft-header-text{
flex:1;
padding-left:15px;
}
.tsleft-box{
width:100%;
position:relative;
border-radius:5px;
background:var(--color-light02);
}
.tsleft-box .tsleft-box-header{
padding:15px;
border-bottom:1px solid var(--color-black-light-02);
}
.tsleft-box .tsleft-box-body{
padding:15px;
}
.thankusection-footer{
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
}
@media (max-width: 991px){
.thankusection{
flex-direction: column;
padding: 15px;
}
.thankusection .thankusection-left{
width:100%;
position:relative;
height:auto;
padding: 0;
}
.thankusection .thankusection-right{
width:100%;
position:relative;
height:auto;
padding: 0;
background:var(--color-black);
margin-top: 0px;
}
.thankusection .cartsec{
padding: 10px 0px;
border-bottom: 1px solid var(--color-black-light-02);
}
.thankusection-footer{
flex-direction: column;
}
.tsleft-header{
width:100%;
position:relative;
display:flex;
align-items:center;
flex-direction: column;
justify-content: center;
text-align: center;
}
.tsleft-header-text{
flex:1;
padding-left:0px;
margin-top: 20px;
}
}
/*================================================*/
.edu-blog{
width:100%;
position:relative;
}
.edu-blog .thumbnail {
position: relative;
}
.edu-blog .thumbnail a {
width:100%;
height:300px;
display: block;
border-radius: 10px;
position: relative;
overflow: hidden;
}
.edu-blog .thumbnail a:after {
content: "";
height: 100%;
width: 100%;
background-color: rgba(0, 0, 0, 0.5);
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
visibility: hidden;
opacity: 0;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.edu-blog .thumbnail a img {
width: 100%;
height:100%;
object-fit:cover;
border-radius: 10px;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.edu-blog:hover .thumbnail a:after {
visibility: visible;
opacity: 1;
}
.edu-blog:hover .thumbnail a img {
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
.edu-blog .content {
background-color: var(--color-white);
padding: 15px 0px;
border-radius: 10px;
position: relative;
box-shadow: var(--shadow-darker);
}
.edu-blog .content .title {
margin-bottom: 10px;
margin-top: 10px;
font-size:16px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
line-height:26px;
}
.edu-blog .content p {
margin-bottom: 0;
}
/*================================================*/
.blog-meta {
margin:0;
padding:0;
list-style:none;
display:flex;
align-items:center;
gap:20px;
}
.blog-meta li {
position: relative;
display:flex;
align-items:center;
gap:10px;
}
.blog-meta li:last-child:after {
display: none;
}
.blog-meta li:after {
content: "";
height: 19px;
width: 1px;
background-color: #dbdbdb;
position: absolute;
top: 3px;
right: -18px;
}
/*================================================*/
.blogDetails{
width:100%;
position:relative;
}
.blogDetails img{
max-width:100%;
}
.blogDetails .blog-media{
width:100%;
position:relative;
height:400px;
border-radius:10px;
overflow:hidden;
}
.blogDetails .blog-media img{
width:100%;
height:100%;
object-fit:cover;
}
.blogDetails .blogDetailsContent{
padding:20px 0px;
}
.blogDetails .title{
font-size:18px;
}
.edu-blog-sidebar {
background-color: var(--color-white);
box-shadow: 0px 10px 50px 0px rgba(26, 46, 85, 0.07);
border-radius: 5px;
padding:20px;
}
.edu-blog-widget .widget-title {
margin-bottom: 25px;
}
.latest-post{
width:100%;
position:relative;
display:flex;
gap:15px;
margin-bottom:15px;
}
.latest-post:last-child{
margin-bottom:0px;
}
.latest-post .thumbnail{
width:75px;
height:75px;
border-radius:10px;
overflow:hidden;
}
.latest-post .thumbnail img{
width:100%;
height:100%;
object-fit:cover;
}
.latest-post .post-content{
flex:1;
}
.post-content .title{
font-size:14px;
line-height:22px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
/*================================================*/
.testimonial-carousel-slider .swiper-slide{
padding-bottom:10px;
}
.testimonial-grid {
border:1px solid var(--color-gray-200);
background-color: var(--color-white);
border-radius: 10px;
padding: 25px;
position: relative;
z-index: 1;
overflow: hidden;
}
.testimonial-grid .thumbnail {
display: inline-block;
position: relative;
margin-bottom: 25px;
}
.testimonial-grid .thumbnail img {
border-radius: 50%;
width:75px;
height:75px;
object-fit:cover;
}
.testimonial-grid .thumbnail .qoute-icon {
height: 34px;
width: 34px;
line-height: 30px;
font-size: 13px;
color: var(--color-white);
background-color: var(--color-primary);
border-radius: 50%;
border: 4px solid var(--color-white);
display: block;
text-align: center;
position: absolute;
bottom: -8px;
right: -12px;
}
.testimonial-grid .content p {
margin-bottom: 20px;
font-size: 14px;
line-height: 24px;
}
.testimonial-grid .content .rating-icon {
margin-bottom: 10px;
}
.testimonial-grid .content .rating-icon i {
color: #f8b81f;
}
.testimonial-grid .content .title {
font-weight: var(--p-medium);
margin-bottom: 2px;
}
.testimonial-grid .content .title {
margin-bottom:5px;
font-size:16px;
}
.testimonial-grid .content .subtitle {
font-size:14px;
}
.testimonial-grid .content .desc{
min-height:150px;
}
.testimonial-grid .content .desc p{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
}
/*================================================*/
.testimonial-slide .content {
background-color: var(--color-white);
border:1px solid var(--color-gray-200);
padding: 25px;
border-radius: 10px;
}
.testimonial-slide .content p {
font-size: 14px;
margin-bottom: 15px;
line-height: 24px;
}
.testimonial-slide .content .desc p{
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
}
.testimonial-slide .ratings-container {
font-size:20px;
}
.testimonial-slide .author-info {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.testimonial-slide .author-info .thumb {
margin-right: 20px;
}
.testimonial-slide .author-info .thumb img {
border-radius: 50%;
width:75px;
height:75px;
object-fit:cover;
}
.testimonial-slide .author-info .info {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
}
.testimonial-slide .author-info .info .title {
margin-bottom: 0;
font-size:16px;
}
.testimonial-slide .author-info .info .subtitle {
font-size:13px;
}
.testimonial-grid-second {
border:0px;
background-color: transparent;
box-shadow: none;
border-radius: 5px;
text-align: center;
padding: 40px 0px 80px;
}
.testimonial-grid-second .ratings-container{
justify-content:center;
font-size:24px;
}
.testimonial-thumbs {
margin: -56px auto 0;
max-width: 320px;
text-align: center;
width: 100%;
}

.testimonial-thumbs .nav-thumb .clint-thumb {
background: none;
-webkit-transform: scale(0.6667);
-ms-transform: scale(0.6667);
transform: scale(0.6667);
-webkit-transition: all .5s ease 0s;
transition: all .5s ease 0s;
}

.testimonial-thumbs .nav-thumb .clint-thumb img {
border-radius: 50%;
height: auto;
max-width: 100%;
width: 100%;
vertical-align: top;
cursor: pointer;
}

.testimonial-thumbs .nav-thumb.swiper-slide-active .clint-thumb {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
border-radius: 50%;
}

.testimonial-thumbs .swiper-slide {
padding: 0;
opacity: 0;
visibility: hidden;
}

.testimonial-thumbs .swiper-slide.swiper-slide-prev, .testimonial-thumbs .swiper-slide.swiper-slide-active, .testimonial-thumbs .swiper-slide.swiper-slide-next {
opacity: 1;
visibility: visible;
}
/*================================================*/
.banner-left-icon {
position: relative;
background: #F4F6FA;
padding: 20px;
border-radius: 10px;
display: flex !important;
align-items: center !important;
}
.banner-left-icon .banner-icon {
max-width: 60px;
margin-right: 20px;
transition-duration: 0.3s;
}
.banner-left-icon .banner-icon img {
border: none;
border-radius: 0;
box-shadow: none;
height: auto;
max-width: 100%;
}
.banner-left-icon .banner-text h3 {
font-size: 16px;
font-weight: 600;
margin-bottom: 5px;
}
.banner-left-icon .banner-text p {
margin-bottom: 0;
color: var(--color-gray-500);
font-size:12px;
}
@media (max-width: 991px){
.banner-left-icon{
flex-direction: column;
justify-content: center;
text-align: center;
}	
.banner-left-icon .banner-icon{
margin-right:0px;
margin-bottom:10px;
}
.banner-left-icon .banner-text h3 {
font-size: 14px;
font-weight: 600;
margin-bottom: 5px;
}
.banner-left-icon .banner-text p {
margin-bottom: 0;
color: var(--color-gray-500);
font-size: 12px;
}
}
/*================================================*/
.appBottomMenu{
display:none;
}
@media (max-width: 991px){
.appBottomMenu {
position: fixed;
z-index: 999;
bottom: 0;
left: 0;
right: 0;
background: var(--color-white);
display: flex;
align-items: center;
justify-content: center;
border-top: 1px solid var(--color-gray-200);
min-height: 56px;
}
.appBottomMenu .item {
font-size: 12px;
letter-spacing: 0;
text-align: center;
width: 100%;
height: 56px;
line-height: 1.2em;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.appBottomMenu .item .col {
width: 100%;
padding: 0 4px;
text-align: center;
}
.appBottomMenu .item i {
display: inline-flex;
margin: 1px auto 3px auto;
font-size: 24px;
line-height: 1em;
transition: none;
display: block;
margin-top: 1px;
margin-bottom: 3px;
}
.appBottomMenu .item.active:before {
background: transparent;
}
.appBottomMenu .item.active {
color: var(--color-primary) !important;
}
.appBottomMenu .item.active i {
color: var(--color-primary) !important;
font-weight: 500;
}
}
/*================================================*/
.footer-list{
margin: 0;
padding: 0;
list-style: none;
}
.footer-list li{
display: inline-block;
width: 100%;
position: relative;
}
.footer-list li a{
line-height: 32px;
}
.footer-list-second{
margin: 0;
padding: 0;
list-style: none;
display: flex;
align-items: center;
flex-wrap: wrap;
}
.footer-list-second li{
display: inline-block;
width: 50%;
position: relative;
}
.footer-list-second li a{
line-height: 32px;
}
.footerContact{
margin: 0;
padding: 0;
list-style: none;
}
.footerContact li{
display: inline-block;
width: 100%;
position: relative;
margin-bottom: 20px;
}
.footerContact li .fcbix{
display: flex;
align-items:center;
}
.fcbix .fcbix-icon{
margin-right: 15px;
}
.fcbix .fcbix-icon i{
font-size: 2rem;
}
.fcbix .fcbix-text{
flex:1;
}
.social-footer{
margin: 0;
padding: 0;
list-style: none;
display: flex;
align-items: center;
gap: 10px;
}
.social-footer li a{
background: var(--color-white);
width: 40px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 5px;
}
.social-footer li a i{
font-size: 1.2rem;
}
.downloadbutton{
width: 100%;
position: relative;
display: flex;
align-items: center;
gap: 10px;
}
.downloadbutton img{
width: 100%;
}
/*================================================*/
.catlistaccordation{
width: 100%;
position: relative;
}
.catlistaccordation .catlistaccordHeader{
display: flex;
align-items: center;
padding: 10px 15px;
border-bottom: 1px dashed var(--color-gray-200);
justify-content: space-between;
}
.catlistaccordHeadermc{
display: flex;
align-items: center;
}
.catlistaccordHeadermc .catlistaccordHeadermc-media{
width: 50px;
height: 50px;
border-radius: 10px;
background: var(--color-gray-100);
padding: 5px;
}
.catlistaccordHeadermc-media img{
height: 100%;
mix-blend-mode: darken;
object-fit: contain;
width: 100%;
}
.catlistaccordHeadermc-content{
flex: 1;
margin-left: 15px;
}
.catlistaccordContent{
width: 100%;
position: relative;
border-bottom: 1px dashed var(--color-gray-200);
}
.catlistaccordContent ul{
margin: 0;
padding: 0;
list-style: none;
}
.catlistaccordContent ul li{
display: flex;
align-items: center;
justify-content: space-between;
padding:10px 15px;
}
.catlistaccordContent ul li .ccMediabox{
display: flex;
align-items: center;
}
.ccMediabox .ccMediaboxIcon{
width: 50px;
height: 50px;
overflow: hidden;
border-radius: 10px;
margin-right: 10px;
border: 1px solid var(--color-gray-200);
}
.ccMediaboxIcon img{
width: 100%;
height: 100%;
object-fit: cover;
}
/*================================================*/
/*================================================*/
/*================================================*/
/*================================================*/
/*================================================*/
/*================================================*/