.pagination-container {
    --item-size: 35;
    --half-size: var(--item-size) / 2;
    --item-medium-size: 35;
    --half-medium-size: var(--item-medium-size) / 2;
    --quater-medium-size: var(--item-medium-size) / 4;
    --pagination-bg: transparent;
    --pagination-color: #920035;
    --pagination-active-bg: #6C1011;
    --pagination-active-color: #fff;
}

.pagination-container {
    text-align: left;
    display: flex;
}

.pagination-container .pagination {
    display: inline-block;
    font-size: 0;
    margin: 16px 0 16px auto;
    padding: 0;
}

.pagination-container .pagination .item {
    display: inline-block;
    font-size: calc(var(--half-size) * 1px);
    height: calc(var(--item-size) * 1px);
    line-height: calc(var(--item-size) * 1px);
    margin: 2px;
    min-width: calc(var(--item-size) * 1px);
    padding: 0;
    text-align: center;
    vertical-align: top;
}

@media screen and (min-width: 460px) {
    .pagination-container .pagination .item {
        font-size: calc(var(--half-medium-size) * 1px);
        height: calc((var(--item-medium-size) + 10) * 1px);
        line-height: calc((var(--item-medium-size) + 10) * 1px);
        margin: 4px;
        min-width: calc(var(--item-medium-size) * 1px);
    }
}

.pagination-container .pagination .item a:before,
.pagination-container .pagination .item a:after {
    content: none;
}

.pagination-container .pagination .item a,
.pagination-container .pagination .item .button-wrapper {
    background: var(--pagination-bg);
    border: 1px solid #E6E6E6;
    color: var(--pagination-color);
    cursor: pointer;
    display: block;
    font-size: calc(var(--half-size) * 1px);
    font-weight: 300;
    height: 100%;
    line-height: calc(var(--item-size) * 1px);
    margin: 0;
    width: 100%;
    border-radius: 4px;
}

@media screen and (min-width: 460px) {
    .pagination-container .pagination .item a,
    .pagination-container .pagination .item .button-wrapper {
        font-size: calc(var(--half-medium-size) * 1px);
        line-height: calc((var(--item-size) + 10) * 1px);
    }
}

.pagination-container .pagination .item.active {
    position: relative;
}

.pagination-container .pagination .item.active a,
.pagination-container .pagination .item.active .button-wrapper {
    background: var(--pagination-active-bg);
    color: var(--pagination-active-color);
    position: relative;
    z-index: 1;
}

.pagination-container .pagination.disabled {
    opacity: 0.75;
    pointer-events: none;
}

.pagination-container .pagination.disabled.item.prev .material-icons,
.pagination-container .pagination.disabled.item.next .material-icons {
    color: #898989;
}

.pagination-container .pagination.disabled.item.active {
    border-color: #898989;
}