@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;800&display=swap');


*{

    font-family: 'poppins' ,sans-serif;

}

body{

    background-image: url("images/1.jpg");

    background-size: cover;

    background-position: center;

    background-attachment: fixed;

    background-repeat: no-repeat;

}

.box{

    display: flex;

    justify-content: center;

    align-items: center;

    min-height: 90vh;

}

.container{

    width: 350px;

    display: flex;

    flex-direction: column;

    padding: 0 15px 0 15px;

    

}



header{

    color:rgb(0, 0, 0);

    font-size: 30px;

    display: flex;

    justify-content: center;

    padding: 10px 0 10px 0;

}



.input-field .input{

    height: 45px;

    width: 87%;

    border: none;

    border-radius: 30px;

    color:rgb(0, 0, 0);

    font-size: 15px;

    padding: 0 0 0 45px;

    background: rgba(0, 0, 0, 0.1);

    outline: none;

}

i{

    position: relative;

    top: -33px;

    left: 17px;

    color: #000000;

}

::-webkit-input-placeholder{

    color: #000000;

}

.submit{

    border: none;

    border-radius: 30px;

    font-size: 15px;

    height: 45px;

    outline: none;

    width: 100%;

    color: rgb(0, 0, 0);

    background: rgba(255, 255, 255, 0.7);

    cursor: pointer;

    transition: .3s ;

}

.submit:hover{

    box-shadow: 1px 5px 7px 1px rgba(0, 0, 0, 0.2);

}

.two-col{

    display: flex;

    flex-direction: row;

    justify-content: space-between;

    color: #000000;

    font-size: small;

    margin-top: 10px;

}

.one{

    display: flex;

}

label a{

    text-decoration: none;

    color: #000000;

}

h3{
    display: flex;

    flex-direction: row;

    justify-content: left;

    color: #ffffff;

    font-size: small;

    margin-top: 10px;
    
}

.error {
    background: #F2DEDE;
    color: #b92e2e;
    padding: 10px;
    width: 95%;
    border-radius: 5px;
    margin: 20px auto;
}
.valid{
    background: #e3f2de;
    color: #71b92e;
    padding: 10px;
    width: 95%;
    border-radius: 5px;
    margin: 20px auto;
 }