.notifications-container {
    width: 450px;
    padding: 20px 0;
}

.notifications-container > div:first-child {
    padding-bottom: 22px;
}

.notifications-container ul {
    max-height: 100%;
    overflow: auto;
}

.notifications-container ul:after {
    content: '';
    height: 50px;
    width: 100%;
    position: relative;
    display: flex;
}

.notifications-container li {
    border-bottom: 1px solid var(--mercury);
    cursor: pointer;
}

.notifications-container li:hover span {
    text-decoration: underline;
}

.notifications-container li:nth-child(even) {
    background: var(--froth);
}

.notifications-container li.new-notify {
    color: var(--orange);
}

.notifications-container li:before {
    padding-right: 10px;
    content: 'check_circle';
}

.notifications-container li.new-notify:before {
    content: 'error_outline';
}

.notifications-container li.none-notify:before {
    content: 'notifications_off';
}