@font-face {
    font-family: 'BauhausSlimDisplay';
    src: url('../fonts/BauhausSlimDisplay-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'BauhausSlimDisplay';
    src: url('../fonts/BauhausSlimDisplay-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'BauhausSlimDisplay';
    src: url('../fonts/BauhausSlimDisplay-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Signatria';
    src: url('../fonts/Signatria.woff2') format('woff2');
    font-style: normal;
    font-display: swap;
}

:root {
    font-size: 16px;
    /* Brand colors */
    --color-main: #ED5E52;
    --color-sub1: #FDC458;
    --color-sub2: #694879;
    --color-bg1: #05051D;
    /* Buttons & Links */
    --color-main-hover: #C95046;
    --color-sub1-hover: #D7A74B;
    --color-sub2-hover: #914B6A;
    --color-main-hover-light: rgba(237, 94, 82, 0.10);
    --color-sub1-hover-light: rgba(253, 196, 88, 0.10);
    --color-sub2-hover-light: rgba(105, 72, 121, 0.10);
    --font-color-link-hovered: #FFFFFF99;
    /* Support/Notification Colors */
    --success: #0CAC52;
    --error: #F24B4B;
    --warning: #EC9C00;
    --info: #436CF2;
    --neutral: #84848F;
    /* Support/Notification Colors Hover*/
    --success-hover: #0A833F;
    --error-hover: #D83333;
    --warning-hover: #CC8700;
    --info-hover: #2331B7;
    --neutral-hover: #636368;
    /* Support/Notification Colors Hover Light*/
    --success-hover-light: rgba(16, 202, 97, 0.10);
    --error-hover-light: rgba(242, 75, 75, 0.10);
    --warning-hover-light: rgba(251, 172, 19, 0.10);
    --info-hover-light: rgba(35, 49, 183, 0.10);
    --neutral-hover-light: rgba(132, 132, 143, 0.10);
    /* Font colors */
    --font-color-head: #323E56;
    --font-color-sub: #694879;
    --font-color-body: #515B6F;
    --font-color-link: #ED5E52;
    --font-color-visited: #C95046;
    --font-color-inv: #FFFFFF;
    /* UI Colors */
    --color-ui-01: #FFFFFF;
    --color-ui-02: #F9FAFB;
    --color-ui-03: #FAF7F6;
    --color-ui-04: #DFDFDF;
    --color-ui-05: #84848F;
    --color-ui-06: #323E56;
    --color-ui-07: #ED5E52;
    --color-ui-08: #AB587D;
    /* Gradient Background */
    --color-gradient-01: linear-gradient(261deg, #FDC458 2.37%, #EE5D51 102.03%);
    --color-gradient-02: linear-gradient(78deg, #694879 -4.21%, #EE5D51 74.27%, #FDC458 95.93%);
    --gradient-icon: linear-gradient(180deg, #EE5D51 -11.46%, #FDC458 116.87%);
    /* Font family */
    --font-family-01: 'BauhausSlimDisplay', sans-serif;
    /* usually on heading */
    --font-family-02: 'BauhausSlimDisplay', sans-serif;
    /* usually on sub-heading */
    --font-family-03: 'BauhausSlimDisplay', sans-serif;
    --font-family-04: 'Signatria', sans-serif;
    /* usually on paragraph & buttons */
    /* Typography - font size & line height */
    --font-huge: 4.5rem;
    /* 72px */
    --font-xxxx-large: 3rem;
    /* 48px */
    --font-xxx-large: 2.5rem;
    /* 40px */
    --font-xx-large: 2rem;
    /* 32px */
    --font-x-large: 1.5rem;
    /* 24px */
    --font-large: 1.125rem;
    /* 18px */
    --font-medium: 1rem;
    /* 16px */
    --font-small: 0.875rem;
    /* 14px */
    --font-x-small: 0.75rem;
    /* 12px */
    --font-xx-small: 0.625rem;
    /* 10px */
    /* grid / container */
    --gutter: 12px;
    /* 24px divided by 2 */
    --gutter-medium: 20px;
    /* spacers */
    --xxxx-large: 80px;
    --x-large: 40px;
    --large: 32px;
    --medium: 24px;
    /* spacers */
    --container-max-width: 1440px;
    --container-max-width-half: 616px;
    --container-padding-xx-large: 48px;
    --container-padding-x-large: 48px;
    --container-padding-large: 48px;
    --container-padding-medium: 32px;
    --container-padding-small: 24px;
}

@media screen and (max-width: 1023px) {
    :root {
        --xxxx-large: 40px;
    }
}

/* Body Pragraph */

body {
    background-color: var(--color-ui-03);
}

body,
p,
.body-paragraph {
    font-family: var(--font-family-02);
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 150%;
    color: var(--font-color-body);
}

.p-white {
    color: var(--font-color-inv, #FFF);
}

.p-dark {
    color: var(--font-color-body, #575757);
}

.p-long-desc {
    font-size: 18px;
}

.p-two-line {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 14px;
}

body,
header,
footer {
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
}

.body-bold {
    font-family: var(--font-family-02);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    /* 24px */
}

footer {
    position: relative;
}

.bottom-footer {
    padding-bottom: 24px !important;
}

.body-x-small {
    font-family: var(--font-family-02);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 18px */
}

.body-large {
    font-family: var(--font-family-02);
    font-style: normal;
    font-weight: 300;
    font-size: 18px;
    line-height: 150%;
    /* 27px */
}

.body-large-bold {
    /* color: #05051D; */
    text-align: center;
    font-family: var(--font-family-02);
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    /* 27px */
}

.body-xxlarge-bold {
    font-family: var(--font-family-02);
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    /* 48px */
}

.body-xxxlarge-bold {
    font-family: var(--font-family-01);
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    /* 41.6px */
}

.body-small {
    font-family: var(--font-family-02);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 21px */
}

.body-small-bold {
    color: #05051D;
    font-family: var(--font-family-02);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    /* 21px */
}

a.a-label:visited {
    color: var(--color-sub1);
}

a.a-label:link,
a.a-label:visited {
    text-decoration: none;
}

a,
.body-link,
#mega-menu-btn button.ins-button span,
#mega-menu-btn button.blue,
#main-header .ins-dropdown_label {
    font-family: var(--font-family-01);
    color: var(--font-color-link);
    font-weight: 400;
    cursor: pointer;
    transition: ease color 0.2s;
    line-height: var(--font-x-large);
    font-size: 16px;
}

a:hover,
a.color-main:hover,
.body-link:hover {
    color: var(--color-main-hover);
}

/* a:visited,
.body-link:visited {
    color: var(--color-ui-06); to review
} */

a.font-color-head:hover,
a.font-color-body:hover,
a .font-color-head:hover,
a .font-color-body:hover {
    color: var(--color-main);
}

/* Ecommerce - Cart Icon */
.cart-icon {
    position: relative;
    height: 18px;
}

.icon-shopping-cart {
    font-size: 18px;
}

.cart-count {
    display: flex;
    width: 22px;
    height: 22px;
    justify-content: center;
    align-items: center;
    font-family: var(--font-family-01);
    font-size: var(--font-xx-small);
    color: var(--font-color-inv);
    background-color: var(--error);
    position: absolute;
    top: -3px;
    right: -7px;
    line-height: normal;
    border-radius: 50%;
}

.mobile-menu-toggle .cart-count {
    right: -11px;
    top: -7px;
    height: 18px;
    width: 18px;
    font-size: 10px;
    font-weight: 700;
}

/* Heading Styles */

h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
li,
ol,
dl {
    margin-bottom: 0;
}

h1,
.heading-1,
h2,
.heading-2,
h3,
.heading-3,
h4,
.heading-4,
h5,
.heading-5,
h6,
.heading-6 {
    font-family: var(--font-family-01);
    font-weight: 400;
    color: var(--font-color-head);
    line-height: normal;
    margin-top: 0px;
    margin-bottom: 0px;
}

h1,
.heading-1 {
    font-size: 72px;
}

.heading-1-titlepage {
    font-family: var(--font-family-01);
    font-size: 64px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    /* 76.8px */
    letter-spacing: -2px;
    text-align: center;
}

/* Responsive heading for Join Us banner */
@media screen and (max-width: 1023px) {
    .join-us-banner-content .heading-1-titlepage {
        font-size: 48px;
        line-height: 110%;
    }
}

@media screen and (max-width: 767px) {
    .join-us-banner-content .heading-1-titlepage {
        font-size: 46px;
        line-height: 110%;
        word-break: break-word;
    }
}

.heading-1-small {
    font-size: 48px;
}

.heading-1-xsmall {
    font-family: var(--font-family-01);
    font-size: 40px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    /* 48px */
}

.heading-2-x-small {
    font-family: var(--font-family-01);
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    /* 38.4px */
}

.heading-2-xsmall {
    font-size: 32px;
}

.heading-2-xxsmall {
    color: var(--font-color-head);
    font-family: var(--font-family-01);
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    /* 28.8px */
}

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

.heading-2-large {
    font-family: var(--font-family-01);
    font-size: 80px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%;
    /* 88px */
}


h2,
.heading-2 {
    font-family: var(--font-family-01);
    font-size: 56px;
    color: var(--font-color-head);
    font-style: normal;
    font-weight: 600;
    line-height: 110%;
    /* 61.6px */
}

h3,
.heading-3 {
    font-size: var(--font-xxx-large);
}

.heading-3 {
    font-family: var(--font-family-01);
    font-size: 40px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%;
    /* 44px */
}

.heading-3-small {
    font-family: var(--font-family-01);
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%;
    /* 26.4px */
}

.heading-3-xsmall {
    font-family: var(--font-family-01);
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 110%;
    /* 19.8px */
    letter-spacing: 0.18px;
}

h4,
.heading-4 {
    color: var(--color-sub1);
    font-family: var(--font-family-01);
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
}

h5,
.heading-5 {
    color: var(--color-sub1) !important;
    font-family: var(--font-family-01) !important;
    font-size: 20px !important;
    font-style: normal !important;
    font-weight: 600 !important;
    line-height: 130% !important;
    letter-spacing: 0.2px !important;
}

h6,
.heading-6 {
    color: var(--font-color-head, #05051D);
    font-family: var(--font-family-01, "DM Sans");
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 0.16px;
}


img {
    width: 100%;
}

.image-d {
    display: block;
}

.image-m {
    display: none;
}

@media screen and (max-width: 639px) {
    .image-d {
        display: none;
    }

    .image-m {
        display: block;
    }
}


@media screen and (max-width: 639px) {
    h2 {
        font-size: 40px;
    }
}


@media screen and (min-width: 640px) and (max-width: 1023px) {

    h1,
    .heading-1,
    h2,
    .heading-2 {
        font-size: 2rem;
    }
}

@media screen and (max-width: 420px) {

    h1,
    .heading-1 {
        font-size: 2rem;
    }

    .ibt-table-wrap__page {
        margin-top: 0px;
        margin-left: 10px;
        margin-right: 10px;
    }

    .ibt-table-wrap__pagination {
        width: auto;
    }

    .ibt-table-wrap__pagination--option {}
}

.subhead-1 {
    font-family: var(--font-family-01);
    font-size: var(--font-x-small);
    line-height: var(--font-small);
    color: var(--font-color-head);
    font-style: normal;
    font-weight: 700;
    font-size: var(--font-x-small);
}

.subhead-2 {
    font-family: var(--font-family-02);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 1px;
    text-transform: uppercase;
}


/* inner grid container (1024px) */

.inner-wrap {
    max-width: 1024px;
    margin: 0 auto;
}

@media screen and (max-width: 1024px) {
    .inner-wrap {
        max-width: initial;
    }
}

hr {
    max-width: 100%;
    width: 100%;
    margin: 0 auto;
    border-bottom: 1px solid var(--color-ui-04);
}

.subHeading {
    color: var(--font-color-body, #575757) !important;
}

.subHeadingMain {
    font-size: 18px !important;
}

.headingP {
    color: var(--font-color-head, #05051D);
    font-family: var(--font-family-01, "DM Sans");
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}


/**********
[Foundation Style Customization / Overwrite]
**********/


/* Gutter regular */

.grid-padding-x>.cell,
.gutter.grid-padding-x>.cell {
    padding-left: var(--gutter);
    padding-right: var(--gutter);
}

.grid-padding-y>.cell,
.gutter.grid-padding-y>.cell {
    padding-top: var(--gutter);
    padding-bottom: var(--gutter);
}

.grid-container:not(.full) .grid-padding-x,
.grid-container:not(.full) .grid-padding-x.gutter {
    margin-right: calc(-1 * var(--gutter));
    margin-left: calc(-1 * var(--gutter));
}

.grid-container:not(.full) .grid-padding-y,
.grid-container:not(.full) .grid-padding-y.gutter {
    margin-top: calc(-1 * var(--gutter));
    margin-bottom: calc(-1 * var(--gutter));
}


/* Gutter medium */

.gutter-medium.grid-padding-x>.cell {
    padding-left: var(--gutter-medium);
    padding-right: var(--gutter-medium);
}

.gutter-medium.grid-padding-y>.cell {
    padding-top: var(--gutter-medium);
    padding-bottom: var(--gutter-medium);
}

.grid-container:not(.full) .grid-padding-x.gutter-medium {
    margin-right: calc(-1 * var(--gutter-medium));
    margin-left: calc(-1 * var(--gutter-medium));
}

.grid-container:not(.full) .grid-padding-y.gutter-medium {
    margin-top: calc(-1 * var(--gutter-medium));
    margin-bottom: calc(-1 * var(--gutter-medium));
}

@media print,
screen and (min-width: 640px) {
    .grid-padding-x .grid-padding-x {
        margin-right: calc(-1 * var(--gutter));
        margin-left: calc(-1 * var(--gutter));
    }
}

.main-wrap {
    /* min-height: 90vh; */
    /* background: var(--color-ui-03); */
}

.insites-form.insites-form-code .insites-form-buttons ins-button button {
    margin-right: 0px !important;
}

ins-radio-group .radio-horizontal>div {
    gap: 40px !important;
}

.wrapper {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: var(--container-padding-xx-large);
    padding-right: var(--container-padding-xx-large);
}

.wrapper .grid-container {
    max-width: var(--container-max-width);
    position: relative;
    padding-left: 0;
    padding-right: 0;
    margin: 0 !important;
    max-width: 100%;
}

.wrapper .wrapper {
    padding-left: 0;
    padding-right: 0;
}

@media screen and (min-width: 1440px) {
    .wrapper {
        padding-left: var(--container-padding-xx-large);
        padding-right: var(--container-padding-xx-large);
    }
}

@media screen and (min-width: 1200px) and (max-width: 1439px) {
    .wrapper {
        padding-left: var(--container-padding-x-large);
        padding-right: var(--container-padding-x-large);
    }
}

@media screen and (min-width: 1024px) and (max-width: 1199px) {
    .wrapper {
        padding-left: var(--container-padding-large);
        padding-right: var(--container-padding-large);
    }
}

@media screen and (min-width: 640px) and (max-width: 1023px) {
    .wrapper {
        padding-left: var(--container-padding-medium);
        padding-right: var(--container-padding-medium);
    }
}

@media screen and (max-width: 639px) {
    .wrapper {
        padding-left: var(--container-padding-small);
        padding-right: var(--container-padding-small);
    }
}

.grid-container-half {
    max-width: var(--container-max-width-half);
}

/* Full banner layout (Use this on full width banner contents inorder for the layout margin/padding to be applied inside of the banner */

@media screen and (min-width: 1440px) {
    .full-width-banner-content-left-only {
        padding-left: var(--container-padding-xx-large);
    }

    .full-width-banner-content-right-only {
        padding-right: var(--container-padding-xx-large);
    }

    .full-width-banner-content {
        padding-right: var(--container-padding-xx-large);
        padding-left: var(--container-padding-xx-large);
    }


}

@media screen and (min-width: 1200px) and (max-width: 1439px) {
    .full-width-banner-content-left-only {
        padding-left: var(--container-padding-x-large);
    }

    .full-width-banner-content-right-only {
        padding-right: var(--container-padding-x-large);
    }

    .full-width-banner-content {
        padding-right: var(--container-padding-x-large);
        padding-left: var(--container-padding-x-large);
    }
}

@media screen and (min-width: 1024px) and (max-width: 1199px) {
    .full-width-banner-content-left-only {
        padding-left: var(--container-padding-large);
    }

    .full-width-banner-content-right-only {
        padding-right: var(--container-padding-large);
    }

    .full-width-banner-content {
        padding-right: var(--container-padding-large);
        padding-left: var(--container-padding-large);
    }
}

@media screen and (min-width: 640px) and (max-width: 1023px) {
    .full-width-banner-content-left-only {
        padding-left: var(--container-padding-medium);
    }

    .full-width-banner-content-right-only {
        padding-right: var(--container-padding-medium);
    }

    .full-width-banner-content-left-only,
    .full-width-banner-content-right-only {
        width: 50%;
    }

    .full-width-banner-content {
        width: 50%;
        padding-left: var(--container-padding-medium);
        padding-right: var(--container-padding-medium);
    }

}

@media screen and (max-width: 639px) {
    .full-width-banner-content-left-only {
        padding-left: var(--container-padding-small);
        padding-right: var(--container-padding-small);
        width: 100% !important;
    }

    .full-width-banner-content-right-only {
        padding-left: var(--container-padding-small);
        padding-right: var(--container-padding-small);
        width: 100% !important;
    }

    .full-width-banner-content {
        padding-left: var(--container-padding-small);
        padding-right: var(--container-padding-small);
        width: 100%;
    }
}


/*********
SweetAlert Style
*********/

.swal2-popup {
    padding: 24px !important;
    border-radius: 14px !important;
}

.swal2-popup .ins-loader-wrap--state {
    max-width: 70px;
    margin: 0 auto 24px;
}

.swal2-popup .swal2-actions {
    flex-direction: row-reverse !important;
    margin-top: 24px;
}

.swal2-popup .swal2-actions button {
    font-family: var(--font-family-01) !important;
    font-style: normal !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    line-height: 16px;
    text-transform: none !important;
    border-radius: 14px;
    padding: 11px 24px;
    margin: 0 12px;
    min-height: 40px;
}

.swal2-popup .swal2-actions button,
.swal2-popup .swal2-actions button:focus {
    outline: none !important;
    box-shadow: none !important;
}

.swal2-popup .ins-loader-wrap--title {
    color: var(--font-color-head) !important;
    font-family: var(--font-family-01) !important;
    font-style: normal !important;
    font-weight: 600 !important;
    font-size: var(--font-x-large) !important;
    line-height: normal !important;
}

.swal2-popup .ins-loader-wrap--message {
    color: var(--font-color-body) !important;
    font-family: var(--font-family-03);
    font-style: normal;
    font-weight: 400;
    font-size: var(--font-medium);
    line-height: var(--font-x-large);
}

.swal2-styled.swal2-cancel {
    background-color: transparent !important;
    border: 1px solid var(--color-main) !important;
    color: var(--color-main) !important;
}

.swal2-popup .warning.ins-loader-wrap--state svg * {
    fill: var(--warning) !important;
}

.swal2-icon.swal2-warning {
    color: #EC9C00 !important;
    border: solid .25em #EC9C00 !important;
}

.change-pw-swal {
    padding: 32px !important;
    max-width: 410px !important;
}

@media screen and (max-width: 639px) {
    .change-pw-swal .swal2-content {
        padding: 0 !important;
    }

    .change-pw-swal .swal2-actions {
        flex-direction: column !important;
        gap: 12px;
        align-items: normal;
    }
}

@media screen and (max-width: 406px) {
    .swal-user-account .swal2-actions {
        gap: 16px !important
    }

    .swal-user-account .swal2-actions button {
        width: 100% !important
    }
}

.remove-card-swal {
    max-width: 400px !important;
    padding: 32px !important;
}

.remove-card-swal.swal2-popup .swal2-confirm.negative {
    background-color: var(--error) !important;
}

.remove-card-swal.swal2-popup .swal2-confirm.negative:hover {
    background-color: var(--error-hover) !important;
}

.swal2-actions button i {
    position: relative !important;
    top: 1px !important;
    margin-right: 4px;
}

#swal2-content .ins-loader-wrap--title {
    margin-top: 24px;
}


/* Default btn */

.swal2-popup .swal2-confirm {
    background-color: var(--color-main) !important;
    border: solid 1px var(--color-main) !important;
}

.swal2-actions:not(.swal2-loading) .swal2-cancel:hover {
    background-image: none !important;
    background-color: var(--ins-color-blue-10p) !important;
}

.swal2-popup .error.ins-loader-wrap--state svg * {
    fill: var(--error) !important;
}


/* Negative btn */

.swal2-popup .swal2-confirm.negative {
    background-color: var(--error) !important;
    border: solid 1px var(--error) !important;
}

.swal2-popup .success.ins-loader-wrap--state svg * {
    fill: var(--success) !important;
}


/* Positive btn */

.swal2-popup .swal2-confirm.green {
    background-color: var(--success) !important;
    border: solid 1px var(--success) !important;
}


/* Insites Loader */
.ins-loader-wrap--state {
    margin-bottom: 0px !important;
}

.ins-loader-wrap--message {
    font-family: var(--font-family-02);
    font-size: 16px;
}

ins-loader[state-icon=processing] {
    img {
        display: none;
    }
}

ins-loader[state-icon=processing] .ins-loader-wrap--state {
    width: 48px;
    height: 48px;
    border: 3px solid #dfdfdf;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}

ins-loader[state-icon=processing] .ins-loader-wrap--state::after {
    content: '';
    box-sizing: border-box;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-bottom-color: #3044FF;
}

.ins-loader-wrap--title.processing {
    color: var(--font-color-body, #575757);
    font-family: var(--font-family-02, Archivo);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

#users-loader .ins-loader-wrap {
    margin-top: 56px !important;
}

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}


/**********
[Insites Component Style Customization / Overwrite]
**********/

.button-large,
ins-button button.ins-button.size--large,
ins-button button.ins-button.size--large span {
    font-family: var(--font-family-03);
    font-weight: 700;
    font-size: var(--font-small);
    line-height: var(--font-x-large);
    letter-spacing: 1px;
}

.button-default,
ins-button button.ins-button,
ins-button button.ins-button span {
    font-family: var(--font-family-01);
    font-weight: 600;
    font-size: 16px;
    font-style: normal;
    line-height: 100%;
    /* 16px */
}

.button-small,
ins-button button.ins-button.size--small:not(.is-loading) {
    min-height: 35px;
    padding: 10px 16px;
    border-radius: 100px !important;
}

ins-button button.size--small .btn__icon,
ins-button button[type=button].size--small .btn__icon,
ins-button button[type=reset].size--small .btn__icon,
ins-button button[type=submit].size--small .btn__icon {
    font-size: 12px;
}

.button-small,
ins-button button.ins-button.size--small,
ins-button button.ins-button.size--small span {
    font-family: var(--font-family-03);
    font-weight: 700;
    font-size: var(--font-xx-small);
    line-height: var(--font-medium);
    letter-spacing: 1px;
    text-transform: uppercase;
}

ins-button button.white.solid,
ins-button button[type=button].white.solid,
ins-button button[type=reset].white.solid,
ins-button button[type=submit].white.solid {
    background-color: var(--font-color-inv);
    color: var(--color-main);
}

ins-button button[type=reset].blue,
ins-button button[type=reset].primary,
ins-button button[type=submit].blue,
ins-button button[type=submit].primary,
ins-button button[type=button].blue,
ins-button button[type=button].primary,
ins-button button.blue,
ins-button button.primary {
    color: var(--color-main);
}

ins-button button[type=reset].negative,
ins-button button[type=reset].red,
ins-button button[type=submit].negative,
ins-button button[type=submit].red,
ins-button button[type=button].negative,
ins-button button[type=button].red,
ins-button button.negative,
ins-button button.red {
    color: var(--error);
}

ins-button button {
    align-items: center;
    justify-content: center;
}

ins-button button div {
    /* display: flex;
    justify-content: center;
    align-items: center; */
    letter-spacing: 0px !important;
}

ins-button button.is-loading {
    width: auto !important;
}

.align-buttons-right {
    display: flex;
    justify-content: flex-end;
}

.ins-carousel_slides {
    background-color: initial;
}

.ins-carousel {
    position: relative;
}

ins-button.btn-icon-right .btn__icon {
    position: absolute;
    right: 0;
}

ins-button.btn-icon-right .btn__label {
    padding-right: 18px;
}

ins-textarea textarea,
.ins-textarea-wrap textarea {
    min-height: 110px;
    resize: none;
}

.form-label,
ins-input [class*=ins-] label,
[class*=ins-] label,
label,
.ins-form-field-wrap .ins-form-label,
.ins-select-wrap .ins-select-label-wrap {
    font-family: var(--font-family-01);
    font-weight: 600;
    font-size: 12px;
    line-height: normal;
    font-weight: 600;
    font-size: 12px;
    line-height: var(--font-medium);
    color: var(--font-color-head);
    margin-bottom: 8px;
}

.ins-select-wrap .done-wrap {
    font-family: var(--font-family-01);
    color: var(--font-color-head);
    background: var(--color-ui-03);
}

ins-checkbox label {
    display: flex !important;
}

ins-input-select .ins-input-select.ins-select-wrap.activated.drop-up .ins-select-options-wrap,
ins-input-select .ins-input-select.ins-select-wrap.activated.drop-up:not(.no-options) .ins-select-options-wrap {
    bottom: calc(100% - 30px);
}

ins-input-select .ins-input-select .ins-select-search .ins-select-search-input,
ins-input-select .ins-input-select .ins-select-search .ins-select-search-input::placeholder {
    font-family: var(--font-family-02);
}

ins-input-select .ins-input-select .ins-select-search .ins-select-search-input::placeholder {
    font-size: 13px;
}

.ins-select-wrap.activated label {
    color: var(--font-color-head);
}

.ins-form-field-wrap {
    font-family: var(--font-family-02);
    color: var(--font-color-head);
}

.ins-form-field-wrap .ins-form-field:focus+.icon-wrap {
    color: var(--color-main);
}

.ins-form-field-wrap .ins-form-field {
    font-family: var(--font-family-02);
    font-weight: 400;
    padding: 12px;
    line-height: 16px;
    height: auto;
    min-height: 46px;
}

.ins-form-field-wrap .ins-form-field {
    border-color: var(--color-ui-04);
}

.ins-form-field-wrap .ins-form-field::placeholder,
ins-input-select .ins-input-select.ins-select-wrap .ins-select-value-wrap .ins-select-value-input::placeholder {
    color: #57575799 !important;
    font-family: var(--font-family-02) !important;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}

.ins-form-field-wrap .icon-wrap {
    color: var(--font-color-body, #575757);
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}

.ins-form-field-wrap .ins-form-field:hover {
    border-color: var(--color-main-hover);
}

.ins-form-field-wrap .ins-form-field:focus {
    border-color: var(--color-main);
}

.ins-form-field-wrap .ins-form-label.active {
    color: var(--color-main);
}

.form-error,
.ins-form-field-wrap.is-invalid .ins-form-error,
.form-field-wrapper.error-recaptcha .ins-form-error,
.list-field-wrap.is-invalid .list-field_error {
    font-family: var(--font-family-03);
    font-weight: 400;
    font-size: var(--font-x-small);
    line-height: normal;
    color: var(--error);
}

.form-field-wrapper.error-recaptcha .ins-form-error::after {
    content: "reCAPTCHA is required.";
}

.ins-form-field-wrap.is-invalid .ins-form-field {
    color: var(--error);
    border-color: var(--error);
    background-color: var(--color-ui-01);
}

.list-field-wrap.is-invalid .list-field_error,
.list-field-wrap.is-invalid .list-checkbox_error,
.insites-form .list-field-wrap.is-invalid .list-checkbox_error,
.insites-form .list-field-wrap.is-invalid .list-field_error {
    display: block !important;
    margin-top: 8px;
}

.ins-form-field-wrap.is-invalid .ins-form-field:-moz-placeholder {
    color: var(--error);
}

.ins-form-field-wrap.is-invalid .ins-form-field::-moz-placeholder {
    color: var(--error);
}

.ins-form-field-wrap.is-invalid .ins-form-field:-ms-input-placeholder {
    color: var(--error);
}

.ins-form-field-wrap.is-invalid .ins-form-field::-webkit-input-placeholder {
    color: var(--error);
}

.form-placeholder,
input::-webkit-input-placeholder,
input:-ms-input-placeholder,
::placeholder {
    font-family: var(--font-family-03);
    font-weight: 400;
    font-size: var(--font-small);
    line-height: var(--font-small);
}

.form-placeholder-multiline,
textarea::-webkit-input-placeholder,
textarea:-ms-input-placeholder,
textarea::placeholder {
    font-family: var(--font-family-03);
    font-weight: 400;
    font-size: var(--font-small);
    line-height: var(--font-x-large);
}

.large-field .ins-form-field-wrap {
    margin-bottom: 0;
}

.large-field .ins-form-field-wrap .ins-form-field {
    padding: 12px;
    line-height: 16px;
    height: auto;
    min-height: 46px;
}

.large-field .ins-form-field-wrap .icon-wrap {
    right: 16px;
}


/* Button color=default/blue/primary */


/* Solid button */

ins-button button.blue.solid,
ins-button button.primary.solid,
ins-button button[type=button].blue.solid,
ins-button button[type=button].primary.solid,
ins-button button[type=reset].blue.solid,
ins-button button[type=reset].primary.solid,
ins-button button[type=submit].blue.solid,
ins-button button[type=submit].primary.solid {
    color: var(--font-color-inv);
    border-radius: 100px;
    background: var(--color-gradient-02);
    height: initial;
}

ins-button.icon-only button.blue.solid {
    padding: 0px;
    min-width: initial;
    width: 48px;
    height: 48px;
    border-radius: 100%;
}

ins-button.icon-only[size=large] button.blue.solid {
    width: 64px;
    height: 64px;
}

ins-button.icon-only button .btn__icon.right {
    margin-left: 0px;
}

ins-button button[type=reset].blue.solid:not([disabled]):hover,
ins-button button[type=reset].primary.solid:not([disabled]):hover,
ins-button button[type=submit].blue.solid:not([disabled]):hover,
ins-button button[type=submit].primary.solid:not([disabled]):hover,
ins-button button[type=button].blue.solid:not([disabled]):hover,
ins-button button[type=button].primary.solid:not([disabled]):hover,
ins-button button.blue.solid:not([disabled]):hover,
ins-button button.primary.solid:not([disabled]):hover {
    background-color: var(--color-sub2-hover) !important;
    color: var(--font-color-inv) !important;
}


/* Trasparent button */

ins-button button[type=reset].blue:not([disabled]),
ins-button button[type=reset].primary:not([disabled]),
ins-button button[type=submit].blue:not([disabled]),
ins-button button[type=submit].primary:not([disabled]),
ins-button button[type=button].blue:not([disabled]),
ins-button button[type=button].primary:not([disabled]),
ins-button button.blue:not([disabled]),
ins-button button.primary:not([disabled]) {
    /* transition: color 0.3s ease 0.1s, background-color 0.3s ease 0.1s; */
}

ins-button button[type=reset].blue:not([disabled]):hover,
ins-button button[type=reset].blue:not([disabled]):active,
ins-button button[type=reset].primary:not([disabled]):hover,
ins-button button[type=reset].primary:not([disabled]):active,
ins-button button[type=submit].blue:not([disabled]):hover,
ins-button button[type=submit].blue:not([disabled]):active,
ins-button button[type=submit].primary:not([disabled]):hover,
ins-button button[type=submit].primary:not([disabled]):active,
ins-button button[type=button].blue:not([disabled]):hover,
ins-button button[type=button].blue:not([disabled]):active,
ins-button button[type=button].primary:not([disabled]):hover,
ins-button button[type=button].primary:not([disabled]):active,
ins-button button.blue:not([disabled]):hover,
ins-button button.blue:not([disabled]):active,
ins-button button.primary:not([disabled]):hover,
ins-button button.primary:not([disabled]):active {
    color: #fff !important;
    background-color: var(--color-main) !important;
}


/* Outlined */
ins-button button[type=reset].blue.outlined,
ins-button button[type=reset].primary.outlined,
ins-button button[type=submit].blue.outlined,
ins-button button[type=submit].primary.outlined,
ins-button button[type=button].blue.outlined,
ins-button button[type=button].primary.outlined,
ins-button button.blue.outlined,
ins-button button.primary.outlined {
    background: none;
    border: 1px solid var(--color-main);
    color: var(--color-main);
    border-radius: 100px;
    text-align: center;

    /* Button/button-default */
    font-family: var(----font-family-01, "Bauhaus Slim Display");
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    /* 16px */
}

ins-button.white button.outlined {
    border-color: var(--color-ui-01) !important;
    color: var(--font-color-inv) !important;
}



/* Button color="sub1" */


/* Solid button */

ins-button button.sub1.solid,
ins-button button[type=button].sub1.solid,
ins-button button[type=reset].sub1.solid,
ins-button button[type=submit].sub1.solid {
    background-color: var(--color-sub1);
    color: var(--font-color-inv);
}

ins-button button[type=reset].sub1.solid:not([disabled]):hover,
ins-button button[type=submit].sub1.solid:not([disabled]):hover,
ins-button button[type=button].sub1.solid:not([disabled]):hover,
ins-button button.sub1.solid:not([disabled]):hover {
    background-color: var(--color-sub1-hover);
    color: var(--font-color-inv);
}


/* Transparent button */

ins-button button[type=reset].sub1,
ins-button button[type=submit].sub1,
ins-button button[type=button].sub1,
ins-button button.sub1 {
    color: var(--color-sub1);
    background-color: transparent;
}

ins-button button[type=reset].sub1:not([disabled]):hover,
ins-button button[type=reset].sub1:not([disabled]):active,
ins-button button[type=submit].sub1:not([disabled]):hover,
ins-button button[type=submit].sub1:not([disabled]):active,
ins-button button[type=button].sub1:not([disabled]):hover,
ins-button button[type=button].sub1:not([disabled]):active,
ins-button button.sub1:not([disabled]):hover,
ins-button button.sub1:not([disabled]):active {
    background-color: var(--color-sub1-hover-light, rgba(126, 22, 208, 0.1));
    color: var(--color-sub1-hover);
}


/* Outlined */

ins-button button[type=reset].sub1.outlined,
ins-button button[type=submit].sub1.outlined,
ins-button button[type=button].sub1.outlined,
ins-button button.sub1.outlined {
    background: none;
    border: 1px solid var(--color-sub1-hover);
    color: var(--color-sub1-hover);
}

/* Solid button */

ins-button button.sub2.solid,
ins-button button[type=button].sub2.solid,
ins-button button[type=reset].sub2.solid,
ins-button button[type=submit].sub2.solid {
    background-color: var(--color-sub2, #D32F19);
    color: var(--font-color-inv);
}

ins-button button[type=reset].sub2.solid:not([disabled]):hover,
ins-button button[type=submit].sub2.solid:not([disabled]):hover,
ins-button button[type=button].sub2.solid:not([disabled]):hover,
ins-button button.sub2.solid:not([disabled]):hover {
    background-color: var(--color-sub2-hover, #D32F19);
    color: var(--font-color-inv);
}


/* Transparent button */

ins-button button[type=reset].sub2,
ins-button button[type=submit].sub2,
ins-button button[type=button].sub2,
ins-button button.sub2 {
    color: var(--color-sub2);
    background-color: transparent;
}

ins-button button[type=reset].sub2:not([disabled]):hover,
ins-button button[type=reset].sub2:not([disabled]):active,
ins-button button[type=submit].sub2:not([disabled]):hover,
ins-button button[type=submit].sub2:not([disabled]):active,
ins-button button[type=button].sub2:not([disabled]):hover,
ins-button button[type=button].sub2:not([disabled]):active,
ins-button button.sub2:not([disabled]):hover,
ins-button button.sub2:not([disabled]):active {
    background-color: var(--color-sub2-hover-light, rgba(211, 47, 25, 0.1));
    color: var(--color-sub2-hover, #D32F19);
}


/* Outlined */

ins-button button[type=reset].sub2.outlined,
ins-button button[type=submit].sub2.outlined,
ins-button button[type=button].sub2.outlined,
ins-button button.sub2.outlined {
    background: none;
    border: 1px solid var(--color-sub2-hover);
    color: var(--color-sub2-hover);
}

ins-button button,
ins-button button span {
    font-family: var(--font-family-03);
}

ins-button+ins-button button,
a.ins-button+ins-button button,
ins-button+a.ins-button button {
    margin-left: calc(2 * var(--gutter));
}

ins-button button:not(.size--small),
ins-button button[type=button] {
    padding: 14px 24px;
    min-height: 45px;
}

.btn-container {
    display: flex;
    justify-content: flex-end;
}

@media screen and (max-width: 639px) {

    .btn-container ins-button button,
    ins-button+ins-button button,
    a.ins-button+ins-button button {
        width: 100%;
        margin-left: 0;
        margin-bottom: calc(2 * var(--gutter));
    }

    .btn-container a.ins-button+ins-button:last-child button {
        margin-bottom: 0;
    }

    .btn-container {
        justify-content: center;
        gap: 24px;
    }
}

ins-button.full {
    display: block;
}

ins-button.full button {
    width: 100%;
}

ins-card.full {
    width: 100%;
}

.ins-accordion-item.open>.ins-accordion-item_header>.inner-head,
.ins-accordion.menu .ins-accordion-item.open>.ins-accordion-item_header>.inner-head:hover {
    background-color: var(--color-ui-03);
    border-color: var(--color-ui-03);
    color: var(--color-sub1);
}

.ins-accordion-item_header>.inner-head:hover {
    border-color: var(--color-main);
}

.ins-carousel_ctrl-btns,
.ins-carousel_ctrl-btns .btn__icon {
    color: var(--color-main);
}

.ins-carousel_paginations .pagination.active,
.ins-checkbox-card-wrap.selected.blue .selected-wrap {
    background-color: var(--color-main);
}

.ins-carousel_paginations .pagination {
    background-color: var(--color-ui-04);
}

.ins-select-wrap.activated .ins-select-options-wrap {
    z-index: 99999;
}

.ins-select-wrap.activated .ins-select-value-wrap,
.ins-select-wrap.activated .ins-select-options-wrap {
    border-color: var(--color-main);
}

.ins-select-wrap.is-invalid .ins-select-value-wrap,
.ins-select-wrap.is-invalid.activated .ins-select-options-wrap {
    border-color: var(--error);
}

.grid-padding-x>.cell ins-checkbox .ins-radio-checkbox,
.grid-padding-x>.cell ins-radio .ins-radio-checkbox {
    padding: 0;
}

ins-toggle-switch .v-switch .ins-switch {
    height: initial;
    margin-bottom: calc(2 * var(--gutter));
}

.ins-form-field-wrap,
.ins-select-wrap,
ins-checkbox .ins-radio-checkbox label,
ins-radio .ins-radio-checkbox label,
ins-code-editor .CodeMirror,
ins-editor .ins-editor {
    margin-bottom: 0
        /*  to be check on other elements */
}

ins-checkbox.inline .ins-radio-checkbox label .ins-checkbox-radio-label,
ins-radio.inline .ins-radio-checkbox label .ins-checkbox-radio-label {
    display: inline;
    font-family: "Work Sans";
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
    color: var(--color-ui-06, #575757);
}

ins-checkbox .ins-radio-checkbox .ripple-check:checked,
ins-radio .ins-radio-checkbox .ripple-check:checked,
ins-checkbox .ins-radio-checkbox .ripple-check:checked::after,
ins-radio .ins-radio-checkbox .ripple-check:checked::after {
    background: var(--color-main);
}

ins-checkbox .ins-radio-checkbox .ripple-check {
    min-width: 16px;
}

.ins-modal-wrap.show-modal ins-card {
    top: 21%;
    /* offset overlap on sticky header */
}

.ins-modal-wrap.show-modal ins-card .ins-card-wrap {
    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.10) !important;
}

.ins-modal-wrap.show-modal .ins-modal-body {
    padding: 0px 32px 32px;
    overflow: visible;
}




/* Step inactive - default state */

.ins-step_indicator {
    border-color: var(--color-ui-05);
    background-color: var(--color-ui-03);
}

.ins-step_progress-bar {
    background-color: var(--color-ui-05);
}

.ins-step_description {
    color: var(--color-ui-06);
    font-family: var(--font-family-02);
    font-size: 14px;
}


/* Step active */

.ins-step.active .ins-step_indicator {
    border-color: var(--font-color-head);
    background: var(--color-ui-01);
}

.ins-step.active .ins-step_description {
    color: var(--color-ui-06);
    font-family: var(--font-family-02);
    font-size: 14px;
}

ins-steps.hydrated[clickable] ins-step:not([disabled]) .ins-step_details:hover .ins-step_indicator {
    border-color: var(--font-color-head);
}


/* Step completed */

.ins-step.completed .ins-step_indicator {
    border-color: var(--color-main);
    background: var(--color-main);
    color: var(--font-color-inv);
}

.ins-step.completed .ins-step_progress-bar {
    background-color: var(--color-main);
}

.ins-step.completed .ins-step_description {
    color: var(--color-main);
}


/* Step has error */

.ins-step.has-error .ins-step_indicator,
.ins-step.active.has-error .ins-step_indicator {
    border-color: var(--error);
    color: var(--font-color-inv);
}

.ins-step.has-error .ins-step_progress-bar,
.ins-step.active.has-error .ins-step_progress-bar,
.ins-step.active.has-error .ins-step_dot {
    background-color: var(--error);
}

.ins-step.has-error .ins-step_description,
.ins-step.active.has-error .ins-step_description {
    color: var(--error);
}


/* Override insites-form .column for Insites Telephone */

.insites-form.insites-form-code .insites-form-grid ins-input-tel .ins-input-tel-wrap .column-1,
.insites-form.insites-form-code .insites-form-grid ins-input-tel .column-2 {
    width: auto;
}

.ins-input-tel-wrap .iti .iti__flag-container .iti__selected-flag:hover,
.ins-select-wrap .ins-select-value-wrap:hover {
    border-color: var(--color-main-hover);
}

.ins-input-tel-wrap .iti .iti__flag-container .iti__selected-flag:focus,
.ins-select-wrap .ins-select-value-wrap:focus,
ins-input-select .ins-input-select.ins-select-wrap.activated.drop-up .ins-select-options-wrap,
ins-input-select .ins-input-select.ins-select-wrap.activated.drop-up:not(.no-options) .ins-select-options-wrap {
    border-color: var(--color-main);
}

.ins-select-wrap.activated.drop-up .ins-select-value-wrap {
    border-bottom-color: var(--color-main);
}



.insites-form .insites-form-grid ins-input-tel .column-1:not(.insites-form.insites-form-grid.col-container.column-1) {
    width: auto;
}

.insites-form.insites-form-code ins-input-tel .column-1:not(.insites-form.insites-form-code.insites-form-grid.col-container.column-1) {
    margin: 0px;
}

.insites-form.insites-form-code ins-input-tel .column-2:not(.insites-form.insites-form-code.insites-form-grid.col-container.column-2) {
    margin: 0px 8px 9px;
}


/* Pagination */
.ibt-table-wrap .pagination-wrap>.ibt-table-wrap__prev-next {
    flex-wrap: wrap;
    row-gap: 24px;
}

.ibt-table-wrap .pagination-wrap>div.ibt-table-wrap__page-nav {
    flex-wrap: wrap;
    row-gap: 24px;
}

.ibt-table-wrap .pagination-wrap {
    padding: 15px 0px;
}

@media screen and (max-width: 755px) {
    .ibt-table-wrap .pagination-wrap {
        flex-direction: column;
    }

    .ibt-table-wrap .pagination-wrap>.ibt-table-wrap__prev-next {
        justify-content: center;
        padding-top: 24px;
    }
}

.ibt-table-wrap .pagination-wrap * {
    font-family: var(--font-family-02);
}

.ibt-table-wrap__pagination span {
    color: var(--font-color-head, #05051D);
    font-family: var(--font-family-02, Archivo);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

.ibt-table-wrap__pagination--option {
    color: var(--font-color-body);
    font-family: var(--font-family-02);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
}

.ibt-table-wrap__pagination:before {
    border-top: solid 4px var(--font-color-body, #575757);
    text-align: center;
    font-family: Insites-Font-Icons;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
}

.ibt-table-wrap__page {
    color: var(--font-color-body, #575757);
    font-family: var(--font-family-02);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

.ibt-table-wrap__prev-next button {
    color: var(--color-ui-06);
    width: 24px;
    height: 26px;
    margin: 0px 12px;
}

.ibt-table-wrap__prev-next button.page {
    font-size: 14px;
}

.ibt-table-wrap__prev-next button i {
    font-size: 20px !important;
}

.ibt-table-wrap__prev-next button:disabled {
    color: var(--font-color-body, #575757);
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
}

.ibt-table-wrap__prev-next button.page.active:disabled {
    color: #3044FF;
    font-family: var(--font-family-02);
    color: #C89D29;
    font-family: var(--font-family-02);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    padding: 0;
}

@media screen and (max-width: 639px) {
    .ibt-table-wrap__page-nav {
        justify-content: center;
        padding-bottom: 0px !important;
    }
}

/* Filter */

ins-filter .filter__label {
    color: var(--font-color-head);
    text-align: center;
    font-family: var(--font-family-02);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    margin-top: 12px;
}

ins-filter-item .filter-item__button {
    border-radius: 8px;
    background: var(--UI---color-ui-03, #FCFAF4);
    padding: 12px 16px;
}

ins-filter-item .filter-item__button,
ins-filter-item .filter-item__button:hover {
    background: var(--color-ui-01);
}

ins-filter-item .filter-item__button {
    color: var(--font-color-head, #05051D);
    font-family: var(--font-family-02, Archivo);
    font-size: 12px;
    font-style: normal;
    font-weight: 700;
    line-height: 16px;
}

ins-filter-item .filter-item__button--option {
    color: var(--font-color-body, #575757);
    text-align: right;
    font-family: var(--font-family-02, Archivo);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}

ins-filter-item .filter-item__button--option .fas {
    color: var(--font-color-body, #575757);
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

ins-filter-item .filter-item__options.active {
    padding: 0;
    margin-top: 8px;
    border: solid 1px var(--color-ui-04);
}

ins-filter-item .filter-item__options>div {
    color: var(--font-color-head, #05051D);
    font-family: var(--font-family-02, Archivo);
    color: var(--font-color-head);
    font-family: var(--font-family-01);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
    padding: 16px;
    margin: 0;
}

ins-filter-item .filter-item__options>div:hover,
ins-filter-item .filter-item__options>div.selected:hover {
    color: var(--color-main);
    background: var(--color-ui-03);
}

ins-filter-item .filter-item__options>div.selected {
    color: var(--color-main, #3044FF);
    background-color: transparent;
}

ins-filter .filter__btn-container {
    height: 42px;
}

@media only screen and (max-width: 768px) {
    ins-filter .filter {
        margin-bottom: 0px;
    }
}

@media screen and (max-width: 639px) {
    ins-filter .filter {
        width: 100%;
        margin-right: 0px;
    }

    ins-filter .filter__btn-container {
        display: block;
    }

    ins-filter .filter__date {
        display: block;
    }

    ins-filter .date-filter {
        width: 100%;
    }

    ins-filter .date-filter .fas {
        position: absolute;
        right: 17px;
    }

    ins-filter .filter__label {
        display: block;
        text-align: center;
        margin-right: 0px;
        width: 100%;
    }

    ins-filter-item {
        margin-right: 0px !important;
        width: 100%;
    }

    ins-filter-item .filter-item__button--option .fas {
        position: absolute;
        right: 17px;
    }
}


/**********[GENERAL / Utilitities]**********/


/*-- Font Colors ----*/

.color-main,
.color-main:visited {
    color: var(--color-main) !important;
}

.color-sub1 {
    color: var(--color-sub1);
}

.color-sub2 {
    color: var(--color-sub2);
}

.font-color-head,
.font-color-head *,
.font-color-head:visited {
    color: var(--font-color-head);
}

.font-color-sub {
    color: var(--font-color-sub);
}

.font-color-body,
a.font-color-body,
a.font-color-body:visited {
    color: var(--font-color-body);
}

.font-color-link {
    color: var(--font-color-link);
}

.font-color-visited {
    color: var(--font-color-visited);
}

.font-color-inv {
    color: var(--font-color-inv);
}

.success {
    color: var(--success);
}

.error {
    color: var(--error);
}

.warning {
    color: var(--warning);
}

.success-hover {
    color: var(--success-hover);
}

.error-hover {
    color: var(--error-hover);
}

.warning-hover {
    color: var(--warning-hover);
}

.success-hover-light {
    color: var(--success-hover-light);
}

.error-hover-light {
    color: var(--error-hover-light);
}

.warning-hover-light {
    color: var(--warning-hover-light);
}


/*-- Font Size --*/

.font-xxxx-large {
    font-size: var(--font-xxxx-large);
}

.font-xxx-large {
    font-size: var(--font-xxx-large);
}

.font-xx-large {
    font-size: var(--font-xx-large);
}

.font-x-large {
    font-size: var(--font-x-large);
}

.font-large {
    font-size: var(--font-large);
}

.font-medium {
    font-size: var(--font-medium);
}

.font-small {
    font-size: var(--font-small);
}

.font-x-small {
    font-size: var(--font-x-small);
}

.font-xx-small {
    font-size: var(--font-xx-small);
}


/* Background colors */

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

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

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

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

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

.bg-color-ui-06 {
    background-color: var(--color-ui-06);
    color: var(--font-color-inv);
}

.bg-color-ui-07 {
    background-color: var(--color-ui-07);
    color: var(--font-color-inv);
}

.bg-color-main {
    background-color: var(--color-main);
    color: var(--font-color-inv);
}


/*-- Border color --*/

.border-color-ui-01 {
    border-color: var(--color-ui-01);
}

.border-color-ui-02 {
    border-color: var(--color-ui-02);
}

.border-color-ui-03 {
    border-color: var(--color-ui-03);
}

.border-color-ui-04 {
    border-color: var(--color-ui-04);
}

.border-color-ui-05 {
    border-color: var(--color-ui-05);
}

.border-color-ui-06 {
    border-color: var(--color-ui-06);
}

.border-color-ui-07 {
    border-color: var(--color-ui-07);
}

.border-color-main {
    border-color: var(--color-main);
}


/*-- UI --*/

.ui-tags [class^='icon-'],
ins-tag span.tagged span[class^='icon-'],
ins-tag span.ins-tag span[class^='icon-'] {
    margin-right: 8px;
}

.ui-tags,
ins-tag span.ins-tag {
    font-family: var(--font-family-01);
    font-weight: 700;
    font-size: var(--font-xx-small);
    line-height: var(--font-medium);
    padding: 4px 16px;
    border-radius: 2px;
}

.ui-notifications {
    font-family: var(--font-family-01);
    font-weight: 400;
    font-size: var(--font-xx-small);
    line-height: normal;
}

.ui-sidebar {
    font-family: var(--font-family-01);
    font-weight: 400;
    font-size: var(--font-small);
    line-height: var(--font-x-large);
}

.ui-timeline {
    font-family: var(--font-family-01);
    font-weight: 400;
    font-size: var(--font-xx-small);
    line-height: var(--font-medium);
}

.ui-tooltip {
    font-family: var(--font-family-01);
    font-weight: 700;
    font-size: var(--font-small);
    line-height: var(--font-x-large);
}


/*-- Spacers --*/

.spacer {
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 24px;
}

.spacer.xx-small {
    padding-bottom: 4px;
}

.spacer.x-small {
    padding-bottom: 8px;
}

.spacer.small {
    padding-bottom: 16px;
}

.spacer.large {
    padding-bottom: 32px;
}

.spacer.x-large {
    padding-bottom: 40px;
}

.spacer.xx-large {
    padding-bottom: 48px;
}

.spacer.xxx-large {
    padding-bottom: 56px;
}

.spacer.xxxx-large {
    padding-bottom: 80px;
}

.spacer.section {
    padding-bottom: 128px;
}

@media screen and (min-width: 1440px) {
    /* insert spacer adjusment for xx-large */
}

@media screen and (min-width: 1200px) and (max-width: 1439px) {
    /* insert spacer adjusment for x-large */
}

@media screen and (min-width: 1024px) and (max-width: 1199px) {
    /* insert spacer adjusment for large */
}

@media screen and (min-width: 640px) and (max-width: 1023px) {
    /* insert spacer adjusment for medium */
}

@media screen and (max-width: 639px) {

    /* insert spacer adjusment for small */
    .spacer.section {
        padding-bottom: 80px;
    }

    .spacer.xxxx-large {
        padding-bottom: 56px;
    }
}

.placeholder-img {
    background: var(--color-ui-03);
    text-align: center;
    font-size: 48px;
    color: #CCCED3;
    height: 100%;
}

.vertical-align-middle {
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    flex-direction: column;
    position: relative;
    justify-content: center;
}

.btn-full ins-button,
.btn-full button {
    width: 100%;
}

.error-message {
    color: var(--error);
    font-family: var(--font-family-03);
    font-size: 12px;
    line-height: 16px;
    margin-top: 4px;
}

.preserve-line-break {
    white-space: pre-wrap;
}


/*-- FONTS --*/

.capitalize {
    text-transform: capitalize;
}

.uppercase {
    text-transform: uppercase;
}

.inline-list li {
    display: inline-block;
    padding: 0 15px;
}

.inline-list li:first-child {
    padding-left: 0;
}

.inline-list li:last-child {
    padding-right: 0;
}

/********** Header Banner **********/
.header-bg {
    position: absolute;
    top: 0px;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 564px;
    overflow: hidden;
    z-index: -1;
}

.header-bg-1,
.header-bg-2 {
    position: absolute;
    bottom: 70px;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 528px;
}

.header-bg-1 {
    left: 0;
}

.header-bg-2 {
    right: 0;
}

.header-bg-1 img {
    position: relative;
    left: -60px;
    width: 888.784px;
    height: 857.042px;
    transform: rotate(-154.238deg);
    aspect-ratio: 888.78/857.04;
    /* border: 1px solid green; */
}

.header-bg-2 img {
    width: 884.731px;
    height: 853.133px;
    transform: rotate(-215.607deg);
    aspect-ratio: 884.73/853.13;
    /* border: 1px solid red; */
}


/********** Header Text Banner **********/
.header-text-banner {
    position: relative;
    z-index: 100;
    background: var(--banner-grad, linear-gradient(264deg, #FDC458 -2.92%, #EE5D51 43.94%, #694879 107.9%));
    display: flex;
    padding: 16px 24px;
    justify-content: space-between;
    align-items: center;
}

.header-text-banner .close {
    border-radius: 100px;
    border: 1px solid var(--font-color-inv);
    display: flex;
    padding: 7px;
    align-items: center;
    margin-top: -1px;
    margin-bottom: -1px;
    cursor: pointer;
}

/********** [Header] **********/

.background-color-gradient1 {
    background: var(--color-gradient-01);
    color: var(--font-color-inv);
}

.bg-color-main p,
.background-color-gradient1 p,
.bg-color-main h1,
.background-color-gradient1 h1 {
    color: var(--font-color-inv);
}

.component-background {
    background: url('../images/components.jpg') no-repeat;
    background-size: cover;
    color: var(--font-color-inv);
}

.component-background .heading-2 {
    color: var(--font-color-inv);
}

.header-top-bar .logo,
.header .logo {
    height: 56px;
}

.logo {
    width: auto !important;
    max-height: 80px !important;
}

.logo-footer {
    max-height: 110px !important;
}

.logo-accounts {
    width: auto !important;
    max-height: 35px !important;
}

.top-bar,
.header-top-bar {
    background-color: var(--color-ui-01);
    padding: 24px .9375rem;
}

.header-top-bar a,
.top-bar-right a {
    padding-right: 30px;
    font-weight: 700;
    position: relative;
    font-size: var(--font-x-small);
}

.header-top-bar a:last-child,
.top-bar a:last-child {
    padding-right: 0;
}

.header-top-bar ins-drop-down.hydrated,
.top-bar-right ins-dropdown.hydrated {
    display: inline-block;
}

.header-top-bar .top-bar-right ins-dropdown .ins-dropdown_menu,
.top-bar .top-bar-right ins-dropdown .ins-dropdown_menu {
    right: 0px;
}

.header {
    transition-property: transform;
    transition-duration: 400ms;
    will-change: transform;
}

.header .nav-bar ins-dropdown .ins-dropdown_menu {
    padding-top: 0px;
}

.header .nav-bar ins-dropdown.active .ins-dropdown_label,
#mobile-menu ins-accordion-link.active .ins-accordion-link_link {
    color: var(--color-main);
}

.header .nav-bar ins-dropdown.active .ins-dropdown_menu-card li.li-active a {
    background: none;
    color: var(--color-main);
}

.header-top-bar ins-dropdown {
    display: inline-block;
}

.header-top-bar ins-dropdown .ins-dropdown_menu {
    text-align: left;
}

@media screen and (max-width: 1448px) {
    .header-top-bar ins-dropdown.profileNav .ins-dropdown_menu {
        right: 0;
    }
}

.header-top-bar .cart-count,
.header .top-bar .cart-count {
    font-family: var(--font-family-01);
    font-size: var(--font-xx-small);
    color: var(--font-color-inv);
    background-color: var(--error);
    position: absolute;
    top: -7px;
    right: -7px;
    height: auto;
    line-height: normal;
    padding: 3px 6px;
    border-radius: 50%;
}



/* [Header Dropdown Overwrite] */

.header-top-bar .ins-dropdown_label .icon-angle-down,
.header .top-bar .ins-dropdown_label .icon-angle-down {
    position: relative;
    top: 0px;
    right: 0px;
    margin-left: 11px;
}

.header-top-bar [class^="icon-"],
.header-top-bar [class*=" icon-"],
.header .top-bar [class^="icon-"],
.header .top-bar [class*=" icon-"] {
    vertical-align: middle;
    font-size: var(--font-x-small);
    margin-right: 5px;
}

.header-top-bar .ins-dropdown_label,
.header .top-bar .ins-dropdown_label {
    color: var(--font-color-head);
    font-family: var(--font-family-01);
    font-weight: 700;
    /* font-size: var(--font-x-small); */
    line-height: var(--font-x-large);
    padding-left: 0px;
}

.header-top-bar .ins-dropdown_label::before,
.header .top-bar .ins-dropdown_label::before {
    content: "\e908";
    font-family: 'insites-20-fonticon' !important;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    margin-right: 6px;
    vertical-align: middle;
    font-size: var(--font-medium);
}

.header-top-bar .ins-dropdown_menu ul,
.header .top-bar .ins-dropdown_menu ul {
    list-style: none;
    background-color: var(--color-ui-01);
    margin-left: 0px;
}

.header-top-bar .ins-dropdown_menu a,
.header .top-bar .ins-dropdown_menu a {
    display: block;
    padding: 18px 25px;
    color: var(--font-color-body);
    font-family: var(--font-family-01);
    font-size: var(--font-medium);
    font-weight: 600;
}

.header-top-bar .ins-dropdown_menu a:hover,
.header .top-bar .ins-dropdown_menu a:hover {
    background-color: var(--ins-color-blue-10p);
}

.header-top-bar .ins-dropdown_menu ins-button,
.header-top-bar .ins-dropdown_menu button,
.header .top-bar .ins-dropdown_menu ins-button,
.header .top-bar .ins-dropdown_menu button {
    display: block;
    padding: 0px;
    width: 100%;
    height: auto;
    text-align: left;
}

.header-top-bar .ins-dropdown_menu button:hover,
.header .top-bar .ins-dropdown_menu button:hover {
    background-color: var(--color-ui-01);
}

.header-top-bar .ins-dropdown_menu .btn__label,
.header .top-bar .ins-dropdown_menu .btn__label {
    display: block;
    padding: 15px 16px;
    color: var(--font-color-body);
    font-family: var(--font-family-01);
    font-size: var(--font-medium);
    font-weight: 600;
    text-transform: none;
    letter-spacing: normal;
}


/********** [Navigation] **********/

#main-header {
    width: 100%;
    padding: 16px 0px;
    background: var(--color-bg1, #05051D);
    transition: background-color 0.3s ease;
    /* z-index: 99999; */
}

#main-header ins-dropdown {
    display: inline-block;
    padding: 0px 24px;
    font-weight: 700;
}

#main-header .navlinks {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    color: var(--font-color-link);
}

#main-header .navlinks a {
    padding: 0 24px;
    font-weight: 400;
    font-size: 16px;
}

#main-header .navlinks a.cart-icon {
    padding: 8px;
}

#main-header .navlinks a:hover,
#main-header ins-dropdown:hover,
#main-header ins-dropdown .ins-dropdown:hover {
    color: var(--font-color-link-hovered);
}

#main-header .nav-sign-in-btn {
    margin-left: 16px;
    margin-right: 8px;
}

#main-header .nav-sign-in-btn:hover {
    color: var(--font-color-link) !important;
    border-radius: 14px;
    background: var(--font-inverse-hover, rgba(255, 255, 255, 0.10));
}

.nav-register-btn {
    color: var(--font-color-link) !important;
    border-radius: 14px;
    background: var(--color-gradient-01);
}

.nav-register-btn:hover {
    background: #2331B7;
}


#main-header ins-dropdown .ins-dropdown_menu {
    text-align: left;
    min-width: 182px;
    padding-top: 8px;
}

#main-header ins-dropdown .ins-dropdown_label {
    padding: 0px;
    font-weight: 400;
}

#main-header ins-dropdown .ins-dropdown_menu,
#main-header .ins-dropdown_label .icon-angle-down {
    right: -24px;
}

#main-header ins-dropdown:not(.profileNav) .ins-dropdown_menu {
    right: initial;
}

#main-header ins-dropdown .ins-dropdown_menu a,
#main-header .profileNav ins-button button {
    padding: 12px 24px !important;
}

#main-header ins-dropdown .ins-dropdown_menu a {
    color: var(--color-sub1);
    font-weight: normal !important;
    font-size: 14px !important;
}

#main-header ins-dropdown ins-button button {
    width: 100%;
    text-align: left;
    border-radius: 0px;
}

#main-header .nav-dropdown-link {
    padding: 0 !important;
}

#main-header ins-dropdown .ins-dropdown_menu a:hover {
    background-color: #F9FAFB;
    color: var(--color-main);
}

#main-header ins-dropdown .ins-dropdown_menu .ins-dropdown_menu-card {
    border-radius: 2px;
    border: 1px solid var(--color-ui-04, #DFDFDF);
    background: var(--color-ui-01, #FFF);
    box-shadow: 0 12px 12px 0 rgba(0, 0, 0, 0.05), 0 2px 5px 0 rgba(0, 0, 0, 0.10);
}

#main-header .mobile-menu-toggle .nav-sign-in-btn {
    color: #ffff;
    font-weight: 700;
    font-size: 14px;
    margin-right: 24px;
}

#main-header .mobile-menu-toggle {
    align-items: center;
    gap: 16px;
}

#main-header.mobile-menu-toggle #mobile-menu-btn {
    padding: 8px;
    border-radius: 4px;
}

#main-header .mobile-menu-toggle #mobile-menu-btn {
    background: rgba(255, 255, 255, 0.06);
    padding: 8px;
    border-radius: 4px;
}

#main-header.light-header {
    background-color: #fff !important;
}

.border-bottom-nav {
    border-bottom: 1px solid var(--color-ui-04)
}

#main-header.light-header .navlinks a,
#main-header.light-header .ins-dropdown_label,
#main-header ins-button button[type=submit].blue,
#main-header.light-header .mobile-menu-toggle .icon-shopping-cart {
    color: var(--color-sub1);
}

#main-header .profileNav ins-button button.ins-button span {
    font-family: var(--font-family-01);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 21px */
    letter-spacing: 0.28px;
}

#main-header.light-header .navlinks a:hover,
#main-header.light-header ins-dropdown:hover,
#main-header.light-header ins-dropdown .ins-dropdown:hover,
#main-header .ins-dropdown_label:hover {
    color: var(--color-main);
}

#main-header.light-header ins-dropdown .ins-dropdown_menu a:hover,
#main-header ins-dropdown button:hover {
    background: var(--color-main-hover-light);
    color: var(--color-main-hover);
}

#main-header ins-dropdown button:hover span {
    color: var(--color-main-hover);
}

#main-header.light-header .navlinks .nav-sign-in-btn {
    color: var(--color-main);
}

#main-header.light-header .navlinks .nav-sign-in-btn:hover {
    color: #2331B7 !important;
    background: rgba(48, 68, 255, 0.06);
}

#main-header.light-header .mobile-menu-toggle #mobile-menu-btn {
    color: var(--color-main);
    padding: 8px;
    background: var(--color-main-hover-light);
    border-radius: 4px;
}

#main-header.light-header .mobile-menu-toggle .nav-sign-in-btn {
    color: var(--color-main);
    font-weight: 700;
    font-size: 14px;
    margin-right: 24px;
}

.vertical-line {
    border-left: 1px solid var(--color-ui-04);
    height: 24px;
    margin: 8px;
}




.mobile-menu-toggle #mobile-menu-btn {
    color: var(--font-color-inv, #fff);
}

.mobile-menu-container {
    display: block;
    visibility: visible;
}

.mobile-menu-container ins-drawer:not([is-open="true"]) {
    visibility: hidden;
}

.mobile-menu-button-container {
    padding-top: 24px;
    padding-bottom: 24px;
}

.mobile-menu-button-container .grid-container {
    justify-content: flex-end;
}

.mobile-menu-style .ins-accordion .ins-accordion-item .ins-accordion-item_content .inner-content {
    border-left: none;
    border-right: none;
    border-bottom: none;
}

.sign-out-wrapper .signOutCustom,
.sign-out-wrapper .signOutCustom button {
    height: 62px;
}

@media screen and (max-width: 1066px) and (min-width: 1029px) {
    #main-header ins-dropdown {
        padding: 8px;
    }
}

@media screen and (max-width: 1028px) {
    .hide-nav-medium {
        display: none;
    }

    .mobile-menu-toggle {
        display: flex !important;
        align-items: flex-end;
        margin-left: auto;
        flex-direction: row;
        justify-content: flex-end;
    }

    #main-header {
        width: 100%;
        z-index: 9;
        background-color: transparent;
        transition: transform 0.3s ease-in-out, background-color 0.3s ease, position 0.3s ease;
        padding: 24px 0;
    }

    .logo {
        max-height: 66px !important;
    }
}


#main-header.no-light-header {
    background-color: #05051D;
}

/********** [Mobile Menu] **********/


.mobile-menu-toggle {
    position: relative;
    display: none;
}

#mobile-menu-btn {
    font-size: var(--font-large);
    color: #fff;
    cursor: pointer;
    pointer-events: auto !important;
    z-index: 1010 !important;
    position: relative;
}

.mobile-nav-button {
    pointer-events: auto !important;
    cursor: pointer;
    z-index: 1010 !important;
    position: relative;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.mobile-nav-button * {
    pointer-events: none;
}

.nav-menu-wrapper-m {
    pointer-events: auto !important;
    z-index: 1010 !important;
    position: relative;
}

.join-us-drawer-link {
    display: none;
}

@media screen and (max-width: 393px) {
    .nav-menu-wrapper-m .join-us {
        display: none;
    }

    .join-us-drawer-link {
        display: list-item;
    }
}

ins-drawer#mobile-menu .ins-drawer-header {
    height: 82px;
    padding: 24px;
}
ins-drawer#mobile-menu .ins-drawer-close-btn {
    background: var(--color-gradient-02);
    width: 34px;
    height: 34px;
    padding-top: 6px;
    border-radius: 100%;
    color: var(--font-color-inv);
    font-size: 18px !important;
    top: 24px !important;
}
ins-drawer#mobile-menu .ins-drawer-wrap .ins-content {
    padding-bottom: 0 !important;
}

ins-drawer#mobile-menu ul {
    margin-left: 0;
}

ins-drawer#mobile-menu .menu li,
ins-drawer#mobile-menu .inner-content .ins-accordion-link {
    background-color: var(--color-ui-01);
    border-bottom: 1px solid var(--color-ui-03);
}

ins-drawer#mobile-menu ins-accordion-link:last-child .ins-accordion-link {
    border-bottom: 0px;
}


ins-drawer#mobile-menu .menu li.small a,
ins-drawer#mobile-menu .ins-accordion-item>.ins-accordion-item_header>.inner-head .heading,
ins-drawer#mobile-menu .user-info ins-accordion-item ins-button button .btn__label {
    font-family: var(--font-family-01);
    font-size: 16px;
    font-weight: 400;
    text-transform: initial;
    letter-spacing: normal;
}

ins-drawer#mobile-menu .menu li.small a.navigation-cta {
    font-family: var(--font-family-01);
    font-weight: 700;
    line-height: var(--font-x-large);
}

ins-drawer#mobile-menu .user-info ins-accordion-item ins-button:not(:hover) button .btn__label {
    color: var(--font-color-body);
}

ins-drawer#mobile-menu .menu li.small i {
    font-size: var(--font-medium);
    line-height: 19px;
    margin-right: 10px;
}

ins-drawer#mobile-menu .menu li {
    margin-bottom: 0px;
}

ins-drawer#mobile-menu .menu li>a,
ins-drawer#mobile-menu .menu li button {
    padding: 16px 24px !important;
}

ins-drawer#mobile-menu .menu .ins-accordion-item_content .ins-accordion-link>a {
    padding: 16px 24px 16px 40px;
}

ins-drawer#mobile-menu .menu li .sign-out-wrapper .signOutCustom {
    height: auto;
    display: block;
}

ins-drawer#mobile-menu .menu li .sign-out-wrapper .signOutCustom button {
    display: block;
    height: auto;
    line-height: 150%;
}

ins-drawer#mobile-menu .menu li .nav-register-btn {
    padding: 16px 24px;
}

ins-drawer#mobile-menu .menu a {
    color: var(--font-color-body, #575757);
    font-size: 16px;
    font-weight: 400 !important;
}

ins-drawer#mobile-menu .ins-accordion-link a,
ins-drawer#mobile-menu .ins-accordion-link a span {
    color: var(--font-color-body, #575757) !important;
}

ins-drawer#mobile-menu .ins-accordion-link a span {
    font-weight: 400 !important;
}

ins-drawer#mobile-menu .ins-accordion-item>.ins-accordion-item_header>.inner-head .heading {
    display: inline;
    padding: 0;
    color: var(--font-color-body, #575757);
    font-family: var(--font-family-01);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
}

ins-drawer#mobile-menu .ins-accordion-item>.ins-accordion-item_header>.inner-head {
    padding: 16px 24px;
}

ins-drawer#mobile-menu .menu li a.active,
ins-drawer#mobile-menu .menu li a:hover,
ins-drawer#mobile-menu .menu li a:focus,
.bottom-bar .menu li a.active,
.bottom-bar .menu li a:hover,
.bottom-bar .menu li a:focus,
.bottom-bar .menu .ins-dropdown_label:hover * {
    color: var(--color-main);
    text-decoration: none;
}

ins-drawer#mobile-menu ins-accordion .inner-head .heading {
    font-size: var(--font-medium);
    color: var(--font-color-body);
}

ins-drawer#mobile-menu ins-accordion .ins-accordion-item_header>.inner-head {
    border: 0px;
}

ins-drawer#mobile-menu .ins-accordion.menu ins-accordion-item:first-of-type .ins-accordion-item_header {
    border-top: solid 0px var(--color-ui-04);
}

ins-drawer#mobile-menu .ins-accordion-item.open>.ins-accordion-item_header>.inner-head .heading {
    color: var(--color-main);
}

ins-drawer#mobile-menu .user-info ins-accordion-item ins-button {
    display: block;
    padding: 11px 0px;
    width: 100%;
    height: auto;
    text-align: left;
}

.mobile-register {
    padding: 15px 20px;
}

.mobile-register .nav-register-btn {
    padding: 0;
    color: #fff !important;
    text-align: center;
}

/* Mobile Menu Drawer Styles */
ins-drawer#mobile-menu {
    display: block !important;
    visibility: visible !important;
}

ins-drawer#mobile-menu .ins-drawer-wrap .ins-content {
    background: #F5F5F5;
    overflow-x: hidden;
}

.mobile-menu-drawer-content {
    background: #FFFFFF;
    min-height: calc(100vh - 82px);
    position: relative;
    padding: 0;
    width: 100%;
}

.mobile-menu-header {
    position: relative;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
}

.mobile-menu-close-btn {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #FF6B35 0%, #C73E1D 100%);
    padding: 0;
    transition: transform 0.2s ease, opacity 0.2s ease;
    flex-shrink: 0;
}

.mobile-menu-close-btn:hover {
    transform: scale(1.05);
    opacity: 0.9;
}

.mobile-menu-close-btn:active {
    transform: scale(0.95);
}

.mobile-menu-close-btn svg {
    width: 24px;
    height: 24px;
}

.mobile-menu-list {
    list-style: none;
    width: 490px;
    margin: 0;
    padding: 0;
    background: #FFFFFF;
}

.mobile-menu-item {
    border-bottom: 1px solid #E5E5E5;
}

.mobile-menu-item:last-child {
    border-bottom: none;
}

.mobile-menu-item a {
    display: block;
    padding: 21px 24px;
    color: var(--font-color-body);
    font-family: var(--font-family-01);
    font-size: 16px;
    font-weight: 400;
    text-decoration: none;
    transition: color 0.2s ease;
    line-height: 1.5;
}

.mobile-menu-item a:hover,
.mobile-menu-item a:focus {
    color: var(--color-main);
    background-color: transparent;
}


@media screen and (max-width: 1024px) {

    ins-drawer#mobile-menu .ins-drawer-wrap .ins-content,
    ins-drawer#mobile-menu .ins-backdrop-wrap {
        top: 0;
        /* padding-bottom: 105px; */
    }

    .top-bar .top-bar-left,
    .top-bar .top-bar-right {
        flex: 0 0 auto;
    }

    .top-bar div:last-child {
        margin-bottom: 0;
    }
}

@media screen and (min-width: 640px) and (max-width: 1023px) {
    .top-bar .top-bar-left {
        max-width: 65%;
        margin-right: 5%;
    }

    .top-bar .top-bar-right {
        max-width: 30%;
    }

    .top-bar-right a {
        display: block;
        padding-bottom: 5px;
    }
}

@media screen and (max-width: 1024px) {
    .page-heading {
        max-width: initial;
    }

    .page-header-wrap .img-wrap+.page-heading {
        max-width: 100%;
        padding: 0 25px;
        left: 0;
        margin-left: 0;
    }
}

.signOutCustom .ins-button div .btn__label {
    font-size: 14px !important;

    font-weight: 400 !important;
}

.signOutCustom button {
    padding: 24px !important;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}


.signOutCustom button:hover {
    color: var(--font-color-head) !important;
    background-color: #F9FAFB !important;
}

@media screen and (max-width: 639px) {
    .signOutCustom .ins-button div .btn__label {
        color: var(--font-color-body) !important;
    }

    .signOutCustom button:hover {
        background-color: #fff !important;
    }
}

/********** [Footer] ***********/

footer .heading {
    font-family: var(--font-family-02);
    font-weight: 600;
    display: block;
}

.footer-logo-wrapper {
    display: flex;
    min-width: 245px;
    flex-direction: column;
    align-items: flex-start;
    gap: 26px;
}

.footer-link-main-label,
.footer-link-main-label a {
    color: var(--font-color-head);
    font-family: var(--font-family-02);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
}

.footer-link-main-label {
    margin-bottom: 0px;
}

.footer-links-wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 80px;
}

.footer-links-wrap .right-group {
    margin-left: auto;
    /* Push everything after content 1 to the right */
}

.footer-text-links-wrap {
    display: flex;
    flex-direction: row;
    gap: 26px;
}

@media screen and (max-width: 900px) {
    .footer-text-links-wrap {
        flex-direction: column;
        gap: 16px;
    }
}

.copyright .footer-links,
a.footer-text-links {
    font-family: var(--font-family-02);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 18px */
    color: var(--font-color-body);
    text-decoration: none;
}

a.footer-text-links:hover {
    color: var(--font-color-link);
    margin-left: auto;
}

.footer-message {
    max-width: 500px;
    gap: 26px;
    display: flex;
    flex-direction: column;
}

.footer-message a {
    border-radius: 100px;
    border: 1px solid var(--color-sub1, #000);
    background: var(--color-sub1, #000);
    min-height: 48px;
    padding: 12px 32px;
    max-width: 180px;

    color: var(--font-color-inv, #FFF);
    text-align: center;
    font-family: var(--font-family-01, Poppins);
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
}

.footer-message a:hover {
    background-color: var(--color-sub1-hover);
    border-color: var(--color-sub1-hover);
}

.footer-message p {
    color: rgba(0, 0, 0, 0.80);
    font-family: var(--font-family-02, Poppins);
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: 130%;
}

.footer-tcp {
    font-size: 12px !important;
}

@media screen and (max-width: 1080px) {
    .footer-links-wrap {
        gap: 40px;
    }
}

@media screen and (max-width: 1023px) {
    .footer-links-wrap .wrap {
        width: 50%;
        padding: 0px;
    }

    .footer-bottom-padding {
        padding-bottom: 56px;
    }
}

@media screen and (max-width: 870px) {}

@media screen and (max-width: 639px) {
    .footer-links-wrap {
        flex-direction: column;
    }

    .right-group {
        margin-left: initial !important;
    }
}

.footer-links {
    color: var(--font-color-body, #575757);
    font-family: var(--font-family-02);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
}

.footer-links:hover,
.footer-links:focus,
.footer-links:active {
    color: var(--color-main);
}

.footer-p {
    color: var(--font-color-body, #575757);
    font-family: var(--font-family-02);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
}

footer .social {
    gap: 24px;
    justify-content: flex-end;
}

@media screen and (max-width: 870px) {
    footer .social {
        justify-content: flex-start;
    }
}

footer .social [class*="icon-"] {
    font-size: 18px;
    color: var(--color-main);
}

footer .social.menu a {
    padding: 0;
}

footer .social.menu li:first-child a {
    padding-left: 0;
}

footer .social.menu li:last-child a {
    padding-right: 0;
}

footer .menu a {
    padding: 0;
}

@media screen and (max-width: 1023px) and (min-width: 640px) {
    footer .social.menu a {
        padding-right: 24px;
    }
}

@media screen and (max-width: 639px) {
    .footer-p {
        text-align: left;
    }
}

@media screen and (max-width: 1024px) {
    footer .text-right {
        text-align: left;
        margin-top: 15px;
    }
}

/********** [Scroll to top button] **********/
#scroll-to-top-btn {
    position: fixed;
    right: 24px;
    bottom: 150px;
    transition: all 0.4s 'ease';
}

@media screen and (max-width: 906px) {
    #scroll-to-top-btn {
        bottom: 24px;
    }
}


/********** [Breadcrumbs] **********/

.breadcrumbs {
    margin-bottom: 0px;
    padding: 16px 0;
}

.breadbrumbs__wrapper {
    border-bottom: 1px solid var(--color-ui-03);
}

.breadcrumbs span,
.breadcrumbs span a {
    color: var(--font-color-body);
    font-family: var(--font-family-03);
    font-weight: 400;
    font-size: var(--font-small);
    line-height: var(--font-small);
}

.breadcrumbs span a:hover {
    color: var(--color-main-hover);
}

.breadcrumbs span {
    margin-right: 16px;
}

.breadcrumbs span:not(:first-child) {
    margin-left: 16px;
}

.breadcrumbs i {
    font-size: var(--font-x-small);
    color: var(--color-ui-05);
}

.breadcrumbs span.active,
.breadcrumbs span.active a {
    font-weight: 600;
    color: var(--font-color-head);
    font-family: var(--font-family-01);
    line-height: var(--font-medium);
}

/********** [Components] **********/

/********** [Dynamic slider] **********/
.slider-container {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.slider-track {
    display: flex;
    transition: transform 0.5s ease;
    margin-bottom: 50px;
}



.slider-item-container {
    padding: 0px;
}

.slider-item {
    padding: 24px;
    background-color: #fff;
    box-sizing: border-box;
    border-radius: 14px;
    transition: box-shadow 0.4s ease-in;
    height: 100%;
    width: 100%;
}


.slider-item p {
    white-space: normal;
    color: var(--font-color-body, #575757);
    font-family: var(--font-family-02, Archivo);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

.slider-item h6 {
    color: var(--font-color-head);
    font-family: var(--font-family-01, "DM Sans");
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 0.16px;
    margin-bottom: 8px;
}

.slider-item img {
    max-width: 48px;
    margin-bottom: 16px;
}

.dynamic-slider-buttons {
    margin-left: auto;
    display: flex;
    flex-direction: row;
    gap: 24px;
    margin-bottom: 24px;
}

.dynamic-slider-buttons i {
    font-size: 24px;
    padding: 10px;
    border-radius: 100px;
}

@media screen and (max-width: 639px) {
    .slider-item {
        flex: 0 0 100%;
    }

    .slider-track {
        gap: 0%;
    }
}

@media screen and (min-width: 640px) and (max-width: 930px) {
    .slider-item {
        flex: 0 0 48%;
    }

    .slider-track {
        gap: 4%;
    }
}

@media screen and (min-width: 931px) and (max-width: 1299px) {
    .slider-item {
        flex: 0 0 32%;
    }

    .slider-track {
        gap: 3%;
    }
}

@media screen and (min-width: 1300px) {
    .slider-item {
        flex: 0 0 23%;
    }

    .slider-track {
        gap: 3%;
    }
}

.dynamic-slider-buttons i:hover {
    background: var(--color-main-hover-light, rgba(48, 68, 255, 0.06));
}

.slider-wrapper {
    padding: 0 10px;
}


/********** [Page hero banner] **********/

.hero-title {
    position: relative;
    overflow: clip;
}

.page-hero-container {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
}

.page-hero-container p {
    color: var(--font-color-body);
    font-size: 18px;
    max-width: 720px;
}

.hero-title-overlay {
    width: auto;
    position: absolute;
    right: 0;
    bottom: 0;
    mix-blend-mode: difference;
}


#banner-dynamic-word {
    display: inline-block;
    position: relative;
    height: 1em;
    overflow: hidden;
    vertical-align: baseline;
    line-height: inherit;
    top: 5px;
    left: 8px
}

#banner-dynamic-word .word {
    display: block;
    height: 1em;
    font-weight: bold;
    background: linear-gradient(135deg, #88FF6C 0%, #3F93FF 96.83%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    /* position: absolute; */
    left: 0;
    width: 100%;
    transition: transform 0.4s ease-in-out;
}

#banner-dynamic-word .current {
    top: 0;
    transform: translateY(0);
}

#banner-dynamic-word .next {
    top: 100%;
    transform: translateY(0);
}

@media screen and (max-width: 639px) {
    .page-hero-container p {
        width: 100%;
    }
}


/* Search bar */
.ins-input-wrap .input-wrap .icon-close-1,
#search-description .ins-input-wrap .input-wrap .icon-close-1 {
    background: #fff;
    border: none;
    position: absolute;
    display: flex;
    align-items: center;
    font-size: 16px;
    right: 32px;
    color: var(--font-color-body, #575757);
    transition: border-color .25s ease-in-out;
    top: 12px;
    border-right: 1px solid #DFDFDF;
    padding-right: 8px;
}

#search-input .ins-input-wrap .input-wrap .icon-close-1:hover,
#search-description .ins-input-wrap .input-wrap .icon-close-1:hover {
    color: var(--color-main-hover);
    cursor: pointer;
}

/********** Wrapper **********/
.wrapper-0-24 {
    /* max-width: 1440px; */
    padding: 0 24px;
    margin: 0 auto;
    /* background: var(--color-ui-03); */
}

.about-section-wrapper.wrapper-0-24,
.purpose-section-wrapper.wrapper-0-24 {
    padding: 0px;
}


/********** [Home Page - Hero Banner] **********/
.hero-home-banner {
    background: #3e82c4;
    min-height: 900px;
    height: calc(100vh - 56px);
    overflow: hidden;
    z-index: -1;
    display: flex;
    border-bottom-left-radius: 24px;
    border-bottom-right-radius: 24px;
    position: relative;
}

.hero-background-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    z-index: 0;
}

#hero-logo {
    width: 354px;
    height: 318px;
    aspect-ratio: 59/53;
    margin: 0 auto;
    margin-top: 150px;
    position: relative;
    z-index: 1;
    pointer-events: none;
}

.header-menu-wrapper,
.hero-mobile-nav-wrapper {
    position: relative;
    z-index: 1;
}


/********** [Home Page - Moment to Believe] **********/
.moment-to-believe-section {
    display: flex;
    align-items: flex-start;
    gap: var(--xxxx-large);
    align-self: stretch;
}

.moment-to-believe-section .column-1 {
    display: flex;
    height: 174px;
    width: 49%;
    justify-content: center;
    align-items: center;
}

.moment-to-believe-section .column-2 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--large);
    flex: 1 0 0;
}

.moment-to-believe-section img {
    width: 463px;
    height: auto;
}

@media screen and (max-width: 870px) {
    .moment-to-believe-section {
        flex-direction: column;
        gap: 24px;
    }

    .moment-to-believe-section .column-1 {
        width: 100%;
    }
}

/********** [Home Page - Video] **********/
.video-section {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
}

.video-section .ins-backdrop-wrap {
    background: #000000e6;
}

.video-section .icon-close-1 {
    color: #fff;
    font-size: 20px;
    font-weight: 700;
}

.video-section .ins-card-wrap {
    background: none;
}

/********** [Home Page - Overview Banner] **********/
.homepage.overview-banner,
.about.overview-banner {
    display: flex;
    align-items: stretch;
    gap: 0px;
    border-radius: 14px;
    overflow: hidden;
}

.overview-banner * {
    color: var(--font-color-inv) !important;
}

.overview-banner .column-1 {
    display: flex;
    width: 40%;
    padding: 40px;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    flex-shrink: 0;
    background: var(--color-ui-06);
}

.overview-banner .column-2 {
    width: 60%;
    align-self: stretch;
    background-size: cover;
}

.overview-banner img {
    height: 100%;
    object-fit: cover;
}

@media screen and (max-width: 1023px) {
    .overview-banner {
        flex-direction: column;
    }

    .overview-banner .column-1 {
        width: 100%;
    }

    .overview-banner .column-2 {
        width: 100%;
        height: 307px;
    }
}


/********** [Home Page - Resources] **********/
/* Resources Header */
.resources-wrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--xxxx-large);
}

.resources-header,
.discover-latest-header {
    display: flex;
    gap: 24px;
    align-items: flex-start;
    align-self: stretch;
    justify-content: space-between;
}

.resources-header .column-1,
.resources-header .column-2,
.discover-latest-header .column-1,
.discover-latest-header .column-2 {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.resources-header .column-2,
.discover-latest-header .column-2 {
    gap: 24px;
    max-width: 413px;
}

@media screen and (max-width: 1023px) {
    .resources-header .column-1 .heading-2-large {
        font-size: 56px;
    }

    .resources-header .column-1 .heading-3 {
        font-size: 24px;
    }
}

/* Resources Items */
.resources-items-wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    gap: var(--x-large);
    align-items: stretch;
    width: 100%;
}

@media screen and (max-width: 1023px) {
    .resources-items-wrapper {
        gap: 24px;
    }
}

@media screen and (max-width: 870px) {
    .resources-items-wrapper {
        gap: 16px;
    }
}

.resources-item {
    display: grid;
    padding: 0px;
    flex-direction: column;
    align-items: flex-start;
    flex: 1 0 0;
    align-self: stretch;
}

@media screen and (max-width: 800px) {

    .resources-header,
    .discover-latest-header {
        flex-direction: column;
    }

    .resources-item {
        display: block;
    }

    .resources-items-wrapper {
        display: flex;
        flex-direction: column;
    }
}

@media screen and (min-width: 1515px) and (max-width: 1628px) {
    .join-us-wrapper .form-wrapper{
        height: 100%;
    }
    .join-us-wrapper .image-wrapper{
        max-height: 845px;
    }
}

@media screen and (min-width: 1629px) {
    .join-us-wrapper .form-wrapper{
        height: 100%;
    }
    .join-us-wrapper .image-wrapper{
        max-height: 823px;
    }
}

.resources-item a {
    height: 100%;
}

.resources-item ins-card,
.resources-item ins-card .ins-card-wrap {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.resources-item ins-card .ins-card-wrap,
.discover-latest-card ins-card .ins-card-wrap {
    flex: 1;
    border-radius: 14px;
    overflow: hidden;
}

.resources-item .image-wrapper {
    overflow: hidden;
    height: 240px;
}

.resources-item img,
.discover-latest-card img {
    height: 240px;
    width: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.discover-latest-card .placeholder-img {
    border: 1px solid;
    border-radius: 16px;
}

.resources-item:hover img,
.cell .discover-latest-card:hover .image-wrapper img {
    transform: scale(1.05);
}

.resources-item .text-wrapper {
    display: flex;
    padding: 0 24px 24px;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
    flex: 1;
    min-height: 0;
    justify-content: space-between;
}

.resources-item .text-wrapper>* {
    width: 100%;
}


/********** [Home Page - Discover Latest] **********/
/* Discover Latest - Header */
.discover-latest-header {
    gap: var(--x-large);
}

@media screen and (min-width: 640px) and (max-width: 1023px) {
    .discover-latest-header .heading-2-large {
        font-size: 72px;
    }
}

.hero-banner-img {
    position: relative;
    z-index: 2;
    margin: -400px auto 40px;
    display: block;
}

.hero-banner-img+* {
    margin-top: 0;
}

.hero-banner-img img {
    border-radius: 20px;
}

.hero-bg-title {
    height: 100%;
    width: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-position: 100%;
    mix-blend-mode: difference;
}

@media screen and (max-width: 1028px) {

    .hero-bg-title {
        background-size: auto 100%;
        background-position: 50vw;
    }
}

@media screen and (max-width: 1100px) and (min-width: 640px) {
    .hero-spacer {
        padding-bottom: 80px !important;
    }

    .hero-banner-img {
        margin: -250px auto 40px;
    }
}

@media screen and (max-width: 639px) {
    .discover-latest-header .heading-2-large {
        font-size: 56px;
    }
}

/* Discover Latest - Cards */
/* .discover-latest-card is used in homepage and news page */
/* .resources-page-card (in Resource Page' partials) share style with .discover-latest-card */
.discover-latest-card {
    padding: 20px;
}

.news.discover-latest-card,
.new.resources-page-card {
    padding: 0px;
    margin-top: -20px;
}

.discover-latest-card ins-card .ins-card-wrap,
.discover-latest-card .ins-card-wrap.steady:hover,
.resources-page-card ins-card .ins-card-wrap,
.resources-page-card .ins-card-wrap.steady:hover {
    background: none;
    border: none;
    box-shadow: none;
}

.discover-latest-card .ins-card-wrap.steady:hover button {
    background: var(--color-sub2-hover);
}

.discover-latest-card .image-wrapper,
.resources-page-card .image-wrapper {
    border-radius: 16px;
    overflow: hidden;
}

.discover-latest-card .image-wrapper,
.discover-latest-card img {
    aspect-ratio: 437 / 280;
}

.discover-latest-card .image-wrapper,
.discover-latest-card img,
.resources-page-card .image-wrapper,
.resources-page-card img {
    width: 100%;
    height: auto;
}

.discover-latest-card .subhead-2 {
    color: var(--font-color-sub);
}

.discover-latest-card .ins-card-wrap .grid-x,
.resources-page-card .cell .grid-x {
    flex-wrap: nowrap;
}

.discover-latest-card .text-wrapper,
.resources-page-card .text-wrapper {
    padding: 0px;
    flex: 1;
}

.discover-latest-card .button-wrapper,
.resources-page-card .button-wrapper {
    padding-left: 8px;
}

/* Discover Latest - Carousel */
#newsCardsDesktop,
#newsCardsTablet,
#newsCardsMobile {
    margin-left: -20px;
    /* margin-right: -20px; */
}

.discover-latest-carousel .ins-carousel_slides {
    margin-top: 52px;
}

.product-carousel .ins-carousel_ctrl-btns ins-button button {
    top: -52px;
}

.discover-latest-carousel .carouselMobile .ins-carousel_slides {
    margin-top: 56px;
}

.product-carousel .carouselMobile .ins-carousel_ctrl-btns ins-button button {
    top: -56px;
}

.product-carousel .ins-carousel.layout-1 .ins-carousel_body {
    padding: 0px;
}

.product-carousel .wrap {
    padding: 16px;
}

.product-carousel .ins-carousel_ctrl-btns ins-button button {
    right: 28px;
    padding: 0px !important;
    height: 48px;
    width: 48px;
    border-radius: 50% !important;

}

@media screen and (max-width: 639px) {

    .hero-bg-title {
        background-size: auto 100%;
        background-position: 50vw;
    }

    .hero-banner-img img {
        width: 100%;
        height: 250px;
        object-fit: cover;
    }

    .hero-spacer {
        padding-bottom: 80px !important;
    }


    .hero-banner-img {
        margin: -200px auto 40px;
    }
}

/********** [Home Page - Client Section] **********/
.client-logo-container {
    display: flex;
    justify-content: space-between;
    width: 100%;
    flex-wrap: wrap;
}

.product-carousel .ins-carousel_ctrl-btns ins-button button:hover {
    background: var(--color-main-hover-light);
}

.product-carousel .ins-carousel_ctrl-btns ins-button button:hover .btn__icon {
    color: var(--font-color-inv);
}

.product-carousel .carouselDesktop .ins-carousel_ctrl-btns ins-button button {
    right: 0px;
}

.product-carousel .ins-carousel_ctrl-btns ins-button:nth-child(1) button {
    left: initial;
    right: 86px;
}

.product-carousel .carouselDesktop .ins-carousel_ctrl-btns ins-button:nth-child(1) button {
    right: 64px;
}

@media only screen and (max-width: 768px) {
    .product-carousel .ins-carousel.layout-1 .ins-carousel_ctrl-btns {
        display: initial;
    }
}

.product-carousel .carouselMobile .ins-carousel_ctrl-btns ins-button button {
    width: 48px;
    height: 48px;
}

.product-carousel .carouselMobile .ins-carousel_ctrl-btns ins-button:nth-child(1) button {
    right: 76px;
}

.product-carousel .carouselMobile .ins-carousel_ctrl-btns ins-button:nth-child(2) button {
    right: 12px;
}

.product-carousel .ins-carousel_ctrl-btns .btn__icon {
    color: var(--font-color-body);
    font-size: 18px;
    line-height: 24px;
    margin-left: -3px;
    color: var(--color-main);
}

.product-carousel .ins-carousel_ctrl-btns .icon-angle-left:before {
    content: "\e91f";
}

.product-carousel .ins-carousel_ctrl-btns .icon-angle-right:before {
    content: "\e921";
}

.product-carousel .product-cards {
    margin-top: -12px;
}

.carouselMobile .product-cards {
    margin-top: 68px;
}

.carouselMobile .product-cards .cell {
    padding: 0px;
}

/********** [Home Page - Join Us] **********/
.join-us-wrapper {
    display: flex;
    align-items: stretch;
    gap: var(--x-large);
    align-self: stretch;
}

.join-us-wrapper .image-wrapper {
    position: relative;
    width: 40%;
    border-radius: 24px;
    background: var(--color-ui-07);
    overflow: hidden;
    display: flex;
    align-items: stretch;
}

.join-us-wrapper .image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.join-us-wrapper .image-wrapper .text-wrapper {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 40px;
}

.join-us-wrapper .image-wrapper p {
    color: #FFF;
    font-family: var(--font-family-01);
}

.join-us-wrapper .image-wrapper .body-xxxlarge-bold {
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 130%;
    /* 41.6px */
}

.join-us-wrapper .form-wrapper {
    display: flex;
    width: 60%;
    padding: 80px 40px;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--x-large);
    border-radius: 24px;
    background: var(--color-ui-01);
}

.join-us-wrapper .heading-2 {
    color: var(--color-main);
    font-size: 56px;
    font-weight: 600;
    line-height: 110%;
    /* 61.6px */
}

.join-us-wrapper ins-checkbox-group label,
.volunteer-wrapper ins-checkbox-group label {
    display: none;
}

.join-us-wrapper ins-checkbox .ins-radio-checkbox,
.volunteer-wrapper ins-checkbox .ins-radio-checkbox {
    padding-left: 0px;
}

.join-us-wrapper ins-checkbox .ins-radio-checkbox label .ins-checkbox-radio-label,
.volunteer-wrapper ins-checkbox .ins-radio-checkbox label .ins-checkbox-radio-label {
    color: var(--font-color-body);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: var(--font-family-02);
    font-size: 14px;
    font-weight: 300;
    line-height: 150%;
    /* 21px */
}

.join-us-wrapper .ins-checkbox-radio-label a,
.volunteer-wrapper .ins-checkbox-radio-label a {
    color: var(--font-color-link);
    font-feature-settings: 'liga' off, 'clig' off;
    font-family: var(--font-family-02);
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 150%;
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: none;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font;
}

@media screen and (max-width: 1023px) {
    .join-us-wrapper {
        flex-direction: column;
    }

    .join-us-wrapper .image-wrapper,
    .join-us-wrapper .form-wrapper {
        width: 100%;
    }

    .join-us-wrapper .image-wrapper {
        height: 418px;
    }

    .join-us-wrapper .heading-2 {
        font-size: 48px;
    }
}

.form-checkbox-label {
    color: var(--font-color-body);
    font-family: var(--font-family-02);
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 150%;
    /* 21px */
}

.adaptive-portal-section .adaptive-portal-banner {
    display: flex;
    flex-direction: row;
}

.adaptive-portal-section .adaptive-portal-banner img {
    width: 50%;
}


.adaptive-portal-section .adaptive-portal-banner .adaptive-portal-info {
    width: 50%;
}



.adaptive-portal-section .adaptive-portal-info {
    background: var(--color-ui-02);
}

.adaptive-portal-section .adaptive-portal-info .adaptive-portal-cta {
    margin-left: 10%;
    width: 60%;
}

.adaptive-portal-section .adaptive-portal-info p {
    color: var(--font-color-body, #575757);
    font-family: var(--font-family-02, "Archivo");
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

.adaptive-portal-section .adaptive-portal-info ins-button button {
    color: var(--font-color-link) !important;
    border-radius: 14px;
    background: var(--color-gradient-01);
    padding: 11px 24px;
}

.adaptive-portal-section .adaptive-portal-info ins-button button span {
    color: var(--color-ui-01-font-color-inv, #FFF);
    font-family: var(--font-family-01, "DM Sans");
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    text-transform: none;
}

.adaptive-portal-section .adaptive-portal-info ins-button button i {
    position: relative;
    top: -2px;
}


.adaptive-portal-section .adaptive-portal-info ins-button button:hover {
    background: #2331B7;
}

.adaptive-portal-section .dynamic-slider {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}

.adaptive-portal-section .dynamic-slider .slider-item:hover {
    box-shadow: 0px 24px 38px 0px rgba(0, 0, 0, 0.05), 0px 11px 15px 0px rgba(0, 0, 0, 0.10);
}

@media (max-width: 1130px) {
    .adaptive-portal-section .adaptive-portal-info h2 {
        font-size: 40px;
    }

    .adaptive-portal-section .dynamic-slider {
        bottom: -40px;
    }
}

@media (max-width: 1130px) {
    .adaptive-portal-section .adaptive-portal-banner {
        flex-direction: column;
    }

    .adaptive-portal-section .adaptive-portal-banner img {
        width: 100%;
    }

    .adaptive-portal-section .adaptive-portal-banner .adaptive-portal-info {
        width: 100%;
        height: 700px;
    }

    .adaptive-portal-section .adaptive-portal-info .adaptive-portal-cta {
        margin-left: 0;
        padding: 0 24px;
        width: 100%;
    }
}


/********** [Join Us - Banner] **********/
.join-us-banner {
    border-radius: 24px;
    background-image: linear-gradient(221deg, rgba(253, 196, 88, 0.31) 6.69%, #EE5D51 85.49%), url("../images/join-us-main-banner.webp");
    background-size: cover;
}

.join-us-banner-content {
    display: flex;
    min-height: 600px;
    padding: 128px 0;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 48px;
    align-self: stretch;
}

.join-us-banner-content h1,
.join-us-banner-content p {
    color: var(--font-color-inv);
}

.join-us-banner-content button {
    border: 1px solid var(--color-ui-01);
    background: var(--color-ui-01) !important;
}

.join-us-banner-content .btn__label,
.join-us-banner-content .btn__icon {
    color: var(--color-main-hover);
}

.join-us-banner-content ins-button button.blue.solid:not([disabled]):hover {
    border: 1px solid var(--color-ui-06) !important;
    background: var(--color-ui-06) !important;
}

.join-us-banner-content ins-button button.blue.solid:not([disabled]):hover .btn__label,
.join-us-banner-content ins-button button.blue.solid:not([disabled]):hover .btn__icon {
    color: var(--font-color-inv);
}

.believe {
    color: var(--font-color-inv);
    text-align: center;
    font-family: var(--font-family-04);
    font-size: 164px;
    font-style: normal;
    font-weight: 400;
    line-height: 100%;
    /* 164px */
}

/* Join Us banner responsiveness */
@media screen and (min-width: 1024px) {
    .join-us-banner-content {
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        gap: 64px;
    }

    .join-us-banner-content>div {
        max-width: 60%;
        text-align: left;
    }
}

@media screen and (max-width: 1023px) {
    .join-us-banner-content {
        padding: 96px 0;
    }
}

@media screen and (max-width: 767px) {
    .join-us-banner-content {
        padding: 72px 0;
        gap: 32px;
    }

    .join-us-banner-content h1 {
        text-align: center;
    }

    .believe {
        font-size: 96px;
    }
}

/********** [Join Us - Form] **********/
#join-us-form {
    display: flex;
    flex-direction: column;
    align-items: center;
    align-self: stretch;
}

#join-us-form .wrap .title {
    text-align: center;
    font-family: var(--font-family-01);
    font-size: 90px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    /* 90px */
    text-transform: uppercase;
    background: var(--color-gradient-01);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    padding-top: 2px;
}

#join-us-form .form-wrapper {
    display: flex;
    width: 100%;
    max-width: 600px;
    padding: 40px;
    flex-direction: column;
    align-items: flex-start;
    gap: 40px;
}

/********** [Join Us - Image Collage] **********/
.join-us-collage {
    /* margin-top: -80px; */
}

/********** [Join Us - Stay Engaged] **********/
.stay-engaged-wrapper .heading-2 {
    color: var(--color-main);
}

.stay-engaged-items-wrapper .ins-card-wrap {
    border-radius: 14px;
    background: var(--color-ui-01);
    height: 100%;
}

.stay-engaged-items-wrapper .body-large-bold {
    text-align: left;
}


/********** [Unlock Efficiency Section] **********/
.unlock-efficiency-section {
    background: var(--color-ui-02);
}

.portal-benefits-cards img {
    max-width: 48px;
    margin-bottom: 24px;
}

.portal-benefits-cards h6 {
    margin-bottom: 8px;
}

.portal-benefits-cards p {
    margin-bottom: 40px;
}

.portal-benefits-cards i {
    align-self: flex-end;
    margin-top: auto;
    font-size: 24px;
    transition: transform 0.3s ease, color 0.3s ease;
    color: var(--font-color-head, #05051D);
}

.portal-benefits-cards {
    padding: 24px;
    border-radius: 14px;
    background: var(--color-ui-01, #FFF);
    height: 100%;
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.5s ease-in-out;
}

.portal-benefits-cards:hover {
    box-shadow: 0px 24px 38px 0px rgba(0, 0, 0, 0.05), 0px 11px 15px 0px rgba(0, 0, 0, 0.10);
}

.portal-benefits-cards:hover i {
    transform: translateX(10px);
    color: var(--color-main-hover);
}

.features-item-link {
    width: 22%;
}

.features-container {
    display: flex;
    justify-content: space-between;
}

@media screen and (max-width: 1023px) {
    .features-item-link {
        width: 45%;
    }

    .features-container {
        justify-content: space-between;
        row-gap: 40px;
        flex-wrap: wrap;
    }
}

@media (max-width: 639px) {
    .features-item-link {
        width: 100%
    }

    .features-container {
        flex-direction: column;
    }
}

/********** [Testimonial] **********/
.feedback-section {
    display: flex;
}

.feedback-section img {
    height: 100%;
    object-fit: cover;
}

.homepagepage-feedback-wrap,
.feedback-image {
    width: 50%;
}

.homepagepage-feedback-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #181818;
}

.homepagepage-feedback-wrap .slide-content {
    padding: 0 15%;
}

.testiMessage {
    color: var(--font-color-inv, #FFF);
    text-align: center;
    font-family: var(--font-family-02, "Archivo");
    font-size: 32px;
    font-style: normal;
    font-weight: 300;
    line-height: 150%;
}

.homepagepage-feedback-wrap ins-carousel {
    height: 100%;
    padding: 32px 0;
}

.homepagepage-feedback-wrap ins-carousel .ins-carousel {
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: space-around;
}

.testiLabel {
    color: var(--font-color-inv, #FFF);
    text-align: center;
    font-family: var(--font-family-01, "DM Sans");
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: 1.8px;
    text-transform: uppercase;
}

.testiName,
.testiPos {
    color: var(--font-color-inv, #FFF);
    text-align: center;
    font-family: var(--font-family-02, Archivo);
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
}

.testiName {
    font-size: 18px;
}

.testiPos {
    font-size: 14px;
}

.feedback ins-radio .ins-radio-checkbox label .ins-checkbox-radio-label {
    color: var(--font-color-head);
    font-family: var(--font-family-02);
    font-size: 14px;
}

.feedback ins-radio .ins-radio-checkbox .ripple-check {
    background: var(--color-ui-04, #DFDFDF);
}

.feedback ins-radio .ins-radio-checkbox .ripple-check:checked {
    background: var(--color-main);
}

@media (max-width: 639px) {
    .homepagepage-feedback-wrap .slide-content {
        padding: 0 24px;
    }
}

@media (max-width: 1023px) {

    .create-account-container,
    .account-container {
        padding: 24px !important;
        height: auto !important;
    }

    .account-container-logo {
        padding: 24px !important;
    }

}

ins-table-row:hover:nth-child(odd) {
    background: none !important;
}

ins-table.for-pagination-only .ibt-table-wrap.no-label .ibt-table-wrap__no-heading {
    border: none !important;
}

.ibt-table-wrap__settings,
.ibt-table-wrap.no-label .ibt-table-wrap__no-heading {
    background: transparent;
}

/* Media query for mobile view (639px or smaller) */
@media (max-width: 639px) {

    .homepagepage-feedback-wrap,
    .feedback-image {
        width: 100%;
        /* Make them full width */
    }

    .feedback-image {
        height: 400px;
    }

    .feedback-image img {
        width: 100%;
    }

    .feedback-section {
        flex-direction: column;
    }

    /* ACCOUNT - MOBILE RESPONSIVE */

    .create-account-container,
    .account-container {
        padding: 56px 24px !important;
        height: auto !important;
    }

    .account-container-logo {
        padding: 56px 24px 0px 24px !important;
    }

    .create-an-account-div {
        padding: 0px !important;
    }

    .layout-background {
        height: 400px;
    }

    .account-body {
        align-content: space-between;
    }

    .create-account-container ins-button button.blue.outlined,
    .create-account-container ins-button button.blue.solid,
    .account-container ins-button button.blue.solid,
    .my-details ins-button button.blue.solid,
    .my-details ins-button button.blue.outlined,
    ins-button.update-company-details-button button.blue.solid,
    .add_credit_card_details_container ins-button button.blue.solid,
    .empty-state ins-button button.blue.solid,
    .insites-form-grid ins-button button.blue.solid,
    #submit-personal-details,
    #submit-company-details,
    #submit-confirmation,
    #payment-details #checkout-submit-btn,
    #payment-details #checkout-submit-btn button,
    .cancelModalButton,
    .inviteUserModalButton,
    .cancelModalButton ins-button,
    .cancelModalButton ins-button button,
    .inviteUserModalButton ins-button,
    .inviteUserModalButton ins-button button {
        width: 100% !important;
    }

    #payment-details #checkout-submit-btn {
        margin-top: 40px;
    }

    #add-user-modal .addUserModalButton {
        flex-direction: column !important;
    }

    .ins-step_details {
        margin: 0px 0px !important;
    }

    #add-user-modal .ins-modal-wrap.show-modal ins-card .ins-card-wrap {
        max-width: 400px !important;
    }

    /* Portal - Mobile Responsive */
    .main-content {
        padding: 56px 24px !important;
    }

    /* Request Table - Mobile Responsive */
    .request-table-data ins-table-td {
        padding: 16px 24px !important
    }

    ins-table-row:nth-child(even) {
        background-color: #fff !important;
    }

    /* Pagination */
    .ibt-table-wrap .pagination-wrap.full {
        text-align: center;
        display: block;
    }

    /* Paybill */
    .add_credit_card_details_container {
        display: flex;
        justify-content: space-between;
        flex-direction: column;
        gap: 24px;
    }

    .ins-credit-card-compact-size {
        margin-bottom: 0px;
    }

    .spacer-for-small-only {
        padding-bottom: 24px !important;
    }

    .payment-success-notif {
        text-align: left !important;
    }
}

@media (max-width: 380px) {
    #add-user-modal .ins-modal-wrap.show-modal ins-card .ins-card-wrap {
        max-width: 315px !important;
    }

    .ibt-table-wrap .pagination-wrap.full {
        display: flex;
        flex-direction: column;
    }

    .ibt-table-wrap__pagination {
        width: auto !important;
        margin-left: 0 !important;
    }
}

/********** [About Us] **********/

.about-us-section-content-1 h2 {
    color: var(--font-color-head, #05051D);
    font-family: var(--font-family-01, "DM Sans");
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 0.32px;
}

.about-us-section-content-1 .description {
    padding-right: 56px;
}



.about-us-section-content-1 p {
    color: var(--font-color-body, #575757);
    font-family: var(--font-family-02, "Archivo");
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

.about-us-section-content-1 .about-us img {
    display: block;
    width: 100%;
    height: 400px;
    object-fit: cover;
    border-radius: 20px;
}

.about-support {
    background: var(--color-ui-02);
}

.about-support .support-card {
    padding: 32px;
    border-radius: 12px;
    border: 1px solid var(--color-ui-04, #DFDFDF);
    background: var(--color-ui-01, #FFF);
    transition: box-shadow 0.3s ease-in-out;
    height: 100%;
}

.about-support .support-card:hover {
    box-shadow: 0px 24px 38px 0px rgba(0, 0, 0, 0.05), 0px 11px 15px 0px rgba(0, 0, 0, 0.10);
    cursor: pointer;
}

.about-support .support-card i {
    border-radius: 14px;
    background: rgba(48, 68, 255, 0.06);
    color: var(--color-main, #3044FF);
    font-size: 24px;
    padding: 8px;
}

.about-support .support-card hr {
    background: #3044FF;
    height: 2px;
}

.description-content {
    max-width: 720px;
}

.about-us-our-team .description-content {
    margin-left: auto;
}

.our-team-card p {
    font-size: 14px;
    font-weight: 400;
}

.support-heading {
    color: var(--font-color-head, #05051D);
    font-family: var(--font-family-01, "DM Sans");
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 0.16px;
}

.our-team-name {
    color: var(--font-color-head, #05051D);
    font-family: var(--font-family-01, "DM Sans");
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 130%;
    letter-spacing: 0.24px;
}

@media screen and (max-width: 639px) {
    .about-us-section-content-1 .description {
        padding-right: 0;
    }

    .about-us-section-content-1 p {
        margin-bottom: 56px;
    }

    .about-us-section-content-1 .about-us img {
        width: 100%;
    }
}

/********** [FAQ] **********/
.faq-sidenav .ins-accordion-link {
    border: none;
}

.faq-mobile-nav .ins-accordion-link_link {
    color: #2c3148 !important;
}

.faq-sidenav .ins-accordion-link.active>.ins-accordion-link_link {
    color: var(--font-color-head, #05051D);
    font-family: var(--font-family-02, Archivo);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}

.faq-sidenav .ins-accordion-link:hover {
    background-color: transparent;
}

.faq-sidenav .ins-accordion-link.active>.ins-accordion-link_link:hover {
    color: var(--color-main);
    text-decoration: none;
}


.faq-sidenav .set-active .ins-accordion-link a {
    font-weight: 700 !important;
    border-radius: 16px;
    text-decoration: none;
    background: rgba(67, 108, 242, 0.1);
    color: var(--color-main) !important;
}

.faq-content-questions .ins-accordion .ins-accordion-item .ins-accordion-item_header .inner-head .heading {
    color: var(--font-color-head, #05051D);
    font-family: var(--font-family-02, Archivo);
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    width: 98%;
    display: inline-block;
}

.faq-content-questions .ins-accordion .ins-accordion-item .ins-accordion-item_header .inner-head {
    padding: 24px;
    padding-left: 16px;
    border: none !important;
    border-bottom: 1px solid var(--color-ui-04, #DFDFDF) !important;
    transition: border-bottom ease-in .3s;
}

.faq-content-questions .ins-accordion .ins-accordion-item.open .ins-accordion-item_header .inner-head {
    border: none !important;
}

.faq-content-questions .ins-accordion .ins-accordion-item.open .ins-accordion-item_header .inner-head:hover {
    border: none !important;
}


.faq-content-questions .ins-accordion .ins-accordion-item .ins-accordion-item_header .inner-head:hover {
    border: none;
    border-bottom: 1px solid #3044FF !important;
    background: rgba(48, 68, 255, 0.06);
}

.faq-content-questions .ins-accordion-item_content .inner-content {
    border: none;
    border-bottom: 1px solid #3044FF;
    background: rgba(48, 68, 255, 0.06);
}

.faq-content-questions .ins-accordion-item.open>.ins-accordion-item_header>.inner-head {
    background: rgba(48, 68, 255, 0.06);
}

.faq-content-questions .ins-accordion-item_content .inner-content {
    padding-left: 16px !important;
    font-size: 16px;
    padding-top: 0;
}

@media screen and (max-width: 639px) {
    .faq-sidenav {
        display: none;
    }
}

/********** [Dynamic Content Styling] **********/

.dynamic-content,
.dynamic-content p {
    color: var(--font-color-body);
}

.dynamic-content h1,
.dynamic-content h2,
.dynamic-content h3,
.dynamic-content h4,
.dynamic-content h5 {
    color: var(--font-color-head);
}

.dynamic-content p,
.dynamic-content h1,
.dynamic-content h2,
.dynamic-content h3,
.dynamic-content h4,
.dynamic-content h5 {
    margin-bottom: calc(2 * var(--gutter));
}

.dynamic-content table,
.dynamic-content table tbody,
.dynamic-content table thead,
.dynamic-content table td,
.dynamic-content table th {
    border: none;
    outline: none;
}

.dynamic-content table td,
.dynamic-content table th {
    vertical-align: top;
}

.dynamic-content table td:first-child,
.dynamic-content table th:first-child {
    padding-left: 0;
}

.dynamic-content table td:last-child,
.dynamic-content table th:last-child {
    padding-right: 0;
}

.dynamic-content table td+td {
    width: 50%;
}

@media screen and (max-width: 1023px) {
    .dynamic-content table td {
        width: 100%;
        display: block;
    }

    .dynamic-content table td+td {
        width: 100%;
        padding-top: calc(2 * var(--gutter));
    }
}


/********** [Our Team] **********/

.our-team img,
.our-team .placeholder-img {
    border-radius: 5px;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.our-team img {
    border-radius: 12px;
}


.our-team .team-list .description {
    font-family: var(--font-family-02);
    font-size: var(--font-medium);
}

.our-team .details a {
    font-size: var(--font-medium);
}

.our-team .details p [class*="icon-"] {
    padding-right: 12px;
}

.our-team .social.menu [class*="icon-"] {
    font-size: var(--font-large);
    color: var(--font-color-head);
}

.our-team .social.menu a {
    padding: 20px 0px;
}

.team-image-wrapper {
    position: relative;
    overflow: hidden;
}

.team-image-wrapper .overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.3);
    /* white overlay */
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}


.team-image-wrapper:hover img {
    transform: scale(1.05);
    /* subtle zoom */
}

.team-image-wrapper:hover .overlay {
    opacity: 1;
}

@media screen and (min-width: 2650px) {
    .our-team img {
        max-height: 400px;
        width: 100%;
    }

}

/********** [Blog / News] **********/

.go-back-nav {
    font-family: var(--font-family-02);
    font-weight: 600;
    font-size: var(--font-small);
    line-height: 17px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.blog .ins-select-wrap.small .ins-select-options-wrap {
    min-width: initial;
}

.blog-list .spacer.small {
    padding-left: 0px;
    padding-right: 0px;
}

.blog-list .body-link {
    font-family: var(--font-family-03);
    font-weight: 600;
    font-size: var(--font-small);
    line-height: 17px;
}

.blog-list .body-link i {
    margin-left: 12px;
    font-weight: 600;
}

.blog img {
    border-radius: 5px;
}

.news.discover-latest-card .grid-x {
    gap: 40px 0px;
}

@media screen and (max-width: 1023px) {
    .news.discover-latest-card .grid-x {
        gap: 20px 0px;
    }
}

@media screen and (max-width: 639px) {
    .news.discover-latest-card .grid-x {
        gap: 0px;
    }
}

iframe {
    border: none;
}

.no-list-style {
    list-style: none;
}

#blog-content iframe {
    width: 100%;
}

.news-content {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.news-page-container {
    padding-top: 80px;
}

.news-content .card {
    border: none;
    height: 100%;
}

.news-content .card img {
    width: 100%;
    height: 260px;
    object-fit: cover;
}

.newsSubheading {
    color: var(--font-color-sub, #323232);
    font-family: var(--font-family-02, Archivo);
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.news-link i {
    color: var(--color-main, #3044FF);
    text-align: center;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    padding: 12px 17px;
}

.newsContentContainer {
    display: flex;
    height: 100%;
    justify-content: space-between;
}

.markdown a {
    color: var(--color-main, #3044FF);
}


.news-tag span {
    text-align: center;
    font-family: var(--font-family-02, "Archivo");
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    padding: 4px 8px !important;
    border-radius: 4px;
}

.news-tag .icon-star {
    background: transparent !important;
    position: relative;
    bottom: -1px;
    padding: 0 !important;
}

.tagButton {
    margin-top: 16px;
    display: block;
}

.newsImageContainer {
    overflow: hidden;
    transition: border-radius 0.3s ease;
    height: 100%;
    width: 100%;
    position: relative;
}

.news-main-link-container:hover .newsImageContainer img {
    transform: scale(1.03);
    transition: transform 0.5s ease-in, background 0.5s ease-in;
    object-fit: cover;
}

.news-main-link-container:hover .news-link i {
    border-radius: 100px;
    background: var(--color-main-hover-light);
    color: var(--color-main);
    padding: 17px;
}

.news-details-holder {
    max-width: 1024px;
    margin: 0 auto;
    padding: 0 32px;
}

.news-details-holder ul {
    list-style: disc;
    padding-left: 0px;
}

.news-details-holder li {
    margin-bottom: 16px
}

.news-details-holder p,
.news-details-holder ul {
    margin-bottom: 24px;
}

.news-details-holder h6 {
    font-size: 18px;
}

.news-header-container {
    display: flex;
}

.news-header-container .newsContentContainer {
    position: relative;
    flex-direction: column;
    width: 55%;
}

.news-header-container .subhead-2 {
    color: var(--font-color-sub);
}

.news-header-container .news-header-img-container {
    width: 45%;
    overflow: hidden;
    border-radius: 24px;
}


.news-header-container .news-header-img-container img {
    aspect-ratio: 752 / 419;
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 24px;
}

.news-back-link {
    color: var(--color-main, #3044FF) !important;
    font-family: var(--font-family-01);
    color: var(--color-main) !important;
    font-family: var(--font-family-01, );
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
    margin-bottom: 16px;
}

.news-back-link i {
    position: relative;
    top: 1px;
    margin-right: 8px;
    margin-top: 16px;
}

.news-header-container .description p {
    font-size: 18px;
}

.news-header-container .news-author p {
    font-size: 12px;
}

.news-header-container .news-content {
    width: 70%;
}

.news-cards {
    max-height: 600px;
}

.news-author-details {
    font-weight: 500 !important;
    color: #323232 !important;
}

@media screen and (max-width: 1023px) {
    .filter-container-cell {
        padding-bottom: 0 !important;
        padding-top: 0 !important;
    }

    .search-container-cell {
        padding-bottom: 0 !important;
        padding-top: 24px !important;
    }
}

@media screen and (max-width: 640px) {
    .filter-container-cell {
        height: 76px;
    }
}

@media screen and (min-width: 640px) and (max-width: 1023px) {
    .news-header-container .news-header-img-container {
        width: 50%;
    }

    .news-details-holder {
        padding: 0 32px;
    }

}


@media screen and (max-width: 980px) {
    .news-header-container {
        flex-direction: column;
    }

    .news-header-container .news-header-img-container {
        width: 100%;
    }

    .news-header-container .news-content {
        width: 100%;
        margin-bottom: 56px;
    }

    .news-details-holder {
        padding: 0 24px;
    }

    .news-header-container .newsContentContainer {
        width: 100%;
    }
}

/********** [Parishes - Details] **********/
/* Parishes Details reuse News Details styles */
.news-details-holder .downloads-items-wrapper {
    display: flex;
    align-items: flex-start;
    align-content: flex-start;
    gap: 24px;
    align-self: stretch;
    flex-wrap: wrap;
}

ins-button.white button.solid,
ins-button.white button.solid:not([disabled]):hover {
    background: var(--color-ui-01) !important;
    color: var(--color-main) !important;
}

ins-button.white.large button.solid {
    border-radius: 24px;
    min-height: 56px;
}

ins-button.white button.solid:not([disabled]):hover {
    box-shadow: 0 12px 12px 0 rgba(0, 0, 0, 0.05), 0 2px 5px 0 rgba(0, 0, 0, 0.10);
}

ins-button.white.large button.solid .btn__label {
    color: var(--font-color-body);
    font-family: var(--font-family-02);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    /* 24px */
    padding-top: 4px !important;
}

ins-button.white.large button .btn__icon {
    height: 24px;
    width: 24px;
}

.downloads-items-wrapper .icon-file::before {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M13 9H18.5L13 3.5V9ZM6 2H14L20 8V20C20 20.5304 19.7893 21.0391 19.4142 21.4142C19.0391 21.7893 18.5304 22 18 22H6C5.46957 22 4.96086 21.7893 4.58579 21.4142C4.21071 21.0391 4 20.5304 4 20V4C4 3.46957 4.21071 2.96086 4.58579 2.58579C4.96086 2.21071 5.46957 2 6 2ZM10.93 12.44C11.34 13.34 11.86 14.08 12.46 14.59L12.87 14.91C12 15.07 10.8 15.35 9.53 15.84L9.42 15.88L9.92 14.84C10.37 13.97 10.7 13.18 10.93 12.44ZM17.41 16.25C17.59 16.07 17.68 15.84 17.69 15.59C17.72 15.39 17.67 15.2 17.57 15.04C17.28 14.57 16.53 14.35 15.29 14.35L14 14.42L13.13 13.84C12.5 13.32 11.93 12.41 11.53 11.28L11.57 11.14C11.9 9.81 12.21 8.2 11.55 7.54C11.4693 7.46161 11.3738 7.40003 11.2691 7.35883C11.1644 7.31763 11.0525 7.29764 10.94 7.3H10.7C10.33 7.3 10 7.69 9.91 8.07C9.54 9.4 9.76 10.13 10.13 11.34V11.35C9.88 12.23 9.56 13.25 9.05 14.28L8.09 16.08L7.2 16.57C6 17.32 5.43 18.16 5.32 18.69C5.28 18.88 5.3 19.05 5.37 19.23L5.4 19.28L5.88 19.59L6.32 19.7C7.13 19.7 8.05 18.75 9.29 16.63L9.47 16.56C10.5 16.23 11.78 16 13.5 15.81C14.53 16.32 15.74 16.55 16.5 16.55C16.94 16.55 17.24 16.44 17.41 16.25ZM17 15.54L17.09 15.65C17.08 15.75 17.05 15.76 17 15.78H16.96L16.77 15.8C16.31 15.8 15.6 15.61 14.87 15.29C14.96 15.19 15 15.19 15.1 15.19C16.5 15.19 16.9 15.44 17 15.54ZM7.83 17C7.18 18.19 6.59 18.85 6.14 19C6.19 18.62 6.64 17.96 7.35 17.31L7.83 17ZM10.85 10.09C10.62 9.19 10.61 8.46 10.78 8.04L10.85 7.92L11 7.97C11.17 8.21 11.19 8.53 11.09 9.07L11.06 9.23L10.9 10.05L10.85 10.09Z' fill='%23EF5350'/%3E%3C/svg%3E");
}

/********** [Schools - Details] **********/
/* Schools Details reuse News Details styles */
.schools-videos-wrapper .ins-card-wrap {
    display: flex;
    flex-direction: column;
    border: none;
    background: none;
    height: 100%;
}

.schools-videos-wrapper .ins-card-wrap,
.schools-videos-wrapper .ins-card-wrap.steady:hover {
    box-shadow: none;
}

.schools-videos-wrapper .thumbnail-wrapper {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
}

.schools-videos-wrapper .thumbnail-wrapper img {
    aspect-ratio: 325 / 220;
    width: 100%;
    height: auto;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.schools-videos-wrapper .thumbnail-wrapper img:hover {
    transform: scale(1.05);
}

.schools-videos-wrapper .thumbnail-wrapper .icon-only {
    position: absolute;
    top: calc(50% - 32px);
    left: calc(50% - 32px);
}

.schools-videos-wrapper .bottom-wrapper {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.schools-videos-wrapper .title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    flex: 1;
    max-height: 48px;
    margin-bottom: 10px;
    overflow: hidden;
    color: var(--font-color-head);
    font-family: var(--font-family-02) !important;
    font-size: 16px !important;
    font-style: normal !important;
    font-weight: 600 !important;
    line-height: 150% !important;
    /* 24px */
}

#video-modal .ins-backdrop-wrap {
    background: rgba(0, 0, 0, 0.9);
}

#video-modal .ins-modal-wrap.show-modal ins-card .ins-card-wrap {
    max-width: 960px;
}

#video-modal .ins-modal-body {
    padding: 0px 24px;
}

#video-modal iframe {
    width: 960px;
    max-width: 100%;
    height: 540px;
    border: none;
}

/********** [Videos & Podcast - Details] **********/
/* Videos & Podcast Details reuse News Details styles */
.video-podcast iframe {
    aspect-ratio: 1024 / 576;
    width: 100%;
    height: auto;
}


/********** [Resources - Page] **********/
/* There is an existing resources block in homepage, so we need to style it differently */
.resources-page-wrapper .heading-wrapper {
    margin-top: -12px;
    margin-bottom: -12px;
}

.resources-page-wrapper .heading-2 {
    color: var(--color-main);
}

.resources-page-wrapper .image-wrapper,
.resources-page-wrapper .image-wrapper img {
    aspect-ratio: 318 / 198;
}

.resources-page-wrapper .image-wrapper img {
    object-fit: cover;
    transition: transform 0.3s ease;
}

.resources-page-card {
    margin-top: -20px;
    margin-bottom: -20px;
}

.resources-page-card .wrap.disabled {
    opacity: .6;
}

.resources-page-card .wrap:not(.disabled):hover img {
    transform: scale(1.05);
}

.resources-page-wrapper .pagination-wrap {
    padding: 0px;
}

.ibt-table-wrap__prev-next button.page.active:disabled {
    color: var(--color-main);
}

.ibt-table-wrap__prev-next button {
    color: var(--font-color-body);
}

.pagination-wrap .button-pages {
    padding: 0px;
}


/********** [Resources - Page - Skeleton] **********/
.catechesis-skeleton {
    animation: shimmer 1.5s infinite;
    background: linear-gradient(to right, #eeeeee 8%, #dddddd 18%, #eeeeee 33%);
    background-size: 1000px 100%;
    border-radius: 4px;
}

@keyframes shimmer {
    0% {
        background-position: -1000px 0;
    }

    100% {
        background-position: 1000px 0;
    }
}

.skeleton-card {
    padding: 1rem;
}

.skeleton-img {
    width: 100%;
    height: 180px;
    margin-bottom: 0.75rem;
    border-radius: 4px;
}

.skeleton-title {
    width: 80%;
    height: 20px;
    margin-bottom: 0.5rem;
    border-radius: 4px;
}

.skeleton-text {
    width: 100%;
    height: 14px;
    border-radius: 4px;
}

/********** [About - Uniting world faith] **********/
.uniting-world-faith .thumbnail-wrapper {
    position: relative;
    border-radius: 24px;
    overflow: hidden;
}

.uniting-world-faith .thumbnail-wrapper img {
    aspect-ratio: 668 / 445;
    width: 100%;
    height: auto;
    object-fit: cover;
}

.uniting-world-faith .thumbnail-wrapper .icon-only {
    position: absolute;
    top: calc(50% - 64px);
    left: calc(50% - 64px);
}

.uniting-world-faith ins-button.icon-only[size=large] button.blue.solid {
    width: 128px;
    height: 128px;
}

.uniting-world-faith ins-button.icon-only button .btn__icon {
    font-size: 48px !important;
    line-height: 64px;
    width: initial;
    height: initial;
}

@media screen and (max-width: 1023px) {
    .uniting-world-faith .thumbnail-wrapper .icon-only {
        top: calc(50% - 40px);
        left: calc(50% - 40px);
    }

    .uniting-world-faith ins-button.icon-only[size=large] button.blue.solid {
        width: 80px;
        height: 80px;
    }

    .uniting-world-faith ins-button.icon-only[size="large"][icon="icon-play"] button .btn__icon {
        font-size: 28px !important;
        line-height: 100% !important;
        padding-left: 5px;
    }
}

.uniting-world-faith .heading-2 {
    font-size: 56px;
    color: var(--color-main);
}

/********** [About - Explore Australia] **********/
.explore-australia .text-wrapper {
    padding: 0px 24px;
    text-align: center;
}

.explore-australia .heading-3 {
    max-width: 800px;
    margin: 0 auto;
    font-family: var(--font-family-01);
    font-size: 80px;
    font-style: normal;
    font-weight: 600;
    line-height: 1.05;
    text-transform: uppercase;
    background: var(--color-gradient-01);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.explore-australia .body-xxxlarge-bold {
    max-width: 982px;
    color: var(--font-color-head);
}

@media screen and (max-width: 639px) {
    .explore-australia .bg-el-right {
        top: -54px;
    }
}

@media screen and (max-width: 500px) {
    .explore-australia .heading-3 {
        font-size: 15vw;
    }
}

@media screen and (max-width: 400px) {
    .explore-australia .body-xxxlarge-bold {
        font-size: 8vw;
    }
}

/********** [About - What is IEC] **********/
.overview-banner.about .column-2 {
    align-self: stretch;
    background-size: cover;
}

/********** [About the Event] **********/
.about-event .bg-el-left-support-the-mission {
    inset: 775px auto auto 0%;
}

.about-event .bg-el-right {
    inset: 1447px 0% 0% auto;
}

/********** [About the Event - Be renewed] **********/
/********** [Visit Australia - Discover New South Wales] **********/
.be-renewed .column-1 p:not(.heading-2-x-small),
.discover-nsw .column-1 p:not(.heading-2-x-small) {
    color: var(--color-main);
    font-family: var(--font-family-01);
    font-size: 56px;
    font-style: normal;
    font-weight: 600;
    line-height: 110%;
    /* 61.6px */
}

@media screen and (max-width: 1023px) {
    .be-renewed .column-1 p:not(.heading-2-x-small) {
        font-size: 40px;
    }
}

@media screen and (max-width: 762px) {
    .be-renewed .column-1 p:not(.heading-2-x-small) {
        font-size: 5vw;
    }
}

@media screen and (min-width: 640px) and (max-width: 762px) {
    .be-renewed .column-1 p:not(.heading-2-x-small) {
        font-size: 32px;
    }
}

@media screen and (max-width: 639px) {
    .be-renewed .column-1 p:not(.heading-2-x-small) {
        font-size: 10vw;
    }
}

@media screen and (max-width: 479px) {
    .collage-spacer {
        padding-bottom: 32px;
    }
}

/********** [About the Event - Join movement] **********/
.join-movement .column-1 .grid-x {
    height: 100%;
}

.join-movement .grid-y.text-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    flex: 1 0 0;
    height: 100%;
    align-self: stretch;
    padding: 24px;
    border-radius: 24px;
    background: var(--color-gradient-02);
}

.join-movement .grid-y.text-wrapper p {
    color: var(--font-color-inv);
}

ins-button.white-black button.blue.outlined {
    background: var(--color-ui-01);
    border: 1px solid var(--color-ui-01);
    color: var(--color-main-hover);
}

ins-button.white-black button.blue.outlined:hover {
    background: var(--color-ui-06) !important;
    border: 1px solid var(--color-ui-06) !important;
    color: var(--font-color-inv) !important;
}

.join-movement .column-1 .image-wrapper {
    border-radius: 24px;
    overflow: hidden;
}

.join-movement .column-1 .image-wrapper img {
    aspect-ratio: 344 / 484;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 24px;
}

.join-movement .column-2 .thumbnail-wrapper {
    position: relative;
    height: 100%;
}

.join-movement .column-2 .thumbnail-wrapper img {
    aspect-ratio: 656 / 484;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 24px;
}

.join-movement .column-2 .thumbnail-wrapper .icon-only {
    position: absolute;
    top: calc(50% - 64px);
    left: calc(50% - 64px);
}

.join-movement .column-2 ins-button.icon-only[size=large] button.blue.solid {
    width: 128px;
    height: 128px;
}

.join-movement .column-2 ins-button.icon-only button .btn__icon {
    font-size: 48px;
    line-height: 64px;
    width: initial;
    height: initial;
}

/********** [About the Event - What to expect] **********/
.what-expect .column-1 {
    padding-right: 40px !important;
}

.what-expect .column-1 img {
    aspect-ratio: 656 / 490;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 24px;
}

.what-expect .column-2 {
    padding-left: 40px !important;
}

.what-expect .column-2 .heading-2 {
    color: var(--color-main);
}

.what-expect .column-2 ul {
    padding-left: 5px;
}

.what-expect .column-2 li {
    font-size: 18px;
    line-height: 150%;
}

.what-expect .column-2 li:not(:last-child) {
    margin-bottom: 16px;
}

@media screen and (max-width: 1023px) {
    .what-expect .column-1 {
        padding-right: 12px !important;
    }

    .what-expect .column-2 {
        padding-left: 12px !important;
    }
}

/********** [About the Event - When and where] **********/
.when-where .column-1 .heading-2 {
    color: var(--color-main);
}

.when-where .grid-x {
    align-items: stretch;
}

.when-where .grid-x>.cell {
    display: flex;
    flex-direction: column;
    align-self: stretch;
}

.when-where .card-wrapper {
    display: flex;
    padding: 24px;
    flex-direction: column;
    align-items: flex-start;
    flex: 1;
    min-height: 100%;
    border-radius: 20px;
    background: var(--color-ui-01);
}

.when-where .body-large-bold {
    color: var(--font-color-head);
}

.when-where .icons-wrapper {
    display: flex;
    padding: 6px 12px;
    justify-content: center;
    align-items: center;
    aspect-ratio: 1/1;
    border-radius: 14px;
    background-color: var(--color-main-hover-light);
}

.when-where [class*=" icon-"],
.when-where [class^=icon-] {
    background: var(--gradient-icon);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/********** [About the Event - How to participate] **********/
.how-participate {
    padding: 40px;
    border-radius: 24px;
    background: var(--color-ui-06);
}

.how-participate .column-1 {
    padding-right: 40px !important;
}

.how-participate .column-1 img {
    aspect-ratio: 656 / 400;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 24px;
}

.how-participate .column-2 {
    padding-left: 40px !important;
}

.how-participate .column-2 * {
    color: var(--font-color-inv);
}

@media screen and (max-width: 1023px) {
    .how-participate .column-1 {
        padding-right: 12px !important;
    }

    .how-participate .column-2 {
        padding-left: 12px !important;
    }
}

@media screen and (max-width: 639px) {
    .how-participate .heading-2 {
        font-size: 9vw;
    }
}

/********** [History of IEC] **********/
.history-iec-bg .bg-el-left-support-the-mission {
    inset: 1375px auto auto 0%;
}

.history-iec-bg .bg-el-right {
    inset: 2447px 0% 0% auto;
}

.history-iec .body-large-bold {
    color: var(--font-color-body);
    text-align: initial;
}

.history-iec img {
    aspect-ratio: 672 / 649;
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 24px;
}

.history-iec .column-1 {
    padding-right: 40px !important;
}

.history-iec .column-2 {
    padding-left: 40px !important;
}

@media screen and (max-width: 1023px) {
    .history-iec .column-1 {
        padding-right: 12px !important;
    }

    .history-iec .column-2 {
        padding-left: 12px !important;
    }
}

/********** [History of IEC - Be part of the next chapter] **********/
.history-iec .gradient-02-animation {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 128px 80px;
    border-radius: var(--medium, 24px);
}

.history-iec .gradient-02-animation p {
    color: var(--font-color-inv);
    text-align: center;
}

.history-iec .gradient-02-animation .heading-2-large {
    max-width: 998px;
    ;
}

.history-iec .gradient-02-animation .body-xxxlarge-bold {
    max-width: 809px;
    ;
}

@media screen and (max-width: 639px) {
    .history-iec .gradient-02-animation {
        padding: 80px 32px;
    }

    .history-iec .gradient-02-animation .heading-2-large {
        font-size: 11vw;
    }

    .history-iec .gradient-02-animation .body-xxxlarge-bold {
        font-size: 6vw;
    }
}

/********** [Volunteer] **********/
.volunteer .page-hero-container p {
    max-width: 904px;
}

.volunteer .hero-title .body-large {
    color: var(--color-main);
    font-size: 40px;
    font-weight: 600;
}

/********** [Volunteer - Cards] **********/
.volunteer-cards .cell {
    position: relative;
}

.volunteer-cards img {
    aspect-ratio: 445 / 336;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 24px;
}

.volunteer-cards .image-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(187deg, rgba(223, 223, 223, 0.26) 20.59%, #323E56 85.1%);
    border-radius: 24px;
}

.volunteer-cards .text-wrapper {
    position: absolute;
    bottom: 20px;
    padding: 24px;
}

.volunteer-cards .text-wrapper * {
    color: var(--font-color-inv);
}

@media screen and (max-width: 1023px) {
    .volunteer-cards .grid-x.ml-neg-20 {
        margin: -12px !important
    }

    .volunteer-cards .cell {
        padding: 12px !important;
    }

    .volunteer-cards .text-wrapper {
        bottom: 12px;
    }
}

@media screen and (max-width: 639px) {
    .volunteer-cards .cell {
        width: 100%;
    }
}

/********** [Volunteer - Form] **********/
.volunteer-wrapper .title {
    max-width: 826px;
    margin: 0 auto;
    text-align: center;
    font-size: 90px;
    font-style: normal;
    font-weight: 600;
    line-height: 1.05;
    text-transform: uppercase;
    background: var(--color-gradient-01);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

@media screen and (max-width: 639px) {
    .volunteer-wrapper .title {
        font-size: 12vw;
    }
}

.volunteer-wrapper .body-large-bold {
    color: var(--font-color-head);
    max-width: 518px;
    margin: 0 auto;
}

.volunteer-wrapper .form-wrapper {
    display: flex;
    max-width: 600px;
    margin: 0 auto;
    padding: 40px;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--x-large);
    border-radius: 24px;
    background: var(--color-ui-01);
}

/********** [Volunteer - Background] **********/
.volunteer-bg .bg-el-left {
    inset: 661px auto auto 0% !important;
}

.volunteer-bg .bg-el-right {
    inset: 847px 0% 0% auto !important;
}

@media screen and (max-width: 1023px) {
    .volunteer-bg .bg-el-right {
        inset: 1447px 0% 0% auto !important;
    }
}

@media screen and (max-width: 639px) {
    .volunteer-bg .bg-el-right {
        inset: 1647px 0% 0% auto !important;
    }
}

/********** [Gradient animation] **********/
.gradient-02-animation {
    background: var(--color-gradient-02);
    animation: gradient 15s ease infinite;
    background-size: 400% 400%;

}

@-webkit-keyframes gradient {
    0% {
        background-position: 0 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

@keyframes gradient {
    0% {
        background-position: 0 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}



/********** [Features - INS DB] **********/

.features-list-container {
    display: flex;
    max-height: 850px;
}

.features-list-content {
    padding-top: 120px;
    padding-bottom: 120px;
    width: 55%;
    background: var(--color-ui-02, #F9FAFB);
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 40px;
}

.features-list-content a {
    width: 40%;
    display: block;
}

.features-list-image {
    width: 45%;
}

.features-list-image img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.features-list-content .portal-benefits-cards p {
    margin-bottom: 0;
}

.features-banner-details-container {
    display: flex;
    gap: 80px;
}

.features-banner-details {
    display: flex;
    align-items: center;
}

.features-banner-details {
    width: 50%;
}

.features-banner-details-image {
    width: 50%;
}

.features-banner-details-image img {
    height: 100%;
    object-fit: cover;
}

.features-details-wrapper {
    background: var(--color-ui-02, #F9FAFB);
}

#feature-button button {
    border-radius: 14px;
    border: 1px solid var(--color-main, #3044FF);
}

#feature-button button span {
    font-family: var(--font-family-01, "DM Sans");
    font-size: 14px;
    text-transform: none;
}

#feature-button button i:before {
    position: relative;
    top: -1px;
}

@media screen and (max-width: 950px) and (min-width: 640px) {
    .features-list-container {
        flex-direction: column;
        max-height: unset;
    }

    .features-list-content,
    .features-list-image {
        width: 100%;
    }

    .features-list-content a {
        width: 45%;
    }
}

@media screen and (max-width: 639px) {
    .features-list-container {
        flex-direction: column;
        max-height: unset;
    }

    .features-list-content,
    .features-list-image,
    .features-banner-details-image {
        width: 100%;
    }

    .features-list-image img {
        max-height: 550px;
    }

    .features-list-content a {
        width: 100%;
    }

    .features-list-content {
        padding-top: 56px;
        padding-bottom: 56px;
    }

    .features-banner-details-container {
        flex-direction: column;
        gap: 0;
    }

}



/********** Gallery Page **********/
.gallery-card .img-wrap {
    height: 256px;
    overflow: hidden;
}

.gallery-card img {
    object-fit: cover;
    transition: transform 0.3s ease, filter 0.3s ease;
    height: 256px;
}

.gallery-card img:hover {
    transform: scale(1.05);
}

.gallery-content .pagination-wrap {
    padding: 0px 20px;
}

#galleries-modal .carousel-wrap {
    width: 1000px;
    max-width: 90vw;
}

#galleries-modal .ins-modal-wrap {
    display: block;
    height: 0px;
    overflow: hidden;
}

#galleries-modal .ins-modal-wrap.show-modal {
    height: 100vh;
}

#galleries-modal .ins-modal-wrap.show-modal #galleries-carousel-img {
    height: auto !important;
}

#galleries-modal .ins-backdrop-wrap {
    display: none !important;
}

#galleries-modal .ins-modal-wrap.show-modal .ins-backdrop-wrap {
    display: block !important;
}

#galleries-modal .ins-carousel_body {
    height: 100vh;
    display: flex;
    align-items: center;
}

#galleries-modal ins-button button.blue.outlined {
    border-color: var(--color-ui-01);
    border-radius: 50% !important;
    height: 40px;
    width: 40px !important;
    padding: 0px 0px !important;
}

#galleries-modal .ins-carousel_ctrl-btns .btn__icon {
    color: var(--color-ui-01);
}

#galleries-carousel .img-wrap {
    width: 1000px;
    max-width: 90vw;
    display: flex;
    align-items: center;
    height: 100vh;
}

#galleries-carousel .ins-carousel.layout-1 .ins-carousel_ctrl-btns {
    display: block;
}


/********** Media Page **********/
.media-container .newsContentContainer {
    height: initial;
}

.media-container .card {
    margin-bottom: 40px;
}

@media screen and (max-width: 639px) {
    .media-container .card {
        margin-bottom: 0px;
    }
}

.media-container .news-content .card img {
    height: 256px;
}


/********** Modal **********/
.transparent-bg-modal .ins-card-wrap {
    background: transparent;
}

.transparent-bg-modal .ins-modal-body {
    height: 100vh !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.transparent-bg-modal .icon-close-1 {
    font-size: 24px;
    color: var(--color-ui-01);
    position: fixed !important;
    z-index: 100;
}

.transparent-bg-modal iframe {
    max-width: 90vw;
}


/**
Contact Us
*/

.contact-us-wrapper {
    background: linear-gradient(to right, var(--color-ui-02, #F9FAFB) 60%, white 40%);

}

.contact-us-details-wrapper {
    background: #fff;
    padding-left: 50px;
}

.contact-us-details-wrapper .google-map-img img {
    width: 100%;
    height: 300px;
    object-fit: cover;
}

.contact-us-form-container {
    padding-right: 48px;
}


.contact-us #contact-google-map {
    width: 100%;
    height: 300px;
}

.google-map {
    margin-bottom: 1rem;
}

.contact-details {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(4, auto);
    gap: 24px;
    list-style: none;
    padding: 0;
}

.contact-us .contact-details {
    font-size: var(--font-small);
    line-height: 17px;
}

.contact-details .menu {
    gap: 24px;
}

.contact-details .menu a {
    padding: 0;
    font-size: 22px;
}

.contact-us .contact-details a {
    color: #436CF2;
}

.contact-us .contact-details li {
    position: relative;
    padding-left: 30px;
}

.contact-heading {
    color: var(--font-color-head, #05051D);
    font-family: var(--font-family-02, Archivo);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
}

.contact-us .opening-hours,
.contact-us .opening-hours p {
    font-size: var(--font-small);
    line-height: 24px;
    font-family: var(--font-family-02);
}

.contact-us-details-container .opening-hours .bold,
.contact-us-details-container .opening-hours .bold p {
    font-weight: 700 !important;
}

.ins-input-tel-wrap .iti .iti__flag-container .iti__selected-flag {
    padding: 10px 8px;
    line-height: 20px;
    min-height: 46px;
}

.contact-us-form-container .insites-form-wrap .insites-form-grid ins-button button {
    padding: 11px 24px;
    font-weight: 700;
    font-size: 14px;
    color: var(--color-ui-01) !important;
    border-radius: 100px;
    background: var(--color-gradient-02);
    display: flex;
    justify-content: center;
    align-items: center;
}

.contact-us-form-container .insites-form-wrap .insites-form-grid ins-button button .btn__label {
    text-transform: none;
    color: var(--font-color-inv, #FFF);
    font-family: var(--font-family-01, "DM Sans");
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 100%;
}

.contact-us-form-container .insites-form-wrap .insites-form-grid ins-button button:hover {
    background: #2331B7;
}

.contact-us-form-container .mobile_phone ins-input-tel .ins-input-tel-wrap .row-col-container .column-3 {
    flex: 1 !important;
    float: right;
    padding-right: 0 !important;
}

.contact-us-form-container .mobile_phone ins-input-tel .ins-input-tel-wrap .row-col-container .column-1 {
    flex: 0 0 auto !important;
}

.contact-us-form-container .ins-dropzone.dz-clickable {
    background: #ffff;
}

@media screen and (max-width: 1023px) and (min-width: 640px) {

    .contact-us-form-container .insites-form-wrap .insites-form-grid .column-2,
    .contact-us-form-container .insites-form-wrap .insites-form-grid .message,
    .contact-us-form-container .insites-form-wrap .insites-form-grid .document,
    .contact-us-form-container .insites-form-wrap .insites-form-grid .insites-form-buttons {
        width: 100% !important;
    }
}



@media screen and (max-width: 639px) {
    #subscribe-form .subscribe-component {
        width: 100%;
        text-align: left;
    }

    .contact-us-wrapper {
        background: linear-gradient(to bottom, var(--color-ui-02, #F9FAFB) 40%, white 46%);
    }

    .contact-us-form-container {
        padding-right: 0;
    }

    .contact-us-details-wrapper {
        padding-left: 0;
    }

    .contact-details {
        display: flex;
        flex-direction: column;
    }

    .contact-us-form-container .insites-form-wrap .insites-form-grid ins-button {
        width: 100%;
    }
}

/**********
 [Terms & Conditions / Privacy Policy]
**********/

/* Privacy Policy Content Wrapper - Figma Design */
.privacy-policy-content-wrapper {
    max-width: 1024px;
    margin: 0 auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.privacy-policy-spacer-top,
.privacy-policy-spacer-bottom {
    height: 128px;
    width: 100%;
}

.privacy-policy-content {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
}

.privacy-policy-title {
    font-family: var(--font-family-01);
    font-weight: 600;
    font-size: 64px;
    line-height: 1.2;
    text-align: center;
    letter-spacing: -2px;
    color: #323E56;
    padding-top: 80px;
    margin-bottom: 80px;
    width: 100%;
}

#privacy-policy h4,
#privacy-policy .heading-4,
#terms-of-service h4,
#terms-of-service .heading-4,
#collection-notice h4,
#collection-notice .heading-4 {
    color: var(--font-color-head);
    font-family: var(--font-family-01);
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 1.2;
    margin-bottom: 0;
    width: 100%;
}

#privacy-policy a,
#terms-of-service a,
#collection-notice a {
    color: var(--color-main);
    text-decoration: underline;
}

#privacy-policy a:hover,
#terms-of-service a:hover,
#collection-notice a:hover {
    text-decoration: underline;
}

#privacy-policy p,
#terms-of-service p,
#collection-notice p {
    color: #515B6F !important;
}

#terms-intro {
    width: 100%;
}

#terms-intro p {
    font-family: var(--font-family-02, Poppins);
    font-size: 16px;
    font-weight: 300;
    line-height: 1.8;
    color: #515B6F;
    margin-bottom: 24px;
}

#terms-intro p:last-child {
    margin-bottom: 0;
}

#terms-intro strong {
    font-family: var(--font-family-01);
    font-weight: 600;
    color: #323E56;
}

#collection-notice {
    width: 100%;
}

#collection-intro {
    width: 100%;
}

#collection-intro p {
    font-family: var(--font-family-02, Poppins);
    font-size: 16px;
    font-weight: 300;
    line-height: 1.8;
    color: #515B6F;
    margin-bottom: 24px;
}

#collection-intro p:last-child {
    margin-bottom: 0;
}

#collection-intro strong {
    font-family: var(--font-family-01);
    font-weight: 600;
    color: #323E56;
}

#collection-contact {
    width: 100%;
}

#collection-contact p {
    font-family: var(--font-family-02, Poppins);
    font-size: 16px;
    font-weight: 300;
    line-height: 1.8;
    color: #515B6F;
    margin-bottom: 24px;
}

#collection-contact p:last-child {
    margin-bottom: 0;
}

#collection-notice ul.ul-terms-privacy {
    list-style: disc;
    padding-left: 10px;
    margin-left: 0;
    width: 100%;
}

#collection-notice ul.ul-terms-privacy li {
    font-size: 16px;
    color: #515B6F;
    font-family: var(--font-family-02, Poppins);
    font-weight: 300;
    line-height: 1.8;
    margin-bottom: 16px;
    padding-left: 0;
    list-style-position: outside;
}

#collection-notice ul.ul-terms-privacy li:last-child {
    margin-bottom: 0;
}

.ul-terms-privacy {
    list-style: decimal;
    padding-left: 0;
    margin-left: 0;
    width: 100%;
}

.ul-terms-privacy li {
    font-size: 16px;
    color: #515B6F;
    font-family: var(--font-family-02, Poppins);
    font-weight: 300;
    line-height: 1.8;
    margin-bottom: 16px;
    padding-left: 0;
    list-style-position: outside;
    margin-left: 18px;
    padding-left: 0.5em;
}

.ul-terms-privacy.two-digit-list li {
    margin-left: 28px !important;
}

.ul-terms-privacy li:last-child {
    margin-bottom: 0;
}

.legal {
    font-size: 16px;
    line-height: 1.8;
    font-family: var(--font-family-02, Poppins);
    font-weight: 300;
    color: #515B6F;
    width: 100%;
}

.legal strong {
    font-family: var(--font-family-01);
    font-weight: 600;
    color: #323E56;
}

/* Main list styling */
.legal ol {
    counter-reset: item;
    margin-left: 0;
    padding-left: 0;
    width: 100%;
}

.legal ol.ul-terms-privacy {
    margin-left: 0;
}

.legal li {
    position: relative;
    color: #515B6F;
    font-family: var(--font-family-02, Poppins);
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 1.8;
    margin-bottom: 16px;
}

.legal li.spacer {
    margin-bottom: 16px;
}

.legal li.spacer.medium {
    margin-bottom: 24px;
}

.legal li:last-child {
    margin-bottom: 0;
    padding-bottom: 0px;
}

.legal ol>li {
    counter-increment: item;
}

.legal ol>li::marker {
    font-size: 16px;
    font-weight: 300;
    color: #515B6F;
}

.legal li.no-list-style {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
}

.nested-letter {
    list-style-type: lower-alpha;
    padding-left: 30px !important;
}

.nested-letter.padding-left-0 {
    padding-left: 0 !important;
}

.nested-letter li {
    list-style-position: outside;
    padding-left: 5px !important;
    margin-bottom: 24px;
}

.nested-letter li::marker {
    content: "(" counter(list-item, lower-alpha) ") ";
}

.nested-letter li::before {
    content: none !important;
}

.nested-letter li:last-child {
    margin-bottom: 0;
}

/* Sub list styling */
.legal li>ul {
    margin-left: 1rem;
    margin-top: 1rem;
}

.legal li>ol {
    margin-top: 0;
    margin-left: 0;
}

.legal>ol>li>ol>li {
    padding-left: 24px;
}

.legal>ol>li>ol>li>ol>li {
    padding-left: 24px;
}

.legal>ol>li>ol>li>ol {
    margin-bottom: 0;
}

.legal ol ol>li:before {
    font-size: 16px;
    line-height: 1.8;
    font-weight: 300;
    text-align: left;
    min-width: initial;
}

/* Contact Information Styling */
.privacy-contact-info {
    padding-left: 32px;
    width: 100%;
}

.privacy-contact-info p {
    margin-bottom: 8px;
    line-height: 1.8;
}

.privacy-contact-info p.margin-bottom-0 {
    margin-bottom: 0px;
}

.privacy-contact-info strong {
    font-family: var(--font-family-01);
    font-weight: 600;
    color: #323E56;
}

.privacy-contact-info a {
    color: #ED5E52;
    text-decoration: underline;
}

.privacy-address {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
}

.privacy-tel {
    color: var(--color-main);
}

@media screen and (max-width: 640px) {

    .privacy-policy-spacer-top,
    .privacy-policy-spacer-bottom {
        height: 80px;
    }
}

@media screen and (max-width: 640px) {
    .privacy-policy-title {
        font-size: 15vw;
    }
}

/**
SYSTEM PAGES

Thank you page
*/

.thank-you .thank-you-img i {
    font-size: 4rem;
    color: var(--success);
}


/* Invalid Token */

.system-pages .warning i {
    color: var(--warning);
    font-size: 64px !important;
}

ins-card.bg-grey .ins-card-wrap {
    background-color: var(--color-ui-02);
    color: #595959;
}


/**
PLUGINS Custom

Notyf 
*/

.notyf {
    z-index: 999999;
}

.notyf__toast--disappear {
    animation-delay: unset;
}

.notyf__toast {
    background: var(--color-ui-06);
    padding: 0;
}

.notyf__wrapper {
    padding: 0;
}

.notyf__icon {
    vertical-align: middle;
    margin: 0;
    width: auto;
    background: none;
    animation-delay: unset;
    height: 100%;
    position: absolute;
}

.notyf__message {
    font-family: var(--font-family-01);
    font-size: var(--font-small);
    line-height: var(--font-medium);
    vertical-align: middle;
    width: 260px;
    min-height: 48px;
    font-weight: 700;
    text-align: left;
    margin-left: 48px;
    padding: 16px;
    animation-delay: unset;
}

.notyf__toast [class*="notyf__icon--"] {
    font-family: 'insites-20-fonticon' !important;
    font-style: normal;
    font-size: 10px;
    border-radius: 0;
    height: 100%;
    width: 48px;
    vertical-align: middle;
    text-align: center;
    color: var(--font-color-inv) !important;
}

.notyf__toast [class*="notyf__icon--"]:before {
    transform: none;
    background: none;
    display: block;
    position: relative;
    top: 0px;
    left: unset;
    width: auto;
}

.notyf__toast .notyf__icon--error {
    background-color: var(--error);
}

.notyf__toast .notyf__icon--success {
    background-color: var(--success);
}

.notyf__toast .notyf__icon--warning {
    background-color: var(--warning);
}

.notyf__toast .notyf__icon--error:before {
    content: "\e92a";
}

.notyf__toast .notyf__icon--success:before {
    content: "\e926";
}

.notyf__toast .notyf__icon--warning:before {
    content: "\e91d";
}

.notyf__toast [class*="notyf__icon--"]:after {
    content: '';
    display: none;
}

@media only screen and (max-width: 639px) {
    .notyf__toast {
        width: 85%;
        margin-top: 24px;
        margin-right: 8px;
    }
}


/** SYSTEM PAGES **/

.system-page {
    min-height: 100vh;
    /* background-color: var(--color-ui-02); */
}

.system-page .header {
    border-bottom: 1px solid var(--color-ui-03);
    background-color: var(--color-ui-01);
}

.system-page .system-content {
    margin: auto;
    /* background-color: var(--color-ui-02); */
}

.system-page .footer>.grid-container {
    border-top: 1px solid var(--color-ui-04);
}

.system-page .title {
    font-family: var(--font-family-01);
    font-style: normal;
    font-weight: 600;
    color: var(--color-main);
    font-size: 150px;
    line-height: 100%;
    /* 150px */
}

.system-page .sub-title {
    font-family: var(--font-family-01);
    font-style: normal;
    font-weight: 600;
    font-size: 40px;
    color: var(--font-color-head);
    line-height: 48px;
}

.system-page .context {
    max-width: 332px;
    margin: auto;
}

.system-page .context p {
    font-family: var(--font-family-02);
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    font-weight: 300;
    color: var(--font-color-body);
}

.icon-alert-triangle {
    font-size: 64px !important;
}

.system-btn {
    padding: 14px 24px;
    font-weight: 700;
    font-size: 14px;
    color: #fff !important;
    border-radius: 100px;
    background: var(--color-gradient-02);
}

.system-btn:hover {
    background: var(--color-sub2-hover);
    color: #fff !important;
}

/********** [Portal] **********/
.portal-wrap {
    min-height: initial;
}

.sidebar-padding {
    padding: 80px 24px 80px 48px !important;
}

.main-content {
    padding: 80px 48px 80px 24px;
}

.main-content-mobile {
    padding: 56px 24px !important;
}

/*** Side Bar Accordion ***/
.accordion-section-holder {
    background: var(--color-ui-02);
}

.portal-sidebar a {
    font-family: var(--font-family-02);
}

/* Remove Underline on Hover */
.portal-sidebar .ins-accordion-link_link:hover,
.portal-mobile-nav .ins-accordion-link_link:hover {
    text-decoration: none !important;
    color: var(--color-main);
}

/* Remove Accordion Border */
.portal-sidebar .ins-accordion.menu .ins-accordion-item .inner-head,
.portal-sidebar .ins-accordion-link,
.portal-sidebar .ins-accordion.menu ins-accordion-item:first-of-type .ins-accordion-item_header,
.portal-sidebar .ins-accordion-item_content .inner-content {
    border: 0;
}

/* Active Sidenav */
.portal-sidebar .ins-accordion-link.active>.ins-accordion-link_link {
    background: var(--color-main-hover-light);
    padding: 12px 16px;
    border-radius: 12px;
    color: var(--color-main);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 150% */
}

/* On hover */
.portal-sidebar .ins-accordion-link.active>.ins-accordion-link_link:hover {
    color: var(--font-color-head);
}

/* Inactive Sidenav */
.portal-sidebar .ins-accordion-link>.ins-accordion-link_link {
    color: var(--font-color-head);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    /* 150% */
}

/* On hover */
.portal-sidebar .ins-accordion-link>.ins-accordion-link_link:hover {
    color: var(--color-main-hover);
}

/* Accordion Background */
.portal-sidebar .ins-accordion-link,
.portal-mobile-nav .ins-accordion-link {
    background: transparent;
}

/* Accordion Mobile */
.portal-mobile-nav .ins-accordion-item.open>.ins-accordion-item_header>.inner-head a {
    color: black;
}

.portal-mobile-nav .ins-accordion-item.open>.ins-accordion-item_header>.inner-head {
    color: black
}

/* Accordion Mobile Border */
.portal-mobile-nav .ins-accordion-item_header>.inner-head,
.portal-mobile-nav .ins-accordion-item_header>.inner-head:hover {
    border-color: transparent;
}

.portal-mobile-nav .ins-accordion-item_header {
    padding-top: 0px;
    border-top: 1px solid #F3F4F4;
}

.portal-mobile-nav .ins-accordion-item_header>.inner-head {
    padding: 24px;
    background-color: var(--color-ui-02);
}

/* Accordion Mobile Nav > Label */
.portal-mobile-nav .ins-accordion-item_header>.inner-head a {
    color: var(--font-color-body);
    font-family: var(--font-family-01);
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 150%;
    /* 21px */
}

/* Accordion Inner Content */
.portal-mobile-nav .ins-accordion-item_content .inner-content {
    padding: 0px;
}

/* Accordion Mobile > Inner Content > Items / Link */
.portal-mobile-nav .ins-accordion-item_content .ins-accordion-link_link {
    padding: 24px;
}

/* Accordion Mobile Icon */
.portal-mobile-nav .ins-accordion-item_header .open-icon,
.portal-mobile-nav .ins-accordion-item_header .close-icon {
    padding: 4px 24px;
}

.portal-mobile-nav .ins-accordion-item_header_caret-wrap {
    right: 0px;
}

.sign-up ins-button button.blue.solid {
    width: 100%;
}

/*** Overview ***/
.overview-banner {
    display: flex;
    gap: 40px;
    border-radius: 14px;
    background: var(--color-ui-02);
    min-height: 199px;
}

.overview-details,
.overview-image {
    width: 100%;
}

.overview-image img {
    height: 100%;
    object-fit: cover;
    border-bottom-right-radius: 14px;
    border-top-right-radius: 14px;
    max-height: 200px;
}

.overview-details {
    padding: 24px;
}

@media screen and (max-width: 1023px) {
    .overview-banner {
        flex-direction: column;
    }

    .overview-image img {
        border-top-right-radius: 0px;
        border-bottom-right-radius: 14px;
        border-bottom-left-radius: 14px;
    }

}

.overview-cards {
    border-radius: 14px;
    border: 1px solid var(--color-ui-04);
    background: var(--color-ui-01);
    box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.10);
    padding: 24px 24px 16px 24px;
}

.overview-card-header {
    color: var(--font-color-head);
    text-align: center;
    font-family: Archivo;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 150%;
    /* 24px */
}

.overview-card-icon-header {
    display: flex;
    gap: 8px;
    align-items: baseline;
}

.overview-button {
    display: flex;
    flex-direction: row-reverse;
}

.overview-button ins-button button.ins-button.size--small span {
    font-family: var(--font-family-01) !important;
    font-size: 12px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 120% !important;
    text-transform: none;
}

.overview-button ins-button button {
    padding-left: 16px !important;
    padding-right: 16px !important;
}

.overview-button ins-button button:hover {
    border-radius: 8px !important;
}

ins-input-tel .ins-input-tel-wrap .column-3 {
    flex: 1 !important;
    float: right !important;
    padding-right: 0 !important;
}

ins-input-tel .ins-input-tel-wrap .column-1,
.insites-form.insites-form-code ins-input-tel .column-1:not(.insites-form.insites-form-code.insites-form-grid.col-container.column-1) {
    flex: 0 0 auto !important;
}

ins-button button.ins-button span {
    text-transform: none;
}

.request-table-header ins-table-th {
    padding: 16px 24px;
    align-content: center;
    color: #000000 !important;
}

.request-table-data ins-table-td {
    padding: 11px 16px 11px 24px;
    align-content: center !important;
}

ins-table-row:nth-child(even) {
    background-color: var(--color-ui-02);
}

.request-table .ibt-table-wrap.no-label .ibt-table-wrap__no-heading,
.request-table .ibt-table-wrap__settings {
    border-radius: 14px;
}

.ibt-table-wrap.no-label .ibt-table-wrap__no-heading {
    box-shadow: none !important;
    border: none !important;
}

.request-table-accordion .ins-accordion-item_header {
    padding: 0px !important
}

.request-table-accordion .ins-accordion-item_header>.inner-head {
    font-family: var(--font-family-02);
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: normal;
    color: #05051D;
    padding: 16px 0px;
    background-color: unset !important;
    border: none;
}

.request-table-accordion .ins-accordion-item_header_caret-wrap {
    right: 0px;
}

.request-table-accordion .ins-accordion-item_content .inner-content {
    padding: 0px;
    border: none;
}

.request-table-accordion .ins-accordion-item.open>.ins-accordion-item_header>.inner-head {
    color: #05051D;
}

/* STRIPE */

.stripe-modal .ins-modal-wrap.show-modal .ins-modal-head h1 {
    color: var(--font-color-head, #05051D) !important;

    /* Heading/heading-5 */
    font-family: var(--font-family-01) !important;
    font-size: 24px !important;
    font-style: normal !important;
    font-weight: 700 !important;
    line-height: 130% !important;
    /* 31.2px */
    letter-spacing: 0.24px !important;
}

.stripe-modal .ins-modal-wrap.show-modal .ins-modal-head {
    border-bottom: 0px !important;
}

.stripe-modal ins-button button .btn__icon,
.stripe-modal ins-button button[type=button] .btn__icon {
    font-size: 10px;
    position: relative;
    top: 4px;
}

.add_credit_card_details_container {
    display: flex;
    justify-content: space-between;
}

.card-options-list-payment-method ins-credit-card .ins-credit-card-compact-size .ins-credit-card-main-wrap .ins-credit-card-wrap ins-radio {
    display: none;
}

.card-options-list-payment-method ins-credit-card .ins-credit-card-compact-size .ins-credit-card-main-wrap.compact.active .ins-credit-card-wrap {
    border-color: #DFDFDF !important;
}

.ins-credit-card-compact-size .ins-credit-card-main-wrap.compact.active .ins-credit-card-wrap,
.ins-checkbox-card-wrap.selected.blue {
    border-color: var(--color-main);
}

.invoice-details .ins-form-field-wrap,
.validate-credit-card .ins-credit-card-compact-size {
    margin-bottom: 0px !important;
}

.p-body {
    color: #575757;
    font-family: var(--font-family-02);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 24px */
}

.p-body-bold {
    color: #575757;
    font-family: var(--font-family-02);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px;
    /* 150% */
}

.order-total {
    color: #05051D;
    font-family: var(--font-family-02);
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

/* Pay Bill */

.payment-summary {
    padding: 24px;
    background: #F9FAFB;
}

.payment-summary .p-body {
    text-align: right;
}

#stripe-modal .ins-modal-wrap.show-modal,
.swal2-container {
    padding: 24px !important;
    align-content: center !important;
}

#stripe-modal .ins-modal-wrap.show-modal ins-card .ins-card-wrap {
    border-radius: 14px;
}

#stripe-modal ins-button.card-form-cancel button.blue.outlined {
    margin-bottom: 0px !important;
}

.payment-success-notif {
    text-align: left;
}

.ins-modal-wrap.show-modal ins-card .ins-card-wrap {
    box-shadow: none !important
}

/* Account */
.layout-background {
    background-repeat: no-repeat;
    background-size: cover;

}

.account-body {
    height: calc(100vh);
}

.create-account-container {
    padding: 0px 40px 0px 128px;
    /* align-content: center; */
}

.account-container-logo {
    padding: 0px 128px
}

.account-container {
    padding: 0px 128px;
    align-content: center;
    height: calc(70vh);
}

.login-bg {
    height: 100%;
}

.ins-step_details {
    margin: 0px -24px;
}

.create-an-account-div {
    padding-right: 217px;
}

.stepper-instance.ins-step_description {
    color: #575757;
    text-align: center;
    font-family: var(--font-family-02);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 21px */
}

.agreement-text {
    max-height: 450px;
    overflow-y: scroll;
    padding: 24px;
    border: 1px solid var(--color-ui-04);
}

.register-agree-checkbox .ins-checkbox-wrap .ins-checkbox-radio-label {
    color: var(--font-color-body, #575757) !important;
    font-family: var(--font-family-02, Archivo) !important;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}

.forgot-password .ins-form-field-wrap,
.sign-in-field .ins-form-field-wrap {
    margin-bottom: 0px !important
}

.a-label {
    color: #3044FF;
    font-family: var(--font-family-02);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}

.a-label-no-visit {
    color: #3044FF !important;
    font-family: var(--font-family-02);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
}


/* Padding Custom */
.pt-24 {
    padding-top: 24px !important
}

/* HIDDEN ELEMENTS */
.is_hidden {
    display: none !important;
}

/* EMPTY STATE HOLDER */
.empty-state {
    padding: 80px 24px;
    border-radius: 4px;
    border: 1px solid #DFDFDF;
    background: #fff;
}

#insBaseTable .empty-box {
    border: none !important;
    border-radius: 16px;
    padding: 80px 24px;
    background: #fff;
}

#insBaseTable ins-table-th {
    color: var(--font-color-head) !important;
}

/********** [Feedback] ***********/
@media only screen and (max-width: 639px) {

    .feedback .insites-form-wrap .insites-form-grid .insites-form-buttons ins-button,
    .feedback .insites-form-wrap .insites-form-grid .insites-form-buttons ins-button button {
        width: 100%;
    }
}

/********** [Users Page] ***********/


.user-actions-container {
    display: flex;
    justify-content: space-between;
    gap: 16px;
}

.userSearch {
    width: 40%;
}

.primary-account-holder {
    color: #0CAC52;
    text-align: center;
    font-family: var(--font-family-02);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 18px;
    padding: 4px 8px;
    border-radius: 4px;
    background: var(--iia-alert-positive-light, rgba(4, 136, 1, 0.08));
}

.users-table-header ins-table-th {
    padding: 24px !important;
    color: #000000
}

.users-table-data {
    background-color: #fff;
}

.users-table-data ins-table-td {
    padding: 0px 24px !important;
}

.hide-for-small-medium {
    display: table-cell;
}

.show-for-small-medium {
    display: none;
}

.users-table ins-table-row:nth-child(even) {
    background-color: #F7F7F7;
}

.ins-select-option-wrap {
    font-family: var(--font-family-02);
    font-size: 14px;
    padding: 16px 16px;
    color: var(--font-color-head);
}

.ins-select-wrap .ins-select-value-input {
    height: 46px;
    padding: 12px;
    font-size: 14px;
    color: var(--font-color-head);
    font-family: var(--font-family-02) !important;
}

.ins-select-wrap .ins-select-value-wrap {
    border-radius: 4px;
    border: 1px solid var(--color-ui-04, #DFDFDF);
}

.ins-select-option-wrap:hover {
    color: var(--color-main-hover);
    background-color: var(--color-main-hover-light);
}

.users-table .ins-select-option-wrap,
.users-table .ins-input-select.ins-select-wrap .ins-select-value-wrap .ins-select-value-input {
    color: var(--font-color-body);
    font-feature-settings: 'clig' off, 'liga' off;
    font-family: var(--font-family-02);
    font-size: 14px !important;
    font-style: normal;
    font-weight: 400;
    line-height: 16px;
}

.users-table .ibt-table-wrap .pagination-wrap {
    padding: 24px
}

#add-user-modal .ins-modal-wrap.show-modal ins-card .ins-card-wrap {
    height: initial !important;
    border-radius: 24px !important;
    box-shadow: none !important;
}

.addUserModal ins-card {
    width: 495px !important;
}

.addUserModalButton {
    display: flex;
    gap: 16px;
    flex-direction: row;
    justify-content: flex-end;
}

.userDetails .ins-form-field-wrap,
.userDetails .ins-select-wrap {
    margin-bottom: 8px !important;
}

.userDetails.has-error .ins-form-field-wrap label,
.userDetails.has-error .ins-select-wrap label {
    color: #DF1F1F !important;
}

#user-first-name.has-error .ins-form-field-wrap label,
#user-last-name.has-error .ins-form-field-wrap label,
#user-email.has-error .ins-form-field-wrap label,
#user-job-title.has-error .ins-form-field-wrap label,
#user-department.has-error .ins-select-wrap label {
    color: #DF1F1F !important;
}

#user-first-name.has-error .ins-form-field-wrap .ins-form-field,
#user-last-name.has-error .ins-form-field-wrap .ins-form-field,
#user-email.has-error .ins-form-field-wrap .ins-form-field,
#user-job-title.has-error .ins-form-field-wrap .ins-form-field,
#user-department.has-error .ins-select-wrap .ins-select-value-input,
#user-department.has-error .ins-select-wrap .ins-select-value-wrap {
    background-color: rgba(223, 31, 31, 0.10) !important;
    border-color: #DF1F1F !important;
    color: #DF1F1F !important;
}

#user-first-name.has-error .ins-form-field-wrap .ins-form-field::placeholder,
#user-last-name.has-error .ins-form-field-wrap .ins-form-field::placeholder,
#user-email.has-error .ins-form-field-wrap .ins-form-field::placeholder,
#user-job-title.has-error .ins-form-field-wrap .ins-form-field::placeholder,
#user-department.has-error .ins-select-wrap .ins-select-value-input::placeholder {
    color: #DF1F1F !important;
}

.user-error-txt-red {
    color: #F24B4B !important;
}

#user-permission-level .ins-input-select-wrap .ins-input-select .ins-select-options-wrap {
    margin-bottom: -5px !important;
}

.swal-user-account .swal2-title {
    color: var(--font-color-head);
    text-align: center;
    font-family: var(--font-family-01);
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 120%;
}

.swal-user-account .swal2-html-container {
    color: var(--font-color-body, #575757);
    text-align: center;
    font-family: var(--font-family-02);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}

.swal-user-account [class^=icon-] {
    font-size: 12px !important;
}

.swal-remove-access .swal2-actions button.swal2-confirm {
    background-color: #DF1F1F !important;
    border-color: #DF1F1F !important;
}

.emailExistsMessage {
    display: flex;
    gap: 8px;
    padding: 8px;
    background: rgba(251, 172, 19, 0.10);
    margin: 8px 0px;
}

.emailExistsMessageIcon {
    color: #CC8700;
}

.emailExistsMessageDetails {
    color: var(--font-color-body);
    font-size: 12px !important;
    font-family: var(--font-family-02);
    font-style: normal;
    font-weight: 400;
    line-height: 18px;
}

.account_owner_select .icon-caret-down {
    display: none;
}

.account_owner_select .ins-input-select.ins-select-wrap .ins-select-value-wrap .ins-select-value-input {
    color: var(--ins-color-ink40) !important;
}

.account_owner_select .ins-input-select.ins-select-wrap .ins-select-value-wrap .ins-select-value-input:hover {
    cursor: not-allowed !important;
}


.users-table .ibt-table-wrap.no-label .ibt-table-wrap__no-heading {
    border-radius: 16px;
    border: 1px solid var(--color-ui-04, #DFDFDF);
    box-shadow: none;
}

.users-table .ibt-table-wrap__settings {
    background-color: unset;
}

.userDetails .ins-input-select-wrap {
    margin-bottom: 0;
}

#user-invite-button button {
    width: 100%;
}

@media screen and (max-width: 950px) {
    .user-actions-container {
        display: flex;
        justify-content: space-between;
        gap: 24px;
        flex-direction: column;
    }

    .userSearch {
        width: 100%;
    }

    .hide-spacer {
        display: none !important;
    }

    .hide-for-small-medium {
        display: none !important;
    }

    .show-for-small-medium {
        display: block !important;
    }

    .users-table-data ins-table-td {
        padding: 24px !important;
    }

    .users-table .ins-select-label-wrap {
        display: none !important;
    }

    .users-table .ins-input-select {
        margin: 0px
    }

    .users-table .request-table-accordion .ins-accordion-item.open .ins-accordion-item_content {
        overflow: visible;
    }

    .users-table ins-table-row:nth-child(even) {
        background: #fff !important;
    }
}


/* FORM ERROR */
.ins-form-field-wrap.is-invalid .ins-form-error,
ins-checkbox-group .ins-form-error,
.ins-form-field-wrap.is-invalid .ins-form-label,
.ins-select-wrap.is-invalid label,
.ins-select-wrap.is-invalid .ins-form-error,
ins-checkbox-group .ins-checkbox-group-wrap.is-invalid .ins-checkbox-group-label-wrap,
ins-checkbox-group .ins-checkbox-group-wrap.is-invalid .ins-checkbox-radio-label {
    color: var(--error);
    font-family: var(--font-family-02);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 18px */
}

/* NOTYF */

.notyf__toast--error {
    border-radius: 8px !important;
    border: 1px solid #F24B4B !important;
    background: #FEEDED !important;
    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.10) !important;
}

.notyf__toast--error .notyf__wrapper {
    border-bottom: 4px solid #F24B4B;
}

.notyf__toast--success {
    border-radius: 8px !important;
    border: 1px solid #0CAC52 !important;
    background: #E3F5EC !important;
    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.10) !important;
}

.notyf__toast--success .notyf__wrapper {
    border-bottom: 4px solid #0CAC52;
}

.notyf__icon--success {
    height: 25px !important;
    width: 25px !important;
    background: var(--success) !important;
    border-radius: 50% !important;
    display: block;
    margin: 0 auto;
    position: relative;
    margin-top: 16px !important;
    margin-left: 16px !important;
}

.notyf__icon--error {
    height: 25px !important;
    width: 25px !important;
    background: #F24B4B !important;
    border-radius: 50% !important;
    display: block;
    margin: 0 auto;
    position: relative;
    margin-top: 16px !important;
    margin-left: 16px !important;
}

.notyf__message {
    color: var(--font-color-head);
    /* Paragraph/body */
    font-family: var(--font-family-02);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%;
    /* 24px */
}

.notyf__dismiss {
    margin-right: 0px !important;
    padding: 27px 16px !important;
    width: 0px;
    height: 0px;
    animation: notyf-fadeinup .3s forwards;
}

.notyf__dismiss-btn {
    width: 0px;
    height: 0px;
}

.notyf__dismiss-btn:before,
.notyf__dismiss-btn:after {
    background-color: #05051D !important;
}

#emailRequired.body-x-small {
    font-family: var(--font-family-02) !important;
    font-size: 12px !important;
    font-weight: 400;
    line-height: 18px;
    text-align: left;
}


ins-alert-box .alert-box.error {
    display: none;
}

@media screen and (max-width: 639px) {
    #stripe-modal .btn-container {
        gap: 0px;
        display: flex;
        padding: 0px !important;
        flex-direction: column-reverse;
    }

    #stripe-modal .btn-container ins-button button {
        margin-bottom: 0px;
        margin-top: 24px;
    }


}

@media screen and (max-width: 430px) {
    .swal2-popup .swal2-actions {
        flex-direction: column-reverse !important;
    }

    .swal2-container .swal2-actions button {
        width: 100%;
        margin-bottom: 12px;
        margin-left: 0px;
    }

    .swal2-container .swal2-actions button:first-child {
        margin-bottom: 0px;
    }
}

.m-0-12 {
    margin: 0 12px !important;
}

.m-4-12-12-12 {
    margin: 4px 12px 12px 12px !important;
}

.heading-2-small-bold {

    /* Heading/heading-2-small-bold */
    font-family: var(--font-family-01);
    font-size: 40px !important;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    /* 48px */
}

.color-white,
.markdown-color-white p {
    color: #FFFFFF !important;
}

a.button-default:hover {
    color: #fff !important;
}

.insites-form-buttons .btn__icon,
ins-button button .btn__icon,
ins-button button[type=button] .btn__icon,
ins-button button[type=reset] .btn__icon,
ins-button button[type=submit] .btn__icon {
    font-size: 16px;
}



.moment-to-believe-section.join-us-page {
    align-items: center;
}

.body-x-large {
    font-family: var(--font-family-02);
    font-size: 24px;
    font-style: normal;
    font-weight: 300;
    line-height: 150%;
}

.stay-engaged-items-wrapper {
    width: 100%;
}

.m-0-12 {
    margin: 0 12px !important;
}

/* Donation | Static cards */

.donation-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 40px;
}

.donation-card {
    border-radius: 24px;
    overflow: hidden;
    aspect-ratio: 4 / 3;
}

.donation-card-image {
    position: relative;
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.donation-card-gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(187deg, rgba(223, 223, 223, 0.26) 20.59%, #323E56 85.1%);
}

.donation-card-content {
    position: absolute;
    inset-inline: 24px;
    inset-block-end: 24px;
    color: var(--font-color-inv, #FFFFFF);
}

.donation-card-title {
    color: #fff !important;
}

@media screen and (max-width: 1024px) {
    .donation-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media screen and (max-width: 639px) {
    .donation-card-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .donation-card-content {
        inset-inline: 16px;
        inset-block-end: 16px;
    }

    .donation-card-title {
        font-size: 24px;
    }
}

/* Donation Form */
.donate-form-wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: var(--x-large, 40px);
}

.donate-form-container {
    background-color: var(--color-ui-01);
    border-radius: var(--medium, 24px);
    padding: var(--x-large, 40px);
    width: 100%;
    max-width: 944px;
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: visible;
}

.donate-form-title-wrapper {
    width: 100%;
    padding: 0 var(--medium, 24px);
    display: flex;
    justify-content: center;
}

.donate-form-title {
    text-align: center;
    font-weight: 300;
}

.donate-amount-cards {
    display: flex;
    gap: var(--x-large, 40px);
    width: 100%;
    max-width: 944px;
    padding: 8px;
    align-items: stretch;
    overflow: visible;
}

.donate-amount-card {
    flex: 1 1 0;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    position: relative;
    min-height: 320px;
}

.donate-amount-card-inner {
    display: flex;
    flex-direction: column;
    width: 100%;
    position: relative;
    height: 100%;
    min-height: 320px;
    overflow: visible;
}

.donate-amount-card .donate-amount-card-inner {
    background-color: var(--color-ui-01);
    border: 1px solid var(--color-ui-04);
    border-radius: 16px;
    overflow: visible;
}

.donate-amount-card-selected .donate-amount-card-inner {
    border: 2px solid var(--color-main);
}

.donate-amount-card-image {
    position: relative;
    width: 100%;
    height: 177px;
    background-color: #000;
    overflow: hidden;
    border-radius: 14px 16px 0 0;
}

.donate-amount-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
    opacity: 0.7;
}

.donate-amount-image-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(181.23deg, rgba(0, 0, 0, 0) 37.574%, rgba(0, 0, 0, 1) 98.106%);
}

.donate-amount-card-content {
    position: relative;
    padding: 56px var(--medium, 24px) var(--medium, 24px);
    display: flex;
    flex-direction: column;
    flex: 1 1 0;
}

.donate-amount-card-text {
    color: var(--font-color-body);
    margin-bottom: 0;
    text-align: left;
}

.donate-amount-badge {
    position: absolute;
    left: 23.8px;
    top: -40px;
    width: 80px;
    height: 80px;
    background-color: var(--color-main);
    border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.donate-amount-badge-text {
    font-family: var(--font-family-02);
    font-size: 24px;
    font-weight: 600;
    line-height: 1.5;
    color: var(--font-color-inv);
    text-align: center;
}

.donate-amount-card-check {
    position: absolute;
    right: -8px;
    top: -8px;
    width: 28px;
    height: 28px;
    z-index: 10;
    pointer-events: none;
}

.donate-amount-card-check-icon {
    width: 100%;
    height: 100%;
    background-color: var(--color-main);
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--typography---font-icon, "Insites Font Icons", Arial, sans-serif);
    font-size: 16px;
    line-height: 0;
    color: var(--font-color-inv);
}

.donate-other-amount-section,
.donate-frequency-section {
    width: 100%;
    max-width: 460px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--medium, 24px);
}

.donate-section-title {
    text-align: center;
    font-weight: 300;
    width: 100%;
}

.donate-form-field-wrap {
    width: 100%;
    max-width: 300px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.donate-other-amount-input-wrap {
    width: 100%;
}

.donate-other-amount-input {
    width: 100%;
    background-color: var(--color-ui-01);
    border: 1px solid var(--color-ui-04);
    border-radius: 4px;
    padding: 14px 12px;
    height: initial;
    min-height: 46px;
    font-family: var(--font-family-02);
    font-size: var(--font-small, 14px);
    font-weight: 300;
    line-height: 1.2;
    color: var(--font-color-head);
    box-shadow: none;
}

.donate-other-amount-input::placeholder {
    color: var(--font-color-head);
    opacity: 0.6;
    font-family: var(--font-family-02);
    font-size: 13px;
    font-weight: 300;
}

.donate-other-amount-input:hover {
    border: 1px solid var(--color-main-hover);
}

.donate-other-amount-input:focus {
    border: 1px solid var(--color-main);
    box-shadow: none;
}

.donate-frequency-cards {
    width: 100%;
    display: flex;
    gap: var(--medium, 24px);
    cursor: pointer;
}

.donate-frequency-card {
    flex: 1 1 0;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    position: relative;
    min-height: 0;
}

.donate-frequency-card-inner {
    background-color: var(--color-ui-01);
    border: 1px solid var(--color-ui-04);
    border-radius: 4px;
    padding: 24px;
    width: 100%;
    display: flex;
    align-items: flex-start;
}

.donate-frequency-card-selected .donate-frequency-card-inner {
    border: 1px solid var(--color-main);
}

.donate-frequency-card-text {
    color: var(--font-color-body);
    text-align: center;
    width: 100%;
    margin: 0;
}

.donate-frequency-card-check {
    position: absolute;
    right: 0;
    top: 0;
    width: 24px;
    height: 24px;
    z-index: 2;
}

.donate-frequency-card-check-icon {
    position: absolute;
    right: -8px;
    top: -8px;
    width: 28px;
    height: 28px;
    background-color: var(--color-main);
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--typography---font-icon, "Insites Font Icons", Arial, sans-serif);
    font-size: 16px;
    line-height: 0;
    color: var(--font-color-inv);
}

.donate-form-button-wrapper {
    display: flex;
    justify-content: center;
    width: 100%;
}

.donate-button {
    background: var(--color-gradient-02);
    min-height: 40px;
    padding: 14px 24px;
    border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-decoration: none;
    color: var(--font-color-inv);
}

.donate-button .font-icon {
    font-size: 17px;
    line-height: 17px;
    color: var(--font-color-inv);
}

.donate-button .btn-text-wrapper {
    padding-top: 3px;
}

@media screen and (max-width: 1023px) {
    .donate-amount-cards {
        flex-direction: column;
        gap: var(--medium, 24px);
    }

    .donate-form-container {
        padding: var(--medium, 24px);
    }

    .donate-amount-card {
        width: 100%;
        min-height: auto;
    }

    .donate-amount-card-inner {
        min-height: auto;
    }
}

@media screen and (max-width: 639px) {
    .donate-form-wrapper {
        padding: var(--medium, 24px);
    }

    .donate-form-container {
        padding: var(--medium, 24px);
    }

    .donate-other-amount-section,
    .donate-frequency-section {
        max-width: 100%;
    }

    .donate-form-field-wrap {
        max-width: 100%;
    }
}

.body-x-large-bold {
    font-family: var(--font-family-02);
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 150%;
    /* 36px */
}

.support-the-mission-header {
    text-align: center;
    font-family: var(--font-family-01);
    font-size: 90px;
    font-style: normal;
    font-weight: 600;
    line-height: 100%;
    /* 90px */
    text-transform: uppercase;
    width: 50%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 2px;
}

.support-the-mission-subheader {
    width: 30%;
    margin-left: auto;
    margin-right: auto;
}

@media screen and (max-width: 1023px) {
    .support-the-mission-header {
        font-size: 64px;
        width: 70%;
    }

    .support-the-mission-subheader {
        width: 60%;
    }
}

@media screen and (max-width: 639px) {
    .support-the-mission-header {
        font-size: 48px;
        width: 90%;
        line-height: 110%;
    }

    .support-the-mission-subheader {
        width: 100%;
    }
}

.gradient-font {
    background: var(--Gradient---color-gradient-01, linear-gradient(261deg, #FDC458 2.37%, #EE5D51 102.03%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.color-head {
    color: var(--font-color-head) !important;
}

.color-body {
    color: var(--font-color-body) !important;
}

.bg-el-left-support-the-mission {
    z-index: -1;
    max-width: 394px;
    position: absolute;
    inset: 475px auto auto 0%;
}

.hero-banner-section {
    position: relative;
    z-index: 1;
}

/* Remove padding on mobile for hero banner section */
@media screen and (max-width: 767px) {

    .wrapper-0-24.hero-banner-section,
    .header-text-banner-wrapper.wrapper-0-24 {
        padding: 0;
    }
}

.header-menu-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    padding: 24px 48px;
    z-index: 1000;
    pointer-events: auto;
    min-height: 60px;
}

.header-menu-wrapper * {
    pointer-events: auto;
}

/* Ensure floating menu doesn't block hero banner menu when invisible on homepage */
.sticky-navbar.homepage {
    pointer-events: none !important;
    z-index: 1005 !important;
}

.sticky-navbar.homepage .nav-wrapper {
    pointer-events: auto;
    position: relative;
    z-index: 1005;
}

.sticky-navbar.homepage .nav-wrapper .nav-menu-wrapper-m {
    position: relative;
    z-index: 1010;
}

.sticky-navbar.homepage .nav-menu-wrapper-m,
.sticky-navbar.homepage .mobile-nav-button {
    pointer-events: auto !important;
    z-index: 1010 !important;
    position: relative;
}

/* Ensure floating menu is completely out of the way when opacity is 0 */
.sticky-navbar.homepage[style*="opacity: 0"],
.sticky-navbar.homepage[style*="opacity:0"] {
    pointer-events: none !important;
    z-index: -1 !important;
}

.sticky-navbar.homepage[style*="opacity: 0"] .nav-menu-wrapper-m,
.sticky-navbar.homepage[style*="opacity:0"] .nav-menu-wrapper-m,
.sticky-navbar.homepage[style*="opacity: 0"] .mobile-nav-button,
.sticky-navbar.homepage[style*="opacity:0"] .mobile-nav-button {
    pointer-events: auto !important;
    z-index: 1010 !important;
}

.hero-nav-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 48px;
    max-width: 100%;
    pointer-events: auto;
    position: relative;
    z-index: 1001;
    min-height: 40px;
    padding: 8px 0;
}

.hero-nav-link {
    color: #FFFFFF;
    font-family: var(--font-family-01);
    font-size: 16px;
    font-weight: 400;
    text-decoration: none;
    transition: color 0.3s ease;
    white-space: nowrap;
    pointer-events: auto;
    position: relative;
    z-index: 1002;
    cursor: pointer;
    display: inline-block;
    padding: 8px 0;
    line-height: 1.5;
}

.hero-nav-link:hover {
    color: var(--color-main);
}

.hero-join-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 24px 6px 24px;
    border: 1px solid #FFFFFF;
    border-radius: 100px;
    color: #FFFFFF;
    font-family: var(--font-family-01);
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
    white-space: nowrap;
    pointer-events: auto;
    position: relative;
    z-index: 1002;
    cursor: pointer;
}

.hero-join-button:hover {
    background-color: var(--color-main);
    color: #FFFFFF;
    border-color: var(--color-main);
}

.hero-join-button i {
    font-size: 12px;
}

/* Mobile Menu */
ins-button.icon-only.mobile-burger-button button.blue.solid {
    width: 34px !important;
    height: 34px !important;
    min-height: initial !important;
}

ins-button.icon-only.mobile-burger-button button .btn__icon {
    font-size: 18px !important;
}

ins-button.icon-only.transparent-burger.mobile-burger-button button,
ins-button.icon-only.transparent-burger.mobile-burger-button button:hover {
    background: rgba(255, 255, 255, 0.10) !important;
}


/* Hero Mobile Navigation */
.hero-mobile-nav-wrapper {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    padding: 24px;
    z-index: 1002;
    pointer-events: auto;
    justify-content: flex-end;
    align-items: center;
    gap: 16px;
}

.hero-mobile-join-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 20px;
    border: 1px solid #FFFFFF;
    border-radius: 100px;
    color: #FFFFFF;
    font-family: var(--font-family-01);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.3s ease;
    white-space: nowrap;
    pointer-events: auto;
    position: relative;
    z-index: 1003;
    cursor: pointer;
}

.hero-mobile-join-button:hover {
    background-color: var(--color-main);
    color: #FFFFFF;
    border-color: var(--color-main);
}

.hero-mobile-burger-button {
    width: 45px;
    height: 45px;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.10);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    pointer-events: auto;
    position: relative;
    z-index: 1003;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.hero-mobile-burger-button:hover {
    transform: scale(1.05);
    opacity: 0.9;
}

.hero-mobile-burger-button .font-icon.menu {
    color: #FFFFFF;
    font-size: 20px;
    line-height: 1;
    padding-bottom: 20px;
}

@media screen and (max-width: 1024px) {
    .header-menu-wrapper {
        padding: 20px 24px;
    }

    .hero-nav-menu {
        gap: 32px;
    }

    .hero-nav-link {
        font-size: 14px;
    }
}

@media screen and (max-width: 768px) {
    .header-menu-wrapper {
        display: none;
    }

    .hero-mobile-nav-wrapper {
        display: flex;
    }

    .hero-nav-menu {
        gap: 20px;
        flex-wrap: wrap;
        justify-content: center;
    }

    .hero-nav-link {
        font-size: 14px;
    }

    .hero-join-button {
        padding: 12px 20px;
        font-size: 14px;
    }
}

a.hero-join-button:focus {
    color: #fff !important
}

a.hero-nav-link:focus {
    color: var(--color-main) !important
}

.card-flex-news {
    display: flex;
    justify-content: space-between;
}

.ibt-table-wrap__prev-next button {
    padding: 0px !important;
}

@media screen and (min-width: 768px) {
    .hero-mobile-nav-wrapper {
        padding-right: 48px;
    }
}

.join-us-banner-content .heading-1-titlepage {
    text-align: center;
}

a.nav-link div:focus,
a.nav-link div:visited,
a:focus {
    color: var(--color-main) !important
}

/* MARKDOWN CONTENT */
.markdown-content h1 {
    color: var(--font-color-head) !important;
    font-feature-settings: 'liga' off, 'clig' off;

    /* Markdown/dynamic-content h1 */
    font-family: var(--font-family-01) !important;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    /* 38.4px */
}

.markdown-content h2 {
    color: var(--font-color-head) !important;
    font-feature-settings: 'liga' off, 'clig' off;

    /* Markdown/dynamic-content h2 */
    font-family: var(--font-family-01) !important;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    /* 28.8px */
}

.markdown-content h3 {
    color: var(--font-color-head) !important;
    font-feature-settings: 'liga' off, 'clig' off;

    /* Markdown/dynamic-content h3 */
    font-family: var(--font-family-01) !important;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    /* 21.6px */
}

.markdown-content h4 {
    color: var(--font-color-head) !important;
    font-feature-settings: 'liga' off, 'clig' off;

    /* Markdown/dynamic-content h4 */
    font-family: var(--font-family-01) !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    /* 19.2px */
}

.markdown-content h5 {
    color: var(--font-color-head) !important;
    font-feature-settings: 'liga' off, 'clig' off;

    /* Markdown/dynamic-content h5 */
    font-family: var(--font-family-01) !important;
    font-size: 14px !important;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    /* 16.8px */
}

.markdown-content h6 {
    color: var(--font-color-head) !important;
    font-feature-settings: 'liga' off, 'clig' off;

    /* Markdown/dynamic-content h6 */
    font-family: var(--font-family-01) !important;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    /* 14.4px */
}

.markdown-content p {
    color: var(--font-color-body) !important;
    font-feature-settings: 'liga' off, 'clig' off;

    /* Markdown/dynamic-content p */
    font-family: var(--font-family-02) !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 180%;
    /* 28.8px */
}

.markdown-content a {
    color: var(--font-color-link) !important;
    font-feature-settings: 'liga' off, 'clig' off;

    /* Markdown/dynamic-content a */
    font-family: var(--font-family-02) !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.markdown-content ol,
.markdown-content ul {
    color: var(--font-color-body) !important;
    font-feature-settings: 'liga' off, 'clig' off;

    /* Markdown/dynamic-content li */
    font-family: var(--font-family-02) !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 180%;
    /* 28.8px */
}

.markdown-content li {
    color: var(--font-color-body) !important;
    font-feature-settings: 'liga' off, 'clig' off;

    /* Markdown/dynamic-content li */
    font-family: var(--font-family-02) !important;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: 180%;
    /* 28.8px */
}

.markdown-content blockquote {
    color: var(--font-color-body) !important;
    font-feature-settings: 'liga' off, 'clig' off;

    /* Markdown/dynamic-content blockquote */
    font-family: var(--font-family-02) !important;
    font-size: 18px;
    font-style: normal;
    font-weight: 300;
    line-height: 150%;
    /* 27px */
}

ins-button button.ins-button.size--small:not(.is-loading) {
    padding: 0px 24px !important;
}

.downloads-wrapper span.btn__label v-align {
    padding-top: 4px !important;
}

.ins-form-field-wrap .icon-wrap.hover:hover {
    color: var(--color-main) !important;
}

.resources-item .image-wrapper.stay_engaged {
    height: auto !important;
    padding: 24px;
}

.button-gradient {
    z-index: 0;
    background-image: linear-gradient(78deg, var(--_colour---brand--color-sub2), var(--_colour---brand--color-main) 74%, var(--_colour---brand--color-sub1));
    position: absolute;
    inset: 0%;
}

.ibt-table-wrap__prev-next button:hover {
    color: var(--font-color-body);
    background-color: var(--color-main-hover-light);
}

.stay-engaged-wrapper .resources-item ins-card .ins-card-wrap {
    border: none !important;
}

/********** Video play button **********/
ins-button.icon-only[size="large"][icon="icon-play"] button .btn__icon {
    padding-left: 10px;
}

ins-button.icon-only.size-64[size="large"][icon="icon-play"] button .btn__icon {
    padding-left: 0px !important;
}

@media screen and (max-width: 639px) {
    ins-button.icon-only[size="large"][icon="icon-play"] {
        top: calc(50% - 40px) !important;
        left: calc(50% - 40px) !important;
    }

    ins-button.icon-only[size="large"][icon="icon-play"] button.blue.solid {
        width: 80px !important;
        height: 80px !important;
    }

    ins-button.icon-only[size="large"][icon="icon-play"] button .btn__icon {
        font-size: 28px !important;
        line-height: 100% !important;
        padding-left: 5px;
    }
}

/* Margin */
.ml-neg-20 {
    margin-left: -20px;
}

.mr-neg-20 {
    margin-right: -20px;
}

.mt-neg-20 {
    margin-top: -20px;
}

.mb-neg-20 {
    margin-bottom: -20px;
}

.ml-neg-12 {
    margin-left: -12px;
}

.mr-neg-12 {
    margin-right: -12px;
}

.mt-neg-12 {
    margin-top: -12px;
}

.mb-neg-12 {
    margin-bottom: -12px;
}

/* Padding */
.pl-8 {
    padding-left: 8px;
}

.footerSubItems .align-justify {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.align-justify span {
    width: 50%;
}

@media screen and (max-width: 639px) {
    .align-justify span {
        width: 100%;
    }

    .footerSubItems .align-justify {
        display: flex;
        flex-direction: column;
        gap: 16px;
        justify-content: space-between;
        align-items: flex-start;
    }
}

.message .ins-form-field-wrap .ins-form-field {
    min-height: 110px !important;
}

.collection-notice-link {
    font-size: 14px !important;
}

.ins-checkbox-group-wrap .ins-checkbox-group-label-wrap {
    display: none !important;
}

.contact-us-form-container .consent.column-1,
.contact-us-form-container .volunteering_interest.column-1 {
    margin: 0px !important;
}

.ins-checkbox-radio-label {
    color: var(--font---font-color-body, #515B6F);
    font-feature-settings: 'liga' off, 'clig' off;

    /* form-checkbox-label */
    font-family: var(--font-family-02) !important;
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 150%;
    /* 21px */
}

.contact-us-content-wrapper a {
    font-weight: 200 !important;
}

.contact-us-content-wrapper a:hover {
    color: #ED5E52 !important;
}

.contact-us-content-wrapper .footer-links i {
    background: linear-gradient(180deg, #EE5D51 -11.46%, #FDC458 116.87%);
    -webkit-background-clip: text;
    /* For Safari/Chrome */
    background-clip: text;
    -webkit-text-fill-color: transparent;
    /* For Safari/Chrome */
    text-fill-color: transparent;
    display: initial;
}

.consent a,
.required-fields-container span {
    font-size: 14px !important;
}

.country .ins-input-select-wrap {
    margin-bottom: 0px !important;
}

.wf-12px,
.filter__label {
    font-size: 0.9rem !important;
    /* Make it slightly bigger */
    transform: scale(0.95) !important;
    /* Scale it back down slightly */
    transform-origin: left !important;
}

.wf-14px,
.join-us-wrapper ins-checkbox .ins-radio-checkbox label .ins-checkbox-radio-label,
#volunteer-form2 ins-checkbox .ins-radio-checkbox label .ins-checkbox-radio-label,
.contact-us-form-container ins-checkbox .ins-radio-checkbox label .ins-checkbox-radio-label,
.required-fields-note p,
.required-fields-container span,
.donate-amount-card-text p {
    font-size: 0.975rem !important;
    /* Make it slightly bigger */
    transform: scale(0.95) !important;
    /* Scale it back down slightly */
    transform-origin: left !important;
}

.wf-16px,
.markdown-content p,
.ul-terms-privacy li,
.ul-terms-privacy ol,
.ul-terms-privacy ul,
.btn-16px span,
.legal ol>li::marker {
    font-size: 1.125rem !important;
    /* Make it slightly bigger */
    transform: scale(0.95) !important;
    /* Scale it back down slightly */
    transform-origin: left !important;
}

.wf-18px {
    font-size: 1.39rem !important;
    /* Make it slightly bigger */
    transform: scale(0.95) !important;
    /* Scale it back down slightly */
    transform-origin: left !important;
}

.wf-24px {
    font-size: 1.35rem !important;
    /* Make it slightly bigger */
    transform: scale(0.95) !important;
    /* Scale it back down slightly */
    transform-origin: left !important;
}

.news-share-container {
    position: relative;
    display: inline-block;
}

.news-share-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background-color: transparent;
    border: 1px solid var(--color-main, #1779BA);
    border-radius: 100px;
    color: var(--color-main, #1779BA);
    font-family: var(--font-family-01);
    font-size: 16px;
    font-weight: 600;
    line-height: 100%;
    cursor: pointer;
    transition: all 0.3s ease;
}

.news-share-button:hover {
    background-color: var(--color-main, #1779BA);
    color: #fff;
}

.news-share-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 8px;
    background-color: #fff;
    border: 1px solid #E0E0E0;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    min-width: 180px;
    z-index: 1000;
    overflow: hidden;
}

.news-share-dropdown .share-link {
    display: block;
    padding: 12px 16px;
    color: #323232;
    text-decoration: none;
    font-family: var(--font-family-01);
    font-size: 14px;
    font-weight: 500;
    transition: background-color 0.2s ease;
    border-bottom: 1px solid #F0F0F0;
}

.news-share-dropdown .share-link:last-child {
    border-bottom: none;
}

.news-share-dropdown .share-link:hover {
    background-color: #F5F5F5;
    color: var(--color-main, #1779BA);
}

.ml-28px {
    margin-left: 28px !important;
}

/* background-image: linear-gradient(78deg, var(--_colour---brand--color-sub2), var(--_colour---brand--color-main) 74%, var(--_colour---brand--color-sub1)); */