/*
 * Chapter nav
 */

.book-nav {
  position: fixed;
  top: 40px - 8px;
  left: 40px;
  z-index: 5;

  height: 32px;
  line-height: 32px;

  transform: translate3d(0, 0, 0);

  @include ms-respond(font-size, -1);
}

.chapter-nav {
  position: fixed;
  z-index: 5;
  top: 40px + 300px + 16px;
  left: 40px + 32px - 8px;
  height: 32px;
  line-height: 32px;
  text-align: right;
  width: 300px;
  @include ms-respond(font-size, -1);

  transform-origin: 0 100%;
  transform: rotate(270deg);

  a, a:visited, strong {
    margin-right: .5em;
    color: $blacker;
    font-weight: bold;
    text-decoration: none;
  }

  a:hover,
  a:focus {
    color: $blue;
  }

  a, strong, span {
    position: relative;
    top: 2px;
  }

  span::before {
    content: '/';
    margin-right: .5em;
  }

  span {
    color: $gray;
    opacity: .5;
  }
}

.nav-button {
  display: inline-block;
  vertical-align: middle;

  &:before {
    @include ion-icon('navicon');
    font-size: 32px;
    color: $blue;
  }
}

@media (max-width: 768px) {
  .chapter-nav,
  .book-nav {
    display: none;
  }
}
