.membership_hero_banner {
    min-height: 70vh;
    max-height: 609px;
    position: relative
}

.membership_hero_banner>* {
    z-index: 1
}

.membership_hero_banner:after {
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    width: 70%;
    height: 100%;
    /* background-image:url(/images/membership/membership_banner_image.webp); */
    background-size: contain;
    background-position: center right;
    background-repeat: no-repeat
}

@media screen and (max-width: 900px) {
    .membership_hero_banner {
        min-height:100%
    }

    .membership_hero_banner:after {
        width: 100%;
        opacity: .5
    }
}

.review_banner_loop {
    height: 100%;
    width: calc(100% + 220px);
    gap: 4vw;
    overflow-x: hidden;
    overflow: hidden;
    margin-left: -150px
}

.review_banner_loop .loop_track {
    animation: textLeftToRight 40s linear infinite;
    display: flex;
    gap: 4vw;
    width: 3500px
}

.review_banner_loop .benefits_text {
    -webkit-text-stroke: 1px var(--stroke-medium);
    color: transparent
}

@media screen and (max-width: 768px) {
    .review_banner_loop {
        width:100%;
        margin-left: 0
    }

    .review_banner_loop .reviews_text {
        font-size: 6rem
    }
}

@media screen and (max-width: 480px) {
    .review_banner_loop .reviews_text {
        font-size:4rem
    }
}

.membership_page .membership_banner {
    margin-top: 0!important
}

.membership_priority_banners {
    padding: 8vh 4vw;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.08);
    max-height: 460px;
    min-height: 46vh;
    position: relative;
    overflow: hidden;
    height: 100%
}

.membership_priority_banners>* {
    z-index: 1
}

.membership_priority_banners .title-h2 {
    max-width: 20ch
}

.membership_priority_banners .benefit_image {
    width: 40%;
    height: auto;
    max-width: 600px;
    object-fit: contain;
    position: absolute;
    bottom: 0;
    right: 0
}

.membership_priority_banners svg {
    height: 36px;
    width: 36px
}

.membership_priority_banners:before {
    position: absolute;
    content: "";
    height: 50%;
    width: 25%;
    opacity: .4;
    bottom: -10%;
    filter: blur(60px);
    left: -5%;
    z-index: -1
}

.membership_priority_banners:after {
    position: absolute;
    content: "";
    height: 50%;
    width: 25%;
    opacity: .2;
    top: -10%;
    filter: blur(60px);
    right: -5%;
    z-index: -1
}

.membership_priority_banners.banner-0:after,.membership_priority_banners.banner-0:before {
    background: #11687a
}

.membership_priority_banners.banner-1:after,.membership_priority_banners.banner-1:before {
    background: #11547a
}

.membership_priority_banners.banner-2:after,.membership_priority_banners.banner-2:before {
    background: #117a7a
}

.membership_priority_banners.banner-3:after,.membership_priority_banners.banner-3:before {
    background: #107755
}

.apparel_banner {
    background-color: var(--bg-extra-dark);
    padding: 8vh 4vw;
    border-radius: 12px;
    position: relative;
    overflow: hidden
}

.apparel_banner>* {
    z-index: 1
}

.apparel_banner .apparel_image {
    position: absolute;
    width: 30%;
    height: auto;
    object-fit: contain;
    right: 0;
    bottom: 0;
    z-index: 0
}

@media screen and (max-width: 600px) {
    .apparel_banner .apparel_image {
        width:100%;
        opacity: .4
    }
}

.membership_benefits_scroll {
    position: sticky;
    position: -webkit-sticky;
    top: 40px
}

@media screen and (max-width: 900px) {
    .membership_benefits_scroll {
        position:relative
    }
}

.membership_icon_bottom {
    height: 22px;
    width: 22px
}

.perk_list_benefits {
    margin-left: 10px;
    list-style-type: none
}

.perk_list_benefits li {
    display: inline-block;
    margin-right: 20px
}

@media screen and (max-width: 500px) {
    .perk_list_benefits li {
        display:flex;
        justify-content: flex-start;
        gap: 5px;
        align-items: center;
        margin-right: 0;
        margin-bottom: 10px
    }
}