.error-message {
    color: red;
    max-width: 350px;
    font-weight: normal !important;
}

.login {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    font-family: monospace;
    font-size: large;
    font-weight: bold;
}

.login-buttons {
    display: flex;
    justify-content: flex-end;
    width: 100%;
}

.login-card {
    background-color: #D0D2EA;
    width: 450px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border-radius: 20px;
    height: 500px;
    border: 2px solid #254084;
}

.form-input {
    width: 350px;
    height: 28px;
    font-size: large;
    font-family: monospace;
    border-radius: 5px;
    border: 2px solid #0457AA;
    outline: none;
    background-color: #d2e6fb;
}

.form-input:focus {
    outline: 1px solid darkgray;
}

.form-input-error {
    border-color: red;
}

.form-input-error:focus {
    outline-color: red;
}

.login-logo {
    width: 100%;
    position: absolute;
    top: 10%;
}

.logo-div {
    position: relative;
    width: 250px;
    height: 200px;
}