/**
Fonts.
*/

/* default */
@font-face {
    font-display: swap;
    font-family: '_default';
    src: url('./font/SourceSansPro-Regular.woff2') format('woff2');
}

/* fancy */
@font-face {
    font-display: swap;
    font-family: '_fancy';
    src: url('./font/SourceSerifPro-SemiBold.woff2') format('woff2');
}

/**
Helpers.
*/

._font-fancy {
    font-family: '_fancy', serif;
}

._text-bg-banner {
    background-color: #103;
    color: white;
}

/**
Elements.
*/

/* disable bootstrap smooth scrolling to anchor - messes up going to anchor when page loading */
:root {
    scroll-behavior: auto;
}

body {
    font-family: '_default', arial, sans-serif;
}

a {
    transition: all 0.35s;
    color: #099;
}

a:hover {
    color: #b61;
}

h1 {
    color: #b61;
}

h2 {
    color: #b61;
    font-weight: 600;
}

h3 {
    color: #b61c;
    font-weight: 600;
}

h4,
h5,
h6 {
    font-weight: 600;
}

/* justify paragraphs and lists for large screens */
@media (width >= 992px) {
    li,
    p {
        text-align: justify;
    }
}

/**
Section colors.
*/

/* white text for dark backgrounds */
._color-dk {
    color: white;
}

/* add _color-# class to parent and _color-dk (dark), _color-md (medium), _color-lt (light) to children */

/* prettier-ignore */
._color-1 {
    ._color-dk { background-color: #477  ; }
    ._color-md { background-color: #4774; }
    ._color-lt { background-color: #4772; }
}

/* prettier-ignore */
._color-2 {
    ._color-dk { background-color: #b61  ; }
    ._color-md { background-color: #b614; }
    ._color-lt { background-color: #b612; }
}

/* prettier-ignore */
._color-3 {
    ._color-dk { background-color: #774  ; }
    ._color-md { background-color: #7744; }
    ._color-lt { background-color: #7742; }
}

/* prettier-ignore */
._color-4 {
    ._color-dk { background-color: #747  ; }
    ._color-md { background-color: #7474; }
    ._color-lt { background-color: #7472; }
}

/* prettier-ignore */
._color-5 {
    ._color-dk { background-color: #955  ; }
    ._color-md { background-color: #9554; }
    ._color-lt { background-color: #9552; }
}
