* {
 margin: 0;
padding:0;
font-family:cursive;
box-sizing: border-box;
}

body {

display:flex ;
justify-content: center;
min-height: 100vh;
align-items:center;

background: url('pexels-stywo-1054218.jpg');
background-size: cover;
background-repeat: no-repeat;
}

.wrapper {
 box-shadow: 0 0 10px #aaa;
 width: 429px;
 background: transparent;
 color: white;
border: 1px solid ;
border-radius: 10px;
backdrop-filter: blur(10px);
padding: 20px;

}
.wrapper h1 {
 font-size: 30px;
 text-align: center;

}

.wrapper .input-box {

  position:relative;
   width: 100%;
   height: 50px;
  color: white;
  
    margin: 30px 0px;
    box-shadow: 0 0 10px #aaa;

}
.input-box input{
 color: azure;
    width: 100%;
  height: 100%;
 background: transparent;
 border: 1px solid black;
 border-radius:20px ;
 padding: 10px;
}

.input-box i {

position:absolute;
right: 20px;
top:17px;

}

.wrapper .rem-forget{

    display: flex;
    justify-content: space-between;
    font-size: 17px;
    margin: 10px;
}

.rem-forget a {
    color: white ;
}
.wrapper .btn{
   height: 50px;
    width: 100%;
    border: none;
    border-radius: 20px;
}
.wrapper .register-link {

   text-align: center;
}
.wrapper .register-link p a {

   color: aqua;
}
.reg .input{


height: 40px;
width: 100%;
padding: 10px;
}

.reg{

  border: 1px solid black;
  padding: 20px;
}
.reg h1{

  text-align: center;
  justify-content: center;
}
.reg button {
  justify-content: space-between;
}