/*------------------------------------*\
    
    WebFX WYSIWYG Customizations - Global styling for all ACF WYSIWYG's

    Add custom WYSIWYG styling to this file if it should be applied to all ACF WYSIWYG's on the site
    Otherwise, put your block-specific styles in individual block stylesheets

\*------------------------------------*/

.wysiwyg {
    position: relative;
}

.bg-white {
    background: var(--white);
}

.bg-oat {
    background: var(--oat);
}

.bg-black {
    background: var(--black);
    color: var(--white);
}

.bg-black h2,
.bg-black h3,
.bg-black h5 {
    color: var(--white);
}

.bg-black a:not(.btn),
.bg-black .expand {
    color: var(--white);
}

.bg-black .btn-secondary {
    background: var(--white);
    color: var(--black);
}

.bg-black .btn-tertiary {
    color: var(--white);
    border-color: var(--white);
}

.bg-white:not(.contact-form)+.bg-white:not(.contact-form),
.bg-oat:not(.contact-form)+.bg-oat:not(.contact-form),
.bg-black:not(.contact-form)+.bg-black:not(.contact-form) {
    padding-top: 0;
    margin-top: 0;
}

.wysiwyg__wrapper {
    position: relative;
    padding-left: 32px;
}

@media (min-width: 1200px) {
    .bg-black p a:not(.btn):hover {
        color: rgba(255, 255, 255, 0.8);
    }

    .bg-black .btn-tertiary:hover {
        color: var(--orange);
        border-color: var(--orange);
    }

    .wysiwyg h4 {
        font-weight: 700;
        letter-spacing: 0.12em;
    }
}