:root{
    --background-primary: #2A3F54;
    --spacer: 25px;
}

h1,
h2,
h3,
h4,
.bold {
    color: var(--background-primary);
}

.title-header-login{
    font-size: 18px !important;
    font-family: 'Roboto', sans-serif;
    padding: 2%;
}

.header-box-login{
    text-align:left; 
    background-color: #173E56 !important; 
    height: 55px; 
    max-height: 55px;   
}

.button-options{
    float: right !important; 
    border-radius: 20px; 
    border: 1px solid;
    margin-bottom:3%;
}

.card {
    margin: 0;
    width: 100%;
    display: inline-block;
    background-color: #fff;
    border-radius: 4px;
}

.card-header {
    width: 100%;
    padding: 4px 10px;
    border-radius: 0px 0px 4px 4px;
}

.card-shadow {
    box-shadow: 5px 10px 8px 10px #CFD2CF;
}

.card-shadow-hover:hover {
    transition: 0.5s ease-in-out;
    box-shadow: 5px 10px 8px 10px #CFD2CF;
}

.card-border {
    border: 1px solid #CFD2CF;
}

.card-body {
    clear: both;
    padding: 15px;
}

.card-footer {
    border-top: 1px solid #CFD2CF;
    padding: 10px 10px;
}

.mt-0 {
    margin-top: 0;
}

.mt-1 {
    margin-top: calc(var(--spacer) * 0.25)
}

.mt-2 {
    margin-top: calc(var(--spacer) * 0.5)
}

.mt-3 {
    margin-top: var(--spacer)
}

.mt-4 {
    margin-top: calc(var(--spacer) * 1.5)
}

.mt-5 {
    margin-top: calc(var(--spacer) * 3)
}

.mt-auto {
    margin-top: auto;
}

.mb-0 {
    margin-top: 0;
}

.mb-1 {
    margin-bottom: calc(var(--spacer) * 0.25)
}

.mb-2 {
    margin-bottom: calc(var(--spacer) * 0.5)
}

.mb-3 {
    margin-bottom: var(--spacer)
}

.mb-4 {
    margin-bottom: calc(var(--spacer) * 1.5)
}

.mb-5 {
    margin-bottom: calc(var(--spacer) * 3)
}

.mb-auto {
    margin-bottom: auto;
}

.ml-0 {
    margin-top: 0;
}

.ml-1 {
    margin-left: calc(var(--spacer) * 0.25)
}

.ml-2 {
    margin-left: calc(var(--spacer) * 0.5)
}

.ml-3 {
    margin-left: var(--spacer)
}

.ml-4 {
    margin-left: calc(var(--spacer) * 1.5)
}

.ml-5 {
    margin-left: calc(var(--spacer) * 3)
}

.ml-auto {
    margin-left: auto;
}

.mr-0 {
    margin-right: 0;
}

.mr-1 {
    margin-right: calc(var(--spacer) * 0.25)
}

.mr-2 {
    margin-right: calc(var(--spacer) * 0.5)
}

.mr-3 {
    margin-right: var(--spacer)
}

.mr-4 {
    margin-right: calc(var(--spacer) * 1.5)
}

.mr-5 {
    margin-right: calc(var(--spacer) * 3)
}

.mr-auto {
    margin-right: auto;
}

.btn-sfc{
    background: var(--background-primary);
    color: #fff;
}

.btn-sfc:hover{
    color: #fff !important;
}

.btn-sfc:focus{
    color:#fff;
}
