diff --git a/login.html b/login.html
index 121bc701..fd48a9e6 100644
--- a/login.html
+++ b/login.html
@@ -8,12 +8,22 @@
     <link rel="stylesheet" href="style.css" />
     <link rel="stylesheet" href="login.css" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <style>
+        .logo{
+            display: flex;
+            flex-direction: row;
+            align-items: center;
+          }
+    </style>
 </head>
 
 <body>
     <header class="main-head">
         <nav>
-            <h1 id="logo">BuddyTrail</h1>
+            <div class="logo" >
+                <img src="img\logo.png" id="logo-web">
+              <h1 id="logo">BuddyTrail</h1>
+              </div>
             <ul>
                 <li><a href="#locations" class='navhover'>Location</a></li>
                 <li><a href="#itineraries" class='navhover'>Travel Itineraries</a></li>
diff --git a/signUp.css b/signUp.css
index 706ac35c..f7964a4a 100644
--- a/signUp.css
+++ b/signUp.css
@@ -11,6 +11,11 @@ body {
     color: #333; /* Dark text for readability */
 }
 
+.logo{
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+  }
 /* Header Styles */
 .main-head {
     color: white;
@@ -33,7 +38,7 @@ nav {
 nav ul {
     list-style-type: none; /* Remove bullet points */
     display: flex; /* Display items in a row */
-    gap: 20px; /* Space between items */
+    gap: 10px; /* Space between items */
 }
 
 nav a {
@@ -47,6 +52,8 @@ nav a:hover {
 
 
 .container {
+
+    margin-top:10px;
     display: flex;
     justify-content: center; 
     align-items: center;
diff --git a/signUp.html b/signUp.html
index 725b9962..c9978d21 100644
--- a/signUp.html
+++ b/signUp.html
@@ -70,18 +70,19 @@
   <body>
     <header class="main-head">
       <nav>
+        <div class="logo" >
+          <img src="img\logo.png" id="logo-web">
         <h1 id="logo">BuddyTrail</h1>
+        </div>
         <ul>
-          <li><a href="#home" class="navhover">Home</a></li>
-          <li><a href="#locations" class="navhover">Location</a></li>
-          <li>
-            <a href="#itineraries " class="navhover">Travel Itineraries</a>
-          </li>
-          <li><a href="#reviews" class="navhover">Reviews</a></li>
-          <li><a href="#benefits" class="navhover">Benefits</a></li>
-          <li><a href="#contact" class="navhover">Contact</a></li>
-          <li><a href="signUp.html" class="navhover">Sign In</a></li>
-        </ul>
+          <li><a href="index.html#home" class="navhover">Home</a></li>
+          <li><a href="index.html#locations" class="navhover">Location</a></li>
+          <li><a href="index.html#itineraries" class="navhover">Travel Itineraries</a></li>
+          <li><a href="index.html#reviews" class="navhover">Reviews</a></li>
+          <li><a href="index.html#benefits" class="navhover">Benefits</a></li>
+          <li><a href="index.html#contact" class="navhover">Contact</a></li>
+      </ul>
+      
         <!-- Toggle Button -->
         <button class="mode-toggle" id="modeToggle">
           <span class="sun-icon glow">☀️</span>
