.fa-ul {
  list-style-type: none;
  margin-left: 2.5em;
  padding-left: 0;
  position: relative;
}
.fa-li {
  left: -2em;
  position: absolute;
  text-align: center;
  width: 2em;
  line-height: inherit;
}

.far,
.fas {
  padding: 0px 0px;
  display: inline-block;
}
.far:before,
.fas:before {
  display: inline-block;

  height: 1em;
  width: 1em;
  content: " ";
  background: #333333;

  -webkit-mask-size: 1em 1em;
  mask-size: 1em 1em;

  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;

  -webkit-mask-position: center;
  mask-position: center;
}

.far.lazy:before,
.fas.lazy:before {
  background: transparent;
}

.fa-arrow-circle-right:before {
  -webkit-mask-image: url(../svg/arrow-circle-right.svg);
  mask-image: url(../svg/arrow-circle-right.svg);
}

.fa-angle-right:before {
  -webkit-mask-image: url(../svg/angle-right.svg);
  mask-image: url(../svg/angle-right.svg);
}

.fa-check:before {
  -webkit-mask-image: url(../svg/check.svg);
  mask-image: url(../svg/check.svg);
}

.fa-check-square:before {
  -webkit-mask-image: url(../svg/check-square.svg);
  mask-image: url(../svg/check-square.svg);
}

.fa-building:before {
  -webkit-mask-image: url(../svg/building.svg);
  mask-image: url(../svg/building.svg);
}

.fa-quote-left:before {
  -webkit-mask-image: url(../svg/quote-left.svg);
  mask-image: url(../svg/quote-left.svg);
}
.fa-star:before {
  -webkit-mask-image: url(../svg/star.svg);
  mask-image: url(../svg/star.svg);
}
.fa-mobile-alt:before {
  -webkit-mask-image: url(../svg/mobile-alt.svg);
  mask-image: url(../svg/mobile-alt.svg);
}
.fa-whatsapp:before {
  -webkit-mask-image: url(../svg/whatsapp.svg);
  mask-image: url(../svg/whatsapp.svg);
}
.fa-phone:before {
  -webkit-mask-image: url(../svg/phone.svg);
  mask-image: url(../svg/phone.svg);
}
.fa-envelope:before {
  -webkit-mask-image: url(../svg/envelope.svg);
  mask-image: url(../svg/envelope.svg);
}
.fa-calendar:before {
  -webkit-mask-image: url(../svg/calendar.svg);
  mask-image: url(../svg/calendar.svg);
}
.fa-comments:before {
  -webkit-mask-image: url(../svg/comments.svg);
  mask-image: url(../svg/comments.svg);
}
.fa-clock:before {
  -webkit-mask-image: url(../svg/clock.svg);
  mask-image: url(../svg/clock.svg);
}
.fa-times:before {
  -webkit-mask-image: url(../svg/times.svg);
  mask-image: url(../svg/times.svg);
}
.fa-angle-left:before {
  -webkit-mask-image: url(../svg/angle-left.svg);
  mask-image: url(../svg/angle-left.svg);
}
.fa-angle-right:before {
  -webkit-mask-image: url(../svg/angle-right.svg);
  mask-image: url(../svg/angle-right.svg);
}
.fa-angle-down:before {
  -webkit-mask-image: url(../svg/angle-down.svg);
  mask-image: url(../svg/angle-down.svg);
}
.fa-shopping-basket:before {
  -webkit-mask-image: url(../svg/shopping-basket.svg);
  mask-image: url(../svg/shopping-basket.svg);
}
.fa-bars:before {
  -webkit-mask-image: url(../svg/bars.svg);
  mask-image: url(../svg/bars.svg);
}

.fa-atom:before {
  -webkit-mask-image: url(../svg/atom.svg);
  mask-image: url(../svg/atom.svg);
}

.fa-chalkboard-teacher:before {
  -webkit-mask-image: url(../svg/chalkboard-teacher.svg);
  mask-image: url(../svg/chalkboard-teacher.svg);
}
.fa-book-open:before {
  -webkit-mask-image: url(../svg/book-open-2.svg);
  mask-image: url(../svg/book-open-2.svg);
}

.fa-pencil-alt:before {
  -webkit-mask-image: url(../svg/pencil-alt.svg);
  mask-image: url(../svg/pencil-alt.svg);
}

.fa-file-alt:before {
  -webkit-mask-image: url(../svg/file-alt.svg);
  mask-image: url(../svg/file-alt.svg);
}

.fa-comments:before {
  -webkit-mask-image: url(../svg/comments.svg);
  mask-image: url(../svg/comments.svg);
}

/* Compat colors and behavior */

.fas.bgray:before,
.bgray .fas:before {
  background-color: #777;
}

.fas.text-white:before,
.text-white .fas:before {
  background-color: white;
}

.fas.orange:before,
.orange .fas:before {
  background-color: #e99b04 !important;
}

.fas.lblue:before,
.lblue .fas:before {
  background-color: #04adf7;
}

.fas.green:before,
.green .fas:before {
  background-color: #24af9d;
}
.fas.green2:before,
.green2 .fas:before {
  background-color: #1695a3;
}

.fas.purple:before,
.purple .fas:before {
  background-color: #32319f;
}
/*
.rotate.down:before {
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90def);
}
*/
/* Compat fontawesome icons */

.svg-icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  background: black;
}

.svg-icon-blue {
  /*filter: invert(0.5) sepia(1) hue-rotate(200deg) saturate(4) brightness(1);*/
  filter: invert(0.5) sepia(1) hue-rotate(170deg) saturate(5) brightness(1);
}

.svg-icon-orange {
  filter: invert(0.5) sepia(1) hue-rotate(0deg) saturate(5) brightness(1.1);
}