﻿ul.pagination li {
    margin-left: 5px;
    margin-right: 5px
}

    ul.pagination li:first-child {
        margin-right: 0
    }

    ul.pagination li:last-child {
        margin-left: 0
    }

    ul.pagination li a {
        font-size: 17px;
        color: var(--l-color-heading);
        width: 50px;
        height: 50px;
        line-height: 50px;
        border: 1px solid var(--bg-dark-color);
        background-color: var(--bg-dark-color);
        display: inline-block;
        border-radius: 50%;
        text-align: center;
        -webkit-transition: .5s;
        transition: .5s;
        display: inline-flex;
        justify-content: center;
        align-items: center;
    }

        ul.pagination li a:hover, ul.pagination li.active a {
            background-color: var(--color-primary);
            border-color: var(--color-primary);
            color: var(--l-color-heading)
        }

        ul.pagination li a:focus {
            outline: 0;
            outline-offset: unset
        }

    ul.pagination li.disabled a, ul.pagination li.disabled a:hover {
        cursor: no-drop;
        background: var(--bg-dark-color-1);
        color: var(--l-color-heading);
        border: 1px solid var(--bg-dark-color);
    }

    ul.pagination li.pagination-first a::after {
        content: "";
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" width="40" height="40" x="0" y="0" viewBox="0 0 612.02 612.02" style="enable-background:new 0 0 512 512" xml:space="preserve" class=""><g><path d="M596.96 269.674 342.381 15.094c-20.079-20.079-52.644-20.079-72.723 0s-20.079 52.644 0 72.723L487.852 306.01 269.658 524.202c-20.079 20.079-20.079 52.644 0 72.723s52.644 20.079 72.723 0L596.96 342.346c20.079-20.029 20.079-52.593 0-72.672zm-306.102-15.416L88.744 41.238c-20.309-21.378-53.204-21.378-73.513 0s-20.309 56.058 0 77.462l165.371 174.289L15.231 467.278c-20.309 21.379-20.309 56.083 0 77.462s53.204 21.379 73.513 0l202.114-213.02c20.309-21.378 20.309-56.058 0-77.462z" fill="%23DBDBDB" data-original="%23000000" class="" opacity="1"></path></g></svg>');
        width: 16px;
        height: 16px;
        background-size: cover;
        position: absolute;
        display: inline-flex;
        justify-content: center;
        align-items: center;
    }

    ul.pagination li.pagination-prev a::after {
        content: "";
        width: 16px;
        height: 16px;
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" width="40" height="40" x="0" y="0" viewBox="0 0 792.049 792.049" style="enable-background:new 0 0 512 512" xml:space="preserve"><g><path d="M622.955 342.127 268.424 20.521c-27.36-27.36-71.677-27.36-99.037 0s-27.36 71.676 0 99.037l304.749 276.468-304.749 276.466c-27.36 27.359-27.36 71.676 0 99.036s71.677 27.36 99.037 0l354.531-321.606c14.783-14.783 21.302-34.538 20.084-53.897 1.186-19.36-5.301-39.114-20.084-53.898z" fill="%23DBDBDB" data-original="%23000000" opacity="1"></path></g></svg>');
        background-size: cover;
        position: absolute;
        display: inline-flex;
        justify-content: center;
        align-items: center;
    }

    ul.pagination li.pagination-next a::after {
        content: "";
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" width="40" height="40" x="0" y="0" viewBox="0 0 792.082 792.082" style="enable-background:new 0 0 512 512" xml:space="preserve" class=""><g><path d="m317.896 396.024 304.749-276.467c27.36-27.36 27.36-71.677 0-99.037s-71.677-27.36-99.036 0L169.11 342.161c-14.783 14.783-21.302 34.538-20.084 53.897-1.218 19.359 5.301 39.114 20.084 53.897l354.531 321.606c27.36 27.36 71.677 27.36 99.037 0s27.36-71.677 0-99.036L317.896 396.024z" fill="%23DBDBDB" data-original="%23000000" opacity="1"></path></g></svg>');
        width: 16px;
        height: 16px;
        background-size: cover;
        position: absolute;
        display: inline-flex;
        justify-content: center;
        align-items: center;
    }

    ul.pagination li.pagination-last a::after {
        content: "";
        background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" width="40" height="40" x="0" y="0" viewBox="0 0 612 612" style="enable-background:new 0 0 512 512" xml:space="preserve"><g><path d="M124.172 305.975 342.365 87.781c20.079-20.079 20.079-52.644 0-72.722-20.079-20.079-52.644-20.079-72.723 0l-254.58 254.58c-20.079 20.079-20.079 52.644 0 72.723l254.58 254.58c20.079 20.078 52.644 20.078 72.723 0 20.079-20.079 20.079-52.644 0-72.723L124.172 305.975zm307.223-.281 165.371-165.982c20.308-20.359 20.308-53.408 0-73.768-20.309-20.359-53.204-20.359-73.513 0L321.139 268.823c-20.309 20.359-17.047 35.266 3.032 55.345L523.253 545.47c20.309 20.359 53.204 20.359 73.513 0 20.308-20.359 20.308-53.408 0-73.768L431.395 305.694z" fill="%23DBDBDB" data-original="%23000000" opacity="1"></path></g></svg>');
        width: 16px;
        height: 16px;
        background-size: cover;
        position: absolute;
        display: inline-flex;
        justify-content: center;
        align-items: center;
    }
ul.pagination {
    margin-bottom: 0;
    margin-top: 30px;
}
@media (max-width:767px) {
    ul .pagination li {
        margin-left: 2px;
        margin-right: 2px
    }

        ul.pagination li a {
            font-size: 12px; 
            width: 32px;
            height: 32px;
            line-height: 32px
        }
        ul.pagination li.pagination-first a::after,
        ul.pagination li.pagination-prev a::after,
        ul.pagination li.pagination-next a::after,
        ul.pagination li.pagination-last a::after {
            width: 14px;
            height: 14px;
        }
}
