diff --git a/index.html b/index.html
index 12738241..2f052ed4 100644
--- a/index.html
+++ b/index.html
@@ -19,6 +19,61 @@
     <link rel="stylesheet" href="style.css">
     <link rel="stylesheet" href="Scroll_and_progressbar.css">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css" integrity="sha512-Kc323vGBEqzTmouAECnVceyQqyqdsSiqLQISBL29aUW4U/M7pSPA/gEUZQqv1cwx4OnYxTxve5UMg5GT6L4JJg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
+    <style>
+         @media (max-width: 1200px) {
+    .footer-container {
+      padding: 20px;
+    }
+    .col-3-main {
+      flex-direction: row;
+      flex-wrap: wrap;
+    }
+    .col-3 {
+      width: 33.33%;
+    }
+  }
+
+  @media (max-width: 992px) {
+    .col-3 {
+      width: 50%; /* Stack 2 columns side by side on medium screens */
+    }
+  }
+
+  @media (max-width: 768px) {
+    .col-3 {
+      width: 100%; /* Stack all columns vertically on small screens */
+      margin-bottom: 20px;
+    }
+
+    .feature-post div {
+      flex-direction: column;
+    }
+
+    .tags {
+      text-align: center;
+    }
+  }
+
+  @media (max-width: 576px) {
+    .feature-post div {
+      align-items: center;
+    }
+
+    .tags.social {
+      justify-content: center;
+    }
+
+    .wordwise-footer-content {
+      text-align: center;
+    }
+  }
+
+  /* Optional: You can also set max-width for images */
+  img.object-fit {
+    max-width: 100%; /* Makes images responsive */
+    height: auto;
+  }
+    </style>
 
 </head>
 <body>
@@ -669,24 +724,24 @@ <h2>Subscribe to Our Newsletter</h2>
           <div class="row mb-3 col-3-main">
               <div class="col-3">
                  <div id = "about-us">
-                  <h2 class="footer-title secondary-title">About Us</h2>
+                  <h2 class="footer-title secondary-title" >About Us</h2>
 
-                    <div class="secondary-title text-secondary">
-                       <p class="mt-2 ">
+                    <div class="secondary-title text-secondary " >
+                       <p class="mt-2 text-lg" style="text-align: left;" >
                         We are a close-knit team of passionate storytellers dedicated to sharing captivating content with the world.
                        </p>
 
-                       <address>
+                       <address class="mt-2">
                            <i class="fas fa-map-marker-alt text-primary"></i>
                            5 South Main Street Los Angeles, ZZ-9611 USA
                        </address>
 
-                       <div class="phone">
+                       <div class="phone mt-2">
                            <i class="fas fa-mobile text-primary"></i>
                            125-896-485
                        </div>
 
-                      <div class="email">
+                      <div class="email mt-2">
                             <a href="mailto: dailysupport@gmail.com" style="color: 3B3B58;"><i class="fas fa-envelope text-primary"></i>
                            <span>dailysupport@gmail.com</span>
                         </a>
@@ -704,32 +759,33 @@ <h2 class="footer-title secondary-title">Feature Post</h2>
 
                   <div class="feature-post">
                       <div class="flex-item">
-                          <article class="article">
-                              <div class="d-flex ">
-                                  <a class="d-flex" href="#">
-                                      <img src="./assets/img9.jpg" class="object-fit" alt="">
-                                      <div class="px-1" style="width: 300px;">
-                                          <a href="#" class="text-title display-2 text-dark">
+                        <article class="article">
+                            <div class="d-flex" style="align-items: flex-start; ">
+                                <a class="d-flex" href="#">
+                                    <img src="./assets/img9.jpg" class="object-fit" alt="">
+                                    <div class="px-1" style="width: 300px; ">
+                                        <a href="#" class="text-title display-2 text-dark">
                                             Embrace the beauty of nature through our enchanting blog, where we celebrate the wonders of the natural world
-                                          </a>
-                                          <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
-                                               <span><i class="far fa-clock text-primary"></i> Wed 02, 2022 </span>
-                                          </p>
-                                      </div>
-                                  </a>
-                              </div>
-                          </article>
+                                        </a>
+                                        <p class="secondary-title text-secondary " style="margin-top:3px;margin-left:0px; text-align: left; ">
+                                            <span><i class="far fa-clock text-primary"></i> Wed 02, 2022 </span>
+                                        </p>
+                                    </div>
+                                </a>
+                            </div>
+                        </article>
+                        
                       </div>
                       <div class="flex-item">
                        <article class="article">
-                           <div class="d-flex">
+                           <div class="d-flex" style="align-items: flex-start; ">
                                <a class="d-flex" href="#">
                                    <img src="./assets/img1.jpg" class="object-fit" alt="">
                                    <div class="px-1" style="width: 300px;">
                                        <a href="#" class="text-title display-2 text-dark">
                                         Embark on unforgettable journeys through our travel blog, where wanderlust meets inspiration
                                        </a>
-                                       <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                                       <p class="secondary-title text-secondary display-3" style="margin-top:3px;margin-left:0px; text-align: left;">
                                             <span><i class="far fa-clock text-primary"></i> Wed 05, 2020 </span>
                                        </p>
                                    </div>
@@ -739,14 +795,14 @@ <h2 class="footer-title secondary-title">Feature Post</h2>
                         </div>
                         <div class="flex-item">
                            <article class="article">
-                               <div class="d-flex">
-                                   <a class="d-flex" href="#">
+                               <div class="d-flex" style="align-items: flex-start; ">
+                                   <a class="d-flex " href="#" >
                                        <img src="./assets/img2.jpg" class="object-fit" alt="">
                                        <div class="px-1" style="width: 300px;">
                                            <a href="#" class="text-title display-2 text-dark">
                                             Gaming Adventures Unleashed
                                            </a>
-                                           <p class="secondary-title text-secondary display-3" style="margin-top:3px;">
+                                           <p class="secondary-title text-secondary display-3" style="margin-top:3px;margin-left:0px; text-align: left;">
                                                 <span><i class="far fa-clock text-primary"></i> Wed 02, 2021 </span>
                                            </p>
                                        </div>
@@ -761,15 +817,15 @@ <h2 class="footer-title secondary-title">Popular Tags</h2>
 
                    <div class="tags">
                        <div class="d-flex-gap flex-wrap">
-                           <a href="#" class="nav-link btn bg-light">Travel</a>
-                           <a href="#" class="nav-link btn bg-light">Food</a>
-                           <a href="#" class="nav-link btn bg-light">Lifestyle</a>
-                           <a href="#" class="nav-link btn bg-light">Techonogy</a>
-                           <a href="#" class="nav-link btn bg-light">Fashion</a>
+                           <a href="#" class="nav-link btn bg-light " style="font-weight: 400;">Travel</a>
+                           <a href="#" class="nav-link btn bg-light" style="font-weight: 400;">Food</a>
+                           <a href="#" class="nav-link btn bg-light" style="font-weight: 400;">Lifestyle</a>
+                           <a href="#" class="nav-link btn bg-light" style="font-weight: 400;">Techonogy</a>
+                           <a href="#" class="nav-link btn bg-light" style="font-weight: 400;">Fashion</a>
                        </div>
                    </div>
 
-                   <h2 class="footer-title secondary-title mt-2">Connect with us</h2>
+                   <h2 class="footer-title secondary-title mt-5">Connect with us</h2>
 
                    <div class="tags social" id="contact">
                        <div class="d-flex-gap flex-wrap">
diff --git a/style.css b/style.css
index 379a81b4..475def44 100644
--- a/style.css
+++ b/style.css
@@ -1410,6 +1410,13 @@ a {
   text-align: center;
 }
 
+.nav-link:hover{
+ /* Change background color on hover */
+        color: #f8b5b5;
+        scale: 1.1; /* Change text color on hover */
+      /* Optional: Change border color on hover */
+        transition: background-color 0.3s ease, color 0.3s ease; /* Smooth transition */
+}
 .search-box {
   border-right: none;
 }
