body {
font-family : Arial, sans-serif;
background-color : #f0f0f0;
margin : 0;
padding : 0;
display : flex;
justify-content : center;
align-items : center;
height : 100vh;
}
.login-container {
background-color : #fff;
border-radius : 8px;
box-shadow : 0 0 10px 0 rgb(0, 0, 0, 0.1);
padding : 20px;
width : 300px;
text-align : center;
}
.login-container h2 {
margin-top : 0;
color : #333;
}
.login-container input[type="text"], .login-container input[type="password"] {
width : calc(100% - 40px);
padding : 10px;
margin : 10px 0;
border : #ccc solid 1px;
border-radius : 4px;
box-sizing : border-box;
}
.login-container input[type="submit"] {
width : 100%;
background-color : #34568B;
color : #fff;
border : none;
padding : 10px;
border-radius : 4px;
cursor : pointer;
font-size : 16px;
}
.login-container input[type="submit"]:hover {
background-color : #1B2C51;
}
.login-container .links {
margin-top : 10px;
text-align : center;
}
.login-container .links a {
color : #666;
text-decoration : none;
margin : 0 10px;
}
.login-container .links a:hover {
color : #333;
}
.error-message {
color : red;
margin-top : 10px;
}