diff --git a/public/css/style.css b/public/css/style.css
index f9ebb8a..2e4885c 100644
--- a/public/css/style.css
+++ b/public/css/style.css
@@ -299,4 +299,32 @@ body {
 
 #myBtn {
     cursor: pointer;
+}
+
+
+@media (max-width: 768px) {
+    .about {
+        flex-direction: column;
+        align-items: center;
+    }
+
+    .hero2_img {
+        width: 300px;
+        height: 300px;
+        margin-left: 0;
+    }
+
+    .about-txt {
+        margin-left: 0;
+        margin-top: 20px;
+    }
+
+    .contact-container{
+        flex-direction: column;
+    }
+    .contact-section .contact-container {
+        width: 258%;
+    }
+    
+    
 }
\ No newline at end of file
diff --git a/views/index.ejs b/views/index.ejs
index 2b85ed2..05815c4 100644
--- a/views/index.ejs
+++ b/views/index.ejs
@@ -246,7 +246,7 @@
                     </p>
                 </div>
                 <div class="contact-container row">
-                    <div class="col-6 left ">
+                    <div class="col-6 left">
                         <img src="img/food.jpg" alt="">
                     </div>
                     <div class="col-6 right">