/*------------------------------------*\
  #LINKS
\*------------------------------------*/

a {
  @extend %inline-button;
  text-decoration: none;
}

/*------------------------------------*\
  #LINKS
\*------------------------------------*/

$link-color: $neg-primary-color;
$link-color--hover: lighten($link-color, 30);

a {
  color: $link-color;
  text-decoration: none;
  border-bottom: 2px solid $link-color;
  font-weight: bold;
  transition: all .2s;

  &:hover {
    color: $link-color--hover;
    border-color: $link-color--hover;
  }
}

Fix link styles not working well with images
Fix link styles not working well with images

When a link is wrapped around an image, the border from `inline-button`
protudes on the sides.

Links now have some different default styling and the `inline-button`
class will be applied on links individually.
