@charset "UTF-8";

/* EconChallenge palette from the Econ home and interior design reference. */
:root {
    --challenge-sky: #e8eeab;
    --challenge-blue: #f36c42;
    --challenge-green: #f36c42;
    --challenge-green-bright: #e83a25;
}

/* Home page */
.home-page {
    background-color: var(--challenge-sky);
}

.home-page .page-body {
    background: linear-gradient(to right, rgba(232, 238, 171, 1) 45%, rgba(232, 238, 171, 0) 100%);
}

.home-page .card1 {
    background-color: var(--challenge-blue);
}

.home-page.econ-challenge #US_map [role="link"] {
    fill: var(--challenge-blue);
}

.home-page.econ-challenge #US_map [role="link"]:hover,
.home-page.econ-challenge #US_map [role="link"]:focus {
    fill: var(--challenge-green-bright);
}

.home-page .green-arrow-right,
.home-page .go-button-arrow {
    border-color: var(--challenge-blue) var(--challenge-blue) transparent transparent;
}

.home-page .hover-underline-animation::after {
    background-color: var(--challenge-blue);
}

.home-page .footer-main h2 {
    color: var(--challenge-blue);
}

/* Interior pages */
.interior-page {
    background-color: var(--challenge-sky);
}

.interior-page .header {
    background: linear-gradient(-90deg, rgba(232, 238, 171, 0) 0%, rgba(232, 238, 171, 1) 60%);
}

.interior-page .org-buttons {
    border-bottom-color: var(--challenge-blue);
}

.interior-page h2,
.interior-page h4,
.interior-page .h4,
.interior-page h5,
.interior-page .h5,
.interior-page h6,
.interior-page .h6,
.interior-page #mainContentHolder ul li strong {
    color: #D43D0C;
}

.interior-page .main-button-solidgreen {
    background-color: var(--challenge-blue);
}

.interior-page .main-button-outlinegreen {
    border-color: var(--challenge-blue);
}

.interior-page .blue-arrow-right,
.interior-page .green-arrow-right {
    border-color: var(--challenge-blue) var(--challenge-blue) transparent transparent;
}

.interior-page .stacked-navigation {
    background-color: var(--challenge-sky);
}

.interior-page .footer-main h2,
.interior-page .footer-main h3 {
    color: var(--challenge-blue);
}

.interior-page .hover-underline-animation::after {
    background-color: var(--challenge-blue);
}