.hidden {
    display: none !important;
}

body:has(.contact-us-pg) {
    .brz-container {
        width: 100%;
        margin: 0 auto;
        padding: 0 2rem;
    }

    @media (width >= 64rem) {
        .brz-container {
            max-width: 1500px;
        }
    }
}

header .ct-container, .page-template-custom .ct-container, .container {
    width: 100%;
    margin: 0 auto;
    padding: 0 2rem;
}
@media (width >= 64rem) {
    header .ct-container, .page-template-custom .ct-container, .container {
        max-width: 1500px;
    }
}

.ct-header-cta {
    margin-left: auto !important;
}

#header {
    .site-logo-container img {
        width: 100%;
        min-width: 120px;
    }

    @media only screen and (min-width: 1000px) and (max-width: 1100px) {
        .ct-button {
            padding: 10px 0;
            width: 100px;
        }
    }

    @media only screen and (min-width: 1000px) {
        position: sticky;
        top: 0;

        .site-branding {
            margin-left: 0;
            margin-right: auto;
        }
    }

    @media only screen and (max-width: 999px) {
        [data-row=middle] .ct-button {
            padding: .5rem 1.5rem;
            min-height: 0;
            font-size: .8rem;
            margin-right: 2rem;
        }
    }
}

.custom-btn {
    padding: 10px 40px;
    color: #1A3242;
    position: relative;
    border-radius: 8px;
    white-space: nowrap;
    font-weight: 600;
    font-family: "futura-pt", sans-serif;
    text-transform: uppercase;
    transition: .1s;
    transition-delay: .1s;
    left: 0;
    top: 0;

    &:hover {
        color: #1A3242;
        top: 2px;
        left: 2px;

        &:before {
            top: 3px;
            left: 3px;
            opacity: .3;
        }
    }

    &:before {
        content: "";
        display: block;
        position: absolute;
        z-index: -1;
        width: 100%;
        height: 100%;
        background: black;
        border-radius: 10px;
        top: 6px;
        left: 6px;
        filter: none;
        opacity: .2 !important;
        pointer-events: none;
        transition: .1s;
        transition-delay: .1s;
    }

    &.yellow {
        background: #FEC000;
    }
}

.page-template-custom {
    .txt-color {
        color: #1A3242;
    }

    .rounded-borders {
        border-radius: 10px;
    }

    .home-slider-ct {
        position: relative;
        margin: 0;

        @media only screen and (min-width: 1000px) {
            .slider-form-wrapper {
                transition: .5s;
                left: 2rem;

                @media (width >= 1500px) {
                    left: calc(((100% - 1500px) + 4rem) / 2);
                }
            }

            .swiper:has(.swiper-slide-active.form-right) + .slider-form-wrapper {
                transform: translateX(calc(100dvw - 100% - 5rem)) translateY(-50%);

                @media (width >= 1500px) {
                    transform: translateX(calc(1500px - 100% - 4rem)) translateY(-50%);
                }
            }
        }

        .swiper-slide.form-left .slide-content {
            margin-left: auto;
        }

        .swiper-nav-ct {
            position: absolute;
            bottom: 1rem;
            right: 2rem;
            z-index: 2;

            @media only screen and (max-width: 999px) {
                bottom: 0;
                right: auto;
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding: .5rem 2rem;
                background: #383838bd;
            }

            @media only screen and (min-width: 1000px) {
                bottom: 1rem;
                right: 2rem;
            }

            @media (width >= 1500px) {
                right: calc(((100% - 1500px) + 4rem) / 2)
            }

            .swiper-pagination-fraction {
                display: flex;
                color: white;
                position: initial;
                justify-content: center;

                @media only screen and (max-width: 999px) {
                    width: auto;
                }
            }
            .swiper-controls {
                display: flex;
                gap: 1rem;

                .swiper-button-prev, .swiper-button-next, .swiper-button-control {
                    position: initial;
                    opacity: 1;
                    margin: 0;
                    color: white;
                    display: flex;
                    align-items: center;

                    &:hover i {
                        font-weight: 900;
                    }

                    i {
                        font-size: 2rem;
                        cursor: pointer;
                    }

                    &:after {
                        display: none;
                    }
                }
            }
        }

        .video-modal {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            visibility: hidden;
            opacity: 0;
            z-index: -1;
            pointer-events: none;
            display: flex;
            justify-content: center;
            background: rgba(0,0,0,.8);
            overflow: hidden;
            transition: .2s;

            @media only screen and (min-width: 1000px) {
                align-items: center;
            }

            &.active {
                visibility: visible;
                opacity: 1;
                z-index: 9;
                pointer-events: all;

                .video-ct {
                    top: 30dvh;

                    @media only screen and (min-width: 1000px) {
                        top: 0;
                    }
                }
            }

            .video-ct {
                position: relative;
                top: 100%;
                transition: .4s;
                transition-delay: .2s;
            }

            i {
                position: absolute;
                top: -1rem;
                right: -1rem;
                color: white;
                cursor: pointer;
                font-size: 2rem;

                &:hover {
                    font-weight: 900;
                }
            }

            iframe {
                border: none;
                aspect-ratio: 16/9;
                width: 90dvw;
                border-radius: 10px;

                @media only screen and (min-width: 1000px) {
                    width: 50dvw;
                }
            }
        }
    }

    .home-slider {
        .inner-slide {
            height: 65dvh;
            min-height: 600px;
            display: flex;
            align-items: center;
            
            @media only screen and (max-width: 999px) {
                    background: var(--bg-mobile) !important;
                	align-items: end;
    				padding-bottom: 5rem;
                }

            .ct-overlay {
                position: absolute;
                z-index: 1;
                background: var(--overlay);
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
            }

            .container {
                position: relative;
                z-index: 2;
            }

            .ct-container {
                display:flex;
                flex-flow: column;
                gap: 1rem;
                align-items: start;
            }

            .video-btn {
                display: flex;
                align-items: center;
                gap: .75rem;
                font-size: 1rem;
                background: rgba(0,0,0,.4);
                padding: 5px 15px;
                border-radius: 8px;
                font-weight: 600;
                border: 2px solid white;
                color:white;
                line-height: 1;
                cursor: pointer;
                text-transform: uppercase;
                margin-bottom: 1rem;
                transition: .2s;

                @media only screen and (max-width: 999px) {
                    font-size: .8rem;
                    padding: 5px 10px;
                }

                &:hover {
                    background: rgba(0,0,0,.8);
                }

                i {
                    font-weight: 100;
                    font-size: 30px;

                    &:before {
                        content: '\f167';
                    }
                }
            }

            .slide-content {
                color: white;
                font-size: 2rem;
                line-height: 1;
                @media only screen and (max-width: 999px) {
                        display: flex;
    					align-items: flex-start;
    					flex-flow: column-reverse;
    					gap: 1rem;
                }

                @media only screen and (min-width: 1000px) {
                    max-width: 58%;
                }

                p {
                    margin-block-end: 0;
                    text-shadow: var(--shadow);
                }

                strong {
                    font-size: .8rem;
                }

                .font-size-small strong {
                    font-size: 2.5rem;
                }

                .font-size-normal strong {
                    font-size: 3rem;
                }

                .font-size-large strong {
                    font-size: 4rem;
                }

                @media only screen and (min-width: 1000px) {
                    strong {
                        font-size: 1rem;
                    }

                    .font-size-small strong {
                        font-size: 3.5rem;
                    }

                    .font-size-normal strong {
                        font-size: 4rem;
                    }

                    .font-size-large strong {
                        font-size: 7rem;
                    }
                }
            }
        }
    }

    .slider-form-wrapper {
        transition: .2s;
        overflow: visible;
        opacity: 0;

        .slider-form {
            box-shadow: 0 5px 30px 5px black;
        }

        &:has(form) {
            opacity: 1;
        }

        @media only screen and (max-width: 999px) {
            padding: 2rem;
            background: #FEC000;
            min-height: 525px;
        }

        @media only screen and (min-width: 1000px) {
            position: absolute;
            z-index: 1;
            top: 45%;
            transform: translateY(-50%);
            max-height: 85%;
            border-radius: 10px;
        }
    }

    .donate-form {
        border-radius: 10px;
        overflow: hidden;

        &:has(.donately-donation-form) .form-heading {
            display: block;
        }

        .form-heading {
            display: none;
            text-align: center;
            font-weight: bold;
            font-size: 1.5rem;
            color: white;
            width: 100%;
            background: #242424;
            padding: 1.2rem;

            @media only screen and (min-width: 1000px) {
                font-size: 2rem;
            }
        }

        form {
            background: #383838;
        }

        .donately-donation-form {
            padding: 10px;

            @media only screen and (min-width: 1000px) {
                padding: 20px;
            }

            * {
                font-family: "futura-pt",sans-serif;
            }

            .donately-donation-frequency {
                display: flex;
                justify-content: center;
                margin-bottom: 20px;
                gap: .5rem;
            }

            fieldset.donately-fields:has(.donately-donation-frequency) + fieldset.donately-custom-fields {
                margin-bottom: 20px;

                section {
                    color: white;
                    text-align: center;
                }
            }

            .donately-email-fields, .donately-first-name-group, .donately-last-name-group {
                label {
                    display: none;
                }

                input {
                    margin-bottom: 10px;
                    padding: 14px 10px 14px 40px;
                    font-size: 1rem;
                    font-weight: 700;
                    width: 100%;
                    background: transparent;
                    border: none;
                    transition: border 100ms ease-in-out;
                    border-radius: 10px;
                }
            }

            .donately-first-name-group, .donately-last-name-group {
                input {
                    padding: 0 10px;
                }
            }

            .donately-payment-options {
                margin-bottom: 10px;

                label {
                    padding: 18px 28px;
                    width: auto;
                    height: auto;
                    line-height: 1;
                    justify-content: center;
                    align-items: center;
                    display: flex;
                    border-radius: 10px;
                    text-transform: uppercase;
                    margin: 0;
                    color: #383838;
                    border: none;

                    &.active {
                        background: #FEC000;
                    }
                    @media only screen and (max-width: 999px) {
                        font-size: 12px;
                        padding: 10px 15px;
                        white-space: normal;
                        text-align: center;
                    }
                }
            }

            .donately-secure-footer.secure-lock {
                margin: 0;

                span {
                    color: white;
                }
            }

            #custom-fields-location-donorpaysfees {
                margin-bottom: 10px;

                span, b {
                    color: white;
                }
            }

            .donately-stripe-card-fields {
                margin-bottom: 0;
            }

            .card-number-fields {
                height: auto;
            }

            #custom-fields-location-privacy {
                margin-top: 5px;

                span, a {
                    color: white
                }

                a:hover {
                    text-decoration: underline;
                }
            }

            .donately-secure-fields {
                background: transparent;
                border: none;

                label {
                    display: none;
                }
            }

            .donately-preset-amounts {
                gap: 3px;
                margin-bottom: 10px;

                .button-label {
                    padding: 10px;
                    border-radius: 10px;
                    border: 0;

                    @media only screen and (min-width: 1000px) {
                        padding: 15px;
                    }
                }

                li.active {
                    .button-label {
                        background: #FEC000;
                        color: black;
                    }
                }
            }

            .donately-donation-amount {
                margin-bottom: 10px;
                border-radius: 10px;

                input {
                    border-radius: 10px;
                }
            }

            #donately-form-bottomnav, fieldset.donately-fields {
                margin: 0
            }

            .donately-radio-option {
                margin: 0;


                label.sr-only {
                    background: #DFDFDF;
                    position: initial;
                    color: #383838;
                    padding: 18px 28px;
                    width: auto;
                    height: auto;
                    line-height: 1;
                    justify-content: center;
                    align-items: center;
                    display: flex;
                    border-radius: 10px;
                    text-transform: uppercase;
                    margin: 0;

                    @media only screen and (max-width: 999px) {
                        font-size: 12px;
                        padding: 10px 15px;
                        white-space: normal;
                        text-align: center;
                    }
                }

                span.field-label {
                    display: none;
                }

                &.active, &:has(input:checked) {
                    label.sr-only {
                        background: #FEC000;
                    }

                    label.sr-only {
                        color: #383838;
                        opacity: 1;
                    }
                }
            }

            .donately-btn {
                margin: 0;
                background: #FEC000;
                width: 100%;
                color: #383838;
                border-radius: 10px;
                text-transform: uppercase;
                cursor: pointer;
                display: flex;
                align-items: center;
                justify-content: center;

                &:hover {
                    background: #ffd34a;
                }
            }

            #custom-fields-location-submit {
                display: flex;
                flex-flow: column;
                gap: 1rem;
            }
        }

        #donately-form-topnav {
            height: 0;
            visibility: hidden;
            pointer-events: none;
            margin: 0;
        }

        #donately-stripe-card-element {
            border-radius: 10px;
        }

        .fieldset-label, .donately-branding {
            display: none;
        }

        #layout-step-2 {
        }
    }

    .impact-block {
        text-align:center;
        color:white;
        text-transform: uppercase;

        .container {
            padding: 4rem 1rem;
        }

        p {
            margin: 0;
        }

        strong {
            font-size: 1.5rem;
        }
    }

    .stats-block {
        min-height: 85dvh;
        display: flex;
        background-repeat: no-repeat;
        background-position: center bottom;
        background-size: cover;

        .stats-wrapper {
            margin-top: 60dvh;
            width: 100%;
            padding-top: 20%;
            background: linear-gradient(0deg, #d6d9e2b3 90%, transparent 100%);

            @media only screen and (min-width: 1000px) {
                margin-top: 80dvh;
                padding-top: 3%;
            }
        }

        .stats-inner {
            margin-top: auto;
            padding-bottom: 2rem;

            .stats-ct {
                display: grid;
                grid-template-columns: repeat(1, 1fr);
                grid-gap: 0 1rem;

                @media only screen and (min-width: 1000px) {
                    grid-template-columns: repeat(3, 1fr);
                    grid-gap: 0 6rem;
                }

                .stat-item {
                    display: flex;

                    &:nth-child(3n + 2) {
                        justify-content: center;
                    }

                    &:nth-child(3n + 3) {
                        justify-content: flex-end;
                    }
                }

                .stat-inner {
                    display: flex;
                    flex-flow: column;
                    gap: .2rem;
                    width: 100%;

                    span {
                        text-transform: uppercase;
                        font-size: .8rem;
                        font-weight: 500;
                        white-space: nowrap;
                        line-height: 1;

                        @media only screen and (min-width: 1000px) {
                            font-size: 1.2rem;
                        }
                    }

                    p {
                        font-size: 1.25rem;
                        line-height: 2rem;
                        font-weight: 900;

                        @media only screen and (min-width: 1000px) {
                            font-size: 2rem;
                        }
                    }
                }
            }

            .flipcard {
                display: flex;
                flex-flow: column;
                gap: 8px;
                align-items: center;

                span {
                    font-size: 1.25rem;
                }

                .flip-counter {
                    display: flex;
                    gap: 4px;
                    flex-flow: row;
                }

                .flip-card {
                    position: relative;
                    width: 35px;
                    height: 60px;
                    background: #000;
                    border-radius: 6px;
                    overflow: hidden;
                    perspective: 1000px;
                    
                    @media only screen and (max-width: 999px) {
                        &[data-digit=","] {
                            width: 0px;opacity: 0;
                        }
                    }

                    @media only screen and (min-width: 1000px) {
                        width: 40px
                    }

                    &:before, &:after {
                        background: linear-gradient(360deg,rgba(255, 255, 255, 1) 0%, rgba(160, 160, 160, 1) 50%, rgba(255, 255, 255, 1) 100%);
                        content: '';
                        display: block;
                        position: absolute;
                        top: 50%;
                        transform: translateY(-50%);
                        width: 3px;
                        height: 16px;
                        z-index: 2;
                        opacity: 0.5;
                    }

                    &:before {
                        left: 0;
                        border-radius: 0 4px 4px 0;
                    }

                    &:after {
                        right: 0;
                        border-radius: 4px 0 0 4px;
                    }
                }

                .digit {
                    position: absolute;
                    width: 100%;
                    height: 100%;
                    font-weight: 900;
                    font-size: 40px;
                    color: #fff;
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    backface-visibility: hidden;
                    transform-origin: center center;
                    transition: transform 0.6s;


                    &:before {
                        content: '';
                        display: block;
                        position: absolute;
                        width: 100%;
                        height: 53%;
                        background: linear-gradient(180deg, rgb(255 255 255 / 50%) 0%, rgba(255, 255, 255, 0) 50%);
                        border-bottom: 2px solid black;
                        z-index: 1;
                        top: 0;
                    }

                    &:after {
                        content: '';
                        display: block;
                        position: absolute;
                        width: 100%;
                        height: 50%;
                        background: rgb(255 255 255 / 25%);
                        z-index: 1;
                        bottom: 0;
                    }
                }

                .flip-card .digit {
                    transform: rotateX(0deg);
                }

                .flip-card.flip .digit {
                    transform: rotateX(-180deg);
                }
            }
        }
    }

    .awards-block {
        padding: 2rem 0;

        @media only screen and (min-width: 1000px) {
            padding: 4rem 0;
        }

        .container {
            display: grid;
            grid-template-columns: repeat(1, 1fr);

            @media only screen and (min-width: 1000px) {
                grid-template-columns: repeat(3, 1fr);
            }
        }

        .award-item a {
            display: flex;
            align-items: center;
            flex: 30% 0 1;
        }

        .award-text {
            padding-left: 1rem;
        }

        span.award-place {
            display: block;
            font-family: 'futura-pt';
            font-size: 1.25rem;
            color: #fff;
            font-weight: 500;
        }

        span.award-name {
            display: block;
            font-family: 'futura-pt';
            font-weight: 800;
            font-size: 1.25rem;
            color: #fff;
            line-height: 1.5rem;
        }

        .award-logo {
            width: 120px;
            text-align:center;
            flex-shrink: 0;
        }

        .award-item {
            display: flex;
            align-items: center;
            border-bottom: 1px solid rgba(255, 255, 255, 0.3);

            @media only screen and (max-width: 999px) {
                padding: 2rem 0;

                &:first-child {
                    padding-top: 0;
                }

                &:last-child {
                    padding-bottom: 0;
                    border-bottom: 0;
                }
            }

            @media only screen and (min-width: 1000px) {
                padding: 0 3rem;
                border-bottom: 0;
                border-right: 1px solid rgba(255, 255, 255, 0.3);
                justify-content: center;

                &:last-child {
                    border-right: 0;
                }

                &:nth-child(3n + 1) {
                    justify-content: flex-end;
                }

                &:nth-child(3n + 3) {
                    justify-content: flex-start;
                }
            }
        }

        img {
            max-height: 150px;
            max-width: 300px;
            object-fit: contain;
        }
    }

    .cards-block {
        padding: 4rem 0;

        .cards-heading {
            margin-bottom: 4rem;
            display: block;
            text-align: center;
            font-weight: bold;
            font-size: 1.6rem;
            color: #383838;
        }

        .cards-items {
            display: grid;
            grid-template-columns: repeat(1, 1fr);
            gap: 3rem;

            @media only screen and (min-width: 1000px) {
                grid-template-columns: repeat(3, 1fr);
            }

            .card-item {
                border-radius: 10px;

                .card-img {
                    position: relative;
                    margin-bottom: 2rem;

                    &:before {
                        content: "";
                        display: block;
                        position: absolute;
                        z-index: -1;
                        width: 100%;
                        height: 100%;
                        background: var(--bg-color);
                        border-radius: 10px;
                        top: 6px;
                        left: 6px;
                    }

                    img {
                        width: 100%;
                        object-fit: cover;
                        height: 250px;
                        border-radius: 10px;
                    }
                }

                .card-content {
                    font-size: 1rem;

                    h3 {
                        color: #383838;
                        text-transform: uppercase;
                        font-weight: 600;
                        font-size: 1.2rem;
                        line-height: 1;
                    }
                }

                h4 {
                    position: relative;
                    color: #383838;
                    padding-bottom: 1rem;
                    font-family: "futura-pt", sans-serif;
                    font-weight: bold;
                    font-size: 1.6rem;

                    &:after {
                        content: "";
                        display: block;
                        position: absolute;
                        width: 100px;
                        height: 3px;
                        background: #383838;
                        bottom: 0;
                        left: 0;
                    }
                }

                .custom-btn {
                    text-transform: uppercase;
                    font-weight: 600;
                    background: var(--bg-color);
                    color: var(--text-color, #1A3242);
                }
            }
        }
    }

    .content-block {
        padding: 3rem 0;

        @media only screen and (min-width: 1000px) {
            padding: 4rem 0;

            &.two-thirds {
                .container {
                    .content-inner {
                        gap: 3rem;
                        max-width: calc(100% - 505px - 3rem);

                        .img-ct, .content-ct {
                            width: calc(100% - 1.5rem);
                        }
                    }
                }
            }
        }

        @media only screen and (max-width: 1300px) {
            &.two-thirds {
                .container {
                    .content-inner {
                        flex-flow: column !important;

                        .img-ct {
                            width: 100%;
                        }

                        .content-ct {
                            width: 100%;
                            max-width: 100%;
                        }
                    }
                }
            }
        }

        .container {
            .content-inner {
                display: flex;
                justify-content: space-between;
                gap: 2rem;

                @media only screen and (max-width: 999px) {
                    flex-flow: column;
                }

                @media only screen and (min-width: 1000px) {
                    gap: 4rem;
                }
            }
        }

        &.content-left .content-inner {
            @media only screen and (min-width: 1000px) {
                flex-flow: row-reverse;
            }
        }

        &.content-stacked {
            .content-inner {
                flex-flow: column !important;

                .img-ct {
                    width: 100%;
                }

                .content-ct {
                    width: 100%;
                    max-width: 100%;
                }
            }
        }

        .img-ct {
            position: relative;
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;

            @media only screen and (min-width: 1000px) {
                width: 50%;

                &:has(i) {
                    width: 60%;
                    flex-shrink: 0;
                }
            }

            &.has-bg {
                &:before {
                    content: "";
                    display: block;
                    position: absolute;
                    z-index: 0;
                    width: 100%;
                    height: 100%;
                    background: var(--bg-color);
                    border-radius: 10px;
                    top: 6px;
                    left: 6px;
                }
            }

            .img-overlay {
                position: absolute;
                display: flex;
                justify-content: center;
                align-items: center;
                flex-flow: column;
                gap: 1rem;
                z-index: 2;

                i {
                    color: white;
                    font-size: 4rem;
                    cursor: pointer;
                }
            }

            .img-text {
                color: white;
                font-weight: bold;
                text-align: center;
                font-size: 1.6rem;
                z-index: 2;

                p {
                    margin: 0;
                }
            }
        }

        img {
            object-fit: cover;
            position: relative;
            z-index: 1;
            width: 100%;
            height: 100%;
        }

        .heading-txt {
            font-weight: bold;
            font-size: 1.5rem;
            display: block;
            color: var(--text-color, #1A3242);
            margin-bottom: 1rem;
            line-height: 1.2;

            &.has-underline {
                padding-bottom: 1rem;
                position: relative;

                &:after {
                    content: "";
                    display: block;
                    position: absolute;
                    width: 150px;
                    height: 3px;
                    background: var(--text-color, #1A3242);
                    bottom: 0;
                    left: 0;
                }
            }
        }

        .heading-icon {
            margin-bottom: 1rem;
            max-width: 60px;
            flex-shrink: 0;
            width: 100%;
            mask-image: var(--bg);
            mask-size: contain;
            mask-repeat: no-repeat;
            mask-position: center;
            background: var(--bg-color);
            height: 60px;
            display: flex;
        }

        .content-ct {
            @media only screen and (min-width: 1000px) {
                max-width: 50%;
                align-self: center;

                &:has(form) {
                    max-width: 40%;
                }
            }

            .content-txt {
                font-size: 1rem;
                color: var(--text-color, #1A3242);

                h5 {
                    color: var(--text-color, #1A3242);
                    position: relative;
                    padding-bottom: .5rem;
                    font-weight: 600;

                    &:after {
                        content: "";
                        display: block;
                        position: absolute;
                        width: 100px;
                        height: 3px;
                        background: var(--text-color, #1A3242);
                        bottom: 0;
                        left: 0;
                    }
                }
            }

            .custom-btn {
                background: var(--bg-color);
                color: var(--text-color, #1A3242);
                z-index: 2;
            }
        }

        #signup-form {
            display: flex;
            align-items: center;
            position: relative;
            z-index: 2;

            &:after {
                content: "";
                display: block;
                position: absolute;
                z-index: -1;
                width: 100%;
                height: 100%;
                background: black;
                border-radius: 10px;
                top: 6px;
                left: 6px;
                opacity: .2 !important;
            }

            input {
                border-radius: 10px 0 0 10px;
                background: white;
            }

            button {
                display: flex;
                align-items: center;
                white-space: nowrap;
                gap: .5rem;
                text-transform: uppercase;
                background: #1A3242;
                font-weight: 600;
                font-family: "futura-pt", sans-serif;
                border-radius: 0 10px 10px 0;

                &:hover {
                    background: #102029;
                }
            }
        }

        .list-ct {
            display: flex;
            flex-flow: column;
            gap: 2rem;

            .list-item {
                display: flex;
                align-items: center;
                gap: 1.5rem;

                .list-icon {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    padding: 1.5rem;
                    border-radius: 10px;
                    background: #1A3242;
                    flex-shrink: 0;

                    span {
                        width: 50px;
                        height: 50px;
                        mask-image: var(--bg);
                        mask-size: contain;
                        mask-repeat: no-repeat;
                        mask-position: center;
                        background: white;
                    }
                }

                .list-txt {
                    font-size: 1rem;
                    position: relative;
                    padding-top: 1rem;

                    &:before {
                        content: "";
                        display: block;
                        position: absolute;
                        width: 40%;
                        height: 3px;
                        background: #1A3242;
                        top: .25rem;
                    }

                    p {
                        margin: 0;
                    }
                }
            }
        }

        .images-ct {
            display: flex;
            gap: 1rem;
        }
    }

    .programs-block {
        padding-top: 4rem;
        padding-bottom: 3rem;
        position: relative;

        .ct-overlay {
            position: absolute;
            z-index: 1;
            background: var(--overlay);
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

        @media only screen and (min-width: 1000px) {
            padding-top: 25dvh;
        }

        .container {
            display: flex;
            flex-flow: column;
            position: relative;
            z-index: 2;
        }
        h1 {
            color: white;
            font-family: "futura-pt", sans-serif;
            font-weight: bold;
            font-size: 3rem;
            line-height: 1;
            text-shadow: var(--shadow);
        }

        .heading-txt {
            color: white;
            max-width: 400px;
        }

        .programs-items {
            display: grid;
            grid-template-columns: repeat(1, 1fr);
            gap: 1.5rem;

            @media only screen and (min-width: 1000px) {
                grid-template-columns: repeat(3, 1fr);
                max-width: 85%;
            }

            .programs-item {
                position: relative;
                z-index: 0;
                cursor: pointer;
                color: #383838;
                transition: .1s;
                transition-delay: .1s;
                left: 0;
                top: 0;

                .item-inner {
                    padding: 2rem 1.5rem;
                    background: white;
                    display: flex;
                    align-items: center;
                    gap: 1.5rem;
                    border-radius: 10px;
                    z-index: 2;
                    height: 100%;

                    .icon {
                        flex-shrink: 0;
                        max-width: 60px;
                        width: 100%;
                        mask-image: var(--bg);
                        mask-size: contain;
                        mask-repeat: no-repeat;
                        mask-position: center;
                        background: var(--bg-color);
                        height: 100%;

                        &.is-bg {
                            background: var(--bg) center/contain no-repeat;
                        }
                    }
                }

                &:hover {
                    top: 2px;
                    left: 2px;

                    &:before {
                        top: 3px;
                        left: 3px;
                        opacity: .3;
                    }
                }

                &:before {
                    content: "";
                    display: block;
                    position: absolute;
                    z-index: -1;
                    width: 100%;
                    height: 100%;
                    background: #383838;
                    border-radius: 10px;
                    top: 6px;
                    left: 6px;
                    transition: .1s;
                    transition-delay: .1s;
                }

                .item-ct {
                    display: flex;
                    flex-flow: column;
                    gap: .5rem;

                    .item-title {
                        text-transform: uppercase;
                        font-weight: bold;
                        font-size: 1rem;
                    }

                    .item-txt {
                        font-size: .9rem;
                        line-height: 1.5;
                    }
                }
            }
        }
    }

    .programs-tabs {
        display: flex;
        background: #1A3242;
        position: fixed;
        width: 100%;
        top: 0;
        z-index: -1;
        visibility: hidden;
        pointer-events: none;
        height: 0;

        &.visible {
            visibility: visible;
            pointer-events: all;
            z-index: 9999;
            height: auto;
        }

        @media (min-width: 1000px) {
            top: 90px;
        }

        .container {
            display: flex;
            overflow-x: auto;
        }

        .programs-tab {
            position: relative;
            white-space: nowrap;

            &:last-child:after {
                display: none;
            }

            &:after {
                content: "";
                display: block;
                position: absolute;
                width: 1px;
                height: 20px;
                background: white;
                bottom: 50%;
                transform: translateY(50%);
                right: -1px;
            }

            .tab-inner {
                display: flex;
            }

            a {
                color: white;
                font-size: .9rem;
                font-weight: 600;
                padding: 1rem 2rem;
                transition: .2s;
                text-transform: uppercase;

                &:hover {
                    background: white;
                    color: #1A3242;
                    box-shadow: 0 1px 5px #00000029;
                }
            }
        }
    }

    .gallery-block {
        padding: 2rem 0;
        position: relative;
        overflow: hidden;

        @media only screen and (min-width: 1000px) {
            padding: 4rem 0;

            &.min-h-carousel {
                .swiper {
                    min-height: 750px;
                }
            }
        }

        .container {
            position: relative;
        }

        h2 {
            margin-bottom: 4rem;
            display: block;
            text-align: center;
            font-weight: bold;
            font-size: 1.6rem;
            color: var(--text-color, #383838);

            @media only screen and (max-width: 999px) {
                margin-bottom: 2rem;
                line-height: 1.2;
            }
        }

        &:has(.expanding-collection-content) h2 {
            margin-bottom: 6rem;
        }

        .slide-content {
            color: white;

            h4 {
                font-weight: bold;
                font-size: 1.4rem;
                font-family: "futura-pt", sans-serif;
            }

            p {
                opacity: 1;
                line-height: 1.5;
            }

            .button-ct {
                display: flex;
                margin-top: 1rem;

                .custom-btn {
                    background: #FEC000;
                }
            }
        }

        .video-play {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            display: flex;
            width: 100%;
            margin-bottom: 1rem;
            justify-content: center;
            z-index: 4;

            i {
                color: white;
                margin: 0 auto;
                cursor: pointer;
                z-index: 2;
                font-size: 4rem;
            }
        }

        .swiper-slide-active {
            .slide-content {
                p {
                    -webkit-line-clamp: none;
                }
            }
        }

        .swiper-button-next, .swiper-button-prev {
            i {
                color: var(--text-color, #383838);
                font-size: 2rem;
            }

            &:after {
                display: none;
            }
        }

        .expanding-collection-content h4 {
            color: #1f1f1f;
            font-weight: bold;
            font-size: 1.4rem;
            font-family: "futura-pt", sans-serif;
        }

        .expanding-collection-content-inner {
            p {
                margin-bottom: 1rem;
            }

            &:has(.read-more):not(.expanded) {
                p {
                    display: -webkit-box;
                    -webkit-box-orient: vertical;
                    -webkit-line-clamp: 2;
                    overflow: hidden;
                }
            }

            .read-more {
                display: none;
                position: relative;
                z-index: 2;
                cursor: pointer;
                justify-content: center;
                transition: .2s;

                &.active {
                    display: flex;
                }

                &:hover {
                    text-decoration: underline;
                }
            }
        }

        .swiper-carousel:has(.expanding-collection-content) {
            height: 380px;
            transition: height 0.3s ease;
        }
    }

    .join-block {
        position: relative;

        @media only screen and (max-width: 999px) {
            display: flex;
            flex-flow: column;
        }

        @media only screen and (min-width: 1000px) {
            padding-top: 10dvh;
            padding-bottom: 3rem;
        }

        &:before {
            content: '';
            display: block;
            width: 100%;
            height: 40dvh;
            background: var(--bg-mobile) center/cover no-repeat;
            right: 0;
            top: 0;

            @media only screen and (min-width: 1000px) {
                position: absolute;
                height: 100%;
                width: 80%;
                background: var(--bg) right/cover no-repeat;
            }
        }

        @media only screen and (min-width: 1000px) {
            &:after {
                content: '';
                display: block;
                width: 100%;
                height: 100%;
                position: absolute;
                left: 0;
                z-index: 1;
                top: 0;
                background: linear-gradient(90deg, #FEC000 50%, transparent 80%)
            }
        }

        .container {
            position: relative;
            z-index: 2;

            @media only screen and (max-width: 999px) {
                background: #FEC000;
                padding-bottom: 2rem;

                h1 {
                    transform: translateY(calc(-100% - 2rem));
                    color: white;
                    font-size: 2rem;
                }
            }
        }

        h1 {
            color: #1A3242;
            font-family: "futura-pt", sans-serif;
            font-weight: bold;
            font-size: 3rem;
            line-height: 1;
            margin-bottom: 2rem;
            text-shadow: var(--shadow);
        }

        .join-items {
            display: grid;
            grid-template-columns: repeat(1, 1fr);
            gap: 1.5rem;

            @media only screen and (max-width: 999px) {
                margin-top: -1rem;
            }

            @media only screen and (min-width: 1000px) {
                grid-template-columns: repeat(3, 1fr);
                max-width: 70%;
            }

            .join-item {
                position: relative;
                z-index: 0;
                cursor: pointer;
                transition: .1s;
                transition-delay: .1s;
                left: 0;
                top: 0;

                p {
                    margin: 0;
                }

                &:hover {
                    top: 2px;
                    left: 2px;

                    &:before {
                        top: 3px;
                        left: 3px;
                        opacity: .3;
                    }
                }

                &:before {
                    content: "";
                    display: block;
                    position: absolute;
                    z-index: -1;
                    width: 100%;
                    height: 100%;
                    background: #383838;
                    border-radius: 10px;
                    top: 6px;
                    left: 6px;
                    transition: .1s;
                    transition-delay: .1s;
                }
            }

            .item-inner {
                padding: 1rem;
                background: white;
                display: flex;
                flex-flow: column;
                gap: .5rem;
                border-radius: 10px;
                position: relative;
                z-index: 3;
                cursor: pointer;
                height: 100%;

                &:hover {
                    background: #1A3242;

                    .item-title, .item-txt, i {
                        color: white;
                    }
                }

                .item-title {
                    text-transform: uppercase;
                    font-weight: bold;
                    font-size: 1rem;
                    color: black;
                    line-height: 1.2;
                }

                .item-txt {
                    font-size: .9rem;
                    line-height: 1.5;
                    color: #383838;
                }

                i {
                    margin-top: auto;
                    font-size: 2rem;
                    text-align: right;
                    color: #1A3242
                }
            }
        }

        #signup-form {
            display: flex;
            align-items: center;
            position: relative;
            z-index: 2;

            &:after {
                content: "";
                display: block;
                position: absolute;
                z-index: -1;
                width: 100%;
                height: 100%;
                background: black;
                border-radius: 10px;
                top: 6px;
                left: 6px;
                opacity: .2 !important;
            }

            input {
                border-radius: 10px 0 0 10px;
                background: white;
            }

            button {
                display: flex;
                align-items: center;
                white-space: nowrap;
                gap: .5rem;
                text-transform: uppercase;
                background: #1A3242;
                font-weight: 600;
                font-family: "futura-pt", sans-serif;
                border-radius: 0 10px 10px 0;

                &:hover {
                    background: #102029;
                }
            }
        }

        .join-form {
            margin-top: 3rem;
            color: #1A3242;

            @media only screen and (min-width: 1000px) {
                max-width: 40%;
            }

            h3 {
                font-weight: 900;
                font-size: 1.5rem;
                color: #1A3242;
            }

            p {
                font-weight: bold;
            }
        }
    }

    .join-tabs {
        display: flex;
        background: #FEC000;
        position: fixed;
        width: 100%;
        top: 0;
        z-index: -1;
        visibility: hidden;
        pointer-events: none;
        height: 0;

        &.visible {
            visibility: visible;
            pointer-events: all;
            z-index: 9999;
            height: auto;
        }

        @media (min-width: 1000px) {
            top: 90px;
        }

        .container {
            display: flex;
            overflow-x: auto;
        }

        .join-tab {
            position: relative;
            white-space: nowrap;

            &:last-child:after {
                display: none;
            }

            &:after {
                content: "";
                display: block;
                position: absolute;
                width: 1px;
                height: 20px;
                background: white;
                bottom: 50%;
                transform: translateY(50%);
                right: -1px;
            }

            .tab-inner {
                display: flex;
            }

            a {
                color: #1A3242;
                font-size: .9rem;
                font-weight: 600;
                padding: 1rem 2rem;
                transition: .2s;
                text-transform: uppercase;

                &:hover {
                    background: white;
                    box-shadow: 0 1px 5px #00000029;
                }
            }
        }
    }

    .parent-block {
        padding: 2rem 0;
        .content-block:has(+ .content-block) {
            padding-bottom: 1rem;
        }

        .content-block, .card-content {
            h2, h4 {
                font-size: 1rem !important;

                @media only screen and (min-width: 1000px) {
                    font-size: 1.75rem !important;
                }
            }
        }
    }

    .partners-block {
        padding: 2rem 0;

        .container {
            display: flex;
            flex-flow: column;
            gap: 4rem;
        }

        .custom-btn {
            background: #FEC000;
        }

        .heading-ct {
            display: flex;
            justify-content: space-between;
            align-items: center;

            @media only screen and (max-width: 999px) {
                flex-flow: column;
                gap: 1rem;

                h2 {
                    line-height: 1.2;
                }
            }

            h2 {
                font-weight: 900;
                color: #1A3242;
                font-size: 1.5rem;
                margin: 0;
            }
        }

        .partners-ct {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 3rem;
            margin: 0 auto;

            @media only screen and (min-width: 1000px) {
                max-width: 80%;
                gap: 5rem;
                grid-template-columns: repeat(6, 1fr);
            }

            img {
                width: 100%;
                height: 100%;
                object-fit: contain;
            }
        }

        .cta-ct {
            display: flex;
            justify-content: center;
            align-items: center;
        }
    }

    .double-content {
        padding: 2rem 0;

        @media only screen and (max-width: 999px) {
            h2 {
                line-height: 1.2;
            }
        }

        h2 {
            font-weight: bold;
            color: #383838;
            font-size: 1.5rem;
            text-align: center;
        }

        .content-wrapper {
            display: grid;
            grid-template-columns: repeat(1, 1fr);
            gap: 1rem;

            @media only screen and (min-width: 1000px) {
                grid-template-columns: repeat(2, 1fr);
                gap: 2rem;
            }

            .content-left, .content-right {
                display: flex;
                justify-content: center;

                > div {
                    @media only screen and (min-width: 1000px) {
                        max-width: 70%;
                    }
                }

                h5 {
                    color: #383838;
                    position: relative;
                    padding-bottom: .5rem;
                    font-weight: 600;

                    &:after {
                        content: "";
                        display: block;
                        position: absolute;
                        width: 100px;
                        height: 3px;
                        background: #383838;
                        bottom: 0;
                        left: 0;
                    }
                }
            }
        }
    }

    .donate-block {
        position: relative;

        .ct-overlay {
            position: absolute;
            z-index: 1;
            background: var(--overlay);
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

        @media only screen and (max-width: 999px) {
            display: flex;
            flex-flow: column;
        }

        @media only screen and (min-width: 1000px) {
            padding: 10dvh 0;
            height: 65dvh;
            min-height: 600px;
        }

        &:before {
            content: '';
            display: block;
            width: 100%;
            height: 40dvh;
            background: var(--bg-mobile) center/cover no-repeat;
            right: 0;
            top: 0;

            @media only screen and (min-width: 1000px) {
                position: absolute;
                height: 100%;
                background: var(--bg) right/cover no-repeat;
            }
        }

        .container {
            position: relative;
            z-index: 2;
            height: 100%;
            display: flex;
            align-items: center;

            h1 {
                color: white;
                font-family: "futura-pt", sans-serif;
                font-weight: bold;
                font-size: 4rem;
                line-height: 1;
                margin-bottom: 2rem;
                text-shadow: var(--shadow);
            }

            @media only screen and (max-width: 999px) {
                background: #FEC000;
                padding-bottom: 2rem;
                flex-flow: column;

                h1 {
                    transform: translateY(calc(-100% - 2rem));
                    color: white;
                    font-size: 2rem;

                    & + div {
                        color: #1a3242;
                        margin-top: -2rem;
                    }
                }
            }

            .donate-content {
                color: white;
                display: flex;
                flex-flow: column;

                @media only screen and (min-width: 1000px) {
                    max-width: 40%;
                }
            }

            .donate-form {
                transition: 0s;
                right: 2rem;
                max-height: none;

                @media only screen and (min-width: 1000px) {
                    top: 50%;
                    position: fixed;
                    transform: translateY(-50%);

                    &:not(.locked) {
                        @media (width >= 1500px) {
                            right: calc(((100% - 1500px) + 4rem) / 2)
                        }
                    }

                    &.locked {
                        right: 2rem;
                    }
                }
            }
        }
    }

    .video-modal.general-modal {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        visibility: hidden;
        opacity: 0;
        z-index: -1;
        pointer-events: none;
        display: flex;
        justify-content: center;
        background: rgba(0,0,0,.8);
        overflow: hidden;
        transition: .2s;

        @media only screen and (min-width: 1000px) {
            align-items: center;
        }

        &.active {
            visibility: visible;
            opacity: 1;
            z-index: 99999999;
            pointer-events: all;

            .video-ct {
                top: 30dvh;

                @media only screen and (min-width: 1000px) {
                    top: 0;
                }
            }
        }

        .video-ct {
            position: relative;
            top: 100%;
            transition: .4s;
            transition-delay: .2s;
        }

        i {
            position: absolute;
            top: -1rem;
            right: -1rem;
            color: white;
            cursor: pointer;
            font-size: 2rem;

            &:hover {
                font-weight: 900;
            }
        }

        iframe {
            border: none;
            aspect-ratio: 16/9;
            width: 90dvw;
            border-radius: 10px;

            @media only screen and (min-width: 1000px) {
                width: 50dvw;
            }
        }
    }
}

[data-fade] {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    opacity: 0;
}

.in-view {
    &[data-fade=up] {
        animation-name: fadeInUp;
    }

    &[data-fade=down] {
        animation-name: fadeInDown;
    }

    &[data-fade=left] {
        animation-name: fadeInLeft;
    }

    &[data-fade=right] {
        animation-name: fadeInRight;
    }
}

@-webkit-keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,100%,0);
        transform: translate3d(0,100%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,100%,0);
        transform: translate3d(0,100%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@-webkit-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-100%,0);
        transform: translate3d(0,-100%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0,-100%,0);
        transform: translate3d(0,-100%,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@-webkit-keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%,0,0);
        transform: translate3d(-100%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes fadeInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-100%,0,0);
        transform: translate3d(-100%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%,0,0);
        transform: translate3d(100%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(100%,0,0);
        transform: translate3d(100%,0,0)
    }

    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.donately-donation-form {
    &:has(.donately-thank-you-header) {
        padding-top:.2rem !important;
    }

    #checkmark {
        transform: scale(.5)
    }

    .donately-share-button-text {
        margin-bottom: .2rem;
    }
    
    .confirmation-container * {
        color: white;

        .donately-thank-you-header {
            margin-bottom: .5rem
        }

        .donately-share-link {
            background: transparent;
            color: white;
        }

        .donately-social-share-buttons {
            margin-bottom: .5rem;
            path {
                fill: white;
            }
        }

        .hr {
            display:none
        }

        .donately-social-share-images-container {
            margin-bottom: 0;
            margin-top: .2rem;
        }

        .donately-share-header {
            margin-top: .5rem;
            margin-bottom: .5rem
        }
    }
}

#dntly-donation-form {
    #nav-back {
        margin: 1rem 0;
    }

    #layout-step-2 {
        .field-label {
            display:none;
        }

        input, select {
            margin-bottom: 10px;
            padding: 10px 14px;
            font-size: 1rem;
            border-radius: 10px;
        }
    }

    #back-step.donately-btn {
        background-color: #666;
        color: #fff;
    }
}