.notifications_index {
    font-weight: 550;
    font-size: 14px;
    line-height: 16px;
    padding-top: 20px;
}

    .notifications_index .section__header {
        margin-bottom: 24px;
    }

        .notifications_index .section__header .notif_read-all {
            display: none;
        }

    .notifications_index .section__header_title {
        gap: 12px;
        cursor: pointer;
        transition: all .2s linear;
    }

        .notifications_index .section__header_title:hover {
            color: var(--main-color);
        }

    .notifications_index .tableRow {
        padding: 15px 0;
    }

    .notifications_index .tableHead .tableRow {
        cursor: unset;
        padding: 0;
    }

    .notifications_index .tableBody .tableRow {
        transition: all .2s linear;
    }

        .notifications_index .tableBody .tableRow:hover {
            background-color: #F5F5F5;
        }

    .notifications_index .tableCol.table__icon {
        flex: 0 0 20px;
        color: var(--main-color);
        display: flex;
        justify-content: center;
        margin-top: 3px;
    }

    .notifications_index .tableCol.table__date {
        flex: 0 0 130px;
    }

    .notifications_index .tableCol.table__event {
        flex: 0 0 1100px;
    }

    .notifications_index .tableCol.table__message {
        flex: 0 1 auto;
        margin-right: 8px;
    }

    .notifications_index .tableBody .tableCol span {
        color: var(--main-color);
    }

    .notifications_index .tableCol.table__icon2 {
        flex: 0 0 25px;
        color: var(--main-color);
        display: flex;
        justify-content: center;
        margin-left: auto;
        margin-top: 2px;
    }

    .notifications_index .tableCol:first-child i {
        font-size: 10px;
    }

    .notifications_index .tableCol:last-child i {
        font-size: 11px;
    }

    .notifications_index .tableRow.viewed,
    .notifications_index .tableRow.viewed span,
    .notifications_index .tableRow.viewed i {
        color: #939393 !important;
        transition: all .2s ease-in-out;
    }

        .notifications_index .tableRow.viewed:hover,
        .notifications_index .tableRow.viewed:hover span,
        .notifications_index .tableRow.viewed:hover i {
            color: var(--main-color) !important;
        }

    .notifications_index .tableBody .tableRow:hover {
        color: var(--main-color);
    }

    .notifications_index .tableBody .tableRow:nth-child(1n+12) {
        display: none;
    }

@media (max-width:1600px) {
    .notifications_index .tableCol.table__event {
        flex: 0 0 900px;
    }
}

@media (max-width:1500px) {
    .notifications_index .tableCol.table__event {
        flex: 0 0 800px;
    }
}

@media (max-width:1400px) {
    .notifications_index .tableCol.table__event {
        flex: 0 0 700px;
    }
}

@media (max-width:1300px) {
    .notifications_index .tableCol.table__event {
        flex: 0 0 500px;
    }
}

@media (max-width:1199px) {
    .notifications_index .tableHead {
        display: none;
    }

    .notifications_index .tableBody {
        border-top: 1px solid #F0F0F0;
    }

    .notifications_index .tableCol {
        font-size: 12px;
    }

        .notifications_index .tableCol:first-child i {
            font-size: 10px;
        }

        .notifications_index .tableCol.table__icon {
            justify-content: flex-start;
            flex: 0 0 auto;
            margin-right: 12px;
        }

        .notifications_index .tableCol.table__date {
            flex: 0 0 auto;
            margin-right: 12px;
        }

        .notifications_index .tableCol.table__event {
            flex: 0 0 400px;
            margin-right: 12px;
        }

    .notifications_index .table__pagination {
        display: none;
    }

    .tableBody {
        border-top: 1px solid #f0f0f0
    }

    .tableCol {
        font-size: 12px
    }

        .tableCol:first-child i {
            font-size: 10px
        }

        .tableCol.table__icon {
            justify-content: flex-start;
            flex: 0 0 auto;
            margin-right: 12px
        }

        .tableCol.table__date {
            flex: 0 0 auto;
            margin-right: 12px
        }

        .tableCol.table__event {
            flex: 0 0 700px;
            margin-right: 12px
        }
}

@media (max-width:700px) {
    .notifications_index .section__body .notif_read-all {
        display: none;
    }

    .notifications_index .section__header .notif_read-all {
        display: block;
    }

    .notifications_index .tableBody .tableRow:nth-child(1n+7) {
        display: none;
    }

    .notifications_index .tableCol.table__event {
        flex: 0 0 200px;
    }
}

@media (max-width:600px) {
    .notifications_index .tableCol.table__event {
        flex: 0 0 150px;
    }
}

    @media (max-width:430px) {
        .notifications_index .section__header {
            border-bottom: 0;
            padding: 0 20px;
        }

        .notifications_index .section__header_title {
            font-size: 18px;
            gap: 6px;
        }

        .notifications_index .notif_read-all i {
            font-size: 10px;
            margin-right: 3px;
        }

        .notifications_index .tableRow {
            flex-direction: column;
            position: relative;
        }

        .notifications_index .tableCol.table__event,
        .notifications_index .tableCol.table__icon,
        .notifications_index .tableCol.table__icon2 {
            display: none;
        }

        .notifications_index .tableCol.table__date {
            display: flex;
            gap: 16px;
            margin-bottom: 14px;
        }

        .notifications_index .tableCol.table__message {
            padding-right: 20px;
            margin-right: 0;
        }

            .notifications_index .tableCol.table__message i {
                position: absolute;
                right: 0;
                top: 50%;
                transform: translateY(-50%);
                color: var(--main-color)
            }

        .notifications_index .tableCol.table__event {
            flex: 0 0 auto;
        }
    }
