:root {
    /* --- colors --- */
    /* brand */
    --brand-blue: #5F82FF;
    --brand-purple: #130E54;
    --brand-violet: #D58DF1;
    --brand-yellow: #FED353;
    --brand-orange: #F55C1E;
    --brand-green: #00DE87;

    /* functional */
    --danger-red: #FF0000;
    --form-selects: #0088FF;

    /* mono / greys */
    --white: #FFFFFF;
    --light-grey: #F6F9FC;
    --mid-grey: #D8D8D8;
    --dark-grey: #999999;
    --text-black: #2A2A2A;
    --black: #000000;
}

/* Brand */
.brand-blue {
    color: var(--brand-blue);
}
.brand-blue_background {
    background-color: var(--brand-blue);
}
.brand-purple {
    color: var(--brand-purple);
}
.brand-purple_background {
    background-color: var(--brand-purple);
}
.brand-violet {
    color: var(--brand-violet);
}
.brand-violet_background {
    background-color: var(--brand-violet);
}
.brand-yellow {
    color: var(--brand-yellow);
}
.brand-yellow_background {
    background-color: var(--brand-yellow);
}
.brand-orange {
    color: var(--brand-orange);
}
.brand-orange_background {
    background-color: var(--brand-orange);
}
.brand-green {
    color: var(--brand-green);
}
.brand-green_background {
    background-color: var(--brand-green);
}



/* Functional */
.danger-red {
    color: var(--danger-red);
}
.danger-red_background {
    background-color: var(--danger-red);
}



/* Monotones */
.white {
    color: var(--white);
}
.white_background {
    background-color: var(--white);
}
.light-grey {
    color: var(--light-grey);
}
.light-grey_background {
    background-color: var(--light-grey);
}
.mid-grey {
    color: var(--mid-grey);
}
.mid-grey_background {
    background-color: var(--mid-grey);
}
.dark-grey {
    color: var(--dark-grey);
}
.dark-grey_background {
    background-color: var(--dark-grey);
}
.text-black {
    color: var(--black);
}
.text-black_background {
    background-color: var(--black);
}
.black {
    color: var(--black);
}
.black_background {
    background-color: var(--black);
}



/* Color Overrides */
.brand-blue_background h1,
.brand-blue_background h2,
.brand-blue_background h3,
.brand-blue_background h4,
.brand-blue_background h5,
.brand-blue_background h6,
.brand-blue_background .h1style,
.brand-blue_background .h2style,
.brand-blue_background .h3style,
.brand-blue_background .h4style,
.brand-blue_background .h5style,
.brand-blue_background .h6style,
.brand-blue_background ul li,
.brand-blue_background ul li a {
    color: var(--white);
}
.brand-blue_background p {
    color: var(--white);
}
.brand-blue_background a.button.tab,
.brand-blue_background button.tab,
.brand-blue_background .wpcf7 button[type="submit"].tab,
.brand-blue_background .wpcf7 input[type="submit"].tab {
    color: var(--white);
}
.brand-purple_background h1,
.brand-purple_background h2,
.brand-purple_background h3,
.brand-purple_background h4,
.brand-purple_background h5,
.brand-purple_background h6,
.brand-purple_background .h1style,
.brand-purple_background .h2style,
.brand-purple_background .h3style,
.brand-purple_background .h4style,
.brand-purple_background .h5style,
.brand-purple_background .h6style,
.brand-purple_background ul li,
.brand-purple_background ul li a {
    color: var(--white);
}
.brand-purple_background p {
    color: var(--white);
}
.brand-purple_background a.button.tab,
.brand-purple_background button.tab,
.brand-purple_background .wpcf7 button[type="submit"].tab,
.brand-purple_background .wpcf7 input[type="submit"].tab {
    color: var(--white);
}
.black_background h1,
.black_background h2,
.black_background h3,
.black_background h4,
.black_background h5,
.black_background h6,
.black_background .h1style,
.black_background .h2style,
.black_background .h3style,
.black_background .h4style,
.black_background .h5style,
.black_background .h6style,
.black_background ul li,
.black_background ul li a {
    color: var(--white);
}
.black_background p {
    color: var(--white);
}
.black_background a.button.tab,
.black_background button.tab,
.black_background .wpcf7 button[type="submit"].tab,
.black_background .wpcf7 input[type="submit"].tab {
    color: var(--white);
}
/* Text Color Selection */
::selection {
    background: var(--black); /* WebKit/Blink Browsers */
    color: var(--white);
}
::-moz-selection {
    background: var(--black); /* Gecko Browsers */
    color: var(--white);
}