@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap');
*{
  margin: 0;
  padding: 0;
  font-family:Poppins;
}
body{
  display:flex;
  justify-content:center;
  align-items:center;
  min-height: 100vh;
  background:rgb(84, 104, 104);
}
.box{
 
  width:420px;
  background:rgba(0,0,0,0.2);
  color:white;
  border-radius:20px;
  padding:45px 20px;
}
.box h1{
  font-size:36px;
  text-align:center;
}
.input-box{
  position:relative;
  width:100%;
  height:50px;
  margin:30px 0;
}
.input-box input{
  width:100%;
  height:100%;
  background: transparent;
  border: none;
  outline:none;
  color: #fff;
  border:2px solid rgba(255,255,255,2);
  border-radius:40px;
  padding:20px 45px 20px 20px;
}
.input-box input::placeholder{
  color: #fff;
}
.remember{
display: flex;  
justify-content:space-between;
align-items: center;
font-size:14.5;
margin:-15px 0 15px;
}
.remember label input{
  accent-color:#fff;
  margin-right:3px;
  
}
.checkbox{
  background: blue;
}
.remember a{
  color:#fff;
  text-decoration:none;
  display: flex;
  align-items: center;
}
.remember a:hover{
  text-decoration:underline;
}
.btn{
  width:100%;
  height:45px;
  background:#fff;
  border:none;
  outline:none;
  border-radius:40px;
}
.acc{
  text-align:center;
}
.acc a{
  color:#fff;
   text-decoration:none;
  
}
.acc a:hover{
  text-decoration:underline;
}