@font-face {
  font-family: 'social-media';
  src: url('../assets/fonts/social-media.eot');
  src: url('../assets/fonts/social-media.eot') format('embedded-opentype'),
    url('../assets/fonts/social-media.woff2') format('woff2'),
    url('../assets/fonts/social-media.woff') format('woff'),
    url('../assets/fonts/social-media.ttf') format('truetype'),
    url('../assets/fonts/social-media.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
.sm-icon {
  display: inline-block;
  font: normal normal normal 32px/1 'social-media';
  text-transform: none;
  /* Better Font Rendering */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  &.sm-16px {
    font-size: 16px;
  }
  &.sm-24px {
    font-size: 24px;
  }
  &.sm-32px {
    font-size: 32px;
  }
  &.sm-48px {
    font-size: 48px;
  }
  // Refer to docs for updating icon-fonts
  &.sm-logo-facebook:before {
    content: '\ea02';
  }
  &.sm-logo-reddit:before {
    content: '\ea03';
  }
  &.sm-logo-github:before {
    content: '\ea04';
  }
  &.sm-logo-twitter:before {
    content: '\ea05';
  }
  &.sm-logo-linkedin:before {
    content: '\ea06';
  }
  &.sm-logo-slack:before {
    content: '\ea07';
  }
  &.sm-logo-medium:before {
    content: '\ea08';
  }
}