* {
    margin: 0;
    padding: 0;
}
body {
    height: 540px;
}
/*section {
    height: 260px;
} */
/********** sign up form css ************/

.signup-form {
   
    margin-top: 150px;
    margin-left: 4%;
    margin-right: 4%;
    width: 85%;
    border-width: 3px;
    border-style: solid;
    border-color: black;
    background-color: rgb(206, 206, 173); /* color rgb ( 206,206,173 )*/
    height: 350px;
    font-size: 20px;
    padding: 3%;
    text-align: center;
    padding-bottom: 70px;
}

.signup-form-form {
    display: block;
    align-items: center;
    margin-left: 20px;
    height: 220px;
     
}

 form {
    display: block;
     padding-top: 20px;
     margin-left: 25px;
     margin-right: 25px;
     height: 200px;
     background-color: none;
     
 }

form-signup {
    padding-top: 20px;
    font-size: 24px;
    padding-left: 8%;
    background-color: rgb(202, 243, 16); /* Colors the Sign Up form area rgb 206,206,173*/
}

input[type=text] select { 
    height: 18px;
     padding-top: 20px;
    width: 75%;
}

input[type=text], input[type=password],submit {
     display:flex;
    height: 18px;

}
input[type="text"], input[type="password"] { /* does both Sign up and Log in */
    display: block;
     height: 20px;
    width: 60%;
    background-color: none;/* rgb(22, 250, 14);*/
    margin: 10px auto;
  }
input[type=password],select {
    width: 75%;
    height: 16px;
    /* background-color: rgb(215, 255, 196); */
} 

input[type=password],submit {
    width: 60%;
}


 
button { /* sign up button */
     margin-top: 20px;
     margin-left: 10px;
    text-align: center;
    width: 100px;
     font-size: 20px;
     color: azure;
    background-color: rgb(117, 104, 189);
}
 button:hover {
      background-color: rgb(9, 212, 60)
 }

 p {
     margin-top: 25px;
     text-align: center;
   
 }
 .SignUp_msg {
     display:flexbox;
    
     color: crimson;
    margin-top: 10px;
    justify-content: center;
    
 }


/******* log in form  CSS **************/


.log-in-form {
    margin-top: 145px;
     height: 422px;
    padding-top: 10px;
    background-color: blue;
    text-align: center;
}

.log-in-form h2 {
     font-size: 22px;
}

 .login-form-form {
    height: 220px;    
    padding-top: 10px;
    display: inline-block;
    width: 75%;

   border-width: 3px;
   border-style: solid;
   border-color: black;

    background-color: rgb(206,206,173);
    font-size: 20px;
    align-content: center;
 }

    
 
/*
  
.login-form-form a { /* css for  Forgot password 
     display: block;
       margin-top: 50px;
     font-size: 12px;
    text-align: center;
    
 }


 
 /* style reset password  */


.ResetWrapper-main {
    
     margin-right: 15%;
     margin-left: 15%;
}

 .Reset-default {
    text-align: center;
    margin-top: 180px;
     display:flexbox;
     border: 3px;
     border-color: black;
     border-style: solid;
      
   
 } 
 
 .Reset-default h1 {
    margin-top: 10px;
    font-size: 28px;
 }

 .Reset-default p {
     font-size: 14px;
     font-style: italic;
      padding: 0 16px;
      text-align: justify;
 }

  .resetpwd {
    margin-top: 0px;
    /*background-color: rgb(9, 255, 0); */
  }

 .Reset-default input {
    
    text-align: center;
     width:75%;
 }
 
button{

    align-items: center;
}
button:hover {
    color: rgb(9, 212, 60);
}
 .Reset-default button {
     margin-top: 10px;
    text-align: center;
    
}