:root {
    --mellon-main-blue: rgb(75, 124, 149);
    --mellon-main-grey: rgb(81, 85, 83);
    --mellon-accent-blue: rgb(0, 74, 99);
    --mellon-accent-green: rgb(128, 161, 122);
    --mellon-accent-orange: rgb(163, 128, 16);
    --mellon-accent-yellow: rgb(227, 192, 0);
    --mellon-accent-red: rgb(204, 111, 44);
    --primary: var(--mellon-main-blue);
    --secondary: var(--mellon-main-grey);
    --success: var(--mellon-accent-green);
    --warning: var(--mellon-accent-orange);
    --danger: var(--mellon-accent-red);
    --bs-form-valid-color: var(--mellon-accent-green);
    --bs-form-valid-border-color: var(--mellon-accent-green);
    --bs-form-invalid-color: var(--mellon-accent-red);
    --bs-form-invalid-border-color: var(--mellon-accent-red);
    --bs-btn-bg: var(--mellon-main-blue);
}

.authWrapper {
    color: var(--mellon-main-grey);
}

.authWrapper .container-login-img {
    background-size: contain;
    height: 90vh;
    margin-top: 5vh;
}

.authWrapper .logoContainer .logo {
    width: auto;
    content: url('../images/mellon-login-logo.png');
}

.authWrapper .login-wrapper {
    box-shadow: -5px 0 15px rgba(81, 85, 83, 0.1);
}

.authWrapper .login-button {
    background-color: var(--mellon-main-grey);
    border-color: var(--mellon-main-grey);
}

.authWrapper .login-button:hover {
    background-color: var(--mellon-main-blue);
    border-color: var(--mellon-main-blue);
}

.form-control:focus {
    border-color: var(--mellon-main-blue);
    box-shadow: 0 0 0 0.2rem rgba(75, 124, 149, 0.25);
}

.loginBox h1 {
    color: var(--mellon-main-blue);
    text-align: center;
    margin-bottom: 12vh;
}

.loginBox a.linkButton {
    color: var(--mellon-main-blue)
}

.underlined {
    border-bottom: solid var(--mellon-main-blue);
}

.tabContainer .nav > li a.active {
    border-bottom: 2px solid var(--mellon-main-blue);
}

.btn-danger {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--mellon-accent-red);
    --bs-btn-border-color: var(--mellon-accent-red);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--mellon-accent-red);
    --bs-btn-hover-border-color: var(--mellon-accent-red);
    --bs-btn-focus-shadow-rgb: 225,83,97;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--mellon-accent-red);
    --bs-btn-active-border-color: var(--mellon-accent-red);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--mellon-accent-red);
    --bs-btn-disabled-border-color: var(--mellon-accent-red);
}

.btn-primary {
    --bs-btn-bg: var(--mellon-main-blue);
    --bs-btn-border-color: var(--mellon-main-blue);
    --bs-btn-hover-bg: var(--mellon-main-grey);
    --bs-btn-hover-border-color: var(--mellon-main-grey);
    --bs-btn-active-bg: var(--mellon-main-blue);
    --bs-btn-active-border-color: var(--mellon-main-blue);
}