@import url("https://fonts.googleapis.com/css2?family=Poopins:wght@300;400;500;600;700;800;900&display=swap");


body {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background: url(back.jpg);
    background-position: center;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

a:link{
    text-decoration: none;
    color: #187eeb;

}
.wrapper{
    font-weight:400; 
    position:absolute; top: 20%;
    width: 330px;
    height: 440px;
    border-radius:0px;
    padding: 20px;
    background: #005097;
    color: #fff;

} 

.input-box input{
    margin-left: 20px;
     width: 90%;
     height: 40px;
     background: #00427C;
     font-size: 16px;
     margin-bottom: 15px;
     border: 1px solid;
     border-radius: 5px;
     text-align: center;
     color:white ;
   
}

.input-box input::placeholder {
    color: white; /* Color of the placeholder text */
}

.input-box input:focus {
    background: #C1092F; /* Background color changes to red when clicked */
}

.submit{
    background-color: white;
    margin-left: 20px;
    border-radius:0px;
    color: #000000;
    width: 90%;
    height: 40px;
    font-size: 16px;
    font-family: 'Roboto Condensed';
    margin-bottom: 20px;
    border-radius: 5px;   

}

.heading{
    margin-top: 10px;
    font-weight: lighter;
    color:white;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;  
    text-align: center;

}

.input-box label{
    color:white;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;  
    margin-left: 20px;

}

.heading1{
    position: absolute; top: 7%;
    font-weight: lighter;
    color:white;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16px;  
    margin-left: 38%;
}

.check{
    position: absolute; top: 49%;
    color:white;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;  
    margin-left: 20px;

}
 .forgot{  
    margin-top: 20px;
    color:white;
    font-family: 'Roboto Condensed';
    font-size: 14px;  
    text-align: center;

 }

 .power{
    color:white;
    font-family: 'Roboto Condensed';
    font-size: 14px;  
    text-align: center;

 }