
:root {
    --bodyFont: "Rubik", sans-serif;;
    --headingFont: "Inter", sans-serif;;
    --body_font_size: 1.8rem;
    --body_line_height: 3.2rem;
    --body_font_color: #0e5265;
    --body_link_color: #ff0000;
    --body_link_hover_color: #000000;

    --image_border_radius: 0px;

    --primary: #102541;
    --primary_textcolor: #d8e5e8;
    --primary_headingcolor: #ffffff;
    --primary_linkcolor: #ffffff;

    --secondary: #e82f22;
    --secondary_textcolor: #ffffff;
    --secondary_headingcolor: #ffffff;
    --secondary_linkcolor: #ffffff;

    --default: #ecf3f1;
    --default_textcolor: #0e5265;
    --default_headingcolor: #0e5265;
    --default_linkcolor: #e6332a;
}
.background_primary {
    background: var(--primary);
    color: var(--primary_textcolor)!important;
    h1, h2, h3, h4, h5, h6 {
        color: var(--primary_headingcolor)!important;
    }
    a:not(.btn) {
        color: var(--primary_linkcolor);
        text-decoration: underline;
        &:hover,
        &:focus,
        &:active {
            text-decoration: none;
        }
    }
    .btn.btn-primary {
        background: #248acb;
    }
}
.background_secondary {
    background: var(--secondary);
    color: var(--secondary_textcolor)!important;
    h1, h2, h3, h4, h5, h6 {
        color: var(--secondary_headingcolor)!important;
    }
    a:not(.btn) {
        color: var(--secondary_linkcolor);
        text-decoration: underline;
        &:hover,
        &:focus,
        &:active {
            text-decoration: none;
        }
    }
    .btn.btn-secondary {
        filter: brightness(0.85);
    }
}
.background_default {
    background: var(--default);
    color: var(--default_textcolor);
    h1, h2, h3, h4, h5, h6 {
        color: var(--default_headingcolor);
    }
    a:not(.btn) {
        color: var(--default_linkcolor);
        text-decoration: underline;
        &:hover,
        &:focus,
        &:active {
            text-decoration: none;
        }
    }
    .btn.btn-default {
        filter: brightness(0.85);
    }
}
.background_ {
    h1, h2, h3, h4, h5, h6 {
        color: var(--primary);
    }
}
.background_white {
    background: #fff; color: var(--primary);
        h1, h2, h3, h4, h5, h6 { color: var(--primary) }
}
.background_black {
    background: #000; color: #fff;
}
                        .background_extra_1 {
        background: #2389ca;
        color: #ffffff;
        h1, h2, h3, h4, h5, h6 {
            color: #ffffff!important;
        }
        a:not(.btn) {
            color: #ffffff;
            text-decoration: underline;
            &:hover,
            &:focus,
            &:active {
                text-decoration: none;
            ;
            }
        }
    }
    