diff --git a/Css-files/login1.css b/Css-files/login1.css
index cbe234ea..df176177 100644
--- a/Css-files/login1.css
+++ b/Css-files/login1.css
@@ -175,7 +175,96 @@ body {
   background-color: #b8938f; /* Darker Google color on hover */
 }
 
-/* Accessibility: Adding focus styles for inputs and buttons */
+
+
+.btn-login,   
+#facbook-login {
+  width: 100%;
+  height: 45px;
+  border-radius: 15px;
+  border: none;
+  margin: 10px;   /*Margin added so that they do not overlap*/
+  background-color:#aa6a6a;;
+  color: rgb(190, 135, 135);
+  font-size: 16px;
+  cursor: pointer;
+  transition: background-color 0.3s ease, transform 0.3s ease; /* Smooth transitions for hover and active states */
+}
+
+
+
+
+.btn-login:hover,
+#facbook-login:hover {
+  background-color: #ac7070; /* Darker shade on hover */
+  transform: translateY(-3px); /* Lift effect on hover */
+}
+
+.btn-login:active,
+#facbook-login:active {
+  transform: translateY(1px); /* Slight press effect */
+}
+
+#facbook-login {
+  background-color: #3b5998;/* Google red color */
+
+}
+
+#facbook-login:hover {
+  background-color: #3b5998; /* Darker Google color on hover */
+}
+
+#facbook-login a{
+     text-decoration: none;
+     color: #fff;
+   
+}
+
+
+
+
+.btn-login,   
+#x-login {
+  width: 100%;
+  height: 45px;
+  border-radius: 15px;
+  border: none;
+  margin: 10px;   /*Margin added so that they do not overlap*/
+  background-color:#aa6a6a;;
+  color: rgb(190, 135, 135);
+  font-size: 16px;
+  cursor: pointer;
+  transition: background-color 0.3s ease, transform 0.3s ease; /* Smooth transitions for hover and active states */
+}
+
+
+
+
+.btn-login:hover,
+#x-login:hover {
+  background-color: #ac7070; /* Darker shade on hover */
+  transform: translateY(-3px); /* Lift effect on hover */
+}
+
+.btn-login:active,
+#x-login:active {
+  transform: translateY(1px); /* Slight press effect */
+}
+
+#x-login {
+  background-color:#000000;/* Google red color */
+}
+
+#x-login:hover {
+  background-color: 	#141313; /* Darker Google color on hover */
+}
+
+#x-login a{
+     text-decoration: none;
+     color: #fff;
+   
+}
+/* Accessibility: Adding focus styles for inputs and buttons */ 
 .textfield > input:focus {
   outline: 2px solid #a45b5b; /* Red outline for focused input */
 }
diff --git a/Html-files/login.html b/Html-files/login.html
index fa220990..9e62762a 100644
--- a/Html-files/login.html
+++ b/Html-files/login.html
@@ -244,6 +244,13 @@
           width: 100%;
           padding: 12px;
         }
+
+        .btn-login,
+        #facbook-login{
+
+          width: 100%;
+          padding: 12px;
+        }
     
         h1 {
           font-size: 24px;
@@ -273,6 +280,7 @@
           padding: 10px;
           font-size: 14px;
         }
+        
       }
     </style>
 
@@ -317,6 +325,10 @@ <h1 style="color: hsl(203, 30%,26%);font-family: var(--ff-philosopher);">LOGIN</
           <button type="submit" class="btn-login" style="color: black;font-family:var(--ff-poppins);">Login</button>
           <span>or</span>
           <button id="google-login" style="color: black;font-family:var(--ff-poppins); background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMTcuNiA5LjJsLS4xLTEuOEg5djMuNGg0LjhDMTMuNiAxMiAxMyAxMyAxMiAxMy42djIuMmgzYTguOCA4LjggMCAwIDAgMi42LTYuNnoiIGZpbGw9IiM0Mjg1RjQiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGQ9Ik05IDE4YzIuNCAwIDQuNS0uOCA2LTIuMmwtMy0yLjJhNS40IDUuNCAwIDAgMS04LTIuOUgxVjEzYTkgOSAwIDAgMCA4IDV6IiBmaWxsPSIjMzRBODUzIiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNNCAxMC43YTUuNCA1LjQgMCAwIDEgMC0zLjRWNUgxYTkgOSAwIDAgMCAwIDhsMy0yLjN6IiBmaWxsPSIjRkJCQzA1IiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNOSAzLjZjMS4zIDAgMi41LjQgMy40IDEuM0wxNSAyLjNBOSA5IDAgMCAwIDEgNWwzIDIuNGE1LjQgNS40IDAgMCAxIDUtMy43eiIgZmlsbD0iI0VBNDMzNSIgZmlsbC1ydWxlPSJub256ZXJvIi8+PHBhdGggZD0iTTAgMGgxOHYxOEgweiIvPjwvZz48L3N2Zz4=); background-repeat: no-repeat; background-position: 25% 50%; background-size: 30px;">Login with google</button>
+
+          <button id="facbook-login" style="color: black;font-family:var(--ff-poppins); background-image: url(https://upload.wikimedia.org/wikipedia/commons/1/1b/Facebook_icon.svg); background-repeat: no-repeat; background-position: 25% 50%; background-size: 30px;"><a href="https://www.facebook.com/login/">Login with facebook</a></button>
+          <button id="x-login" style="color: black;font-family:var(--ff-poppins); background-image: url(https://img.freepik.com/free-vector/twitter-new-2023-x-logo-white-background-vector_1017-45422.jpg?t=st=1729705399~exp=1729708999~hmac=86164ca5278d72d1e806212a9399b9f1d09e5db1559733d42425370dbca91851&w=826); background-repeat: no-repeat; background-position: 25% 50%; background-size: 30px;"><a href="https://x.com/i/flow/login">Login with X</a></button>
+
           <p id="error-message" style="color: red; font-family: var(--ff-poppins);"></p>
           <a href="forgot-pass.html" class="forgot-link">Forgot Password ?</a>
           <p class="switch-link">Don’t have an account? <a href="signup.html">Sign Up</a></p>