diff --git a/src/components/Practice/Mechanics3.jsx b/src/components/Practice/Mechanics3.jsx
index c29a6c1a..4d454533 100644
--- a/src/components/Practice/Mechanics3.jsx
+++ b/src/components/Practice/Mechanics3.jsx
@@ -304,7 +304,14 @@ const Mechanics2 = ({
                   justifyContent: "center",
                 }}
               >
-                <Box sx={{ position: "relative", outline: "none" }}>
+                <Box
+                  sx={{
+                    position: "relative",
+                    outline: "none",
+                    height: "500px",
+                    width: "500px",
+                  }}
+                >
                   {/* Subtle gradient overlay at the top of the zoomed image */}
                   <Box
                     sx={{
@@ -341,8 +348,10 @@ const Mechanics2 = ({
                     src={image}
                     alt="Zoomed content"
                     style={{
-                      maxWidth: "90vw",
-                      maxHeight: "90vh",
+                      // maxWidth: "90vw",
+                      // maxHeight: "90vh",
+                      // height:"500px",
+                      width: "100%",
                       borderRadius: "8px",
                     }}
                   />