.btn-link {
  display: inline-block;
  padding: 8px 32px;
  border: 1px solid #DDD;
  background-color: #DDD;
  text-decoration: none;
  color: #222;
  transition: all .4s ease-in-out;

  &:hover {
    background-color: #CCC;
  }
  span {
    vertical-align: text-top;
    margin-left: 5px;
  }

  &.btn-link-facebook {
    background-color: $c-facebook-100;
    border-color: $c-facebook-100;
    color: #FFF;

    &:hover {
      background-color: $c-facebook-200;
      border-color: $c-facebook-200;
    }
  }

  &.btn-link-email {
    background-color: #FFF;
    border-color: $c-email-100;

    &:hover {
      background-color: rgba($c-email-100, .04);
      border-color: $c-email-200;
    }
  }

  &.btn-link-twitter {
    background-color: $c-twitter-100;
    border-color: $c-twitter-100;
    color: #FFF;

    &:hover {
      background-color: $c-twitter-200;
      border-color: $c-twitter-200;
    }
  }

  &.btn-link-tumblr {
    background-color: $c-tumblr-100;
    border-color: $c-tumblr-100;
    color: #FFF;

    &:hover {
      background-color: $c-tumblr-200;
      border-color: $c-tumblr-200;
    }
  }

  &.btn-link-pinterest {
    background-color: $c-pinterest-100;
    border-color: $c-pinterest-100;
    color: #FFF;

    &:hover {
      background-color: $c-pinterest-200;
      border-color: $c-pinterest-200;
    }
  }

  &.btn-link-line {
    background-color: $c-line-100;
    border-color: $c-line-100;
    color: #FFF;

    &:hover {
      background-color: $c-line-200;
      border-color: $c-line-200;
    }
  }

  &.btn-link-linkedin {
    background-color: $c-linkedin-100;
    border-color: $c-linkedin-100;
    color: #FFF;

    &:hover {
      background-color: $c-linkedin-200;
      border-color: $c-linkedin-200;
    }
  }

  &.btn-link-reddit {
    background-color: $c-reddit-100;
    border-color: $c-reddit-100;
    color: #FFF;

    &:hover {
      background-color: $c-reddit-200;
      border-color: $c-reddit-200;
    }
  }

  &.btn-link-whatsapp {
    background-color: $c-whatsapp-100;
    border-color: $c-whatsapp-100;
    color: #FFF;

    &:hover {
      background-color: $c-whatsapp-200;
      border-color: $c-whatsapp-200;
    }
  }

  &.btn-link-telegram {
    background-color: $c-telegram-100;
    border-color: $c-telegram-100;
    color: #FFF;

    &:hover {
      background-color: $c-telegram-200;
      border-color: $c-telegram-200;
    }
  }

  &.btn-link-pocket {
    background-color: $c-pocket-100;
    border-color: $c-pocket-100;
    color: #FFF;

    &:hover {
      background-color: $c-pocket-200;
      border-color: $c-pocket-200;
    }
  }

  &.btn-link-copy {
    background-color: $c-copy-100;
    border-color: $c-copy-100;
    color: #FFF;

    &:hover {
      background-color: $c-copy-200;
      border-color: $c-copy-200;
    }
  }

  &.is-rounded {
    border-radius: 5px;
  }

  svg {
    display: inline-block;
    width: 16px;
    height: 16px;
  }
}