.pagination
  ///////////////////////////////////////////////////////////////////////////////////
  $base-border-color: gainsboro !default
  $base-border-radius: 3px !default
  $base-spacing: 1.5em !default
  $base-accent-color: #477DCA !default
  $base-link-color: $base-accent-color !default
  $dark-gray: #333 !default
  $large-screen: em(860) !default
  $base-font-color: $dark-gray !default
  ul
    margin: 0
    padding: 0
  li
    list-style: none
  a
    text-decoration: none
  //////////////////////////////////////////////////////////////////////////////////
  $pagination-border-color: $base-border-color
  $pagination-border: 1px solid $pagination-border-color
  $pagination-background: lighten($pagination-border-color, 10)
  $pagination-hover-background: lighten($pagination-background, 5)
  $pagination-color: $base-font-color
  text-align: center
  ul
    display: inline
    text-align: center
    li
      display: inline
    ul li
      display: none
      &:nth-child(1),
      &:nth-child(2),
      &:nth-child(3)
        display: inline
      +media($large-screen)
        display: inline
    li a
      +transition(all 0.2s ease-in-out)
      background: $pagination-background
      border-radius: $base-border-radius
      border: $pagination-border
      color: $pagination-color
      outline: none
      padding: ($base-spacing / 4) ($gutter / 2)
      &:hover,
      &:focus
        background: $pagination-hover-background
        color: $base-link-color
      &:active
        background: $pagination-background