:root {
    /* Branding definitions */
    --primary-color: #0066cf;
    --primary-color-active: #023e7c;
    --primary-color-text: white;
    --secondary-color: #ff0033;
    --secondary-color-active: #b20024;
    --secondary-color-text: white;

    /* Standard buttons */
    --override-primary-button-background-color: var(--primary-color);
    --override-primary-button-text-color: var(--primary-color-text);
    --override-primary-button-active-background-color: var(--primary-color-active);
    --override-primary-button-active-text-color: var(--primary-color-text);
    /* Secondary buttons */
    --override-secondary-button-background-color: var(--secondary-color);
    --override-secondary-button-text-color: var(--secondary-color-text);
    --override-secondary-button-active-background-color: var(--secondary-color-active);
    --override-secondary-button-active-text-color: var(--secondary-color-text);
    /* Links */
    --override-link-color: var(--primary-color);
    --override-link-active-color: var(--primary-color-active);

    /* Banner styling */
    --override-banner-primary-color: var(--primary-color-active);
    --override-banner-primary-color-accent: var(--primary-color);

    --override-banner-icon-color: var(--primary-color);
    --override-banner-icon-background: #cee4ff;

    --override-banner-icon-secondary-color: var(--secondary-color);
    --override-banner-icon-secondary-background: #ffdee4;

    --override-insyteful-wave-accent: #ff0033;
    --override-insyteful-wave-start: #133f6d;
    --override-insyteful-wave-end: #0066cf;

    /* Leave unmodified to match global buttons and link colors. */
    --override-banner-button-text-color: var(--override-primary-button-text-color);
    --override-banner-button-background-color: var(--override-primary-button-background-color);
    --override-banner-button-active-text-color: var(--override-primary-button-active-text-color);
    --override-banner-button-active-background-color: var(--override-primary-button-active-background-color);

    --override-banner-link-color: var(--override-banner-primary-color-accent);
    --override-banner-link-active-color: var(--override-banner-primary-color);
}

body.login .loginBox {
    border-top-color: var(--primary-color);
}

a, .accordion-title, .tabs-title:not(.is-active) > a:hover {
    color: var(--override-link-color);
}

a:hover {
    color: var(--override-link-active-color);
}

.button {
    background: var(--override-primary-button-background-color);
    color: var(--override-primary-button-text-color);
}

.button.hollow, .button.hollow.disabled, .button.hollow.disabled:focus, .button.hollow.disabled:hover, .button.hollow[disabled], .button.hollow[disabled]:focus, .button.hollow[disabled]:hover {
    border-color: var(--override-primary-button-background-color);
    color: var(--override-primary-button-background-color);
}

.button.hollow:focus, .button.hollow:hover {
    border-color: var(--override-primary-button-active-background-color);
    color: var(--override-primary-button-active-background-color);
}

.button:hover {
    background: var(--override-primary-button-active-background-color);
    color: var(--override-primary-button-active-text-color);
}

.button.secondary {
    background: var(--override-secondary-button-background-color);
    color: var(--override-secondary-button-text-color);
}

.button.secondary:hover {
    background: var(--override-secondary-button-active-background-color);
    color: var(--override-secondary-button-active-text-color);
}

.searchbar .accordion-title {
    background: var(--primary-color);
}

.homeCategories .categoryIcons .category:hover,
.top-bar .dropdown.menu > li.is-active > a, .top-bar a:hover {
    color: var(--override-link-color);
}