﻿.pagination-container {
    text-align: center;
}

.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
}

    .pagination > li {
        display: inline-block;
        margin: 0 4px;
    }

        .pagination > li > a,
        .pagination > li > span {
            display: inline-flex;
            justify-content: center;
            align-items: center;
            width: 32px;
            height: 32px;
            text-decoration: none;
            background-color: #fff;
            border: 1px solid #ddd;
            border-radius: 50%;
        }

            .pagination > li > a:hover,
            .pagination > li > span:hover,
            .pagination > li > a:focus,
            .pagination > li > span:focus {
                background-color: #eee;
            }

    .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;
        cursor: default;
        background-color: #428bca;
        border-color: #428bca;
    }

    .pagination > .disabled > span,
    .pagination > .disabled > a,
    .pagination > .disabled > a:hover,
    .pagination > .disabled > a:focus {
        color: #999;
        cursor: not-allowed;
        background-color: #fff;
        border-color: #ddd;
    }
