body.chapters-index {
  section.container-wrapper {
    background: image-url('chapter_bg.png');
    background-repeat: repeat-x;
    background-size: contain;
  }

  section.container {
    max-width: $maximum-width;
    width: 100%;
  }
  
  section.inner-container {
    margin-right: 1.5em;
    margin-left: 1.5em;
  }

  hgroup {
    border-bottom: 3px solid rgb(220,220,220);
    margin-bottom: 80px;
    padding-bottom: 10px;

    h2 {
      font: bold 38px/44px $sans-serif;
      text-align: center;
      text-transform: uppercase;
    }
  }
}

.chapters-intro {
  text-align: center;

  p {
    font: normal 14px/20px $sans-serif;

    a {
      color: $base-font-color;
      text-decoration: none;
      text-transform: uppercase;

      &:hover {
        color: $pink;
      }
    }
  }
}

.chapter {
  border-bottom: 3px solid $pink;
  margin-bottom: 60px;
  position: relative;
  max-width: grid-width(5) + $gw-gutter;
  width: 100%;

  .inner-wrapper {
    @extend .clearfix;
    border-radius: 4px;
    padding: 10px 0px;
  }

  h2 {
    float: left;
    margin: 0px;
    padding-right: 100px;

    a {
      color: $base-font-color;
      font: bold 26px/28px $sans-serif;
      text-decoration: none;
      text-transform: uppercase;

      &:hover {
        color: $pink;
      }
    }
  }

  .external-links {
    right: 0px;
    padding-top: 1px;
    position: absolute;

    a {
      background: transparent;
      display: block;
      float: left;
      height: 25px;
      margin: 0px 0px 0px 10px;
      opacity: 0.7;
      position: relative;
      width: 25px;

      &:hover {
        opacity: 1;
      }

      &:active {
        top: 1px;
      }

      &.twitter_url {
        background: image-url('twitter.png');
      }

      &.facebook_url {
        background: image-url('fb.png');
      }

      &.blog_url {
        background: image-url('blog-2.png');
      }

      &.instagram_url {
        background: image-url('instagram.png');
      }
    }
  }

  p.country {
    background: rgb(255,255,255);
    bottom: -8px;
    color: $lighter-base-font-color;
    font: normal 14px/16px $serif;
    margin: 0px;
    padding-right: 10px;
    position: absolute;
  }
}

/**********************************************/
/*               Responsiveness               */
/**********************************************/

@media (max-width:54em) {

.chapter {
  max-width: none;
}
}