<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">.callout-slice {
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    position: relative;
    gap: 2rem;
}

.callout-slice__image {
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-height: 6.25rem;
}

.callout-slice__body ul, ol {
    list-style: revert;
}

@media (min-width: 813px) {
    .callout-slice {
        flex-direction: row;

        /* These styles allow the component to be 1080px wide while still being centered and without
           having to modify the `.page__row` styling. Once all content pages have been updated to use
           the new layout, this can be removed. */
        position: relative;
        width: calc(100vw - 4rem);
        max-width: 67.5rem;
        left: 50%;
        margin-left: max(-33.75rem, calc(-50vw + 2rem));
    }

    .callout-slice__image {
        margin-left: 0;
        margin-right: 0;
    }

    .callout-slice__content {
        padding-left: 0;
    }
}

.callout-slice {
    background-color: var(--secondaryColorLight);
}
</pre></body></html>