@import url(variable.css);
@import url(bootstrap.min.css);
@import url(all.min.css);
@import url(owl.theme.default.min.css);
@import url(owl.carousel.min.css);
@import url(fonts.css);

/* Basic Style Start */
body, h1, h2, h3, h4, h5, h6, p, ul, ol {
  margin: 0px;
  padding: 0px;
}
body {
  font-family: var(--Font-Regular);
  box-sizing: border-box;
  color: var(--primary-1);
  /* modal open - body scroll hide/show issue */
  overflow-y: overlay;
}
a {
  text-decoration: none;
  cursor: pointer;
  color: var(--black);
}
a:-webkit-any-link:focus-visible{
  outline: none;
}
ul {
  list-style: none;
}
.all-section-space{
  margin-bottom: 30px;
}
.flex-box{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  box-sizing: border-box;
}
.flex-box > div{
  position: relative;
  flex: 0 0 auto;
  min-height: 1px;
  box-sizing: border-box;
}

.justify-content-center{
  justify-content: center;
}
.align-content-center{
  align-content: center;
}
label{
  font-size: var(--fs-16);
  line-height: 18px;
  font-family: var(--Font-Regular);
  color: var(--primary-1);
  font-weight: normal;
}
.form-group{
  margin-bottom: 0px;
}
/* Basic Style End */

/* Comman Relative Style CSS Start */
.cmn-pl-pr{
  padding-left: 9.5%;
  padding-right: 9.5%;
}
.cmn-pt-pb{
  padding-top: 100px;
  padding-bottom: 70px;
}
.cmn-pt-160{
  padding-top: 160px;
}
.bg-white{
  background-color: var(--white);
}
.bg-primary-1{
  background-color: var(--primary-1);
}
.bg-secondary-1{
  background-color: var(--secondary-1);
}
.bg-secondary-7{
  background-color: var(--secondary-7);
}
.bg-secondary-9{
  background-color: var(--secondary-9);
}
.bg-secondary-10{
  background-color: var(--secondary-10);
}
.bg-secondary-11{
  background-color: var(--secondary-11);
}
.bg-secondary-15{
  background-color: var(--secondary-15);
}
.bg-secondary-16{
  background-color: var(--secondary-16);
}
.bg-secondary-17{
  background-color: var(--secondary-17);
}
.bg-secondary-25{
  background-color: var(--secondary-25);
}
.text-secondary-29{
  color: var(--secondary-29) !important;
}
.text-white{
  color: var(--white);
}
h1{
  font-size: var(--fs-60);
  font-family: var(--Font-Bold);
}
h2{
  font-size: var(--fs-50);
  font-family: var(--Font-Semi-Bold);
}
h3{
  font-size: var(--fs-40);
  font-family: var(--Font-Semi-Bold);
}
h4{
  font-size: var(--fs-18);
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
}
h5{
  font-size: var(--fs-18);
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
}
h6{
  font-size: var(--fs-30);
  font-family: var(--Font-Bold);
  color: var(--primary-1);
}
.paragraph-list p:not(:last-child){
  margin-bottom: 24px;
}
.paragraph-list.font-size-18 p{
  font-size: var(--fs-18);
  line-height: 30px;
}
.paragraph-list.font-size-20 p{
  font-size: var(--fs-20);
  line-height: 30px;
}
.overlay-image::after{
  position: absolute;
  content: "";
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  background: linear-gradient(90.05deg, rgba(var(--primary-rgb-1), 0.8) 0.04%, rgba(var(--primary-rgb-1), 0) 99.95%);
}
.overlay-image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cmn-heading-content-box{
  text-align: center;
  margin-bottom: 50px;
}
.cmn-heading-content-box h2{
  font-size: var(--fs-50);
  font-family: var(--Font-Semi-Bold);
  margin-bottom: 25px;
}
.cmn-shadow-box{
  padding: 30px;
  border-radius: var(--border-radius-20);
  background-color: var(--white);
  border: 1px solid var(--secondary-7);
  box-shadow: var(--box-shadow-1);
}
.cmn-shadow-box:not(:last-child){
  margin-bottom: 30px;
}
.circle-box{
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
}
.circle-20{
  width: 20px;
  height: 20px;
}
.circle-40{
  width: 40px;
  height: 40px;
}
.circle-50{
  width: 50px;
  height: 50px;
}
.circle-58{
  width: 58px;
  height: 58px;
}
.circle-70{
  width: 70px;
  height: 70px;
}
.circle-80{
  width: 80px;
  height: 80px;
}
.text-uppercase{
  text-transform: uppercase;
}
.cmn-box-shadow{
  padding: 20px;
  border-radius: var(--border-radius-20);
  background-color: var(--white);
  box-shadow: var(--box-shadow-1);
}
.text-align-left{
  text-align: left;
}
.mb-0{
  margin-bottom: 0px;
}
.mt-20{
  margin-top: 20px;
}
.inline-element-content-box{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 50px;
}
.inline-element-content-box span{
  font-size: var(--fs-24);
  line-height: 28px;
  font-family: var(--Font-Semi-Bold);
  color: var(--secondary-19);
}
.cmn-heading-title{
  margin-bottom: 30px;
}
.cmn-heading-title h4{
  font-size: var(--fs-30);
  line-height: 34px;
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
}
/* Comman Relative Style CSS End */

/* Header Relative Style CSS Start */
.header-section{
  transition: all 1000ms ease-in-out;
}
.header-section.navbar-fixed-top{
  position: sticky;
  top: 0px;
  animation: slideIn 1000ms ease-in-out;
}
@keyframes slideIn {
  from {
    /* opacity: 0; */
    transform: translateY(-100%);
  }
  to {
    /* opacity: 1; */
    transform: translateY(0);
  }
}
.header-section .navbar{
  margin-bottom: 0px;
  border-radius: 0px;
  border: none;
}
.header-section .navbar .top-header-section{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 25px 50px;
  border-bottom: 1px solid var(--secondary-2);
}
.header-section .navbar .top-header-section .top-header-right-list{
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.header-section .navbar .top-header-section .top-header-right-list .top-header-right-list-item:not(:last-child){
  margin-right: 50px;
}
.header-section .navbar .navbar-header .navbar-brand{
  width: 230px;
  display: flex;
  padding: 0px;
}
.header-section .navbar .navbar-header .navbar-brand .logo-img{
  display: none;
}
.header-section.navbar-fixed-top .top-header-section .navbar-header .navbar-brand .full-logo-img{
  display: none;
}
.header-section.navbar-fixed-top .navbar .navbar-header .navbar-brand .logo-img{
  display: block;
}
.header-section .navbar .navbar-header .navbar-brand img{
  width: 100%;
}
.header-section .navbar .navbar-menu{
  width: 100%;
  padding: 11px 50px;
}
.header-section .navbar .navbar-menu .navbar-collapse{
  padding: 0px;
}
.header-section .navbar .navbar-menu .navbar-collapse .nav{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  float: initial !important;
}
.header-section .navbar .navbar-menu .navbar-collapse .nav li{
  margin-bottom: 4px;
}
.header-section .navbar .navbar-menu .navbar-collapse .nav li:not(:last-child){
  margin-right: 30px;
}
.header-section .navbar .navbar-menu .navbar-collapse .nav li a{
  font-size: var(--fs-18);
  font-family: var(--Font-Medium);
  color: var(--white);
  padding: 0px;
}
.header-section .navbar .navbar-menu .navbar-collapse .nav li a:focus{
  background-color: var(--transparent);
  box-shadow: none;
  outline: none;
}
.header-section .navbar .navbar-menu .navbar-collapse .nav li a:hover{
  background-color: var(--transparent);
}
.header-section .navbar .navbar-menu .navbar-collapse .nav li.active a{
  color: var(--secondary-3);
}
.header-section .navbar .navbar-menu .menu-inline-box a.btn-primary{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-size: var(--fs-18);
  background-color: var(--secondary-1);
  border-color: var(--secondary-1);
  color: var(--white);
  padding: 9px 14px;
  border-radius: 6px;
  margin-right: 30px;
}
.header-section .navbar .navbar-menu .menu-inline-box a.btn-primary img{
  margin-right: 8px;
}
.header-section .navbar .icon-with-label-content-box{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  color: var(--white);
}
.header-section .navbar .icon-with-label-content-box img{
  margin-right: 20px;
}
.header-section .navbar .icon-with-label-content-box h5{
  font-size: var(--fs-18);
  color: var(--white);
}
.header-section .navbar .icon-with-label-content-box h6{
  width: 130px;
  font-size: var(--fs-14);
  color: var(--white);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.header-section .navbar .navbar-menu .menu-inline-box{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.navbar-toggle .icon-bar{
  background-color: var(--white);
}
.header-section .navbar .navbar-menu .navbar-collapse .nav li.active a.dropdown-toggle{
  background-color: transparent;
}
.header-section .navbar .navbar-menu .navbar-collapse .nav .dropdown-menu{
  background-color: var(--secondary-2);
  padding: 10px 15px;
}
.header-section .navbar .navbar-menu .navbar-collapse .nav .dropdown-menu a, .header-section .navbar .navbar-menu .navbar-collapse .nav li.active .dropdown-menu a{
  color: var(--white);
}
/* Header Search Box Relative Code - (Open, Close) */
.header-section .navbar .top-header-section .top-header-right-list .top-header-right-list-item a:hover{
  text-decoration: none;
}
.header-section .navbar .top-header-section .top-header-right-list .top-header-right-list-item .input-box {
  position: relative;
  width: 100%;
  max-width: 60px;
  transition: all 0.5s ease-in-out;
}
.header-section .navbar .top-header-section .top-header-right-list .top-header-right-list-item .input-box .form-control {
  position: relative;
  width: 100%;
  height: auto;
  font-size: var(--fs-16);
  background-color: var(--transparent);
  border: 1px solid var(--transparent);
  color: var(--white);
  padding: 10px 50px 10px 15px;
  border: none;
  border-radius: 0px;
  outline: none;
  visibility: hidden;
  transition: all 0.5s ease-in-out;
}
.header-section .navbar .top-header-section .top-header-right-list .top-header-right-list-item .input-box .form-control:focus{
  box-shadow: none;
  outline: none;
}
.header-section .navbar .top-header-section .top-header-right-list .top-header-right-list-item .input-box .search {
  position: absolute;
  top: 50%;
  right: 0px;
  width: 20px;
  transform: translateY(-50%);
  cursor: pointer;
  transition: all 0.5s ease-in-out;
}
.header-section .navbar .top-header-section .top-header-right-list .top-header-right-list-item .input-box.open {
  max-width: 350px;
}
.header-section .navbar .top-header-section .top-header-right-list .top-header-right-list-item .input-box.open .form-control {
  visibility: visible;
  border-bottom: 1px solid var(--secondary-21);
}
.header-section .navbar .top-header-section .top-header-right-list .top-header-right-list-item .input-box.open .search{
  right: 20px;
  transition: all 0.5s ease-in-out;
}
/* Header Relative Style CSS End */

/* Comman Banner - Relative Style CSS Start */
.cmn-banner-content{
  position: relative;
  height: 100%;
  color: var(--white);
}
.cmn-banner-content .overlay-image, .questions-contact-section .overlay-image{
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
}
.cmn-banner-content h1, .cmn-banner-content .paragraph-list{
  margin-bottom: 40px;
}
/* Comman Banner - Relative Style CSS End */

/* Forms - Relative Style CSS Start */

/* Button - Relative Style CSS Start */
.btn-container{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.btn-container.btn-center{
  justify-content: center;
}
.btn-container.btn-end{
  justify-content: flex-end;
}
.btn-container .btn{
  font-size: var(--fs-20);
  line-height: 30px;
  font-family: var(--Font-Semi-Bold);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  padding: 16px 40px;
  transition: all 0.5s ease 0s;
}
.btn-container .btn:not(:last-child){
  margin-right: 15px;
}
.btn-container .btn.read-more-btn{
  padding: 6px 24px;
  border-radius: 40px;
  background-color: var(--primary-1);
  color: var(--white);
}
.btn-container .btn.read-more-btn:hover{
  color: var(--primary-1);
  border-color: var(--primary-1);
  background-color: var(--transparent);
  transition: all 0.5s ease 0s;
}

.btn-container .btn.outline-primary-btn{
  padding: 6px 24px;
  border-radius: 40px;
  background-color: var(--transparent);
  color: var(--primary-1);
  border: 1px solid var(--primary-1);
}
.btn-container .btn.outline-primary-btn:hover{
  color: var(--white);
  border-color: var(--primary-1);
  background-color: var(--primary-1);
  transition: all 0.5s ease 0s;
}

.btn-container .btn.btn-secondary-1{
  font-size: var(--fs-16);
  padding: 6px 24px;
  border-radius: 8px;
  background-color: var(--secondary-1);
  color: var(--white);
}
.btn-container .btn.btn-secondary-1:hover{
  color: var(--secondary-1);
  border-color: var(--secondary-1);
  background-color: var(--transparent);
  transition: all 0.5s ease 0s;
}

.btn-container .btn.btn-secondary-26{
  font-size: var(--fs-16);
  padding: 6px 24px;
  border-radius: 40px;
  background-color: var(--secondary-26);
  color: var(--white);
}
.btn-container .btn.btn-secondary-26:hover{
  color: var(--secondary-26);
  border-color: var(--secondary-26);
  background-color: var(--transparent);
  transition: all 0.5s ease 0s;
}

.btn-container .btn.btn-secondary-gradient{
  background: linear-gradient(92.66deg, var(--secondary-4) -9.65%, var(--secondary-5) 48.62%, var(--secondary-4) 106.89%);
  color: var(--primary-1);
}
.btn-container .btn.btn-primary-1{
  padding: 15px 40px;
  background-color: var(--primary-1);
  color: var(--white);
}
.btn-container .btn.btn-primary-1:hover{
  color: var(--primary-1);
  border-color: var(--primary-1);
  background-color: var(--transparent);
  transition: all 0.5s ease 0s;
}
.icon-btn-container .btn.icon-btn{
  width: 50px;
  height: 50px;
  border-radius: 8px;
  padding: 8px;
}
.icon-btn-container .btn.icon-btn{
  background-color: var(--primary-1);
}
.icon-btn-container .btn.icon-btn svg{
  color: var(--white);
  font-size: var(--fs-30);
}
.icon-btn-container .btn.icon-btn.btn-secondary-26{
  background-color: var(--secondary-26);
}
.icon-btn-container .btn.icon-btn.w-40{
  width: 40px;
  height: 40px;
}
.icon-btn-container .btn.icon-btn.w-40 svg{
  font-size: var(--fs-24);
}
/* Button - Relative Style CSS End */

.form-control{
  height: 60px;
  font-size: var(--fs-18);
  line-height: 20px;
  font-family: var(--Font-Regular);
  color: var(--primary-1);
  border-radius: 8px;
  padding: 0px 22px;
  border: 1px solid var(--secondary-22);
}
.form-control::placeholder{
  color: rgb(var(--primary-rgb-1), var(--background-color-opacity-2));
}
.form-control:focus{
  outline: none;
  box-shadow: none;
  border-color: var(--secondary-1);
}
textarea.form-control{
  height: 200px;
  padding: 22px;
}
.input-container{
  position: relative;
}
.input-container.icon-with-input .form-control{
  padding-right: 60px;
}
.input-container.icon-with-input img{
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
}
/* Forms - Relative Style CSS End */

/* Owl Carousel - Relative Style CSS Start */
/* Banner Carousel Slider */
.owl-carousel-container.owl-banner-carousel .owl-carousel .owl-stage-outer .owl-stage .owl-item .item{
  height: 100%;
}
.owl-carousel-container.owl-banner-carousel .owl-carousel .owl-dots{
  position: absolute;
  right: 150px;
  bottom: 60px;
}
.owl-carousel-container .owl-carousel.owl-theme .owl-dots .owl-dot span{
  width: 14px;
  height: 14px;
  background-color: var(--secondary-6);
  margin: 0px;
}
.owl-carousel-container .owl-carousel.owl-theme .owl-dots .owl-dot:not(:last-child){
  margin-right: 20px;
}
.owl-carousel-container .owl-carousel.owl-theme .owl-dots .owl-dot.active span{
  width: 70px;
  background-color: var(--white);
}
.owl-carousel-container .owl-carousel.owl-theme .owl-dots .owl-dot:focus-visible{
  outline: none;
}
/* Card Arrow Carousel Slider */
.owl-carousel-container .owl-carousel .owl-stage-outer{
  height: 100%;
}
.owl-carousel-container .owl-carousel .owl-stage-outer .owl-stage{
  position: relative;
  display: flex;
  align-items: stretch;
}
.owl-carousel-container .owl-carousel .owl-nav .owl-prev, .owl-carousel-container .owl-carousel .owl-nav .owl-next{
  position: absolute;
  top: 50%;
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs-24);
  transform: translateY(-50%);
  background-color: var(--transparent);
  color: rgb(var(--primary-rgb-1), var(--background-color-opacity-2));
  border-radius: 100%;
  border: 2px solid rgb(var(--primary-rgb-1), var(--background-color-opacity-2));
  margin: 0px;
  transition: all 0.5s ease 0s;
}
.owl-carousel-container .owl-carousel .owl-nav .owl-prev{
  left: -80px;
}
.owl-carousel-container .owl-carousel .owl-nav .owl-next{
  right: -80px;
}
.owl-carousel-container .owl-carousel a{
  text-decoration: none;
  color: var(--primary-1);
}

.owl-carousel-container.indicator-slider .owl-carousel .owl-stage-outer .owl-stage .owl-item .item,
.owl-carousel-container.add-to-cart-slider .owl-carousel .owl-stage-outer .owl-stage .owl-item .item{
  position: relative;
  height: calc(100% - 0px);
  display: flex;
  align-items: stretch;
  margin: 0px 10px 0px;
  background-color: var(--white);
  border-radius: var(--border-radius-20);
  border: 1px solid var(--secondary-7);
  box-shadow: var(--box-shadow-1);
  overflow: hidden;
}
.owl-carousel-container.indicator-slider .owl-carousel .owl-stage-outer .owl-stage .owl-item .item .owl-custom-content-box,
.owl-carousel-container.add-to-cart-slider .owl-carousel .owl-stage-outer .owl-stage .owl-item .item .owl-custom-content-box{
  width: 100%;
}
.owl-carousel-container.indicator-slider .owl-carousel .owl-stage-outer .owl-stage .owl-item .item .owl-custom-content-box .shadow-box{
  border-radius: 10px;
  padding: 30px 40px 0px;
}
.owl-carousel-container.indicator-slider .owl-carousel .owl-stage-outer .owl-stage .owl-item.active.center .item{
  background-color: var(--secondary-7);
  box-shadow: none;
}
.owl-carousel-container.indicator-slider .owl-carousel .owl-stage-outer .owl-stage .owl-item .item .owl-custom-content-box .shadow-box .content-box{
  margin-bottom: 30px;
}
.owl-carousel-container.indicator-slider .owl-carousel .owl-stage-outer .owl-stage .owl-item .item .owl-custom-content-box .shadow-box .content-box h5{
  font-size: var(--fs-30);
  line-height: 40px;
  font-family: var(--Font-Semi-Bold);
  margin-bottom: 10px;
  color: var(--black);
}
.owl-carousel-container.indicator-slider .owl-carousel .owl-stage-outer .owl-stage .owl-item .item .owl-custom-content-box .shadow-box .content-box h3{
  font-size: var(--fs-40);
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
}

/* Add to Cart Slider - Relative Style CSS Start */
/* .owl-carousel-container.add-to-cart-slider .owl-carousel .owl-stage-outer .owl-stage .owl-item .item .owl-custom-content-box .card-container.cmn-add-to-cart-card{
  border-radius: 10px;
  padding: 20px 20px 0px;
} */
/* .owl-carousel-container.add-to-cart-slider .owl-carousel .owl-stage-outer .owl-stage .owl-item .item .owl-custom-content-box .shadow-box .content-box{
  margin-bottom: 30px;
}
.owl-carousel-container.add-to-cart-slider .owl-carousel .owl-stage-outer .owl-stage .owl-item .item .owl-custom-content-box .shadow-box .content-box h5{
  font-size: var(--fs-30);
  line-height: 40px;
  font-family: var(--Font-Medium);
  margin-bottom: 10px;
  color: var(--black);
}
.owl-carousel-container.add-to-cart-slider .owl-carousel .owl-stage-outer .owl-stage .owl-item .item .owl-custom-content-box .shadow-box .content-box h3{
  font-size: var(--fs-40);
  font-family: var(--Font-Medium);
  color: var(--black);
} */
/* Owl Carousel - Relative Style CSS End */

/* Popular Section Customize - Relative Style CSS Start */
.popular-categories-section .categories-card-content-box{
  height: 100%;
}
.popular-categories-section .categories-card-content-box a{
  display: block;
  padding: 20px;
  border-radius: var(--border-radius-20);
  background-color: var(--white);
  box-shadow: var(--box-shadow-1);
  transition: all 1s ease-out;
}
.popular-categories-section .categories-card-content-box a:hover{
  text-decoration: none;
}
.popular-categories-section .categories-card-content-box a:hover h4{
  color: var(--secondary-1);
  font-family: var(--Font-Semi-Bold);
  transition: all 1s ease-out;
}
.popular-categories-section .categories-card-content-box .image-content-box{
  height: 230px;
  margin-bottom: 25px;
  background-color: var(--secondary-7);
  box-shadow: var(--box-shadow-2);
}
.popular-categories-section .categories-card-content-box .image-content-box img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 10px 0px;
  transition: all 1s ease-out;
}
.popular-categories-section .categories-card-content-box .image-content-box img.hover-image{
  display: none;
  opacity: 0;
  transition: all 1s ease-out;
}
.popular-categories-section .categories-card-content-box a:hover .image-content-box img.preview-image{
  display: none;
  opacity: 0;
  transition: all 1s ease-out;
}
.popular-categories-section .categories-card-content-box a:hover .image-content-box img.hover-image{
  display: block;
  opacity: 1;
  transition: all 1s ease-out;
  padding: 0;
  object-fit: cover;
}
.popular-categories-section .categories-card-content-box .card-content-box{
  text-align: center;
}
/* Popular Section Customize - Relative Style CSS End */

/* Mosoni Furniture Section - Relative Style CSS Start */
.mosoni-furniture-section .mosoni-content-box h3{
  margin-bottom: 20px;
}
.mosoni-furniture-section .mosoni-content-box .rate-list{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.rate-list .rate-star-link svg{
  color: rgb(var(--black-rgb), 25%);
}
.rate-list .rate-star-link.active svg{
  color: var(--secondary-8);
}
.mosoni-furniture-section .mosoni-content-box .rate-list svg:not(:last-child){
  margin-right: 16px;
}
.mosoni-furniture-section .mosoni-content-box span{
  display: inline-block;
  font-size: var(--fs-20);
  line-height: 30px;
  margin: 15px 0px;
}
.mosoni-furniture-section .mosoni-content-box .image-content-box img{
  width: 100%;
}
.mosoni-furniture-section .cmn-shadow-box{
  height: 100%;
}
.mosoni-furniture-section .cmn-shadow-box .circle-with-detail{
  margin-bottom: 24px;
}
.circle-with-detail{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.circle-with-detail .circle-box{
  font-size: var(--fs-24);
  font-family: var(--Font-Bold);
  color: var(--white);
  margin-right: 20px;
}
.circle-with-detail .detail-content-box h5{
  font-size: var(--fs-22);
  font-family: var(--Font-Semi-Bold);
  line-height: 24px;
}
.circle-with-detail .detail-content-box span{
  font-size: var(--fs-16);
  font-family: var(--Font-Regular);
  line-height: 18px;
  color: rgb(var(--primary-1), var(--background-color-opacity-2));
}
/* Mosoni Furniture Section - Relative Style CSS End */

/* Card - Relative Style CSS Start */
.card-container{
  height: 100%;
}
.card-container .card-content-box .image-content-box{
  height: 230px;
  margin-bottom: 20px;
}
.card-container .card-content-box .image-content-box img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.card-container .card-content-box{
  height: 100%;
  display: flex;
  flex-direction: column;
}
.card-container .card-content-box .card-body-content-box{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex: 1;
}
.card-container .card-content-box .card-content-box h4{
  font-family: var(--Font-Semi-Bold);
}
.card-container .card-content-box .date-read-more-content-box{
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 30px;
}

/* Detail Card with Hover */
.card-container.icon-detail-card-container{
  border-radius: var(--border-radius-20);
  background: var(--white);
  border: 1px solid rgb(var(--black-rgb), var(--background-color-opacity-4));
}
.card-container.icon-detail-card-container .card-content{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 35px;
}
.card-container.icon-detail-card-container .card-content .card-header{
  margin-right: 24px;
}
.card-container.icon-detail-card-container .card-content .card-header > .circle-box{
  background: rgb(var(--primary-rgb-1), var(--background-color-opacity-4));
}
.card-container.icon-detail-card-container .card-content .card-header > .circle-box > .circle-box img{
  width: 40px;
  filter: brightness(0) invert(1);
}
.card-container.icon-detail-card-container .card-content .card-body span{
  display: inline-block;
  font-size: var(--fs-18);
  line-height: 24px;
  color: var(--primary-1);
  margin-top: 12px;
}
.card-container.icon-detail-card-container:hover{
  border-color: var(--transparent);
  background: linear-gradient(93.88deg, var(--secondary-4) -38.74%, var(--secondary-5) 52.18%, var(--secondary-4) 143.09%);
  box-shadow: var(--box-shadow-3);
}
.card-container.icon-detail-card-container a:hover{
  text-decoration: none;
}
.card-container.icon-detail-card-container:hover .card-content .card-header > .circle-box{
  background: rgb(var(--white-rgb), var(--background-color-opacity-4));
}
.card-container.icon-detail-card-container:hover .card-content .card-header > .circle-box > .circle-box{
  background-color: var(--white);
}
.card-container.icon-detail-card-container:hover .card-content .card-header > .circle-box > .circle-box img{
  filter: invert(15%) sepia(12%) saturate(1060%) hue-rotate(176deg) brightness(94%) contrast(88%);
}

/* Add to Cart Card - Relative Style CSS Start */
.card-container.cmn-add-to-cart-card > a{
  display: block;
  padding: 20px;
  border-radius: var(--border-radius-20);
  background-color: var(--white);
  box-shadow: var(--box-shadow-1);
  text-decoration: none;
  transition: all 1s ease-out;
}
.card-container.cmn-add-to-cart-card .image-content-box{
  position: relative;
}
.card-container.cmn-add-to-cart-card .image-content-box{
  height: 230px;
  margin-bottom: 25px;
  background-color: var(--secondary-7);
  box-shadow: var(--box-shadow-2);
}
.card-container.cmn-add-to-cart-card .image-content-box img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 10px 0px;
  transition: all 1s ease-out;
}
.card-container.cmn-add-to-cart-card .image-content-box img.like-image{
  position: absolute;
  top: 0px;
  right: 10px;
  width: 40px;
  height: auto;
  z-index: 99;
}
.card-container.cmn-add-to-cart-card .image-content-box img.hover-image{
  display: none;
  opacity: 0;
  transition: all 1s ease-out;
}
.card-container.cmn-add-to-cart-card a:hover .image-content-box img.preview-image{
  display: none;
  opacity: 0;
  transition: all 1s ease-out;
}
.card-container.cmn-add-to-cart-card a:hover .image-content-box img.hover-image{
  display: block;
  opacity: 1;
  transition: all 1s ease-out;
  padding: 0;
  object-fit: cover;
}
.card-container.cmn-add-to-cart-card .card-content-box .card-body .title-with-circle-content-box{
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.card-container.cmn-add-to-cart-card .card-content-box .card-body .title-with-circle-content-box h5{
  font-size: var(--fs-18);
  font-family: var(--Font-Semi-Bold);
  color: rgb(var(--black-rgb), var(--background-color-opacity-2));
  margin-right: 15px;
  margin-bottom: 20px;
}
.card-container.cmn-add-to-cart-card .card-content-box .card-body h4{
  font-size: var(--fs-18);
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
}
.card-container.cmn-add-to-cart-card .card-content-box .card-body .title-with-circle-content-box .circle-list{
  display: flex;
  justify-content: flex-start;
  margin-bottom: 20px;
}
.card-container.cmn-add-to-cart-card .card-content-box .card-body .title-with-circle-content-box .circle-list .circle-box:not(:last-child){
  margin-right: 10px;
}
.card-container.cmn-add-to-cart-card .card-content-box .card-body .title-with-circle-content-box .circle-list .circle-box{
  border: 1px solid var(--secondary-18);
}
.card-container.cmn-add-to-cart-card .card-content-box .card-body .rate-view-content{
  margin-top: 15px;
}
.card-container.cmn-add-to-cart-card .card-content-box .card-body .rate-view-content span{
  font-size: var(--fs-14);
  font-family: var(--Font-Medium);
  color: var(--primary-1);
  margin-left: 3px;
}
.card-container.cmn-add-to-cart-card .card-content-box .card-body .rate-view-content .rate-content-box{
  display: inline-block;
  font-size: var(--fs-12);
  border-radius: 40px;
  background: linear-gradient(93.88deg, var(--secondary-4) -38.74%,var(--secondary-5) 52.18%, var(--secondary-4) 143.09%);
  padding: 2px 10px;
}
.card-container.cmn-add-to-cart-card .card-content-box .card-body .text-with-button-content-box{
  display: flex;
  justify-content: space-between;
  margin-top: 18px;
}
.card-container.cmn-add-to-cart-card.product-column-card .card-content-box .card-body{
  text-align: left;
}
.card-container.cmn-add-to-cart-card.product-column-card .card-content-box .card-body .text-with-button-content-box{
  flex-direction: column;
}
.card-container.cmn-add-to-cart-card.product-column-card .card-content-box .card-body .text-with-button-content-box .btn-container{
  justify-content: flex-start;
  margin-top: 20px;
}
.amount-content-box{
  font-family: var(--Font-Semi-Bold);
}
.amount-content-box .checked-text{
  font-size: var(--fs-16);
  line-height: 18px;
  color: var(--secondary-19);
  text-decoration: line-through;
}
.amount-content-box .amount-text{
  font-size: var(--fs-24);
  line-height: 26px;
  color: var(--secondary-1);
}
.amount-content-box .amount-text span{
  font-size: var(--fs-16);
  line-height: 18px;
  color: var(--primary-1);
}
/* Add to Cart Card - Relative Style CSS End */
/* Card - Relative Style CSS End */

/* Subscribe Section - Relative Style CSS Start */
.subscribe-section{
  overflow: hidden;
}
.subscribe-content-box{
  position: relative;
  border-radius: 130px 20px 20px 20px;
  background: linear-gradient(270deg, var(--primary-1) -1.95%, var(--secondary-12) 106.82%);
}
.subscribe-content-box .image-content-box img{
  position: absolute;
  pointer-events: none;
  opacity: 0.1;
}
.subscribe-content-box .image-content-box img:nth-child(1){
  left: 0px;
  bottom: 0px;
}
.subscribe-content-box .image-content-box img:nth-child(2){
  top: 0px;
  right: 0px;
}
.subscribe-content-box .image-content-box img:nth-child(3){
  bottom: -60px;
  right: -46px;
  opacity: 1;
}
.subscribe-content-box h6{
  font-size: var(--fs-30);
  line-height: 50px;
  font-family: var(--Font-Regular);
  color: var(--white);
  margin-bottom: 40px;
}
.subscribe-content-box .content-box{
  width: 40%;
  text-align: center;
  margin: 0px auto;
}
.input-with-button{
  display: flex;
  justify-content: center;
}
.input-with-button .form-control{
  min-width: 420px;
  height: 64px;
  font-size: var(--fs-14);
  line-height: 16px;
  font-family: var(--Font-Regular);
  color: var(--secondary-13);
  border-radius: 10px;
  padding: 16px 40px 16px 65px;
}
.input-with-icon{
  position: relative;
}
.input-with-icon img{
  position: absolute;
  left: 30px;
  top: 50%;
  transform: translateY(-50%);
}
.input-with-button .input-with-icon{
  margin-right: 20px;
}
/* Subscribe Section - Relative Style CSS End */

/* Footer Section - Relative Style CSS Start */
.footer-section .footer-icon-with-menu{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 40px 0px;
  border-bottom: 1px solid var(--white);
}
.footer-section .footer-icon-with-menu .social-icon-list{
  margin-right: 15px;
}
.footer-section .footer-icon-with-menu .social-icon-list ul{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.footer-section .footer-icon-with-menu .social-icon-list ul li:not(:last-child){
  margin-right: 32px;
}
.footer-section .footer-icon-with-menu .social-icon-list ul li a{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 100%;
  background: var(--white);
  transition: all 0.5s ease 0s;
}
.footer-section .footer-icon-with-menu .social-icon-list ul li a svg{
  font-size: var(--fs-24);
  color: var(--primary-1);
}
.footer-section .footer-icon-with-menu .social-icon-list ul li a:hover{
  background: linear-gradient(92.66deg, var(--secondary-4) -9.65%, var(--secondary-5) 48.62%, var(--secondary-4) 106.89%);
  transition: all 0.5s ease 0s;
}
.footer-section .footer-icon-with-menu .footer-menu-list ul{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.footer-section .footer-icon-with-menu .footer-menu-list ul li{
  padding: 0px 30px;
}
.footer-section .footer-icon-with-menu .footer-menu-list ul li:first-child{
  padding-left: 0px;
}
.footer-section .footer-icon-with-menu .footer-menu-list ul li:last-child{
  padding-right: 0px;
}
.footer-section .footer-icon-with-menu .footer-menu-list ul li:not(:last-child){
  border-right: 1px solid var(--white);
}
.footer-section .footer-icon-with-menu .footer-menu-list ul li a{
  font-size: var(--fs-18);
  line-height: 20px;
  font-family: var(--Font-Regular);
  color: var(--white);
  padding-bottom: 2px;
}
.footer-section .footer-icon-with-menu .footer-menu-list ul li a:hover{
  text-decoration: none;
  border-bottom: 1px solid var(--white);
}
.footer-section .copyright-section{
  text-align: center;
  padding: 40px 0px;
}
.footer-section .copyright-section p{
  font-size: var(--fs-16);
  line-height: 18px;
  font-family: var(--Font-Regular);
  color: var(--secondary-14);
}
/* Footer Section - Relative Style CSS End */

.custom-side-panel-container{
  position: relative;
}
.custom-side-panel-container .side-panel-content{
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  width: 350px;
  height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--white);
  visibility: hidden;
  transform: translateX(-100%);
  transition: 1000ms;
  overflow-y: auto;
  z-index:  1031;
}
.custom-side-panel-container .backdrop-black{
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  background-color: rgb(var(--black-rgb), var(--background-color-opacity-3));
  visibility: hidden;
  opacity: 0;
  transition: 1000ms;
  z-index: 1030;
}
.custom-side-panel-container.show-panel .backdrop-black{
  opacity: 1;
  visibility: visible;
  transition: 1000ms;
}
.custom-side-panel-container.show-panel .side-panel-content{
  visibility: visible;
  transform: translateX(0%);
  transition: 1000ms;
}
.custom-side-panel-container .side-panel-content .sidebar-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 15px 20px 15px;
  background-color: var(--primary-1);
}
.custom-side-panel-container .side-panel-content .sidebar-header .logo-image{
  width: 160px;
  margin-right: 20px;
}
.custom-side-panel-container .side-panel-content .sidebar-header .logo-image img{
  width: 100%;
}
.custom-side-panel-container .side-panel-content .sidebar-header #closeButton{
  width: 35px;
  height: 35px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 100%;
  margin-left: auto;
  background-color: var(--white);
}
.custom-side-panel-container .side-panel-content .sidebar-header #closeButton svg{
  font-size: var(--fs-22);
  color: var(--primary-1);
}
.custom-side-panel-container .side-panel-content .sidebar-body{
  position: relative;
  flex: 1;
  overflow-x: hidden;
}
.menu-list-content-box{
  position: relative;
}
.custom-side-panel-container .side-panel-content .sidebar-body .menu-list-content-box ul:not(:last-child){
  border-bottom: 1px solid var(--secondary-20);
}
.custom-side-panel-container .side-panel-content .sidebar-body .menu-list-content-box ul{
  padding: 0px 0px 15px;
  background: var(--white);
}
.custom-side-panel-container .side-panel-content .sidebar-body .menu-list-content-box ul li:first-child a{
  align-items: center;
  justify-content: flex-start;
  font-size: var(--fs-18);
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
  padding: 20px 20px 10px;
  cursor: initial;
}
.custom-side-panel-container .side-panel-content .sidebar-body .menu-list-content-box ul li a{
  position: relative;
  display: flex;
  justify-content: space-between;
  flex: 1;
  font-size: var(--fs-16);
  line-height: 24px;
  font-family: var(--Font-Regular);
  color: var(--primary-1);
  padding: 8px 40px 8px 20px;
}
.custom-side-panel-container .side-panel-content .sidebar-body .menu-list-content-box ul li a:hover{
  background-color: var(--secondary-7);
}
.custom-side-panel-container .side-panel-content .sidebar-body .menu-list-content-box ul li:first-child a:hover{
  background-color: var(--transparent);
}
.custom-side-panel-container .side-panel-content .sidebar-body .menu-list-content-box ul li .fa-circle-chevron-right,
.custom-side-panel-container .side-panel-content .sidebar-body ul li .fa-circle-chevron-left{
  font-size: var(--fs-20);
}
.custom-side-panel-container .side-panel-content .sidebar-body .menu-list-content-box ul li .fa-circle-chevron-left{
  margin-right: 10px;
}
.custom-side-panel-container .side-panel-content .sidebar-body .menu-list-content-box ul li .fa-circle-chevron-left,
.custom-side-panel-container .side-panel-content .sidebar-body .menu-list-content-box ul li .fa-circle-chevron-left + span{
  cursor: pointer;
}
.custom-side-panel-container .side-panel-content .sidebar-body .menu-list-content-box ul li .preview-screen{
  flex: 1;
}
.custom-side-panel-container .side-panel-content .sidebar-body .menu-list-content-box ul li .fa-circle-chevron-right{
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
}
.custom-side-panel-container .side-panel-content .sidebar-body .menu-list-content-box ul li a:hover{
  text-decoration: none;
}
.custom-side-panel-container .side-panel-content .sidebar-body .menu-list-content-box ul li.nav-item{
  display: flex;
  align-items: center;
}
.custom-side-panel-container .side-panel-content .sidebar-body .menu-list-content-box ul li.nav-item .nav-expand-content{
  position: absolute;
  left: 0px;
  top: 0px;
  bottom: 0px;
  width: 100%;
  height: 100%;
  background: var(--white);
  transform: translateX(100%);
  transition: .3s;
  visibility: hidden;
  overflow-y: auto;
  z-index: 100;
}
.custom-side-panel-container .side-panel-content .sidebar-body .menu-list-content-box ul li.nav-item.active .nav-expand-content{
  transform: translateX(0);
  visibility: visible;
}

/* Questions Contact Section - Relative Style CSS Start */
.our-story-section .image-content-box img{
  width: 100%;
}
.questions-contact-section{
  position: relative;
}
.questions-contact-section .overlay-image{
  border-radius: var(--border-radius-20);
  overflow: hidden;
}
.questions-contact-section .overlay-image::after{
  display: none;
}
.questions-contact-section .cmn-heading-content-box{
  position: relative;
  width: 50%;
  text-align: left;
  color: var(--white);
  margin-left: auto;
  padding-right: 40px;
}
.questions-contact-section .cmn-heading-content-box .paragraph-list p{
  font-size: var(--fs-18);
  line-height: 30px;
  font-family: var(--Font-Medium);
}
.questions-contact-section .cmn-heading-content-box .paragraph-list{
  margin-bottom: 40px;
}
.questions-contact-section .image-with-content-box{
  position: relative;
  padding: 100px 0px 40px 0px;
}
/* Questions Contact Section - Relative Style CSS End */

.contact-us-section .contact-info-content-box{
  height: 100%;
  padding: 30px;
  border-radius: var(--border-radius-20);
  border: 1px solid var(--secondary-7);
  box-shadow: var(--box-shadow-1);
}
.contact-us-section .contact-info-content-box .icon-with-title{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.contact-us-section .contact-info-content-box .icon-with-title h4{
  font-family: var(--Font-Bold);
}
.contact-us-section .contact-info-content-box .icon-with-title .circle-box{
  margin-right: 15px;
}
.contact-us-section .contact-info-content-box .content-box p{
  font-size: var(--fs-18);
  line-height: 20px;
  font-family: var(--Font-Regular);
  color: var(--black);
  margin: 24px 0px 15px;
}
.label-with-detail-list .label-with-detail-list-item:not(:last-child){
  margin-bottom: 15px;
}
.label-with-detail-list .label-with-detail-list-item{
  font-size: var(--fs-18);
  line-height: 20px;
  font-family: var(--Font-Medium);
  color: var(--primary-1);
  word-break: break-all;
}
.label-with-detail-list .label-with-detail-list-item span{
  color: var(--secondary-1);
}
.label-with-detail-list .label-with-detail-list-item a{
  text-decoration: none;
  color: var(--primary-1);
}
.border-content-box{
  padding-top: 32px;
  padding-bottom: 32px;
}
.border-content-box:not(:last-child){
  border-bottom: 1px solid var(--black);
}
.border-content-box:first-child{
  padding-top: 0px;
}
.border-content-box:last-child{
  padding-bottom: 0px;
}
.contact-info-field-box{
  height: 100%;
  border-radius: 20px;
  padding: 40px 40px 10px;
}

/* Product Listing Page - Relative Style CSS Start */
.product-listing-section{
  background-color: var(--secondary-7);
}
.product-listing-section .product-header-box{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px 50px;
}
.product-listing-section .product-header-box p{
  font-size: var(--fs-18);
  font-family: var(--Font-Medium);
  color: var(--black);
}
.product-listing-section .product-header-box p span{
  color: var(--secondary-1);
}
.label-with-dropdown{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.label-with-dropdown label{
  font-size: var(--fs-18);
  margin-bottom: 0px;
  margin-right: 15px;
}
.label-with-dropdown .form-control{
  width: auto;
  height: 46px;
}
.dropdown-container{
  position: relative;
}
.dropdown-container select.form-control{
  min-width: 240px;
  padding: 0px 40px 0px 20px;
  -webkit-appearance: none;
}
.dropdown-container svg{
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
}
.product-listing-section .product-body-box{
  background-color: var(--white);
  padding: 30px 50px;
}
.product-listing-section .product-body-box .secondary-title{
  margin-bottom: 15px;
}
.secondary-title h4{
  font-size: var(--fs-24);
  line-height: 28px;
  font-family: var(--Font-Semi-Bold);
  color: var(--secondary-1);
}
/* Product Listing Page - Relative Style CSS End */

/* Panel Group - Relative Style CSS Start */
.panel-group{
  margin-bottom: 0px;
}
.panel-group .panel-default.panel{
  border-radius: 14px;
  border: none;
  box-shadow: none;
  overflow: hidden;
}
.panel-group .panel-default.panel .panel-heading{
  padding: 0px;
  background-color: var(--transparent);
  border: none;
}
.panel-group .panel-heading + .panel-collapse > .panel-body{
  border: none;
  padding: 5px 0px 15px;
}
.panel-group .panel-default.panel .panel-heading > a{
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: var(--fs-20);
  line-height: 22px;
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
  padding: 10px 0px;
}
.panel-group .panel-default.panel .panel-heading > a:hover,
.panel-group .panel-default.panel .panel-heading > a:focus{
  text-decoration: none;
}
.panel-group .panel-default.panel .panel-heading > a[aria-expanded="true"] svg{
  transform: rotate(180deg);
  transition: 1000ms;
}
.panel-group .panel-default.panel .panel-heading > a[aria-expanded="false"] svg{
  transform: rotate(0deg);
  transition: 1000ms;
}
.panel-group .panel-default.panel .plus-minus-circle{
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
  border: 1px solid var(--transparent);
}
.panel-group .panel-default.panel .plus-minus-circle svg{
  font-size: var(--fs-16);
  color: var(--white);
}
.panel-group .panel-default.panel .panel-heading > a span{
  flex: 1;
  padding-right: 15px;
}
.panel-group .panel-default.panel .panel-heading > a[aria-expanded="true"] .fa-plus{
  display: none;
}
.panel-group .panel-default.panel .panel-heading > a[aria-expanded="false"] .fa-minus{
  display: none;
}
.panel-group-container .panel-group .panel.panel-default .panel-heading a{
  background: var(--black);
  color: var(--white);
}
.panel-group-container .panel-group .panel.panel-default .panel-heading a:hover .plus-minus-circle{
  background-color: rgb(var(--white-rgb), var(--background-color-opacity-1));
}
.panel-group-container .panel-group .panel-heading + .panel-collapse > .panel-group-body{
  padding: 20px 40px 20px 40px;
}
.panel-group-container .panel-group .panel-heading + .panel-collapse > .panel-group-body p{
  font-size: var(--fs-18);
  line-height: 28px;
  font-family: var(--Font-Medium);
  color: var(--primary-1);
}
.panel-group-container .panel-group .panel-heading + .panel-collapse > .panel-group-body p:not(:last-child){
  margin-bottom: 15px;
}
/* Panel Group - Relative Style CSS End */

/* Custom CheckBox - Relative Style CSS Start */
.checkbox-list .checkbox-list-item:not(:last-child){
  margin-bottom: 10px;
}
.checkbox-list .checkbox-list-item .checkbox-container label{
  font-family: var(--Font-Semi-Bold);
  color: rgb(var(--black-rgb), var(--background-color-opacity-5));
}
.checkbox-container{
  display: flex;
  align-items: center;
}
.checkbox-container input{
  position: relative;
  min-width: 30px;
  max-width: 30px;
  height: 30px;
  margin: 0px 14px 0px 0px;
  min-height: auto;
  appearance: none;
  -moz-appearance: none;
  border-radius: 8px;
}
.checkbox-container input:focus{
  outline: none;
}
.checkbox-container input::before{
  position: absolute;
  content: "";
  inset: 0;
  background-color: var(--white);
  border: 1px solid var(--secondary-22);
  border-radius: 8px;
}
.checkbox-container input:checked:after{
  position: absolute;
  content: "";
  left: 11px;
  top: 4px;
  width: 9px;
  height: 17px;
  border-width: 0px 2px 2px 0px;
  border-style: solid;
  border-color: var(--primary-1);
  transform: rotate(45deg);
  z-index: 2; 
}
.checkbox-container label{
  margin-bottom: 0px;
}
/* Custom CheckBox - Relative Style CSS End */

/* Custom RadioBox - Relative Style CSS Start */

.radio-container{
  display: block;
  position: relative;
  padding-left: 45px;
  line-height: 30px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.radio-container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}
.radio-container .checkmark {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 30px;
  width: 30px;
  border: 2px solid var(--secondary-22);
  border-radius: 50%;
}
.radio-container:hover input ~ .checkmark {
  background-color: var(--transparent);
}
.radio-container input:checked ~ .checkmark {
  background-color: var(--transparent);
}
.radio-container .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}
.radio-container:hover input ~ .checkmark::after,
.radio-container input:checked ~ .checkmark:after {
  display: block;
}
.radio-container:hover input ~ .checkmark::after{
  opacity: 0.4;
}
.radio-container .checkmark:after {
 	top: 6px;
	left: 6px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: var(--primary-1);
}
.radio-box-container .radio-container{
  margin-bottom: 0px;
}
/* Custom RadioBox - Relative Style CSS End */

/* Pagination - Relative Style CSS Start */
.pagination{
  display: flex;
  justify-content: center;
}
.pagination li a{
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 50px;
  height: 50px;
  border-radius: 8px;
  font-size: var(--fs-16);
  line-height: 20px;
  font-family: var(--Font-Bold);
  color: var(--primary-1);
  padding: 0px 4px;
  background-color: var(--white);
  border: 1px solid var(--secondary-7);
  box-shadow: 0px 0px 10px 0px #0000000F;
}
.pagination li a:hover, .pagination li a:hover svg,
.pagination li a.active, .pagination li a.active svg{
  background-color: var(--primary-1);
  color: var(--white);
}
.pagination li:not(:last-child){
  margin-right: 10px;
}
.pagination li a svg{
  color: var(--primary-1);
}
/* Pagination - Relative Style CSS End */

/* Loader - Relative Style CSS Start */
.loader-container.fixed-loader{
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1032;
}
.loader-container .backdrop-blur{
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  background: rgb(var(--black-rgb), var(--background-color-opacity-3));
  backdrop-filter: blur(4px);
}
.loader-container .loader {
  position: relative;
  width: 50px;
  aspect-ratio: 1;
  display: grid;
  border: 4px solid var(--primary-1);
  border-radius: 50%;
  border-color: var(--white) var(--primary-1);
  animation: rotateAnimation 1s infinite linear;
  z-index: 1;
}
.loader-container .loader::before,
.loader-container .loader::after {    
  content: "";
  grid-area: 1/1;
  margin: 2px;
  border: inherit;
  border-radius: 50%;
}
.loader-container .loader::before {
  border-color: var(--secondary-1) var(--primary-1);
  animation: inherit; 
  animation-duration: .5s;
  animation-direction: reverse;
}
.loader-container .loader::after {
  margin: 8px;
}
@keyframes rotateAnimation { 
  100%{transform: rotate(1turn)}
}




.loader--spinner {
  position: relative;
  width: 60px;
  height: 60px;
  display: inline-block;
}
.loader--spinner div {
  animation: loader--spinner 1.2s linear infinite;
  transform-origin: 30px 30px;
}
.loader--spinner div:after {
  display: block;
  position: absolute;
  top: 3px;
  left: 27px;
  background-color: var(--secondary-1);
  border-radius: 20%;
  content: "";
  height: 10px;
  width: 5px;
}
.loader--spinner div:nth-child(1) {
  animation-delay: -1.1s;
  transform: rotate(0deg);
}
.loader--spinner div:nth-child(2) {
  animation-delay: -1s;
  transform: rotate(30deg);
}
.loader--spinner div:nth-child(3) {
  animation-delay: -0.9s;
  transform: rotate(60deg);
}
.loader--spinner div:nth-child(4) {
  animation-delay: -0.8s;
  transform: rotate(90deg);
}
.loader--spinner div:nth-child(5) {
  animation-delay: -0.7s;
  transform: rotate(120deg);
}
.loader--spinner div:nth-child(6) {
  animation-delay: -0.6s;
  transform: rotate(150deg);
}
.loader--spinner div:nth-child(7) {
  animation-delay: -0.5s;
  transform: rotate(180deg);
}
.loader--spinner div:nth-child(8) {
  animation-delay: -0.4s;
  transform: rotate(210deg);
}
.loader--spinner div:nth-child(9) {
  animation-delay: -0.3s;
  transform: rotate(240deg);
}
.loader--spinner div:nth-child(10) {
  animation-delay: -0.2s;
  transform: rotate(270deg);
}
.loader--spinner div:nth-child(11) {
  animation-delay: -0.1s;
  transform: rotate(300deg);
}
.loader--spinner div:nth-child(12) {
  animation-delay: 0s;
  transform: rotate(330deg);
}
@keyframes loader--spinner {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
/* Loader - Relative Style CSS End */

/* Slider - Relative Style CSS Start */
.carousel-container{
  padding-bottom: 115px;
}
.carousel-container .carousel .slider-box{
  position: relative;
}
.carousel-container .carousel .carousel-inner{
  height: 450px;
  border-radius: 20px;
  border: 1px solid var(--secondary-23);
}
.carousel-container .carousel .carousel-inner .item{
  height: 100%;
}
.carousel-container .carousel .carousel-inner .item img{
  width: auto;
  height: 100%;
  display: block;
  margin: auto;
  object-fit: contain;
}
.carousel-container .carousel-indicators.carousel-indicators--thumbnails li {
  width: 100px;
  height: 100px;
  margin: 0;
  border: none;
  border-radius: 0;
}
.carousel-container .carousel-indicators.carousel-indicators--thumbnails .active {
  background-color: var(--transparent);
}
.carousel-container .carousel-indicators.carousel-indicators--thumbnails li .thumbnail{
  width: 100px;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: normal;
  border-radius: 10px;
  border: 1px solid var(--secondary-23);
}
.carousel-container .carousel-indicators.carousel-indicators--thumbnails li.active .thumbnail{
  border: 1px solid var(--secondary-1);
}
.carousel-container .carousel-indicators.carousel-indicators--thumbnails li .thumbnail img{
  width: auto;
  height: 100%;
  object-fit: contain;
}
.carousel-container .carousel .carousel-indicators{
  width: 100%;
  bottom: -115px;
  margin-left: 0px;
  transform: translateX(-50%);
}
.carousel-container .carousel .carousel-indicators li:not(:last-child){
  margin-right: 20px;
}
.carousel-container .carousel .carousel-control.left{
  left: 15px;
}
.carousel-container .carousel .carousel-control.right{
  right: 15px;
}
.carousel-container .carousel .carousel-control{
  position: absolute;
  top: 50%;
  bottom: initial;
  transform: translateY(-50%);
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-shadow: none;
  background-color: var(--secondary-1);
  background-image: none;
  border: 1px solid var(--secondary-1);
  border-radius: 100%;
  visibility: hidden;
  opacity: 1;
}
/* Slider - Relative Style CSS End */

/* Product Listing Details - Relative Style CSS Start */
.product-listing-details-container{
  padding: 50px;
}
.product-listing-details-container .product-detail-slide-content-box h2{
  font-size: var(--fs-40);
  line-height: 60px;
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
  margin-bottom: 20px;
}
.product-listing-details-container .product-detail-slide-content-box p{
  font-size: var(--fs-18);
  line-height: 30px;
  font-family: var(--Font-Semi-Bold);
  color: rgb(var(--black-rgb), 60%);
}
.rate-review-content-box{
  display: flex;
  justify-content: flex-start;
}
.rate-review-content-box .rate-list{
  margin-right: 8px;
}
.review-stock-list{
  display: flex;
  justify-content: flex-start;
}
.review-stock-list .review-stock-list-item{
  position: relative;
  padding: 0px 16px;
  font-size: var(--fs-16);
  font-family: var(--Font-Regular);
  color: var(--black);
}
.review-stock-list .review-stock-list-item:not(:last-child):after{
  position: absolute;
  content: "";
  top: 2px;
  bottom: 2px;
  right: 0px;
  width: 1px;
  background: rgb(var(--black-rgb), 50%);
}
.review-stock-list .review-stock-list-item:first-child{
  padding-left: 0px;
  font-family: var(--Font-Semi-Bold);
}
.review-stock-list .review-stock-list-item #instock{
  padding-right: 0px;
  color: var(--secondary-24);
}
.review-stock-list .review-stock-list-item #outofstock{
  padding-right: 0px;
  color: red;
}
.border-list .border-list-item{
  padding: 40px 0px 40px;
}
.border-list .border-list-item:not(:last-child){
  border-bottom: 1px solid var(--secondary-23);
}
.border-list .border-list-item:first-child{
  padding-top: 0px;
}
.dollar-amount-text span:first-child{
  font-size: var(--fs-30);
  line-height: 50px;
  font-family: var(--Font-Semi-Bold);
  color: var(--secondary-1);
  margin-right: 15px;
}
.dollar-amount-text span:last-child{
  font-size: var(--fs-24);
  line-height: 20px;
  font-family: var(--Font-Semi-Bold);
  color: var(--secondary-19);
  text-decoration: line-through;
}
.product-detail-slide-content-box .dollar-amount-text{
  margin: 30px 0px 40px;
}
.content-list-item label{
  font-size: var(--fs-18);
  line-height: 20px;
  font-family: var(--Font-Semi-Bold);
  color: rgb(var(--black-rgb), var(--background-color-opacity-2));
}
.button-list{
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.button-list .border-btn{
  font-size: var(--fs-16);
  line-height: 18px;
  font-family: var(--Font-Regular);
  color: var(--black);
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid var(--secondary-25);
}
.button-list .border-btn.active{
  border: 1px solid var(--secondary-1);
}
.button-list .border-btn:not(:last-child){
  margin-right: 15px;
}
.button-list .border-btn:hover{
  text-decoration: none;
}
.product-detail-slide-content-box .button-list .border-btn{
  margin-bottom: 30px;
}
.border-image-list{
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.border-image-list .border-image-list-item{
  width: 100px;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.border-image-list .border-image-list-item:not(:last-child){
  margin-right: 15px;
}
.border-image-list .border-image-list-item a{
  width: 100px;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  border-width: 1px;
  border-style: solid;
  border-color: var(--secondary-23);
}
.border-image-list .border-image-list-item a.active{
  border-color: var(--secondary-1);
}
.border-image-list .border-image-list-item a img{
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.product-detail-slide-content-box .border-image-list .border-image-list-item{
  margin-bottom: 40px;
}
.add-to-cart-content{
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.plus-minus-box{
  display: flex;
  justify-content: flex-start;
  border: 1px solid var(--primary-1);
  border-radius: 8px;
  overflow: hidden;
}
.plus-minus-box input{
  width: 100px;
  height: auto;
  border: none;
  text-align: center;
}
.plus-minus-box a{
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  background-color: var(--primary-1);
}
.plus-minus-box a svg{
  color: var(--white);
}
.add-to-cart-content .btn-container .btn.btn.btn-primary-1{
  height: 50px;
  border-radius: 8px;
}
.add-to-cart-content .plus-minus-box, .add-to-cart-content .btn-container{
  margin-bottom: 4px;
}
.add-to-cart-content .plus-minus-box, .add-to-cart-content .btn-container:not(.btn-container.icon-btn-container){
  margin-right: 20px;
}
.icon-with-detail-content-box{
  display: inline-block;
  padding: 30px 0px;
  border-radius: 8px;
  border: 1px solid var(--secondary-23);
}
.icon-with-detail-list{
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.icon-with-detail-list .icon-with-detail-list-item{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0px 30px;
}
.icon-with-detail-list .icon-with-detail-list-item:not(:last-child)::after{
  position: absolute;
  content: "";
  top: 0px;
  right: 0px;
  bottom: 0px;
  width: 1px;
  background-color: var(--secondary-23);
}
.icon-with-detail-list .icon-with-detail-list-item .detail-content-box h5{
  font-size: var(--fs-20);
  font-family: var(--Font-Medium);
  margin-bottom: 8px;
}
.icon-with-detail-list .icon-with-detail-list-item .detail-content-box p,
.icon-with-detail-list .icon-with-detail-list-item .detail-content-box p a{
  font-size: var(--fs-14);
  font-family: var(--Font-Medium);
  color: var(--black);
}
.icon-with-detail-list .icon-with-detail-list-item .detail-content-box p a{
  text-decoration: underline;
}
.icon-with-detail-list .icon-with-detail-list-item .icon-image{
  margin-right: 15px;
}

/* Review Section - Relative Style CSS Start */
.review-content .rate-list{
  margin-bottom: 30px;
}
.review-content .review-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.review-content .review-header h5{
  margin-right: 12px;
  margin-bottom: 12px;
}
.review-content .review-header span{
  font-size: var(--fs-16);
  line-height: 18px;
  font-family: var(--Font-Semi-Bold);
  color: rgb(var(--black-rgb), var(--background-color-opacity-5));
  margin-bottom: 12px;
}
.progress-bar-list .progress-bar-list-item{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.progress-bar-list .progress-bar-list-item h6{
  width: 48px;
  max-width: 48px;
  font-size: var(--fs-16);
  line-height: 18px;
  font-family: var(--Font-Semi-Bold);
  color: var(--secondary-1);
  margin-right: 10px;
  margin-bottom: 10px;
}
.progress-bar-list .progress-bar-list-item .progress{
  position: relative;
  flex: 1;
  height: 32px;
  padding: 3px;
  margin-bottom: 10px;
  background-color: var(--secondary-7);
  border: 1px solid var(--secondary-7);
  border-radius: 8px;
  box-shadow: none;
}
.progress-bar-list .progress-bar-list-item .progress .progress-bar{
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  box-shadow: none;
}
.progress-bar-list .progress-bar-list-item .progress .progress-bar span{
  position: absolute;
  left: 5px;
  top: 50%;
  transform: translateY(-50%);
  font-size: var(--fs-14);
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
  text-align: center;
}
.progress-bar.bg-secondary-8{
  background-color: var(--secondary-8);
}
.review-content-box h3{
  font-size: var(--fs-30);
  line-height: 40px;
  font-family: var(--Font-Bold);
  color: var(--secondary-1);
  margin: 15px 0px 20px;
}
.review-content-box .review-list-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.review-content-box .review-list-header .review-list-header-left{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.review-content-box .review-list-header .review-list-header-left .circle-with-label{
  display: flex;
  align-items: center;
  margin-bottom: 12px;
}
.review-content-box .review-list-header .review-list-header-left h4{
  font-size: var(--fs-20);
  margin: 0px 10px;
}
.review-content-box .review-list-header .review-list-header-left .button-list,
.review-content-box .review-list-header .rate-list{
  margin-bottom: 12px;
}
.review-content-box .review-list-header .review-list-header-left .button-list .border-btn{
  font-size: var(--fs-12);
  line-height: 14px;
  font-family: var(--Font-Regular);
  padding: 6px 10px;
}
.review-content-box .review-list-header .review-list-header-left .button-list .border-btn:not(:last-child){
  margin-right: 10px;
}
.review-content-box .review-list-body p{
  font-size: var(--fs-18);
  line-height: 28px;
  font-family: var(--Font-Regular);
  color: var(--primary-1);
}
.review-content-box .review-list-body p span{
  font-family: var(--Font-Bold);
}
.review-list .review-list-item{
  padding: 15px;
  border-radius: 2px;
  border: 1px solid var(--secondary-27);
}
.review-list .review-list-item:not(:last-child){
  margin-bottom: 20px;
}
/* Product Listing Details - Relative Style CSS End */

/* Page Not Found - Relative Style CSS Start */
.page-not-found-container .content-box{
  text-align: center;
}
.page-not-found-container .content-box h1{
  font-size: var(--fs-110);
  line-height: 115px;
  font-family: var(--Font-Extra-Bold);
  color: var(--black);
  margin-bottom: 40px;
}
.page-not-found-container .content-box p{
  font-size: var(--fs-20);
  line-height: 24px;
  font-family: var(--Font-Regular);
  color: var(--black);
}
.page-not-found-container .content-box .btn-container{
  margin-top: 50px;
}
.page-not-found-container .content-box .btn-container .btn.read-more-btn{
  padding: 18px 70px;
}
/* Page Not Found - Relative Style CSS End */

/* Shopping Cart - Relative Style CSS Start */
.checkbox-xl.checkbox-container input{
  min-width: 40px;
  max-width: 40px;
  height: 40px;
  margin: 0px 25px 0px 0px;
}
.checkbox-xl.checkbox-container label{
  font-size: var(--fs-30);
  line-height: 50px;
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
}
.checkbox-xl.checkbox-container input:checked:after{
  left: 16px;
  top: 7px;
  width: 10px;
  height: 20px;
}
.column-card-view .column-card-content-box{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.column-card-view .column-card-content-box .card-container.cmn-add-to-cart-card > a{
  padding: 0px;
}
.column-card-view .column-card-content-box .card-container.cmn-add-to-cart-card .image-content-box{
  width: 250px;
  margin-bottom: 0px;
}
.column-card-view .column-card-view-item:not(:last-child){
  margin-right: 30px;
}
.column-card-view .column-card-view-item .checkbox-container input{
  margin-right: 0px;
}
.column-card-view .column-card-view-item h4{
  margin: 15px 0px 15px;
}
.column-card-view .column-card-view-item .card-content-box .amount-content-box{
  margin-bottom: 15px;
}
.column-card-view .column-card-view-item .card-content-box .add-to-cart-content .plus-minus-box a{
  width: 40px;
  height: 40px;
}
.column-card-view .column-card-view-item .card-content-box .add-to-cart-content .plus-minus-box input{
  width: 70px;
  font-size: var(--fs-16);
  font-family: var(--Font-Bold);
  padding: 0px 8px;
}
.column-card-view .column-card-view-item .card-content-box .add-to-cart-content > div{
  margin-right: 20px;
  margin-bottom: 15px;
}
.column-card-view .column-card-view-item .card-content-box .add-to-cart-content > div:last-child{
  margin-right: 0px;
}
.column-card-view .column-card-view-item .card-content-box .add-to-cart-content .btn-container .btn.read-more-btn{
  padding: 4px 24px;
}
.column-card-view .column-card-view-item .card-content-box .content-list-item{
  display: flex;
  align-items: center;
}
.column-card-view .column-card-view-item .card-content-box .content-list-item label{
  margin-right: 25px;
  margin-bottom: 30px;
}
.column-card-view .column-card-view-item .card-content-box .content-list-item .button-list .border-btn{
  margin-bottom: 30px;
}
.column-card-view .all-section-space{
  margin-bottom: 20px;
}
.summary-content-box .summary-header-title{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
.summary-content-box .summary-header-title h4{
  font-size: var(--fs-24);
  margin-bottom: 20px;
  margin-right: 12px;
}
.summary-content-box .summary-header-title span{
  font-size: var(--fs-14);
  line-height: 16px;
  font-family: var(--Font-Semi-Bold);
  color: rgb(var(--black-rgb), var(--background-color-opacity-2));
  margin-bottom: 20px;
}
.summary-content-box .summary-header-title.summary-icon-title{
  margin-bottom: 0px;
}
.summary-content-box .summary-header-title img{
  width: 40px;
  margin-bottom: 20px;
}
.summary-content-box p{
  font-size: var(--fs-18);
  font-family: var(--Font-Semi-Bold);
  color: var(--primary-1);
}
.summary-content-box .summary-btn{
  margin-top: 30px;
}
.summary-content-box .summary-btn a{
  font-size: var(--fs-16);
  line-height: 18px;
  font-family: var(--Font-Semi-Bold);
  color: var(--secondary-4);
  text-decoration: none;
}
.summary-content-box .summary-btn a:not(:last-child){
  margin-right: 40px;
}
.summary-list .summary-list-item{
  display: flex;
  justify-content: space-between;
}
.summary-list .summary-list-item{
  margin-bottom: 30px;
}
.summary-list .summary-list-item p{
  font-size: var(--fs-16);
  line-height: 18px;
  font-family: var(--Font-Semi-Bold);
  color: var(--primary-1);
}
.summary-list .summary-list-item p span{
  display: inline-block;
  font-size: var(--fs-14);
  color: rgb(var(--black-rgb), var(--background-color-opacity-2));
  margin-left: 15px;
}
.summary-list .summary-list-item p:last-child{
  text-align: right;
}
.summary-list .summary-list-item p:first-child{
  padding-right: 8px;
}
.summary-list .summary-list-item:last-child p{
  font-size: var(--fs-24);
}
/* Shopping Cart - Relative Style CSS End */

/* Add Address - Relative Style CSS Start */
.heading-title h3{
  font-size: var(--fs-30);
  line-height: 36px;
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
  margin-bottom: 20px;
}
.form-content-box{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-bottom: 20px;
}
.form-content-box .form-title h5{
  font-size: var(--fs-22);
  line-height: 24px;
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
  margin-right: 30px;
  /* margin-bottom: 20px; */
}
.billing-address-form-content-box{
  margin-top: 20px;
}
.form-content-box .checkbox-container{
  /* margin-bottom: 20px; */
}


/* Add Address - Relative Style CSS End */

/* Tabs - Relative Style CSS Start */
.tabs-container .nav.nav-tabs{
  /* position: relative; */
  display: flex;
  justify-content: flex-end;
  border-bottom: none;
  /* z-index: 3; */
}
.tabs-container .nav.nav-tabs > li > a{
  position: relative;
  background-color: var(--white);
  border-radius: 8px;
  border: none;
  margin: 0px;
  padding: 16px 10px;
  opacity: 0.4;
}
.tabs-container .nav.nav-tabs > li.active > a{
  opacity: 1;
}
.tabs-container .nav.nav-tabs > li > a .icon-with-label span{
  font-size: var(--fs-16);
  line-height: 18px;
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
}
.tabs-container .nav.nav-tabs > li:not(:last-child) > a::after{
  position: absolute;
  content: "";
  top: 50%;
  left: 100%;
  width: 50px;
  height: 2px;
  background-color: var(--white);
  transform: translateY(-50%);
  margin-left: 8px;
  margin-right: 8px;
}
.tabs-container .nav.nav-tabs > li:not(:last-child) > a{
  margin-right: 66px;
}
.minus-top{
  min-height: 50px;
  margin-top: -90px;
  margin-bottom: 40px;
}
.tabs-container .tab-content{
  padding: 35px 0px 0px 0px;
}
.tabs-container .tab-content .payment-method-content .checkbox-container label{
  font-size: var(--fs-18);
  color: var(--black);
}
.tabs-container .tab-content .form-fill-content .checkbox-container label{
  color: var(--primary-1);
}
.tabs-container .tab-content .payment-method-content .radio-box-container label{
  font-family: var(--Font-Semi-Bold);
}
.icon-with-label{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.icon-with-label img{
  width: 24px;
  margin-right: 8px;
}

.tabs-column-container{
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}
.tabs-column-container ul{
  position: sticky;
  top: 220px;
  width: 490px;
  flex: 0 0 auto;
  padding: 30px 0px;
  border-radius: var(--border-radius-20);
  background-color: var(--white);
  border: 1px solid var(--secondary-7);
  box-shadow: var(--box-shadow-1); 
}
.tabs-column-container ul > li{
  float: initial;
  margin-bottom: 0px;
}
.tabs-column-container ul > li > a{
  font-size: var(--fs-20);
  line-height: 20px;
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
  padding: 20px 30px;
  border-radius: 0px;
  border: none !important;
  margin-right: 0px;
}
.tabs-column-container ul > li > a:hover,
.tabs-column-container ul > li.active a,
.tabs-column-container ul > li.active a:hover,
.tabs-column-container ul > li.active a:focus{
  color: var(--black);
  background: linear-gradient(93.88deg, var(--secondary-4) -38.74%, var(--secondary-5) 52.18%, var(--secondary-4) 143.09%);
}
.tabs-column-container ul > li:first-child a{
  font-size: var(--fs-24);
  line-height: 28px;
  font-family: var(--Font-Semi-Bold);
  color: var(--secondary-1);
}
.tabs-column-container ul > li:first-child a:hover{
  background: var(--transparent);
  cursor: text;
}
.tabs-column-container .tab-content{
  flex: 1;
  padding-top: 0px;
  padding-left: 45px;
}
.tabs-column-container .panel-group .panel-default.panel .panel-heading > a{
  padding: 20px 30px 20px 40px;
}
.tabs-column-container .panel-group .panel-heading + .panel-collapse > .panel-body{
  padding: 20px 40px 10px 40px;
}
.tabs-column-container .panel-group .panel{
  border-radius: 14px;
}
.tabs-column-container .panel-group .panel+.panel{
  margin-top: 20px;
}
.tabs-column-container .panel-group .panel-heading + .panel-collapse > .panel-body .alert{
  margin-bottom: 20px;
}
/* Tabs - Relative Style CSS End */

/* Alert - Relative Style CSS Start */
.alert-container .alert{
  padding: 30px 40px;
  border-radius: 8px;
  border: 1px solid var(--secondary-8);
  border-left-width: 8px;
}
.alert-container .alert h5{
  font-size: var(--fs-20);
  line-height: 24px;
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
}
.alert-container .alert p{
  font-size: var(--fs-16);
  line-height: 20px;
  font-family: var(--Font-Regular);
  color: var(--black);
}
.alert-container .alert p + p{
  margin-top: 10px;
}
.alert-container .alert h5 + p{
  margin-top: 15px;
}
.alert-container .alert.alert-warning{
  background: rgb(var(--secondary-rgb-8), var(--background-color-opacity-6));
}
/* Alert - Relative Style CSS End */

/* Side Panel Custom Create - Relative Style CSS Start */
.side-panel-container {
  position: relative;
}
.backdrop-overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgb(var(--black-rgb), 0.5);
  backdrop-filter: blur(2px);
  visibility: hidden;
  z-index: 9998;
}
.open .backdrop-overlay{
  visibility: visible;
}
.side-panel-container .side-panel-content-box {
  display: flex;
  flex-direction: column;
  position: fixed;
  top: 0px;
  bottom: 0px;
  right: 0px;
  width: 600px;
  border-radius: 20px 0px 0px 20px;
  overflow: hidden;
  transform: translateX(100%);
  background-color: var(--white);
  box-shadow: var(--box-shadow-1);
  transition: transform 0.3s ease;
  z-index: 9999;
}
.side-panel-container.open .side-panel-content-box {
  transform: translateX(0%);
  transition: transform 0.3s ease;
}
.side-panel-container .side-panel-content-box .side-panel-content{
  height: 100vh;
  display: flex;
  flex-direction: column;
}
.side-panel-container .side-panel-content-box .side-panel-content .side-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: var(--primary-1);
  padding: 20px 30px;
}
.side-panel-container .side-panel-content-box .side-panel-content .side-panel-header h3{
  font-size: var(--fs-24);
  /* font-family: var(--Font-Bold); */
  color: var(--white);
}
.side-panel-container .side-panel-content-box .side-panel-content .side-panel-header svg{
  font-size: var(--fs-26);
  color: var(--white);
}
.side-panel-container .side-panel-content-box .side-panel-content .side-panel-body {
  flex-grow: 1;
  padding: 40px;
  overflow-y: auto;
}
/* Side Panel Custom Create - Relative Style CSS End */

/* Modal - Relative Style CSS Start */
.modal-container .modal-dialog{
  width: 790px;
  height: 100vh;
  display: flex;
  align-items: flex-start;
  margin: auto;
  padding: 30px 30px;
}
.modal-container .modal-dialog .modal-content{
  width: 100%;
  border-radius: 20px;
  box-shadow: none;
  margin: auto 0px auto 0px;
}
.modal-container .modal-dialog .modal-content .modal-header{
  padding: 60px 0px 30px;
  border-bottom: none;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}
.modal-container .modal-dialog .modal-content .modal-header::before,
.modal-container .modal-dialog .modal-content .modal-header::after{
  display: none;
}
.modal-container .modal-dialog .modal-content .modal-header .circle-box{
  margin: 0px auto;
}
.modal-container .modal-dialog .modal-content .modal-body h4{
  font-size: var(--fs-20);
  line-height: 22px;
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
  margin-bottom: 15px;
}
.modal-container .modal-dialog .modal-content .modal-body{
  text-align: center;
  padding: 0px 80px 80px;
}
.modal-container .modal-dialog .modal-content .modal-body p{
  font-size: var(--fs-18);
  line-height: 28px;
  font-family: var(--Font-Regular);
  color: var(--black);
}
.modal-container.cmn-modal-container .modal .modal-dialog{
  width: 600px;
}
.modal-container.cmn-modal-container .modal .modal-dialog .modal-content .modal-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: var(--primary-1);
  padding: 20px 30px;
}
.modal-container.cmn-modal-container .modal .modal-dialog .modal-content .modal-header h4{
  font-size: var(--fs-24);
  /* font-family: var(--Font-Bold); */
  color: var(--white);
}
.modal-container.cmn-modal-container .modal .modal-dialog .modal-content .modal-header svg{
  font-size: var(--fs-26);
  color: var(--white);
}
.modal-container.cmn-modal-container .modal .modal-dialog .modal-content .modal-body{
  padding: 30px 30px 30px;
  text-align: left;
}
/* Modal - Relative Style CSS End */

.label-value-list .label-value-list-item{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.label-value-list .label-value-list-item:not(:last-child){
  margin-bottom: 20px;
}
.label-value-list .label-value-list-item label{
  min-width: 150px;
  font-size: var(--fs-16);
  line-height: 18px;
  font-family: var(--Font-Semi-Bold);
  color: rgb(var(--primary-rgb-1), var(--background-color-opacity-2));
}
.label-value-list .label-value-list-item span{
  display: inline-block;
  font-size: var(--fs-16);
  line-height: 18px;
  font-family: var(--Font-Semi-Bold);
  color: var(--primary-1);
  padding-left: 15px;
}
.add-address.cmn-shadow-box{
  min-height: 230px;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: var(--fs-24);
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
  background-color: var(--secondary-7);
  transition: all 0.5s ease-in-out;
  box-shadow: none;
}
.add-address.cmn-shadow-box:hover{
  text-decoration: none;
  color: var(--secondary-1);
  transition: all 0.5s ease-in-out;
}

/* Card Border - Relative Style CSS Start */
.card-title-header{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.card-title-header h3{
  font-size: var(--fs-22);
  line-height: 26px;
  font-family: var(--Font-Semi-Bold);
  color: var(--black);
  margin-bottom: 30px;
  margin-right: 15px;
}
.card-title-header h4{
  font-size: var(--fs-20);
  line-height: 24px;
  font-family: var(--Font-Semi-Bold);
  color: rgb(var(--black-rgb), var(--background-color-opacity-2));
  margin-bottom: 30px;
}
.card-border-list .card-border-list-item{
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 20px 0px;
  border-bottom: 1px solid var(--secondary-22);
}
.card-border-list .card-border-list-item:first-child{
  padding-top: 0px;
}
.card-border-list .card-border-list-item .card-border-content-box{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex: 1;
  padding-left: 30px;
}
.card-border-list .card-border-list-item .card-border-content-box .card-border-content-left{
  padding-right: 30px;
}
.card-border-list .card-border-list-item .card-border-content-box .card-border-content-right{
  text-align: right;
}
.card-border-list .card-border-list-item .card-border-content-box h5{
  margin-bottom: 10px;
}
.card-border-list .card-border-list-item .card-border-content-box h6{
  font-size: var(--fs-24);
  line-height: 28px;
  font-family: var(--Font-Semi-Bold);
  color: var(--secondary-1);
  margin-bottom: 10px;
}
.card-border-list .card-border-list-item .image-content-box{
  width: 220px;
  max-width: 220px;
  height: 150px;
  background-color: var(--secondary-7);
  box-shadow: var(--box-shadow-2);
}
.card-border-list .card-border-list-item .image-content-box img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 10px 0px;
  transition: all 1s ease-out;
}
.card-border-list .card-border-list-item .image-content-box img.hover-image{
  display: none;
  opacity: 0;
  transition: all 1s ease-out;
}
.card-border-list .card-border-list-item a:hover .image-content-box img.hover-image{
  display: block;
  opacity: 1;
  transition: all 1s ease-out;
  padding: 0px;
  object-fit: cover;
}
.card-border-list .card-border-list-item a:hover .image-content-box img.preview-image{
  display: none;
}
.your-order-content .summary-content-box.cmn-shadow-box{
  background-color: var(--secondary-7);
  box-shadow: none;
}
.your-addresses-content .add-address.cmn-shadow-box{
  background-color: var(--white);
}
/* Card Border - Relative Style CSS End */

.download-box{
  display: flex;
  justify-content: space-between;
  padding: 25px 30px;
  border-radius: 16px;
  background-color: var(--white);
}
.download-box img{
  width: 30px;
}
.download-box .icon-with-label{
  margin-right: 10px;
}
.download-box .icon-with-label img{
  margin-right: 15px;
}
.download-box .icon-with-label span{
  font-size: var(--fs-18);
  line-height: 20px;
  font-family: var(--Font-Regular);
  color: var(--secondary-28);
}

/* Privacy Policy Page - Text Editor - Relative Style CSS Start */
.privacy-policy-container a{
  font-size: var(--fs-18);
  color: var(--secondary-1);
  text-decoration: none;
  padding-bottom: 2px;
  border-bottom: 1px solid var(--transparent);
}
.privacy-policy-container a:hover{
  border-bottom-color: var(--secondary-1);
}
.privacy-policy-container h2{
  font-size: var(--fs-40);
  font-family: var(--Font-Bold);
  color: var(--primary-1);
  text-align: center;
  margin-bottom: 50px;
}
.privacy-policy-container h3,
.privacy-policy-container h4,
.privacy-policy-container h5,
.privacy-policy-container h6{
  margin: 30px 0px;
}
.privacy-policy-container h3{
  font-size: var(--fs-28);
  line-height: 32px;
  font-family: var(--Font-Semi-Bold);
  color: var(--primary-1);
}
.privacy-policy-container > h3{
  border-left: 5px solid var(--secondary-1);
  padding-left: 15px;
}
.privacy-policy-container h4{
  font-size: var(--fs-24);
  line-height: 32px;
  font-family: var(--Font-Semi-Bold);
}
.privacy-policy-container h5{
  font-size: var(--fs-20);
  font-family: var(--Font-Semi-Bold);
}
.privacy-policy-container h6{
  font-size: var(--fs-18);
  font-family: var(--Font-Semi-Bold);
}
.privacy-policy-container ul li h4,
.privacy-policy-container ul li h5,
.privacy-policy-container ul li h6{
  margin: 50px 0px 20px;
}
.privacy-policy-container b{
  font-family: var(--Font-Bold);
}
.privacy-policy-container p, .privacy-policy-container ul li, .privacy-policy-container ol li{
  font-size: var(--fs-18);
  line-height: 32px;
  font-family: var(--Font-Medium);
  color: var(--primary-1);
}
.privacy-policy-container p + p{
  margin-top: 8px;
}
.privacy-policy-container ol{
  padding-left: 44px;
}
.privacy-policy-container ol li::marker{
  font-size: var(--fs-24);
  color: var(--secondary-1);
  list-style-type: decimal;
  margin: 20px 0px 20px;
}
.privacy-policy-container ol li{
  padding-bottom: 20px;
}
.privacy-policy-container ol li h3{
  border-left: none;
  padding-left: 0px;
  margin-bottom: 20px;
  margin-top: 20px;
}
.privacy-policy-container ol li h4{
  margin-bottom: 20px;
  margin-top: 20px;
}
.privacy-policy-container ol li h5,
.privacy-policy-container ol li h6{
  margin-bottom: 15px;
}
.privacy-policy-container ul{
  font-size: var(--fs-28);
  color: var(--secondary-1);
  list-style-type: none;
  margin: 20px 0px 20px;
}
.privacy-policy-container ul li:not(:last-child){
  margin-bottom: 12px;
}
.privacy-policy-container ul li{
  position: relative;
  padding-left: 44px;
}
.privacy-policy-container ul li h3, .privacy-policy-container ul li h4,
.privacy-policy-container ul li h5, .privacy-policy-container ul li h6 {
  margin-top: 20px;
  margin-bottom: 8px;
}
.privacy-policy-container ul li h5{
  line-height: 30px;
}
.privacy-policy-container ul li h6{
  line-height: 32px;
}
.privacy-policy-container ul li::before{
  position: absolute;
  content: "";
  top: 15px;
  left: 0px;
  width: 27px;
  height: 2px;
  background-color: var(--secondary-1);
}
.privacy-policy-container ul li::after{
  position: absolute;
  content: "";
  top: 10px;
  left: 15px;
  width: 12px;
  height: 12px;
  display: inline-block;
  border-style: solid;
  border-width: 0px 2px 2px 0px;
  border-right-color: var(--secondary-1);
  border-bottom-color: var(--secondary-1);
  transform: rotate(315deg);
}
/* Privacy Policy Page - Text Editor - Relative Style CSS End */

/* Profile Dropdown - Customize - Relative Style CSS Start */
.profile-dropdown .dropdown .dropdown-menu{
  right: 0px;
  left: initial;
  width: 250px;
  padding: 12px 0px;
  margin: 0px;
  border: none;
}
.profile-dropdown .dropdown .dropdown-menu .profile-content-box{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 8px;
  padding: 15px 15px;
  border-bottom: 1px solid var(--secondary-22);
}
.profile-dropdown .dropdown .dropdown-menu .profile-content-box .profile-image{
  width: 50px;
  height: 50px;
  border-radius: 100%;
  background: linear-gradient(93.88deg, var(--secondary-4) -38.74%, var(--secondary-5) 52.18%, var(--secondary-4) 143.09%);
  border: 1px solid var(--secondary-1);
  margin-right: 12px;
  overflow: hidden;
}
.profile-dropdown .dropdown .dropdown-menu .profile-content-box .profile-image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.profile-dropdown .dropdown .dropdown-menu .profile-content-box .user-information span{
  display: inline-block;
  font-size: var(--fs-14);
  line-height: 16px;
  font-family: var(--Font-Semi-Bold);
  color: rgb(var(--black-rgb), var(--background-color-opacity-2));
  margin-top: 4px;
}
.profile-dropdown .dropdown .dropdown-menu a{
  display: inline-block;
}
.profile-dropdown .dropdown .dropdown-menu .new-customer{
  text-align: center;
  padding: 8px 15px 8px;
  margin-bottom: 15px;
  border-bottom: 1px solid var(--secondary-1);
}
.profile-dropdown .dropdown .dropdown-menu .new-customer span{
  margin-right: 4px;
}
.profile-dropdown .dropdown .dropdown-menu .new-customer a{
  color: var(--secondary-1);
}
.profile-dropdown .dropdown .dropdown-menu .new-customer a:hover{
  text-decoration: underline !important;
}
.profile-dropdown .dropdown .dropdown-menu h4{
  padding: 0px 15px;
  margin: 20px 0px 8px;
}
.profile-dropdown .dropdown .dropdown-menu ul li a{
  display: block;
  font-family: var(--Font-Medium);
  color: var(--primary-1);
  padding: 6px 15px;
}
.profile-dropdown .dropdown .dropdown-menu ul li a:hover{
  color: var(--secondary-1);
}
/* Profile Dropdown - Customize - Relative Style CSS End */

/* Login Page - Customize - Relative Style CSS Start */
.login-container{
  height: 100vh;
  display: flex;
  justify-content: flex-start;
}
.login-container .overlay-image::after{
  background: linear-gradient(90.05deg, rgb(40, 47, 57, 0.8) 0.04%, rgb(40, 47, 57, 0.41) 99.95%);
}
.login-container .overlay-image{
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
}
.login-container .login-left{
  position: relative;
  flex: 1;
  align-content: center;
  padding: 0% 7% 0% 7%;
  overflow: hidden;
}
.login-container .login-left .heading-content-box{
  position: relative;
}
.login-container .heading-content-box h1{
  font-size: var(--fs-90);
  line-height: 110px;
  font-family: var(--Font-Bold);
  color: var(--white);
  margin-bottom: 60px;
}
.login-container .heading-content-box p{
  font-size: var(--fs-44);
  line-height: 54px;
  font-family: var(--Font-Regular);
  color: var(--white);
}
.login-container .login-right{
  width: 35%;
  display: flex;
  flex-direction: column;
  flex: 0 0 auto;
  background-color: var(--primary-1);
  box-shadow: var(--box-shadow-1);
}
.login-container .login-right .login-right-header{
  padding: 30px 40px 20px;
}
.login-container .login-right .login-right-header a:hover{
  text-decoration: none;
}
.login-container .login-right .login-right-header a{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.login-container .login-right .login-right-header .circle-box{
  width: 60px;
  height: 60px;
  flex: 0 0 auto;
  border-radius: 100%;
  background-color: var(--secondary-30);
  border: 1px solid var(--white);
  margin-right: 20px;
}
.login-container .login-right .login-right-header .circle-box svg{
  font-size: var(--fs-26);
  color: var(--white);
}
.login-container .login-right .login-right-header a span{
  font-size: var(--fs-22);
  line-height: 26px;
  font-family: var(--Font-Semi-Bold);
  color: var(--white);
}
.login-container .login-right .login-right-body{
  display: flex;
  flex-direction: column;
  flex: 1;
  overflow-y: auto;
  padding: 40px 40px 40px;
}
.login-container .login-right .login-right-body h3{
  font-size: var(--fs-50);
  font-family: var(--Font-Semi-Bold);
  color: var(--white);
  margin-bottom: 60px;
}
.login-container .login-right .login-right-body .login-content-box{
  margin: auto 0px auto;
}
.login-container .form-group{
  margin-bottom: 40px;
}
.login-container .login-right .login-right-body label{
  color: var(--white);
}
.login-container .login-right .login-right-body .form-control{
  color: var(--white);
  background-color: var(--secondary-30);
}
.login-container .login-right .login-right-body .form-control::placeholder{
  color: rgb(var(--white-rgb), var(--background-color-opacity-7));
}
.login-container .remember-forgot-password-content-box{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.login-container .remember-forgot-password-content-box .checkbox-container{
  margin-bottom: 40px;
  padding-right: 20px;
}
.login-container .remember-forgot-password-content-box .checkbox-container input::before{
  background-color: var(--transparent);
  border: 1px solid var(--white);
}
.login-container .remember-forgot-password-content-box .checkbox-container input::after{
  top: 5px;
  border-width: 0px 3px 3px 0px;
  border-image-slice: 1;
  border-image-source: linear-gradient(93.88deg, var(--secondary-4) -38.74%, var(--secondary-5) 52.18%, var(--secondary-4) 143.09%);
}
.login-container .remember-forgot-password-content-box .checkbox-container label{
  font-size: var(--fs-18);
}
.login-container .remember-forgot-password-content-box a{
  font-size: var(--fs-18);
  line-height: 18px;
  font-family: var(--Font-Semi-Bold);
  background: linear-gradient(93.88deg, var(--secondary-4) -38.74%, var(--secondary-5) 52.18%, var(--secondary-4) 143.09%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 40px;
}
.login-container .login-content-box .btn-container .btn{
  width: 100%;
  font-size: var(--fs-20);
  padding: 20px 35px;
}
.login-container .login-content-box .sign-up-text{
  font-size: var(--fs-16);
  line-height: 18px;
  font-family: var(--Font-Regular);
  color: var(--white);
  text-align: center;
  margin-top: 50px;
}
.login-container .login-content-box .sign-up-text a{
  font-family: var(--Font-Semi-Bold);
  background: linear-gradient(93.88deg, var(--secondary-4) -38.74%, var(--secondary-5) 52.18%, var(--secondary-4) 143.09%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
/* Login Page - Customize - Relative Style CSS End */

/* Scroll Stlye CSS Start */
::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}
::-webkit-scrollbar-track {
  background: var(--primary-1);
}
::-webkit-scrollbar-thumb {
  background: var(--secondary-1);
  border-radius: var(--border-radius-20);
}
::-webkit-scrollbar-thumb:hover {
  background: var(--primary-1);
}
/* Scroll Stlye CSS End */