:root{
  --background-color: rgba(0, 128, 255, 0.7);
  --text-color: #fff9f9;
  --button-color: rgb(16, 146, 16);
  --button-color-dark: rgb(42, 154, 42);
  --bg-footer: linear-gradient(to bottom, #53a8fd, #0066cc);
  --heading-font-style : 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;

}


.new-div {
  /* margin-top: 10px; Adjust as needed */
  /* padding: 10px; Adjust as needed */
  position: absolute;
  top: 720px;
  /* margin: 0px 50px; */
  /* Adjust as needed */
  border: 1px solid #DDDDDD; /* Adjust as needed */
  border-radius: 5px; /* Adjust as needed */
  height: 152px;
  width: 340px;
  padding: 12px;
  order: 3;
  width: 100%;
  /* position: relative;
  top: 500px; */
}

.pro_pages {
  width: 90%;
  /* height: 1.25px; */
  top: 160px;
  /* left: 132px; */
  gap: 0px;
  opacity: 0px;
  /* border: 1px solid red; */
  margin: 12px;
  /* padding-left: 80px; */
  display: flexbox;
}

.product-container {
  /* max-width: 60%; */
  /* margin: 0 auto; */
  /* background-color: #f5f5f5; */
  margin: 0px;
  border-radius: 5px;
  /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); */
  display: flex;
  flex-wrap: wrap;
}

.product-images {
  display: grid;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 157px;
  /* border: 1px solid blue; */
  
}

.product-images img {
  width: 80px;
  height: 80px;
  /* object-fit: cover; */
  border-radius: 5px;
  margin: 5px;
  border: 1px solid #DDDDDD;

}

.product-image {
  text-align: center;
  /* margin-bottom: 20px; */
  /* flex-basis: 100%;/ */
}

.product-image img {
  max-width: 90%;
  height: 90%;
  border-radius: 5px;
  /* margin-right:510px; */
  margin: 5px red solid;
  /* border: 1px solid #DDDDDD;  */

}

.product-details {
  /* padding-left :60px; */
  /* border: 1px solid blue; */
  height: 100px;
  margin-left: 26px;
  /* flex-basis: 100%; */
}


.product-details > .producthead {
  margin-bottom: 10px;
  text-transform: capitalize;
  font-size: 32px;
}


.rattingvalues {
  font-size: 26px;
}

.product-details p {
  margin-bottom: 20px;
}

.add-to-cart {
  background-color: #8b008b;
  color: #fff;
  border: none;
  padding: 10px 20px;
  border-radius: 5px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.add-to-cart:hover {
  background-color: #6a006a;
}

.pack-sizes {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

.pack-size {
  background-color: #fff;
  padding: 10px;
  border-radius: 5px;
  margin-right: 10px;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}

.mrps {
  color: #909090;
  font-size: 14px;
}

.dis {
  font-size: 14px;
  color:var(--background-color);
}

.pricevalues {
  font-size: 17.02px;
}

.quantity_values {
  width: 150px;
  height: 42px;
  top: 354px;
  left: 694px;
  gap: 10px;
  border-radius: 6px;
  border: 1px;
  /* border: 1px solid #DEE2E6; */
  display: flex;
  align-items: center;
  justify-content: center;
}

.quantity_values > input {
  border:2px solid #030003;
  width: 58px;
  height: 40px;
  top: 1px;
  left: 36px;
  padding: 6px 0px 6px 0px;
  gap: 0px;
  opacity: 0px;
  text-align: center;
  border-radius: 6px;

}

.quantity_values > input:focus {
  border: none;
  outline: none;
}

.decrementbtns, .inrementbnts {
  width: 36px;
  height: 40px;
  /* padding: 9.25px 8px 10.75px 8px; */
  border-radius: 6px;
  text-align: center;
  cursor: pointer;
  background-color: #fff;
}

.decrementbtns {
  /* font-size: 29px; */
  /* padding-bottom: 60px; */
  text-align: center;
}

.cartsforms {
  display: flex;
  width: 352.28px;
  height: 42px;
  border-radius: 6px;
  justify-content: space-between;
}

.cartsbtn {
  width: 198.28px;
  height: 42px;
  gap: 0px;
  border-radius: 6px;
  opacity: 0px;
  background-color: var(--background-color);
  color: #FFFFFF;
  text-align: center;
  font-weight: 600;
  border: none;
  margin-left: 10px;
}

.cartsbtn:hover:focus {
  background-color: var();
  color: #FFFFFF;
  text-align: center;
}


.product_descriptions {
  width: 526px;
  height: 152px;
  gap: 0px;
  border-radius: 8px;
  border: 1px 0px 0px 0px;
  opacity: 0px;
  border: 1px solid #DDDDDD;
  margin-top: 10px;
  margin: 0 50px;
}
.details-content {
  display: none;
}
.details-header {
  display: flex;
  justify-content: space-between;
  text-align: center;
  align-items: center;
  cursor: pointer;
  height: 50px;

  border-bottom: 1px solid #DDDDDD;
}
.details-header .toggle-icon {
  font-size: 20px;
  vertical-align: middle;
  
}
.detail-row{
  height: 50px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #DDDDDD;
  font-size: 12px;
}
.detail-label{  
  font-weight: 410;

}
.vendor_details{
  
  display: flex;
  gap:26px;
  /* display: none;  */
  height: 126px;
  align-items: center;

  border-bottom: 1px solid #DDDDDD;
  display: none ;
}
.vendor_small_images>img{
  height: 100px;
  width: 100px;
  border-radius: 5px;
  border: 1px solid #DDDDDD;

}

.sellerdetails{
  display: flex;
  justify-content: space-between;
  text-align: center;
  align-items: center;
  cursor: pointer;
  height: 50px;
  

  border-bottom: 1px solid #DDDDDD;
}
.vdetails{
  font-size: 12px;
}
.vdetails>span{
  font-size: 16px;
}
.similar_products{
  /* margin-top: 150px; */
  position: relative;
  top: 150px;
}
.similar_products-heading{
  margin-bottom: 2.5rem;
  font-weight: bolder;
  font-size: 20px;
  font-family: var(--heading-font-style);
}
@media (min-width: 768px) {
  .product-container {
    flex-wrap: nowrap;
    /* align-items: flex-start; */
  }

  .product-images {
    flex-basis: 10%;
    margin-right: 6px;
    flex-wrap: nowrap; /* Add this line */
  }

  .product-image {
    /* flex-basis: 50%; */
    margin-right: 0px;
    width: 100%;
  }

  .product-details {
    /* flex-basis: 30%; */
    width: 100%;
  }
}

@media (max-width: 767px) {
  .pro_pages {
    width: 100%;
    padding: 0 10px;
    box-sizing: border-box;
  }

  .product-container {
    flex-direction: column;
    margin: 20px;
  }

  .product-images {
    order: 2;
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
  }

  .product-images img {
    width: 60px;
    height: 60px;
  }

  .product-image {
    order: 1;
    margin-bottom: 20px;
    width: 100%;
  }

  .product-image img {
    max-width: 100%;
    height: auto;
  }

  .product-details {
    order: 4;
    margin-left: 0;
  }

  
}