diff --git a/public/css/style.css b/public/css/style.css
index 839891f9..e501d83e 100644
--- a/public/css/style.css
+++ b/public/css/style.css
@@ -1,3 +1,84 @@
+@import url('https://fonts.googleapis.com/css?family=Raleway');
+
+*{
+    box-sizing:border-box;
+    margin:0px;
+    padding:0px;
+  }
+
+body{
+  font-family:'Raleway';
+  line-height:1.8;
+}
+
+a{
+  text-decoration:none;
+}
+
+#container{
+  background:#344a72;
+  margin:30px auto;
+  max-width:400px;
+  padding:20px;
+}
+
+.form-wrap{
+  background:#fff;
+  padding:15px 25px;
+}
+
+.form-wrap h1,.form-wrap p{
+  text-align:center;
+}
+  
+.form-wrap .form-group{
+  margin-top:15px;
+}
+
+.form-wrap .form-group label{
+  display:block;
+}
+
+.form-wrap .form-group input{
+  width:100%;
+  padding:10px;
+  border:1px solid #ddd;
+  border-radius:5px;
+}
+
+.form-wrap .btn{
+  background:#49c1a2;
+  color:#fff;
+  width:100%;
+  display:block;
+  padding:10px;
+  margin-top:10px;
+  cursor:pointer;
+  border-radius:5px;
+}  
+
+.form-wrap .btn:hover{
+    background:#37a08e;
+}
+.form-wrap .bottom-text{
+    font-size:13px;
+    margin-top:20px;
+}
+
+.form-footer{
+  text-align:center;
+  margin-top:10px;
+}
+
+.form-footer p{
+  color:#fff;
+}
+
+.form-footer a{
+color:#49c1a2;
+}
+
+
 .error {
   display: flex;
   justify-content: center;
diff --git a/src/controllers/postLogin.js b/src/controllers/postLogin.js
index 2fa618e8..4523f7fb 100644
--- a/src/controllers/postLogin.js
+++ b/src/controllers/postLogin.js
@@ -18,11 +18,11 @@ exports.postLogin = (req, res, next) => {
       res.cookie('login', token);
       // console.log(req.cookies.login);
 
-      res.redirect('/');
+      res.redirect('/profile');
     })
     .catch((err) => {
       console.log('sdfjlsdjflsd');
-      if (err.message === 'user not found') { res.send('<p>not kfnhkn</p>'); }
+      if (err.message === 'user not found') { res.send('<p>Go Home</p>'); }
     });
 
 
diff --git a/src/views/emailLogin.hbs b/src/views/emailLogin.hbs
new file mode 100644
index 00000000..0bb923b1
--- /dev/null
+++ b/src/views/emailLogin.hbs
@@ -0,0 +1,25 @@
+<main id='container'>
+  <div class="form-wrap">
+    <h1>Sign In</h1>
+    <p>don't have an account? <a href="/signup">Sign up</a></p>
+    
+    <form action="/login" method="POST">
+      <div class="form-group">
+        <label for="username">Username</label>
+        <input class="username" type="text" name="username" id="signup__username" required>
+      </div>
+
+      
+      <div class="form-group">
+        <label for="password">Password</label>
+        <input class="password" type="password" name="password" id="signup__password" required>
+      </div>
+
+      
+
+      <button type="submit" class="btn">Login</button>
+      <P class="bottom-text">sign in with username insted |<a href="/login"> use username</a>
+      </P>
+    </form>
+  </div>
+</main>
\ No newline at end of file
diff --git a/src/views/layouts/main.hbs b/src/views/layouts/main.hbs
index ca62f638..9f75995b 100644
--- a/src/views/layouts/main.hbs
+++ b/src/views/layouts/main.hbs
@@ -4,10 +4,13 @@
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <meta http-equiv="X-UA-Compatible" content="ie=edge">
+  <link rel="stylesheet" href="css/style.css">
   <title>Tweet Your Opinion</title>
 </head>
 <body>
   {{{body}}}
   {{> footer}}
+
+  <script src="../../../public/js/dom.js"></script>
 </body>
 </html>
\ No newline at end of file
diff --git a/src/views/login.hbs b/src/views/login.hbs
index fa610e52..3a2957da 100644
--- a/src/views/login.hbs
+++ b/src/views/login.hbs
@@ -1,18 +1,25 @@
-<main>
-  <form action="login" method="POST">
-    <div>
-      <label for="username">Username</label>
-      <input type="text" name="username" id="login__username">
-    </div>
+<main id='container'>
+  <div class="form-wrap">
+    <h1>Sign In</h1>
+    <p>don't have an account? <a href="/signup">Sign up</a></p>
+    
+    <form action="/login" method="POST">
+      <div class="form-group">
+        <label for="username">Username</label>
+        <input class="username" type="text" name="username" id="signup__username" required>
+      </div>
 
-    <div>
-      <label for="password">Password</label>
-      <input type="password" name="password" id="login__password">
-    </div>
- 
-    <div>
-      <button type="submit" id="login__button">Login</button>
-    </div>
-  
-  </form>
+      
+      <div class="form-group">
+        <label for="password">Password</label>
+        <input class="password" type="password" name="password" id="signup__password" required>
+      </div>
+
+      
+
+      <button type="submit" class="btn">Login</button>
+      <P class="bottom-text">sign in with email insted |<a href="./emailLogin.hbs"> use email</a>
+      </P>
+    </form>
+  </div>
 </main>
\ No newline at end of file
diff --git a/src/views/signup.hbs b/src/views/signup.hbs
index 997cd1cc..b5ccadc2 100644
--- a/src/views/signup.hbs
+++ b/src/views/signup.hbs
@@ -1,38 +1,42 @@
-<main>
-  <form action="/signup" method="POST">
-    <div>
-      <label for="username">Username</label>
-      <input type="text" name="username" id="signup__username">
-    </div>
+<main id='container'>
+  <div class="form-wrap">
+    <h1>Sign Up</h1>
+    <p>do you already have an account? <a href="/login">Login</a></p>
+    
+    <form action="/signup" method="POST">
+      <div class="form-group">
+        <label for="username">Username</label>
+        <input class="username" type="text" name="username" id="signup__username">
+      </div>
 
-    <div>
-      <label for="email">Email</label>
-      <input type="email" name="email" id="signup__email">
-    </div>
+      <div class="form-group">
+        <label for="email">Email</label>
+        <input class="email" type="email" name="email" id="signup__email" required>
+      </div>
 
-    <div>
-      <label for="password">Password</label>
-      <input type="password" name="password" id="signup__password">
-    </div>
+      <div class="form-group">
+        <label for="password">Password</label>
+        <input class="password" type="password" name="password" id="signup__password" required>
+      </div>
 
-    <div>
-      <label for="confirm_password">Confirm Your Password</label>
-      <input type="password" name="confirm_password" id="signup__confirmpassword">
-    </div>
+      <div class="form-group">
+        <label for="confirm_password">Confirm Your Password</label>
+        <input class="confirm-password" type="password" name="confirm_password" id="signup__confirmpassword" required>
+      </div>
 
-    <div>
-      <label for="mobile_no">Mobile Number</label>
-      <input type="number" name="mobile_no" id="signup__mobilenomber">
+      <div class="form-group">
+        <label for="mobile_no">Mobile Number</label>
+        <input class="mobile_no" type="number" name="mobile_no" id="signup__mobilenomber" required>
+      </div>
+    
+      <div class="form-group">
+        <label for="date_of_birth">Date Of Birth</label>
+        <input class="date-of-birth" type="date" name="date_of_birth" id="signup__dateofbirth" required>
+      </div>
 
-    </div>
-  
-    <div>
-      <label for="date_of_birth">Date Of Birth</label>
-      <input type="date" name="date_of_birth" id="signup__dateofbirth">
-    </div>
-
-    <div>
-      <button type="submit" id="signup__button">Sign Up</button>
-    </div>
-  </form>
+      <button type="submit" class="btn">Sign Up</button>
+      <P class="bottom-text">By clicking the sign up button you agree to our <a href="#">Terms & Conditions</a>
+          and <a href="#">Privacy Policy</a></P>
+    </form>
+  </div>
 </main>
\ No newline at end of file
