diff --git a/index.html b/index.html
index 0155d73..2ceb2b2 100644
--- a/index.html
+++ b/index.html
@@ -432,7 +432,7 @@
     <!--Navbar Start-->
     <nav class="navbar navbar-expand-lg fixed-top" id="top">
         <div class="container-fluid">
-            <a class="navbar-brand" href="#" style="font-family: var(--ff-philosopher); color: black;">
+            <a class="navbar-brand" href="#" style="font-family: var(--ff-philosopher);">
                 <b>Retro</b>
             </a>
             <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
@@ -443,32 +443,32 @@
                 <ul class="navbar-nav me-auto mb-2 mb-lg-0">
                     <li class="nav-item">
                         <a class="nav-link" aria-current="page" href="#"
-                            style="color: black; font-family: var(--ff-philosopher);">Home</a>
+                            style=" font-family: var(--ff-philosopher);">Home</a>
                     </li>
                     <li class="nav-item">
                         <a class="nav-link" href="Html-files/about.html"
-                            style="font-family: var(--ff-philosopher); color: black;">About Us</a>
+                            style="font-family: var(--ff-philosopher); ">About Us</a>
                     </li>
                     
                     <li class="nav-item">
                         <a class="nav-link" href="Html-files/menu.html"
-                            style="font-family: var(--ff-philosopher);color: black;">Collections</a>
+                            style="font-family: var(--ff-philosopher);">Collections</a>
                     </li>
 
                     <li class="nav-item">
                         <a class="nav-link" href="Html-files/services.html"
-                            style="font-family: var(--ff-philosopher);color: black;">Services</a>
+                            style="font-family: var(--ff-philosopher);">Services</a>
                     </li>
                     <li class="nav-item">
-                        <a class="nav-link" href="Html-files/blog.html" style="font-family: var(--ff-philosopher); color: black">Blog</a>
+                        <a class="nav-link" href="Html-files/blog.html" style="font-family: var(--ff-philosopher);">Blog</a>
                     </li>
 
                     <li class="nav-item">
-                        <a class="nav-link" href="Html-files/contact.html" style="font-family: var(--ff-philosopher); color: black">Contact Us</a>
+                        <a class="nav-link" href="Html-files/contact.html" style="font-family: var(--ff-philosopher); ">Contact Us</a>
                     </li>
                     
                     <li class="nav-item">
-                    <a class="nav-link" href="#" style="font-family: var(--ff-philosopher); color: black;">More</a>
+                    <a class="nav-link" href="#" style="font-family: var(--ff-philosopher); ">More</a>
                     </li>
 
                 </ul>
@@ -477,14 +477,14 @@
                     <ul class="navbar-nav">
                         <li class="nav-item">
                             <a class="nav-link" onclick="redirectLogin()"
-                                style="color: black; font-family: var(--ff-philosopher);">Login</a>
+                                style=" font-family: var(--ff-philosopher);">Login</a>
                         </li>
                         <li class="nav-item">
                             <a class="nav-link" onclick="redirectSignup()"
-                                 style="color: black; font-family: var(--ff-philosopher);">Signup</a>
+                                 style=" font-family: var(--ff-philosopher);">Signup</a>
                         </li>
                         <li class="nav-item" style="list-style-type: none;">
-                            <a class="nav-link" href="Html-files/cart.html" style="color: black;"><i
+                            <a class="nav-link" href="Html-files/cart.html" ><i
                                     class="fa-solid fa-cart-shopping"></i>Cart</a>
                         </li>
                     </ul>
@@ -511,7 +511,9 @@
         color: #007bff; 
     }
     
-    
+    .dark-mode .box{
+        background:linear-gradient(to bottom,rgb(165, 98, 109),rgba(235, 133, 150, 0.856));
+    }
     .dark-mode {
         background-color: #343a40; 
         color: white; 
@@ -554,14 +556,16 @@
     
     .dark-mode #darkModeToggle:hover {
         background-color: #6c757d; 
-       ;
+    
     }
     
     .dark-mode #darkModeToggle .fas {
         color: #f8f9fa; 
     }
     
-   
+    .dark-mode #navbar a{
+        color:white;
+    }   
     .fas {
         transition: color 0.3s; 
     }