.pagination {
    display: block;
    margin: 30px 0 0;
    text-align: center;
}

.pagination > li {
    display: inline-block;
    line-height: 30px;
    min-width: 32px;
    text-align: center;
    vertical-align: top;
    border: 1px solid #DEDFE6;
    border-radius: 8px;
    color: #39435A;
    margin: 0 4px;
}

.pagination > li > a, .pagination > li > span {
    display: block;
    width: 100%;
    position: relative;
    float: left;
    text-decoration: none;
    line-height: 30px;
    color: #39435A;
    border-radius: 8px;
}

.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
    color: #4282FF;
    border-color: #4282FF;
    cursor: pointer;
}
.pagination > li:hover {
    cursor: pointer;
    color: #4282FF;
}

.pagination > .active, .pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    z-index: 2;
    color: #fff;
    background-color: #4282FF;
    border-color: #4282FF;
    cursor: default;
}
.pagination > .active:hover {
    z-index: 2;
    color: #fff;
    background-color: #4282FF;
    cursor: default;
}

.pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus {
    color: #B4B8C1;
    background-color: #fff;
    border-color: #EDEEF2;
    cursor: not-allowed;
}