.pagination {
    display: inline-flex;
    list-style: none;
    justify-content: center;
    box-shadow: 0 1px 5px 0 fade(#444, 80%);
    background: #333;
    color: #fff;
    font-size: 1.2em;
    margin: 2px;

    &__option {
        transition: box-shadow .2s, background-color .2s;

        &:not(&--disabled):hover {
            background-color: #444;
            box-shadow: 0 1px 5px 0 fade(#555, 80%);
        }

        &--active,
        &:active {
            background-color: #444;
        }

        &--disabled {
            opacity: .5;
        }
    }

    &__separator {
        width: 1px;
        background-color: #444;
    }

    &__link {
        display: flex;
        justify-content: center;
        align-items: center;
        cursor: pointer;
        color: inherit;
        text-decoration: none;
        min-width: 40px;
        min-height: 40px;

        &--first,
        &--last,
        &--prev,
        &--next {
            font-size: 2em;
        }
    }
}