converse.js/sass/font-awesome.scss

@font-face {
  font-family: 'Baumans';
  font-style: normal;
  font-weight: 400;
  src: local('Baumans Regular'), local('Baumans-Regular'), url(webfonts/baumans.ttf) format('truetype');
}

@font-face {
  font-family: 'Muli';
  font-style: normal;
  font-weight: 400;
  src: local('Muli Regular'), local('Muli-Regular'), url(webfonts/muli.ttf) format('truetype');
}

@font-face {
  font-family: 'ConverseFontAwesomeBrands';
  font-style: normal;
  font-weight: normal;
  src: url('webfonts/fa-brands-400.eot');
  src: url('webfonts/fa-brands-400.eot?#iefix') format('embedded-opentype'),
  url('webfonts/fa-brands-400.woff2') format('woff2'),
  url('webfonts/fa-brands-400.woff') format('woff'),
  url('webfonts/fa-brands-400.ttf') format('truetype'),
  url('webfonts/fa-brands-400.svg#fontawesome') format('svg');
}

@font-face {
  font-family: 'ConverseFontAwesomeRegular';
  font-style: normal;
  font-weight: 400;
  src: url('webfonts/fa-regular-400.eot');
  src: url('webfonts/fa-regular-400.eot?#iefix') format('embedded-opentype'),
    url('webfonts/fa-regular-400.woff2') format('woff2'),
    url('webfonts/fa-regular-400.woff') format('woff'),
    url('webfonts/fa-regular-400.ttf') format('truetype'),
    url('webfonts/fa-regular-400.svg#fontawesome') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'ConverseFontAwesomeSolid';
  font-style: normal;
  font-weight: 900;
  src: url('webfonts/fa-solid-900.eot');
  src: url('webfonts/fa-solid-900.eot?#iefix') format('embedded-opentype'),
  url('webfonts/fa-solid-900.woff2') format('woff2'),
  url('webfonts/fa-solid-900.woff') format('woff'),
  url('webfonts/fa-solid-900.ttf') format('truetype'),
  url('webfonts/fa-solid-900.svg#fontawesome') format('svg');
}

.far {
  font-family: 'ConverseFontAwesomeRegular' !important;
  font-weight: 400;
}
.fa,
.fas {
  font-family: 'ConverseFontAwesomeSolid' !important;
  font-weight: 900;
}

.fab {
  font-family: 'ConverseFontAwesomeBrands';
}

.fa, .far, .fas, .fab {
    display: inline-block;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

@import "@fortawesome/fontawesome-free/scss/variables";
@import "@fortawesome/fontawesome-free/scss/mixins";
@import "@fortawesome/fontawesome-free/scss/core";
@import "@fortawesome/fontawesome-free/scss/larger";
@import "@fortawesome/fontawesome-free/scss/fixed-width";
@import "@fortawesome/fontawesome-free/scss/list";
@import "@fortawesome/fontawesome-free/scss/bordered-pulled";
@import "@fortawesome/fontawesome-free/scss/animated";
@import "@fortawesome/fontawesome-free/scss/rotated-flipped";
@import "@fortawesome/fontawesome-free/scss/stacked";
@import "@fortawesome/fontawesome-free/scss/icons";
@import "@fortawesome/fontawesome-free/scss/screen-reader";

/* Apparent font-awesome bug? The circle has some kind of bottom margin */
#conversejs {
    .fa-info-circle {
        height: 1em;
    }
}