#prodct-detila-inner { padding: 0px 0; position: relative; }
.prodct-filtter-left-1 {  } 

#prodct-detila-inner{height:100vh;overflow:hidden}
.scrollable-area{height:100vh;overflow-y:auto}
#main-preview{width:100%;transition:opacity .2s ease-in-out}
.btn-orange{background-color:#d86d03;color:#fff}
.btn-orange:hover{background-color:#333;color:#fff}
.fabric-card{cursor:pointer;transition:transform .2s;text-align:center;padding:10px 22px}
.fabric-card:hover{transform:scale(1.03)}
#style-item-wrpr .card{border:none!important}
@media (min-width: 768px) {
.filltr-btn-formobile{display:none}
.offcanvas{visibility:visible!important;transform:none!important;position:static!important;display:block!important;width:100%!important;border:none!important;background:transparent!important}
.offcanvas-header{display:none}
#v-pills-tab-desktop{position:absolute;left:30px;z-index:10; top: 38px !important; }
.nav-pills .nav-link{color:#666;font-size:.8rem;letter-spacing:1px;border-radius:0;padding:1rem .5rem;text-align:left}
.nav-pills .nav-link.active{background-color:transparent!important;color:#000!important;font-weight:700;border-left:2px solid #000}
}
@media (max-width: 767.98px) {
#prodct-detila-inner{height:auto;overflow:visible}
.scrollable-area{height:auto;border:none!important}
.filltr-btn-formobile{display:inline-block;margin:15px}
#v-pills-tab-mobile{display:flex!important;flex-direction:row;width:100%;margin-bottom:20px;border-bottom:1px solid #eee}
#v-pills-tab-mobile .nav-link{flex:1;font-size:.75rem;text-align:center;color: #757575;padding:10px 5px;border-bottom:2px solid transparent}
#v-pills-tab-mobile .nav-link.active{color:#000;background:none;border-bottom:2px solid #000}
#main-preview{width:80%;left:0;top:0}
.posi-moble{position:relative!important;text-align:center!important;top:0!important;transform:none!important;padding:20px!important}
}
.main-outpup-img {
  width: 375px;
  position: relative;
  left: -87px;
  top: -55px;
}
.chck-boxs-1 {
  position: absolute;
  bottom: 65px;
  left: -149px;
  right: 0;
  margin: 0px auto;
    margin-top: 0px;
  padding: 22px 7px;
}
.form-check-input:checked {
  background-color: #333;
  border-color: #333;
}
@media (max-width: 767.98px) {
  .dlflx {
    flex-direction: column !important;
    padding-top: 2rem;
  }
  .chck-boxs-1 {
    order: 3; /* Moves checkboxes below the image and text */
    padding-bottom: 50px;
  }
}
.hadng-left-filter {  }
.hadng-left-filter h4 {
  margin: 0px auto;
  font-size: 17px;
  background: #f4f4f4;
  padding: 8px 12px;
}