:root {
  --columns: 3;
}


.bwdtwpx-product-container .ul{
  margin-inline: 0!important;
  margin-block: 0!important;
  padding-inline: 0!important;
  position: relative;
  padding-block: 0!important;
  display: grid;
  grid-template-columns: repeat(var(--columns),1fr);
}
.bwdtwpx-product-container .ul::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    /* background-image: url('https://websama.ir/test/wp-content/plugins/bwdtwpx-3D-woocommerce-product-layout/assets/public/image/bg.svg'); */
    background-size: calc(200%/(var(--columns)));
}

.bwdtwpx-product-container .li{
  grid-column-end: span 2;
  position: relative;
  padding-block-end: 86.66%!important;
  margin-inline: 0!important;
  margin-block: 0!important;
}
.bwdtwpx-product-container .li a {
	display: inline!important;
}

.bwdtwpx-product-container .li:nth-child(2n-1){
  grid-column-start:2;
}

.bwdtwpx-product-container .li:before {
    content: "";
    position: absolute;
    inset-inline-end: 0;
    inline-size: 50%;
    block-size: 100%;
    background-position: 90% 27%;
    opacity: 0.6;
    transform: skewy(30deg);
    background-size: 40%;
    background-repeat: no-repeat;
}
.div-after-li{
  position: absolute;
  inline-size: 50%;
  transform: skewy(-30deg);
  margin-block-start: 14%;
  padding-inline: 3%!important;
  padding-block: 3%!important;
}

.bwdtwpx-product-container .bwdtwpx-product-title {
  transition: all .3s ease-in-out;
}

.bwdtwpx-product-container img{
  position: absolute;
  inset-inline-start: 50%;
  transform: translateX(-50%);
  inline-size: 62%;
  inset-block-end: -10%;
  -webkit-filter: drop-shadow(0 50px 20px  rgba(0, 0, 0, 0.20));
  filter: drop-shadow(0 50px 20px rgba(0, 0, 0, 0.20));
  transition-property: bottom, filter, -webkit-filter;
  transition-duration: .3s;
}

.bwdtwpx-product-container img:hover{
  inset-block-end: 0;
  -webkit-filter: drop-shadow(0 80px 40px  rgba(0, 0, 0, 0.20));
  filter: drop-shadow(0 80px 30px rgba(0, 0, 0, 0.20));
 }

@media (min-width:600px){
  :root {
    --columns: 5;
  }
  .bwdtwpx-product-container .li:nth-child(2n-1){
    grid-column-start:auto;
  }
  .bwdtwpx-product-container .li:nth-child(4n-3){
    grid-column-start:2;
  }
}
@media (min-width:900px){
  :root {
    --columns: 7;
  }
  .bwdtwpx-product-container .li:nth-child(4n-3){
    grid-column-start:auto;
  }
  .bwdtwpx-product-container .li:nth-child(6n-5){
    grid-column-start:2;
  }
}
@media (min-width:1200px){
  :root {
    --columns: 9;
  }
  .bwdtwpx-product-container .li:nth-child(6n-5){
    grid-column-start:auto;
  }
  .bwdtwpx-product-container .li:nth-child(8n-7){
    grid-column-start:2;
  }
}
@media (min-width:1500px){
  :root {
    --columns: 11;
  }
  .bwdtwpx-product-container .li:nth-child(8n-7){
    grid-column-start:auto;
  }
  .bwdtwpx-product-container .li:nth-child(10n-9){
    grid-column-start:2;
  }
}
@media (min-width:1800px){
  :root {
    --columns: 13;
  }
  .bwdtwpx-product-container .li:nth-child(10n-9){
    grid-column-start:auto;
  }
  .bwdtwpx-product-container .li:nth-child(12n-11){
    grid-column-start: 2;
  }

}
@media (min-width:2100px){
  :root {
    --columns: 15;
  }
  .bwdtwpx-product-container .li:nth-child(12n-11){
    grid-column-start:auto;
  }
  .bwdtwpx-product-container .li:nth-child(14n-13){
    grid-column-start:2;
  }

}