body{
    --ping--color: #000;
    --ping--bg:#0068cc;
    --ping--brd:#0068cc;

    --ping--hover--color: #FFF;
    --ping--hover--bg:#000;
    --ping--hover--brd:#ff343b;
}


.paging{
    margin-top: 35px;
    text-align: center;
}
.pagination li:last-child a {
    border-top-right-radius: .25rem;
    border-bottom-right-radius: .25rem;
}
.pagination li:first-child a {
    border-top-left-radius: .25rem;
    border-bottom-left-radius: .25rem;
}


.pagination li a {
    position: relative;
    display: block;
    color: var(--ping--color);
    text-decoration: none;
    background-color: var(--ping--bg);
    border: 1px solid var(--ping--brd) ;
    padding: .375rem .75rem;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.pagination li a:hover {
    color: var(--ping--hover--color);
    background-color: var(--ping--hover--bg);
    border: 1px solid var(--ping--hover--brd) ;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.pagination li .active {
    color: var(--ping--hover--color);
    background-color: var(--ping--hover--bg);
    border: 1px solid var(--ping--hover--brd) ;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}