// Info Bar
//
// The Info Bar contains left and right-aligned content areas,
// and typically lives above the footer.
//
// .-dark - Dark variation.
//
// Markup:
//   <footer class="info-bar {{modifier_class}}">
//     <div class="wrapper">
//       Sponsored by <a href="#">Puppet Sloth</a>.
//       <div class="info-bar__secondary">Questions? <a href="#">Contact Us</a></div>
//     </div>
//   </footer>
//
// Styleguide Info Bar

.info-bar {
  @include clearfix;
  @include rgba(background-color, $black, 0.5, #7f7f7f);
  clear: both;
  color: $white;

  &.-dark {
    background: $off-black;
    color: $med-gray;
  }

  > .wrapper {
    @include clearfix;
    padding: $base-spacing;

    @include media($tablet) {
      @include span(12);
      @include push(2);
    }
  }

  a {
    color: $white;
    font-weight: $weight-normal;
    text-decoration: underline;
  }

  @include media($tablet) {
    .info-bar__secondary {
      float: right;
    }
  }
}