.pagination-wrapper {
    text-align: center;
}

.pagination > li > a, .pagination > li > span {
    color: #717171;
}

.pagination-wrapper .pagination > li > a:hover,
.pagination-wrapper .pagination > li > span:hover,
.pagination-wrapper .pagination > li > a:focus,
.pagination-wrapper .pagination > li > span:focus {
    color: #717171;
}

.pagination-wrapper .pagination > li > a, .pagination > li > span {
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    color: #fff;
    background: #252525;
    border-color: #252525;
}

.pagination-wrapper .pagination > li.first i {
    margin-right: 5px;
}

.pagination-wrapper .pagination > li.last i {
    margin-left: 5px;
}

.pagination-wrapper .pagination .first-page-label,
.pagination-wrapper .pagination .last-page-label {
    color: #717171;
}

@media screen and (max-width: 550px) {
    .pagination {
        display: flex;
        justify-content: center;
    }

    .pagination li{
        display: block;
    }

    .pagination-wrapper .pagination > li.first > a > i {
        margin-right: 0;
    }

    .pagination-wrapper .pagination > li.last > a > i {
        margin-left: 0;
    }

    .pagination-wrapper .pagination .first-page-label,
    .pagination-wrapper .pagination .last-page-label {
        display: none;
    }

    .pagination-wrapper .pagination > li.prev,
    .pagination-wrapper .pagination > li.next {
        display: none;
    }

    .pagination-wrapper .pagination > li.first i{
        margin: 0;
    }

    .pagination > li > a, .pagination > li > span{
        padding: 6px 14px;
    }
}

@media (max-width: 350px) {
    .pagination > li > a, .pagination > li > span{
        padding: 6px 12px;
    }
}