﻿
.username_ok,
.email_ok,
.mc_number_ok,
.mc_type_ok {
    color: #359746;
}

.username_bad,
.email_bad,
.mc_number_bad,
.mc_type_bad {
    color: #cc3300;
}

.page_actions,
.footer {
    display: none;
}

/*---------------------------------------------------------------*/

/*#region -- Main Theme*/

/*#region Header*/

#header .container {
    align-items: center;
}

#header .logo {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 2em;
    color: var(--black);
    letter-spacing: -1px;
    width: fit-content;
}

    #header .logo strong {
        font-weight: 700;
        color: var(--green);
    }

#header .header_actions a {
    cursor: pointer;
    color: var(--black);
}

    #header .header_actions a:hover {
        color: var(--green);
    }

#header .header_actions i {
    font-size: 1.8em;
}

#header.scrolled .logo,
#header.scrolled .header_actions,
#header.scrolled .header_actions a,
#header.menu-open .logo,
#header.menu-open .header_actions,
#header.menu-open .header_actions a {
    color: #fff;
}

/*#endregion*/

/*#region Icon Menu*/

.icon_menu:not(.mybaus_sidebar) {
    position: fixed;
    display: flex;
    justify-content: center;
    gap: 1.5em;
    background: var(--mint);
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 99;
    padding: 10px;
    box-shadow: rgba(0, 0, 0, 0.3) 0 -3px 5px;
}

    .icon_menu:not(.mybaus_sidebar) a {
        color: var(--black);
        display: block;
        line-height: 1.8em;
        text-align: center;
        font-weight: 500;
        font-size: .85em;
    }

    .icon_menu:not(.mybaus_sidebar) i {
        display: block;
        font-size: 2em;
    }


body.icon_feed .icon_menu .icon-bar-feed,
body.icon_resources .icon_menu .icon-bar-resources,
body.icon_groups .icon_menu .icon-bar-groups,
body.icon_calendar .icon_menu .icon-bar-calendar,
body.icon_profile .icon_menu .icon-bar-profile {
    color: var(--theme-color-dark);
}

/*#endregion*/
#page {
    background: var(--grey-light);
    background-image: url(../../images/mybaus/desktop-bg.jpg);
    background-repeat: no-repeat;
    background-position: bottom left;
    background-attachment: fixed;
    background-size: 70% auto;
    min-height: 100vh;
}

.social_share {
    display: none;
}

.side_menu_container {
    margin: 0 -10px;
}

#top-left-curve {
    content: var(--theme-lower-curve);
    top: 0;
    left: 0;
    transform: scale(-1);
    width: 95%;
    height: 30vh;
    opacity: .5;
}

#content {
    padding-top: 150px !important;
    min-height: 100vh;
    background: none !important;
}

.breadcrumb {
    display: none;
}

/*#region Sidebar*/

.mybaus_sidebar_container {
    position: sticky;
    top: 0px;
}

.mybaus_sidebar {
    padding-right: 2em;
    /*max-height: 500px;
    overflow-y: scroll;
    overflow-x: hidden;*/
}

    .mybaus_sidebar > ul {
        list-style: none;
        padding-left: 0;
        margin-bottom: 2em;
    }

        .mybaus_sidebar > ul li {
            padding: 3px 0;
        }

            .mybaus_sidebar > ul li a {
                font-size: 1.3em;
                color: var(--black);
            }

                .mybaus_sidebar > ul li a:hover {
                    color: var(--theme-color-dark);
                }

                .mybaus_sidebar > ul li a i {
                    font-size: 1.1em;
                    margin-right: 7px;
                }

                .mybaus_sidebar > ul li.subitem{
                    font-size: .8em;
                }

    .mybaus_sidebar .icon-bar-newsletters .icon-baus::before {
        width: 20px;
        height: 19px;
        background-image: url(../../images/icons/baus-icon-green.svg);
        filter: saturate(0) brightness(0);
        transition: all .3s;
    }

    .mybaus_sidebar .icon-bar-newsletters:hover .icon-baus::before {
        filter: saturate(1);
    }
/*#endregion*/
/*#region Elements */
.pfp {
    width: fit-content;
}

    .pfp img {
        width: 45px;
        height: 45px !important;
        border-radius: 50%;
        object-fit: cover;
        object-position: center;
    }

    .pfp.medium img {
        width: 90px;
        height: 90px !important;
    }

    .pfp.large img {
        width: 150px;
        height: 150px !important;
    }


.tag {
    position: relative;
    border-radius: 15px;
    display: block;
    height: fit-content;
    width: fit-content;
    font-weight: 400 !important;
    padding: 3px 12px;
    color: var(--black) !important;
    font-size: .95em;
}

    .tag::after {
        content: "";
        border-radius: 15px;
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        background: var(--theme-color-alt);
    }

    .tag span {
        position: relative;
        z-index: 2;
    }

/*#endregion*/

/*#region Feed & Posts*/

.feed .post {
    --heading: var(--theme-color-dark);
    --tag: var(--theme-color);
    --tag-hover: var(--theme-color);
    --interactions: var(--theme-color);
    --interactions-dark: var(--theme-color-dark);
}

    .feed .post.theme-Newsletter {
        /*--interactions: var(--mint-dark);
        --interactions-dark: var(--mint);
        --tag: var(--mint-dark);
        --tag-hover: var(--green);*/
    }

    .feed .post .card_header {
        padding-bottom: 0;
    }

        .feed .post .card_header .recommended_tag {
            display: none;
            flex-basis: 100%;
        }


    .feed .post:nth-of-type(4n) .card_header .recommended_tag {
        display: block;
    }

    .feed .post h3.themed {
        color: var(--heading);
        font-weight: 600;
        margin: 0;
    }

        .feed .post h3.themed:has(:empty) {
            display: none;
        }

        .feed .post h3.themed::before {
            position: relative;
            top: 2px;
            font-family: bootstrap-icons !important;
            font-weight: 300;
            margin-right: 10px;
        }

    .feed .post .card_content h4 a {
        color: var(--black);
    }
        .feed .post .card_content h4 a:hover {
            color: var(--theme-color-dark);
        }

    .feed .post .card_content h4 + h4 {
        margin-top: -5px;
    }

    .feed .post .card_footer {
        align-items: center;
        padding-bottom: 5px;
        justify-content: space-between;
    }

        .feed .post .card_footer:is(:empty) {
            padding: 0;
        }

        .feed .post .card_footer .btn.edit {
            opacity: 0;
            margin-right: 5px;
        }

        .feed .post .card_footer .btn {
            width: fit-content;
        }

            .feed .post .card_footer .btn:first-of-type {
                margin-left: auto;
            }

            .feed .post .card_footer .btn:hover {
                background: var(--interactions-dark);
            }

        .feed .post .card_footer .post_interactions span {
            font-size: 1.3em;
            color: var(--theme-color-dark);
        }

            .feed .post .card_footer .post_interactions span:not(.disabled):hover {
                color: var(--theme-superdark);
            }

        .feed .post .card_footer .post_buttons{
            margin-left: auto;
        }

        .feed .post:hover .card_footer .btn.edit {
            opacity: 1;
        }


    .feed .post.theme-Events h3.themed::before {
        content: "\f20c";
    }

    .feed .post.theme-News h3.themed::before {
        content: "\f4a3";
    }

    .feed .post.theme-Newsletter h3.themed::before {
        display: inline-block;
        content: "";
        background: url(../../images/icons/baus-icon-green.svg) no-repeat;
        background-size: contain;
        width: 30px;
        height: 25px;
    }



.post .recommended_tag {
    color: var(--grey-mid);
}

.post .post_tags {
    display: flex;
    gap: 4px;
    max-width: 300px;
    justify-content: end;
    flex-wrap: wrap;
    margin-left: auto;
}

    .post .post_tags .tag {
        background: var(--tag);
        color: var(--theme-button-color) !important;
        display: flex;
        align-items: center;
    }

        .post .post_tags .tag::before {
            margin-right: 4px;
            z-index: 2;
            font-family: bootstrap-icons !important;
        }

        .post .post_tags .tag.theme-regions::before {
            content: var(--icon-region);
        }

        .post .post_tags .tag.theme-sections::before {
            content: var(--icon-section);
        }

        .post .post_tags .tag.theme-trainees::before {
            content: var(--icon-trainees);
        }

        .post .post_tags .tag.theme-news::before {
            content: var(--icon-news);
        }

        .post .post_tags .tag.theme-events::before {
            content: var(--icon-events);
        }


.post .post_author {
    display: flex;
    gap: 1em;
    align-items: center;
}

    .post .post_author p:first-of-type {
        font-size: 1.1em;
        font-weight: 600;
    }

    .post .post_author p {
        margin: 0 0;
    }


.post .post_interactions a {
    font-size: 1.2em !important;
    padding: 0 4px;
}

.post .interactions span {
    padding: 0 5px;
    margin-right: 5px;
}

    .post .interactions span:not(.disabled):hover {
        cursor: pointer;
    }

    .post .interactions span small {
        margin-left: 5px;
    }

/*.post .interactions span .icon_info {
        display: inline-block;
        font-size: .8em;
        max-width: 0;
        width: 100%;
        transition: all .3s ease;
        overflow: hidden;
    }

    .post .interactions span:hover .icon_info {
        max-width: 100px;
    }*/

.post .comments {
    margin-top: 5px;
    padding: 10px;
    background: rgba(0,0,0,.025);
    border-radius: var(--border-radius);
}

    .post .comments .comment {
        display: flex;
        gap: 10px;
        padding: 10px;
        border-radius: var(--border-radius);
        transition: all .3s;
    }

        .post .comments .comment.flagged {
            background: var(--orange-light);
        }

        .post .comments .comment.deleted .author,
        .post .comments .comment.deleted .comment_content {
            font-style: italic;
            color: #999;
        }

        .post .comments .comment + .comment {
            margin-top: 5px;
        }

        .post .comments .comment strong {
            font-family: Poppins;
            font-weight: 500;
        }

        .post .comments .comment .comment_text {
            flex-grow: 1;
        }

        .post .comments .comment .comment_header {
            border-bottom: 0px solid transparent;
            display: flex;
            transition: all .3s;
        }

            .post .comments .comment .comment_header > span {
                margin: 0 10px;
                opacity: .4;
                flex-grow: 1;
            }

        .post .comments .comment .comment_interactions {
            display: flex;
            gap: 0;
        }

            .post .comments .comment .comment_interactions span {
                opacity: .6;
            }

                .post .comments .comment .comment_interactions span small {
                    margin-left: 4px;
                }

            .post .comments .comment .comment_interactions .bi-reply,
            .post .comments .comment .comment_interactions .bi-reply-fill {
                /* For some reason the reply icon is just a little small */
                font-size: 1.22em;
                line-height: 1em;
            }

            .post .comments .comment .comment_interactions span:hover {
                cursor: pointer;
                opacity: 1;
            }

        .post .comments .comment .comment_content .comment_interactions {
            display: none;
            margin-top: 6px;
        }


        .post .comments .comment .comment_text .alert {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            padding: 10px 15px;
            margin: 5px 0 0;
            gap: 5px;
        }

            .post .comments .comment .comment_text .alert p {
                flex-grow: 1;
            }

        .post .comments .comment .edit_container {
            display: flex;
            flex-wrap: wrap;
            justify-content: end;
            gap: 0 5px;
        }

            .post .comments .comment .edit_container .form-control {
                flex-basis: 100%;
            }

            .post .comments .comment .edit_container .btn {
                padding: 8px 20px;
            }

        .post .comments .comment .form-control {
            border: none;
            border-radius: 0;
            padding: 6px 10px;
        }

        .post .comments .comment:not(.new_comment) .form-control {
            background: #fff;
            margin: 4px 0 8px;
        }

        .post .comments .comment:not(.new_comment) .btn {
            padding: 12px 25px;
        }
        /*.post .comments .comment:not(.new_comment) .btn + .btn {
            margin-left: 8px;
        }*/



        .post .comments .comment:hover .comment_header .comment_interactions {
            opacity: 1;
        }

        .post .comments .comment.new_comment {
            position: relative;
            background: rgba(0,0,0,.04);
            border-radius: 50px;
            margin-top: 10px;
        }

            .post .comments .comment.new_comment .pfp img {
                width: 39px;
                height: 39px !important;
            }


            .post .comments .comment.new_comment .btn {
                padding: 12px 25px;
            }

.post .comment_container {
    border-radius: 15px;
    transition: all .3s ease;
}


    .post .comment_container > .comment_container,
    .post .comment_container > .new_comment {
        margin: 0 10px 0 20px;
    }

        .post .comment_container > .comment_container .pfp img {
            width: 35px;
            height: 35px !important;
        }

    .post .comment_container.open {
        margin-bottom: 10px;
        padding: 5px 0 10px;
    }

    .post .comment_container.open,
    .post .comment_container:hover {
        background: rgba(0,0,0,.05);
    }

        .post .comment_container.open > .comment:first-of-type {
            margin-bottom: 5px;
        }

.pfp.has_link {
    position: relative;
}

    .pfp.has_link .pfp_link {
        opacity: 0;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-flow: column;
        z-index: 1;
        transition: opacity .3s ease;
    }

    .pfp.has_link.large .pfp_link i {
        font-size: 2em;
    }

    .pfp.has_link:hover .pfp_link {
        opacity: 1;
    }

.pfp.has_link {
    height: fit-content;
}

    .pfp.has_link img {
        transition: filter .3s ease;
    }

    .pfp.has_link:hover img {
        filter: brightness(.6);
    }


/*.comment_container {
    max-height: 0;
    height: 100%;
    overflow: hidden;
    padding: 0;
}

    .comment_container.open {
        max-height: 500px;
        padding: 5px 0 10px;
    }*/

/*#endregion*/

.alert.submit-flag {
    width: 100%;
    margin-bottom: 0;
}

.submit-flag-form {
    display: flex;
    gap: 15px;
    align-items: flex-end;
    width: 100%;
}

    .submit-flag-form .form-group {
        flex-grow: 1;
        margin-bottom: 0;
    }

.notification_alert {
    width: fit-content;
    padding: 15px 20px;
}

    .notification_alert a:hover {
        color: var(--green-dark);
    }

    .notification_alert a i {
        position: relative;
        top: 1px;
        left: 1px;
    }

/*---------------------------------------------------------------*/
/*#region -- Profile Page*/
.profile_card {
    margin-top: 100px;
}

.profile_header {
    text-align: center;
    margin-bottom: 2em;
}

    .profile_header h2 {
        margin-bottom: 0;
    }

    .profile_header h5 {
        margin-top: 3px;
    }

    .profile_header .pfp {
        position: relative;
        width: fit-content;
        margin: -100px auto 0;
    }

        .profile_header .pfp .tag {
            position: absolute;
            top: 25px;
            left: 85%;
        }

        .profile_header .pfp img {
            height: 115px !important;
            width: 115px !important;
        }

.subscription_alert {
    position: relative;
    padding: 1em;
    border-radius: var(--border-radius);
}

    .subscription_alert.success {
        background: var(--mint);
    }

        .subscription_alert.success::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            background: url(../../images/mybaus/subscription-alert.jpg) no-repeat center;
            background-size: cover;
            border-radius: var(--border-radius);
            mix-blend-mode: luminosity;
            opacity: .7;
        }

        .subscription_alert.success > * {
            position: relative;
            z-index: 1;
        }

    .subscription_alert.warning {
        background: var(--orange);
    }

    .subscription_alert.danger {
        background: var(--red);
    }

    .subscription_alert > div:first-of-type p {
        display: flex;
        align-items: center;
        margin-bottom: 10px;
    }

        .subscription_alert > div:first-of-type p i {
            font-size: 1.6em;
            margin-right: 4px;
            line-height: 1em;
        }

    .subscription_alert .renewal_notice {
        display: flex;
        justify-content: space-between;
        align-items: end;
    }

        .subscription_alert .renewal_notice h4,
        .subscription_alert .renewal_notice h5 {
            margin: 0;
        }

        .subscription_alert .renewal_notice a {
            color: var(--black);
        }

.certificate_btn {
    margin-top: 0;
    display: block;
}

.members_nav_grid {
    margin-top: 1em;
    display: grid;
    gap: 5px;
    grid-template-columns: repeat(3, 1fr);
}

    .members_nav_grid a {
        display: flex;
        flex-flow: column;
        gap: .8em;
        background: var(--theme-bannertitle-notice);
        color: var(--black);
        border-radius: 25px;
        padding: 7px;
        line-height: 1.1em;
        justify-content: center;
        align-items: center;
        height: 100px;
        font-weight: 500;
    }

        .members_nav_grid a:hover {
            background: var(--mint-dark);
        }

        .members_nav_grid a i {
            font-size: 2em;
        }

        .members_nav_grid a span {
            text-align: center;
        }
/*#endregion*/

#content .address {
    position: relative;
    padding: 15px;
    background: var(--grey-light);
}

a.remove_address {
    position: absolute;
    top: 10px;
    right: 10px;
    color: #666666 !important;
    z-index: 10;
}

/*---------------------------------------------------------------*/

/*#region -- Groups */

.group_blocks {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1em;
}

    .group_blocks .group {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        height: 160px;
        padding: 10px;
        border-radius: 25px;
        overflow: hidden;
        background: var(--theme-color-dark);
        transition: all .3s ease;
    }


        .group_blocks .group img {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            height: 100% !important;
            width: 100%;
            border-radius: 25px;
            object-fit: cover;
            mix-blend-mode: multiply;
            opacity: .2;
            transition: all .3s ease;
        }

        .group_blocks .group a {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 2;
        }

        .group_blocks .group span {
            font-weight: 600;
            color: #fff;
            z-index: 1;
        }

        .group_blocks .group:hover img {
            opacity: .3;
            filter: brightness(.4);
        }

        .group_blocks .group::before,
        .group_blocks .group::after {
            position: absolute;
            font-family: bootstrap-icons !important;
            top: 11px;
            z-index: 3;
            font-size: 1.3em;
            color: #fff;
        }

    .group_blocks:not([view="mine"]) .group.member_group::before {
        content: "\f26b";
        right: 17px;
    }

    .group_blocks.main_container .group.leader::after {
        content: "\f588";
        left: 17px;
    }

    .group_blocks.sidebar {
        grid-template-columns: repeat(1, 1fr);
        margin-bottom: 1em;
        gap: .5em;
    }

        .group_blocks.sidebar .group {
            height: fit-content;
            padding: 7px 10px;
            border-radius: 0;
            background: #fff;
            border-left: 6px solid var(--theme-color-dark);
        }

        .group_blocks.sidebar span {
            line-height: 1.2em;
            font-weight: 400;
            display: flex;
            width: 100%;
            justify-content: start;
            align-items: center;
            gap: 8px;
            text-align: left;
            color: var(--black);
            font-weight: 300;
        }

        .group_blocks.sidebar i {
            line-height: 1.4em;
            color: var(--theme-color-dark);
            font-size: 1.6em !important;
        }

            .group_blocks.sidebar i::before {
                font-weight: 300;
            }

.groups_sidebar .expandable {
    border: 1px solid var(--theme-color);
    margin: 0 -10px;
    border-radius: var(--border-radius);
}

.groups_sidebar .expandable_heading {
    background: none;
}

    .groups_sidebar .expandable_heading .expandable_title {
        background: none;
        color: var(--theme-color);
        font-size: initial;
    }

        .groups_sidebar .expandable_heading .expandable_title a {
            color: var(--black) !important;
            text-align: left;
            padding-left: 15px;
        }

        .groups_sidebar .expandable_heading .expandable_title .glyphicon {
            top: 3px;
        }

.groups_sidebar .expandable_body {
    padding: 0 8px 11px;
}

.groups_sidebar + .groups_sidebar {
    margin-top: 14px;
}

/*#endregion*/
/*---------------------------------------------------------------*/
.medical_student_show,
.trainee_show {
    display: none;
}

body.medical_student .medical_student_show,
body.trainee .trainee_show {
    display: initial;
}

body.medical_student .medical_student_hide,
body.trainee .trainee_hide {
    display: none;
}

.payment_method_descriptions,
.payment_frequency_descriptions {
    font-size: 0.9em;
    line-height: 1.4em;
}

/*---------------------------------------------------------------*/

.gift_aid {
    margin: 20px 0px 30px 0px;
    padding: 14px;
    background-color: #F5F5F7;
    border: 1px solid #CCCCCC;
}

    .gift_aid img {
        float: right;
        margin-left: 30px;
        width: 200px;
    }

@media screen and (max-width: 767px) {

    .gift_aid img {
        display: block;
        float: none;
        margin-left: 0px;
        margin-bottom: 14px;
    }
}

/*---------------------------------------------------------------*/

/*.certificate_btn,*/
.alert_btn {
    display: block;
    margin-bottom: 15px;
    padding: 7px 10px;
    color: #FFFFFF !important;
    text-align: center;
    border-radius: 5px;
    transition: background-color 0.3s ease;
    -moz-transition: background-color 0.3s ease;
    -webkit-transition: background-color 0.3s ease;
    -ms-transition: background-color 0.3s ease;
    -o-transition: background-color 0.3s ease;
}

/*.certificate_btn {
    background-color: #2AB8AA;
}

    .certificate_btn:hover {
        background-color: #0A988A;
    }*/

.alert_btn {
    background-color: #CE2029;
}

    .alert_btn:hover {
        background-color: #AE0009;
    }

@media screen and (max-width: 991px) {
    .alert_btn {
        margin-top: 20px;
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {

    .alert_btn {
        display: inline-block;
    }
}

/*---------------------------------------------------------------*/

.page_mybaus .banner_container > div {
    background-image: url('../images/mybaus_banner.jpg');
    background-repeat: no-repeat;
    background-position: right center;
}

.page_mybaus .banner_description h3 {
    margin: 10px 0px;
    color: #DDDDDD;
}

.page_mybaus .banner_description p {
    margin: 0px;
    font-size: 0.95em;
}

.page_mybaus .banner_description a {
    color: #FFFFFF;
}

.page_mybaus .banner_description .badge {
    display: inline-block;
    margin-left: 10px;
    padding: 3px 7px;
    color: #FFFFFF;
    font-weight: normal;
    font-size: 12px;
    line-height: 1em;
    background-color: #8B1B29;
    vertical-align: baseline;
    border-radius: 10px;
}


.page_mybaus h1.page_title {
    display: none;
}

.page_mybaus h2.section_title {
    padding-bottom: 6px;
    color: #5D99C0;
    font-size: 2em;
    border-bottom: 1px solid #DDDDDD;
}

@media screen and (max-width: 767px) {

    .page_mybaus .banner_container > div {
        background-image: none;
    }

    .page_banner .banner_description {
        padding-right: 0px !important;
    }

        .page_banner .banner_description p.push_right {
            float: none;
            margin-top: 5px;
        }

    .page_mybaus h1 > i.fa {
        display: none;
    }

    .page_mybaus .collapsed_section {
        margin-bottom: 10px;
    }

    .page_mybaus .inline_item {
        margin-bottom: 20px;
    }
}

/*---------------------------------------------------------------*/

.page_profile .banner_description p {
    margin: 10px 0px;
    font-size: 0.95em;
}

.membership_number {
    padding: 6px 15px;
    width: fit-content;
    margin: 5px auto;
    color: #FFFFFF;
    border-radius: 25px;
    background-color: var(--green);
}

/*---------------------------------------------------------------*/

/*#region -- Subscription Page */

.page_subscription .payment_result,
.page_payment_history .payment_result {
    margin: 20px 0px;
    padding: 14px;
    background-color: #EEEEEE;
    border: 1px solid #CCCCCC;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px;
}

    .page_subscription .payment_result p:last-child,
    .page_payment_history .payment_result p:last-child {
        margin-bottom: 0px;
    }

.page_subscription .membership_status {
    margin: 20px 0px;
    padding: 15px;
    color: #FFFFFF;
    font-size: 1.2em;
    line-height: 1.3em;
    border-radius: var(--border-radius);
}

    .page_subscription .membership_status strong {
        white-space: nowrap;
    }

.page_subscription .membership_active {
    background-color: var(--green);
}

.page_subscription .membership_pending_cancellation {
    background-color: var(--blue-dark);
}

.page_subscription .membership_expiring {
    background-color: #F0AD4E;
}

.page_subscription .membership_overdue {
    background-color: #D9534F;
}

.page_subscription .membership_suspended {
    background-color: #CA2824;
}

.page_subscription .membership_ended {
    background-color: #4E90AF;
}

.page_subscription .membership_terminated {
    background-color: #222222;
}

.page_subscription .gift_aid {
    margin-top: 40px;
}

/*#endregion*/

/*---------------------------------------------------------------*/

/*#region -- Newsletter Page*/

/*#endregion*/
/*---------------------------------------------------------------*/
.latest_newsletter {
    background-position: right center;
    background-repeat: no-repeat;
    background-size: 80px auto;
    padding-right: 80px;
}

/*---------------------------------------------------------------*/
