*{
    padding:0;
    margin: 0;
}

html{
    font-size: 85%;
}

body{
height: 100%;
font-family:'Tohama', sans-serif;

}

.logincontainer{
    width:320px;
    border:solid 1px rgba(0,0,0,0.2);
    height:350px;
    padding:25px;
    border-radius:15px;
}


.maincontainer{
    display: flex;
    justify-content: center;
    align-items: center;
width: 100%;
height: 100vh;
flex-direction: column;
overflow: hidden;
}

.imgcontainer{
 width:100px;

}

.imgcontainer img{
    width:100%;
}

   


input[type="text"], input[type="password"]{
border:solid 1px rgba(0,0,0,0.5);
padding:9px;
border-radius: 5px;
width:100%;
outline: none;

}

input[type="text"]:focus, input[type="password"]:focus{
border:solid 1px rgba(0,0,0,0.5);
padding:8px;
border-radius: 5px;
width:100%;
box-shadow: 0 0 8px rgba(3, 213, 241, 0.8);
}

button{
    padding:10px;
    width:100%;
    background-color: rgb(241, 182, 3);
    border-radius: 30px;
    border:none;
}

.textsignin{
    font-weight: bold;
    color:#6c6b6b;
    font-size: large;
}

.textmobile{
    font-weight: bold;
    margin-bottom: 5px;;
}

.needhelp a{
    color:#1f557b;
    
}

.texunder a{
    color: #1f557b;
   /* text-decoration:line;*/
}

.newuser{
    padding: 10px 0px;
    border-top: solid 1px rgba(0,0,0,0.2);

}
.newuser > div:first-child{
    font-weight: bold;
    padding: 5px 0px;
    
}

.newuser > div:last-child a{
    color: #1f557b;
   
}   

.myfooter{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px 0px;
   border-top: solid 1px rgba(0,0,0,0.2);
    color:#171515;
}

.myfooter a{
    color:#1f557b;
    
}

/* Modal styles */
 /* Simple modal styles */
        .modal-overlay{
            position:fixed;
            inset:0;
            background:rgba(0,0,0,0.5);
            display:none;justify-content:center;
            align-items:center;z-index:9999;
        
        }
        .modal{
            background:#fff;
            padding:20px;
            border-radius:8px;
            max-width:400px;
            width:90%;
            box-shadow:0 6px 18px rgba(0,0,0,0.2);
            text-align:center;
        }

        .modal h3
        {
            margin:0 0 10px;
        }
        .modal button{
            margin-top:12px;
            padding:8px 16px;
        }

/* Responsive adjustments */

@media screen and (max-width: 800px){
    .logincontainer{
        max-width:80%;
        border:solid 1px rgba(0,0,0,0.2);
        height:350px;
        padding:25px;
        border-radius:15px;
    }
}