*{
box-sizing:border-box;
margin:0;
padding:0;
}
h3{
    color:rgb(106, 106, 219);
    font-size:10px;
    text-align:right;
}
body{

font-family:Arial, sans-serif;

background:#f2f2f2;

min-height:100vh;

display:flex;

justify-content:center;

align-items:center;

padding:20px;

}



/* Login container */

.login-box{

width:100%;

max-width:400px;

background:white;

padding:30px;

border-radius:10px;

box-shadow:0 6px 20px rgba(0,0,0,0.15);

}



/* Heading */

.login-box h2{

text-align:center;

margin-bottom:20px;

color:#333;

}



/* Labels */

.login-box label{

display:block;

font-weight:bold;

margin-top:10px;

margin-bottom:5px;

}



/* Input fields */

.login-box input{

width:100%;

padding:10px;

border:1px solid #ccc;

border-radius:6px;

font-size:14px;

margin-bottom:12px;

}



/* Input focus */

.login-box input:focus{

border-color:#4CAF50;

outline:none;

}



/* Button */

.login-box button{

width:100%;

padding:10px;

background:#4CAF50;

color:white;

border:none;

border-radius:6px;

font-size:16px;

cursor:pointer;

margin-top:5px;

}



/* Button hover */

.login-box button:hover{

background:#45a049;

}



/* Link section */

.or{

text-align:center;

margin-top:15px;

font-size:14px;

}



/* Link style */

.or a{

color:#4CAF50;

text-decoration:none;

}



.or a:hover{

text-decoration:underline;

}



/* Required star */

.required{

color:red;

font-weight:bold;

}



/* Mobile responsive */

@media (max-width:600px){

.login-box{

padding:20px;

}

.login-box h2{

font-size:22px;

}

}