diff --git a/smash/package-lock.json b/smash/package-lock.json
index a05d8b1ea466ab71fc8c16c401b89c504dcdf051..8c987b3a9efbbbadcca20f30d5e86146652c021a 100644
--- a/smash/package-lock.json
+++ b/smash/package-lock.json
@@ -497,6 +497,11 @@
       "version": "github:andyinabox/FileSaver.js#973b433b8fbaee9a11d53b9ae423b046742cfe32",
       "from": "github:andyinabox/FileSaver.js"
     },
+    "font-awesome": {
+      "version": "4.7.0",
+      "resolved": "https://registry.npmjs.org/font-awesome/-/font-awesome-4.7.0.tgz",
+      "integrity": "sha1-j6jPBBGhoxr9B7BtKQK7n8gVoTM="
+    },
     "fontkit": {
       "version": "1.8.1",
       "resolved": "https://registry.npmjs.org/fontkit/-/fontkit-1.8.1.tgz",
diff --git a/smash/package.json b/smash/package.json
index 7c94297e00122eac6bc7030d0385744595406f1c..e3977ac86fcbae746c2f0a82f774947b0360f9d5 100644
--- a/smash/package.json
+++ b/smash/package.json
@@ -17,6 +17,7 @@
     "datatables.net-buttons": "^1.6.5",
     "datatables.net-buttons-bs": "^1.6.5",
     "eonasdan-bootstrap-datetimepicker": "^4.17.47",
+    "font-awesome": "^4.7.0",
     "fullcalendar": "^3.4.0",
     "fullcalendar-scheduler": "^1.6.2",
     "html2canvas": "^0.5.0-beta3",
diff --git a/smash/smash/settings.py b/smash/smash/settings.py
index 7eb0b1bfc641062ecef5664426a78b236fa48dde..1ae581e541ea5cc7f19ee32909432ef546d17c5f 100644
--- a/smash/smash/settings.py
+++ b/smash/smash/settings.py
@@ -128,6 +128,7 @@ NPM_FILE_PATTERNS = {
     'datatables.net-buttons': ['js/*', 'License.txt'],
     'datatables.net-buttons-bs': ['js/*', 'css/*', 'License.txt'],
     'eonasdan-bootstrap-datetimepicker': ['build/*', 'LICENSE'],
+    'font-awesome': ['css/*', 'fonts/*', 'less/*', 'scss/*'],
     'fullcalendar': ['dist/*', 'license.txt'],
     'fullcalendar-scheduler': ['dist/*', 'LICENSE.md'],
     'html2canvas': ['dist/*', 'LICENSE'],
diff --git a/smash/web/templates/_base.html b/smash/web/templates/_base.html
index cd68385a4063426cd9aae96562cfe3ae3c1c2630..83cb12075a5954c52d651500b1da55fba0d3201a 100644
--- a/smash/web/templates/_base.html
+++ b/smash/web/templates/_base.html
@@ -11,8 +11,7 @@
         <link rel="stylesheet" href="{% static 'bootstrap/dist/css/bootstrap.min.css' %}">
 
         <!-- Font Awesome -->
-        <link rel="stylesheet"
-              href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+        <link rel="stylesheet" href="{% static 'font-awesome/css/font-awesome.min.css'%}">
 
         <!-- Ionicons -->
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
@@ -76,15 +75,17 @@ desired effect
                 <span class="sr-only">Toggle navigation</span>
             </a>
 
-              <div class="col-xs-7 navbar-text" style="margin-left: 0px">
+            <div class="col-xs-7 navbar-text" style="margin-left: 0px">
                 <div class="warning_ticker">
-                  <div class="ticker_list">
-                    {% if user.is_authenticated and role == '<No worker information>' %}
-                      <div class="warning"><i class="fa fa-exclamation-triangle"></i>Some features might not work, <b>{{ user.get_username }}</b> has no worker associated.</div>
-                    {% endif %}
-                  </div>
+                    <div class="ticker_list">
+                        {% if user.is_authenticated and role == '<No worker information>' %}
+                            <div class="warning"><i class="fa fa-exclamation-triangle"></i>Some features might not work,
+                                <b>{{ user.get_username }}</b> has no worker associated.
+                            </div>
+                        {% endif %}
+                    </div>
                 </div>
-              </div>
+            </div>
 
             <!-- Navbar Right Menu -->
             <div class="navbar-custom-menu">
@@ -186,7 +187,7 @@ desired effect
 
                                 <div style="display: inline-block;">
                                     <a href="{% url 'change_password' %}" class="btn btn-default btn-flat">
-                                      <i class="fa fa-key" aria-hidden="true"></i> Change Password</a>
+                                        <i class="fa fa-key" aria-hidden="true"></i> Change Password</a>
                                 </div>
 
                                 <div class="pull-right">
@@ -203,7 +204,7 @@ desired effect
             <a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
           </li>
           {% endcomment %}
-          </ul>
+                </ul>
             </div>
         </nav>
     </header>
@@ -369,23 +370,23 @@ desired effect
     <script src="{% static 'moment/min/moment.min.js' %}"></script>
     <script src="{% static 'moment-range/dist/moment-range.js' %}"></script>
     <script type="text/javascript">
-      window['moment-range'].extendMoment(moment);
+        window['moment-range'].extendMoment(moment);
     </script>
     <script>
         //vertical ticker marquee. This could be used for other messages as well :-)
-        if($('.ticker_list').children().length > 1){
+        if ($('.ticker_list').children().length > 1) {
             console.log("Not implemented");
-        }else if($('.ticker_list').children().length === 1){
+        } else if ($('.ticker_list').children().length === 1) {
 
-        }else{
-          $('.warning_ticker').css('display', 'none');
+        } else {
+            $('.warning_ticker').css('display', 'none');
         }
 
         var activate = function (page_to_activate) {
             var $e = $(".sidebar-menu li[data-desc='" + page_to_activate + "']");
             $e.addClass("active");
-            if($($e).parents('li[data-desc]').length > 0){ //if there is a parent, it should also be active
-              $($e).parents('li[data-desc]').addClass("active");
+            if ($($e).parents('li[data-desc]').length > 0) { //if there is a parent, it should also be active
+                $($e).parents('li[data-desc]').addClass("active");
             }
 
         };
diff --git a/smash/web/templates/errors/400.html b/smash/web/templates/errors/400.html
index 44bb24cc9f6088a68785a5b32692cd7336c8c816..b66a17b433dc716b6d993f8ae6a26cba6e8dcde4 100644
--- a/smash/web/templates/errors/400.html
+++ b/smash/web/templates/errors/400.html
@@ -11,8 +11,7 @@
         <link rel="stylesheet" href="{% static 'bootstrap/dist/css/bootstrap.min.css' %}">
 
         <!-- Font Awesome -->
-        <link rel="stylesheet"
-              href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+        <link rel="stylesheet" href="{% static 'font-awesome/css/font-awesome.min.css'%}">
 
         <!-- Ionicons -->
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
diff --git a/smash/web/templates/errors/403.html b/smash/web/templates/errors/403.html
index 4aaff5b21de5f352fe01774cf0ebe58d85470568..aff09e48f1682fa440262643ee7be575f773efbd 100644
--- a/smash/web/templates/errors/403.html
+++ b/smash/web/templates/errors/403.html
@@ -11,8 +11,7 @@
         <link rel="stylesheet" href="{% static 'bootstrap/dist/css/bootstrap.min.css' %}">
 
         <!-- Font Awesome -->
-        <link rel="stylesheet"
-              href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+        <link rel="stylesheet" href="{% static 'font-awesome/css/font-awesome.min.css'%}">
 
         <!-- Ionicons -->
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
diff --git a/smash/web/templates/errors/404.html b/smash/web/templates/errors/404.html
index ca200cb9f958f9bf0811c236e1f151f95bca9954..1f6549eea85cdb28312eac0dc90b6714be2a197a 100644
--- a/smash/web/templates/errors/404.html
+++ b/smash/web/templates/errors/404.html
@@ -11,8 +11,7 @@
         <link rel="stylesheet" href="{% static 'bootstrap/dist/css/bootstrap.min.css' %}">
 
         <!-- Font Awesome -->
-        <link rel="stylesheet"
-              href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+        <link rel="stylesheet" href="{% static 'font-awesome/css/font-awesome.min.css'%}">
 
         <!-- Ionicons -->
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
diff --git a/smash/web/templates/errors/500.html b/smash/web/templates/errors/500.html
index cde528cfe533e0f8790ad9c53c5d1ef64d8bbc59..d9ed90f52257bf16362a66874914d4eaab4818a1 100644
--- a/smash/web/templates/errors/500.html
+++ b/smash/web/templates/errors/500.html
@@ -11,8 +11,7 @@
         <link rel="stylesheet" href="{% static 'bootstrap/dist/css/bootstrap.min.css' %}">
 
         <!-- Font Awesome -->
-        <link rel="stylesheet"
-              href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+        <link rel="stylesheet" href="{% static 'font-awesome/css/font-awesome.min.css'%}">
 
         <!-- Ionicons -->
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
diff --git a/smash/web/templates/login.html b/smash/web/templates/login.html
index 73d014baa3a956951975c88747991d247561ebdc..ee042ac74edd13a091f64c00b8832ced91459493 100644
--- a/smash/web/templates/login.html
+++ b/smash/web/templates/login.html
@@ -14,8 +14,7 @@
         <link rel="stylesheet" href="{% static 'bootstrap/dist/css/bootstrap.min.css' %}">
 
         <!-- Font Awesome -->
-        <link rel="stylesheet"
-              href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+        <link rel="stylesheet" href="{% static 'font-awesome/css/font-awesome.min.css'%}">
 
         <!-- Ionicons -->
         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">