@font-face {
    font-family: "Trade Gothic Condensed";
    font-weight: 500;
    font-style: normal;
    src: url("/fonts/Trade_Gothic/57d839de-c1a3-492d-837d-edcd2c1d620b.eot?#iefix");
    src: url("/fonts/Trade_Gothic/57d839de-c1a3-492d-837d-edcd2c1d620b.eot?#iefix") format("eot"), url("/fonts/Trade_Gothic/4a10911a-c25d-4efa-b155-59d533f0e0c2.woff2") format("woff2"), url("/fonts/Trade_Gothic/ac62393e-80e8-42f0-a6d7-fb566b94e567.woff") format("woff"), url("/fonts/Trade_Gothic/97d9873e-7926-4480-96de-a1d47c4afa72.ttf") format("truetype"), url("/fonts/Trade_Gothic/de820f99-99c3-48ab-a20d-f18a36c95b5e.svg#de820f99-99c3-48ab-a20d-f18a36c95b5e") format("svg");
}

@font-face {
    font-family: "Trade Gothic Condensed";
    font-weight: 500;
    font-style: italic;
    src: url("/fonts/Trade_Gothic/b3f496f3-4f32-4733-b8f9-9a454d424f55.eot?#iefix");
    src: url("/fonts/Trade_Gothic/b3f496f3-4f32-4733-b8f9-9a454d424f55.eot?#iefix") format("eot"), url("/fonts/Trade_Gothic/41ece3eb-1bb2-47b3-b868-6adebc34c1a4.woff2") format("woff2"), url("/fonts/Trade_Gothic/17dcb20a-a719-4259-bcd1-d75d63499d9b.woff") format("woff"), url("/fonts/Trade_Gothic/a004c7a1-d244-4304-a65d-c43cb2f5a59d.ttf") format("truetype"), url("/fonts/Trade_Gothic/f57f7220-da69-4f4e-8261-7f7801168bd8.svg#f57f7220-da69-4f4e-8261-7f7801168bd8") format("svg");
}

@font-face {
    font-family: "Trade Gothic Condensed";
    font-weight: 900;
    font-style: normal;
    src: url("/fonts/Trade_Gothic/f0708d82-47f5-4497-afac-8c5a771250e8.eot?#iefix");
    src: url("/fonts/Trade_Gothic/f0708d82-47f5-4497-afac-8c5a771250e8.eot?#iefix") format("eot"), url("/fonts/Trade_Gothic/520ed712-50ad-4591-aa63-b242b83a3694.woff2") format("woff2"), url("/fonts/Trade_Gothic/c9083b7e-ba26-4e45-8f1b-34ad32e924e5.woff") format("woff"), url("/fonts/Trade_Gothic/84c568ba-a16d-43bb-ad9f-783ab985108f.ttf") format("truetype"), url("/fonts/Trade_Gothic/398af540-cbbe-49ac-8de9-7246da632d63.svg#398af540-cbbe-49ac-8de9-7246da632d63") format("svg");
}

@font-face {
    font-family: "Trade Gothic Condensed";
    font-weight: 900;
    font-style: italic;
    src: url("/fonts/Trade_Gothic/a0a8ec99-1789-4b71-b17f-ddab957120d6.eot?#iefix");
    src: url("/fonts/Trade_Gothic/a0a8ec99-1789-4b71-b17f-ddab957120d6.eot?#iefix") format("eot"), url("/fonts/Trade_Gothic/3fdda737-37d7-427f-8882-07c8713989cf.woff2") format("woff2"), url("/fonts/Trade_Gothic/61d59718-e067-4b03-b9e8-76b9fd8289e3.woff") format("woff"), url("/fonts/Trade_Gothic/d100bbbc-4838-476a-abe1-4c3160a74e42.ttf") format("truetype"), url("/fonts/Trade_Gothic/54303de9-8dbf-408f-a9f1-4750c32fb7c5.svg#54303de9-8dbf-408f-a9f1-4750c32fb7c5") format("svg");
}

@font-face {
    font-family: "Trade Gothic";
    font-weight: 500;
    font-style: normal;
    src: url("/fonts/Trade_Gothic/40775ed4-d9b0-4f75-b874-80f2842332a9.eot?#iefix");
    src: url("/fonts/Trade_Gothic/40775ed4-d9b0-4f75-b874-80f2842332a9.eot?#iefix") format("eot"), url("/fonts/Trade_Gothic/24ba8ea7-bbf3-40e0-b924-fd985d79ebca.woff2") format("woff2"), url("/fonts/Trade_Gothic/9274bb7f-01c5-45cb-b935-f53683ab6dd6.woff") format("woff"), url("/fonts/Trade_Gothic/a94b3f7a-c1fd-4bbe-9273-1f6f081dcb2f.ttf") format("truetype"), url("/fonts/Trade_Gothic/b0fb9bf0-3364-4802-9c4e-89202a063331.svg#b0fb9bf0-3364-4802-9c4e-89202a063331") format("svg");
}

@font-face {
    font-family: "Trade Gothic";
    font-weight: 500;
    font-style: italic;
    src: url("/fonts/Trade_Gothic/379b55d3-190d-48bd-b1f2-dc787a73b65b.eot?#iefix");
    src: url("/fonts/Trade_Gothic/379b55d3-190d-48bd-b1f2-dc787a73b65b.eot?#iefix") format("eot"), url("/fonts/Trade_Gothic/5760433c-f9b7-4c0d-b618-77b03ff59186.woff2") format("woff2"), url("/fonts/Trade_Gothic/48f8ec71-d114-4f7f-a933-b1032c89aa32.woff") format("woff"), url("/fonts/Trade_Gothic/efdb46c3-279b-490c-8468-dfe30e01582c.ttf") format("truetype"), url("/fonts/Trade_Gothic/9572e7af-5fa0-46b5-b48a-90892a8f7aa5.svg#9572e7af-5fa0-46b5-b48a-90892a8f7aa5") format("svg");
}

@font-face {
    font-family: "Trade Gothic";
    font-weight: 900;
    font-style: normal;
    src: url("/fonts/Trade_Gothic/07702e82-1476-4552-97e1-682d5af3bd30.eot?#iefix");
    src: url("/fonts/Trade_Gothic/07702e82-1476-4552-97e1-682d5af3bd30.eot?#iefix") format("eot"), url("/fonts/Trade_Gothic/4a5b9bde-0062-4b1f-ae1f-d2ad4d283b55.woff2") format("woff2"), url("/fonts/Trade_Gothic/dd603555-b5c3-4df6-885b-b75ef30fa0f8.woff") format("woff"), url("/fonts/Trade_Gothic/6515df23-fbdf-459f-924c-b449b8b7ade8.ttf") format("truetype"), url("/fonts/Trade_Gothic/17c3c18f-135d-447c-bcfd-7bcfc2ca515a.svg#17c3c18f-135d-447c-bcfd-7bcfc2ca515a") format("svg");
}

@font-face {
    font-family: "Trade Gothic";
    font-weight: 900;
    font-style: italic;
    src: url("/fonts/Trade_Gothic/3a3811df-095b-42db-a25d-ddab2bbeedfa.eot?#iefix");
    src: url("/fonts/Trade_Gothic/3a3811df-095b-42db-a25d-ddab2bbeedfa.eot?#iefix") format("eot"), url("/fonts/Trade_Gothic/cf117f57-227f-4bba-ae2f-24caa1ec7a5d.woff2") format("woff2"), url("/fonts/Trade_Gothic/e2a62655-b75b-4999-9377-75c6f7957ae5.woff") format("woff"), url("/fonts/Trade_Gothic/aa7f4d20-bc42-4a35-b9cb-6ce46f1ec04d.ttf") format("truetype"), url("/fonts/Trade_Gothic/d4f1182b-2309-4987-8ef8-2c8274d7b208.svg#d4f1182b-2309-4987-8ef8-2c8274d7b208") format("svg");
}

/* VARIABLES */
:root {
    /* CPC HSL COLOR CODES (useful when adding opacity to CPC default colors)*/
    --dk-blue-hsl: 209.27, 100%, 32.16%;
    --blue-hsl: 209.17, 60%, 52.94%;
    --lt-blue-hsl: 208, 68.97%, 65.88%;
    --orange-hsl: 16.17, 88.13%, 57.06%;
    --gold-hsl: 42.31, 98.32%, 53.33%;
    --green-hsl: 91.16, 51.81%, 51.18%;
    --dk-grey-hsl: 0, 0%, 15.69%;
    --grey-hsl: 160, 1.32%, 44.51%;
    --lt-grey-hsl: 220, 10.34%, 94.31%;
    --blue-grey-hsl: 205.26, 11.11%, 66.47%;

    /* CPC COLOR VARIABLES */
    --dk-blue: #0054a4;
    --blue: #3F89CF;
    --lt-blue: #6cace4;
    --orange: #f26531;
    --gold: #fdb813;
    --green: #80c342;
    --dk-grey: #282828;
    --grey: #707372;
    --md-grey: #dcdcdc;
    --lt-grey: #eff0f2;
    --blue-grey: #A0ABB3;
    --white: white;
    --black: black;

    /* FILTER COLORS */
    --filter-dk-blue: invert(17%) sepia(70%) saturate(3395%) hue-rotate(196deg) brightness(96%) contrast(101%);
    --filter-blue: invert(56%) sepia(15%) saturate(1688%) hue-rotate(172deg) brightness(88%) contrast(88%);
    --filter-lt-blue: invert(62%) sepia(53%) saturate(434%) hue-rotate(170deg) brightness(96%) contrast(86%);
    --filter-orange: invert(49%) sepia(22%) saturate(5006%) hue-rotate(343deg) brightness(100%) contrast(90%);
    --filter-gold: brightness(0) saturate(100%) invert(84%) sepia(29%) saturate(5254%) hue-rotate(349deg) brightness(105%) contrast(98%);
    --filter-dk-grey: brightness(0) saturate(100%) invert(10%) sepia(0%) saturate(1826%) hue-rotate(245deg) brightness(92%) contrast(84%);
    --filter-grey: brightness(0) saturate(100%) invert(46%) sepia(10%) saturate(68%) hue-rotate(109deg) brightness(95%) contrast(87%);
    --filter-md-grey: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(6585%) hue-rotate(181deg) brightness(120%) contrast(73%);
    --filter-lt-grey: brightness(0) saturate(100%) invert(95%) sepia(4%) saturate(69%) hue-rotate(181deg) brightness(100%) contrast(96%);
    --filter-blue-grey: brightness(0) saturate(100%) invert(77%) sepia(15%) saturate(185%) hue-rotate(163deg) brightness(86%) contrast(91%);
    --filter-white: brightness(0) invert(1);
    --filter-black: brightness(0);

    /* TEXT COLOR VARIABLES */
    --dark-theme-text: white;
    --dark-theme-text-filter: var(--filter-white);
    --light-theme-text: var(--dk-grey);
    --light-theme-text-filter: var(--filter-dk-grey);

    /* GLOBAL INHERITANCE VARIABLES */
    --global-primary-accent-color: var(--dk-blue);
    --global-primary-accent-color-filter: var(--filter-dk-blue);
    --global-secondary-accent-color: var(--lt-blue);
    --global-secondary-accent-color-filter: var(--filter-lt-blue);
    --global-hover-state-color: var(--orange);
    --global-hover-state-color-filter: var(--filter-orange);

    --global-text-color: var(--light-theme-text);
    --global-text-color-filter: var(--light-theme-text-filter);
    --global-link-color: var(--blue);
    --global-link-color-hover: var(--dk-blue);
    --global-link-color-visited: #00008B;
    --global-surface-base: white; /* Sets the background (surface) color for a container's primary (base) layer. */
    --global-surface-card: var(--lt-grey); /* Sets the background (surface) color for a container's secondary (card) layer. */

    /* BACKGROUND WIREFRAME SETTINGS */
    --bg-wireframe-image-dark: url(/Portals/_default/Containers/CPC/corp-marketing-background-wireframe-dark.svg);
    --bg-wireframe-image-light: url(/Portals/_default/Containers/CPC/corp-marketing-background-wireframe-light.svg);
    --bg-wireframe-filter-blue: brightness(0) var(--filter-blue);
    --bg-wireframe-filter-lt-blue: invert(1) var(--filter-lt-blue);

    /* MEDIA BREAKPOINTS */
    --breakpoint-tablet: 1024px;
    --breakpoint-mobile: 768px;

    /* CPC-CONTAINER SETTINGS */
    --container-padding-block: 5.5rem;
    --container-padding-top: var(--container-padding-block);
    --container-padding-bottom: var(--container-padding-block);
    
    /* CPC-CONTENT SETTINGS */
    --content-padding-inline: 1rem;
    --content-padding-left: var(--content-padding-inline);
    --content-padding-right: var(--content-padding-inline);
    --content-max-width: 1200px;
    --content-max-width-sm: 960px;
}

:root, .theme-reset {
    /* CONTEXTUAL INHERITANCE VARIABLES */
    --current-primary-accent-color: var(--global-primary-accent-color);
    --current-primary-accent-color-filter: var(--global-primary-accent-color-filter);
    --current-secondary-accent-color: var(--global-secondary-accent-color);
    --current-secondary-accent-color-filter: var(--global-secondary-accent-color-filter);
    --current-hover-state-color: var(--global-hover-state-color);
    --current-hover-state-color-filter: var(--global-hover-state-color-filter);

    --current-text-color: var(--global-text-color);
    --current-text-color-filter: var(--global-text-color-filter);
    --current-link-color: var(--current-primary-accent-color);
    --current-link-color-hover: var(--current-hover-state-color);
    --current-link-color-visited: var(--global-link-color-visited);
    --current-surface-base: var(--global-surface-base);
    --current-surface-card: var(--global-surface-card);
}

html {
    font-size: 16px;
}

body {
    font-size: inherit;
    line-height: normal;
}

a :is(h1, h2, h3, h4, h5, h6, p, li) {
    color: inherit;
}

/* Background Color Classes */
.bg-dk-blue {
    background-color: var(--dk-blue);
}

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

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

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

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

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

.bg-dk-grey {
    background-color: var(--dk-grey);
}

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

.bg-lt-grey {
    background-color: var(--lt-grey);
}

/* Color themes */
.theme-dk-blue {
    --current-primary-accent-color: var(--gold);
    --current-primary-accent-color-filter: var(--filter-gold);
    --current-secondary-accent-color: var(--lt-blue);
    --current-secondary-accent-color-filter: var(--filter-lt-blue);

    --current-text-color: var(--dark-theme-text);
    --current-text-color-filter: var(--dark-theme-text-filter);
    --current-link-color-visited: #ffe5a6;
    --current-surface-card: white;
    --bg-wireframe-image: var(--bg-wireframe-image-dark);
    background-color: var(--dk-blue);
}

.theme-lt-blue {
    --current-primary-accent-color: var(--dk-blue);
    --current-primary-accent-color-filter: var(--filter-dk-blue);
    --current-secondary-accent-color: var(--gold);
    --current-secondary-accent-color-filter: var(--filter-gold);

    --current-text-color: var(--dark-theme-text);
    --current-text-color-filter: var(--dark-theme-text-filter);
    --current-surface-card: white;
    --bg-wireframe-image: var(--bg-wireframe-image-dark);
    background-color: var(--lt-blue);
}

.theme-gradient-dk-blue-black {
    --current-primary-accent-color: var(--gold);
    --current-primary-accent-color-filter: var(--filter-gold);
    --current-secondary-accent-color: var(--lt-blue);
    --current-secondary-accent-color-filter: var(--filter-lt-blue);

    --current-text-color: var(--dark-theme-text);
    --current-text-color-filter: var(--dark-theme-text-filter);
    --current-link-color-visited: #ffe5a6;
    --current-surface-card: white;
    background-color: var(--dk-blue);
    background-image: linear-gradient(90deg, var(--dk-blue) 0%, black 100%);
}

.theme-dk-grey {
    --current-primary-accent-color: var(--lt-blue);
    --current-primary-accent-color-filter: var(--filter-lt-blue);
    --current-secondary-accent-color: var(--gold);
    --current-secondary-accent-color-filter: var(--filter-gold);

    --current-text-color: var(--dark-theme-text);
    --current-text-color-filter: var(--dark-theme-text-filter);
    --current-link-color-visited: #9dc9f0;
    --current-surface-card: white;
    --bg-wireframe-image: var(--bg-wireframe-image-dark);
    --bg-wireframe-filter: var(--bg-wireframe-filter-lt-blue);
    background-color: var(--dk-grey);
}

.theme-grey {
    --current-primary-accent-color: var(--gold);
    --current-primary-accent-color-filter: var(--filter-gold);
    --current-secondary-accent-color: var(--lt-blue);
    --current-secondary-accent-color-filter: var(--filter-lt-blue);

    --current-text-color: var(--dark-theme-text);
    --current-text-color-filter: var(--dark-theme-text-filter);
    --current-link-color-visited: #ffe5a6;
    --current-surface-card: white;
    background-color: var(--grey);
}

.theme-lt-grey {
    --current-primary-accent-color: var(--dk-blue);
    --current-primary-accent-color-filter: var(--filter-dk-blue);
    --current-secondary-accent-color: var(--lt-blue);
    --current-secondary-accent-color-filter: var(--filter-lt-blue);

    --current-text-color: var(--light-theme-text);
    --current-text-color-filter: var(--light-theme-text-filter);
    --current-surface-card: white;
    --bg-wireframe-image: var(--bg-wireframe-image-light);
    --bg-wireframe-filter: var(--bg-wireframe-filter-blue);
    background-color: var(--lt-grey);
}

/* BACKGROUND WIREFRAME */
.bg-wireframe {
    position: relative;
}

    .bg-wireframe::before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background-image: var(--bg-wireframe-image);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
        filter: var(--bg-wireframe-filter, unset);
    }

.dark-theme-text {
    --current-text-color: var(--dark-theme-text);
    --current-text-color-filter: var(--dark-theme-text-filter);
    color: var(--current-text-color);
}

.light-theme-text {
    --current-text-color: var(--light-theme-text);
    --current-text-color-filter: var(--light-theme-text-filter);
    color: var(--current-text-color);
}

/* CONTENT STRUCTURE */
.cpc-container {
    width: 100%;
    padding-top: var(--container-padding-top);
    padding-bottom: var(--container-padding-bottom);
    padding-block: var(--container-padding-block);
    display: block flow-root;
}

.pt-0, .py-0 {
    padding-top: 0;
}

.pb-0, .py-0 {
    padding-bottom: 0;
}

.cpc-content {
    box-sizing: border-box;
    max-width: var(--content-max-width);
    width: 100%;
    margin: auto;
    margin-inline: auto;
    padding-left: var(--content-padding-left);
    padding-right: var(--content-padding-right);
    padding-inline: var(--content-padding-inline);
}

    .cpc-content.content-small {
        max-width: var(--content-max-width-sm);
    }

    .cpc-content > *:first-child:is(h1, h2, h3, h4, h5, h6, p, ul, ol) {
        margin-top: 0;
    }

    .cpc-content.two-column,
    .cpc-content .two-column {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
        gap: 3rem;
    }

@media screen and (max-width: var(--breakpoint-mobile)) {
    .cpc-content.two-column,
    .cpc-content .two-column {
        grid-template-columns: 100%;
    }
}

.align-center {
    text-align: center;
}

/* 
    CALL TO ACTION 

    Global/Theme Variables:
    --cta-icon-color | Color filter for the cta icon

    Component Variables
    --cta-text-color | Cta text color
    --cta-icon-url | Url path for the cta icon
    --cta-block-bg-color | Background color for cta block
*/
.cta, .cta:visited {
    --cta-text-color: var(--current-text-color);
    --cta-icon-color: var(--current-primary-accent-color-filter);

    color: var(--cta-text-color);
    text-transform: uppercase;
    display: flex !important;
    align-items: center;
    width: fit-content;
    font-size: 1.3rem;
    font-weight: bold;
    text-decoration: none;
    letter-spacing: 0.1rem;
}

    .cta::after {
        content: var(--cta-icon-url);
        width: var(--cta-icon-width, 1.6rem);
        height: auto;
        flex-shrink: 0;
        margin-left: 0.8rem;
        filter: var(--cta-icon-color);
        line-height: 0;
    }

    .cta.block {
        --cta-icon-color: var(--filter-white) !important;
        --cta-text-color: white;
        --cta-block-bg-color: var(--current-primary-accent-color);
        padding: 1rem;
        background-color: var(--cta-block-bg-color);
        letter-spacing: inherit;
        display: flex;
    }

    /* CTA Icons */
    .cta.primary {
        --cta-icon-url: url("https://www.cpcworldwide.com/portals/0/library/Icons/primary-cta/primary-cta-black.svg");
        --cta-icon-width: 1.6rem;
    }

    .cta.arrow-up {
        --cta-icon-url: url("https://www.cpcworldwide.com/portals/0/library/Icons/arrow-up/arrow-up-black.svg");
        --cta-icon-width: 1rem;
    }

    .cta.arrow-down {
        --cta-icon-url: url("https://www.cpcworldwide.com/portals/0/library/Icons/arrow-down/arrow-down-black.svg");
        --cta-icon-width: 1rem;
    }

    .cta.plus {
        --cta-icon-url: url("https://www.cpcworldwide.com/portals/0/library/Icons/plus/plus.svg");
        --cta-icon-width: 1.1rem;
    }

    /* CTA Colors */
    .cta.accent-primary {
        --cta-icon-color: var(--current-primary-accent-color-filter);
        --cta-block-bg-color: var(--current-primary-accent-color);
    }

    .cta.accent-secondary {
        --cta-icon-color: var(--current-secondary-accent-color-filter);
        --cta-block-bg-color: var(--current-secondary-accent-color);
    }
    
    .cta.white {
        --cta-icon-color: var(--filter-white);
        --cta-text-color: white;
    }

        .cta.white.block {
            --cta-icon-color: var(--global-cta-icon-color) !important;
            --cta-text-color: var(--global-text-color);
            --cta-block-bg-color: white;
        }

    .cta.grey {
        --cta-block-bg-color: var(--grey);
    }

    .cta.dk-grey {
        --cta-block-bg-color: var(--dk-grey);
    }

    .cta.lt-blue {
        --cta-icon-color: var(--filter-lt-blue);
        --cta-block-bg-color: var(--lt-blue);
    }

    .cta.blue {
        --cta-icon-color: var(--filter-blue);
        --cta-block-bg-color: var(--blue);
    }

    .cta.dk-blue {
        --cta-icon-color: var(--filter-dk-blue);
        --cta-block-bg-color: var(--dk-blue);
    }

    .cta.orange {
        --cta-icon-color: var(--filter-orange);
        --cta-block-bg-color: var(--orange);
    }

    .cta:hover,
    .cta:focus {
        color: var(--cta-text-color);
    }

:is(a, button).cta:hover,
:is(a, button).cta:focus {
    --cta-icon-color: var(--filter-orange) !important;
    text-decoration: none;
    border-bottom: none !important;
}

:is(a, button).cta.block:hover,
:is(a, button).cta.block:focus {
    --cta-block-bg-color: var(--orange) !important;
    --cta-icon-color: var(--filter-white) !important;
    --cta-text-color: white;
}

.align-center .cta {
    margin: auto;
    margin-inline: auto;
}

/* WIREFRAME DIVIDER */
.CPC-WireframeDivider-cmpnt {
    background-image: url(/Portals/_default/Containers/Colder/images/wireframe_topborder.png?format=webp);
    min-height: 2.3rem;
    width: 100%;
}


/* MISC STYLING */
.sc-content-block .cpc-content p a:hover, .sc-content-block .cpc-content p a:focus {
    text-decoration: underline;
    text-decoration-color: var(--orange);
    text-decoration-thickness: 2px;
    text-underline-offset: 2px;
}

.cpc-content span.full-width {
    width: 100%;
    display: block;
}

.cpc-content hr {
    margin-top: 3rem;
    margin-bottom: 3rem;
    margin-block: 3rem;
}

.cpc-content ul, .cpc-content ol {
    padding: 0;
    padding-left: 2rem;
}

    .cpc-content ol li::marker {
        font-weight: bold;
    }

.cpc-content li, .cpc-content dt, .cpc-content dd {
    line-height: 2.5rem;
    color: var(--current-text-color);
    list-style-position: outside;
}

.cpc-content ul {
    list-style-type: square;
}

    .cpc-content ul ul {
        list-style: circle;
        margin-top: 10px;
    }

.cpc-content li::marker {
    color: var(--current-primary-accent-color);
}

.cpc-content .list-flex ul, .cpc-content .list-flex ol, .cpc-content ul.list-flex, .cpc-content ol.list-flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
}

.cpc-content .list-flex li {
    width: 100%;
    max-width: 500px;
    list-style-position: inside;
    margin: 1rem 1rem 0
}

@media screen and (max-width: 767px) {
    .cpc-content li {
        list-style-position: outside;
    }
}



/* ACCORDIONS */
section.accordion {
    --current-text-color: var(--global-text-color);
    margin: 0;
    margin-top: 1rem;
    width: 100%;
    background-color: #eee;
    border-radius: 4px;
    color: black;
    text-align: left;
    padding: 0.6rem 1rem;
}

.accordion > :is(h1,h2,h3,h4,h5,h6) {
    cursor: pointer;
    margin-top: 0;
    margin-bottom: 0;
    margin-block: 0;
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
    padding-block: 0.2rem;
    display: flex;
    align-items: center;
    /* gap: 0.4rem; */
    width: 100%;
    font-size: 1.3rem;
    font-weight: bold;
}

    .accordion > :is(h1,h2,h3,h4,h5,h6)::before {
        display: inline-block;
        content: url(https://www.cpcworldwide.com/portals/0/library/icons/plus/plus.svg);
        width: 1rem;
        min-height: 4px; /* Ensures the minus icon's height is sized correctly */
        filter: var(--filter-orange);
        margin-right: 0.4rem;
    }

.accordion.open > :is(h1,h2,h3,h4,h5,h6)::before {
    content: url(https://www.cpcworldwide.com/portals/0/library/icons/minus/minus.svg);
}

section.accordion .accordion-content {
    max-height: 0px;
    overflow: hidden;
    transition: max-height 500ms ease-in-out;
}

.accordion.open .accordion-content {
    max-height: none;
    padding-top: 1rem;
}

.accordion .accordion-content :last-child {
    margin-bottom: 0;
}

.accordion .accordion-content a {
    color: var(--blue);
}

    .accordion .accordion-content a:hover, .accordion .accordion-content a:focus {
        color: var(--dk-blue);
    }

/* Disable 2sxc QuickE Toolbar */
body:not(.dnnEditState) .sc-content-block-menu.sc-content-block-quick-insert {
    display: none !important;
}

/* Copy to Clipboard (c2c) */
.c2c {
    position: relative;
    width: fit-content;
}

.c2c-text {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
    text-align: left;
    padding: 0;
    border: 2px solid transparent;
    position: relative;
    transition: border 0ms;
    outline: none;
    cursor: pointer;
}

        .c2c:has(.c2c-text:hover, .c2c-text:focus) .c2c-text {
            color: inherit;
            border: 2px dashed var(--orange);
            transition: border 250ms ease;
        }

.c2c-tooltip {
    position: absolute;
    left: calc(100% + 1rem);
    top: 50%;
    translate: 0 -50%;
    width: max-content;
    display: flex;
    align-items: center;
    gap: 1rem;
    background-color: hsl(var(--dk-grey-hsl), 0.95);
    padding: 0.45rem 0.65rem;
    border-radius: 5px;
    color: white;
    font-size: 1.1rem;
    font-weight: normal;
    line-height: 1;
    z-index: 10;
    transition: opacity 250ms ease, transform 250ms ease;
}

.c2c:not(:has(.c2c-text:hover, .c2c-text:focus)) .c2c-tooltip {
    opacity: 0;
    transform: translateX(-1rem);
    z-index: 0;
    transition: all 0ms;
}

    .c2c-tooltip svg {
        width: 18px;
        height: auto;
        fill: white;
    }

    .c2c-tooltip.wrap {
        left: 0;
        top: calc(100% + 0.25rem);
        translate: unset;
    }

    .c2c:not(:has(.c2c-text:hover, .c2c-text:focus)) .c2c-tooltip.wrap {
        transform: translateY(-0.5rem);
    }