diff --git a/src/Components/ProductPage.js b/src/Components/ProductPage.js
index 68e681b..c558ebd 100644
--- a/src/Components/ProductPage.js
+++ b/src/Components/ProductPage.js
@@ -97,7 +97,10 @@ function ProductPage() {
   return (
     <>
       <Navbar />
-      <div className="product-page">
+      <div
+        style={product ? { height: "100%" } : { height: "100vh" }}
+        className="product-page"
+      >
         <div className={product ? `product-dataa animate` : `product-dataa`}>
           <div className="item-image">
             <img
diff --git a/src/Components/productpage.css b/src/Components/productpage.css
index 4406d3e..e60ba24 100644
--- a/src/Components/productpage.css
+++ b/src/Components/productpage.css
@@ -13,8 +13,8 @@
   justify-content: space-evenly;
   top: 180px;
   width: 75%;
-  height: 100vh;
-  margin-bottom: 20px;
+  height: 100%;
+  margin-bottom: 210px;
 }
 
 .product-details {
@@ -340,6 +340,7 @@
     flex-direction: column;
     align-items: center;
     padding-bottom: 32vw;
+    margin-bottom: 0;
   }
   .item-img {
     width: 180px;
@@ -362,6 +363,7 @@
   .rating-img {
     width: 20px;
   }
+  
 }
 
 @media (max-width: 520px) {