diff --git a/client/src/App.jsx b/client/src/App.jsx
index b2bfe87..ac1bb4f 100644
--- a/client/src/App.jsx
+++ b/client/src/App.jsx
@@ -9,6 +9,8 @@ import CodeEditorPage from "../src/Components/CodeEditor/CodeEditorPage";
 import Navbar from "./Components/common/Navbar";
 import './Components/Styles/Navbar.css'
 import Footer from "./Components/common/Footer";
+import close from "./images/close.png";
+
 
 function App() {
   const[showSidebar, setShowSidebar] = useState(false)
@@ -16,8 +18,9 @@ function App() {
     <div>
       <div className={`sidebar-${showSidebar?'show':'hide'}`}>
         <div className="SidebarObject">
-        <div onClick={()=>setShowSidebar(!showSidebar)} > <span className="close">close</span> </div>
+        <div onClick={()=>setShowSidebar(!showSidebar)} ><img src={close} className="closeImg"  alt="" /> </div>
         <div><span className="Home">Home</span></div>
+        <div><span className="Home">Login</span></div>
         <div><span className="Home">Ques</span></div>
         </div>
     </div>
diff --git a/client/src/Components/Styles/LandingPage.css b/client/src/Components/Styles/LandingPage.css
index 4732417..395d29a 100644
--- a/client/src/Components/Styles/LandingPage.css
+++ b/client/src/Components/Styles/LandingPage.css
@@ -1,5 +1,3 @@
-
-
 .content {
   display: flex;
   align-items: center;
@@ -20,36 +18,38 @@
 .home {
   padding: 10px;
   font-size: 1rem;
-  background:linear-gradient(45deg, transparent, #eb36e2);;
+  /* background:linear-gradient(45deg, transparent, #eb36e2); */
+  background-image: linear-gradient(144deg, #af40ff, #5b42f3 50%, #00ddeb);
   color: #fff;
   text-decoration: none;
   border: none;
-  border-radius: 5px;
+  border-radius: 12px;
   display: flex;
   align-items: center;
   justify-content: center;
+  box-shadow: 0 0 5px rgb(131, 125, 227), 0 0 10px rgb(124, 124, 224);
 }
 .Login {
   padding: 10px;
   font-size: 1rem;
-  background:linear-gradient(45deg, transparent, #ee31c8);
+  /* background:linear-gradient(45deg, transparent, #ee31c8); */
+  background-image: linear-gradient(144deg, #af40ff, #5b42f3 50%, #00ddeb);
   color: #fff;
   text-decoration: none;
   border: none;
-  border-radius: 5px;
+  border-radius: 12px;
+  box-shadow: 0 0 5px rgb(131, 125, 227), 0 0 10px rgb(124, 124, 224);
 }
 
 .home:hover {
-  background-color: #333;
-  box-shadow: 0 0 5px rgb(239, 138, 239), 0 0 10px rgb(209, 111, 229),
-    0 0 25px rgb(226, 104, 237), 0 0 50px rgb(225, 116, 214);
+  box-shadow: 0 0 5px rgb(80, 76, 134), 0 0 10px rgb(96, 96, 228),
+    0 0 25px rgb(74, 132, 224);
   color: white;
 }
 
 .Login:hover {
-  background-color: #333;
-  box-shadow: 0 0 5px rgb(209, 107, 227), 0 0 10px rgb(191, 88, 205),
-    0 0 25px rgb(199, 123, 220), 0 0 50px rgb(157, 75, 180);
+  box-shadow: 0 0 5px rgb(80, 76, 134), 0 0 10px rgb(96, 96, 228),
+    0 0 25px rgb(74, 132, 224);
   color: white;
 }
 
@@ -57,7 +57,8 @@
   margin-top: 50px;
   padding: 15px 25px;
   font-size: 1.5rem;
-  background-color: #007bff;
+  /* background-color: #007bff; */
+  background-image: linear-gradient(144deg, #af40ff, #5b42f3 50%, #00ddeb);
   color: #fff;
   text-decoration: none;
   border: none;
@@ -72,7 +73,7 @@
   box-shadow: 0 0 5px rgb(128, 162, 229), 0 0 10px rgb(127, 127, 238),
     0 0 25px rgb(123, 123, 220), 0 0 50px rgb(109, 156, 252);
 }
-.image{
+.image {
   width: 70rem;
 }
 .start {
@@ -81,7 +82,7 @@
   align-items: flex-start;
   margin-left: 2.5rem;
 }
-.start > p{
+.start > p {
   font-size: 3.5rem;
   font-weight: bolder;
 }
@@ -100,7 +101,7 @@
 }
 
 @media screen and (max-width: 600px) {
-  .home__txt{
+  .home__txt {
     font-size: 2.3rem;
   }
   .content {
@@ -116,7 +117,7 @@
     text-align: center;
     margin-left: 0;
   }
-  .start > p{
+  .start > p {
     font-size: 2.4rem;
   }
   .start-coding-button {
diff --git a/client/src/Components/Styles/Navbar.css b/client/src/Components/Styles/Navbar.css
index cbd5d1d..6f4589a 100644
--- a/client/src/Components/Styles/Navbar.css
+++ b/client/src/Components/Styles/Navbar.css
@@ -75,3 +75,9 @@ header{
     }
 }
 
+.closeImg{
+  width: 30px;
+  position: absolute;
+  top: 40px;
+  left: 40px;
+}