@import "../../../../styles/variables.less";

@progress-height: 9px;

.media-nav {
  background-color: @gray-lightest;

  .book-nav {
    display: -webkit-flex;
    display: flex;
    height: 75px;
    -webkit-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-justify-content: center;
    justify-content: center;

    .progress {
      margin-top: (75-@progress-height)/2px;
      height: @progress-height;
      border-radius: 8px;
      background-color: darken(@gray-lighter, 5%);
      -webkit-box-shadow: none;
      box-shadow: none;
      -webkit-flex: 1 1 75%;
      flex: 1 1 75%;

      .progress-bar {
        border-right: 1px solid white;
      }
    }

    .next, .back {
      line-height: 75px;
      cursor: pointer;
      -webkit-flex: 1 0 100px;
      flex: 1 0 100px;

      span {
        vertical-align: middle;
      }

      img {
        padding: 0 3px;
      }

      display: inline-block;
      width: 12%;
      font-size: 1.6rem;
      color: @brand-primary;
    }
    
    .back {
      padding-right: 20px;
      text-align: right;
    }
    
    .next {
      padding-left: 20px;
      text-align: left;
    }
  }
}

@import "../../../../styles/variables.less";

@progress-height: 9px;

.media-nav {
  background-color: @gray-lightest;

  .book-nav {
    display: -webkit-flex;
    display: flex;
    height: 75px;
    -webkit-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-justify-content: center;
    justify-content: center;

    .progress {
      margin-top: (75-@progress-height)/2px;
      height: @progress-height;
      border-radius: 8px;
      background-color: darken(@gray-lighter, 5%);
      -webkit-box-shadow: none;
      box-shadow: none;
      -webkit-flex: 1 1 75%;
      flex: 1 1 75%;

      .progress-bar {
        border-right: 1px solid white;
      }
    }

    .next, .back {
      line-height: 75px;
      cursor: pointer;
      -webkit-flex: 1 0 75px;
      flex: 1 0 100px;

      span {
        vertical-align: middle;
      }

      img {
        padding: 0 3px;
      }

      display: inline-block;
      font-size: 1.6rem;
      color: @brand-primary;
    }
    
    .back {
      padding-right: 20px;
      text-align: right;
    }
    
    .next {
      padding-left: 20px;
      text-align: left;
    }
  }
}

Reduce width of next/back buttons
Reduce width of next/back buttons
