diff --git a/client/index.html b/client/index.html
index 60ee596..0302474 100644
--- a/client/index.html
+++ b/client/index.html
@@ -1,16 +1,23 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + React</title>
-    <link rel="preconnect" href="https://fonts.googleapis.com">
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-    <link href="https://fonts.googleapis.com/css2?family=Merriweather:ital@1&family=Montserrat&family=Prompt&family=Sacramento&display=swap" rel="stylesheet">
-  </head>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="/src/main.jsx"></script>
-  </body>
-</html>
+
+<head>
+  <meta charset="UTF-8" />
+  <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>PeetCode</title>
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <!-- <link href="https://fonts.googleapis.com/css2?family=Merriweather:ital@1&family=Montserrat&family=Prompt&family=Sacramento&display=swap" rel="stylesheet"> -->
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet">
+  <script src="https://cdn.tailwindcss.com"></script>
+</head>
+
+<body>
+  <div id="root"></div>
+  <script type="module" src="/src/main.jsx"></script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/client/src/App.css b/client/src/App.css
index 35ac68f..c3e5b45 100644
--- a/client/src/App.css
+++ b/client/src/App.css
@@ -6,11 +6,11 @@ font-family: 'Sacramento', cursive;
 */
 
 h1 , h2 , h3 , h4 , h5 , h6 {
-  font-family: 'Montserrat', sans-serif;
+  font-family: 'Poppins', sans-serif;
   font-weight: 900;
 }
 p , a {
-  font-family: 'Prompt', sans-serif
+  font-family: 'Poppins', sans-serif
 }
 
 .flex-row {
diff --git a/client/src/Components/AllProblems/AllProblems.css b/client/src/Components/AllProblems/AllProblems.css
index 0bdfb9f..e2fcaa5 100644
--- a/client/src/Components/AllProblems/AllProblems.css
+++ b/client/src/Components/AllProblems/AllProblems.css
@@ -15,11 +15,11 @@ th {
     text-align: start;
     padding: 0.5rem 0 0.5rem 0.3rem;
     color: black;
-    font-family: 'Merriweather', serif;
+    font-family: 'Poppins', serif;
 }
 
 td {
-    font-family: 'Merriweather', serif;
+    font-family: 'Poppins', serif;
     padding: 1rem;
 }
 
diff --git a/client/src/Components/AllProblems/AllProblems.jsx b/client/src/Components/AllProblems/AllProblems.jsx
index 1e16e6b..fc52520 100644
--- a/client/src/Components/AllProblems/AllProblems.jsx
+++ b/client/src/Components/AllProblems/AllProblems.jsx
@@ -21,7 +21,7 @@ const AllProblemsPage = () => {
   }, []);
 
   return (
-    <div id="allproblems">
+    <div id="allproblems" className='py-9 md:px-8 pl-4'>
       <table>
         <tbody>
 
@@ -32,7 +32,7 @@ const AllProblemsPage = () => {
           </tr>
 
           {problems.map((prob,index) => (
-            <tr>
+            <tr className='hover:bg-stone-100 hover:drop-shadow-md'>
               <Link to={`/problems/:${prob.problemId}`}>
                 <td>{prob.title}</td>
               </Link>
diff --git a/client/src/Components/HomePage/HomePage.css b/client/src/Components/HomePage/HomePage.css
index d6f166b..16944c4 100644
--- a/client/src/Components/HomePage/HomePage.css
+++ b/client/src/Components/HomePage/HomePage.css
@@ -14,4 +14,7 @@
 
 .content {
     margin: 5px 0;
+}
+#home{
+    padding-top: 3rem;
 }
\ No newline at end of file
diff --git a/client/src/Components/HomePage/HomePage.jsx b/client/src/Components/HomePage/HomePage.jsx
index f11180c..e06b1f8 100644
--- a/client/src/Components/HomePage/HomePage.jsx
+++ b/client/src/Components/HomePage/HomePage.jsx
@@ -4,10 +4,10 @@ import loremContent from './LoremPosts'
 
 const HomePage = () => {
   return (
-    <div id="home">
-      <h1 className='flex-row'>Blogs</h1>
+    <div id="home" className='md:px-5 px-2'>
+      <h1 className='flex-row pb-5 text-3xl'>Blogs</h1>
       {loremContent.map((content,index) => (
-        <div key={`blog-${index}`} className="blog-box">
+        <div key={`blog-${index}`} className="blog-box hover:bg-slate-100 hover:drop-shadow-md ">
           <p className="date">{content.date}</p>
           <h4 className='title'>{content.title}</h4>
           <p className="content">{content.content}</p>
diff --git a/client/src/Components/Login/Login.jsx b/client/src/Components/Login/Login.jsx
index 6cc12bf..57183a0 100644
--- a/client/src/Components/Login/Login.jsx
+++ b/client/src/Components/Login/Login.jsx
@@ -10,8 +10,8 @@ const Login = () => {
 
   return (
     <div id="login" className='flex-col'>
-      <h1>Login</h1>
-      <div className='signup-form'>
+      <h1 className='text-3xl'>Login</h1>
+      <div className='signup-form mt-4'>
         <div className='subform'>
           <label htmlFor="email">Email: </label>
           <input onChange={(e) => {
diff --git a/client/src/Components/ProblemsPage/ProblemsPage.css b/client/src/Components/ProblemsPage/ProblemsPage.css
index a6bc696..27270ab 100644
--- a/client/src/Components/ProblemsPage/ProblemsPage.css
+++ b/client/src/Components/ProblemsPage/ProblemsPage.css
@@ -2,11 +2,21 @@
     min-height: 91vh;
     display: flex;
     align-items: flex-start;
+    /* flex-direction: column; */
 }
 
+@media screen and (max-width: 640px) {
+    #problempage{
+        flex-direction: column;
+    }
+    
+  }
+
+ 
+
 .ques , .code {
-    width: 50%;
-    min-height: 65vh;
+    width: 100%;
+    /* min-height: 65vh; */
     margin: 0;
     display: flex;
     flex-direction: column;
diff --git a/client/src/Components/ProblemsPage/ProblemsPage.jsx b/client/src/Components/ProblemsPage/ProblemsPage.jsx
index 66cedf3..449e784 100644
--- a/client/src/Components/ProblemsPage/ProblemsPage.jsx
+++ b/client/src/Components/ProblemsPage/ProblemsPage.jsx
@@ -53,7 +53,7 @@ const ProblemsPage = () => {
             </div>
             <div className="code">
               <h1>Code Here</h1>
-              <div className='code-form'>
+              <div className='code-form border-2 rounded border-stone-700'>
                 <textarea onChange={(e) => setSubmission(e.target.value)} name="SolvedCode" onKeyDown={ (event) => handleKey(event) }></textarea>
                 <button type="submit" id="submit" onClick={async () => {
                   const response = await fetch(`${backendUrl}/submission`, {
diff --git a/client/src/Components/Signup/Signup.jsx b/client/src/Components/Signup/Signup.jsx
index 20ca0cf..53aee09 100644
--- a/client/src/Components/Signup/Signup.jsx
+++ b/client/src/Components/Signup/Signup.jsx
@@ -8,8 +8,8 @@ const Signup = () => {
 
   return (
     <div id='signup' className='flex-col'>
-      <h1>Signup</h1>
-      <div className='signup-form'>
+      <h1 className="text-3xl">Signup</h1>
+      <div className='signup-form mt-4'>
         <div className='subform'>
           <label htmlFor='email'>Email: </label>
           <input
diff --git a/client/src/Constants/Navbar/Navbar.jsx b/client/src/Constants/Navbar/Navbar.jsx
index 28ecfd1..347edc5 100644
--- a/client/src/Constants/Navbar/Navbar.jsx
+++ b/client/src/Constants/Navbar/Navbar.jsx
@@ -1,15 +1,18 @@
 import React from 'react'
 import { Link } from 'react-router-dom'
 
-import './Navbar.css'
+// import './Navbar.css'
 
-const Navbar = () => {
+// old navbar
+const Navbar1 = () => {
   return (
     <div id='navbar-main' className='flex-row'>
       <Link to={'/'}>
+
         <div className="logo-box flex-row"> 
           <img className='logo' src="https://user-images.githubusercontent.com/63964149/152531278-5e01909d-0c2e-412a-8acc-4a06863c244d.png" alt="logo" /> 
           <p>PeetCode</p>
+
         </div>
       </Link>
       <div className="nav-options">
@@ -25,4 +28,49 @@ const Navbar = () => {
   )
 }
 
+
+// new nav bar
+const Navbar = () => {
+  return (
+
+    <div className="bg-neutral-700 flex md:p-4 p-3 md:text-xl text-sm
+          shadow-lg
+          text-stone-300
+          
+      ">
+
+      <div className="items-center w-full flex">
+        <Link to={'/'}>
+          <div className="text-white cursor-pointer md:text-3xl text-md md:pr-4
+                  flex items-center
+              ">
+            <div className="md:px-2 pr-1"><img src="https://user-images.githubusercontent.com/63964149/152531278-5e01909d-0c2e-412a-8acc-4a06863c244d.png" className="md:w-10 w-5"></img></div>
+            <div>
+              PeetCode
+            </div>
+          </div>
+        </Link>
+        <div className="md:px-4 pl-3 hover:text-white cursor-pointer h-full items-center flex" > <Link to={'/problemset/all/'} >Problems</Link></div>
+
+       
+      </div>
+
+      <div className="items-center
+           hover:text-white 
+           cursor-pointer md:px-4 px-1 flex">
+        <Link to={'/signup'} >Signup</Link>
+      </div>
+      <div className="items-center
+           hover:text-white 
+           cursor-pointer md:px-4 px-1 flex">
+        <Link to={'/login'} >Login</Link>
+      </div>
+
+    </div>
+
+  )
+}
+
+
 export default Navbar
+
diff --git a/server/index.js b/server/index.js
index 9691a83..773fa84 100644
--- a/server/index.js
+++ b/server/index.js
@@ -1,7 +1,9 @@
+
 const express = require("express");
 const app = express();
 const port = 3000;
 var jwt = require("jsonwebtoken");
+
 const { auth } = require("./middleware");
 let USER_ID_COUNTER = 1;
 const USERS = [];
@@ -143,6 +145,46 @@ app.get("/submissions/:problemId", auth, (req, res) => {
 });
 
 app.post("/submission", auth, (req, res) => {
+
+    const isCorrect = Math.random() < 0.5;
+    const problemId = req.body.problemId;
+    const submission = req.body.submission;
+
+    if (isCorrect) {
+        SUBMISSIONS.push({
+            submission,
+            problemId,
+            userId: req.userId,
+            status: "AC"
+        })
+        return res.json({
+            status: "AC"
+        })
+    } else {
+
+        SUBMISSIONS.push({
+            submission,
+            problemId,
+            userId: req.userId,
+            status: "WA"
+        })
+        return res.json({
+            status: "WA"
+        })
+    }
+})
+
+app.post("/signup", (req, res) => {
+    console.log(req.body)
+    const email = req.body.email;
+    const password = req.body.password;
+    if (USERS.find(x => x.email === email)) {
+        return res.status(403).json({msg: "Email already exists"});
+    }
+
+    USERS.push({
+        email, password, id: USER_ID_COUNTER++
+   })
   const isCorrect = Math.random() < 0.5;
   const problemId = req.body.problemId;
   const submission = req.body.submission;
@@ -163,6 +205,7 @@ app.post("/submission", auth, (req, res) => {
       problemId,
       userId: req.userId,
       status: "WA",
+
     });
     return res.json({
       status: "WA",
