/* Pagination & pager */

.pager li > a, 
.pager li > span,
.pagination > li > a {
    border-color: #e2e7eb;
    color: #242a30;
}
.pager.pager-without-border li > a, 
.pager.pager-without-border li > span,
.pagination.pagination-without-border > li > a {
    border-color: #fff;
}
.pagination > .disabled > span, 
.pagination > .disabled > span:hover, 
.pagination > .disabled > span:focus, 
.pagination > .disabled > a, 
.pagination > .disabled > a:hover, 
.pagination > .disabled > a:focus,
.pager > .disabled > span,
.pager > .disabled > a {
    .opacity(0.6);
    border-color: #ddd;
}
.pagination > li > a {
    color: #242a30;
    margin-left: 5px;
    .border-radius(3px) !important;
}
.pagination > li:first-child > a {
    margin-left: 0;
}
.pagination-sm > li > a, 
.pagination-sm > li > span {
    font-size: 10px;
    margin-left: 4px;
}
.pagination-lg > li > a, 
.pagination-lg > li > span {
    font-size: 14px;
    margin-left: 6px;
}
.pager li > a:hover, 
.pager li > a:focus, 
.pager li > span:hover,
.pager li > span:focus,
.pagination > li > a:hover,
.pagination > li > a:focus {
    color: #242a30;
    background: #e2e7eb;
    border-color: #d8dde1;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover, 
.pagination > .active > span:hover, 
.pagination > .active > a:focus, 
.pagination > .active > span:focus {
    background: #242a30 !important;
    border-color: #242a30 !important;
}
.pagination-container {
    margin: 40px 0 0;
    border-top: 2px solid #ddd;
    padding-top: 40px;
}
.pagination {
    & > li {
        & > a,
        & > span {
            border: 2px solid #ddd;
            color: #333;
            padding: 5px 11px;
            .border-radius(50px) !important;
        }
        & > a:hover,
        & > a:focus {
            color: #333;
        }
        & + li a,
        & + li span {
            margin-left: 5px;
        }
        &.active > a,
        &.active > a:hover,
        &.active > a:focus {
            background: #333;
            border-color: #333;
        }
    }
    
    & .text {
        border: none;
        padding-left: 5px;
        padding-right: 5px;
        
        &:hover,
        &:focus {
            background: none;
        }
    }
}