.eleDiv{
  width:45%;
  border: 2px solid #c7c7c7;
  border-radius: 10px;
  position:relative;
  text-align:center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  gap:clamp(0.125rem, 0.0351rem + 0.411vw, 0.3125rem);
  overflow: hidden;
}

@media only screen and (min-width: 768px) { 
  .eleDiv{
    width:30%;
  }
}

@media only screen and (min-width: 1400px) { 
  .eleDiv{
    width:18%;
  }
}

@media only screen and (min-width: 1700px) { 
  .eleDiv{
    width:15%;
  }
}

.leftCol{
  position:absolute;
  top:0;
  left:0;
  width:20%;
  height:100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap:3px;
  z-index:2000;
  z-index: 9999;
}

.leftCol h4{
border-radius:2.5px;
background-color: rgb(244, 59, 59);
color:white;
padding:1px 2px;
font-size: clamp(0.75rem, 0.5702rem + 0.8219vw, 1.125rem);
white-space: nowrap;
min-width:70%;
}
.productNumber{
  height:15%;
  width:100%;
  font-size: clamp(1.125rem, 0.4058rem + 3.2877vw, 2.625rem);
  background-color: red;
  font-weight: 900;
  color:white;
  text-align: center;
  border-bottom-right-radius: 7px;
    border-top-left-radius: 7px;
    display:flex;
    justify-content: center;
    align-items: center;
}

.productDiv{
  align-items: stretch;
}

.productDiv img{
  width:auto;
  border:none;
  border-radius:0%;
}

.leftCol img{
width:80%;
}

.rightCol{
  position:absolute;
  top:0;
  right:0;
  width:20%;
  height:100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap:3px;
    z-index:2000;
    z-index: 9999;
}

.floor{
  height:8%;
  width:100%;
  font-size: clamp(0.75rem, 0.5103rem + 1.0959vw, 1.25rem);
  background-color: red;
  font-weight: 900;
  color:white;
  text-align: center;
  border-bottom-left-radius: 7px;
    border-top-right-radius: 7px;
    display:flex;
    justify-content: center;
    align-items: center;
    position:initial;
    transform: scale(1) !important;
}

.location{
  font-size: clamp(0.75rem, 0.6301rem + 0.5479vw, 1rem);
border-bottom:2px red solid;
white-space:nowrap;
transform:scale(0.8);
transform-origin: top;
}

.ele_logoDiv{
  position:absolute;
  /*top:clamp(0.125rem, 0.0351rem + 0.411vw, 0.3125rem);*/
  top:0;
  width:100%;
  display:flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.ele_logoDiv img{
  width:95%;
}

.ele_productDiv{
  width:100%;
  height:clamp(6.25rem, 4.7517rem + 6.8493vw, 9.375rem);
        display:flex;
  justify-content: center;
  align-items: center;
  margin:5px 0;
  z-index:2222;
}

.ele_productDiv img{
  max-height:clamp(6.25rem, 4.7517rem + 6.8493vw, 9.375rem);
  width:90%;
  z-index:2222;
}

.detail,.model,.name{
  width:80%;
  font-size: clamp(0.75rem, 0.6601rem + 0.411vw, 0.9375rem);
  font-weight: 500;
  z-index: 9999;
}

.name{
  width:90%;
  font-size: clamp(1.125rem, 0.9452rem + 0.8219vw, 1.5rem);
  font-weight: 700;
}

.model{
overflow-wrap: break-word;
}

.sale_date{
  width:100%;
  height: fit-content;
  display: flex;
  align-items: center;
  justify-content:center;
  text-align: center;
  background-color: #108d43;
  color: white;
  border: 3px solid #108d43;
  padding: 3px;
}

.priceBox{
  width:100%;
  display:flex;
  flex-direction:row;
  justify-content: center;
  align-items: center;
  margin-bottom:5px;
  gap:clamp(0.3125rem, 0.1627rem + 0.6849vw, 0.625rem);
}

.price_left{
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items: center;
}

.discount{
  width:60%;
  padding:1.5px 3px;
  border-radius:2.5px;
  color:white;
  background-color:red;
  white-space: nowrap;
}
.mop{
  color:red;
}

.dPrice{
  font-weight: 800;
  text-shadow: 0px 1px, 1px 0px, 1px 1px;
  color:red;
  font-size: MAX(49px,clamp(1.25rem, 0.411rem + 3.8356vw, 3rem));
}

.oPrice{
  text-decoration: line-through;
}

@media only screen and (max-width: 600px) { 
  .location{
    transform:scale(0.80);
    transform-origin: top;
    }
  }
@media only screen and (max-width: 500px) { 
  .rightCol{
    gap:3px;
  }
  .ele_logoDiv img{
    margin-left:4%;
  }
.price_left{
  transform:scale(0.85);
  transform-origin:20%;
}
.location{
  transform:scale(0.85);
  transform-origin: top;
  }

.name{
  width:95%;
  transform: scale(0.95);
  transform-origin: center;
}
.detail{
  width:110%;
  transform: scale(0.8);
  transform-origin: center;
}

.model{
  width:110%;
  transform:scale(0.85);
}
.dPrice{
  transform: scale(1.03);
  transform-origin: right;
  /*font-stretch: condensed;*/
  font-size: 34px;
}
.eleDiv{
  gap:0px;
}

.ele_productDiv img{
  margin-left:4%;
}

.priceBox{
  justify-content: space-around;
  margin-bottom:0px;
}
}

@media only screen and (max-width: 500px) { 
  .priceBox{
    justify-content: center;
    margin-bottom:0px;
    gap:0;
  }

  .leftCol h4 {
    transform: scale(0.85);
    transform-origin: center;
}
  }

  @media only screen and (max-width: 420px) { 
    .price_left{
      transform:scale(0.75);
      transform-origin:20%;
    }
    }

    .discountImg img{
      width:90% !important; 
    }

    .discountImg{
      width:85% !important;
      background-color:white;
      border-radius: 10px;
      border:red solid 2px;
    }

    .yellowBox{
      background:yellow;
      gap: clamp(0.225rem, 0.0351rem + 0.411vw, 0.6125rem);
      padding:10px 0;
    }

    .logoImg{
      width:100% !important;
    }

    .yellowName{
      font-size:1.5em;
    }



    .subcat{
      padding: 10px 25px;
    }

    .subcatDiv{
      margin:17px 0 15px 0 ;
      z-index: 10000;
    }

    @media only screen and (max-width: 770px) { 
      .subcat{
        padding: 15px 35px;
      }
      }

      @media only screen and (max-width: 450px) { 
        .subcat{
          padding: 7.5px 20px;
        }
        }

        .subcat h2{
          font-size: clamp(1.5625rem, 1.113rem + 2.0548vw, 2.5rem);
        }