:root {
    --sal-primary: #005EB8;
    --sal-primary-20: #337ec6;
    --sal-primary-40: #669ED4;
    --sal-gray: #EFEFEF;
    --sal-gray-20: #BFBFBF;
    --sal-gray-40: #8F8F8F;
    --sal-gray-60: #606060;
    --clr-txt: #4A4A4A;
    --clr-txt-dark: #fff;
    --clr-txt-light: #585858;
    --clr-white: #ffffff;
    --sal-dark: #181818;
    --sal-light-dark: #3E3E3E;
}

@font-face {
    font-family: Gotham;
    src: url("../fonts/Gotham-Book.ttf")
}

@font-face {
    font-family: GothamBold;
    src: url("../fonts/Gotham-Bold.ttf")
}

@font-face {
    font-family: GothamMedium;
    src: url("../fonts/Gotham-Medium.ttf")
}

.sal-gray-bg {
    /*background-color: var(--sal-primary-20) !important;*/
}

h1, h2, h3, h4, h5, h6 {
    font-family: GothamMedium;
}

a {
    color: var(--sal-primary);
}

a:hover {
    color: var(--sal-primary-20);
}
html {
    font-size: 14px;
    background: url('../img/SalVault.png') no-repeat center center fixed;
    /*background-repeat: no-repeat;*/
    background-size: cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    height: 100%;
    padding: 0;
    margin: 0;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}


body {
    /*margin-bottom: 60px;*/
    background-color: unset;
    height: 100%;
    font-family: Gotham;
    color: var(--clr-txt);
}

.custom-card {
    margin: 0 auto;
    background-color: #fff;
    /*max-width: 28em !important;*/
    width: auto !important;
    height: auto !important;
    padding: 1.5em 2em;
    border-radius: 15px;
    border: none;
}

.login-card {
    max-width: 28em !important;
}

.verify-card {
    padding: 2.5em 2em;
}




main {
    margin: auto 0;
}

input[type=text],
input[type=password],
select {
    text-align: center;
    margin: 0.5em 0;
    width: 15em !important;
}

button {
    width: 15em !important;
    display: block;
    text-align: center;
}

.container {
    height: 100%;
}

.login-logo {
    width: 350px;
    margin-bottom: 1.5em
}

.menu-item-button-container {
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0.5em 0;
    text-decoration: none;
}

.menu-container-card {
    min-width: 35em;
    max-width: 50em;
}

.menu-item-icon {
    font-size: 3.5rem !important;
}

.menu-item-text {
    font-size: 1.5rem;
    font-family: GothamMedium;
    color: var(--clr-txt);
    margin-top: 0.5rem;
    text-align: center;
}

.wip::after {
    content: '(Coming Soon)';
    font-size: 0.65em;
    pointer-events: none;
    white-space: pre;
}

.link-disabled {
    pointer-events: none;
    color: var(--sal-gray-20) !important;
}

.link {
    text-decoration: none;
}