@font-face {
    font-family: 'FontAwesome';
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url("../lib/font-awesome/webfonts/fa-solid-900.eot");
    src: url("../lib/font-awesome/webfonts/fa-solid-900.eot?#iefix") format("embedded-opentype"), url("../lib/font-awesome/webfonts/fa-solid-900.woff2") format("woff2"), url("../lib/font-awesome/webfonts/fa-solid-900.woff") format("woff"), url("../lib/font-awesome/webfonts/fa-solid-900.ttf") format("truetype"), url("../lib/font-awesome/webfonts/fa-solid-900.svg#fontawesome") format("svg");
}

.notificationFromUserFrame {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    text-align: center;
    margin-top: .5rem !important;
    justify-content: center !important;
}

    .notificationFromUserFrame img {
        width: 50px;
        height: 50px;
        border-radius: 50%;
    }

.notificationHandShakeFrame {
    display: flex;
    background-color: #39c4e6;
    width: 50px;
    height: 50px;
    line-height: 50px;
    border-radius: 50%;
    text-align: center;
    margin-top: .5rem !important;
    justify-content: center !important;
}

    .notificationHandShakeFrame i:before {
        color: #fff !important;
        align-self: center !important;
        font-size: 2em;
        font-family: 'FontAwesome';
        font-style: normal;
        font-weight: 900;
        content: "\f2b5" !important;
    }

.notificationHoldingUsdFrame {
    display: flex;
    background-color: #006da8;
    width: 50px;
    height: 50px;
    line-height: 50px;
    border-radius: 50%;
    text-align: center;
    margin-top: .5rem !important;
    justify-content: center !important;
}

    .notificationHoldingUsdFrame i:before {
        color: #fff !important;
        align-self: center !important;
        font-size: 2em;
        font-family: 'FontAwesome';
        font-style: normal;
        font-weight: 900;
        content: "\f4c0" !important;
    }

.notificationCalendarFrame {
    display: flex;
    background-color: #e6b239;
    width: 50px;
    height: 50px;
    line-height: 50px;
    border-radius: 50%;
    text-align: center;
    margin-top: .5rem !important;
    justify-content: center !important;
}

    .notificationCalendarFrame i:before {
        color: #fff !important;
        align-self: center !important;
        font-size: 2em;
        font-family: 'FontAwesome';
        font-style: normal;
        font-weight: 900;
        content: "\f073" !important;
    }

/*#region All notifications*/
.notificationFromUserFrame-small {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    text-align: center;
    justify-content: center !important;
}

    .notificationFromUserFrame-small img {
        width: 30px;
        height: 30px;
        border-radius: 50%;
    }

.notificationHandShakeFrame-small {
    display: flex;
    background-color: #39c4e6;
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-radius: 50%;
    text-align: center;
    justify-content: center !important;
}

    .notificationHandShakeFrame-small i:before {
        color: #fff !important;
        align-self: center !important;
        font-family: 'FontAwesome';
        font-style: normal;
        font-weight: 900;
        content: "\f2b5" !important;
    }

.notificationHoldingUsdFrame-small {
    display: flex;
    background-color: #006da8;
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-radius: 50%;
    text-align: center;
    justify-content: center !important;
}

    .notificationHoldingUsdFrame-small i:before {
        color: #fff !important;
        align-self: center !important;
        font-family: 'FontAwesome';
        font-style: normal;
        font-weight: 900;
        content: "\f4c0" !important;
    }

.notificationCalendarFrame-small {
    display: flex;
    background-color: #e6b239;
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-radius: 50%;
    text-align: center;
    justify-content: center !important;
}

    .notificationCalendarFrame-small i:before {
        color: #fff !important;
        align-self: center !important;
        font-family: 'FontAwesome';
        font-style: normal;
        font-weight: 900;
        content: "\f073" !important;
    }

.line-height-30 {
    line-height: 30px;
}
/*#endregion*/
.ikrNotifications .ikrSeeAll {
    padding: 8px;
    border-top: solid 1px rgba(100,100,100,.3);
    text-align: center;
}

    .ikrNotifications .ikrSeeAll a {
        color: #39c4e6;
    }

.ikrNoti_Button {
    cursor: pointer;
}


::-webkit-scrollbar {
    width: 3px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1
}

::-webkit-scrollbar-thumb {
    background: #888
}

    ::-webkit-scrollbar-thumb:hover {
        background: #555
    }