:root {
    --app-color-primary: #183F6B;
    --app-color-primary-opaque: #183F6B40;
    --app-color-success: #198754;
    --app-color-success-opaque: #19875440;
    --app-gutter: 1.25rem;
    --app-gutter-sm: calc(var(--app-gutter) * 0.5);
}

body, p, span, a, h1, h2, h3, h4, h5, h6 {
    font-family: "lato", sans-serif;
    font-weight: 400;
    font-style: normal;
}

h1, .h1 {
    font-size: calc(2.35rem + 0.25vw);
}
h2, .h2 {
    font-size: calc(1.85rem + 0.25vw);
}
h3, .h3 {
    font-size: calc(1.60rem + 0.25vw);
}
h4, .h4 {
    font-size: calc(1.35rem + 0.25vw);
}
h5, .h5 {
    font-size: calc(1.10rem + 0.25vw);
}
h6, .h6, p, a, li {
    font-size: calc(1.00rem + 0.25vw);
}
@media(min-width: 1200px) {
    h1, .h1 {
        font-size: 2.50rem;
    }
    h2, .h2 {
        font-size: 2.00rem;
    }
    h3, .h3 {
        font-size: 1.75rem;
    }
    h4, .h4 {
        font-size: 1.50rem;
    }
    h5, .h5 {
        font-size: 1.25rem;
    }
    h6, .h6, p, a, li {
        font-size: 1.15rem;
    }
}


h1, h3, h4, h5, .title {
    font-weight: 700;
}
.title {
    margin-bottom: 1rem;
}

.notice-text {
    font-size: 90%;
}
h1 .notice-text,
h2 .notice-text,
h3 .notice-text,
h4 .notice-text,
h5 .notice-text,
h6 .notice-text {
    font-size: 80%;
}

.has-error input {
    border-color: var(--bs-red);
}
.has-error .notice-text {
    color: var(--bs-red);
}
.has-error .notice-text:not(first-child) {
    margin-top: var(--app-gutter-sm);
}
.has-error .notice-text:last-child {
    margin-bottom: 0px;
}


.content-pad {
    padding-top: 5rem;
    padding-bottom: 5rem;
}
.content-pad-sm {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}

.bg-primary {
    background-color: var(--app-color-primary) !important;
}
.color-primary {
    color: var(--app-color-primary) !important;
}


.bg-primary p,
.bg-primary h1,
.bg-primary h2,
.bg-primary h3,
.bg-primary h4,
.bg-primary h5,
.bg-primary h6,
.bg-primary i {
    color: #ffffff;
}


i.icon-lg {
    font-size: 3rem;
}




/* ==================================================================================== */
/* BUTTONS ============================================================================ */

.btn {
    --bs-btn-padding-x: 1.25rem;
    --bs-btn-padding-y: 0.65rem;
    --bs-btn-font-size: 1.15rem;
    --bs-btn-font-weight: 400;
    --bs-btn-line-height: 1.2;
    --btn-indent: 0.5rem;
    --btn-padding-left: calc(var(--bs-btn-padding-x) - var(--btn-indent));

    display: -moz-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -moz-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -moz-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    padding-left: var(--btn-padding-left);
    padding-bottom: calc(var(--bs-btn-padding-y) + 0px);
    text-indent: var(--btn-indent);
    border-radius: 2rem;
}
.btn.btn-lg {
    --bs-btn-font-size: 1.5rem;
    --bs-btn-font-weight: 700;
    padding-bottom: calc(var(--bs-btn-padding-y) + 3px);
}
.btn.btn-sm {
    --bs-btn-font-size: 1rem;
    --bs-btn-padding-x: 1rem;
    --bs-btn-padding-y: 0.5rem;
    --btn-indent: 0.25rem;
}
.btn > i {
    margin-left: var(--btn-indent);
    text-indent: 0px;
}

.select-buttons {
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: calc(var(--app-gutter-sm) * -1);
    margin-left: calc(var(--app-gutter-sm) * -1);
}
.select-buttons .btn {
    width: calc(50% - var(--app-gutter-sm));
    margin-top: var(--app-gutter-sm);
    margin-left: var(--app-gutter-sm);
}

.select-buttons .btn.btn-default {
    --bs-btn-color: var(--bs-gray-800);
    --bs-btn-bg: var(--bs-gray-200);
    --bs-btn-border-color: var(--bs-gray-200);
    --bs-btn-hover-color: var(--bs-gray-800);
    --bs-btn-hover-bg: var(--bs-gray-400);
    --bs-btn-hover-border-color: var(--bs-gray-400);
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: #ffffff;
    --bs-btn-active-bg: var(--bs-gray-600);
    --bs-btn-active-border-color: var(--bs-gray-600);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #ffffff;
    --bs-btn-disabled-bg: var(--bs-gray-200);
    --bs-btn-disabled-border-color: var(--bs-gray-200);
}
.btn.btn-primary {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: var(--app-color-primary);
    --bs-btn-border-color: var(--app-color-primary);
    --bs-btn-hover-color: var(--app-color-primary);
    --bs-btn-hover-bg: #ffffff;
    --bs-btn-hover-border-color: var(--app-color-primary);
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: var(--app-color-primary);
    --bs-btn-active-bg: #ffffff;
    --bs-btn-active-border-color: var(--app-color-primary);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #ffffff;
    --bs-btn-disabled-bg: var(--app-color-primary);
    --bs-btn-disabled-border-color: var(--app-color-primary);
}
.btn.btn-success {
    --bs-btn-color: #ffffff;
    --bs-btn-bg: var(--app-color-success);
    --bs-btn-border-color: var(--app-color-success);
    --bs-btn-hover-color: var(--app-color-success);
    --bs-btn-hover-bg: #ffffff;
    --bs-btn-hover-border-color: var(--app-color-success);
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: var(--app-color-success);
    --bs-btn-active-bg: #ffffff;
    --bs-btn-active-border-color: var(--app-color-success);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #ffffff;
    --bs-btn-disabled-bg: var(--app-color-success);
    --bs-btn-disabled-border-color: var(--app-color-success);
}

/* ==================================================================================== */
/* PROGRESS =========================================================================== */

.progress, .progress-stacked {
    --bs-progress-bg: var(--app-color-primary-opaque);
    --bs-progress-bar-bg: var(--app-color-primary);
    --bs-progress-height: 0.5rem;
}













#app-navigation .navbar-brand img {
    width: auto;
    height: 50px;
}
@media(min-width: 768px) {
    #app-navigation .navbar-brand img {
        height: 60px;
    }
}
@media(min-width: 992px) {
    #app-navigation .navbar-brand img {
        height: 70px;
    }
}


#app-hero {
    height: 100%;
    width: 100%;
}

#app-hero .banner-split {
    position: relative;
    height: 50%;
    /* box-shadow: inset 0px 0px 50% 0px rgba(0, 0, 0, 1); */
    background-image: url(/img/background/AdobeStock_678063168_Expanded.jpg);
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position-x: center;
    background-position-y: 0px;
}
#app-hero .banner-split::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.75) 0%, transparent);
}




.banner-parallax {
    width: 100%;
    height: 100%;
    background-image: url(/img/background/AdobeStock_678063168_Expanded.jpg);
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-x: center;
    background-position-y: center;
}

#app-hero .banner-parallax {
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -moz-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -moz-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    height: 75%;
    background-size: cover;
    background-position-x: 60%;
    background-position-y: 0%;
    box-shadow: inset 0px -200px 150px 0px rgba(0, 0, 0, 0.5);
}
@media(min-width: 1200px) {
    #app-hero .banner-parallax {
        background-size: 150% auto;
        background-position-x: 60%;
        background-position-y: -15%;
    }
}
@media(min-width: 1400px) {
    #app-hero .banner-parallax {
        background-size: 125% auto;
        background-position-x: 60%;
        background-position-y: 0%;
    }
}
@media(min-width: 1600px) {
    #app-hero .banner-parallax {
        background-size: 100% auto;
        background-position-x: 60%;
        background-position-y: -25%;
    }
}
#app-hero .banner-parallax .banner-title,
#app-hero .banner-parallax .banner-subtitle {
    text-shadow: 1px 1px 2px black;
}
#app-hero .banner-form {
    position: relative;
    top: -20%;
}


#app-hero .card .card-body {
    padding: 2rem;
}


.banner-parallax .banner-title {
    color: #ffffff;
    font-size: 3.5rem;
}
.banner-parallax .banner-subtitle {
    color: #ffffff;
    font-size: 3rem;
}



.form-wrapper {
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -moz-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -moz-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    height: auto;
    margin-top: calc(var(--app-gutter-sm) * -1);
}
.form-wrapper > * {
    -moz-box-flex: 0 0 0%;
    -webkit-box-flex: 0 0 0%;
    -webkit-flex: 0 0 0%;
    -ms-flex: 0 0 0%;
    flex: 0 0 0%;
    width: 100%;
    margin-top: var(--app-gutter-sm);
}
.form-wrapper .form-viewport {
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -moz-box-flex: 1 0 auto;
    -webkit-box-flex: 1 0 auto;
    -webkit-flex: 1 0 auto;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    position: relative;
    overflow: hidden;
}
.form-wrapper .form-viewport .form-item {
    position: relative;
    width: 100%;
    -moz-box-flex: 1 0 auto;
    -webkit-box-flex: 1 0 auto;
    -webkit-flex: 1 0 auto;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
}
.form-wrapper .form-viewport .form-response {
    position: relative;
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -moz-box-pack: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -moz-box-align: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    -moz-box-flex: 1 0 auto;
    -webkit-box-flex: 1 0 auto;
    -webkit-flex: 1 0 auto;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    text-align: center;
}
.form-wrapper .form-viewport .form-item .form-title {
    margin-bottom: var(--app-gutter-sm);
}
.form-wrapper .form-viewport .form-item .input-group .input-group-text,
.form-wrapper .form-viewport .form-item .form-control {
    font-size: 1.25rem;
}

.input-group .datepicker .input-group-text {
    cursor: pointer;
}
.form-wrapper .form-viewport .form-item :not(.input-group) .datepicker {
    width: 100%;
}
.input-group > .datepicker:not(:first-child) > .input-group-text {
    border-top-left-radius: inherit;
    border-bottom-left-radius: inherit;
}
.input-group > .datepicker:first-child > .input-group-text {
    border-top-right-radius: inherit;
    border-bottom-right-radius: inherit;
}

.form-wrapper .form-viewport .form-item .datepicker__wrapper {
    position: fixed !important;
    top: inherit !important;
    left: inherit !important;
}
.form-wrapper .form-viewport .form-item .datepicker .datepicker__title select option:disabled {
    display: none;
}



#accordion-faq.accordion {
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
#accordion-faq.accordion .accordion-item {
    width: 50%;
    height: auto;
}

.accordion-header .accordion-button {
    font-size: inherit;
}


.cta-banner {
    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -moz-box-pack: justify;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -moz-box-align: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 2rem 2.5rem;
    border-radius: 5rem;
    background-color: var(--bs-gray-200);
}
.cta-banner > *:not(.btn) {
    color: var(--app-color-primary);
}



#app-footer {
    border-top: 2px solid var(--app-color-primary);
}
#app-footer .corporate-logo {
    width: auto;
    height: auto;
    max-height: 100px;
    min-height: 80px;
    margin-bottom: 2rem;
}




.card {
    --bs-card-spacer-x: 2rem;
    --bs-card-spacer-y: 2rem;
}
.card.card-primary {
    --bs-card-color: #ffffff;
    background-color: var(--app-color-primary);
}

.card hr {
    margin: 1.5rem 0rem;
}

.modal .card {
    --bs-card-border-width: 0px;
    --bs-card-spacer-x: 1.00rem;
    --bs-card-spacer-y: 1.00rem;
}

#loanSearchCard.card {
    box-shadow: 0px 0px 30px 2px rgba(0, 0, 0, 0.25);
}
.modal #loanSearchCard.card {
    box-shadow: none;
}



.collapse-wrapper {
    --collapse-item-padding: var(--app-gutter-sm);
    --collapse-item-gutter: var(--app-gutter-sm);
    --collapse-item-heading-color: var(--app-color-primary);
    --collapse-item-body-color: #000000;
    --collapse-item-bg-color: #ffffff;
    --collapse-item-border-color: var(--bs-gray-200);

    display: -moz-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: calc(var(--collapse-item-gutter) * -1);
    margin-right: calc(var(--collapse-item-gutter) * -1);
}
.collapse-wrapper .collapse-col {
    -moz-box-flex: 0 0 100%;
    -webkit-box-flex: 0 0 100%;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    margin-top: calc(var(--collapse-item-gutter) * -1);
    margin-left: var(--collapse-item-gutter);
    margin-right: var(--collapse-item-gutter);
}
@media(min-width: 992px) {
    .collapse-wrapper .collapse-col {
        -moz-box-flex: 1 0 100%;
        -webkit-box-flex: 1 0 100%;
        -webkit-flex: 1 0 100%;
        -ms-flex: 1 0 100%;
        flex: 1 0 0%;
    }
}
.collapse-wrapper .collapse-col .collapse-item {
    margin-top: var(--collapse-item-gutter);
    border: 1px solid var(--collapse-item-border-color);
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.125);
}
.collapse-wrapper .collapse-col .collapse-item .collapse-header {
    margin-bottom: 0px;
}
.collapse-wrapper .collapse-col .collapse-item .collapse-header .collapse-button {
    position: relative;
    color: var(--collapse-item-heading-color);
    padding: var(--collapse-item-padding);
    padding-right: calc(var(--collapse-item-padding) * 4);
    background-color: var(--collapse-item-bg-color);
    border: none;
    width: 100%;
    text-align: left;
    transition: all 0.35s ease;
}
.collapse-wrapper .collapse-col .collapse-item .collapse-header .collapse-button::before {
    position: absolute;
    font-family: "bootstrap-icons";
    content: "\f235";
    color: inherit;
    right: var(--collapse-item-padding);
}
.collapse-wrapper .collapse-col .collapse-item .collapse-header .collapse-button.collapsed::before {
    rotate: 180deg;
}
.collapse-wrapper .collapse-col .collapse-item .collapse-body {
    color: var(--collapse-item-body-color);
    padding: var(--collapse-item-padding);
    background-color: var(--collapse-item-bg-color);
    border: none;
}





.color-primary {
    color: var(--app-color-primary) !important;
}
.color-success {
    color: var(--app-color-success) !important;
}