/*

Pagination

Super lightweight (HTML-wise) blog pagination. Should only be visible
when there is navigation available -- single buttons at top or bottom
of each page.

*/

.pagination {

color: $gray-3;
margin-bottom: $section-spacing;
text-align: center;

> a {
  background: $body-bg;
  border: solid $border-color;
  border-radius: $border-radius;
  border-width: 1px;
  box-shadow: $default-box-shadow;
  display: inline-block;
  max-width: $sidebar-width;
  padding: $padding-v $padding-h;
  width: 60%;
}

> a:hover {
  background-color: $border-color;
}

}

// Bottom -> margin-top;

}

// Push above header if newer on mobile .content .pagination:first-child {

margin-top: -$section-spacing * 2;

}

// Make room for larger header by extending margin below title .index sidebar {

padding-bottom: calc(#{$section-spacing} + #{$padding-v});

}

// But not on page1 .home.index sidebar {

padding-bottom: $section-spacing;

}

// Undo for larger screens @media (min-width: $large-breakpoint) {

.pagination > a {
  box-shadow: none;

  &:hover { box-shadow: $default-box-shadow; }
}

.content .pagination:first-child {
  margin-top: 0;

  + * {
    border-top: 1px solid $border-color;
    margin-top: $section-spacing;
    padding-top: $section-spacing;
  }
}

.index #sidebar {
  padding-bottom: $section-spacing;
}

}