:root {
    /* https://stackoverflow.com/a/55267265 */
    /*     hex value for reference */
    /* --primary: #AF272F;
    --secondary: #002147;
    --highlight: #D22630; */

    /* we split in hsl so that we can calc */
    --pri-h: 356;
    --pri-s: 64%;
    --pri-l: 42%;
    --pri-hsl: var(--pri-h),var(--pri-s),var(--pri-l);
    --primary:  hsl(var(--pri-hsl));
    --primary-light: hsl(var(--pri-h),var(--pri-s), calc(var(--pri-l) / .9));
    --primary-dark: hsl(var(--pri-h),var(--pri-s), calc(var(--pri-l) * .9));

    --sec-h: 212;
    --sec-s: 100%;
    --sec-l: 14%;
    --sec-hsl: var(--sec-h),var(--sec-s),var(--sec-l);
    --secondary:  hsl(var(--sec-hsl));
    --secondary-light: hsl(var(--sec-h),var(--sec-s), calc(var(--sec-l) / .9));
    --secondary-dark: hsl(var(--sec-h),var(--sec-s), calc(var(--sec-l) * .9));

    --hil-h: 357;
    --hil-s: 69%;
    --hil-l: 49%;
    --hil-hsl: var(--hil-h),var(--hil-s),var(--hil-l);
    --highlight:  hsl(var(--hil-hsl));
    --highlight-light: hsl(var(--hil-h),var(--hil-s), calc(var(--hil-l) / .9));
    --highlight-dark: hsl(var(--hil-h),var(--hil-s), calc(var(--hil-l) * .9));
}


.h1, .usercontent h1, .mce-content-body h1,
.h2, .usercontent h2, .mce-content-body h2,
.h3, .usercontent h3, .mce-content-body h3,
.tabblocks-title, .casestudyslider-title, .imageblock-title, .videoblock-title, .imagegallery-title, .imagetextblock-title, .linkblocks-title, .resourcesblock-title, .projectshowcase-title, .faqmodule-title, .linkblock.__flex .linkblock-title, .linkblock-imgwrap
{
    color: var(--primary);
}

.teamlink-title,
.whitebanner-subtitle,
.h4, .usercontent h4, .mce-content-body h4 {
    color: var(--primary-dark);
}


@media (min-width: 992px)
{
    .nav ul > li.menu-item a::before {
        background: var(--highlight);
    }
}


.button.__ghost, .submit_wrap button.__ghost, .form-submit button.__ghost, .__ghost.sliderbutton {

    color: var(--highlight);
    border-color: var(--highlight);
}

.button.__ghost:hover, .submit_wrap button.__ghost:hover, .form-submit button.__ghost:hover, .__ghost.sliderbutton:hover, .button.__ghost:focus, .submit_wrap button.__ghost:focus, .form-submit button.__ghost:focus, .__ghost.sliderbutton:focus, .linkblock-imgwrap::before {
    background-color: var(--highlight);
}