Upgraded to font-awesome 5.*.

_includes/icons.html

@@ -1,46 +1,46 @@
 <ul class="icons">
 {%- if site.dribbble_username -%}
-  <li><a href="https://dribbble.com/{{ site.dribbble_username | cgi_escape | escape }}" class="icon fa-dribbble"><span class="label">{{ site.dribbble_username | escape }}</span></a></li>
+  <li><a href="https://dribbble.com/{{ site.dribbble_username | cgi_escape | escape }}" class="icon fab fa-dribbble"><span class="label">Dribbble: {{ site.dribbble_username | escape }}</span></a></li>
 {%- endif -%}
 {%- if site.facebook_username -%}
-  <li><a href="https://www.facebook.com/{{ site.facebook_username | cgi_escape | escape }}" class="icon fa-facebook"><span class="label">{{ site.facebook_username | escape }}</span></a></li>
+  <li><a href="https://www.facebook.com/{{ site.facebook_username | cgi_escape | escape }}" class="icon fab fa-facebook"><span class="label">Facebook: {{ site.facebook_username | escape }}</span></a></li>
 {%- endif -%}
 {%- if site.flickr_username -%}
-  <li><a href="https://www.flickr.com/photos/{{ site.flickr_username | cgi_escape | escape }}" class="icon fa-flickr"><span class="label">{{ site.flickr_username | escape }}</span></a></li>
+  <li><a href="https://www.flickr.com/photos/{{ site.flickr_username | cgi_escape | escape }}" class="icon fab fa-flickr"><span class="label">Flickr: {{ site.flickr_username | escape }}</span></a></li>
 {%- endif -%}
 {%- if site.github_username -%}
-  <li><a href="https://github.com/{{ site.github_username | cgi_escape | escape }}" class="icon fa-github"><span class="label">{{ site.github_username | escape }}</span></a></li>
+  <li><a href="https://github.com/{{ site.github_username | cgi_escape | escape }}" class="icon fab fa-github"><span class="label">GitHub: {{ site.github_username | escape }}</span></a></li>
 {%- endif -%}
 {%- if site.bitbucket_username -%}
-  <li><a href="https://bitbucket.org/{{ site.bitbucket_username | cgi_escape | escape }}" class="icon fa-bitbucket"><span class="label">{{ site.bitbucket_username | escape }}</span></a></li>
+  <li><a href="https://bitbucket.org/{{ site.bitbucket_username | cgi_escape | escape }}" class="icon fab fa-bitbucket"><span class="label">BitBucket: {{ site.bitbucket_username | escape }}</span></a></li>
 {%- endif -%}
 {%- if site.instagram_username -%}
-  <li><a href="https://www.instagram.com/{{ site.instagram_username | cgi_escape | escape }}" class="icon fa-instagram"><span class="label">{{ site.instagram_username | escape }}</span></a></li>
+  <li><a href="https://www.instagram.com/{{ site.instagram_username | cgi_escape | escape }}" class="icon fab fa-instagram"><span class="label">Instagram{{ site.instagram_username | escape }}</span></a></li>
 {%- endif -%}
 {%- if site.linkedin_username -%}
-  <li><a href="https://www.linkedin.com/in/{{ site.linkedin_username | cgi_escape | escape }}" class="icon fa-linkedin"><span class="label">{{ site.linkedin_username | escape }}</span></a></li>
+  <li><a href="https://www.linkedin.com/in/{{ site.linkedin_username | cgi_escape | escape }}" class="icon fab fa-linkedin"><span class="label">LinkedIn: {{ site.linkedin_username | escape }}</span></a></li>
 {%- endif -%}
 {%- if site.pinterest_username -%}
-  <li><a href="https://www.pinterest.com/{{ site.pinterest_username | cgi_escape | escape }}" class="icon fa-pinterest"><span class="label">{{ site.pinterest_username | escape }}</span></a></li>
+  <li><a href="https://www.pinterest.com/{{ site.pinterest_username | cgi_escape | escape }}" class="icon fab fa-pinterest"><span class="label">Pinterest: {{ site.pinterest_username | escape }}</span></a></li>
 {%- endif -%}
 {%- for mst in site.mastodon -%}
   {%- if mst.username and mst.instance -%}
-    <li><a href="https://{{ mst.instance | cgi_escape | escape}}/@{{mst.username}}" class="icon fa-mastodon"><span class="label">{{ mst.username |escape }}</span></a></li>
+    <li><a href="https://{{ mst.instance | cgi_escape | escape}}/@{{mst.username}}" class="icon fab fa-mastodon"><span class="label">{{ mst.instance }}: {{ mst.username | escape }}</span></a></li>
   {%- endif -%}
 {%- endfor -%}
 {%- if site.twitter_username -%}
-  <li><a href="https://twitter.com/{{ site.twitter_username | cgi_escape | escape }}" class="icon fa-twitter"><span class="label">{{ site.twitter_username | escape }}</span></a></li>
+  <li><a href="https://twitter.com/{{ site.twitter_username | cgi_escape | escape }}" class="icon fab fa-twitter"><span class="label">Twitter: {{ site.twitter_username | escape }}</span></a></li>
 {%- endif -%}
 {%- if site.youtube_username -%}
-  <li><a href="https://www.youtube.com/{{ site.youtube_username | cgi_escape | escape }}" class="icon fa-youtube"><span class="label">{{ site.youtube_username | escape }}</span></a></li>
+  <li><a href="https://www.youtube.com/{{ site.youtube_username | cgi_escape | escape }}" class="icon fab fa-youtube"><span class="label">YouTube: {{ site.youtube_username | escape }}</span></a></li>
 {%- endif -%}
 {%- if site.googleplus_username -%}
-  <li><a href="https://plus.google.com/{{ site.googleplus_username | escape }}" class="icon fa-google-plus"><span class="label">{{ site.googleplus_username | escape }}</span></a></li>
+  <li><a href="https://plus.google.com/{{ site.googleplus_username | escape }}" class="icon fab fa-google-plus"><span class="label">GooglePlus: {{ site.googleplus_username | escape }}</span></a></li>
 {%- endif -%}
 {%- if site.rss -%}
-  <li><a href="{{ 'feed.xml' | relative_url }}" class="icon fa-rss"><span class="label">{{ site.rss | escape }}</span></a></li>
+  <li><a href="{{ 'feed.xml' | relative_url }}" class="icon fas fa-rss"><span class="label">{{ site.rss | escape }}</span></a></li>
 {%- endif -%}
 {%- if site.email -%}
-  <li><a href="mailto:{{ site.email | escape }}" class="icon fa-envelope"><span class="label">Email</span></a></li>
+  <li><a href="mailto:{{ site.email | escape }}" class="icon fas fa-envelope"><span class="label">Email</span></a></li>
 {%- endif -%}
 </ul>

_sass/fontawesome/_animated.scss

@@ -0,0 +1,20 @@
+// Animated Icons
+// --------------------------
+
+.#{$fa-css-prefix}-spin {
+  animation: fa-spin 2s infinite linear;
+}
+
+.#{$fa-css-prefix}-pulse {
+  animation: fa-spin 1s infinite steps(8);
+}
+
+@keyframes fa-spin {
+  0% {
+    transform: rotate(0deg);
+  }
+
+  100% {
+    transform: rotate(360deg);
+  }
+}

_sass/fontawesome/_bordered-pulled.scss

@@ -0,0 +1,20 @@
+// Bordered & Pulled
+// -------------------------
+
+.#{$fa-css-prefix}-border {
+  border: solid .08em $fa-border-color;
+  border-radius: .1em;
+  padding: .2em .25em .15em;
+}
+
+.#{$fa-css-prefix}-pull-left { float: left; }
+.#{$fa-css-prefix}-pull-right { float: right; }
+
+.#{$fa-css-prefix},
+.fas,
+.far,
+.fal,
+.fab {
+  &.#{$fa-css-prefix}-pull-left { margin-right: .3em; }
+  &.#{$fa-css-prefix}-pull-right { margin-left: .3em; }
+}

_sass/fontawesome/_core.scss

@@ -0,0 +1,20 @@
+// Base Class Definition
+// -------------------------
+
+.#{$fa-css-prefix},
+.fas,
+.far,
+.fal,
+.fab {
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  display: inline-block;
+  font-style: normal;
+  font-variant: normal;
+  text-rendering: auto;
+  line-height: 1;
+}
+
+%fa-icon {
+  @include fa-icon;
+}

_sass/fontawesome/_fixed-width.scss

@@ -0,0 +1,6 @@
+// Fixed Width Icons
+// -------------------------
+.#{$fa-css-prefix}-fw {
+  text-align: center;
+  width: (20em / 16);
+}

_sass/fontawesome/_larger.scss

@@ -0,0 +1,23 @@
+// Icon Sizes
+// -------------------------
+
+// makes the font 33% larger relative to the icon container
+.#{$fa-css-prefix}-lg {
+  font-size: (4em / 3);
+  line-height: (3em / 4);
+  vertical-align: -.0667em;
+}
+
+.#{$fa-css-prefix}-xs {
+  font-size: .75em;
+}
+
+.#{$fa-css-prefix}-sm {
+  font-size: .875em;
+}
+
+@for $i from 1 through 10 {
+  .#{$fa-css-prefix}-#{$i}x {
+    font-size: $i * 1em;
+  }
+}

_sass/fontawesome/_list.scss

@@ -0,0 +1,18 @@
+// List Icons
+// -------------------------
+
+.#{$fa-css-prefix}-ul {
+  list-style-type: none;
+  margin-left: $fa-li-width * 5/4;
+  padding-left: 0;
+
+  > li { position: relative; }
+}
+
+.#{$fa-css-prefix}-li {
+  left: -$fa-li-width;
+  position: absolute;
+  text-align: center;
+  width: $fa-li-width;
+  line-height: inherit;
+}

_sass/fontawesome/_mixins.scss

@@ -0,0 +1,57 @@
+// Mixins
+// --------------------------
+
+@mixin fa-icon {
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  display: inline-block;
+  font-style: normal;
+  font-variant: normal;
+  font-weight: normal;
+  line-height: 1;
+  vertical-align: -.125em;
+}
+
+@mixin fa-icon-rotate($degrees, $rotation) {
+  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=#{$rotation})";
+  transform: rotate($degrees);
+}
+
+@mixin fa-icon-flip($horiz, $vert, $rotation) {
+  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=#{$rotation}, mirror=1)";
+  transform: scale($horiz, $vert);
+}
+
+
+// Only display content to screen readers. A la Bootstrap 4.
+//
+// See: http://a11yproject.com/posts/how-to-hide-content/
+
+@mixin sr-only {
+  border: 0;
+  clip: rect(0, 0, 0, 0);
+  height: 1px;
+  margin: -1px;
+  overflow: hidden;
+  padding: 0;
+  position: absolute;
+  width: 1px;
+}
+
+// Use in conjunction with .sr-only to only display content when it's focused.
+//
+// Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
+//
+// Credit: HTML5 Boilerplate
+
+@mixin sr-only-focusable {
+  &:active,
+  &:focus {
+    clip: auto;
+    height: auto;
+    margin: 0;
+    overflow: visible;
+    position: static;
+    width: auto;
+  }
+}

_sass/fontawesome/_rotated-flipped.scss

@@ -0,0 +1,23 @@
+// Rotated & Flipped Icons
+// -------------------------
+
+.#{$fa-css-prefix}-rotate-90  { @include fa-icon-rotate(90deg, 1);  }
+.#{$fa-css-prefix}-rotate-180 { @include fa-icon-rotate(180deg, 2); }
+.#{$fa-css-prefix}-rotate-270 { @include fa-icon-rotate(270deg, 3); }
+
+.#{$fa-css-prefix}-flip-horizontal { @include fa-icon-flip(-1, 1, 0); }
+.#{$fa-css-prefix}-flip-vertical   { @include fa-icon-flip(1, -1, 2); }
+.#{$fa-css-prefix}-flip-horizontal.#{$fa-css-prefix}-flip-vertical { @include fa-icon-flip(-1, -1, 2); }
+
+// Hook for IE8-9
+// -------------------------
+
+:root {
+  .#{$fa-css-prefix}-rotate-90,
+  .#{$fa-css-prefix}-rotate-180,
+  .#{$fa-css-prefix}-rotate-270,
+  .#{$fa-css-prefix}-flip-horizontal,
+  .#{$fa-css-prefix}-flip-vertical {
+    filter: none;
+  }
+}

_sass/fontawesome/_screen-reader.scss

@@ -0,0 +1,5 @@
+// Screen Readers
+// -------------------------
+
+.sr-only { @include sr-only; }
+.sr-only-focusable { @include sr-only-focusable; }

_sass/fontawesome/_stacked.scss

@@ -0,0 +1,31 @@
+// Stacked Icons
+// -------------------------
+
+.#{$fa-css-prefix}-stack {
+  display: inline-block;
+  height: 2em;
+  line-height: 2em;
+  position: relative;
+  vertical-align: middle;
+  width: 2em;
+}
+
+.#{$fa-css-prefix}-stack-1x,
+.#{$fa-css-prefix}-stack-2x {
+  left: 0;
+  position: absolute;
+  text-align: center;
+  width: 100%;
+}
+
+.#{$fa-css-prefix}-stack-1x {
+  line-height: inherit;
+}
+
+.#{$fa-css-prefix}-stack-2x {
+  font-size: 2em;
+}
+
+.#{$fa-css-prefix}-inverse {
+  color: $fa-inverse;
+}

_sass/fontawesome/brands.scss

@@ -0,0 +1,21 @@
+/*!
+ * Font Awesome Free 5.4.1 by @fontawesome - https://fontawesome.com
+ * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ */
+@import 'variables';
+
+@font-face {
+  font-family: 'Font Awesome 5 Brands';
+  font-style: normal;
+  font-weight: normal;
+  src: url('#{$fa-font-path}/fa-brands-400.eot');
+  src: url('#{$fa-font-path}/fa-brands-400.eot?#iefix') format('embedded-opentype'),
+  url('#{$fa-font-path}/fa-brands-400.woff2') format('woff2'),
+  url('#{$fa-font-path}/fa-brands-400.woff') format('woff'),
+  url('#{$fa-font-path}/fa-brands-400.ttf') format('truetype'),
+  url('#{$fa-font-path}/fa-brands-400.svg#fontawesome') format('svg');
+}
+
+.fab {
+  font-family: 'Font Awesome 5 Brands';
+}

_sass/fontawesome/fontawesome.scss

@@ -0,0 +1,16 @@
+/*!
+ * Font Awesome Free 5.4.1 by @fontawesome - https://fontawesome.com
+ * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ */
+@import 'variables';
+@import 'mixins';
+@import 'core';
+@import 'larger';
+@import 'fixed-width';
+@import 'list';
+@import 'bordered-pulled';
+@import 'animated';
+@import 'rotated-flipped';
+@import 'stacked';
+@import 'icons';
+@import 'screen-reader';

_sass/fontawesome/regular.scss

@@ -0,0 +1,22 @@
+/*!
+ * Font Awesome Free 5.4.1 by @fontawesome - https://fontawesome.com
+ * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ */
+@import 'variables';
+
+@font-face {
+  font-family: 'Font Awesome 5 Free';
+  font-style: normal;
+  font-weight: 400;
+  src: url('#{$fa-font-path}/fa-regular-400.eot');
+  src: url('#{$fa-font-path}/fa-regular-400.eot?#iefix') format('embedded-opentype'),
+  url('#{$fa-font-path}/fa-regular-400.woff2') format('woff2'),
+  url('#{$fa-font-path}/fa-regular-400.woff') format('woff'),
+  url('#{$fa-font-path}/fa-regular-400.ttf') format('truetype'),
+  url('#{$fa-font-path}/fa-regular-400.svg#fontawesome') format('svg');
+}
+
+.far {
+  font-family: 'Font Awesome 5 Free';
+  font-weight: 400;
+}

_sass/fontawesome/solid.scss

@@ -0,0 +1,23 @@
+/*!
+ * Font Awesome Free 5.4.1 by @fontawesome - https://fontawesome.com
+ * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ */
+@import 'variables';
+
+@font-face {
+  font-family: 'Font Awesome 5 Free';
+  font-style: normal;
+  font-weight: 900;
+  src: url('#{$fa-font-path}/fa-solid-900.eot');
+  src: url('#{$fa-font-path}/fa-solid-900.eot?#iefix') format('embedded-opentype'),
+  url('#{$fa-font-path}/fa-solid-900.woff2') format('woff2'),
+  url('#{$fa-font-path}/fa-solid-900.woff') format('woff'),
+  url('#{$fa-font-path}/fa-solid-900.ttf') format('truetype'),
+  url('#{$fa-font-path}/fa-solid-900.svg#fontawesome') format('svg');
+}
+
+.fa,
+.fas {
+  font-family: 'Font Awesome 5 Free';
+  font-weight: 900;
+}

_sass/fontawesome/v4-shims.scss

@@ -0,0 +1,6 @@
+/*!
+ * Font Awesome Free 5.4.1 by @fontawesome - https://fontawesome.com
+ * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
+ */
+@import 'variables';
+@import 'shims';

_sass/libs/_mixins.scss

@@ -13,7 +13,7 @@
 
 		-moz-osx-font-smoothing: grayscale;
 		-webkit-font-smoothing: antialiased;
-		font-family: FontAwesome;
+//		font-family: FontAwesome;
 		font-style: normal;
 		font-weight: normal;
 		text-transform: none !important;
@@ -60,4 +60,4 @@
 
 	@return url("data:image/svg+xml;charset=utf8,#{$svg}");
 
-}
+}

assets/css/main.scss

@@ -7,7 +7,9 @@
 @import 'libs/vendor';
 @import 'libs/breakpoints';
 @import 'libs/html-grid';
-@import url('font-awesome.min.css');
+@import 'fontawesome/fontawesome.scss';
+@import 'fontawesome/solid.scss';
+@import 'fontawesome/brands.scss';
 @import url("https://fonts.googleapis.com/css?family=Lato:400,400italic,700,700italic|Source+Code+Pro:400");
 
 /*