diff --git a/index.html b/index.html
index c0ba00f..6627287 100644
--- a/index.html
+++ b/index.html
@@ -105,30 +105,17 @@
         <a href="index.html" class="flex"><img src="images/logo.png" class="logo">
             <span class="website-name tracking-tight ">Code Social</span></a>
 
-
-
-        <!-- Hamburger Menu -->
-        <div class="hamburger-menu">
-            <div class="toggle-button">
-                <img src="/images/hamburger.png" alt="open" id="hamburger-img">
-
-            </div>
-        </div>
-
         <!-- Navbar Links -->
-        <ul class="navbar-links flex  ">
-            <li class="ml-20">
+        <ul class="navbar-links flex ml-20">
+            <li>
                 <a href="maintenance.html">Live Events</a>
                 <ul class="dropdown  ">
                     <li><a href="maintenance.html">Why don't you react?</a></li>
-
                 </ul>
             </li>
          <!-- blog section -->
-            <ul class="navbar-links flex  ">
-            <li class="ml-20">
+            <li>
                 <a href="blog.html">Blogs</a>
-                </ul>
             </li>
             <li class="community">
                 <a href="maintenance.html">Join Our Community</a>
@@ -145,12 +132,9 @@
                     <li><a href="#">Peer-to-Peer Sessions</a></li>
                 </ul>
             </li> 
-            <li class="hamburger-menu">
+            <li>
                 <div class="toggle-button">
                     <span class="about-text">About us</span>
-                    <button class="bar"></button>
-                    <button class="bar"></button>
-                    <button class="bar"></button>
                 </div>
                 <ul class="dropdown">
                     <li><a href="mentorship.html">Meet Our Team</a></li>
@@ -159,7 +143,6 @@
                     <li><a href="#">Follow Us</a></li>
                 </ul>
             </li>
-            
             <li>
                 <a href="maintenance.html">Follow Us</a>
             </li>
@@ -187,19 +170,21 @@ <h2>About Community</h2>
         </p>
         <!-- Social Media Icons -->
         <div class="social-icons">
-            <a href="https://wa.me/your-whatsapp-number" target="_blank">
-                <img src="images/whatsapp-icon.png" alt="WhatsApp">
-            </a>
-            <a href="https://discord.gg/MSTNyRSPYW" target="_blank">
-                <img src="images/discord-icon.png" alt="Discord">
-            </a>
-            <a href="https://www.linkedin.com/company/code-social/" target="_blank">
-                <img src="images/linkedin-icon.png" alt="LinkedIn">
-            </a>
-            <a href="https://github.com/Code-Social" target="_blank">
-                <img src="images/gitHub.png" alt="Github">
-            </a>
-
+            <h3 style="font-weight: bold; text-transform: uppercase; font-size: 1.5rem;">Reach Us</h3>
+            <div>
+                <a href="https://wa.me/your-whatsapp-number" target="_blank">
+                    <img src="images/whatsapp-icon.png" alt="WhatsApp">
+                </a>
+                <a href="https://discord.gg/MSTNyRSPYW" target="_blank">
+                    <img src="images/discord-icon.png" alt="Discord">
+                </a>
+                <a href="https://www.linkedin.com/company/code-social/" target="_blank">
+                    <img src="images/linkedin-icon.png" alt="LinkedIn">
+                </a>
+                <a href="https://github.com/Code-Social" target="_blank">
+                    <img src="images/gitHub.png" alt="Github">
+                </a>
+            </div>     
         </div>
     </section>
 
@@ -232,45 +217,52 @@ <h3>Add Event</h3>
         <div class="container">
           <!-- Logo and About Section -->
           <div class="footer-logo-about">
-            <a href="index.html" class="footer-logo-link">
-              <img src="/images/logo.png" alt="Code Social Logo" class="footer-logo">
-              <span class="website-name">Code Social</span>
-            </a>
-            <p class="footer-about-text">
-              Code Social Community is a vibrant and inclusive space for tech enthusiasts <br> to learn, grow, and connect. Founded in 2023, our mission is to empower individuals <br> with resources, mentorship, and opportunities to cultivate their skills, explore their interests, and <br>collaborate with like-minded peers.
-            </p>
-            <div class="social-icons">
-              <a href="https://wa.me/your-whatsapp-number" target="_blank"><img src="./images/whatsapp-icon.png" alt="WhatsApp"></a>
-              <a href="https://discord.gg/MSTNyRSPYW" target="_blank"><img src="./images/discord-icon.png" alt="Discord"></a>
-              <a href="https://www.linkedin.com/company/code-social/" target="_blank"><img src="./images/linkedin-icon.png" alt="LinkedIn"></a>
-            </div>
+                <a href="index.html" class="footer-logo-link">
+                <img src="images/logo.png" alt="Code Social Logo" class="footer-logo">
+                <span class="website-name">Code Social</span>
+                </a>
+                <p class="footer-about-text">
+                Code Social Community is a vibrant and inclusive space for tech enthusiasts <br> to learn, grow, and connect. Founded in 2023, our mission is to empower individuals <br> with resources, mentorship, and opportunities to cultivate their skills, explore their interests, and collaborate with like-minded peers.
+                </p>
           </div>
       
           <!-- Links Section -->
           <div class="footer-links">
-            <div class="footer-column">
-              <p class="footer-title">Quick Links</p>
-              <ul class="footer-list">
-                <li><a href="#">About Us</a></li>
-                <li><a href="#">Events</a></li>
-                <li><a href="#">Community Guidelines</a></li>
-                <li><a href="#">Careers</a></li>
-              </ul>
-            </div>
-            <div class="footer-column">
-              <p class="footer-title">Help</p>
-              <ul class="footer-list">
-                <li><a href="#">Contact Us</a></li>
-                <li><a href="#">Volunteer Opportunities</a></li>
-                <li><a href="#">Terms & Conditions</a></li>
-              </ul>
-            </div>
+                <div class="footer-column">
+                    <div class="quick-links">
+                        <p class="footer-title">Quick Links</p>
+                        <ul class="footer-list">
+                            <li><a href="#">About Us</a></li>
+                            <li><a href="#">Events</a></li>
+                            <li><a href="#">Community Guidelines</a></li>
+                            <li><a href="#">Careers</a></li>
+                        </ul>
+                    </div>
+                    <div class="social-icons">
+                        <p class="footer-title">Social Links</p>
+                        <div>
+                            <a href="https://wa.me/your-whatsapp-number" target="_blank"><img src="./images/whatsapp-icon.png" alt="WhatsApp"></a>
+                            <a href="https://discord.gg/MSTNyRSPYW" target="_blank"><img src="./images/discord-icon.png" alt="Discord"></a>
+                            <a href="https://www.linkedin.com/company/code-social/" target="_blank"><img src="./images/linkedin-icon.png" alt="LinkedIn"></a>
+                        </div>       
+                    </div>
+                </div>
+                <div class="footer-column">
+                    <p class="footer-title">Help</p>
+                        <ul class="footer-list">
+                            <li><a href="#">Contact Us</a></li>
+                            <li><a href="#">Volunteer Opportunities</a></li>
+                            <li><a href="#">Terms & Conditions</a></li>
+                        </ul>
+                </div>
           </div>
         </div>
       
         <!-- Footer Bottom -->
-        <hr class="footer-divider">
-        <p class="footer-bottom-text">© Copyright 2024, All Rights Reserved by Code Social</p>
+        <!-- <hr> -->
+        <div class="footer-divider">
+            <p class="footer-bottom-text">© Copyright 2024, All Rights Reserved by Code Social</p>
+        </div>
       </footer>
 
 
@@ -365,4 +357,4 @@ <h3>Add Event</h3>
             </script>
 </body>
 
-</html>
\ No newline at end of file
+</html>
diff --git a/learning.html b/learning.html
index 417b480..9529671 100644
--- a/learning.html
+++ b/learning.html
@@ -80,25 +80,49 @@
             color: #2196F3;
         }
 
-        footer {
+        /* footer{
             text-align: center;
             padding: 20px;
             background-color: #333;
             color: white;
             margin-top: 40px;
+        } */
+        a{
+            text-decoration: none;
+            color: black;
+        }
+            /* General Styles */
+        body.dark-mode {
+            background-color: #121212;
+            color: #f5f5f5;
+        }
+        /* Navbar Dark Mode */
+        body.dark-mode .navbar a,
+        body.dark-mode .navbar span,
+        body.dark-mode .navbar ul li a {
+            color: #f5f5f5;
+        }
+
+        /* Dropdown in Dark Mode */
+        body.dark-mode .dropdown {
+            background-color: #333;
+        }
+        /* Blockquote Style */
+        body.dark-mode blockquote {
+            border-left: 4px solid #888;
+        }
+        body.dark-mode .footer-divider {
+            background-color: #222;
+            color: #ddd;
+        }
+
+        body.dark-mode .learning-section{
+            color: black;
         }
     </style>
 </head>
 
 <body>
-    <!-- Header Section -->
-    <header>
-        <button id="theme-switch">
-            <img src="file:///C:/Users/Dell/Downloads/dark_mode_24dp_E8EAED_FILL0_wght400_GRAD0_opsz24.svg" alt="Dark Mode">
-            <img src="file:///C:/Users/Dell/Downloads/light_mode_24dp_E8EAED_FILL0_wght400_GRAD0_opsz24.svg" alt="Light Mode">
-        </button>
-    </header>
-
     <!-- Navbar Section -->
     <nav class="navbar">
         <a href="index.html"><img src="images/logo.png" class="logo" alt="Code Social logo"></a>
@@ -115,19 +139,24 @@
             </li>
             <li><a href="#">Live Events</a></li>
             <li><a href="#">Join our Community</a></li>
-            <li class="hamburger-menu">
-                <a href="javascript:void(0);" class="toggle-button">
-                    <span class="bar"></span>
-                    <span class="bar"></span>
-                    <span class="bar"></span>
-                </a>
-                <ul class="dropdown">
-                    <li><a href="#">Meet Our Team</a></li>
-                    <li><a href="#">Join Our Team</a></li>
-                    <li><a href="#">Contact Us</a></li>
-                    <li><a href="#">Follow Us</a></li>
-                </ul>
+            <li>
+                <div class="hamburger-menu" style="display: list-item;">
+                    <img src="images/hamburger.png" alt="hamburger">
+                    <ul class="dropdown">
+                        <li><a href="#">Meet Our Team</a></li>
+                        <li><a href="#">Join Our Team</a></li>
+                        <li><a href="#">Contact Us</a></li>
+                        <li><a href="#">Follow Us</a></li>
+                    </ul>
+                </div>
             </li>
+            <!-- Dark Mode Toggle -->
+            <li>
+                <button id="theme-toggle" class="theme-toggle-btn">
+                    <img src="images/dark-mode.png" alt="theme-mode" id="theme-toggle-icon">
+                </button>
+                <!-- when light mode is active -> use "dark-mode.png" and when dark mode is active -> use "light-mode.png" -->
+            </li>     
         </ul>
     </nav>
 
@@ -189,22 +218,21 @@ <h3>Peer-to-Peer Learning Sessions</h3>
     </section>
 
     <!-- Footer Section -->
-    <footer>
-        <p>&copy; 2024 Code Social. All rights reserved.</p>
+    <footer class="footer-divider">
+        <p class="footer-bottom-text">&copy; 2024 Code Social. All rights reserved.</p>
     </footer>
     <script>
         window.embeddedChatbotConfig = {
         chatbotId: "j2Uy2CrJfZueGX7wNtJT_",
         domain: "www.chatbase.co"
         }
-        </script>
-        <script
+    </script>
+    <script
         src="https://www.chatbase.co/embed.min.js"
         chatbotId="j2Uy2CrJfZueGX7wNtJT_"
         domain="www.chatbase.co"
         defer>
-        </script>
-
+    </script>
 </body>
 
 </html>
diff --git a/styles.css b/styles.css
index f26bb0c..f377849 100644
--- a/styles.css
+++ b/styles.css
@@ -350,6 +350,9 @@ body.dark-mode .calendar-day:hover {
   color: white; /* Text color for dark mode */
 }
 
+.dark-mode a span{
+ color: white;
+}
 .content {
   height: 2000px; /* Just for scrolling */
   padding: 20px;
@@ -370,6 +373,7 @@ body.dark-mode .calendar-day:hover {
   display: flex;
   align-items: center;
   cursor: pointer;
+  gap: 1rem;
 }
 
 /* Logo Styling */
@@ -464,7 +468,6 @@ body.dark-mode .calendar-day:hover {
 .hamburger-menu .toggle-button {
   display: flex;
   position: relative;
-  flex-direction: column;
   justify-content: space-between;
   width: 40px;
   height: 40px;
@@ -754,10 +757,14 @@ body.dark-mode #theme-switch {
 /* Social Icons */
 .social-icons {
   margin-top: 30px; /* Increased margin for better spacing */
+  display: flex;
+  flex-direction: column;
 }
-
+/* .social-icons div{
+  display: block;
+} */
 .social-icons a {
-  margin: 0 15px;
+  margin-right: 16px;
   display: inline-block;
 }
 
@@ -801,8 +808,7 @@ body.dark-mode #theme-switch {
     max-width: 1200px;
     margin: 0 auto;
     display: flex;
-    justify-content: space-evenly;
-    flex-wrap: wrap;
+    justify-content: space-between;
   }
   
   .footer-logo-about {
@@ -855,13 +861,14 @@ body.dark-mode #theme-switch {
   /* Footer Links Styling */
   .footer-links {
     display: flex;
-    justify-content: space-evenly;
+    justify-content: space-between;
     gap: 2rem;
     flex: 1;
     min-width: 250px;
   }
   
   .footer-column {
+    flex-direction: column;
     flex: 1;
   }
   
@@ -892,8 +899,9 @@ body.dark-mode #theme-switch {
   
   /* Footer Bottom Styling */
   .footer-divider {
-    border-top: 1px solid #e5e7eb;
-    margin: 2rem 0;
+    border-top: 1px solid white;
+    margin-top: 2rem;
+    padding: 1rem;
   }
   
   .footer-bottom-text {