.b-referral-menu {
    display : flex;
    margin-top    : 30px;
    border-bottom : 1px solid #d7d7d7;
}

.b-referral-menu__link {
    font-family   : "museo-sans", sans-serif;
    font-size     : 18px;
    color         : #909090;
    padding       : 15px 30px;
    margin-bottom : -1px;
}

.b-referral-menu__link--active,
.b-referral-menu__link:hover {
    color         : #844ce6;
    border-bottom : 1px solid #844ce6;
}

.b-referral-tab {
    margin-top : 45px;
}

.b-ref-header {
    display     : flex;
    align-items : center;
    font-family : "museo-sans", sans-serif;
    font-size   : 18px;
    font-weight : 500;
    margin      : 0;
}

.b-ref-header--big {
    font-family : Rubik, sans-serif;
    font-size : 24px;
}

.b-ref-header__icon {
    margin-right : 15px;
}

.b-referral-level-widget {
    display     : flex;
    align-items : center;
}

.b-referral-level-widget__number {
    font-family  : "museo-sans", sans-serif;
    font-weight  : 700;
    font-size    : 30px;
    margin-right : 16px;
}

.b-referral-level-widget__title {
    color       : #676767;
    line-height : 23px;
}

.b-ref-start-level-blocks {
    display   : flex;
    max-width : 550px;
}


.b-ref-start-level-block {
    flex          : 1;
    height        : 44px;
    padding       : 22px 10px;
    background    : white;
    border        : 1px solid rgba(213, 213, 213, 1);
    border-radius : 2px;
    text-align    : center;
}

.b-ref-start-level-block:not(:first-child) {
    margin-left : 14px;
}

.b-ref-start-level-block__title {
    font-size : 12px;
    color     : #676767;
}

.b-ref-start-level-block__percent {
    font-family : "museo-sans", sans-serif;
    font-size   : 16px;
    font-weight : 700;
    margin-top  : 12px;
}

.b-ref-start-grey-text {
    color         : #676767;
    line-height   : 1.6;
    width         : 726px;
}