style.css

body{
    background-image: url("background2.jpg");
    background-size: cover; /* or contain, or specific size */
    background-position: center ; /* or other positions */
    background-repeat: no-repeat; 
}

.container{
    /* background-color: aqua; */
    padding:1%;
    padding-left: 5%;
    padding-right: 5%;
    display: flex;
    flex: wrap;
    flex-grow: 2;
    justify-content: center;
    
    flex-direction: column;
    /*(top, right, bottom, left)*/
    width: 9cm;
    height:9cm;
    margin: 5% 30% 10% 10%;
    h1{
        color:white;
        text-align: left;
        margin-bottom: 0;
        font-family:sans-serif;    
        font-weight: lighter;
        font-size: 5vw;
        
    }
    p{
        margin-top: 0%;
        color: white;
        text-align: left;
        margin-bottom: 1cm;
        font-family:sans-serif;    
        font-weight:lighter;
        font-size: 2vw;
        
    }

    input{
        flex-shrink: 1;
        background-color: none;
        color: none;
        border: none;
        width: 6cm;
    }

   
    .btn1{
        margin-top: 4%;
        width: 100%;
        left: 0%;
        background-color:  rgb(56, 152, 236);
        padding: 3%;
        margin-bottom: 1.5rem;
        color: aliceblue;
        font-family:'Times New Roman', Times, serif;
        font-weight:bolder;
        border: none;
        width: 6.2cm;
        cursor: pointer;
    }
    
    .btn2{
        background:none;
        color:white;
        border: none;
        text-decoration: underline;
        cursor: pointer;
        
    }
    #btns{
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        
    }
}

input{
    margin: 1%;

}

#warn{
    color: red;
    font-size: small;
    padding: 0%;
    margin: 0%;
}