// ----------------------------------------------------------------------

  // Animated link that has a fade-in underline

// ----------------------------------------------------------------------

// example: @include animate-link($screenGreen, $gothamMedium, 14);

@mixin animate-link($color, $font, $fontSize) {

  font-family:$font;
  
  @include single-transition(border, 0.2s, ease-in-out, 0);
  text-decoration:none;

  color: $color;
  border-bottom:1px solid transparent;

  @include rem("font-size", $fontSize);
  
  &:focus,
  &:hover {
    border-color: $color;
  }
}