input,
select {
    border: 2px solid #333;
    background-color: transparent;
    padding: 10px 15px;
    font-size: 16px;
    border-radius: 25px;
    outline: none;
    color: #333;
}

#loginForm {
    margin-top: 25px;
}

#username {
    margin-bottom: 18px;
}

#password,
#newPassword,
#confirmPassword {
    display: block;
    margin-bottom: 10px;
}

#forgotUsername,
#forgotPassword,
#resetPasswordForm,
#twoFactorAuthForm,
#appTwoFactorAuthForm {
    display: none;
}

#forgotUsernameLink {
    display: block;
    font-size: 0.8em;
    cursor: pointer;
}

#forgotPasswordLink {
    font-size: 0.8em;
    cursor: pointer;
}

#resetEmail,
#resetUsername {
    display: block;
    margin-bottom: 10px;
}

.label-margin2 {
    display: block;
    margin-top: 20px;
    margin-bottom: 8px;
}

.backbutton {
    display: block;
    margin-top: 30px;
    margin-bottom: 30px;
}

#twoFactorCode {
    display: block;
    margin-top: 10px;
}

#messageBox,
#appMessageBox {
    color: red;
    margin-top: 10px;
}

#submitButton,
#verifybutton,
#verifyButton,
#confirmation,
#requestButton,
#resetPasswordButton,
#verifyAppTwoFactorCodeButton {
    display: block;
    border: none;
    background-color: #0b0b0b9a;
    color: white;
    padding: 10px 20px;
    margin-top: 20px;
    margin-bottom: 30px;
    font-size: 16px;
    border-radius: 10px;
    cursor: pointer;
}

#confirmation {
    margin-top: 30px;
}

#submitButton:hover,
#verifybutton:hover,
#verifyButton:hover,
#confirmation:hover,
#requestButton:hover,
#resetPasswordButton:hover,
#verifyAppTwoFactorCodeButton:hover {
    background-color: #4b4a4a;
}

#verifyButton {
    margin-top: 30px;
    margin-bottom: 20px;
}

#requestButton {
    margin-top: 30px;
    margin-bottom: 50px;
    font-size: 14px;
}

#registrationButton {
    display: block;
    margin-top: 30px;
    margin-bottom: 30px;
}

@media (max-width: 768px) {

    .header-image {
        width: 100%;
        height: 250px;
        background-size: cover;
        background-position: center;
    }
}