:root {
    /* --- colors --- */

    /* functional */
    --danger-red: #FF0000;
    --form-selects: #0088FF;

    --off-white: #F5F8FA;
    --medal: #FFC727;
    --rose: #D82A3E;
    --navy: #262262;
    --sky: #2CC4EB;

    /* mono / greys */
    --white: #FFFFFF;
    --light-grey: #F5F5F5;
    --mid-grey: #CCCCCC;
    --dark-grey: #7F7F7F;
    --text-black: #2F2F2F;
    --text-navy: #232059;
    --black: #000000;
}


/* Functional */
.danger-red {
    color: var(--danger-red);
}
.danger-red_background {
    background-color: var(--danger-red);
}






/* =========================
   Brand / accent colors
   ========================= */

.off-white {
    color: var(--off-white);
}
.off-white_background {
    background-color: var(--off-white);
}

.medal {
    color: var(--medal);
}
.medal_background {
    background-color: var(--medal);
}

.rose {
    color: var(--rose);
}
.rose_background {
    background-color: var(--rose);
}

.navy {
    color: var(--navy);
}
.navy_background {
    background-color: var(--navy);
}

.sky {
    color: var(--sky);
}
.sky_background {
    background-color: var(--sky);
}



/* 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);
}

.black {
    color: var(--black);
}
.black_background {
    background-color: var(--black);
}


/*** Gradients ***/
.rose-gradient_background {
    background: #D82A3E;
    background: -webkit-linear-gradient(100deg,rgba(216, 42, 62, 1) 0%, rgba(86, 17, 25, 1) 100%);
    background: -moz-linear-gradient(100deg,rgba(216, 42, 62, 1) 0%, rgba(86, 17, 25, 1) 100%);
    background: linear-gradient(100deg,rgba(216, 42, 62, 1) 0%, rgba(86, 17, 25, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(
            startColorstr="#D82A3E",
            endColorstr="#561119",
            GradientType=0
    );
}
.ocean-gradient_background {
    background: #262262;
    background: -webkit-linear-gradient(180deg, rgba(38, 34, 98, 1) 0%, rgba(44, 196, 235, 1) 100%);
    background: -moz-linear-gradient(180deg, rgba(38, 34, 98, 1) 0%, rgba(44, 196, 235, 1) 100%);
    background: linear-gradient(180deg, rgba(38, 34, 98, 1) 0%, rgba(44, 196, 235, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#262262", endColorstr="#2CC4EB", GradientType=0);
}


/* Text Color Selection */
::selection {
    background: var(--black); /* WebKit/Blink Browsers */
    color: var(--white);
}
::-moz-selection {
    background: var(--black); /* Gecko Browsers */
    color: var(--white);
}






/* default fonts */
p {
    color: var(--text-black);
}
a:not(.button) {
    color: var(--text-black);
}






/* Color Overrides */


/* --- off-white_background --- */
.off-white_background p {
    color: var(--text-black);
}

/* --- black_background --- */
.black_background h1,
.black_background h1.alt,
.black_background h2,
.black_background h3,
.black_background h4,
.black_background h5,
.black_background h6,
.black_background .h1style,
.black_background .h1style.alt,
.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 ul li {
    color: var(--white) !important;
}
.black_background p.sub-heading,
.black_background div.sub-heading p {
    color: var(--white);
}
.black_background p.accent-text,
.black_background div.accent-text p {
    color: var(--white);
}
.black_background p.accent-text::before,
.black_background div.accent-text p::before {
    background-color: var(--white);
}
/* primary button */
.black_background a.button.primary,
.black_background button.primary {
    /*background-color: var(--white);*/
    /*border-color: var(--white);*/
    /*color: var(--black);*/
}
.black_background a.button.primary:hover,
.black_background button.primary:hover {
    /*background-color: var(--white);*/
    /*border-color: var(--white);*/
    /*color: var(--black);*/
}
/* secondary button */
.black_background a.button.secondary,
.black_background button.secondary {
    border-color: var(--white);
    color: var(--white);
}
.black_background a.button.secondary:hover,
.black_background button.secondary:hover {
    background-color: var(--white);
    border-color: var(--white);
    color: var(--black);
}
/* tertiary button */
.black_background a.button.tertiary,
.black_background button.tertiary {
    color: var(--white);
}
.black_background a.button.tertiary:before,
.black_background button.tertiary:before {
    background-color: var(--white);
}
.black_background a.button.tertiary:after,
.black_background button.tertiary:after {
    background-image: url('../buttons/assets/tertiary/white_arrow.svg');
}
/* arrow */
.black_background a.button.arrow,
.black_background button.button.arrow {
    border-color: white;
    background-image: url('../buttons/assets/arrow/white_arrow.svg');
}
.black_background a.button.arrow:hover,
.black_background button.button.arrow:hover {
    border-color: var(--sky);
    background-color: var(--sky);
    background-image: url('../buttons/assets/arrow/white_arrow.svg');
}
/* tab button */
.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);
}
.black_background a.button.tab::after,
.black_background button.tab::after,
.black_background .wpcf7 button[type="submit"].tab::after,
.black_background .wpcf7 input[type="submit"].tab::after {
    background-color: var(--white);
}
/* tag button */
.black_background a.button.tag,
.black_background button.tag,
.black_background .wpcf7 button[type="submit"].tag,
.black_background .wpcf7 input[type="submit"].tag {
    background-color: var(--black);
    border-color: var(--mid-grey);
    color: var(--white);
}
.black_background a.button.tag.active,
.black_background button.tag.active,
.black_background .wpcf7 button[type="submit"].tag.active,
.black_background .wpcf7 input[type="submit"].tag.active {
    background-color: var(--white);
    border-color: var(--white);
    color: var(--black);
}





/* --- rose-gradient_background --- */
.rose-gradient_background h1,
.rose-gradient_background h1.alt,
.rose-gradient_background h2,
.rose-gradient_background h3,
.rose-gradient_background h4,
.rose-gradient_background h5,
.rose-gradient_background h6,
.rose-gradient_background .h1style,
.rose-gradient_background .h1style.alt,
.rose-gradient_background .h2style,
.rose-gradient_background .h3style,
.rose-gradient_background .h4style,
.rose-gradient_background .h5style,
.rose-gradient_background .h6style,
.rose-gradient_background ul li,
.rose-gradient_background ul li a {
    color: var(--white);
}
.rose-gradient_background p {
    color: var(--white);
}
.rose-gradient_background ul li {
    color: var(--white) !important;
}
.rose-gradient_background p.sub-heading,
.rose-gradient_background div.sub-heading p {
    color: var(--white);
}
.rose-gradient_background p.accent-text,
.rose-gradient_background div.accent-text p {
    color: var(--white);
}
.rose-gradient_background p.accent-text::before,
.rose-gradient_background div.accent-text p::before {
    background-color: var(--white);
}
/* primary button */
.rose-gradient_background a.button.primary,
.rose-gradient_background button.primary {
    /*background-color: var(--white);*/
    /*border-color: var(--white);*/
    /*color: var(--black);*/
}
.rose-gradient_background a.button.primary:hover,
.rose-gradient_background button.primary:hover {
    /*background-color: var(--white);*/
    /*border-color: var(--white);*/
    /*color: var(--black);*/
}
/* secondary button */
.rose-gradient_background a.button.secondary,
.rose-gradient_background button.secondary {
    border-color: var(--white);
    color: var(--white);
}
.rose-gradient_background a.button.secondary:hover,
.rose-gradient_background button.secondary:hover {
    background-color: var(--white);
    border-color: var(--white);
    color: var(--black);
}
/* tertiary button */
.rose-gradient_background a.button.tertiary,
.rose-gradient_background button.tertiary {
    color: var(--white);
}
.rose-gradient_background a.button.tertiary:before,
.rose-gradient_background button.tertiary:before {
    background-color: var(--white);
}
.rose-gradient_background a.button.tertiary:after,
.rose-gradient_background button.tertiary:after {
    background-image: url('../buttons/assets/tertiary/white_arrow.svg');
}
/* arrow */
.rose-gradient_background a.button.arrow,
.rose-gradient_background button.button.arrow {
    border-color: white;
    background-image: url('../buttons/assets/arrow/white_arrow.svg');
}
.rose-gradient_background a.button.arrow:hover,
.rose-gradient_background button.button.arrow:hover {
    border-color: var(--sky);
    background-color: var(--sky);
    background-image: url('../buttons/assets/arrow/white_arrow.svg');
}
/* tab button */
.rose-gradient_background a.button.tab,
.rose-gradient_background button.tab,
.rose-gradient_background .wpcf7 button[type="submit"].tab,
.rose-gradient_background .wpcf7 input[type="submit"].tab {
    color: var(--white);
}
.rose-gradient_background a.button.tab::after,
.rose-gradient_background button.tab::after,
.rose-gradient_background .wpcf7 button[type="submit"].tab::after,
.rose-gradient_background .wpcf7 input[type="submit"].tab::after {
    background-color: var(--white);
}
/* tag button */
.rose-gradient_background a.button.tag,
.rose-gradient_background button.tag,
.rose-gradient_background .wpcf7 button[type="submit"].tag,
.rose-gradient_background .wpcf7 input[type="submit"].tag {
    background-color: transparent;
    border-color: var(--mid-grey);
    color: var(--white);
}
.rose-gradient_background a.button.tag.active,
.rose-gradient_background button.tag.active,
.rose-gradient_background .wpcf7 button[type="submit"].tag.active,
.rose-gradient_background .wpcf7 input[type="submit"].tag.active {
    background-color: var(--white);
    border-color: var(--white);
    color: var(--black);
}











/* --- ocean-gradient_background --- */
.ocean-gradient_background h1,
.ocean-gradient_background h1.alt,
.ocean-gradient_background h2,
.ocean-gradient_background h3,
.ocean-gradient_background h4,
.ocean-gradient_background h5,
.ocean-gradient_background h6,
.ocean-gradient_background .h1style,
.ocean-gradient_background .h1style.alt,
.ocean-gradient_background .h2style,
.ocean-gradient_background .h3style,
.ocean-gradient_background .h4style,
.ocean-gradient_background .h5style,
.ocean-gradient_background .h6style,
.ocean-gradient_background ul li,
.ocean-gradient_background ul li a {
    color: var(--white);
}
.ocean-gradient_background p {
    color: var(--white);
}
.ocean-gradient_background ul li {
    color: var(--white) !important;
}
.ocean-gradient_background p.sub-heading,
.ocean-gradient_background div.sub-heading p {
    color: var(--white);
}
.ocean-gradient_background p.accent-text,
.ocean-gradient_background div.accent-text p {
    color: var(--white);
}
.ocean-gradient_background p.accent-text::before,
.ocean-gradient_background div.accent-text p::before {
    background-color: var(--white);
}
/* primary button */
.ocean-gradient_background a.button.primary,
.ocean-gradient_background button.primary {
    /*background-color: var(--white);*/
    /*border-color: var(--white);*/
    /*color: var(--black);*/
}
.ocean-gradient_background a.button.primary:hover,
.ocean-gradient_background button.primary:hover {
    /*background-color: var(--white);*/
    /*border-color: var(--white);*/
    /*color: var(--black);*/
}
/* secondary button */
.ocean-gradient_background a.button.secondary,
.ocean-gradient_background button.secondary {
    border-color: var(--white);
    color: var(--white);
}
.ocean-gradient_background a.button.secondary:hover,
.ocean-gradient_background button.secondary:hover {
    background-color: var(--white);
    border-color: var(--white);
    color: var(--black);
}
/* tertiary button */
.ocean-gradient_background a.button.tertiary,
.ocean-gradient_background button.tertiary {
    color: var(--white);
}
.ocean-gradient_background a.button.tertiary:before,
.ocean-gradient_background button.tertiary:before {
    background-color: var(--white);
}
.ocean-gradient_background a.button.tertiary:after,
.ocean-gradient_background button.tertiary:after {
    background-image: url('../buttons/assets/tertiary/white_arrow.svg');
}
/* arrow */
.ocean-gradient_background a.button.arrow,
.ocean-gradient_background button.button.arrow {
    border-color: white;
    background-image: url('../buttons/assets/arrow/white_arrow.svg');
}
.ocean-gradient_background a.button.arrow:hover,
.ocean-gradient_background button.button.arrow:hover {
    border-color: var(--sky);
    background-color: var(--sky);
    background-image: url('../buttons/assets/arrow/white_arrow.svg');
}
/* tab button */
.ocean-gradient_background a.button.tab,
.ocean-gradient_background button.tab,
.ocean-gradient_background .wpcf7 button[type="submit"].tab,
.ocean-gradient_background .wpcf7 input[type="submit"].tab {
    color: var(--white);
}
.ocean-gradient_background a.button.tab::after,
.ocean-gradient_background button.tab::after,
.ocean-gradient_background .wpcf7 button[type="submit"].tab::after,
.ocean-gradient_background .wpcf7 input[type="submit"].tab::after {
    background-color: var(--white);
}
/* tag button */
.ocean-gradient_background a.button.tag,
.ocean-gradient_background button.tag,
.ocean-gradient_background .wpcf7 button[type="submit"].tag,
.ocean-gradient_background .wpcf7 input[type="submit"].tag {
    background-color: transparent;
    border-color: var(--mid-grey);
    color: var(--white);
}
.ocean-gradient_background a.button.tag.active,
.ocean-gradient_background button.tag.active,
.ocean-gradient_background .wpcf7 button[type="submit"].tag.active,
.ocean-gradient_background .wpcf7 input[type="submit"].tag.active {
    background-color: var(--white);
    border-color: var(--white);
    color: var(--black);
}






/* --- rose_background --- */
.rose_background h1,
.rose_background h1.alt,
.rose_background h2,
.rose_background h3,
.rose_background h4,
.rose_background h5,
.rose_background h6,
.rose_background .h1style,
.rose_background .h1style.alt,
.rose_background .h2style,
.rose_background .h3style,
.rose_background .h4style,
.rose_background .h5style,
.rose_background .h6style,
.rose_background ul li,
.rose_background ul li a {
    color: var(--white);
}
.rose_background p {
    color: var(--white);
}
.rose_background ul li {
    color: var(--white) !important;
}
.rose_background p.sub-heading,
.rose_background div.sub-heading p {
    color: var(--white);
}
.rose_background p.accent-text,
.rose_background div.accent-text p {
    color: var(--white);
}
.rose_background p.accent-text::before,
.rose_background div.accent-text p::before {
    background-color: var(--white);
}
/* primary button */
.rose_background a.button.primary,
.rose_background button.primary {
    /*background-color: var(--white);*/
    /*border-color: var(--white);*/
    /*color: var(--black);*/
}
.rose_background a.button.primary:hover,
.rose_background button.primary:hover {
    /*background-color: var(--white);*/
    /*border-color: var(--white);*/
    /*color: var(--black);*/
}
/* secondary button */
.rose_background a.button.secondary,
.rose_background button.secondary {
    border-color: var(--white);
    color: var(--white);
}
.rose_background a.button.secondary:hover,
.rose_background button.secondary:hover {
    background-color: var(--white);
    border-color: var(--white);
    color: var(--black);
}
/* tertiary button */
.rose_background a.button.tertiary,
.rose_background button.tertiary {
    color: var(--white);
}
.rose_background a.button.tertiary:before,
.rose_background button.tertiary:before {
    background-color: var(--white);
}
.rose_background a.button.tertiary:after,
.rose_background button.tertiary:after {
    background-image: url('../buttons/assets/tertiary/white_arrow.svg');
}
/* arrow */
.rose_background a.button.arrow,
.rose_background button.button.arrow {
    border-color: white;
    background-image: url('../buttons/assets/arrow/white_arrow.svg');
}
.rose_background a.button.arrow:hover,
.rose_background button.button.arrow:hover {
    border-color: var(--sky);
    background-color: var(--sky);
    background-image: url('../buttons/assets/arrow/white_arrow.svg');
}
/* tab button */
.rose_background a.button.tab,
.rose_background button.tab,
.rose_background .wpcf7 button[type="submit"].tab,
.rose_background .wpcf7 input[type="submit"].tab {
    color: var(--white);
}
.rose_background a.button.tab::after,
.rose_background button.tab::after,
.rose_background .wpcf7 button[type="submit"].tab::after,
.rose_background .wpcf7 input[type="submit"].tab::after {
    background-color: var(--white);
}
/* tag button */
.rose_background a.button.tag,
.rose_background button.tag,
.rose_background .wpcf7 button[type="submit"].tag,
.rose_background .wpcf7 input[type="submit"].tag {
    background-color: transparent;
    border-color: var(--mid-grey);
    color: var(--white);
}
.rose_background a.button.tag.active,
.rose_background button.tag.active,
.rose_background .wpcf7 button[type="submit"].tag.active,
.rose_background .wpcf7 input[type="submit"].tag.active {
    background-color: var(--white);
    border-color: var(--white);
    color: var(--black);
}






/* --- navy_background --- */
.navy_background h1,
.navy_background h1.alt,
.navy_background h2,
.navy_background h3,
.navy_background h4,
.navy_background h5,
.navy_background h6,
.navy_background .h1style,
.navy_background .h1style.alt,
.navy_background .h2style,
.navy_background .h3style,
.navy_background .h4style,
.navy_background .h5style,
.navy_background .h6style,
.navy_background ul li,
.navy_background ul li a {
    color: var(--white);
}
.navy_background p {
    color: var(--white);
}
.navy_background ul li {
    color: var(--white) !important;
}
.navy_background p.sub-heading,
.navy_background div.sub-heading p {
    color: var(--rose);
}
.navy_background p.accent-text,
.navy_background div.accent-text p {
    color: var(--rose);
}
.navy_background p.accent-text::before,
.navy_background div.accent-text p::before {
    background-color: var(--rose);
}
/* primary button */
.navy_background a.button.primary,
.navy_background button.primary {
    /*background-color: var(--white);*/
    /*border-color: var(--white);*/
    /*color: var(--black);*/
}
.navy_background a.button.primary:hover,
.navy_background button.primary:hover {
    /*background-color: var(--white);*/
    /*border-color: var(--white);*/
    /*color: var(--black);*/
}
/* secondary button */
.navy_background a.button.secondary,
.navy_background button.secondary {
    border-color: var(--white);
    color: var(--white);
}
.navy_background a.button.secondary:hover,
.navy_background button.secondary:hover {
    background-color: var(--white);
    border-color: var(--white);
    color: var(--black);
}
/* tertiary button */
.navy_background a.button.tertiary,
.navy_background button.tertiary {
    color: var(--white);
}
.navy_background a.button.tertiary:before,
.navy_background button.tertiary:before {
    background-color: var(--white);
}
.navy_background a.button.tertiary:after,
.navy_background button.tertiary:after {
    background-image: url('../buttons/assets/tertiary/white_arrow.svg');
}
/* arrow */
.navy_background a.button.arrow,
.navy_background button.button.arrow {
    border-color: white;
    background-image: url('../buttons/assets/arrow/white_arrow.svg');
}
.navy_background a.button.arrow:hover,
.navy_background button.button.arrow:hover {
    border-color: var(--sky);
    background-color: var(--sky);
    background-image: url('../buttons/assets/arrow/white_arrow.svg');
}
/* tab button */
.navy_background a.button.tab,
.navy_background button.tab,
.navy_background .wpcf7 button[type="submit"].tab,
.navy_background .wpcf7 input[type="submit"].tab {
    color: var(--white);
}
.navy_background a.button.tab::after,
.navy_background button.tab::after,
.navy_background .wpcf7 button[type="submit"].tab::after,
.navy_background .wpcf7 input[type="submit"].tab::after {
    background-color: var(--white);
}
/* tag button */
.navy_background a.button.tag,
.navy_background button.tag,
.navy_background .wpcf7 button[type="submit"].tag,
.navy_background .wpcf7 input[type="submit"].tag {
    background-color: transparent;
    border-color: var(--mid-grey);
    color: var(--white);
}
.navy_background a.button.tag.active,
.navy_background button.tag.active,
.navy_background .wpcf7 button[type="submit"].tag.active,
.navy_background .wpcf7 input[type="submit"].tag.active {
    background-color: var(--white);
    border-color: var(--white);
    color: var(--black);
}
