/*------------------------------------*\
    
    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;
    z-index: 1;
}

.wysiwyg-gradient-dots-left {
    position: absolute;
    left: 0;
    bottom: 140px;
    width: 403px;
    height: 403px;
    border-radius: 403px;
    opacity: 0.65;
    background: radial-gradient(50% 50% at 50% 50%, #FBC1C3 0%, #F2E3E8 50.96%, #FEF5F5 100%);
    z-index: -1;
}

.wysiwyg-gradient-dots-right {
    position: absolute;
    right: 0;
    top: 140px;
    width: 404px;
    height: 406px;
    border-radius: 406px;
    opacity: 0.5;
    background: radial-gradient(50% 50% at 50% 50%, #C6D9EE 0%, #EBEBF3 47.6%, #FEF5F5 100%);
    z-index: -1;
}

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

.bg-light-red {
    background: rgba(240, 51, 55, 0.05);
}

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

.bg-soft-blue {
    background: var(--soft-blue);
}

.bg-blue {
    background: var(--light-blue);
}

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

.bg-navy {
    background: var(--dark-blue);
    color: var(--white);
}

.bg-navy h2,
.bg-navy h3,
.bg-navy h4,
.bg-navy h5,
.bg-navy h6,
.bg-periwinkle h2,
.bg-periwinkle h3,
.bg-periwinkle h4,
.bg-periwinkle h5,
.bg-periwinkle h6 {
    color: var(--white);
}

.bg-navy h2 span,
.bg-navy .h2 span,
.bg-periwinkle h2 span,
.bg-periwinkle .h2 span {
    color: var(--twilight);
    -webkit-text-stroke-color: var(--twilight);
}

.bg-navy .sub-heading,
.bg-periwinkle .sub-heading {
    color: var(--light-blue);
    -webkit-text-stroke: 1px var(--light-blue);
}

.bg-navy p a,
.bg-periwinkle p a {
    color: var(--white);
}

.bg-navy ul li:before,
.bg-blue .tab-accordion__panel__content ul li:before {
    color: var(--light-blue);
}

.bg-navy ul.list-style li::after,
.bg-blue .tab-accordion__panel__content ul.list-style li::after {
    background: var(--blue);
    opacity: 1;
}

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

.btn-large {
    width: calc(100% + 12px);
}

.bg-white + .bg-white {
    padding-top: 0;
    margin-top: 0;
}

body.page-id-379 section.wysiwyg {
    padding-bottom: 0;
}

@media (min-width: 768px) {
    .btn-large {
        width: auto;
    }

    .column-three {
        /* column-count: 2; */
        margin-left: 55px;
    }
}

@media (min-width: 1200px) {

    .bg-navy p a:hover,
    .bg-periwinkle p a:hover {
        color: var(--twilight);
    }

    .bg-periwinkle .btn-tertiary:hover {
        color: var(--light-blue);
    }

    /* .column-three {
        column-count: 3;
    } */

}