/*=============== GOOGLE FONTS ===============*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800;1000;&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&family=Ubuntu&family=Work+Sans:wght@400;500;600&display=swap');

*{
   margin: 0;
   padding: 0;
   box-sizing: border-box;
   font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;;
}

html,body{
  background-color: rgb(245, 245, 245);
  display: grid;
  height: 100%;
  place-items: center;

}

.form-container{
   width: 500px;
   height: 400px;
   align-items: center;
   text-align: center;
   background-color:rgb(255, 255, 255);
   border-radius: 6px;
   box-shadow: 1px 1px 10px #e3e3e3;
  
}

.logo_img{
  margin-top: 40px;
  width: 70%;
  height: 20%;
  margin-bottom:10px
}

input{
   
   width: 90%;
   padding: 10px 20px;
   margin: 0px 0;
   display: inline-block;
   border: 1px solid #ccc;
   box-sizing: border-box;
}

.reg{
  width: 90%;
  padding: 10px 20px;
  margin: 10px 0;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 5px;
  box-sizing: border-box;
}

#ipw{
   border-bottom-left-radius: 5px;
   border-bottom-right-radius: 5px;
   margin-bottom: 20px;
}

#iemail{

   margin-top: 40px;
   border-top-left-radius: 5px;
   border-top-right-radius: 5px;
}

#restoreemail{
  margin-top: 40px;
  border-radius: 5px;

}

.forgotpw{
   display: inline-block;
   width: 200px;
   height: 30px;
   margin: 5px auto;
   overflow: auto;
   
}

.remember{
   display: inline-block;
  width: 200px;
  height: 30px;
  margin: 5px auto;
  overflow: auto;
  
}

.content{
font-size:14px;
margin-bottom: 15px;
   
}

label {
   display: block;
   padding-left: 15px;
   text-indent: -15px;
 }

 input[type=checkbox]{
   width: 13px;
   height: 13px;
   padding: 0;
   margin:0;
   vertical-align: bottom;
   position: relative;
   top: -1px;
   overflow: hidden;
 }

 input[type=submit]{
   border-radius: 7px;
   background-color: rgb(63, 76, 220);
   color: white;
   font-weight: 500;
   border: 1px solid rgb(213, 213, 213);

 }
 

 input[type=submit]:hover{
   background-color: rgb(39, 52, 199);
 }

 h1{
   font-weight: 1000;
 }

 p{
   display: block;
   padding-left: 15px;
   text-indent: -15px;
 }

 a{
   width: 13px;
   height: 13px;
   padding: 0;
   margin:0;
   vertical-align: bottom;
   position: relative;
   top: -1px;
   overflow: hidden;
   text-decoration: none;
   color: rgb(69, 83, 235);
   font-weight: 600;
 }

 a:hover{
   color: rgb(98, 110, 238);;
 }

 .signup{
   margin-top: 10px;
   font-size:14px;
 }

 img{
  width: 450px;
 }

 .message{
  background: #ffe1e3;
  color: #e23241;
  position: absolute;
  top: 80px;
  padding: 10px 120px 10px 120px;
  border-radius: 5px;
  border: 0.5px solid #f6acb2;
 }
 .wrapper {
  height: 100vh;
  display: grid;
  place-items: center;
}



 @media only screen and (max-device-width: 1024px) {

  .form-container{
    width: 100%;
    height: 400px;
    align-items: center;
    text-align: center;
 }

 }