/* #region Setting the font paths */
@font-face {
    font-family: "Century Gothic";
    src: url("/CASN/fonts/centurygothic.woff2") format("woff2"),url("/CASN/fonts/centurygothic.woff") format("woff"),url("/CASN/fonts/centurygothic.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
}


@font-face {
    font-family: "Century Gothic Bold";
    src: url("/CASN/fonts/centurygothic_bold.woff2") format("woff2"),url("/CASN/fonts/centurygothic_bold.woff") format("woff"),url("/CASN/fonts/centurygothic_bold.ttf") format("truetype");
    font-style: normal;
    font-weight: 500;
}

@font-face {
    font-family: "Commissioner-Bold";
    src: url("/CASN/fonts/Commissioner-Bold.woff2") format("woff2"),url("/CASN/fonts/Commissioner-Bold.woff") format("woff"),url("/CASN/fonts/Commissioner-Bold.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
}


@font-face {
    font-family: "Commissioner-Medium";
    src: url("/CASN/fonts/Commissioner-Medium.woff2") format("woff2"),url("/CASN/fonts/Commissioner-Medium.woff") format("woff"),url("/CASN/fonts/Commissioner-Medium.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
}


@font-face {
    font-family: "Commissioner-Regular";
    src: url("/CASN/fonts/Commissioner-Regular.woff2") format("woff2"),url("/CASN/fonts/Commissioner-Regular.woff") format("woff"),url("/CASN/fonts/Commissioner-Regular.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
}


/* global colours */

:root {
    --body-text: #1a1a1a; /* For primary color of the text on light bg */
    --body-subtext: #5e5e5e; /* For color of the subtext, subheaders on light bg */
    --header-text-white: #ffffff; /* For text, menus on dark purple color, for borders on light buttons and content */
    --subtext-grey: #dddddd; /* For subtext, submenus on dark purple color */
    --subtext-card-grey: #4B4B4B; /* For Card on Testimonials */

    --purple-dark: #492b68;
    --purple-base: #5E3190;
    --purple-header-text: #7649A5;
    --purple-bg-light: #F8F1FE;
    --purple-bg-action: #8C5BBE;
    --purple-light: #EBD5FC;
    --orange-bg: #FFA500; /* For borders and icons */
    --orange-bg-alt: #EBA23C; /* For list */
}

/* font sizes */

:root {
    --font-body-small: 14px; /* For some subheaders, some body text font sizes */
    --font-body: 16px; /* Body text font size */
    --font-list-title: 20px; /* List Card items title font size */
    --font-card-header: 24px; /* Card title font size, some pages Section font size */
    --font-banner-header: 32px; /* Banner title font size */
    --font-title: 44px; /* Large title font size */
}

/* font family */

:root {
    --font-gothic: "Century Gothic";
    --font-gothic-bold: "Century Gothic Bold";
}
/*#endregion*/

/* #region site-specific*/
/* mobile font sizes */
@media(max-width: 767px) {
    :root {
        --font-title: 28px;
        --font-card-header: 20px;
        --font-banner-header: 24px;
    }
}


/* Sticky footer styles  */
html {
    position: relative;
    min-height: 100%;
}

body {
    font-family: 'Commissioner-Regular';
    line-height: 1.5;
    overflow-x: hidden;
}

header {
    transition: all 0.1s;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 60;
}

/*Outline common*/
button:focus, .btn:focus-visible, :focus-visible, .accordion.accordion-cover-button .accordion-button:focus {
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25);
    /*outline-offset: 8px;
    outline: 4px dashed blue;*/
}
header nav button:focus, header nav .btn:focus-visible, header nav :focus-visible {
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(13, 110, 253, .25);
}
.skipTo {display:none !important}
 
.skipTo:focus,  .skipTo:focus-visible{display:block !important}
.container-md {
    /* overflow: hidden;*/
}

body p {
    font-size: var(--font-body)
}

body h1 {
    font-size: var(--font-title)
}

body h2 {
    font-size: var(--font-banner-header)
}

body h3 {
    font-size: var(--font-card-header)
}

body h4 {
    font-size: var(--font-list-title)
}

body h5 {
    font-size: var(--font-body-small)
}

body .h1 {
    font-size: var(--font-title) !important
}

body .h2 {
    font-size: var(--font-banner-header) !important
}

body .h3 {
    font-size: var(--font-card-header) !important
}

body .h4 {
    font-size: var(--font-list-title) !important
}

body .h5 {
    font-size: var(--font-body-small) !important
}

body .h6 {
    font-size: var(--font-body) !important
}

body h1, body h2, body h3, body h4, body h5, body .header-tag {
    font-family: 'Century Gothic';
    line-height: 1.5;
}

body .h1, body .h2, body .h3, body .h4, body .h5, body .h6 {
    line-height: 1.5;
}

input::placeholder, .form-control::placeholder {
    color: var(--body-text);
}

.color-purple-dark {
    color: var(--purple-dark) !important
}

.body-subtext {
    color: var(--body-subtext) !important
}

.body-text-black {
    color: var(--body-text) !important
}

.color-white {
    color: var(--header-text-white) !important
}

.color-orange-bg {
    color: var(--orange-bg) !important
}

.color-subtext-card-grey {
    color: var(--subtext-card-grey)
}

.color-purple {
    color: var(--purple-base) !important
}

body .font-bold {
    font-family: 'Commissioner-Bold';
}

body .font-medium {
    font-family: 'Commissioner-Medium';
}

img, svg {
    max-width: 100%;
}

@media (min-width: 992px) {
    .border-lg-top {
        border-top: 1px solid #e3e7eb !important;
    }

    .border-lg-right {
        border-right: 1px solid #e3e7eb !important;
    }

    .border-lg-bottom {
        border-bottom: 1px solid #e3e7eb !important;
    }

    .border-lg-left {
        border-left: 1px solid #e3e7eb !important;
    }
}
/*scrollbars*/
* {
    scrollbar-width: thin;
    scrollbar-color: #0d6efd white;
}
    /* Works on Chrome, Edge, and Safari */
    *::-webkit-scrollbar {
        width: 8px;
        height: 8px
    }

    *::-webkit-scrollbar-track {
        background: white;
        border-left: 1px solid #ccc;
        border-top: 0;
    }

    *::-webkit-scrollbar-thumb {
        background-color: #0d6efd;
        border-radius: 0;
        border: 0px solid white;
    }

.spinner {
    text-align: center;
    height: 100%;
    position: Fixed;
    width: 100%;
    left: 50%;
    top: 0;
    transition: all 1s;
    pointer-events: none
}

.spinner-border {
    margin-top: auto;
    margin-bottom: auto;
}

.spinner {
    text-align: center;
    height: 100%;
    position: Fixed;
    width: 100%;
    left: 0 !important;
    top: 0;
    z-index: 999;
}

.cardListImage {
    width: 100%;
}

.blogListImage {
    height: 100%;
}

/* site sepecific */

.br-4 {
    border-radius: 4px;
}

.br-8 {
    border-radius: 8px !important;
}

.br-20 {
    border-radius: 20px;
}

.br-12 {
    border-radius: 12px;
}

@media(min-width: 991px) {
    .br-lg-12 {
        border-radius: 12px;
    }

    .br-lg-8 {
        border-radius: 8px !important;
    }
}

@media(min-width: 767px) {
    .w-md-auto {
        width: auto !important;
    }
}

@media(min-width: 380px) {
    @media(max-width: 767px) {
        .col-xs-6 {
            flex: 0 0 auto;
            width: 50%;
        }
    }
}

.gap-32 {
    gap: 32px;
}

.gap-52 {
    gap: 52px;
}

.pt-12 {
    padding-top: 12px !important;
}

.border-top-1 {
    border-top: 1px solid var(--subtext-grey);
}

.BGGray {
    background-color: #ededed
}

.bg-light-purple {
    background: var(--purple-bg-light);
}

.bg-purple {
    background: var(--purple-base);
}

.colContent {
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.dropdown-menu li label {
    padding-left: 10px
}

.btn-light {
    background: var(--header-text-white);
    border: 1px solid;
    border-color: var(--subtext-grey);
    padding: 8px 12px;
    border-radius: 4px;
    color: var(--body-text);
    text-decoration: none;
    display: inline-block;
}
.btn-light:hover{
    background: var(--purple-bg-light);
    border-color: var(--purple-base);
}
.btn-purple {
    background: var(--purple-base);
    border: 1px solid;
    border-color: var(--purple-header-text);
    padding: 8px 12px;
    border-radius: 8px;
    color: var(--header-text-white);
    text-decoration: none;
}

    .btn-purple:hover {
        background: var(--purple-dark);
        color: var(--header-text-white);
    }

.alert {
    border-radius: 0;
}

.p-20 {
    padding: 20px !important;
}

.py-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
}

.px-20 {
    padding-left: 20px !important;
    padding-right: 20px !important;
}

.pt-20 {
    padding-top: 20px !important;
}

.pb-20 {
    padding-bottom: 20px !important;
}

.ps-20 {
    padding-left: 20px !important;
}

.pe-20 {
    padding-right: 20px !important;
}

.mb-32 {
    margin-bottom: 32px !important;
}

.h-372 {
    height: 362px;
}
.min-h-372{
    min-height: 372px;
}
.h-120 {
    height: 120px;
}
.h-200 {
    height: 200px;
}
.h-168 img {
    height: 168px;
    width: 100%;
    object-fit: cover;
}

.h-372 picture img, .min-h-372 picture img {
    max-height: 100%;
    width: 100%;
    object-fit: cover;
    height: 100%;
}

.mw-210 {
    max-width: 210px;
}

.w-207 {
    width: 207px;
}

.w-fill-rest {
    width: calc(100% - 207px);
    padding-top: 84px;
}

.w-207:has(nav.navbar) {
    width: 300px;
}
@media(min-width: 992px) {
    .w-207:has(nav.navbar) + .w-fill-rest {
        width: calc(100% - 300px);
        padding-top: 84px;
    }
}
    .w-207 {
        border-right: 1px solid var(--subtext-grey);
    }

    .w-247 {
        width: 247px;
    }

    .w-178 {
        width: 178px;
    }

    .width-100vw {
        height: auto;
        width: 100vw;
        max-width: calc(100vw - 5px);
        margin-left: calc(50% - 50vw);
    }

    .row:has(.has-sticky.w-207 nav.navbar.navbar-default) .w-fill-rest {
        padding-top: 10px;
    }

    @media(min-width: 991px) {
        .w-lg-178 {
            width: 178px;
        }

        .w-lg-247 {
            width: 247px;
        }

        .width-lg-100vw {
            height: auto;
            width: 100vw;
            max-width: calc(100vw - 5px);
            margin-left: calc(50% - 50vw);
        }

        .w-lg-435 {
            max-width: 435px !important;
        }

        .portalWrapper:has(.w-lg-247 > div:empty) .w-lg-247 {
            width: 0 !important;
        }

        .portalWrapper:has(.w-lg-178 > div:empty) .w-lg-178 {
            width: 0 !important;
        }

        .portalWrapper:has(.w-lg-247 > div:empty) .w-flex-portal {
            width: calc(100% - 178px) !important
        }

        .portalWrapper:has(.w-lg-247 > div:empty):has(.w-lg-178 > div:empty) .w-flex-portal {
            width: calc(100%) !important
        }
    }

    .w-42 {
        width: 42px;
    }

    @media(max-width: 991px) {
        .w-207:has(nav.navbar.navbar-default) {
            width: 100%;
            border-right: none;
            padding-left: 0;
            padding-right: 0;
        }

        .w-207 .dropdown-item.active, .w-207 .dropdown-item:active {
            font-weight: bold;
            background: transparent;
            color: black;
        }

        .w-207 .active .dropdown-item.active, .w-207 .active .dropdown-item:active {
            color: var(--bs-dropdown-link-hover-color);
            background-color: #F8F1FE;
            font-weight: normal;
        }

        .h-372:has(picture), .min-h-372:has(picture) {
            height: 200px;
        }

        .h-372, .min-h-372 {
            min-height: unset;
            height: auto;
        }

        .width-sm-100vw {
            height: auto;
            width: 100vw;
            max-width: calc(100vw - 5px);
            margin-left: calc(50% - 50vw);
        }
    }

    @media(min-width: 991px) {
        .pos-Right .h-372 picture img {
            border-left: 6px solid var(--orange-bg);
        }

        .pos-Left .h-372 picture img {
            border-right: 6px solid var(--orange-bg);
        }

        .position-lg-static {
            position: static !important;
        }

        .gap-lg-32 {
            gap: 32px;
        }

        .position-lg-sticky {
            position: -webkit-sticky !important;
            position: sticky !important;
        }

        .border-lg-1 {
            border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
        }
    }

    .overline {
        font-size: var(--font-body-small);
        color: var(--purple-base);
        font-weight: 500;
        font-family: 'Commissioner-Medium';
        margin-bottom: 20px;
    }

        .overline:before {
            content: "";
            display: inline-block;
            width: 16px;
            height: 16px;
            background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_4765_16302)'%3E%3Cpath d='M0 5.10494V5.18594H0.500577L3.23822 7.99394L0.502257 10.7994H0V10.8795H3.15591L5.96829 7.99394L3.15045 5.10278L0 5.10494Z' fill='%23D0C1DD'/%3E%3Cpath d='M5.01501 -0.0285034V0.0593948L5.51811 0.0589639L13.2531 7.99091L5.51811 15.9254H5.01585V16.0077L8.1684 16.0082L15.9832 7.99091L8.16798 -0.0285034H5.01501Z' fill='%238159A4'/%3E%3Cpath d='M2.55872 2.53564V2.62354L3.06181 2.62268L8.29814 7.99093L3.09625 13.326H2.59399V13.4087L5.74654 13.4092L11.0278 7.99093L5.71168 2.53564H2.55872Z' fill='%23A083BB'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_4765_16302'%3E%3Crect width='16' height='16' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
            background-repeat: no-repeat;
            background-position: center;
            margin-right: 8px;
            margin-bottom: -3px;
        }

    .no-nav .carousel-control-prev, .no-nav .carousel-control-next {
        display: none;
    }

    .carousel.no-nav:has(.carousel-indicators) {
        margin-bottom: 176px;
    }

    .event-tag a {
        color: inherit;
        text-decoration: none;
    }
    /* #endregion*/

    /* #region Banner specific */
    .banner-wrapper h3 {
        font-size: var(--font-card-header);
        font-weight: 700;
        margin-bottom: 32px;
    }

    .banner-wrapper p {
        color: var(--subtext-card-grey);
        font-size: var(--font-body);
        margin-bottom: 32px;
    }
    /*paddings for text in banners that have p-0 class */
    .col-sm-12.p-0 .card-wrapper {
        padding-left: 20px;
        padding-right: 20px;
    }

    .banner-wrapper.featured-banner {
        background: var(--purple-bg-light);
    }

        .banner-wrapper.featured-banner .card-wrapper {
            padding: 52px 20px;
        }

    @media(min-width: 991px) {
        .banner-wrapper.featured-banner .card-wrapper {
            width: 435px;
            margin: auto;
            padding: 52px 0;
        }

        .banner-wrapper h3 {
            margin-bottom: 52px;
        }

        .banner-wrapper p {
            margin-bottom: 52px;
        }
    }

    .featured-banner:not(.no-img-banner) .col-lg-6:has(.card-wrapper) {
        position: relative;
        overflow: hidden;
    }

        .featured-banner:not(.no-img-banner) .col-lg-6:has(.card-wrapper):before {
            content: "";
            position: absolute;
            display: inline-block;
            background-image: url(/Assets/CASN/Images/banner/stripes-bottom.svg);
            width: 320px;
            height: 155px;
            bottom: 0;
            left: -200px;
        }

    @media(max-width: 991px) {
        .featured-banner:not(.no-img-banner) .col-lg-6:has(.card-wrapper):before {
            /*content: none;*/
            width: 193px;
            height: 96px;
            right: 12px;
            left: unset;
            bottom: -4px;
        }

        .featured-banner:not(.no-img-banner) .col-lg-6:has(.card-wrapper):after {
            content: "";
        }
    }

    .featured-banner .overline:before {
        /*background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.125 1.62506V5.67194C14.6172 5.91803 15 6.57428 15 7.31256C15 8.07819 14.6172 8.73444 14.125 8.98053V13.0001C14.125 13.3555 13.9062 13.6837 13.5781 13.8204C13.25 13.9571 12.8672 13.8751 12.6211 13.629L11.418 12.4258C10.1055 11.1133 8.32812 10.3751 6.46875 10.3751H6.25V13.8751C6.25 14.3672 5.83984 14.7501 5.375 14.7501H3.625C3.13281 14.7501 2.75 14.3672 2.75 13.8751V10.3751C1.76562 10.3751 1 9.60944 1 8.62506V6.00006C1 5.04303 1.76562 4.25006 2.75 4.25006H5.375H6.25H6.46875C8.32812 4.25006 10.1055 3.51178 11.418 2.19928L12.6211 1.0235C12.8672 0.777405 13.25 0.695374 13.5781 0.832092C13.9062 0.968811 14.125 1.29694 14.125 1.62506ZM12.375 3.73053C10.7617 5.20709 8.65625 6.00006 6.46875 6.00006H6.25V8.62506H6.46875C8.65625 8.62506 10.7617 9.44537 12.375 10.9219V7.31256V3.73053Z' fill='%235E3190'/%3E%3C/svg%3E%0A");
    */
        background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_5661_708)'%3E%3Cpath d='M0 5.10494V5.18594H0.500577L3.23822 7.99394L0.502257 10.7994H0V10.8795H3.15591L5.96829 7.99394L3.15045 5.10278L0 5.10494Z' fill='%23D0C1DD'/%3E%3Cpath d='M5.01501 -0.0285645V0.0593337L5.51811 0.0589029L13.2531 7.99085L5.51811 15.9254H5.01585V16.0077L8.1684 16.0081L15.9832 7.99085L8.16798 -0.0285645H5.01501Z' fill='%238159A4'/%3E%3Cpath d='M2.55872 2.53564V2.62354L3.06181 2.62268L8.29814 7.99093L3.09625 13.326H2.59399V13.4087L5.74654 13.4092L11.0278 7.99093L5.71168 2.53564H2.55872Z' fill='%23A083BB'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_5661_708'%3E%3Crect width='16' height='16' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
    }

    .featured-banner h3 {
        font-size: var(--font-banner-header);
    }

    .no-img-banner.featured-banner h3 {
        color: var(--subtext-card-grey);
        font-size: var(--font-card-header);
    }

    .no-img-banner {
        padding: 52px 32px;
    }

        .no-img-banner .card-body {
            max-width: 662px;
        }

        .no-img-banner:before, .no-img-banner:after {
            content: "";
            position: absolute;
            width: 205px;
            height: 100px;
            background-repeat: no-repeat;
            background-position: center;
            background-size: cover;
        }

        .no-img-banner:before {
            background-image: url(/Assets/CASN/Images/banner/stripes-top.svg);
            top: 0;
            left: 100px;
        }

        .no-img-banner:after {
            background-image: url(/Assets/CASN/Images/banner/stripes-bottom.svg);
            bottom: 0;
            right: 100px;
        }

    @media(max-width: 991px) {
        .no-img-banner {
            padding-right: 20px;
            padding-left: 20px;
        }

            .no-img-banner:before, .no-img-banner:after {
                width: 172px;
                height: 85px;
            }

            .no-img-banner:before {
                top: -20px;
                left: 0;
            }

            .no-img-banner:after {
                right: 0;
                bottom: -20px;
            }
    }

    .article-banner {
        background: var(--purple-base);
    }

    .homepage-banner .banner-content {
        padding: 52px 40px;
        /*padding-bottom: 152px;*/
    }

    .article-banner .banner-content {
        padding: 84px 0px;
        max-width: 775px;
        padding-left: 113px;
        align-content: center;
    }

    .homepage-banner .banner-content {
        order: 1;
    }


        .homepage-banner .banner-content:after, .article-banner .banner-content:after {
            content: "";
            position: absolute;
            width: 321px;
            height: 182px;
            right: -115px;
            bottom: 0;
            background-repeat: no-repeat;
            background-position: center;
            background-size: cover;
            background-image: url(/Assets/CASN/Images/banner/StripesFull.svg);
        }

    @media(max-width: 600px) {
        .homepage-banner .banner-content:after, .article-banner .banner-content:after {
            background-image: none;
        }
    }


    .article-banner .banner-content:after {
        left: 0;
        z-index: 0;
    }

    @media(max-width: 991px) {
        .article-banner .banner-content {
            order: -1;
            padding: 84px 20px;
            padding-left: 20px;
        }

            .article-banner .banner-content:after {
                left: unset;
                right: 0;
                width: 193px;
                height: 113px;
            }

        .homepage-banner .img-fluid, .article-banner .img-fluid {
            height: 300px !important;
        }
    }

    .article-banner .banner-content h2, .article-banner .banner-content p {
        position: relative;
        z-index: 2;
    }

    .homepage-banner .banner-content h2 {
        font-weight: 700;
        font-size: var(--font-title);
        line-height: 40px;
        margin-bottom: 20px;
    }

    .homepage-banner .banner-content p, .homepage-banner .banner-content * {
        font-size: var(--font-body);
        font-weight: 350;
        line-height: 24px;
        position: relative;
        z-index: 2;
        margin-bottom: 0;
        color: var(--subtext-grey)
    }

    .homepage-banner .banner-content a {
        margin-top: 52px;
        display: inline-block;
    }

    .homepage-banner .img-fluid, .article-banner .img-fluid {
        max-height: 100%;
        width: 100%;
        height: 500px;
        object-fit: cover;
    }

    @media(min-width: 991px) {
        .homepage-banner .img-fluid, .article-banner .img-fluid {
            border-bottom: 8px solid var(--orange-bg);
        }
    }

    .no-nav:has(.homepage-banner) .carousel-indicators {
        bottom: -136px;
        height: 136px;
        margin: 0;
        padding: 0;
        background: var(--purple-dark);
        align-content: center;
        overflow-x: auto;
    }

    @media(min-width: 991px) {
        .no-nav:has(.homepage-banner) .carousel-indicators {
            bottom: -176px;
            height: 176px;
        }
    }

    .carousel-indicators-background {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 32px;
        padding: 0 20px;
        width: max-content;
    }

        .carousel-indicators-background > div {
            max-width: 243px;
            min-width: 70%;
        }

    .carousel-indicators [data-bs-target] {
        background-size: cover;
        min-width: 65px;
        min-height: 40px;
        border: none;
        border-radius: 4px;
        border-left: 4px solid var(--orange-bg);
    }

    .carousel.no-nav div.carousel-indicators p {
        line-height: 24px;
    }

    .carousel.no-nav div.carousel-indicators p {
        color: var(--subtext-grey);
    }

    .carousel.no-nav div.carousel-indicators .d-flex:has(.thumbnail.active) p {
        color: white;
    }

    .carousel:not(:has(.carousel-inner .carousel-item:nth-child(2))) #toggleCarousel {
        display: none;
    }

    @media(min-width: 767px) {
        .homepage-banner .banner-content h2 {
            line-height: 68px;
        }

        .carousel-indicators-background > div {
            min-width: 50%;
        }

        .homepage-banner .banner-content {
            padding-bottom: 102px;
        }
    }

    @media(min-width: 992px) {
        .homepage-banner {
            padding-left: 84px;
        }

            .homepage-banner .img-fluid {
                width: 50vw;
                max-width: calc(50vw - 7px);
                /*            border-left: 8px solid var(--orange-bg);
*/ border-bottom: none;
            }

        .article-banner .img-fluid {
            border-right: 8px solid var(--orange-bg);
            border-bottom: none;
        }

        .homepage-banner .banner-content {
            order: -1;
            padding: 0;
            /*  padding-top: 84px;
        padding-bottom: 84px;*/

            padding-left: 0;
            padding-right: 113px;
            padding-top: 15px;
            padding-bottom: 15px;
        }
    }

    .carousel-indicators-background {
        justify-content: center;
    }

        .carousel-indicators-background > div {
            max-width: 243px;
            min-width: 243px;
        }
}

@media(max-width: 991px) {
    .article-banner .img-fluid {
        border-top: 8px solid var(--orange-bg);
        border-bottom: none;
    }
}


/* #endregion*/

/* #region Article Body css*/

.article-body .row {
    margin: auto;
}

.article-body .col-info p, .article-banner .carousel-caption-text p {
    font-size: 14px;
}

.article-body .col-info p {
    color: var(--body-subtext);
}

.article-banner .carousel-caption-text p:before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M8 14.75C5.48438 14.75 3.1875 13.4375 1.92969 11.25C0.671875 9.08984 0.671875 6.4375 1.92969 4.25C3.1875 2.08984 5.48438 0.75 8 0.75C10.4883 0.75 12.7852 2.08984 14.043 4.25C15.3008 6.4375 15.3008 9.08984 14.043 11.25C12.7852 13.4375 10.4883 14.75 8 14.75ZM10.7617 4.57812C10.3516 4.16797 9.64062 4.16797 9.23047 4.57812L8.62891 5.17969L10.5703 7.12109L11.1719 6.51953C11.582 6.08203 11.582 5.39844 11.1719 4.98828L10.7617 4.57812ZM5.12891 8.65234C5.01953 8.76172 4.9375 8.92578 4.91016 9.0625L4.5 10.7031C4.47266 10.8672 4.5 11.0312 4.60938 11.1406C4.71875 11.25 4.88281 11.2773 5.01953 11.25L6.6875 10.8398C6.82422 10.7852 6.96094 10.7031 7.07031 10.5938L9.96875 7.72266L8.02734 5.78125L5.12891 8.65234Z' fill='%23FFA500'/%3E%3C/svg%3E%0A");
    margin-bottom: -3px;
    margin-right: 4px;
}

.article-body .col-info > div {
    background: var(--purple-bg-light);
    border-radius: 4px;
    padding: 20px;
}
.article-body .col-info > div:not(:has(div)){
    display: none;
}
.article-body {
    padding: 0 20px;
}

@media (min-width: 992px) {
    .article-body {
        padding: 0;
    }

        .article-body .col-info {
            max-width: 321px;
        }

        .article-body .col-content {
            max-width: 662px;
            margin-left: auto;
            margin-right: auto;
        }
}

.article-banner.carousel-inner {
    height: auto;
    width: 100vw;
    max-width: calc(100vw - 5px);
    margin-left: calc(50% - 50vw);
}

.article-body .col-content p, .article-body .col-content h3 {
    margin-bottom: 32px;
}


/* Style for common table in content*/
table.common-content-table {
    width: 100%;
    border-collapse: collapse;
    text-align: left;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
}

@media(max-width: 767px) {
    table.common-content-table {
        min-width: 600px;
    }
}

table.common-content-table thead {
    color: #1a1a1a;
}

    table.common-content-table thead tr {
        background-color: #f5edf9;
        border-bottom: 1px solid #ddd;
    }

table.common-content-table th {
    padding: 10px;
    font-weight: bold;
}

table.common-content-table tbody {
    color: #4b4b4b;
}

    table.common-content-table tbody tr {
        border-bottom: 1px solid #ddd;
    }

    table.common-content-table tbody td {
        padding: 10px;
    }

.article-body a {
    color: var(--purple-base);
}
/* #endregion */


/* #region Featured Listings*/
.feature-listing-img img {
    height: 72px;
    width: 72px;
    max-width: 72px;
    max-height: 72px;
    object-fit: cover;
    border-left: 8px solid var(--orange-bg);
    border-radius: 4px;
}

.feature-events-img img {
    height: 168px;
    width: 100%;
    object-fit: cover;
}

.feature.listing .blue-date {
    text-transform: uppercase;
    color: var(--purple-header-text);
    font-family: "Commissioner-Medium";
    font-size: var(--font-body-small);
}

.overflow-ellipsis {
    display: -webkit-box;
    -webkit-line-clamp: 2; /* Limit to 2 lines */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%; /* Adjust based on parent width */
}

.feature.listing .link-arrow {
    font-family: "Commissioner-Medium";
    font-size: var(--font-body-small);
}

.flex-4 > div {
    width: calc(25% - 24px);
}

@media(max-width: 991px) {
    .flex-4 > div {
        width: 100%;
    }

    .flex-4 {
        flex-direction: column !important;
    }
}
/*.overflow-ellipsis {
    display: block;
    max-height: 3em;*/ /* Adjust based on font-size */
/*overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;*/ /* For single-line truncation */
/*}*/
/* #endregion */

/*#region HEADER*/
.purple-bg-light {
    background: var(--purple-bg-light)
}

.pre-nav .navbar-nav .nav-item:last-child a.nav-link {
    padding-right: 0;
}

header .navbar:not(.pre-nav), .announcement-bar {
    width: 100%;
    z-index: 999;
}

header .navbar:not(.pre-nav) {
    padding-top: 20px;
    padding-bottom: 20px;
    background: white;
    border-bottom: 1px solid var(--subtext-grey);
    /* position: unset;*/
}

.fixed .navbar:not(.pre-nav), .fixed .announcement-bar {
    position: fixed;
    top: 0;
}

.navbar-nav .nav-item, .nav-item.dropdown.nav-search {
    border-radius: 12px;
}

@media(max-width: 991px) {
    .navbar-nav .nav-item:has(.nav-donate) {
        order: -3;
    }

    .navbar-nav .nav-item:has(.nav-shop) {
        order: -2;
    }
    .order-start{
        order: -1;
    }
}

.nav-item.dropdown.nav-search {
    width: 40px;
}

@media(min-width: 991px) {
    nav:not(.pre-nav) .navbar-nav .nav-item:hover, .nav-item.dropdown.nav-search:hover, nav:not(.pre-nav) .navbar-nav .nav-item:has(.nav-link.show) {
        background: var(--purple-bg-light)
    }
}

.nav-search svg {
    height: 16px;
    width: 22px;
}

.navbar-collapse {
    flex-grow: 0;
}

@media(max-width: 991px) {
    .navbar-collapse {
        position: absolute;
        top: 50px;
        background: white;
        width: calc(100vw);
        right: -16px;
        max-height: calc(100vh - 139px - 73px);
        position: fixed;
        left: 0;
        top: 80px;
        /*        overflow-y: scroll;
*/
    }
    .navbar-nav {overflow-y:scroll}
}

nav.navbar a:not(.btn) {
    text-decoration: none;
    color: var(--body-text);
    font-size: 14px;
    line-height: 24px;
    white-space: nowrap;
    display: flex;
}

    nav.navbar a:not(.btn):after {
        color: var(--purple-dark);
    }

nav.pre-nav li.nav-item > a:not(.btn) {
    color: var(--purple-base);
}

.btn-login {
    font-size: 14px;
    padding: 4px 8px;
    line-height: 20px;
    white-space: nowrap
}

.navbar-expand-lg .navbar-nav .nav-link:not(.second-level) {
    padding: 8px 12px;
}

.pre-nav .navbar-nav .nav-link:not(.second-level) {
    padding: 0 12px;
}

@media(min-width: 991px) {
    .btn-login:before {
        content: "";
        display: inline-block;
        width: 16px;
        height: 16px;
        background-image: url('data:image/svg+xml;utf8,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M11.9102 11.2773C11.2812 10.2109 10.1602 9.5 8.875 9.5H7.125C5.8125 9.5 4.69141 10.2109 4.08984 11.2773C5.04688 12.3438 6.44141 13 8 13C9.53125 13 10.9258 12.3438 11.9102 11.2773ZM1 7.75C1 5.26172 2.3125 2.96484 4.5 1.70703C6.66016 0.449219 9.3125 0.449219 11.5 1.70703C13.6602 2.96484 15 5.26172 15 7.75C15 10.2656 13.6602 12.5625 11.5 13.8203C9.3125 15.0781 6.66016 15.0781 4.5 13.8203C2.3125 12.5625 1 10.2656 1 7.75ZM8 8.1875C8.68359 8.1875 9.33984 7.83203 9.69531 7.20312C10.0508 6.60156 10.0508 5.86328 9.69531 5.23438C9.33984 4.63281 8.68359 4.25 8 4.25C7.28906 4.25 6.63281 4.63281 6.27734 5.23438C5.92188 5.86328 5.92188 6.60156 6.27734 7.20312C6.63281 7.83203 7.28906 8.1875 8 8.1875Z" fill="white"/> </svg> ');
        background-repeat: no-repeat;
        background-position: center;
        margin-right: 4px;
        margin-bottom: -4px;
    }
}

/* For dropdown menus */

@media(min-width: 991px) {
    nav .nav-item .dropdown-menu:not(.second-level-dropdown) .container, nav .nav-item .dropdown-menu:not(.second-level-dropdown) .container-lg {
        padding: 52px 0;
        padding-bottom: 32px;
        padding-right: 205px !important;
        margin: auto;
        width: 100vw;
        display: flex;
        flex-wrap: wrap;
    }

    nav .nav-item .dropdown-menu:not(.second-level-dropdown) {
        margin: 0;
        width: 100%;
        padding: 0;
        border-radius: 0;
        border-left: none;
    }

    nav .nav-item:not(.nav-search) .dropdown-menu:not(.second-level-dropdown) {
        background: url(/Assets/CASN/Images/Logos/Rectangle.png) no-repeat right center;
        background-color: white;
        background-size: 405px 100%;
    }

    nav .dropdown-item:focus, .dropdown-item:hover {
        background: transparent;
    }

    nav .dropdown-menu:not(.second-level-dropdown) .container > li {
        width: 321px;
    }

    nav .nav-item .dropdown-menu ul {
        flex: 1;
        list-style: none;
        padding: 0;
    }

    .w-321 li {
        min-width: 321px;
    }

    nav .nav-item .dropdown-menu ul li a {
        display: block;
        text-decoration: none;
        color: var(--subtext-card-grey);
    }

    nav .nav-item .dropdown-menu:not(.second-level-dropdown) ul li a:hover, nav .dropdown-menu:not(.second-level-dropdown) li a:hover {
        color: var(--purple-dark);
    }

    nav .nav-item.dropdown {
        position: initial;
    }

    nav .dropdown-menu:not(.second-level-dropdown) .show {
        display: flex;
    }

    nav .dropdown-menu:not(.second-level-dropdown) .dropdown {
        margin-bottom: 20px;
    }
}


nav .dropdown-menu li a {
    color: var(--body-text);
    padding: 0;
    margin-bottom: 20px;
    font-weight: 500;
    font-family: 'Commissioner-Medium';
}

nav .dropdown-menu .dropdown ul a {
    color: var(--body-subtext);
    padding: 0;
    margin-bottom: 8px;
    font-weight: 400;
}

.bg-right-img {
    flex: 0 0 405px; /* Fix image width */
    height: auto;
    align-self: flex-start; /* Align image to the top */
}

.navbar-nav-scroll {
    overflow-x: hidden;
}
/*.pre-nav .dropdown-menu[data-bs-popper] {
    width: 300px;
    left: -50%;
}*/

/*body header:has(.alert) .navbar:not(.pre-nav) {
    top: 36px;
}
*/
/* end */


/* styles for search */
.SearchContainer {
    padding: 20px 0 !important;
    margin-top: -2px;
}

    .SearchContainer span {
        width: 100%;
    }

    .SearchContainer input {
        width: calc(100% - 56px);
        padding: 0;
        font-size: 16px;
        height: 40px;
        background: transparent;
    }

        .SearchContainer input.SearchText, .SearchContainer input.SearchText:focus {
            border: none;
            outline: none;
        }

.nav-search .SearchText {
    font-weight: 400;
}

.SearchContainer span:after {
    content: "\f00d";
    font-size: 16px;
    cursor: pointer;
}

.nav-search .dropdown-menu:hover {
    background: var(--purple-bg-light);
}

body:has(header .dropdown-menu.shadow.show) {
    overflow: hidden;
}

body:after {
    content: "";
    position: absolute;
    z-index: 50;
    height: 100%;
    width: 100%;
    background: black;
    top: 0;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

body:has(header .dropdown-menu.shadow.show):after {
    pointer-events: all;
    opacity: 0.5;
}

.dropdown-menu {
    top: 100%;
    left: 0;
    background: transparent;
}

    .dropdown-menu.fade-anim {
        opacity: 0;
        transition: opacity 0.3s ease;
        display: block; /* prevent Bootstrap from setting display:none */
        pointer-events: none; /* prevent clicks when invisible */
    }

        .dropdown-menu.fade-anim.showing,
        .dropdown-menu.fade-anim.show {
            opacity: 1;
            pointer-events: auto;
        }

@media(max-width: 991px) {
    .navbar-expand-lg .navbar-nav .nav-link {
        font-family: 'Commissioner-Medium';
        border-bottom: 1px solid var(--subtext-grey);
        border-top: none;
    }

    nav .dropdown-menu li a {
        font-family: 'Commissioner-Regular';
        border-bottom: 1px solid var(--subtext-grey);
        border-top: none;
    }
}

@media(max-width: 991px) {
    .navbar-expand-lg .navbar-nav .nav-link:not(.second-level) {
        padding: 20px 32px 20px 20px;
    }

    nav.navbar a:not(.btn):after {
        right: 20px;
        position: absolute;
    }

    .navbar-toggler {
        order: 1;
        height: 40px;
    }

        .navbar-toggler[aria-expanded="false"] .fa-xmark, .navbar-toggler[aria-expanded="true"] .fa-bars {
            display: none;
        }

        .navbar-toggler:hover {
            background: #F8F1FE;
        }

    .btn-login {
        padding: 9px 8px;
    }

    .dropdown-menu.show {
        border: none;
    }

        .dropdown-menu.show a {
            padding: 20px 32px 20px 52px;
            margin: 0;
        }

        .dropdown-menu.show ul {
            list-style: none;
            margin: 0;
            padding: 0;
        }

    nav .dropdown-menu .dropdown ul a {
        padding: 20px 32px 20px 52px;
        margin: 0;
        color: var(--body-text);
        background: var(--purple-bg-light);
    }

    .dropdown-menu.shadow {
        box-shadow: none !important;
        width: 100vw !important;
        right: -16px;
        top: 63px;
        border-radius: 0;
        padding: 0;
        display: none
    }
    .dropdown-menu.shadow.show{
        display: block;
    }
    .SearchContainer {
        max-width: unset;
        padding-right: 1rem !important;
        padding-left: 1rem !important;
    }

    .nav-item.dropdown.nav-search {
        position: initial;
    }

    nav.navbar .nav-search a:not(.btn) {
    }

    body:has(.navbar-collapse.collapse.show) {
        overflow: hidden;
    }

    body:has(nav:not(.d-none) .navbar-collapse.collapse.show):after {
        content: "";
        position: absolute;
        z-index: 50;
        height: 100%;
        width: 100%;
        background: black;
        top: 0;
        opacity: 0.5;
    }

    header .navbar:not(.pre-nav) {
        height: 89px;
    }
}

.nav-item::marker {
    content: "";
}
/*#endregion*/

/*#region FOOTER*/
footer {
    width: 100%;
    background-color: var(--purple-dark);
    padding: 0;
}

    footer .footerContentSection ul {
        padding: 0;
        margin: 0;
    }

        footer .footerContentSection ul li {
            list-style: none;
            margin-bottom: 12px;
            color: white;
        }

            footer .footerContentSection ul li a, footer .footerContentSection ul li {
                font-size: var(--font-body-small);
                font-style: normal;
                font-weight: 400;
                line-height: 23px;
                color: var(--subtext-grey);
                text-decoration: none;
                display: block;
            }

    footer .col-lg-8 .footerContentSection ul li a {
        align-items: center;
        display: flex;
        line-height: 20px;
    }

        footer .col-lg-8 .footerContentSection ul li a:hover {
            color: var(--purple-light);
        }

            footer .col-lg-8 .footerContentSection ul li a:hover:after, nav .nav-item .dropdown-menu ul li a:hover:after, nav .dropdown-menu li a:hover:after {
                content: "\f0da";
                margin-left: 8px;
                transition: opacity 1s ease-in-out;
            }

@media(min-width: 991px) {
    nav .dropdown-menu li a:after {
        content: "\f0da";
        transition: all 0.3s !important;
        opacity: 0;
        margin-left: 4px;
    }
    nav .dropdown-menu li a:hover:after {
        margin-left: 8px;
        opacity: 1;
        transition: opacity 1s ease-in-out;
    }
}

@media(max-width: 991px) {
    .navbar-nav.navbar-nav-scroll .nav-item:not(:has(ul)) .nav-link:not(.second-level):hover:after {
        content: "\f0da";
        margin-left: 8px;
        transition: opacity 1s ease-in-out;
        font-family: "Font Awesome 6 Pro";
        font-weight: bold;
    }
}

footer .footerContentSection .h4 {
    font-size: var(--font-body-small) !important;
    font-style: normal;
    font-weight: 500;
    font-family: 'Commissioner-Medium';
    line-height: normal;
}

footer .logo-footer-48 {
    max-height: 48px;
    width: auto;
}

.address-icon:before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url('data:image/svg+xml;utf8,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10.625 13.793L5.375 12.2891V1.73438L10.625 3.23828V13.793ZM11.5 13.7383V3.18359L14.9727 1.78906C15.3828 1.625 15.875 1.92578 15.875 2.39062V11.5508C15.875 11.8242 15.7109 12.0703 15.4375 12.1523L11.5 13.7383ZM0.535156 3.375L4.5 1.78906V12.3438L1 13.7383C0.589844 13.9023 0.125 13.6016 0.125 13.1367V3.97656C0.125 3.70312 0.289062 3.45703 0.535156 3.375Z" fill="%23FFA500"/></svg>');
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 8px;
    margin-bottom: -3px;
}

.phone-icon:before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url('data:image/svg+xml;utf8,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5.48438 1.43359L6.57812 4.05859C6.76953 4.49609 6.66016 5.01562 6.27734 5.31641L4.9375 6.4375C5.83984 8.35156 7.39844 9.91016 9.3125 10.8125L10.4336 9.47266C10.7344 9.08984 11.2539 8.98047 11.6914 9.17188L14.3164 10.2656C14.8359 10.457 15.082 11.0312 14.9453 11.5508L14.2891 13.957C14.1523 14.4219 13.7422 14.75 13.25 14.75C6.46875 14.75 1 9.28125 1 2.5C1 2.00781 1.32812 1.59766 1.79297 1.46094L4.19922 0.804688C4.71875 0.667969 5.29297 0.914062 5.48438 1.43359Z" fill="%23FFA500"/> </svg> ');
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 8px;
    margin-bottom: -3px;
}

.email-icon:before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    background-image: url('data:image/svg+xml;utf8,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.3125 2.5H13.6875C14.3984 2.5 15 3.10156 15 3.8125C15 4.25 14.7812 4.63281 14.4531 4.87891L8.51953 9.33594C8.19141 9.58203 7.78125 9.58203 7.45312 9.33594L1.51953 4.87891C1.19141 4.63281 1 4.25 1 3.8125C1 3.10156 1.57422 2.5 2.3125 2.5ZM1 5.5625L6.93359 10.0469C7.5625 10.5117 8.41016 10.5117 9.03906 10.0469L15 5.5625V11.25C15 12.2344 14.207 13 13.25 13H2.75C1.76562 13 1 12.2344 1 11.25V5.5625Z" fill="%23FFA500"/> </svg> ');
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 8px;
    margin-bottom: -3px;
}

.btn-donate:before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url('data:image/svg+xml;utf8,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M3.46875 11.4062C2.53125 10.5312 2 9.28125 2 7.96875V7.8125C2 5.625 3.5625 3.75 5.71875 3.40625C7.15625 3.15625 8.59375 3.625 9.625 4.625L10 5L10.375 4.625C11.375 3.625 12.8438 3.15625 14.25 3.40625C16.4062 3.75 18 5.625 18 7.8125V7.96875C18 9.28125 17.4375 10.5312 16.5 11.4062L10.8438 16.6875C10.625 16.9062 10.3125 17 10 17C9.65625 17 9.34375 16.9062 9.125 16.6875L3.46875 11.4062Z" fill="white"/> </svg> ');
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 4px;
    margin-bottom: -4px;
}

footer.postfooter {
    background: var(--purple-base);
    overflow: hidden;
}

    footer.postfooter .footerBannerImg {
        width: auto;
        height: 100%;
        object-fit: cover;
        border-left: 8px solid var(--orange-bg);
    }

    footer.postfooter .prefooter-bg {
        position: relative;
    }

        footer.postfooter .prefooter-bg svg {
            position: absolute;
            right: calc(-50% + 168px);
            bottom: calc(-50px);
        }

    footer.postfooter h3 {
        color: var(--header-text-white);
    }

.mw-435 {
    max-width: 435px;
}

.bg-primary-purple {
    background: var(--purple-dark);
}

footer.postfooter .bg-primary-purple p {
    padding-top: 12px;
    padding-bottom: 12px;
    margin: 0;
}

@media(max-width: 991px) {
    footer.postfooter .prefooter-bg svg {
        position: absolute;
        width: 190px;
        right: 0;
        bottom: calc(-80px);
    }

    footer.postfooter .footerBannerImg {
        border-left: 0px solid var(--orange-bg);
        border-top: 8px solid var(--orange-bg);
        height: 250px;
        width: 100%;
    }
}
/*#endregion*/

/* #region SideBar*/

aside.sidebar-panel.fixedHeight {
    max-width: 207px;
}

    aside.sidebar-panel.fixedHeight ul {
        list-style: none;
        padding: 0;
    }

        aside.sidebar-panel.fixedHeight ul li button, aside.sidebar-panel.fixedHeight ul li a {
            text-align: left;
            padding: 20px;
            border-radius: 0;
            margin-bottom: 12px;
            font-size: var(--font-body);
            color: var(--body-text);
            line-height: 24px;
            font-family: 'Commissioner-Medium';
            font-weight: 500;
            border-left: 4px solid transparent;
            cursor: pointer;
        }
        aside.sidebar-panel.fixedHeight ul li a:after{
            content: "\f061";
            font-family: 'Font Awesome 6 Pro';
            /*padding-left: 4px;*/
            content: "";
        }
        aside.sidebar-panel.fixedHeight ul li a:hover{
            text-decoration: underline;

        }
            aside.sidebar-panel.fixedHeight ul li button:hover, aside.sidebar-panel.fixedHeight ul li button:focus {
                background: var(--purple-bg-light);
                border-left: 4px solid var(--purple-bg-action);
            }

            aside.sidebar-panel.fixedHeight ul li button.selected {
                border-left: 4px solid var(--purple-bg-action);
            }
            

.fixed .has-sticky > div, .fixed .container-fluid:has(.subInPageNav) {
    position: sticky;
}

.fixed .has-sticky:has(.subInPageNav) {
    max-width: unset;
    position: sticky;
    /*top: 123px;*/
    z-index: 10;
    width: 100vw;
    padding: 0;
    margin: 0;
    left: 0;
    margin-left: calc(50% - 50vw);
}

aside.sidebar-panel.fixedHeight ul li:nth-child(1) {
    margin-top: 24px;
}



.w-fill-rest > div {
    max-width: 662px;
    margin: auto;
}
.w-fill-rest > div:has(iframe), .w-fill-rest > div:has(.full-width){
    max-width: 100%;
    margin-left: 32px;
}
@media(max-width: 991px) {
    .w-fill-rest {
        width: calc(100%);
        padding-top: 52px;
    }
}

.container-fluid:has(.subInPageNav), .subInPageNav {
    z-index: 1;
    /*height: 48px;*/
    display: flex;
    justify-content: center;
    text-align: center;
    align-items: center;
    border-bottom: 1px solid var(--subtext-grey);
    background: var(--header-text-white);
}
.subInPageNav .horizontal-nav a {
    padding: 8px;
    text-decoration: none;
    font-size: var(--font-body-small);
    color: var(--body-text);
    border-radius: 4px;
    border: 1px solid #efefef;
    max-width: 250px;
    text-overflow: ellipsis;
    overflow: hidden;
}

    .subInPageNav .horizontal-nav.current a, .subInPageNav .horizontal-nav:hover a {
        background: var(--purple-base);
        color: var(--header-text-white);
    }

    .subInPageNav .horizontal-nav:hover a {
        background: var(--purple-dark);
        color: var(--header-text-white);
    }
    .subInPageNav .d-flex {
    overflow-x: auto;
    flex-wrap: wrap;
  
}

.subInPageNav .d-flex::-webkit-scrollbar {
    display: none; /* Chrome, Safari */
}

.horizontal-nav {
    white-space: nowrap;
    flex: 0 0 auto;
}

.horizontal-nav a {
    word-break: keep-all;
    white-space: nowrap;
    display: inline-block;
}
/*#endregion */

/* #region ICONS*/

.testimonial-cover .navigation button.nav-prev:after,
.testimonial-cover .navigation button.nav-next:after,
.breadcrumb-item + .breadcrumb-item::before,
.accordion:not(.accordion-cover-button) .accordion-button::after,
.accordion.accordion-cover-button .accordion-button .h5::after,
.SearchContainer span:before,
.nav-item:has(ul) .nav-link:not(.second-level):after,
.nav-donate:after,
.nav-shop:after,
.SearchContainer span:before,
.link-arrow:before,
footer .col-lg-8 .footerContentSection ul li a:hover:after,
nav .nav-item .dropdown-menu ul li a:hover:after,
nav .dropdown-menu li a:after,
.SearchContainer span:after,
.dropdown-item.second-level:after,
.dropdown-item.second-level.show:after,
.sendIcon:before, .btn-upload:before{
    font-family: "Font Awesome 6 Pro";
    font-weight: bold;
}

.link-arrow:before {
    content: "\f0da";
    margin-right: 8px;
    transition: all 0.3s;
}

.btn-subscribe:before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url('data:image/svg+xml;utf8,<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M16.6875 10.7188L11.6875 15.7188C11.3125 16.125 10.6562 16.125 10.2812 15.7188C9.875 15.3438 9.875 14.6875 10.2812 14.3125L13.5625 11H4C3.4375 11 3 10.5625 3 10C3 9.46875 3.4375 9 4 9H13.5625L10.2812 5.71875C9.875 5.34375 9.875 4.6875 10.2812 4.3125C10.6562 3.90625 11.3125 3.90625 11.6875 4.3125L16.6875 9.3125C17.0938 9.6875 17.0938 10.3438 16.6875 10.7188Z" fill="white"/> </svg>');
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 4px;
    margin-bottom: -4px;
}

@media(max-width: 991px) {
    .dropdown-item.second-level:after {
        content: "\f0d7";
        margin-left: 8px;
        padding: 0 3px;
    }

    .dropdown-item.second-level.show:after {
        content: "\f0d8";
    }
}

.nav-item:has(ul) .nav-link:not(.second-level):after {
    content: "\f0d7";
    margin-left: 8px;
    padding: 0 3px;
}

.nav-item:has(ul) .nav-link.show:after {
    content: "\f0d8";
}

.SearchContainer span:before {
    content: "\f002";
    margin-right: 12px;
    font-size: 16px;
    top: 2px;
    position: relative;
}

@media(min-width: 991px) {
    .nav-donate:after {
        content: "\f004";
        padding-left: 6px;
    }

    .nav-shop:after {
        content: "\f07a";
        padding-left: 4px;
    }
}

.ic-school:before {
    content: "\e4da" !important;
}

.ic-star:before {
    content: "\f005" !important;
}

.ic-university:before {
    content: "\e56b" !important;
}

.ic-person:before {
    content: "\f007" !important;
}

.ic-email:before {
    content: "\f01c" !important;
}

.ic-phone:before {
    content: "\e1ee" !important;
}

.ic-address:before {
    content: "\f041" !important;
}

.ic-dashboard:before {
    content: "\e1b0" !important;
}

.ic-calendar:before {
    content: "\f133" !important;
}

.alert-dismissible .btn-close {
    background: none;
    padding: 0;
    opacity: 1;
    font-weight: bold;
    top: calc(50% - 9px);
    margin-right: 8px;
    font-family: 'Commissioner-Bold';
}

.announcement-bar {
    /* height: 36px;*/
    padding: 8px 32px;
    align-content: center;
    background: #212121;
    background-image: url(/Assets/CASN/Images/Logos/GlobalAnnouncement.jpg);
    color: var(--header-text-white);
    font-size: 14px;
    line-height: 16px;
    object-fit: cover;
}

    .announcement-bar a {
        color: var(--header-text-white);
    }

.party-horn {
    display: inline-block;
    background-image: url(/Assets/CASN/Images/System/Icon-FA.svg);
    width: 16px;
    height: 16px;
    margin-bottom: -3px;
    margin-right: 4px;
}
/* #endregion */

/* #region breadcrumbs*/
.breadcrumbs-main {
    padding: 12px 0;
    border-bottom: 1px solid var(--subtext-grey);
    background: white;
}
.fixed .breadcrumbs-main {
    border: 0
}
    .breadcrumbs-main a, .breadcrumbs-main span {
        font-size: var(--font-body-small);
        line-height: 20px;
        text-decoration: none;
        color: var(--subtext-card-grey);
        font-family: 'Commissioner-Medium';
    }

    .breadcrumbs-main span {
        color: var(--purple-base);
    }

.breadcrumb-item + .breadcrumb-item::before {
    content: "\f0da";
    float: none;
    font-size: 14px;
    margin-left: 20px;
}

.breadcrumb-item + .breadcrumb-item.active::before {
    color: var(--purple-base);
}

@media(max-width: 767px) {
    .breadcrumbMain {
        display: none;
    }
}
/*#endregion */

/* #region Accordions styles */
.accordion * {
    font-family: Commissioner-Regular;
}

.accordion h5 {
    font-family: Commissioner-Medium;
}

.accordion {
    background: var(--header-text-white);
}

    .accordion .accordion-header .accordion-button {
        font-weight: 700;
        font-size: var(--font-body);
        line-height: 24px;
        border-top: 1px solid var(--subtext-grey) !important;
    }

    .accordion:not(.accordion-cover-button) .accordion-header .accordion-button:hover {
        border-radius: 8px !important;
    }

    .accordion.accordion-cover-button .accordion-header .accordion-button:hover {
        border-top: 1px solid var(--purple-dark) !important;
    }

    .accordion .accordion-header .accordion-button:hover {
        background: var(--purple-bg-light);
    }

.accordion-button, .accordion-body {
    padding: 12px;
}

.accordion-body {
    font-size: var(--font-body);
    line-height: 26px;
    color: var(--subtext-card-grey);
}

.accordion .accordion-item {
    border: none !important;
}

.accordion:not(.accordion-cover-button) .accordion-item {
    margin-bottom: 20px;
}

.accordion .accordion-header .accordion-button {
    font-family: 'Century Gothic';
}

.accordion .accordion-button:not(.collapsed) {
    box-shadow: none;
    background: transparent;
    color: initial;
}

/*.accordion .accordion-button:focus {
    z-index: 3;
    border-color: transparent;
    outline: 0;
    box-shadow: none;
}*/

.accordion:not(.accordion-cover-button) .accordion-button::after, .accordion.accordion-cover-button .accordion-button .h5::after {
    content: "\f0d7";
    border: none;
    background: none;
}

.accordion:not(.accordion-cover-button) .accordion-button:not(.collapsed)::after, .accordion.accordion-cover-button .accordion-button:not(.collapsed) h5::after {
    transform: none;
    content: "\f0d8";
}

.accordion.accordion-cover-button .accordion-button::after {
    content: none;
}

.accordion.accordion-cover-button .accordion-button .h5::after {
    float: right;
    margin-left: auto;
    margin-top: 0;
}

.accordion.accordion-cover-button .accordion-hsub * {
    margin: 0;
}

.accordion.accordion-cover-button .accordion-hsub p {
    font-size: var(--font-body-small);
    font-weight: 400;
    color: var(--body-subtext);
}

.accordion.accordion-cover-button .accordion-body {
    font-size: var(--font-card-header);
    line-height: 36px;
}

.accordion.accordion-cover-button .accordion-button {
    padding: 20px 8px;
}

.accordion.accordion-cover-button .accordion-body .btn-purple {
    font-size: 14px;
    font-weight: 500;
    font-family: 'Commissioner-Medium';
    line-height: 20px;
    text-decoration: none;
}

.accordion.accordion-cover-button .accordion-body .btn-subscribe:before {
    width: 14px;
    height: 14px;
    margin-bottom: -2px;
    margin-right: 6px;
}

.rounded-side img {
    border-radius: 12px;
}

.accordion.accordion-cover-button .accordion-body {
    color: var(--font-body);
}

@media(max-width: 991px) {
    .full-width-module > .row > div:has(picture) {
        order: -1;
        margin-bottom: 52px;
    }

    .accordion.accordion-cover-button .accordion-button {
        padding: 20px 12px;
    }
}

@media(min-width: 991px) {

    .accordion.accordion-cover-button .accordion-button .h5::before {
        content: "";
        display: inline-block;
        width: 24px;
        height: 24px;
        background-image: url('data:image/svg+xml,%3Csvg width="26" height="26" viewBox="0 0 26 26" fill="none" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath d="M1 5C1 2.79086 2.79086 1 5 1H21C23.2091 1 25 2.79086 25 5V21C25 23.2091 23.2091 25 21 25H5C2.79086 25 1 23.2091 1 21V5Z" fill="white"/%3E%3Cpath d="M1 5C1 2.79086 2.79086 1 5 1H21C23.2091 1 25 2.79086 25 5V21C25 23.2091 23.2091 25 21 25H5C2.79086 25 1 23.2091 1 21V5Z" stroke="%23DDDDDD"/%3E%3Cpath d="M9.5 7.0625C9.5 6.35156 10.0742 5.75 10.8125 5.75H15.1875C15.8984 5.75 16.5 6.35156 16.5 7.0625V19.75H14.3125V17.5625C14.3125 16.8516 13.7109 16.25 13 16.25C12.2617 16.25 11.6875 16.8516 11.6875 17.5625V19.75H9.5V7.0625ZM5.5625 8.375H8.625V19.75H5.5625C4.82422 19.75 4.25 19.1758 4.25 18.4375V14.5H6.4375C6.65625 14.5 6.875 14.3086 6.875 14.0625C6.875 13.8438 6.65625 13.625 6.4375 13.625H4.25V11.875H6.4375C6.65625 11.875 6.875 11.6836 6.875 11.4375C6.875 11.2188 6.65625 11 6.4375 11H4.25V9.6875C4.25 8.97656 4.82422 8.375 5.5625 8.375ZM20.4375 8.375C21.1484 8.375 21.75 8.97656 21.75 9.6875V11H19.5625C19.3164 11 19.125 11.2188 19.125 11.4375C19.125 11.6836 19.3164 11.875 19.5625 11.875H21.75V13.625H19.5625C19.3164 13.625 19.125 13.8438 19.125 14.0625C19.125 14.3086 19.3164 14.5 19.5625 14.5H21.75V18.4375C21.75 19.1758 21.1484 19.75 20.4375 19.75H17.375V8.375H20.4375ZM12.7812 7.5C12.5352 7.5 12.3438 7.71875 12.3438 7.9375V8.59375H11.6875C11.4414 8.59375 11.25 8.8125 11.25 9.03125V9.46875C11.25 9.71484 11.4414 9.90625 11.6875 9.90625H12.3438V10.5625C12.3438 10.8086 12.5352 11 12.7812 11H13.2188C13.4375 11 13.6562 10.8086 13.6562 10.5625V9.90625H14.3125C14.5312 9.90625 14.75 9.71484 14.75 9.46875V9.03125C14.75 8.8125 14.5312 8.59375 14.3125 8.59375H13.6562V7.9375C13.6562 7.71875 13.4375 7.5 13.2188 7.5H12.7812Z" fill="%23AA6000"/%3E%3C/svg%3E');
        background-repeat: no-repeat;
        background-position: center;
        margin-right: 8px;
        margin-bottom: -7px;
        border: 1px solid var(--subtext-grey);
        border-radius: 4px;
    }

    .accordion.accordion-cover-button .accordion-hsub p, .accordion.accordion-cover-button .accordion-body {
        padding-left: 32px;
    }
}
/*#endregion */

/* #region Cards*/
.card-hover:hover h4, .card-hover:hover h5 {
    color: var(--purple-base) !important;
}
.card-hover img {
    filter: brightness(0.8);
    transition: all 0.3s;
}
.card-hover:hover img {
    filter: brightness(1);
}
.card-hover:hover a {
    color: var(--purple-header-text) !important;
}
.card-hover:hover .link-arrow:before, .portal-card:hover .link-arrow:before {
    margin-right: 12px;
}
.portal-card:hover {
    color: var(--purple-base);
    background: var(--purple-bg-light);
    border-color: var(--purple-bg-light);
}
.portal-card:hover .bg-light-purple{
    background: var(--purple-base);
}
.portal-card .bg-light-purple span:before {
    color: var(--purple-base);
}
.portal-card:hover .bg-light-purple span:before{
    color: white;
}
/* #endregion */

/*#region Snipcart CSS*/
div#snipcart-main-content {
    font-family: 'Commissioner-Regular';
}

.snip-header, div#snipcart-footer {
    background: var(--purple-base) !important;
}

.snip-header__total {
    background: var(--purple-bg-light) !important;
}

.snip-header__total-label, span#snipcart-amount {
    color: var(--body-text) !important;
}

a.snip-footer__copyright {
    color: var(--header-text-white) !important;
}

b.snip-footer__highlight {
    color: var(--header-text-white) !important;
    text-decoration: underline;
}

.snip-btn.snip-btn--highlight.snip-btn--right, button.snip-btn.snip-btn--right, .snip-btn.snip-btn--left {
    background: var(--purple-base) !important;
    border: 1px solid !important;
    border-color: var(--purple-header-text) !important;
    padding: 0px 14px;
    border-radius: 8px !important;
    color: var(--header-text-white) !important;
    text-decoration: none !important;
}

.snip-btn.snip-btn--highlight.snip-btn--right:hover, button.snip-btn.snip-btn--right:hover, .snip-btn.snip-btn--left:hover {
    background: var(--purple-dark) !important;
    color: var(--header-text-white) !important;
}

.snip-layout .snip-quantity-trigger__btn:hover {
    background-color: var(--purple-light) !important;
}

/*#endregion Snipcart CSS*/

.navLogoImg {
    width: auto;
    max-height: 80px;
    margin-top: -20px;
    margin-bottom: -20px;
}

@media(min-width: 991px) {
    ul.navbar-nav {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        margin: 0 auto;
        padding: 0;
        list-style: none;
    }
    .bl-lg-2 {
        border-left: 8px solid var(--orange-bg);
    }
}

/*#region New nav on left*/ 

    
.w-207 nav.navbar {
    background: #f8f9fa;
    font-family: 'Segoe UI', sans-serif;
}
.w-207:has(nav.navbar){
    padding: 0;
}
.w-207 nav ul.level-one > li {
    margin-bottom: 0.5rem;
}

.w-207 nav .fancy-link {
    display: block;
    padding: 8px 12px;
    border-radius: 6px;
    color: #F8F1FE;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.2s ease-in-out;
}
.w-207 nav .fancy-link:hover,
.w-207 nav .fancy-link:focus {
    background-color: #F8F1FE;
    color: #5E3190;
}

.w-207 nav  .fancy-link.active {
    background-color: #F8F1FE;
    font-weight: 600;
    color: #5E3190;
}

.w-207 nav .active .fancy-link.active {
    background-color: #F8F1FE;
    font-weight: 600;
    border-left: 4px solid #5E3190;
    padding-left: 8px;
    margin-top: 8px;
    margin-bottom: 8px;
}
.w-207 nav.navbar a:not(.btn) {
    text-wrap-mode: wrap;
}
.w-207 nav details {
    padding: 10px 0;
}
.w-207 nav div.level-one li ul, .w-207 nav details ul {
    list-style: none;
    padding-left: 20px;
    margin-top: 0;
    margin-bottom: 0;
}
.w-207 nav details:not(:has(.isContent)) summary{
        display: inline;
}
.w-207 nav div.level-one li ul li {
    margin-bottom: 0.3rem;
}

.w-207 nav div.level-one li ul a.fancy-link {
    padding: 6px 10px;
}

.w-207 nav div.level-one li ul a.fancy-link.active {
    background-color: #F8F1FE;
    color: #5E3190;
}

.w-207 .accordion-outer:has( .accordion-inner .accordion-item li.active) .accordion-button-outer, .w-207 .accordion-inner .accordion-item:has(li.active) .accordion-button-inner {
    background-color: #F8F1FE;
    color: #5E3190;
}
.w-207 .accordion-inner .accordion-item:has(.accordion-button-inner.active) .accordion-body > li > a, .w-207 .accordion-outer .accordion-item:has(.accordion-button-outer.active) .accordion-body-outer:not(:has(.accordion-button-inner.active)) > li > a {
    background-color: #F8F1FE;
    font-weight: 600;
    border-left: 4px solid #5E3190;
    padding-left: 8px;
    margin-top: 0;
    margin-bottom: 8px;
}
.w-207 .accordion-button-outer.active {
    background-color: #F8F1FE;
    font-weight: 600;
    border-left: 4px solid #5E3190;
}
.w-207 .accordion-outer .accordion-item .accordion-header .fancy-link-outer, .w-207 .accordion-outer .accordion-item .accordion-header .accordion-button-outer {
    display: none !important;
}
.w-207 .accordion-outer .accordion-item:not(:has(.accordion-collapse .isContent)) .accordion-header .fancy-link-outer, .w-207 .accordion-outer .accordion-item:has(.accordion-collapse .isContent) .accordion-header .accordion-button-outer {
    display: inline-block !important;
    width: 100%;
    border: none !important;
    padding-right: 24px;
}
.w-207 .accordion-inner .accordion-item .accordion-header .fancy-link-inner, .w-207 .accordion-inner .accordion-item .accordion-header .accordion-button-inner {
    display: none !important;
}

.w-207 .accordion-inner .accordion-item:not(:has(.accordion-collapse .isContent)) .accordion-header .fancy-link-inner, .w-207 .accordion-inner .accordion-item:has(.accordion-collapse .isContent) .accordion-header .accordion-button-inner {
    display: inline-block !important;
    width: 100%;
    border: none !important;
    padding-right: 24px;
}
.w-207 .accordion .accordion-header .accordion-button {
    font-weight: normal;
}
.w-207 .accordion:not(.accordion-cover-button) .accordion-item {
    margin-bottom: 0;
}
.w-207 nav .fancy-link:after {
    color: #5E3190;
    position: absolute;
    right: 0;
    font-size: 12px;
    top: calc(50% - 10px);
}
.w-207 nav .accordion-header {
    line-height: 1;
}
/*.accordion .accordion-item:has(.collapse .isContent) .accordion-header .hideIfNoChildren, .accordion .accordion-item:has(.collapse .isContent) .accordion-header .showIfNoChildren {
    display: block !important;*/
}
.w-240px {
    max-width: 240px;
}

.w-120px {
    max-width: 120px;
}
.accordion-outer > .accordion-item:not(:has(.accordion-collapse .isContent)) .accordion-collapse, .accordion-inner .accordion-collapse:not(:has(ul li)) {
    display: none !important;
}
/*#endregion*/
/* #region OUOUD*/
#sidebar a.current {
    color: #fff;
    background: #553E56;
    margin-bottom: 8px;
    line-height: 1.5em;
}

#sidebar a:not(:last-child) {
    border-bottom: 1px solid #F2E9FF;
}

#sidebar a {
    font-size: 0.9em;
    padding-left: 20px;
    background: none;
}
.fixed #sidebar{
    top: 80px !important
}

/* #endregion*/

.equal-height .card:has(.height-container){
    height: 100% !important;
}
.equal-height .height-container:not(.row), .equal-height .card-body {
    display: flex;
    flex-direction: column;
}
.equal-height .btn-purple {
    margin-top: auto;
}

details.has-children > summary::after {
    content: " ▾";
    font-size: 0.8em;
    margin-left: 4px;
}

.fusion-fullwidth.fullwidth-box.fusion-builder-row-3.fusion-flex-container.nonhundred-percent-fullwidth.non-hundred-percent-height-scrolling .fusion-layout-column.fusion_builder_column .fusion-text li {
    max-width: 100%;
    word-break: break-all;
}

/*.carousel-item-next, .carousel-item-prev, .carousel-item.active {max-height:500px}*/

.advantageBannerPicture.carousel-image-source.h-100   {
    display: flex;
    align-items: center;
}
.carousel-indicators{
    display: block;
}