diff --git a/css/style.css b/css/style.css
index dd6063e..2807adf 100644
--- a/css/style.css
+++ b/css/style.css
@@ -111,25 +111,15 @@ button {
   font-family: 'Roboto Condensed', sans-serif;
 }
 
-.login-button {
-  /* width: 50%;
-  color: #252537;
-  padding: 0.9rem 1rem;
-  background: #fff;
-  border-radius: 5px;
-  font-size: 0.9rem;
-  left: 50%; */
+.login-button, .submit-button {
   width: 100%;
   padding: 0.98rem;
   border: none;
   background-color: rgb(129, 113, 222);
   font-size: 0.9rem;
- 
   font-family: 'Roboto Condensed', sans-serif;
-  
- 
-  
 }
+
 .submit-button {
   width: 100%;
   display: flex;
@@ -174,12 +164,10 @@ button {
 button:hover {
   transform: translatey(3px);
   box-shadow: none;
-}
-
-button:hover {
   animation: ani9 0.4s ease-in-out infinite alternate;
 }
 
+
 @keyframes ani9 {
   0% {
     transform: translateY(3px);
diff --git a/forgot.html b/forgot.html
index 88c471a..2c692fc 100644
--- a/forgot.html
+++ b/forgot.html
@@ -29,11 +29,12 @@ <h2>Forgot Password</h2>
             </span>
             <input class="form-input" id="txt-input" type="email" name="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,}$" placeholder="Enter Email" autocomplete="off" />
           </div>
-          <button  class="submit-button" style="color: white;">Submit</button>
+          <button id="submit-button" class="submit-button" style="color: white;">Submit</button>
+
         </div>
-        <button class="btn-sign-up">
-            <a href="./index.html">Log-in &nbsp;<i class="fa-solid fa-right-to-bracket"></i></a>
-          </button>
+        <button class="btn-sign-up" onclick="window.location.href='./index.html'">Log-in &nbsp;<i class="fa-solid fa-right-to-bracket"></i></button>
+
+      
       </div>
     </form>
   </div>
diff --git a/sucess.html b/sucess.html
index d47504a..fbc857d 100644
--- a/sucess.html
+++ b/sucess.html
@@ -1,65 +1,123 @@
-<html>
-  <head>
-    <link href="https://fonts.googleapis.com/css?family=Nunito+Sans:400,400i,700,900&display=swap" rel="stylesheet">
-  </head>
-    <style>
-       
-      body {
-         text-align: center;
-        padding: 40px 0;
-        /* background: #EBF0F5; */ 
-        background-image: linear-gradient(-225deg, #e99a08 0%, #fc09e7 100%);
-  background-attachment: fixed;
-  background-repeat: no-repeat;
-  background-position: center;
-  background-size: cover;
-  font-family: 'Roboto Condensed', sans-serif;
-  opacity: 0.95;
-  position: absolute;
-  height: 100%;
-  width: 100%;
-  overflow-y: hidden;
-  overflow-x: hidden;
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <link href="https://fonts.googleapis.com/css?family=Nunito+Sans:400,400i,700,900&display=swap" rel="stylesheet">
+</head>
+
+<style>
+  body {
+    text-align: center;
+    padding: 40px 0;
+    background-image: linear-gradient(-225deg, #e99a08 0%, #fc09e7 100%);
+    background-attachment: fixed;
+    background-repeat: no-repeat;
+    background-position: center;
+    background-size: cover;
+    font-family: 'Nunito Sans', sans-serif;
+    position: relative;
+    height: 100vh;
+    overflow: hidden;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .heartbeat {
+    animation: heartbeat 1s infinite;
+  }
+
+  @keyframes heartbeat {
+    0% {
+      transform: scale(1);
+    }
+    50% {
+      transform: scale(1.1);
+    }
+    100% {
+      transform: scale(1);
+    }
+  }
+
+
+  .card {
+    background: white;
+    padding: 40px;
+    border-radius: 10px;
+    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+  }
+
+  .icon-container {
+    border-radius: 50%;
+    height: 100px;
+    width: 100px;
+    background: #F8FAF5;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 20px;
+    animation: move 2s infinite alternate;
+  }
+
+  .checkmark {
+    color: #9ABC66;
+    font-size: 60px;
+  }
+
+  @keyframes move {
+    0% {
+      transform: translateY(0);
+    }
+    100% {
+      transform: translateY(-10px);
+    }
+  }
+
+  h1 {
+    color: #88B04B;
+    font-family: "Nunito Sans", "Helvetica Neue", sans-serif;
+    font-weight: 900;
+    font-size: 36px;
+    margin-bottom: 10px;
+  }
+
+  p {
+    color: #404F5E;
+    font-family: "Nunito Sans", "Helvetica Neue", sans-serif;
+    font-size: 20px;
+    margin: 0;
+  }
+  .bounce {
+      animation: bounce 0.5s;
+    }
+
+    @keyframes bounce {
+      0% {
+        transform: scale(1);
       }
-        h1 {
-          color: #88B04B;
-          font-family: "Nunito Sans", "Helvetica Neue", sans-serif;
-          font-weight: 900;
-          font-size: 40px;
-          margin-bottom: 10px;
-        }
-        p {
-          color: #404F5E;
-          font-family: "Nunito Sans", "Helvetica Neue", sans-serif;
-          font-size:20px;
-          margin: 0;
-        }
-      i {
-        color: #9ABC66;
-        font-size: 100px;
-        line-height: 200px;
-        margin-left:-15px;
+      50% {
+        transform: scale(1.2);
       }
-      .card {
-        background: white;
-        padding: 60px;
-        border-radius: 4px;
-        box-shadow: 0 2px 3px #C8D0D8;
-        display: inline-block;
-        margin: 40px auto;
+      100% {
+        transform: scale(1);
       }
-    </style>
-    <body>
-        <div class="overlay">
+    }
+</style>
 
-       
-      <div class="card">
-      <div style="border-radius:200px; height:200px; width:200px; background: #F8FAF5; margin:0 auto;">
+<body>
+  <div class="overlay">
+    <div class="card">
+      <div class="icon-container">
         <i class="checkmark">✓</i>
       </div>
-        <h1>Congratulations</h1> 
-        <p>Your account has been created<br/> Happy Browsing❤️!</p>
-      </div>
+      <h1>Congratulations</h1>
+      <p>Your account has been created<br />Happy Browsing❤️!</p>
     </div>
-    </body>
-</html>
\ No newline at end of file
+  </div>
+</body>
+
+
+</html>
