diff --git a/assets/css/login.css b/assets/css/login.css
index 33a9f791f..07c09edb0 100644
--- a/assets/css/login.css
+++ b/assets/css/login.css
@@ -557,6 +557,7 @@ a:active {color: var(--old-rose);}
   overflow: hidden;
   border-radius: 2%;
   box-shadow: 0 0 15px 5px #24004628;
+  
   /* margin-bottom: 10rem;
   margin-left: 4rem; */
 }
@@ -698,9 +699,11 @@ label {
   transition: 0.8s ease-in-out;
   margin-bottom: 45px;
   padding-bottom: 45px;
+  height: fit-content;
 }
 #login{
   color: var(--old-rose);
+  
 }
 #login:hover {
   color: white;
@@ -795,7 +798,7 @@ label {
   text-align: center;
 }
 
-.forget-password {
+.forget-password .loginButton {
   font-size: small;
   text-align: center;
   margin: -20px 0 10px;
@@ -834,15 +837,18 @@ label {
 
   .main {
     width: 100%;
-    height:420px;
+    
   }
   .register{
-    width: 100%;
+     /* width: 100%;
 	margin-top: -30px;
-    margin-left: 0%;
+    margin-left: 50px;
     padding-left: 0%;
     margin-bottom: 0px;
-    padding-bottom: 45px;
+    padding-bottom: 45px; */
+    text-align: center; 
+    
+   
   }
   .register .form label{
     margin-top:0px;
@@ -851,10 +857,19 @@ label {
     margin-top: 10px;
     margin-bottom: 10px;
   }
-  #register{
+  /* #register{
     margin-top: 20px;
     margin-bottom: 25px;
-  }
+  } */
+}
+/* .register1{
+  margin-left: 33%;
+} */
+
+.register_link{
+  text-align: center;
+  color: rgb(247, 150, 150);
+  margin-bottom: 10px;
 }
 
 .input-box{
@@ -914,10 +929,18 @@ label {
 	}
 	.form {
 		gap:0;
+    padding:10px;
 	}
-	#register{
-		margin-top: 1px;
-	}
+  .register{
+    width: 100%;
+    margin-left: 0%;
+    padding-left: 0%;
+    margin-bottom: 0px;
+    padding-bottom: 45px;
+  }
+  .main {
+    padding: 16px;
+  }
 	/* #or{
 		margin-top: -10px;
 	} */
@@ -928,7 +951,7 @@ label {
 
 @media (max-width: 480px) {
   .main {
-    padding: 0px;
+    padding: 6px;
   }
   .input,
   .form button {
@@ -1147,4 +1170,17 @@ body.dark-mode {
     /* right: -20px; */
     bottom: 20px;
     /* right: 20px; */
-  }}
\ No newline at end of file
+  }}
+
+  .remember-me-label {
+    font-size: 14px;
+    display: inline-flex;
+    align-items: center;
+}
+
+.remember-me-label input {
+    margin-right: 8px;
+    /* Adjusted margin */
+    margin-top: 1px;
+    /* Added margin-top for better alignment */
+}
\ No newline at end of file
diff --git a/assets/html/login.html b/assets/html/login.html
index 64fdf2515..92f722ee6 100644
--- a/assets/html/login.html
+++ b/assets/html/login.html
@@ -162,25 +162,30 @@ <h2>Join us by creating an account or log in if you already have an account.</h2
             <img src="../images/eye-close.png" alt="Eye close-image" id="eyeicon-login">
           </div>
           <button type="submit" name="Login" id="login">Submit</button>
-          <p class="forget-password">
+          <div class="forget-password">
             Forgot Password?
             <a href="forgot-pass.html" id="forgot_password_link">Reset Here</a>
-          </p>
+          </div>
+          
           <div id="or">Or</div>
           <button id="google-sign-in"> Sign In with Google </button>
+          <div class="register">
+            <!-- <div class="register1">New to SwapReads?</div> -->
+            <a href="mylogin.html" class="register_link">Register Here</a>
+          </div>
         </form>
       </div>
 
-      <div class="register">
+      <!-- <div class="register">
         <form class="form" id="register-form">
           <label for="chk" aria-hidden="true">Create Account</label>
           <input class="input" type="email" name="email" id="email" placeholder="Email" required />
           <div class="input-box">
             <input class="input" type="password" name="pswd" id="password" placeholder="Password" required />
             <img src="../images/eye-close.png" alt="Eye close-image" id="eyeicon">
-          </div>
+          </div> -->
 
-          <div>
+          <!-- <div>
             <div class="progress">
               <div id="password-strength" class="progress-bar" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"></div>
             </div>
@@ -190,11 +195,11 @@ <h2>Join us by creating an account or log in if you already have an account.</h2
               <li><span class="one-special-char"><i class="fas fa-circle" aria-hidden="true"></i>&nbsp;Special Character (!@#$%^&*)</span></li>
               <li><span class="eight-character"><i class="fas fa-circle" aria-hidden="true"></i>&nbsp;At least 8 Character</span></li>
             </ul>
-          </div>
+          </div> -->
 
-          <button type="submit" name="register" id="register">Register</button>
+          <!-- <button type="submit" name="register" id="register">Register</button>
           <div id="or">Or</div>
-          <button id="google-signup"> Sign Up with Google </button>
+          <button id="google-signup"> Sign Up with Google </button> -->
         </form>
       </div>
     </div>
diff --git a/assets/html/mylogin.html b/assets/html/mylogin.html
index cb8077edc..a14e604d1 100644
--- a/assets/html/mylogin.html
+++ b/assets/html/mylogin.html
@@ -9,42 +9,117 @@
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
     <title>How to create Firebase login and register?</title>
     <link rel="stylesheet" href="../css/login.css" />
+    <link rel="stylesheet" href="..//css/style.css">
 
-    <style>
-        .remember-me-label {
-            font-size: 14px;
-            display: inline-flex;
-            align-items: center;
-        }
-
-        .remember-me-label input {
-            margin-right: 8px;
-            /* Adjusted margin */
-            margin-top: 1px;
-            /* Added margin-top for better alignment */
-        }
-    </style>
+    <script src="../js/script.js" defer></script>
+    <script src="../js/scroll-reveal.js"></script>
+    <script type="module" src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"></script>
+    <script nomodule src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.js"></script>
+    
 </head>
 
 <body>
-    <div class="navbar">
-        <div class="navbar-header">
-            <a href="index.html">
-                <img class="close-icon" src="./assets/images/close.png" alt="Close">
-            </a>
-        </div>
-        <div class="navbar-collapse collapse">
-            <ul class="nav navbar-nav navbar-right">
-                <li><a href="#" id="logout" style="display: none">Log Out</a></li>
-            </ul>
-        </div>
-    </div>
-    <div class="note">
-        <h1>
-            Hey !! Welcome to SwapReads. Please get yourself Registered or verify your credentials to get started.
-        </h1>
-    </div>
-    <br />
+        <header class="header header-anim" data-header>
+      
+          <div class="container">
+      
+            <nav class="navbar" data-navbar>
+              <a href="index.html#home" class="logo" style="display:flex;">
+              <img src="../images/new_logo_banner_dark.png" alt="" class="logopic" style=" width:0.1px;opacity: 0;" />
+              </a>
+      
+              <ul class="navbar-list">
+                <a href="index.html#home">
+                <img src="../images/new_logo_banner_dark.png" class="logopic" style=" width: 150px;">
+      
+                <li class="navbar-item">
+                  <a href="index.html#home" class="navbar-link" data-nav-link><i
+                      class="ri-home-fill"></i> Home</a>
+                </li>
+      
+                <li class="navbar-item">
+                  <a href="index.html#benefits" class="navbar-link" data-nav-link><i
+                      class="ri-bar-chart-fill"></i> Benefits</a>
+                </li>
+      
+                <li class="navbar-item">
+                  <a href="index.html#genre" onclick="lenis.scrollTo('#genre')" class="navbar-link" data-nav-link><i
+                      class="ri-bar-chart-fill"></i> Genre</a>
+      
+                </li>
+      
+                <li class="navbar-item">
+                  <a href="index.html#contact" onclick="lenis.scrollTo('#contact')" class="navbar-link" data-nav-link><i
+                      class="ri-customer-service-2-fill"></i> Contact</a>
+                </li>
+      
+                <li class="navbar-item">
+                  <a href="rate.html" onclick="openRateUsModal(); return false;" class="navbar-link">Rate Us</a>
+                </li>
+                <li class="navbar-item" id="logout-r">
+                  <a href="../html/login.html" class="navbar-link">Logout</a>
+                </li>
+      
+                
+                <li class="navbar-item dropdown" id="more-dropdown">
+                  <a href="#" class="navbar-link" id="more-link">More 
+                  <svg  class="dropdown-arrow" xmlns="http://www.w3.org/2000/svg" width="1.3em" height="1.3em" viewBox="0 0 24 24"><path fill="currentcolor" d="m12 13.171l4.95-4.95l1.414 1.415L12 16L5.636 9.636L7.05 8.222z"/></svg></a>
+                  <div class="dropdown-menu" id="dropdown-menu">
+      
+                    <ul class="dropdown-menu-list">
+                      <li class="dropdown-menu-item">
+                        <a href="index.html#chapters" onclick="lenis.scrollTo('#chapters')" class="navbar-link" data-nav-link><i class="ri-medal-fill"></i> Literary Realms</a>
+                      </li>
+                      <li class="dropdown-menu-item">
+                        <a href="index.html#pricing" onclick="lenis.scrollTo('#pricing')" class="navbar-link" data-nav-link><i class="ri-price-tag-3-fill"></i> Pricing</a>
+                      </li>
+                      <li class="dropdown-menu-item">
+                        <a href="./assets/html/addremovebook.html" class="navbar-link">Booklist for Swapping</a>
+                      </li>
+                      <li class="dropdown-menu-item">
+                        <a href="book_recommend.html" class="navbar-link" data-nav-link>
+                          <i class="ri-customer-service-2-fill"></i> Book Recommendation
+                        </a>
+                      </li>
+                      <li class="dropdown-menu-item">
+                        <a href="#E-books" onclick="lenis.scrollTo('#E-books')" class="navbar-link" data-nav-link><i class="ri-price-tag-3-fill"></i>Free E-books</a>
+                      </li>
+                      <li class="dropdown-menu-item">
+                        <a href="./assets/html/about.html" class="navbar-link">About</a>
+                      </li>
+                    </ul>
+                  </div>
+                </li>
+      
+                <li>
+      
+                  <div class="switch-container">
+                    <input type="checkbox" id="switch" class="switch-checkbox">
+                    <label for="switch" class="switch-label">
+                      <div class="switch-button">
+                        <span class="material-icons sun-icon"></span>
+                        <span class="material-icons moon-icon"></span>
+                      </div>
+                    </label>
+                  </div>
+      
+                </li>
+              </ul>
+            </nav>
+      
+            <button class="nav-toggle-btn" aria-label="toggle menu" data-nav-toggler>
+              <ion-icon name="menu-outline" aria-hidden="true" class="open"></ion-icon>
+      
+              <ion-icon name="close-outline" aria-hidden="true" class="close"></ion-icon>
+            </button>
+      
+          </div>
+        </header>
+        <div class="note">
+            <h1>Welcome to SwapReads</h1>
+            <h2>Join us by creating an account or log in if you already have an account.</h2>
+          </div>
+          <br />
     <div class="container">
         <div class="main">
             <input type="checkbox" id="chk" aria-hidden="true" />
@@ -60,13 +135,11 @@ <h1>
                 </form>
             </div>
 
-            <div class="login">
-                <form class="form">
-                    <label for="chk" aria-hidden="true">Login</label>
-                    <input class="input" type="email" name="email" id="email" placeholder="Email" required="" />
-                    <input class="input" type="password" name="pswd" id="password" placeholder="Password" required="" />
-                    <button>Login</button>
-                </form>
+            <div class="login form">
+                
+                   
+                    <button><a href="login.html">Login here</a></button>
+                
             </div>
         </div>
     </div>
@@ -164,5 +237,7 @@ <h1>
             signOut(auth)
                 .then(() => {
                     console.log("Sign-out successful.");
-                })
-            })
\ No newline at end of file
+                });
+            });
+
+           
\ No newline at end of file