diff --git a/li-sense-app/src/_pages/ProductDetails/Product.css b/li-sense-app/src/_pages/ProductDetails/Product.css
index 3c82e52..9088566 100644
--- a/li-sense-app/src/_pages/ProductDetails/Product.css
+++ b/li-sense-app/src/_pages/ProductDetails/Product.css
@@ -157,17 +157,21 @@ hr.solid {
   font-size: 40px;
   opacity: 0.5;
 }
-@media (max-width: 384px)  {
-  .container-info-box {
-    margin: auto;
-    font-size: 10px;
-    display: block;
+
+@media (max-width: 484px) {
+  .card-slider {
+    width: 60vw;
+  }
+  .productCard {
+  width: 17rem;
+  height: 25rem;
   }
 }
 
+
 @media (max-width: 700px) {
   .container-image-product {
-    padding: none;
+    padding: 0px 0px;
   }
   .container-product-details {
     margin: 12px auto;
@@ -175,7 +179,11 @@ hr.solid {
   }
 }
 
-@media (max-width: 900px) {
+@media (max-width: 1017px) {
+  .container-image-product{
+    padding-left: 10px;
+    padding-right: 10px;
+  }
   .container-product {
     display:block;
     height: fit-content;
@@ -184,10 +192,21 @@ hr.solid {
     margin: 12px auto;
     width: 80vw;
   }
+  .buy-button {
+  height: 60px;
+  width: 180px;
+  margin-top: 20px;
+  margin-bottom: 15px;
+  }
 }
 
-@media (max-width: 1140px) {
-  .field-info {
-    height: auto;
+@media (max-width: 1039px) {
+  .container-sale-box {
+    margin-top: 0px;
+    padding-top: 10px;
+  }
+    .buy-button {
+    margin-top: 15px;
+    width: 180px;
   }
 }
\ No newline at end of file
diff --git a/li-sense-app/src/_pages/ProductDetails/ProductDetails.js b/li-sense-app/src/_pages/ProductDetails/ProductDetails.js
index 721ab65..16d2d47 100644
--- a/li-sense-app/src/_pages/ProductDetails/ProductDetails.js
+++ b/li-sense-app/src/_pages/ProductDetails/ProductDetails.js
@@ -104,11 +104,11 @@ export default function ProductDetails() {
         />
         <div
           id="slider"
-          className="w-full h-full overflow-x-scroll scroll whitespace-nowrap scroll-smooth scrollbar-hide"
+          className="w-full h-full overflow-x-hidden scroll whitespace-nowrap scroll-smooth scrollbar-hide"
         >
           {data.map((_value, key) => (
-            <div className=" d inline-block p-2 cursor-pointer overflow-y-auto" key={key}>
-              <Components.Card className="d" data={_value} key={key} />
+            <div className=" card-slider inline-block p-2 cursor-pointer overflow-y-auto" key={key}>
+              <Components.Card className="card-slider" data={_value} key={key} />
             </div>
           ))}
         </div>