/****************************************************************************** 
* Font Awesome Icons
******************************************************************************/

  .fa-icon {
    height: auto;
    width: auto;
  
    &::before,
    &::after,
    a::before,
    a::after {
      font-family: 'FontAwesome';
      font-size: 16px;
      -webkit-transition: all ease-in-out 600ms;
      -moz-transition: all ease-in-out 600ms;
      -ms-transition: all ease-in-out 600ms;
      -o-transition: all ease-in-out 600ms;
      transition: all ease-in-out 600ms;
    }

    &.fa-icon-instagram a::before {
      content: '\f16d';
    }

    &.fa-icon-youtube a::before {
      content: '\f16a';
    }

    &.fa-icon-facebook a::before {
      content: '\f09a';
    }

    &.fa-icon-twitter a::before {
      content: '\f099';
    }

    &.fa-icon-github a::before {
      content: '\f09b';
    }

    &.fa-icon-linkedin a::before {
      content: '\f0e1';
    }

    &.fa-icon-angle-double-left a::before {
      content: '\f100';
    }

    &.fa-icon-angle-double-right a::after {
      content: '\f101';
    }

    &.fa-icon-tag a::before {
      content: '\f02b';
    }

    &.fa-icon-folder a::before {
      content: '\f07c';
    }

    &.fa-icon-edit a::before {
      content: '\f044';
    }

    &.fa-icon-bars::before {
      content: '\f0c9';
    }
  
    &.fa-icon-search::before {
      content: '\f002';
    }

    &.fa-icon-close::before {
      content: '\f00d';
    }

    &.fa-icon-ellipsis-h::before {
      content: '\f141';
    }

    &.fa-icon-angle-left::before {
      content: '\f104';
    }

    &.fa-icon-angle-right::after {
      content: '\f105';
    }

    &.fa-icon-angle-up::after {
      content: '\f106';
    }

    &.fa-icon-angle-down::before {
      content: '\f107';
    }

    &.fa-icon-user-circle::before {
      content: '\f2bd';
    }

    &.fa-icon-comment::before {
      content: '\f075';
    }

    &.fa-icon-home::before {
      content: '\f015';
    }

    &.fa-icon-calendar:before {
      content: '\f073';
    }
  }

/****************************************************************************** 
* Font Awesome Mobile
******************************************************************************/

  @media (max-width: $breakpoint-tablet) {
   
    .fa-icon {
      
      &::before,
      &::after,
      a::before,
      a::after { 
        font-size: 24px;
      }
    }
  }