.pagination {
    margin: 20px 0 0 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.pagination>li {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.pagination button {
    font-size: 16px;
    line-height: 19.71px;
    font-family: "signika_regular";
    color: var(--ro-grey);
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: background-color .3s;
    border: 2px solid var(--ro-grey);
    margin: 0 4px;
    height: 35px;
    width: 35px;
}

@media (min-width: 1024px) {
    .pagination button {
        height: 45px;
        width: 45px;
    }
}

.pagination button.active {
    background-color: var(--ro-orange);
    color: white;
    border: 2px solid var(--ro-orange);
}

.pagination button:hover:not(.active) {
    background-color: white;
    border: 2px solid var(--ro-blue);
    color: var(--ro-blue);
}

.pagination .prev,
.pagination .next {
    color: var(--ro-orange);
    border: 2px solid var(--ro-orange);
}

.pagination .prev.disabled,
.pagination .next.disabled {
    color: var(--ro-light-grey);
    border: 2px solid var(--ro-light-grey);
    pointer-events: none;
}