.pagination-wrapper { text-align: center; font-size: 1.1rem; position: relative; }
.pagination-wrapper.pagination-top { margin-bottom: 60px; }
.pagination-wrapper.pagination-bottom { margin-top: 60px; margin-bottom: 60px; }
.pagination-wrapper > .pagination-content { background-color: #FFF; position: relative; z-index: 7; padding: 0 20px; display: inline; }
.pagination-pages { padding-left: 13px; display: inline-block; }
.pagination-pages > * { display: inline-block; padding: 0 15px; }
.pagination-pages > *.active { background-color: var(--secondary-color); padding: 5px 11px; color: #FFF; border-radius: 50%; }
.pagination-pages > *.active, .pagination-pages > *.disabled { pointer-events: none; }
.pagination-pages a { color: var(--text-color); transition: .3s ease-in-out; }
.pagination-pages > *.active:last-child {border-radius:50px; }
.pagination-pages > *.active:not(:last-child) {clip-path: circle(50%); padding: 5px 7px;}

@media (pointer:fine) {
    .pagination-pages a:hover { color: var(--secondary-color); }
}

@media (max-width:767px) {
    .pagination-elements { margin-bottom: 15px; display: inline-block; }
    .pagination-pages { padding-left: 0; width: 100%; }
}

@media (max-width:600px) {
    .pagination-wrapper > .pagination-content { padding: 0 }
    .pagination-wrapper { text-align: left; }
    .pagination-wrapper:before { display: none; }
    .pagination-wrapper > .pagination-content > * { display: block; text-align: center; }
    .pagination-wrapper .pagination-elements { margin-bottom: 10px; }
    .pagination-wrapper .pagination-pages { padding-left: 0; }
}

@media (max-width:480px) {
    .pagination-pages > *:last-child {margin-top:10px;}
}