_footer.scss

// studio - elements - global footer
// ====================

.wrapper-footer {
  position: relative;
  width: 100%;
  margin: 0 0 $baseline 0;
  padding: $baseline;

  footer.primary {
    @extend %t-copy-sub2;
    @include clearfix();
    max-width: $fg-max-width;
    min-width: $fg-min-width;
    width: flex-grid(12);
    margin: 0 auto;
    color: $gray-l1;

    .colophon {
      width: flex-grid(4, 12);
      float: left;
      margin-right: flex-gutter(2);
    }

    a {
      color: $ui-link-color;

      &:hover, &:active {
        color: $ui-link-color-focus;
      }
    }

    .nav-peripheral {
      width: flex-grid(6, 12);
      float: right;
      text-align: right;

      .nav-item {
        display: inline-block;
        margin-right: ($baseline/4);

        &:last-child {
          margin-right: 0;
        }

        a {
          border-radius: 2px;
          padding: ($baseline/2) ($baseline/2);
          background: transparent;

          [class^="icon-"] {
            @include transition(top $tmg-f2 ease-in-out 0.25s);
            @include font-size(15);
            display: inline-block;
            vertical-align: middle;
            margin-right: ($baseline/4);
          }
        }
      }
    }
  }
}