diff --git a/Header.php b/Header.php
index 45a80a2..718d8f3 100644
--- a/Header.php
+++ b/Header.php
@@ -23,7 +23,7 @@ if (mysqli_connect_errno()) {
   <link href="./font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" /><!-- Font-awesome CSS -->
   <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous"><!-- Bootstrap CSS -->
 
-  <link href="./css/styles.css" rel="stylesheet" type="text/css" />
+  <link href="./css/Styles.css" rel="stylesheet" type="text/css" />
 
   <script src="./css/jquery.min.js" type="text/javascript"></script>
   <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
@@ -42,6 +42,8 @@ if (mysqli_connect_errno()) {
         user-select: none;
       }
 
+      /*Rule to include a block of CSS properties only if a certain condition is true.*/
+      /*https://www.w3schools.com/css/css_rwd_mediaqueries.asp*/
       @media (min-width: 768px) {
         .bd-placeholder-img-lg {
           font-size: 3.5rem;
diff --git a/index.php b/index.php
index 6bc4fc3..8c1dc9f 100644
--- a/index.php
+++ b/index.php
@@ -30,20 +30,20 @@ if (isset($_SESSION["user_fullname"])) {
                         <h4 class="list-group-item active" style="font-weight:normal;font-family: Poppins-Regular;"> Sign in </h4>
                     </div> 
                  <div class="card-body">
-                   <form method="post" action="Script.php" name="frm_login">
+                   <form  method="post" action="Script.php" name="frm_login">
                     <input type="hidden" name="frm_login" value="true"/>
-                    Student ID / Instructor Email
+                    <p>Student ID / Instructor Email</p>
                     <input type="text" name="user" placeholder="Email / Student Number" class="form-control" required="required" />
                     <br>
-                    Password
-                    <input type="password" class="form-control"  name="password" placeholder="password" required="required" />
+                    <p>Password</p>
+                    <input type="password" class="form-control"  name="password" placeholder="Password" required="required" />
                     <div class="text-center">
-                        <br><input type="submit" class="btn btn-primary my-2" value="Login">
+                        <br><input type="submit" class="btn btn-primary my-2 btn-lg btn-block" value="Login">
                     </div>
                     <br> <a href="recover_password.php">Reset my password</a>
                     <div class="text-center">
-                        <br><span class="txt1">Don't have an account?</span>
-                        <a class="txt2" href="signup.php" >Sign Up</a> 
+                        <br><span >Don't have an account?</span>
+                        <a href="signup.php" >Sign Up</a> 
                     </div> 
 
             <?php 
diff --git a/signup.php b/signup.php
index 55cc2b2..5e7b7f6 100644
--- a/signup.php
+++ b/signup.php
@@ -20,21 +20,22 @@ include 'Header.php';
 
                 <form method="post" action="Script.php">
                     <input type="hidden" name="frm_signup_2" value="true" />
-                    Full Name
+                    <p>Full Name</p>
                     <input type="text" name="fullname" placeholder="Your full name" class="form-control" value="<?php echo $_SESSION['user_fullname']; ?>" required="required" />
 
-                    Student ID
+                    <p>Student ID</p>
                     <input type="text" name="user_student_id" placeholder="Entre your student ID" class="form-control" value="<?php echo $_SESSION['user_student_id']; ?>" required="required">
 
-                    Email
+                    <p>Email</p>
                     <input type="text" name="email" placeholder="Email" class="form-control" value="<?php echo $_SESSION['user_email']; ?>" required="required" />
 
-                    Password (<i>must include uppercase and lowercase letters, digits and special characters</i>)
-                    <input type="password" class="form-control" name="password" placeholder="Enter password" required="required" />
+                    <p>Password (<i>must include uppercase and lowercase letters, digits and special characters</i>)</p>
+                    <input id="password" type="password" pattern="^(?=.*[A-Za-z])(?=.*\d)(?=.*[@$!%*#?&])[A-Za-z\d@$!%*#?&]{4,}$" title="Password must have at least characters that include lowercase letters, uppercase letters, numbers and sepcial characters (e.g., !?.,*^)." class="form-control" name="password" placeholder="Enter password" required="required"  onchange="if(this.checkValidity()) form.password_two.pattern = this.value;" />
 
-                    Confirm Password
-                    <input type="password" class="form-control" name="confirmpassword" placeholder="Confirm password" required="required" />
+                    <p>Confirm Password</p>
+                    <input id="password_two" type="password" pattern="^(?=.*[A-Za-z])(?=.*\d)(?=.*[@$!%*#?&])[A-Za-z\d@$!%*#?&]{4,}$" title="Password must have at least characters that include lowercase letters, uppercase letters, numbers and sepcial characters" class="form-control" name="confirmpassword" placeholder="Confirm password" required="required" onchange="this.setCustomValidity(this.validity.patternMismatch ? 'Please enter the same Password as above' : '');" />
                     <br>
+
                     <input type="submit" class="btn btn-primary" value="Sign up">
                     <?php
                     error_reporting(E_ALL);