/**
 *  Application custom styles
 */
:root{
    --blue-50: #EEF6FB;
    --blue-100: #D6EAF6;
    --blue-200: #ADD4ED;
    --blue-300: #84BEE4;
    --blue-400: #5BA8DB;
    --blue-500: #1779BA;
    --blue-600: #13679F;
    --blue-700: #0F5584;
    --blue-800: #063F7A;
    --blue-900: #07314E;

    --global-padding: 1rem;
    --global-margin: 1rem;

    --divider-border-color: #D5E0EC;
    --divider-border-style: solid;
    --divider-border-width: 1px;
    
    --button-white-color: var(--blue-800);
    --button-white-background-color: #FEFEFE;

    --banner-grid-color: var(--blue-800);
    --banner-grid-width: 90%;
    --banner-grid-padding: var(--global-padding);
    --banner-grid-margin: calc(2 * var(--global-margin)) auto 0;
    --banner-grid-border: 1.5px solid #D5E0EC;
    --banner-grid-box-shadow: 0 8px 20px rgba(0, 0, 0, 0.30);

    --banner-grid-card-padding: var(--global-padding);
    --banner-grid-card-margin: var(--global-margin);

    --banner-grid-card-icon-height: 3rem;
    --banner-grid-card-icon-margin: 0;

    --banner-grid-card-title-font-size: 1.1rem;
    --banner-grid-card-title-font-weight: bold;
    --banner-grid-card-title-padding: var(--global-padding);
    --banner-grid-card-title-margin: var(--global-margin);

    --banner-grid-card-content-font-size: 0.9rem;
    --banner-grid-card-content-margin: 0;

    --link-active-color: var(--blue-800);
    --link-active-background-color: transparent;

    --logo-height: 2.25rem;
    --logo-font-size: 1.75rem;
    --logo-font-weight: 700;
    --logo-font-color: var(--blue-800);
    
    --section-padding: var(--global-padding);
    --section-small-padding: calc(0.5 * var(--section-padding));
    --section-big-padding: calc(2 * var(--section-padding));
    --section-large-padding: calc(3 * var(--section-padding));
    

    --footer-color: var(--blue-800);
    --footer-padding: 1rem 0;
}

.button.white {
    color: var(--button-white-color);
    background-color: var(--button-white-background-color);
}

.divider {
    border-bottom: var(--divider-border-color) var(--divider-border-width) var(--divider-border-style);
}

.logo {
}

.logo .divider {
}

.logo-image {
    max-height: var(--logo-height);
    margin-right: 0.5rem;

}

.logo-title {
    color: var(--logo-font-color);
    font-size: var(--logo-font-size);
    font-weight: var(--logo-font-weight);
    text-transform: uppercase;
}

.logo-subtitle {
    color: var(--logo-font-color);
    font-size: calc(0.5 * var(--logo-font-size));
    font-weight: var(--logo-font-weight);
    text-transform: uppercase;
}

.menu .active a {
    color: var(--blue-600);
    background-color: transparent;
    border-bottom: 3px solid var(--blue-600);
}

header .top-line {
    padding-bottom: 0.25rem !important;
}

.main-menu--wrapper {
    background-color: var(--blue-50);
}
/** Baner Grid Start **/
.banner-grid {
    color: var(--banner-grid-color);
    width: var(--banner-grid-width);
    padding: var(--banner-grid-padding) 0;
    border-top: var(--banner-grid-border);
    margin: var(--banner-grid-margin);
    box-shadow: var(--banner-grid-box-shadow);
}

.banner-grid--card {
    padding: 0 var(--banner-grid-card-padding);
}

.banner-grid--card:not(:last-of-type) {
    margin-bottom: var(--banner-grid-card-margin);
}

.banner-grid--card .card-icon {
    height: var(--banner-grid-card-icon-height);
    margin-bottom: var(--banner-grid-card-icon-margin)
}

.banner-grid--card .card-title {
    font-size: var(--banner-grid-card-title-font-size);
    font-weight: var(--banner-grid-card-title-font-weight);
    padding: var(--banner-grid-card-title-padding) 0;
    margin-bottom: var(--banner-grid-card-title-margin);
    border-bottom: var(--banner-grid-border);
}

.banner-grid--card .card-content {
    font-size: var(--banner-grid-card-content-font-size);
    margin: var(--banner-grid-card-content-margin);
}

@media screen and (min-width: 640px) {
    .banner-grid--card:not(:last-of-type) {
        margin-bottom: 0;
        border-right: var(--banner-grid-border);
    }
}
/** Baner Grid End **/
/*Section START*/
.section {
    padding: var(--section-padding) 0;
}

.section.small {
    padding: var(--section-small-padding) 0;
}

.section.big {
    padding: var(--section-big-padding) 0;
}

.section.large {
    padding: var(--section-large-padding) 0;
}

.section .section-title {
    font-size: 1.25rem;
    font-weight: bold;
    color: var(--blue-500);
}

.section .subheader {
    font-size: 2.25rem;
    font-weight: bold;
    color: var(--blue-800);
}
/*Section END*/

/*Images START*/
img.cover,
.image.cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}
/*Images END*/

main {
    padding: calc(var(--global-padding) * 0.9) 0;
}

footer {
    padding: var(--footer-padding)
}

#footer-header--title {
    font-size: 1.25rem;
    font-weight: 700;
    text-transform: uppercase;
}

.footer-button {
    margin: 0;
}