
.pagination {
    padding: 35px 0;
    border-radius: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center
}

.pagination ul {display: flex;}

@media (max-width: 991px) {
    .pagination {
        margin:0px 15px;
        padding: 15px 0
    }
}

@media (max-width: 575px) {
    .pagination ul,
    .pagination {
        justify-content:flex-start
    }
}

.pagination ul,
.pagination li {
    list-style-type: none;
}

.pagination li {
    position: relative
}

.pagination a.disabled {
    pointer-events: none;
    opacity: 0.3;
    text-decoration: none;
}

.pagination li a.current {
    pointer-events: none;
    cursor: text;
    text-decoration: none;
}

.pagination li a.current,.pagination li.current span {
    color: #000;
    border: 2px solid #000
}

.pagination .prev-page a,.pagination .prev-page span,
.pagination .next-page a,.pagination .next-page span,
.pagination li a,.pagination li span {
    width: 32px;
    flex: 0 0 32px;
    height: 32px;
    border: 2px solid transparent;
    transition: 0.2s ease-in-out;
    border-radius: 50%;
    margin: 0 1px;
    font-size: 13px;
    line-height: 32px;
    display: flex;
    align-items: center;
    color: #000;
    justify-content: center
}

.pagination .prev-page a,
.pagination .next-page a,
.pagination li a {
    text-decoration: underline;
}

.pagination li a:hover,.pagination li span:hover {
    color: #000;
    border: 2px solid #000
}

.pagination .prev-page, .pagination .next-page {
    display: flex;
    align-items: center
}

.pagination .prev-page a, .pagination .prev-page span, .pagination .next-page a, .pagination .next-page span {
    position: relative;
    transition: 0.2s ease-in-out;
    width: auto;
    height: auto;
    white-space: nowrap;
    gap: 5px;
    color: transparent;
}

@media (max-width: 767px) {
    .pagination .prev-page a,.pagination .prev-page span,.pagination .next-page a,.pagination .next-page span {
        white-space:unset
    }
}

.pagination .prev-page a:hover, .pagination .prev-page span:hover, .pagination .next-page a:hover, .pagination .next-page span:hover {
    opacity: 0.3;
    cursor: pointer;
    border: 2px solid transparent
}

.pagination .prev-page a:before, .pagination .prev-page span:before, .pagination .next-page a:before, .pagination .next-page span:before {
    content: '';
    width: 24px;
    flex: 0 0 24px;
    height: 24px;
    color: brown;
}

.pagination .prev-page a:after,.pagination .prev-page span:after,.pagination .next-page a:after,.pagination .next-page span:after {
    font-size: 13px;
    line-height: 16px;
    color: #000;
    white-space: nowrap;
    flex: 0 1 150px
}

@media (max-width: 767px) {
    .pagination .prev-page a:after,.pagination .prev-page span:after,.pagination .next-page a:after,.pagination .next-page span:after {
        display:none
    }
}

.pagination .prev-page {
    margin-right: auto
}

@media (max-width: 767px) {
    .pagination .prev-page {
        width:40px;
        height: 40px;
        margin-right: 0
    }

    .pagination .prev-page a,.pagination .prev-page span {
        color:transparent
    }
}

.pagination .prev-page a:before,.pagination .prev-page span:before {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    background-image: url("data:image/svg+xml,<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path fill='black' fill-rule='evenodd' clip-rule='evenodd' d='M11.6863 0.642944L0.327183 12.0021L11.6408 23.3158L13.055 21.9016L4.15044 12.9969L23.0022 12.9566L22.9979 10.9566L4.16078 10.9969L13.1005 2.05716L11.6863 0.642944Z'/></svg>");
}

.pagination .next-page {
    margin-left: auto
}

@media (max-width: 767px) {
    .pagination .next-page {
        width:40px;
        height: 40px;
        margin-left: 0
    }
}

.pagination .next-page a, .pagination .next-page span {
    margin-left: auto;
    flex-direction: row-reverse
}

@media (max-width: 767px) {
    .pagination .next-page a,.pagination .next-page span {
        width:40px;
        height: 40px;
        margin-left: 0;
        color: transparent
    }
}

.pagination .next-page a:before,.pagination .next-page span:before {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M12.3137%200.642944L23.6728%2012.0021L12.3592%2023.3158L10.945%2021.9016L19.8496%2012.9969L0.997803%2012.9566L1.00208%2010.9566L19.8392%2010.9969L10.8995%202.05716L12.3137%200.642944Z%22%20fill%3D%22black%22%2F%3E%3C%2Fsvg%3E")
}
