.pn {
  text-align: center;
}

.pn-button {
  border: 1px $border-color solid;
  background-color: $bg;
  color: $fg;
  display: block;
  font-size: 14px;
  text-align: center;
  cursor: pointer;
  padding: 7px 12px;
  float: left;
  transition: 0.075s border-color linear, 0.075s background-color linear, 0.075s color linear;
}
.pn-button:hover,
.pn-button:active {
  border-color: $pn-button-border;
  box-shadow: 0 1px 1px $pn-button-shadow;
}
.pn-button:active {
  background-color: $pn-button-active;
}

.pn-button.is-page,
.pn-button-sep {
  margin-right: -1px;
  position: relative;
}
a.pn-button.is-page {
  text-decoration: none;
}
.pn-button.is-page-cur {
  color: $pn-button-current-text-color;
  background-color: $pn-button-current;
  border-color: $pn-button-border;
  z-index: 6;
}
.pn-button.is-page:hover {
  z-index: 5;
}
.pn-button.is-page:first-child {
  border-radius: 3px 0 0 3px;
}
.pn-button.is-page:last-child {
  border-radius: 0 3px 3px 0;
}

.pn-count {
  float: right;
  color: $grey;
  font-size: 14px;
  padding: 8px 0;
}


.pn.no-nav.no-results {
  display: none;
}
.pn.no-nav > .pn-show-more {
  display: none;
}
.pn.no-nav > .pn-buttons > div:not(.pn-count) {
  display: none;
}
.pn.no-nav .pn-count {
  float: none;
  text-align: center;
}
.pn-buttons {
  padding-top: $base-padding;
  display: inline-block;
}

.pn-button-sep {
  font-size: 14px;
  float: left;
  width: 5px;
  border: 1px $pn-button-separator-border solid;
  background: $pn-button-separator-background;
  padding: 7px 1px;
}