@import "common.css";
@import "footer.css";
@import "header.css";


/* ==membership grade== */
.membership_Grades_items {
    background: var(--navy-blue);
    height    : 100%;
}

.membership_Grades_items .grades_header h2 {
    padding      : 6.3rem 5.8rem 0 5.8rem;
    margin-bottom: 10.1rem;
}

.grades_header h2 {
    font-size  : 4.5rem;
    line-height: 4.8rem;
    font-weight: 700;
    color      : var(--light-gold);
}

.grade_body .nav-tabs {
    position     : relative;
    border       : none;
    border-bottom: 1px solid rgba(255, 255, 255, .5);
    padding      : 0 5.8rem;
}

.grade_body .tab-content {
    padding: 4.2rem 5.8rem 6.3rem;
    color  : var(--white);
}

.grade_body .nav-tabs li:not(:last-child) {
    margin-right: 5rem;
}

.grade_body .nav-tabs a {
    font-family   : 'Roboto Condensed', sans-serif;
    font-size     : 1.8rem;
    line-height   : 2.1rem;
    font-weight   : 400;
    color         : var(--white);
    text-transform: capitalize;
    background    : none;
    outline       : none;
    padding-bottom: 1.7rem;
    position      : relative;
}

.grade_body .nav-tabs a.active {
    font-weight: 700;
}

.grade_body .nav-tabs a.active::before {
    content   : '';
    position  : absolute;
    bottom    : -1px;
    left      : 0;
    width     : 100%;
    height    : 2px;
    background: var(--light-gold);
}

/* ==membersip benifits== */
.membership_benefit_items p>span {
    text-transform: uppercase;
    color         : var(--light-gold);
}

/* ==membership fees== */
.membership_fees {
    background-image   : url(../images/membership/mf-background.png);
    background-position: center center;
    background-size    : cover;
    background-repeat  : no-repeat;
    padding            : 7.2rem 0;
}

.membership_fees_header .grades_header h2 {
    display       : inline-block;
    border-bottom : 2px solid var(--light-gold);
    padding-bottom: .5rem;
    margin-bottom : 3.8rem;
}

.membership_fees_header p {
    font-family  : 'Roboto Condensed', sans-serif;
    color        : var(--white);
    line-height  : 2.1rem;
    margin-bottom: 6.2rem;
}

.membership_fees .list_with_icon li.description p,
.membership_fees .btn_box_wrapper>a.btn_more {
    color: var(--white);
}

.membership_fees .list_items_with_btn_box {
    height: calc(100% - 17.6rem);
}

.membership_fees .membership_benefit_items .btn_box {
    margin-right: 4.2rem;
}

.membership_fees_card {
    background: var(--white);
    padding   : 1.8rem 2.8rem 3.4rem;
    text-align: center;
}

.membership_fees_card .card_body .registration_fee {
    padding: 2.2rem 0 4.8rem;
}

.membership_fees_card .card_body .registration_fee>h6 {
    margin-top: .9rem;
}

.membership_fees_card .card_body h5 {
    font-size     : 1.8rem;
    line-height   : 2.1rem;
    font-weight   : 700;
    text-align    : center;
    padding-bottom: .9rem;
    border-bottom : 1px solid var(--off-white);
}

.membership_fees_card .card_body h6 {
    font-size    : 1.4rem;
    line-height  : 1.6rem;
    margin-bottom: .5rem;
}

.membership_fees_card .card_body .annual_charge {
    margin-bottom: 5.7rem;
}

.membership_fees_card .card_body .charge_list {
    padding      : .9rem 0;
    border-bottom: 1px solid var(--off-white);
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
    .membership_Grades .container {
        padding-left: 0;
        padding-right: 0;
    }
    .membership_Grades .sc_tittle_wrapper {
        padding-left: 2.4rem;
        padding-right: 2.4rem;
    }
    .membership_Grades_items .grades_header h2 {
        font-size    : 30px;
        padding      : 28px;
        margin-bottom: 0;
    }

    .grade_body .nav-tabs {
        padding: 0 28px;
    }

    .grade_body .nav-tabs li {
        width        : 50%;
        margin-right : 0 !important;
        text-align   : center;
        margin-bottom: 20px;
    }

    .grade_body .nav-tabs a {
        padding-bottom: 0;
    }

    .grade_body .tab-content {
        padding: 28px;
    }

    .left_right_content .sc_title_wrapper.border_bottom {
        margin-bottom: 40px;
    }

    .membership_fees .membership_benefit_items .btn_box {
        margin-bottom: 25px;
    }

    .membership_fees_card {
        margin-bottom: 25px;
    }
    .membership_fees_card .card_body .registration_fee {
        padding: 2.2rem 0 2.8rem;
    }
    .membership_fees_card .card_body .annual_charge {
        margin-bottom: 3.8rem;
    }
    .membership_fees_card .card_body h5 {
        font-size: 1.6rem;
        line-height: 2.2rem;
    }
    .membership_fees_card .card_body h6 {
        font-size: 1.2rem;
        line-height: 1.6rem;
    }
}