diff --git a/package.json b/package.json
index bbba4f5..4b272c9 100755
--- a/package.json
+++ b/package.json
@@ -19,6 +19,7 @@
   "dependencies": {
     "angular": "^1.6.4",
     "angular-cookies": "^1.6.4",
+    "angular-route": "^1.6.4",
     "babel-core": "^6.26.0",
     "babel-eslint": "^8.0.1",
     "babel-loader": "^7.1.2",
diff --git a/src/_sidebar.html b/src/_sidebar.html
index 3e44dfe..a331b2d 100644
--- a/src/_sidebar.html
+++ b/src/_sidebar.html
@@ -147,16 +147,15 @@
 
 <!-- ### $Sidebar Menu ### -->
 <ul class="sidebar-menu scrollable pos-r">
-
-<li class="nav-item mT-30 active visible-referee visible-nomit" ng-show="user.role=='nomit' || user.role == 'referee'">
-  <a class="sidebar-link" href="index.html">
+  <li class="nav-item mT-30 active">
+    <a class="sidebar-link" href="index.html">
       <span class="icon-holder">
         <i class="c-white-500 fa fa-bar-chart text-white"></i>
       </span>
       <span class="title text-white font-weight-bold">Dashboard</span>
     </a>
   </li>
-  <li class="nav-item visible-referee visible-nomit" ng-show="user.role=='nomit' || user.role == 'referee'">
+  <li class="nav-item">
     <a class='sidebar-link' href="ads.html">
       <span class="icon-holder">
         <i class="c-white-500 fa fa-briefcase text-white"></i>
@@ -206,32 +205,6 @@
       <span class="title text-white font-weight-bold">Reports</span>
     </a>
   </li>
-<<<<<<< HEAD
-      <li class="nav-item visible-referee visible-nomit" ng-show="user.role=='nomit' || user.role == 'referee'">
-        <a class='sidebar-link' href="users.html">
-          <span class="icon-holder">
-            <i class="c-white-500 fa fa-users"></i>
-          </span>
-          <span class="title">Users</span>
-        </a>
-      </li>
-      <li class="nav-item visible-nomit visible-referee" ng-show="user.role=='nomit' || user.role == 'referee'">
-        <a class='sidebar-link' href="companies.html">
-          <span class="icon-holder">
-            <i class="c-white-500 fa fa-building"></i>
-          </span>
-          <span class="title">Companies</span>
-        </a>
-      </li>
-      <li class="nav-item visible-referee visible-nomit" ng-show="user.role=='nomit' || user.role == 'referee'">
-        <a class='sidebar-link' href="referees.html">
-          <span class="icon-holder">
-            <i class="c-white-500 fa fa-crosshairs"></i>
-          </span>
-          <span class="title">Referees</span>
-        </a>
-      </li>
-  <!--
   <li class="nav-item">
     <a class='sidebar-link' href="#">
       <span class="icon-holder">
@@ -240,24 +213,6 @@
       <span class="title text-white font-weight-bold">History</span>
     </a>
   </li>
-  -->
-      <li class="nav-item visible-nomit visible-referee" ng-show="user.role=='nomit' || user.role == 'referee'">
-        <a class='sidebar-link' href="#">
-          <span class="icon-holder">
-            <i class="c-white-500 ti-calendar"></i>
-          </span>
-          <span class="title">Reports</span>
-        </a>
-      </li>
-
-      <li class="nav-item visible-user visible-company" ng-show="user.role=='user' || user.role == 'company'">
-        <a class='sidebar-link' href="#">
-          <span class="icon-holder">
-            <i class="c-white-500 fa fa-history"></i>
-          </span>
-          <span class="title">History</span>
-        </a>
-      </li>
 
   <div class="mx-auto" style="width: 40px;">
       <br>
diff --git a/src/_topbar.html b/src/_topbar.html
index 78f975a..8a18751 100644
--- a/src/_topbar.html
+++ b/src/_topbar.html
@@ -17,12 +17,18 @@
         <li class="search-input visible-referee visible-nomit" ng-show="user.role=='nomit' || user.role == 'referee'">
           <input class="form-control" type="text" placeholder="Search users, companies, or anything..">
         </li>
-        <li class="visible-nomit" ng-show="user.role=='nomit'">
+        <li class="visible-nomit ml-2" ng-show="user.role=='nomit'">
           <button type="button" class="btn btn-gradient ">
             <i class="fa fa-plus pdd-right-5 text-white"></i>
-            Add new user
+            ADD NEW USER
           </button>
-        </li>
+				</li>
+				<li class="visible-referee visible-nomit visible-company ml-2" ng-show="user.role=='nomit' || user.role == 'referee' || user.role == 'company'">
+						<button type="button" onclick="window.location.href = 'new-ad.html'" class="btn btn-gradient" >
+							<i class="fa fa-plus pdd-right-5 text-white"></i>
+								CREATE NEW AD
+						</button>
+				</li>
       </ul>
       <ul class="nav-right">
         <!-- #RIGHT ============================ -->
diff --git a/src/ads.html b/src/ads.html
index b9e0e50..7baedba 100644
--- a/src/ads.html
+++ b/src/ads.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html>
+<html ng-app="NomitWisp">
   <head>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
@@ -192,7 +192,7 @@
           </main>
 
         <!-- ### $App Screen Footer ### -->
-        ${require('html-loader!./_footer.html')}
+        <nw-footer></nw-footer>
         </div><!-- page-container -->
         </div>  <!-- App Content -->
   </body>
diff --git a/src/ads_1.html b/src/ads_1.html
index 93e79ba..7d3e5fd 100644
--- a/src/ads_1.html
+++ b/src/ads_1.html
@@ -180,7 +180,6 @@
         </main>
 
         <!-- ### $App Screen Footer ### -->
-        ${require('html-loader!./_footer.html')}
         </div><!-- page-container -->
         </div>  <!-- App Content -->
   </body>
diff --git a/src/assets/scripts/app/index.js b/src/assets/scripts/app/index.js
index 81ab4e5..7fb359b 100644
--- a/src/assets/scripts/app/index.js
+++ b/src/assets/scripts/app/index.js
@@ -1,4 +1,23 @@
-import * as angular from 'angular';
+import angular from 'angular';
+import ngRoute from 'angular-route';
 
 angular.module('NomitWisp', 
-['NomitWisp-Login']);
\ No newline at end of file
+    [
+        'NomitWisp-Login',
+        'NomitWisp-Topbar', 
+        'NomitWisp-Sidebar',
+        'NomitWisp-Footer',
+        'nwDashboard',
+        ngRoute
+        
+    ])
+    .config(function ($routeProvider) { 
+        $routeProvider 
+        .when('/', { 
+            controller: 'DashboardController', 
+            templateUrl: 'assets/scripts/dashboard/dashboard.html' 
+        }) 
+        .otherwise({ 
+            redirectTo: '/' 
+        }); 
+    });
\ No newline at end of file
diff --git a/src/assets/scripts/dashboard/dashboard.html b/src/assets/scripts/dashboard/dashboard.html
new file mode 100644
index 0000000..ce5bf0b
--- /dev/null
+++ b/src/assets/scripts/dashboard/dashboard.html
@@ -0,0 +1,342 @@
+<main class='main-content bgc-grey-300'>
+  <div id='mainContent row'>
+    <div class="row content-title mT-60">
+      <div class="col-8 ml-1 mb-3">
+        Dashboard
+      </div>
+    </div>
+    <div class=" gap-20 masonry pos-r">
+      <!-- #content container ===== -->
+      <div class="masonry-sizer col-md-6"></div>
+      <!-- #NOMIT & REFEREE ===== -->
+      <div class="masonry-item  w-100  visible-nomit visible-referee">
+        <!-- #First line ========= -->
+
+        <div class="row gap-20">
+
+          <div class='col-md-4 '>
+            <!-- #Total Ads Views ==================== -->
+            <div class="layers bd bgc-white p-20 item-box">
+              <div class="layer w-100 mB-10">
+                <h6 class="lh-1">Total Applications</h6>
+              </div>
+              <div class="layer w-100">
+                <div class="peers ai-sb fxw-nw">
+                  <div class="peer peer-greed">
+                    <span id="sparklinedash"></span>
+                  </div>
+                  <div class="peer">
+                    <span class="d-ib lh-0 va-m fw-600 bdrs-10em pX-15 pY-15 bgc-green-50 c-green-500">24K</span>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+
+
+          <div class='col-md-4 '>
+            <!-- #Successful Matches ==================== -->
+            <div class="layers bd bgc-white p-20 item-box">
+              <div class="layer w-100 mB-10">
+                <h6 class="lh-1">Successful Matches</h6>
+              </div>
+              <div class="layer w-100">
+                <div class="peers ai-sb fxw-nw">
+                  <div class="peer peer-greed">
+                    <span id="sparklinedash2"></span>
+                  </div>
+                  <div class="peer">
+                    <span class="d-ib lh-0 va-m fw-600 bdrs-10em pX-15 pY-15 bgc-purple-50 c-purple-500">127</span>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+
+
+          <div class='col-md-4 '>
+            <!-- #New Ads ==================== -->
+            <div class="layers bd bgc-white p-20 item-box">
+              <div class="layer w-100 mB-10">
+                <h6 class="lh-1">New Ads (last month)</h6>
+              </div>
+              <div class="layer w-100">
+                <div class="peers ai-sb fxw-nw">
+                  <div class="peer peer-greed">
+                    <span id="sparklinedash3"></span>
+                  </div>
+                  <div class="peer">
+                    <span class="d-ib lh-0 va-m fw-600 bdrs-10em pX-15 pY-15 bgc-blue-50 c-blue-500">79</span>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="masonry-item col-12 visible-nomit visible-referee">
+        <!-- #New Registered Users ==================== -->
+        <div class="bd bgc-white item-box">
+          <div class="layers">
+            <div class="layer w-100 pX-20 pT-20">
+              <h6 class="lh-1">New Registered Users</h6>
+            </div>
+            <div class="layer w-100 p-20">
+              <canvas id="line-chart" height="220" ng-show="user.role === 'admin'"></canvas>
+            </div>
+            <div class="layer bdT p-20 w-100">
+              <div class="peers ai-c jc-c gapX-20">
+                <div class="peer">
+                  <span class="fsz-def fw-600 mR-10 c-purple-800">COMPANIES </span>
+                </div>
+                <div class="peer fw-600">
+                  <span class="fsz-def fw-600 mR-10 c-cyan-400">USERS </span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="masonry-item w-100 visible-nomit visible-referee">
+        <!-- #Successful Mathches & #Nationality ==================== -->
+        <div class="row gap-20">
+          <div class="col-3 ">
+            <!-- #Successful Mathches %==================== -->
+            <div class="bd bgc-white p-20 peer peer-greed succ-match-perc item-box">
+              <div class="layers">
+                <div class="layer w-100 mB-10">
+                  <h6 class="lh-1">Successful Mathches %</h6>
+                </div>
+                <!-- Pie Charts -->
+                <div class="peers pT-50 mT-20 bdT fxw-nw@lg+ jc-sb ta-c gap-10">
+                  <div class="peer">
+                    <div class="easy-pie-chart" data-size='130' data-percent="75" data-bar-color='#a19ff8'>
+                      <span></span>
+                    </div>
+                    <h6 class="fsz-sm">Matched</h6>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="col-9 ">
+            <!-- #Nationality ==================== -->
+            <div class="bd bgc-white item-box nationality-item">
+              <div class="peers fxw-nw@lg+ ai-s">
+                <div class="peer peer-greed w-70p@lg+ w-100@lg- p-20">
+                  <div class="layers">
+                    <div class="layer w-100 mB-10">
+                      <h6 class="lh-1">Nationality</h6>
+                    </div>
+                    <div class="layer w-100">
+                      <div id="world-map-marker"></div>
+                    </div>
+                  </div>
+                </div>
+                <div class="peer bdL p-20 w-30p@lg+ w-100p@lg-">
+                  <div class="layers">
+                    <div class="layer w-100">
+                      <!-- Progress Bars -->
+                      <div class="layers">
+                        <div class="layer w-100">
+                          <h5 class="mB-5">100k</h5>
+                          <small class="fw-600 c-grey-700">Visitors From USA</small>
+                          <span class="pull-right c-grey-600 fsz-sm">50%</span>
+                          <div class="progress mT-10">
+                            <div class="progress-bar bgc-deep-purple-500 nationality-item-progress-bar" role="progressbar"
+                              aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"> <span class="sr-only">50%
+                                Complete</span></div>
+                          </div>
+                        </div>
+                        <div class="layer w-100 mT-15">
+                          <h5 class="mB-5">1M</h5>
+                          <small class="fw-600 c-grey-700">Visitors From Europe</small>
+                          <span class="pull-right c-grey-600 fsz-sm">80%</span>
+                          <div class="progress mT-10">
+                            <div class="progress-bar bgc-green-500" role="progressbar" aria-valuenow="50" aria-valuemin="0"
+                              aria-valuemax="100" style="width:80%;"> <span class="sr-only">80%
+                                Complete</span></div>
+                          </div>
+                        </div>
+                        <div class="layer w-100 mT-15">
+                          <h5 class="mB-5">450k</h5>
+                          <small class="fw-600 c-grey-700">Visitors From Australia</small>
+                          <span class="pull-right c-grey-600 fsz-sm">40%</span>
+                          <div class="progress mT-10">
+                            <div class="progress-bar bgc-light-blue-500" role="progressbar" aria-valuenow="50"
+                              aria-valuemin="0" aria-valuemax="100" style="width:40%;"> <span class="sr-only">40%
+                                Complete</span></div>
+                          </div>
+                        </div>
+                        <div class="layer w-100 mT-15">
+                          <h5 class="mB-5">1B</h5>
+                          <small class="fw-600 c-grey-700">Visitors From India</small>
+                          <span class="pull-right c-grey-600 fsz-sm">90%</span>
+                          <div class="progress mT-10">
+                            <div class="progress-bar bgc-blue-grey-500" role="progressbar" aria-valuenow="50"
+                              aria-valuemin="0" aria-valuemax="100" style="width:90%;"> <span class="sr-only">90%
+                                Complete</span></div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <!-- #COMPANY / REFEREE / NOMIT ===== -->
+      <div class="masonry-item content-title w-100 visible-company visible-nomit visible-referee">
+        <div class="col-8 ml-1 mb-3">
+          Your Ads
+        </div>
+      </div>
+      <div class="masonry-item col-12 visible-company visible-nomit visible-referee">
+        <!-- #suggested ads ==================== -->
+        <div class="row gap-30">
+
+          <!-- # ad n 1 ==================== -->
+          <div class='col-md-4'>
+            <div class="card item-box">
+              <img class="card-img-top" src="assets/static/images/bg.jpg" alt="Card image cap">
+              <div class="card-body">
+                <h5 class="card-title d-flex" style="justify-content:space-between; margin-bottom:1px; font-weight: bolder; text-align: left;">
+                  <div>Adv title </div>
+                </h5>
+                <h5 class="card-title" style="font-size:11px; margin-top: 1px;">Adv title</h5>
+                <p class="card-text">Some quick example text to build on the card title and make up the bulk of the
+                  card's content.</p>
+              </div>
+              <a href="ads_1.html">
+                <div class="card-body view-more-btn" style="color:#fff; background-color:#EE38A4;  font-weight: bolder; text-align: center; margin: 0px">
+                  VIEW MORE <i class=" ti-angle-right" style="color:#fff;  font-weight: bolder;"></i>
+                </div>
+              </a>
+            </div>
+          </div>
+
+          <!-- # ad n 2 ==================== -->
+          <div class='col-md-4'>
+            <div class="card item-box">
+              <img class="card-img-top" src="assets/static/images/bg.jpg" alt="Card image cap">
+              <div class="card-body">
+                <h5 class="card-title d-flex" style="justify-content:space-between; margin-bottom:1px; font-weight: bolder; text-align: left;">
+                  <div>Adv title </div>
+                </h5>
+                <h5 class="card-title" style="font-size:11px; margin-top: 1px;">Adv title</h5>
+                <p class="card-text">Some quick example text to build on the card title and make up the bulk of the
+                  card's content.</p>
+              </div>
+              <a href="ads_1.html">
+                <div class="card-body view-more-btn" style="color:#fff; background-color:#EE38A4;  font-weight: bolder; text-align: center; margin: 0px">
+                  VIEW MORE <i class=" ti-angle-right" style="color:#fff;  font-weight: bolder;"></i>
+                </div>
+              </a>
+            </div>
+          </div>
+          <!-- # ad n 3 ==================== -->
+          <div class='col-md-4'>
+            <div class="card item-box">
+              <img class="card-img-top" src="assets/static/images/bg.jpg" alt="Card image cap">
+              <div class="card-body">
+                <h5 class="card-title d-flex" style="justify-content:space-between; margin-bottom:1px; font-weight: bolder; text-align: left;">
+                  <div>Adv title </div>
+                </h5>
+                <h5 class="card-title" style="font-size:11px; margin-top: 1px;">Adv title</h5>
+                <p class="card-text">Some quick example text to build on the card title and make up the bulk of the
+                  card's content.</p>
+              </div>
+              <a href="ads_1.html">
+                <div class="card-body view-more-btn" style="color:#fff; background-color:#EE38A4;  font-weight: bolder; text-align: center; margin: 0px">
+                  VIEW MORE <i class=" ti-angle-right" style="color:#fff;  font-weight: bolder;"></i>
+                </div>
+              </a>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="masonry-item  w-100">
+        <button type="button" class="btn btn-gradient "><i class="fa fa-plus pdd-right-5"></i>CREATE NEW AD</button>
+      </div>
+
+
+      <!-- #USERS ===== -->
+      <div class="masonry-item col-12 visible-user">
+        <!-- #suggested ads ==================== -->
+        <div class="row gap-30">
+
+          <!-- # ad n 1 ==================== -->
+          <div class='col-md-4'>
+            <div class="card item-box">
+              <img class="card-img-top" src="assets/static/images/bg.jpg" alt="Card image cap">
+              <div class="card-body">
+                <h5 class="card-title d-flex" style="justify-content:space-between; margin-bottom:1px; font-weight: bolder; text-align: left;">
+                  <div>Adv title </div>
+                  <div>
+                    <a class='' href=""> <span class="icon-holder" style="color:#EE38A4"><i class="fa fa-heart"></i></span></a>
+                  </div>
+                </h5>
+                <h5 class="card-title" style="font-size:11px; margin-top: 1px;">Adv title</h5>
+                <p class="card-text">Some quick example text to build on the card title and make up the bulk of the
+                  card's content.</p>
+              </div>
+              <a href="ads_1.html">
+                <div class="card-body view-more-btn" style="color:#fff; background-color:#EE38A4;  font-weight: bolder; text-align: center; margin: 0px">
+                  VIEW MORE <i class=" ti-angle-right" style="color:#fff;  font-weight: bolder;"></i>
+                </div>
+              </a>
+            </div>
+          </div>
+
+          <!-- # ad n 2 ==================== -->
+          <div class='col-md-4'>
+            <div class="card item-box">
+              <img class="card-img-top" src="assets/static/images/bg.jpg" alt="Card image cap">
+              <div class="card-body">
+                <h5 class="card-title d-flex" style="justify-content:space-between; margin-bottom:1px; font-weight: bolder; text-align: left;">
+                  <div>Adv title </div>
+                  <div>
+                    <a class='' href=""> <span class="icon-holder" style="color:#EE38A4"><i class="fa fa-heart"></i></span></a>
+                  </div>
+                </h5>
+                <h5 class="card-title" style="font-size:11px; margin-top: 1px;">Adv title</h5>
+                <p class="card-text">Some quick example text to build on the card title and make up the bulk of the
+                  card's content.</p>
+              </div>
+              <a href="ads_1.html">
+                <div class="card-body view-more-btn" style="color:#fff; background-color:#EE38A4;  font-weight: bolder; text-align: center; margin: 0px">
+                  VIEW MORE <i class=" ti-angle-right" style="color:#fff;  font-weight: bolder;"></i>
+                </div>
+              </a>
+            </div>
+          </div>
+          <!-- # ad n 3 ==================== -->
+          <div class='col-md-4'>
+            <div class="card item-box">
+              <img class="card-img-top" src="assets/static/images/bg.jpg" alt="Card image cap">
+              <div class="card-body">
+                <h5 class="card-title d-flex" style="justify-content:space-between; margin-bottom:1px; font-weight: bolder; text-align: left;">
+                  <div>Adv title </div>
+                  <div>
+                    <a class='' href=""> <span class="icon-holder" style="color:#EE38A4"><i class="fa fa-heart"></i></span></a>
+                  </div>
+                </h5>
+                <h5 class="card-title" style="font-size:11px; margin-top: 1px;">Adv title</h5>
+                <p class="card-text">Some quick example text to build on the card title and make up the bulk of the
+                  card's content.</p>
+              </div>
+              <a href="ads_1.html">
+                <div class="card-body view-more-btn" style="color:#fff; background-color:#EE38A4;  font-weight: bolder; text-align: center; margin: 0px">
+                  VIEW MORE <i class=" ti-angle-right" style="color:#fff;  font-weight: bolder;"></i>
+                </div>
+              </a>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</main>
diff --git a/src/assets/scripts/dashboard/index.js b/src/assets/scripts/dashboard/index.js
new file mode 100644
index 0000000..c7b5954
--- /dev/null
+++ b/src/assets/scripts/dashboard/index.js
@@ -0,0 +1,14 @@
+import angular from 'angular';
+
+angular.module('nwDashboard', [])
+    .controller('DashboardController', DashboardController);
+
+/** @ngInject */
+function DashboardController($scope){
+    // service carica dashboard
+    // jquery per grafici
+    $scope.user = {
+        role : 'admin'
+    };
+
+}
\ No newline at end of file
diff --git a/src/assets/scripts/footer/index.js b/src/assets/scripts/footer/index.js
deleted file mode 100644
index 2efde72..0000000
--- a/src/assets/scripts/footer/index.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import * as angular from 'angular';
-// const angular = require('angular');
-
-angular.module('NomitWisp', [])
-    .directive('nwFooter', nwFooter);
-
-function nwFooter(){
-    return {
-        restrict: 'E',
-        templateUrl: 'assets/scripts/footer/footer.html'
-    }
-}
\ No newline at end of file
diff --git a/src/assets/scripts/index.js b/src/assets/scripts/index.js
index ff6c5d3..3d66609 100755
--- a/src/assets/scripts/index.js
+++ b/src/assets/scripts/index.js
@@ -1,5 +1,6 @@
 import '../styles/index.scss';
 
+import 'babel-polyfill';
 import './masonry';
 import './charts';
 import './popover';
@@ -17,5 +18,8 @@ import './googleMaps';
 import './utils';
 import './user-form';
 import './login';
-import './app';
-import './footer';
\ No newline at end of file
+import './nwFooter';
+import './nwSidebar';
+import './nwTopbar';
+import './dashboard'
+import './app';
\ No newline at end of file
diff --git a/src/assets/scripts/login/controller.js b/src/assets/scripts/login/controller.js
index 69cbcdb..c641f51 100644
--- a/src/assets/scripts/login/controller.js
+++ b/src/assets/scripts/login/controller.js
@@ -1,4 +1,3 @@
-import 'babel-polyfill';
 const LoginController = ($scope, LoginService, $cookies) => {
 	$scope.userLogged = false;		
 	
diff --git a/src/assets/scripts/nwFooter/index.js b/src/assets/scripts/nwFooter/index.js
new file mode 100644
index 0000000..ff8cb93
--- /dev/null
+++ b/src/assets/scripts/nwFooter/index.js
@@ -0,0 +1,12 @@
+import angular from 'angular';
+
+angular.module('NomitWisp-Footer', [])
+    .directive('nwFooter', nwFooter);
+    
+/** @ngInject */
+function nwFooter (){
+    return {
+        restrict: 'E',
+        templateUrl: 'assets/scripts/nwFooter/nwFooter.html'
+    }
+}
\ No newline at end of file
diff --git a/src/assets/scripts/footer/footer.html b/src/assets/scripts/nwFooter/nwFooter.html
similarity index 100%
rename from src/assets/scripts/footer/footer.html
rename to src/assets/scripts/nwFooter/nwFooter.html
diff --git a/src/assets/scripts/nwSidebar/index.js b/src/assets/scripts/nwSidebar/index.js
new file mode 100644
index 0000000..1556ac9
--- /dev/null
+++ b/src/assets/scripts/nwSidebar/index.js
@@ -0,0 +1,12 @@
+import angular from 'angular';
+
+angular.module('NomitWisp-Sidebar', [])
+    .directive('nwSidebar', nwSidebar);
+
+/** @ngInject */
+function nwSidebar(){
+    return {
+        restrict: 'E',
+        templateUrl: 'assets/scripts/nwSidebar/nwSidebar.html'
+    };
+}
\ No newline at end of file
diff --git a/src/assets/scripts/nwSidebar/nwSidebar.html b/src/assets/scripts/nwSidebar/nwSidebar.html
new file mode 100644
index 0000000..a331b2d
--- /dev/null
+++ b/src/assets/scripts/nwSidebar/nwSidebar.html
@@ -0,0 +1,230 @@
+    <!-- #Left Sidebar ==================== -->
+    <div class="sidebar">
+      <div class="sidebar-inner ">
+        <!-- ### $Sidebar Header ### -->
+        <div class="sidebar-logo">
+          <div class="peers ai-c fxw-nw">
+            <div class="peer peer-greed">
+              <a class="sidebar-link td-n" href="index.html">
+                <div class="peers ai-c fxw-nw">
+                  <div class="peer">
+                    <div class="logo">
+                      
+                    <svg version="1.1" id="Layer_2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+                        viewBox="0 0 105.6869278 99.4877319" style="enable-background:new 0 0 105.6869278 99.4877319;" xml:space="preserve">
+                     <style type="text/css">
+                       .logost0{fill:url(#LOGOSVGID_1_);}
+                       .logost1{fill:url(#LOGOSVGID_2_);}
+                       .logost2{fill:url(#LOGOSVGID_3_);}
+                       .logost3{fill:url(#LOGOSVGID_4_);}
+                       .logost4{fill:url(#LOGOSVGID_5_);}
+                       .logost5{fill:url(#LOGOSVGID_6_);}
+                       .logost6{fill:url(#LOGOSVGID_7_);}
+                       .logost7{fill:url(#LOGOSVGID_8_);}
+                       .logost8{fill:url(#LOGOSVGID_9_);}
+                       .logost9{fill:url(#LOGOSVGID_10_);}
+                       .logost10{fill:url(#LOGOSVGID_11_);}
+                       .logost11{fill:#FFFFFF;}
+                       .logost12{fill:url(#LOGOSVGID_12_);}
+                       .logost13{fill:url(#LOGOSVGID_13_);}
+                       .logost14{fill:url(#LOGOSVGID_14_);}
+                       .logost15{fill:url(#LOGOSVGID_15_);}
+                       .logost16{fill:url(#LOGOSVGID_16_);}
+                       .logost17{fill:url(#LOGOSVGID_17_);}
+                       .logost18{fill:url(#LOGOSVGID_18_);}
+                       .logost19{fill:url(#LOGOSVGID_19_);}
+                     </style>
+                     <g>
+                       <g>
+                         <linearGradient id="LOGOSVGID_1_" gradientUnits="userSpaceOnUse" x1="14.6859789" y1="5.9550242" x2="40.6093216" y2="50.8555679">
+                           <stop  offset="0" style="stop-color:#8B00B1"/>
+                           <stop  offset="0" style="stop-color:#FFFFFF"/>
+                           <stop  offset="0.3073062" style="stop-color:#FDFDFD"/>
+                           <stop  offset="0.4651366" style="stop-color:#F5F5F5"/>
+                           <stop  offset="0.5889232" style="stop-color:#E8E8E8"/>
+                           <stop  offset="0.6943781" style="stop-color:#D5D5D5"/>
+                           <stop  offset="0.7869266" style="stop-color:#BDBDBD"/>
+                           <stop  offset="0.8250626" style="stop-color:#BABABA"/>
+                           <stop  offset="1" style="stop-color:#B8B8B8"/>
+                         </linearGradient>
+                         <path class="logost0" d="M34.0411263,51.2930908l-0.000946,0.000946c0.133606-0.133606,0.2475319-0.267025,0.3764076-0.400631
+                           l-6.2885551-6.2883644l-1.0298615-1.0298615L11.6509991,28.1280079l4.1192579-4.119257l12.3577757-12.3577757l4.1192589,4.1192579
+                           l10.4199219,10.4199238l5.6803284-5.6805153l-5.6803284,5.6805153l0,0l7.8507576-7.8509464l0.3875732-0.3875694
+                           L36.3665504,3.4125531c-4.5501671-4.5500708-11.9270592-4.5500708-16.4770355,0L3.412482,19.889492
+                           c-4.5499759,4.5499763-4.5499759,11.9269619,0,16.4770317l16.4770336,16.4769402
+                           c4.5499763,4.549881,11.9268684,4.549881,16.4770355,0v-0.0000954l-1.937851-1.937851L34.0411263,51.2930908z"/>
+                         <path class="logost11" d="M102.2743073,19.889492L85.7972717,3.4125531l-8.238327,8.2384224l12.3577728,12.3577757l4.119072,4.119257
+                           L81.6781998,40.4857826l-4.1192551,4.1192589L63.3077888,30.3538876l-0.3875694,0.3875713l-7.8507576,7.8509445
+                           l14.2509651,14.2509651v0.0000954c4.5499725,4.549881,11.9270554,4.549881,16.4768448,0l16.4770355-16.4769402
+                           C106.8244705,31.8164539,106.8244705,24.4394684,102.2743073,19.889492z"/>
+                         <g>
+                           <linearGradient id="LOGOSVGID_2_" gradientUnits="userSpaceOnUse" x1="24.0086803" y1="56.9627228" x2="81.6780624" y2="-0.7066581">
+                             <stop  offset="0" style="stop-color:#8B00B1"/>
+                             <stop  offset="0" style="stop-color:#FFFFFF"/>
+                             <stop  offset="0.3235791" style="stop-color:#FDFDFD"/>
+                             <stop  offset="0.5064212" style="stop-color:#F4F4F4"/>
+                             <stop  offset="0.6542051" style="stop-color:#E7E7E7"/>
+                             <stop  offset="0.7824864" style="stop-color:#D3D3D3"/>
+                             <stop  offset="0.885314" style="stop-color:#BDBDBD"/>
+                             <stop  offset="0.9058406" style="stop-color:#BABABA"/>
+                             <stop  offset="1" style="stop-color:#B8B8B8"/>
+                           </linearGradient>
+                           <path class="logost1" d="M69.3204269,3.4125531L52.8433952,19.889492l-8.2383308,8.2385159l-1.0298615,1.0298634
+                             L28.1280327,44.6050415l-8.2385178,8.2385178c4.5497875,4.5495033,11.9257336,4.5496902,16.4760895,0.0007553l0.000946-0.000946
+                             l24.7153587-24.7153606l15.4471741-15.4471712l1.0298615-1.0298615l8.238327-8.2384224
+                             C81.2474823-1.1375177,73.8703995-1.1375177,69.3204269,3.4125531z"/>
+                           <linearGradient id="LOGOSVGID_3_" gradientUnits="userSpaceOnUse" x1="44.6050186" y1="28.1279621" x2="50.673008" y2="22.0599709">
+                             <stop  offset="0" style="stop-color:#8B00B1"/>
+                             <stop  offset="0" style="stop-color:#FFFFFF"/>
+                             <stop  offset="0.3235791" style="stop-color:#FDFDFD"/>
+                             <stop  offset="0.5064212" style="stop-color:#F4F4F4"/>
+                             <stop  offset="0.6542051" style="stop-color:#E7E7E7"/>
+                             <stop  offset="0.7824864" style="stop-color:#D3D3D3"/>
+                             <stop  offset="0.885314" style="stop-color:#BDBDBD"/>
+                             <stop  offset="0.9058406" style="stop-color:#BABABA"/>
+                             <stop  offset="1" style="stop-color:#B8B8B8"/>
+                           </linearGradient>
+                           <polygon class="logost2" points="44.6050644,28.1279144 44.6050644,28.1280079 50.6729622,22.0599232 			"/>
+                         </g>
+                       </g>
+                       <g>
+                         <path class="logost11" d="M39.1436119,81.5978546c0,1.7324905-0.7470245,3.3397293-2.2410698,4.8207779
+                           c-1.4940453,1.4819946-3.1073112,2.2220459-4.839798,2.2220459h-1.7324848c-0.9543877,0-2.0590687-0.3452988-3.314043-1.0361938
+                           c-0.2764874-0.1534653-0.6785355-0.4737091-1.2055092-0.9597778h-0.1128788
+                           c-0.3766823,0.460701-1.0672665,0.9087296-2.0717525,1.3434296c-1.0044861,0.4356613-1.820631,0.6525421-2.4478016,0.6525421
+                           h-1.6950703c-1.7324848,0-3.3394089-0.741951-4.8207722-2.2274399c-1.4819975-1.4845352-2.2220449-3.0952606-2.2220449-4.831871
+                           v-6.7580872c0.3259506-1.3589706,1.1420956-2.0387726,2.4484348-2.0387726c1.3799009,0,2.2087278,0.7188034,2.4852152,2.1545105
+                           v6.5380325c0,0.428688,0.2454147,0.9074631,0.7349739,1.4366608c0.4895611,0.5288773,0.9474144,0.7933121,1.3741932,0.7933121
+                           h1.6950703c0.3766823,0,0.8218536-0.2571411,1.3367786-0.7720718c0.5149269-0.5142899,0.7723885-0.9604111,0.7723885-1.3370972
+                           v-6.7419128c0.3513165-1.3805313,1.1795101-2.071434,2.4858513-2.071434c1.2549725,0,2.0711174,0.6909027,2.4477997,2.071434
+                           v6.7419128c0,0.3766861,0.2587318,0.8228073,0.7768288,1.3370972c0.5180969,0.5149307,0.9670715,0.7720718,1.3462906,0.7720718
+                           h1.74263c0.3792191,0,0.8275604-0.2571411,1.3456573-0.7720718c0.5174637-0.5142899,0.777462-0.9604111,0.777462-1.3370972
+                           v-6.7419128c0.372879-1.3805313,1.2086792-2.071434,2.5042381-2.071434c1.2448273,0,2.0552673,0.6909027,2.4294128,2.071434
+                           V81.5978546z"/>
+                         <path class="logost11" d="M50.1029091,86.4887009c-0.2764854,1.4347534-1.1046791,2.1519775-2.4852142,2.1519775
+                           c-1.305706,0-2.1224823-0.6788559-2.4484329-2.0384598V74.8232803c0.3259506-1.3589706,1.1427269-2.0387726,2.4484329-2.0387726
+                           c1.3805351,0,2.2087288,0.7175369,2.4852142,2.1522903V86.4887009z"/>
+                         <path class="logost11" d="M72.098877,87.6992874c0,1.2559204-0.6087799,2.4858475-1.8263397,3.69104
+                           c-1.2188263,1.2051926-2.4547806,1.8076324-3.7097473,1.8076324h-2.7496567
+                           c-1.3558044-0.3519516-2.0343399-1.1798248-2.0343399-2.4855347c0-1.2552872,0.6734619-2.0717468,2.0203896-2.4481125h2.2816505
+                           c0.7222977-0.2260742,1.0843887-0.6902695,1.0843887-1.3935394c0-0.7279968-0.3633652-1.2051926-1.088829-1.4312668h-4.2411613
+                           c-1.2511673,0-2.4839478-0.6103592-3.6970673-1.8320389c-1.2131195-1.2210541-1.8199959-2.4617538-1.8199959-3.7208481v-1.6243668
+                           c0-1.2841415,0.6214638-2.531189,1.8643875-3.7398682c1.2422905-1.2086868,2.5042381-1.8130264,3.7852135-1.8130264h2.5987282
+                           c1.4052658,0.2742691,2.109169,1.1091232,2.109169,2.5045547c0,1.2711487-0.6607819,2.0809479-1.982338,2.4294128h-2.3564873
+                           c-0.7235603,0.2064133-1.085022,0.683609-1.085022,1.430954c0,0.72229,0.3627319,1.1994858,1.088829,1.4312592H66.58181
+                           c1.2505341,0,2.4833145,0.6091003,3.696434,1.8266602c1.2131195,1.2181931,1.8206329,2.4544601,1.8206329,3.7097473V87.6992874z"
+                           />
+                         <path class="logost11" d="M93.2653732,81.5642471c0,1.7407303-0.7432175,3.3555832-2.2296524,4.8439178
+                           c-1.4864349,1.4886551-3.0997009,2.2325134-4.8385239,2.2325134h-1.7007828c-0.5035095,0-1.1966324-0.1880264-2.0787277-0.5647125
+                           v9.2651825c-0.2764893,1.4309464-1.1046829,2.1465836-2.4852142,2.1465836c-1.3057022,0-2.1224823-0.6791687-2.4484329-2.0365601
+                           V74.7836456c0-0.175972,0.0875092-0.4147263,0.2638016-0.7165833c0.5517044-0.9052429,1.2809753-1.3577042,2.1846313-1.3577042
+                           c0.6525345,0,1.2549744,0.2764893,1.8079453,0.8285141c1.1300507-0.5520248,2.0584412-0.8285141,2.786438-0.8285141h1.6957016
+                           c1.7324905,0,3.3387756,0.7444916,4.8207779,2.2325134c1.4813614,1.4889679,2.2220383,3.1031876,2.2220383,4.8439178V81.5642471z
+                            M88.3317261,81.5579071v-1.8038254c0-0.4350281-0.2638016-0.8957291-0.7914124-1.3818054
+                           c-0.5276108-0.4860687-1.0044861-0.7289505-1.4312668-0.7289505h-1.4686813c-0.4274139,0-0.903656,0.2492218-1.4312668,0.748291
+                           c-0.5276108,0.4990768-0.7914124,0.9658051-0.7914124,1.4008255v1.7654648c0,0.3836594,0.2574615,0.8380203,0.7723923,1.3621445
+                           c0.5149231,0.5250702,0.9607315,0.786972,1.3367767,0.786972h1.6957016c0.3766861,0,0.8218536-0.2619019,1.3367767-0.786972
+                           C88.0736313,82.3959274,88.3317261,81.9415665,88.3317261,81.5579071z"/>
+                       </g>
+                     </g>
+                     </svg>
+                     
+
+                    </div>
+                  </div>
+                </div>
+              </a>
+            </div>
+            <div class="peer">
+              <div class="mobile-toggle sidebar-toggle">
+                <a href="" class="td-n">
+                  <i class="ti-arrow-circle-left"></i>
+                </a>
+              </div>
+            </div>
+          </div>
+        </div>
+
+<!-- ### $Sidebar Menu ### -->
+<ul class="sidebar-menu scrollable pos-r">
+  <li class="nav-item mT-30 active">
+    <a class="sidebar-link" href="index.html">
+      <span class="icon-holder">
+        <i class="c-white-500 fa fa-bar-chart text-white"></i>
+      </span>
+      <span class="title text-white font-weight-bold">Dashboard</span>
+    </a>
+  </li>
+  <li class="nav-item">
+    <a class='sidebar-link' href="ads.html">
+      <span class="icon-holder">
+        <i class="c-white-500 fa fa-briefcase text-white"></i>
+      </span>
+      <span class="title text-white font-weight-bold">My Ads</span>
+    </a>
+  </li>
+
+  <li class="nav-item">
+    <a class='sidebar-link' href="profile.html">
+      <span class="icon-holder">
+        <i class="c-white-500 fa fa-user-circle-o text-white"></i>
+      </span>
+      <span class="title text-white font-weight-bold">Profile</span>
+    </a>
+  </li>
+
+  <li class="nav-item">
+    <a class='sidebar-link' href="users.html">
+      <span class="icon-holder">
+        <i class="c-white-500 fa fa-users text-white"></i>
+      </span>
+      <span class="title text-white font-weight-bold">Users</span>
+    </a>
+  </li>
+  <li class="nav-item">
+    <a class='sidebar-link' href="companies.html">
+      <span class="icon-holder">
+        <i class="c-white-500 fa fa-building text-white"></i>
+      </span>
+      <span class="title text-white font-weight-bold">Companies</span>
+    </a>
+  </li>
+  <li class="nav-item">
+    <a class='sidebar-link' href="referees.html">
+      <span class="icon-holder">
+        <i class="c-white-500 fa fa-anchor text-white"></i>
+      </span>
+      <span class="title text-white font-weight-bold">Referees</span>
+    </a>
+  </li>
+  <li class="nav-item">
+    <a class='sidebar-link' href="reports.html">
+      <span class="icon-holder">
+        <i class="c-white-500 fa fa-calendar-check-o text-white"></i>
+      </span>
+      <span class="title text-white font-weight-bold">Reports</span>
+    </a>
+  </li>
+  <li class="nav-item">
+    <a class='sidebar-link' href="#">
+      <span class="icon-holder">
+        <i class="c-white-500 fa fa-history text-white"></i>
+      </span>
+      <span class="title text-white font-weight-bold">History</span>
+    </a>
+  </li>
+
+  <div class="mx-auto" style="width: 40px;">
+      <br>
+  <input type="checkbox" class="switch">
+  
+  </div>
+
+</ul>
+
+
+
+
+
+</div>
+</div>
diff --git a/src/assets/scripts/nwTopbar/index.js b/src/assets/scripts/nwTopbar/index.js
new file mode 100644
index 0000000..f6eeb57
--- /dev/null
+++ b/src/assets/scripts/nwTopbar/index.js
@@ -0,0 +1,12 @@
+import angular from 'angular';
+
+angular.module('NomitWisp-Topbar', [])
+    .directive('nwTopbar', nwTopbar);
+
+/** @ngInject */
+function nwTopbar(){
+    return {
+        restrict: 'E',
+        templateUrl: 'assets/scripts/nwTopbar/nwTopbar.html'
+    };
+}
\ No newline at end of file
diff --git a/src/assets/scripts/nwTopbar/nwTopbar.html b/src/assets/scripts/nwTopbar/nwTopbar.html
new file mode 100644
index 0000000..e2efc89
--- /dev/null
+++ b/src/assets/scripts/nwTopbar/nwTopbar.html
@@ -0,0 +1,265 @@
+<!-- ### $Topbar ### -->
+<div class="header navbar topbar">
+  <div class="header-container">
+    <!-- #LEFT ============================ -->
+    <ul class="nav-left">
+      <li>
+        <a id="sidebar-toggle" class="sidebar-toggle" href="javascript:void(0);">
+          <i class="ti-menu"></i>
+        </a>
+      </li>
+      <li class="search-box visible-nomit visible-referee">
+        <a class="search-toggle no-pdd-right" href="javascript:void(0);">
+          <i class="search-icon ti-search pdd-right-10"></i>
+          <i class="search-icon-close ti-close pdd-right-10"></i>
+        </a>
+      </li>
+      <li class="search-input visible-referee visible-nomit">
+        <input class="form-control" type="text" placeholder="Search users, companies, or anything..">
+      </li>
+      <li class="visible-nomit ml-2">
+        <button type="button" class="btn btn-gradient ">
+          <i class="fa fa-plus pdd-right-5 text-white"></i>
+          ADD NEW USER
+        </button>
+      </li>
+      <li class="visible-referee visible-nomit visible-company ml-2">
+        <button type="button" class="btn btn-gradient">
+          <i class="fa fa-plus pdd-right-5 text-white"></i>
+          CREATE NEW AD
+        </button>
+      </li>
+    </ul>
+    <ul class="nav-right">
+      <!-- #RIGHT ============================ -->
+
+      <!-- #account ============================ -->
+
+      <li class="dropdown">
+        <a href="" class="dropdown-toggle no-after peers fxw-nw ai-c lh-1" data-toggle="dropdown">
+          <div class="peer">
+            <span class="fsz-sm c-grey-900  visible-nomit">Nomit Admin</span>
+            <span class="fsz-sm c-grey-900  visible-referee">Referee Admin</span>
+            <span class="fsz-sm c-grey-900  visible-user visible-company">Username</span>
+          </div>
+          <div class="peer mR-10 visible-nomit">
+            <img class=" w-2r bdrs-50p mL-10 nomit-logo-top" src="assets/static/images/nomit-logo.png" alt="">
+          </div>
+          <div class="peer mR-10 visible-referee visible-user visible-company">
+            <img class=" w-2r bdrs-50p mL-10 nomit-logo-top" src="assets/static/images/user-update.png" alt="">
+          </div>
+
+        </a>
+        <ul class="dropdown-menu fsz-sm">
+          <li>
+            <a href="" class="d-b td-n pY-5 bgcH-grey-100 c-grey-700">
+              <i class="ti-user mR-10"></i>
+              <span>Profile</span>
+            </a>
+          </li>
+          <li role="separator" class="divider"></li>
+          <li>
+            <a href="" class="d-b td-n pY-5 bgcH-grey-100 c-grey-700">
+              <i class="ti-power-off mR-10"></i>
+              <span>Logout</span>
+            </a>
+          </li>
+        </ul>
+      </li>
+      <li>
+        <!-- #vertical line ============================ -->
+        <div class="verticalLine"> </div>
+      </li>
+      <li>
+        <!-- #logo wisp ============================ -->
+        <div class="peer logo-top-bar">
+          <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
+            x="0px" y="0px" viewBox="0 0 138.8360748 39.8824463" style="enable-background:new 0 0 138.8360748 39.8824463;"
+            xml:space="preserve">
+            <style type="text/css">
+              .st0 {
+                fill: url(#SVGID_1_);
+              }
+
+              .st1 {
+                fill: url(#SVGID_2_);
+              }
+
+              .st2 {
+                fill: url(#SVGID_3_);
+              }
+
+              .st3 {
+                fill: url(#SVGID_4_);
+              }
+
+              .st4 {
+                fill: url(#SVGID_5_);
+              }
+
+              .st5 {
+                fill: url(#SVGID_6_);
+              }
+
+              .st6 {
+                fill: url(#SVGID_7_);
+              }
+
+              .st7 {
+                fill: url(#SVGID_8_);
+              }
+
+              .st8 {
+                fill: url(#SVGID_9_);
+              }
+
+              .st9 {
+                fill: url(#SVGID_10_);
+              }
+
+              .st10 {
+                fill: url(#SVGID_11_);
+              }
+
+              .st11 {
+                fill: #FFFFFF;
+              }
+
+              .st12 {
+                fill: url(#SVGID_12_);
+              }
+
+              .st13 {
+                fill: url(#SVGID_13_);
+              }
+
+              .st14 {
+                fill: url(#SVGID_14_);
+              }
+
+              .st15 {
+                fill: url(#SVGID_15_);
+              }
+
+              .st16 {
+                fill: url(#SVGID_16_);
+              }
+
+              .st17 {
+                fill: url(#SVGID_17_);
+              }
+
+              .st18 {
+                fill: url(#SVGID_18_);
+              }
+
+              .st19 {
+                fill: url(#SVGID_19_);
+              }
+
+            </style>
+            <g>
+              <g>
+                <linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="13.806386" y1="30.5149899" x2="13.806386"
+                  y2="0.0000301">
+                  <stop offset="0" style="stop-color:#8B00B1" />
+                  <stop offset="0" style="stop-color:#EE38A4" />
+                  <stop offset="0.0866544" style="stop-color:#C832A9" />
+                  <stop offset="0.1996946" style="stop-color:#9D2AAF" />
+                  <stop offset="0.3094908" style="stop-color:#7C24B3" />
+                  <stop offset="0.4136127" style="stop-color:#6420B6" />
+                  <stop offset="0.5097673" style="stop-color:#551EB8" />
+                  <stop offset="0.5903056" style="stop-color:#501DB9" />
+                  <stop offset="0.6045721" style="stop-color:#501DB9" />
+                  <stop offset="0.7748037" style="stop-color:#501DB9" />
+                  <stop offset="0.8825542" style="stop-color:#7311B4" />
+                  <stop offset="1" style="stop-color:#9506B0" />
+                  <stop offset="1" style="stop-color:#9103B0" />
+                </linearGradient>
+                <path class="st0" d="M18.4649811,27.823019l-0.0005131,0.0005131c0.0724716-0.0724716,0.1342678-0.1448421,0.204174-0.2173138
+			l-3.4111109-3.4110069l-0.558629-0.55863L6.319869,15.2575493l2.234416-2.234416l6.7032461-6.7032471l2.234416,2.234416
+			l5.6520958,5.6520948l3.0811882-3.0812902l-3.0811882,3.0812902l0,0l4.2584972-4.2586002L27.612772,9.737566l-7.8864098-7.8864594
+			c-2.468153-2.4681017-6.4696112-2.4681017-8.9376621,0l-8.9376621,8.9376106c-2.4680505,2.468051-2.4680505,6.4695606,0,8.9376621
+			l8.9376621,8.9376125c2.468051,2.4679985,6.4695091,2.4679985,8.9376621,0v-0.0000515l-1.0511513-1.0511513L18.4649811,27.823019z" />
+                <linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="49.3865204" y1="27.2705288" x2="37.6677437"
+                  y2="6.9730129">
+                  <stop offset="0" style="stop-color:#8B00B1" />
+                  <stop offset="0" style="stop-color:#EE38A4" />
+                  <stop offset="0.5092942" style="stop-color:#9103B0" />
+                  <stop offset="1" style="stop-color:#501DB9" />
+                  <stop offset="1" style="stop-color:#9506B0" />
+                </linearGradient>
+                <path class="st1" d="M55.4768066,10.7887173l-8.9376602-8.9376106l-4.4687309,4.4687796l6.7032471,6.7032471l2.234314,2.234416
+			l-6.7031441,6.7032471l-2.234417,2.2344151l-7.7302742-7.7302761l-0.2102318,0.2102318l-4.2584972,4.2586002l7.7301731,7.7301731
+			v0.0000515c2.4680519,2.4679985,6.4696121,2.4679985,8.937561,0l8.9376602-8.9376125
+			C57.9449615,17.2582779,57.9449615,13.2567682,55.4768066,10.7887173z" />
+                <g>
+                  <linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="10.7887001" y1="15.2575035" x2="46.5391464"
+                    y2="15.2575035">
+                    <stop offset="0" style="stop-color:#8B00B1" />
+                    <stop offset="0" style="stop-color:#EE38A4" />
+                    <stop offset="0.1175187" style="stop-color:#D634A7" />
+                    <stop offset="0.4183493" style="stop-color:#9D2AAF" />
+                    <stop offset="0.6763742" style="stop-color:#7323B4" />
+                    <stop offset="0.8785662" style="stop-color:#591FB8" />
+                    <stop offset="1" style="stop-color:#501DB9" />
+                  </linearGradient>
+                  <path class="st2" d="M37.6015854,1.8511064l-8.9376621,8.9376106l-4.468729,4.468832l-0.55863,0.558629l-8.3790331,8.3790331
+				l-4.4688311,4.468832c2.467948,2.4677925,6.4688931,2.4678955,8.937149,0.0004101l0.0005131-0.0005131l13.4063931-13.4063911
+				l8.3790321-8.379034l0.5586281-0.5586295l4.4687309-4.4687796C44.0711975-0.6169954,40.0696373-0.6169954,37.6015854,1.8511064z" />
+                  <linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="24.1951942" y1="13.6117887" x2="27.4866123"
+                    y2="13.6117887">
+                    <stop offset="0" style="stop-color:#8B00B1" />
+                    <stop offset="0" style="stop-color:#EE38A4" />
+                    <stop offset="0.1175187" style="stop-color:#D634A7" />
+                    <stop offset="0.4183493" style="stop-color:#9D2AAF" />
+                    <stop offset="0.6763742" style="stop-color:#7323B4" />
+                    <stop offset="0.8785662" style="stop-color:#591FB8" />
+                    <stop offset="1" style="stop-color:#501DB9" />
+                  </linearGradient>
+                  <polygon class="st3" points="24.1951942,15.2574978 24.1951942,15.2575493 27.4866123,11.9660282" />
+                </g>
+              </g>
+              <linearGradient id="SVGID_5_" gradientUnits="userSpaceOnUse" x1="77.3990173" y1="-7.8904157" x2="122.914917"
+                y2="37.6254807">
+                <stop offset="0" style="stop-color:#8B00B1" />
+                <stop offset="0" style="stop-color:#EE38A4" />
+                <stop offset="0.0727272" style="stop-color:#D634A7" />
+                <stop offset="0.2166433" style="stop-color:#AD2DAD" />
+                <stop offset="0.3643613" style="stop-color:#8C27B1" />
+                <stop offset="0.5144968" style="stop-color:#7123B5" />
+                <stop offset="0.6680248" style="stop-color:#5F20B7" />
+                <stop offset="0.8269761" style="stop-color:#541EB9" />
+                <stop offset="1" style="stop-color:#501DB9" />
+              </linearGradient>
+              <path class="st4" d="M73.7269974,4.3174438v5.8997192v11.3051758v5.3615112
+		c-0.4117432,2.0700073-1.6452637,3.1047974-3.7012939,3.1047974c-1.9445801,0-3.1610107-0.9794312-3.6466064-2.94104v-5.3562012
+		V10.0534058V4.1483765c0.4855957-2.0239868,1.7020264-3.036438,3.6466064-3.036438
+		C72.0817337,1.1119385,73.3152542,2.180603,73.7269974,4.3174438z M106.2809982,19.8569603
+		c0-1.8695717-0.9047928-3.7108078-2.7115402-5.5251274c-1.8067474-1.8133755-3.6427689-2.7205353-5.5052414-2.7205353h-6.3165283
+		c-1.0814056-0.3452024-1.6216354-1.055913-1.6216354-2.1316605c0-1.1130533,0.5383453-1.8237638,1.6159668-2.1311879h3.5096054
+		c1.9682465-0.5189838,2.9523697-1.7250671,2.9523697-3.6182499c0-2.0782979-1.0483475-3.3216877-3.1412582-3.7301693h-3.8703918
+		c-1.9077988,0-3.7872696,0.9000763-5.6374664,2.7002289c-1.8511353,1.8001525-2.7767029,3.6574452-2.7767029,5.5699892v2.4192505
+		c0,1.8752375,0.9038467,3.7230854,2.7105942,5.5416546c1.8067474,1.8195152,3.6427689,2.7285633,5.5061874,2.7285633h6.3165283
+		c1.0804596,0.3367023,1.6216354,1.0474129,1.6216354,2.1316605c0,1.0474129-0.5392838,1.7387619-1.6150208,2.0754642h-3.3981628
+		c-2.0060272,0.5605412-3.0090408,1.7765408-3.0090408,3.6461124c0,1.9446564,1.0105743,3.1776562,3.0298233,3.7018356h4.0951614
+		c1.8690872,0,3.7098312-0.8972435,5.5250778-2.6922016c1.8133621-1.7949581,2.7200394-3.6267509,2.7200394-5.4972649V19.8569603z
+		 M138.8360748,10.5393066v2.6487427c0,2.5925903-1.1069336,4.9976807-3.3208008,7.2142944
+		c-2.2138672,2.2171631-4.6164551,3.3250122-7.2062988,3.3250122h-2.5329514c-0.7498779,0-1.7822266-0.2800293-3.0959473-0.8410645
+		v13.7991333c-0.4117432,2.1312256-1.6452637,3.1970215-3.7012939,3.1970215c-1.9447021,0-3.1610107-1.0115356-3.6466064-3.0331421
+		V3.0893555c0-0.262085,0.1303711-0.6176758,0.3929443-1.0672607C116.5467758,0.6738892,117.6329575,0,118.9787827,0
+		c0.9718018,0,1.8690186,0.4118042,2.692627,1.2339478C123.354393,0.4118042,124.7372055,0,125.821434,0h2.525383
+		c2.5803223,0,4.9726562,1.1088257,7.1798096,3.3250122C137.7328033,5.5426025,138.8360748,7.9467773,138.8360748,10.5393066z
+		 M131.4881744,10.4920654c0-0.6478882-0.3929443-1.3340454-1.1787109-2.0579834
+		c-0.7858887-0.723938-1.4960938-1.0856323-2.1315918-1.0856323h-2.1874924c-0.6364746,0-1.3458252,0.3711548-2.1315918,1.1144409
+		s-1.1787109,1.4384155-1.1787109,2.0863647v2.6293945c0,0.5713501,0.3835449,1.2481079,1.1503906,2.0286865
+		c0.7668457,0.7820435,1.4309082,1.1720581,1.9909668,1.1720581h2.525383c0.5610352,0,1.2241211-0.3900146,1.9909668-1.1720581
+		c0.7658691-0.7805786,1.1503906-1.4573364,1.1503906-2.0286865V10.4920654z" />
+            </g>
+          </svg>
+
+        </div>
+      </li>
+    </ul>
+  </div>
+</div>
diff --git a/src/assets/static/images/wisp_logo_horizontal.svg b/src/assets/static/images/wisp_logo_horizontal.svg
index 51a801a..04e05b8 100644
--- a/src/assets/static/images/wisp_logo_horizontal.svg
+++ b/src/assets/static/images/wisp_logo_horizontal.svg
@@ -45,8 +45,7 @@
 			l-3.4111109-3.4110069l-0.558629-0.55863L6.319869,15.2575493l2.234416-2.234416l6.7032461-6.7032471l2.234416,2.234416
 			l5.6520958,5.6520948l3.0811882-3.0812902l-3.0811882,3.0812902l0,0l4.2584972-4.2586002L27.612772,9.737566l-7.8864098-7.8864594
 			c-2.468153-2.4681017-6.4696112-2.4681017-8.9376621,0l-8.9376621,8.9376106c-2.4680505,2.468051-2.4680505,6.4695606,0,8.9376621
-			l8.9376621,8.9376125c2.468051,2.4679985,6.4695091,2.4679985,8.9376621,0v-0.0000515l-1.0511513-1.0511513L18.4649811,27.823019z
-			"/>
+			l8.9376621,8.9376125c2.468051,2.4679985,6.4695091,2.4679985,8.9376621,0v-0.0000515l-1.0511513-1.0511513L18.4649811,27.823019z"/>
 		<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="49.3865204" y1="27.2705288" x2="37.6677437" y2="6.9730129">
 			<stop  offset="0" style="stop-color:#8B00B1"/>
 			<stop  offset="0" style="stop-color:#EE38A4"/>
@@ -70,8 +69,7 @@
 			</linearGradient>
 			<path class="st2" d="M37.6015854,1.8511064l-8.9376621,8.9376106l-4.468729,4.468832l-0.55863,0.558629l-8.3790331,8.3790331
 				l-4.4688311,4.468832c2.467948,2.4677925,6.4688931,2.4678955,8.937149,0.0004101l0.0005131-0.0005131l13.4063931-13.4063911
-				l8.3790321-8.379034l0.5586281-0.5586295l4.4687309-4.4687796C44.0711975-0.6169954,40.0696373-0.6169954,37.6015854,1.8511064z"
-				/>
+				l8.3790321-8.379034l0.5586281-0.5586295l4.4687309-4.4687796C44.0711975-0.6169954,40.0696373-0.6169954,37.6015854,1.8511064z"/>
 			<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="24.1951942" y1="13.6117887" x2="27.4866123" y2="13.6117887">
 				<stop  offset="0" style="stop-color:#8B00B1"/>
 				<stop  offset="0" style="stop-color:#EE38A4"/>
@@ -81,7 +79,7 @@
 				<stop  offset="0.8785662" style="stop-color:#591FB8"/>
 				<stop  offset="1" style="stop-color:#501DB9"/>
 			</linearGradient>
-			<polygon class="st3" points="24.1951942,15.2574978 24.1951942,15.2575493 27.4866123,11.9660282 			"/>
+			<polygon class="st3" points="24.1951942,15.2574978 24.1951942,15.2575493 27.4866123,11.9660282"/>
 		</g>
 	</g>
 	<linearGradient id="SVGID_5_" gradientUnits="userSpaceOnUse" x1="77.3990173" y1="-7.8904157" x2="122.914917" y2="37.6254807">
diff --git a/src/assets/styles/nomit.scss b/src/assets/styles/nomit.scss
index abfb739..60c2ffb 100644
--- a/src/assets/styles/nomit.scss
+++ b/src/assets/styles/nomit.scss
@@ -1,3 +1,5 @@
+@import url('https://fonts.googleapis.com/css?family=Fredoka+One');
+
 // ***** GENERIC ***** //
 .sidebar{
     box-shadow: 0 0 15px rgba(0,0,0,0.5);
diff --git a/src/companies.html b/src/companies.html
index dd6d4fd..69b21e2 100644
--- a/src/companies.html
+++ b/src/companies.html
@@ -170,7 +170,6 @@
       </main>
 
       <!-- ### $App Screen Footer ### -->
-      ${require('html-loader!./_footer.html')}
       </div><!-- page-container -->
       </div>  <!-- App Content -->
 </body>
diff --git a/src/index.html b/src/index.html
index d7b06cf..88c214c 100755
--- a/src/index.html
+++ b/src/index.html
@@ -76,212 +76,20 @@
   <div>
 
     <!-- #sidebar ============================ -->
-    ${require('html-loader!./_sidebar.html')}
-
+    <nw-sidebar></nw-sidebar>
     <!-- #Main ============================ -->
     <div class="page-container">
       <!-- #topbar ============================ -->
-      ${require('html-loader!./_topbar.html')}
-
+      <nw-topbar></nw-topbar>
       <!-- ### $App Screen Content ### -->
-      <main class='main-content bgc-grey-300'>
-        <div id='mainContent row'>
-          <div class="row content-title mT-60">
-            <h1 class="col-8 ml-1 mb-3">
-              Dashboard
-            </h1>
-          </div>
-          <div class=" gap-20 masonry pos-r">
-            <!-- #content container ===== -->
-            <div class="masonry-sizer col-md-6"></div>
-            <div class="masonry-item  w-100">
-              <!-- #First line ========= -->
-              <div class="row gap-20">
-                
-                <div class='col-md-4 '><!-- #Total Ads Views ==================== -->
-                  <div class="layers bd bgc-white p-20 item-box">
-                    <div class="layer w-100 mB-10">
-                      <h6 class="lh-1">Total Applications</h6>
-                    </div>
-                    <div class="layer w-100">
-                      <div class="peers ai-sb fxw-nw">
-                        <div class="peer peer-greed">
-                          <span id="sparklinedash"></span>
-                        </div>
-                        <div class="peer">
-                          <span class="d-ib lh-0 va-m fw-600 bdrs-10em pX-15 pY-15 bgc-green-50 c-green-500">24K</span>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </div>
-
-                
-                <div class='col-md-4 '><!-- #Successful Matches ==================== -->
-                  <div class="layers bd bgc-white p-20 item-box">
-                    <div class="layer w-100 mB-10">
-                      <h6 class="lh-1">Successful Matches</h6>
-                    </div>
-                    <div class="layer w-100">
-                      <div class="peers ai-sb fxw-nw">
-                        <div class="peer peer-greed">
-                          <span id="sparklinedash2"></span>
-                        </div>
-                        <div class="peer">
-                          <span class="d-ib lh-0 va-m fw-600 bdrs-10em pX-15 pY-15 bgc-purple-50 c-purple-500">127</span>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </div>
-
-                
-                <div class='col-md-4 '><!-- #New Ads ==================== -->
-                  <div class="layers bd bgc-white p-20 item-box">
-                    <div class="layer w-100 mB-10">
-                      <h6 class="lh-1">New Ads (last month)</h6>
-                    </div>
-                    <div class="layer w-100">
-                      <div class="peers ai-sb fxw-nw">
-                        <div class="peer peer-greed">
-                          <span id="sparklinedash3"></span>
-                        </div>
-                        <div class="peer">
-                          <span class="d-ib lh-0 va-m fw-600 bdrs-10em pX-15 pY-15 bgc-blue-50 c-blue-500">79</span>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-            <div class="masonry-item col-12"> <!-- #New Registered Users ==================== -->
-              <div class="bd bgc-white item-box">
-                <div class="layers">
-                  <div class="layer w-100 pX-20 pT-20">
-                    <h6 class="lh-1">New Registered Users</h6>
-                  </div>
-                  <div class="layer w-100 p-20">
-                    <canvas id="line-chart" height="220"></canvas>
-                  </div>
-                  <div class="layer bdT p-20 w-100">
-                    <div class="peers ai-c jc-c gapX-20">
-                      <div class="peer">
-                        <span class="fsz-def fw-600 mR-10 c-purple-800">COMPANIES </span>
-                      </div>
-                      <div class="peer fw-600">
-                        <span class="fsz-def fw-600 mR-10 c-cyan-400">USERS </span>
-                      </div>  
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-
-            <div class="masonry-item w-100">
-              <div class="row gap-20">
-                <div class="col-3 "><!-- #Successful Mathches %==================== -->
-                  <div class="bd bgc-white p-20 peer peer-greed succ-match-perc item-box">
-                    <div class="layers">
-                      <div class="layer w-100 mB-10">
-                        <h6 class="lh-1">Successful Mathches %</h6>
-                      </div>
-                      <!-- Pie Charts -->
-                      <div class="peers pT-50 mT-20 bdT fxw-nw@lg+ jc-sb ta-c gap-10">
-                        <div class="peer">
-                          <div class="easy-pie-chart" data-size='130' data-percent="75" data-bar-color='#a19ff8'>
-                            <span></span>
-                          </div>
-                          <h6 class="fsz-sm">Matched</h6>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </div>
-                <div class="col-9 "> <!-- #Nationality ==================== -->
-                  <div class="bd bgc-white item-box nationality-item">
-                    <div class="peers fxw-nw@lg+ ai-s">
-                      <div class="peer peer-greed w-70p@lg+ w-100@lg- p-20">
-                        <div class="layers">
-                          <div class="layer w-100 mB-10">
-                            <h6 class="lh-1">Nationality</h6>
-                          </div>
-                          <div class="layer w-100">
-                            <div id="world-map-marker"></div>
-                          </div>
-                        </div>
-                      </div>
-                      <div class="peer bdL p-20 w-30p@lg+ w-100p@lg-">
-                        <div class="layers">
-                          <div class="layer w-100">
-                            <!-- Progress Bars -->
-                            <div class="layers">
-                              <div class="layer w-100">
-                                <h5 class="mB-5">100k</h5>
-                                <small class="fw-600 c-grey-700">Visitors From USA</small>
-                                <span class="pull-right c-grey-600 fsz-sm">50%</span>
-                                <div class="progress mT-10">
-                                  <div class="progress-bar bgc-deep-purple-500 nationality-item-progress-bar" role="progressbar" aria-valuenow="50"
-                                    aria-valuemin="0" aria-valuemax="100"> <span class="sr-only">50%
-                                      Complete</span></div>
-                                </div>
-                              </div>
-                              <div class="layer w-100 mT-15">
-                                <h5 class="mB-5">1M</h5>
-                                <small class="fw-600 c-grey-700">Visitors From Europe</small>
-                                <span class="pull-right c-grey-600 fsz-sm">80%</span>
-                                <div class="progress mT-10">
-                                  <div class="progress-bar bgc-green-500" role="progressbar" aria-valuenow="50"
-                                    aria-valuemin="0" aria-valuemax="100" style="width:80%;"> <span class="sr-only">80%
-                                      Complete</span></div>
-                                </div>
-                              </div>
-                              <div class="layer w-100 mT-15">
-                                <h5 class="mB-5">450k</h5>
-                                <small class="fw-600 c-grey-700">Visitors From Australia</small>
-                                <span class="pull-right c-grey-600 fsz-sm">40%</span>
-                                <div class="progress mT-10">
-                                  <div class="progress-bar bgc-light-blue-500" role="progressbar" aria-valuenow="50"
-                                    aria-valuemin="0" aria-valuemax="100" style="width:40%;"> <span class="sr-only">40%
-                                      Complete</span></div>
-                                </div>
-                              </div>
-                              <div class="layer w-100 mT-15">
-                                <h5 class="mB-5">1B</h5>
-                                <small class="fw-600 c-grey-700">Visitors From India</small>
-                                <span class="pull-right c-grey-600 fsz-sm">90%</span>
-                                <div class="progress mT-10">
-                                  <div class="progress-bar bgc-blue-grey-500" role="progressbar" aria-valuenow="50"
-                                    aria-valuemin="0" aria-valuemax="100" style="width:90%;"> <span class="sr-only">90%
-                                      Complete</span></div>
-                                </div>
-                              </div>
-                            </div>
-                          </div>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-
-          </div>
-        </div>
+        <div ng-view></div>
     </div>
 
 
-  </div>
-  </div>
-  </div>
-  </main>
-
-
   <!-- ### $App Screen Footer ### -->
   <nw-footer></nw-footer>
   
   </div>
-  </div>
 </body>
 
 </html>
\ No newline at end of file
diff --git a/src/profile.html b/src/profile.html
index b9bc9fc..477098e 100644
--- a/src/profile.html
+++ b/src/profile.html
@@ -640,7 +640,6 @@
       </main>
 
       <!-- ### $App Screen Footer ### -->
-      ${require('html-loader!./_footer.html')}
     </div><!-- page-container -->
   </div> <!-- App Content -->
 </body>
diff --git a/src/referees.html b/src/referees.html
index 5dcae1b..760487f 100644
--- a/src/referees.html
+++ b/src/referees.html
@@ -170,7 +170,6 @@
         </main>
 
         <!-- ### $App Screen Footer ### -->
-        ${require('html-loader!./_footer.html')}
         </div><!-- page-container -->
         </div>  <!-- App Content -->
   </body>
diff --git a/src/reports.html b/src/reports.html
index 85145a2..d4b32f1 100644
--- a/src/reports.html
+++ b/src/reports.html
@@ -9,10 +9,6 @@
     <link rel="stylesheet" href="assets/styles/style.css">
 
     <title>Reports</title>
-
-    <style>
-      @import url('https://fonts.googleapis.com/css?family=Fredoka+One|Source+Sans+Pro');
-    </style>
     
   </head>
     
diff --git a/src/users.html b/src/users.html
index cfe29ec..3f0f5d1 100644
--- a/src/users.html
+++ b/src/users.html
@@ -170,7 +170,6 @@
         </main>
 
         <!-- ### $App Screen Footer ### -->
-        ${require('html-loader!./_footer.html')}
         </div><!-- page-container -->
         </div>  <!-- App Content -->
   </body>