diff --git a/src/app/accounting/accounting-routing.module.ts b/src/app/accounting/accounting-routing.module.ts
index f1179a8c0..93a09454f 100644
--- a/src/app/accounting/accounting-routing.module.ts
+++ b/src/app/accounting/accounting-routing.module.ts
@@ -1,10 +1,13 @@
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
 
+import { Route, extract } from '@app/core';
 import { AccountingComponent } from './accounting.component';
 
 const routes: Routes = [
-  { path: 'accounting', component: AccountingComponent},
+  Route.withShell([
+    { path: 'accounting', component: AccountingComponent}
+  ])
 ];
 
 @NgModule({
diff --git a/src/app/accounting/accounting.component.html b/src/app/accounting/accounting.component.html
index b8c0f280c..bf6a30835 100644
--- a/src/app/accounting/accounting.component.html
+++ b/src/app/accounting/accounting.component.html
@@ -1,4 +1,3 @@
-<app-header> </app-header>
 <div class="fluid-container">
  <div class="container">
    <div class="card-body">
@@ -47,4 +46,4 @@
     </div>
    </div>
   </div>
-</div> 
\ No newline at end of file
+</div>
diff --git a/src/app/clients/clients-routing.module.ts b/src/app/clients/clients-routing.module.ts
index 4cc6d0a27..8fe176c62 100644
--- a/src/app/clients/clients-routing.module.ts
+++ b/src/app/clients/clients-routing.module.ts
@@ -1,17 +1,19 @@
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
-import { extract } from '@app/core';
 
+import { Route, extract } from '@app/core';
 import { ClientsComponent } from './clients.component';
 import { CreateClientComponent} from './create-client/create-client.component';
 import { ViewClientComponent } from './view-client/view-client.component';
 import { ViewLoanComponent } from './view-loan/view-loan.component';
 
 const routes: Routes = [
-  { path: 'clients', component: ClientsComponent},
-  { path: 'clients/create', component: CreateClientComponent},
-  { path: 'clients/view', component: ViewClientComponent},
-  { path: 'clients/viewloan', component: ViewLoanComponent}
+  Route.withShell([
+    { path: 'clients', component: ClientsComponent},
+    { path: 'clients/create', component: CreateClientComponent},
+    { path: 'clients/view', component: ViewClientComponent},
+    { path: 'clients/viewloan', component: ViewLoanComponent}
+  ])
 ];
 
 @NgModule({
diff --git a/src/app/clients/clients.component.html b/src/app/clients/clients.component.html
index 9e122e390..a48a35b47 100644
--- a/src/app/clients/clients.component.html
+++ b/src/app/clients/clients.component.html
@@ -1,4 +1,3 @@
-<app-header> </app-header>
 <div class="fluid-container">
  <div class="container">
   <div class="card mt-5">
@@ -98,5 +97,5 @@
 
       </div>
     </div>
-  </div>  
-</div>
\ No newline at end of file
+  </div>
+</div>
diff --git a/src/app/clients/create-client/create-client.component.html b/src/app/clients/create-client/create-client.component.html
index 4a4a1568c..cfd6d7c5c 100644
--- a/src/app/clients/create-client/create-client.component.html
+++ b/src/app/clients/create-client/create-client.component.html
@@ -1,9 +1,8 @@
-<app-header> </app-header>
 <div class="container">
 
  <aw-wizard class="mt-5" #wizard [navBarLayout]="'large-empty-symbols'">
   <aw-wizard-step stepTitle="Title of step 1" [navigationSymbol]="{ symbol: '1' }">
-  
+
           <div class="col-sm-6 mx-auto">
               <div class="card mt-5">
     <div class="card-body">
@@ -13,41 +12,41 @@
             <input class="form-control" id="disabledInput" placeholder="Disabled input here..." disabled="" type="text">
           </fieldset>
         </div>
-        
+
         <div class="form-group">
           <fieldset>
             <label class="control-label" for="readOnlyInput">Readonly input</label>
             <input class="form-control" id="readOnlyInput" placeholder="Readonly input here…" readonly="" type="text">
           </fieldset>
         </div>
-        
+
         <div class="form-group has-success">
           <label class="form-control-label" for="inputSuccess1">Valid input</label>
           <input value="correct value" class="form-control is-valid" id="inputValid" type="text">
           <div class="valid-feedback">Success! You've done it.</div>
         </div>
-        
+
         <div class="form-group has-danger">
           <label class="form-control-label" for="inputDanger1">Invalid input</label>
           <input value="wrong value" class="form-control is-invalid" id="inputInvalid" type="text">
           <div class="invalid-feedback">Sorry, that username's taken. Try another?</div>
         </div>
-        
+
         <div class="form-group">
           <label class="col-form-label col-form-label-lg" for="inputLarge">Large input</label>
           <input class="form-control form-control-lg" placeholder=".form-control-lg" id="inputLarge" type="text">
         </div>
-        
+
         <div class="form-group">
           <label class="col-form-label" for="inputDefault">Default input</label>
           <input class="form-control" placeholder="Default input" id="inputDefault" type="text">
         </div>
-        
+
         <div class="form-group">
           <label class="col-form-label col-form-label-sm" for="inputSmall">Small input</label>
           <input class="form-control form-control-sm" placeholder=".form-control-sm" id="inputSmall" type="text">
         </div>
-        
+
         <div class="form-group">
           <label class="control-label">Input addons</label>
           <div class="form-group">
@@ -68,7 +67,7 @@
       </div>
     </div>
 
-    
+
   </aw-wizard-step>
   <aw-wizard-step stepTitle="Title of step 2" [navigationSymbol]="{ symbol: '2' }" >
       <div class="col-sm-6 mx-auto">
@@ -77,7 +76,7 @@
          -->    <div class="card-body">
               <form>
                 <fieldset>
-                  
+
                   <div class="form-group row">
                     <label for="staticEmail" class="col-sm-2 col-form-label">Email</label>
                     <div class="col-sm-10">
diff --git a/src/app/clients/view-client/view-client.component.html b/src/app/clients/view-client/view-client.component.html
index d4a8447ce..44c56c57f 100644
--- a/src/app/clients/view-client/view-client.component.html
+++ b/src/app/clients/view-client/view-client.component.html
@@ -1,4 +1,3 @@
-<app-header> </app-header>
 <div class="fluid-container">
   <div class="container">
     <div class="row">
@@ -46,11 +45,11 @@
                                 <th>Country</th>
                                 <th>City</th>
                                 <th>Position</th>
-            
+
                             </tr>
                         </thead>
                         <!--Table head-->
-            
+
                         <!--Table body-->
                         <tbody>
                             <tr>
@@ -60,7 +59,7 @@
                                 <td>Italy</td>
                                 <td>Bari</td>
                                 <td>Editor-in-chief</td>
-            
+
                             </tr>
                             <tr>
                                 <th scope="row">5</th>
@@ -69,7 +68,7 @@
                                 <td>Poland</td>
                                 <td>Warsaw</td>
                                 <td>Video Maker</td>
-            
+
                             </tr>
                             <tr>
                                 <th scope="row">6</th>
@@ -78,7 +77,7 @@
                                 <td>Germany</td>
                                 <td>Berlin</td>
                                 <td>Photographer</td>
-            
+
                             </tr>
                             <tr>
                                 <th scope="row">7</th>
@@ -87,7 +86,7 @@
                                 <td>USA</td>
                                 <td>San Francisco</td>
                                 <td>Teacher</td>
-            
+
                             </tr>
                             <tr>
                                 <th scope="row">8</th>
@@ -96,7 +95,7 @@
                                 <td>France</td>
                                 <td>Paris</td>
                                 <td>Actor</td>
-            
+
                             </tr>
                             <tr>
                                 <th scope="row">9</th>
@@ -105,7 +104,7 @@
                                 <td>Germany</td>
                                 <td>Munich</td>
                                 <td>Singer</td>
-            
+
                             </tr>
                             <tr>
                                 <th scope="row">9</th>
@@ -114,7 +113,7 @@
                                 <td>Germany</td>
                                 <td>Munich</td>
                                 <td>Singer</td>
-            
+
                             </tr>
                             <tr>
                                 <th scope="row">9</th>
@@ -123,7 +122,7 @@
                                 <td>Germany</td>
                                 <td>Munich</td>
                                 <td>Singer</td>
-            
+
                             </tr>
                             <tr>
                                 <th scope="row">9</th>
@@ -132,7 +131,7 @@
                                 <td>Germany</td>
                                 <td>Munich</td>
                                 <td>Singer</td>
-            
+
                             </tr>
                             <tr>
                                 <th scope="row">9</th>
@@ -141,7 +140,7 @@
                                 <td>Germany</td>
                                 <td>Munich</td>
                                 <td>Singer</td>
-            
+
                             </tr>
                             <tr>
                                 <th scope="row">9</th>
@@ -150,11 +149,11 @@
                                 <td>Germany</td>
                                 <td>Munich</td>
                                 <td>Singer</td>
-            
+
                             </tr>
                         </tbody>
                         <!--Table body-->
-            
+
                     </table>
                  </div>
               </div>
@@ -166,4 +165,4 @@
 
 
   </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/src/app/clients/view-loan/view-loan.component.html b/src/app/clients/view-loan/view-loan.component.html
index 9ac2466fd..7137d5ff4 100644
--- a/src/app/clients/view-loan/view-loan.component.html
+++ b/src/app/clients/view-loan/view-loan.component.html
@@ -1,5 +1,3 @@
-<app-header></app-header>
-
 <div class="fluid-container">
   <div class="container">
     <div class="col text-center">
@@ -362,4 +360,4 @@
       </ngb-tabset>
     </div>
   </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/src/app/navigation/navigation-routing.module.ts b/src/app/navigation/navigation-routing.module.ts
index 0fbdf96b0..60067e028 100644
--- a/src/app/navigation/navigation-routing.module.ts
+++ b/src/app/navigation/navigation-routing.module.ts
@@ -1,10 +1,13 @@
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
 
+import { Route, extract } from '@app/core';
 import { NavigationComponent } from './navigation.component';
 
 const routes: Routes = [
-  { path: 'navigation', component: NavigationComponent},
+  Route.withShell([
+    { path: 'navigation', component: NavigationComponent}
+  ])
 ];
 
 @NgModule({
diff --git a/src/app/navigation/navigation.component.html b/src/app/navigation/navigation.component.html
index 91fc4b05e..4ac5be50f 100644
--- a/src/app/navigation/navigation.component.html
+++ b/src/app/navigation/navigation.component.html
@@ -1,15 +1,14 @@
-<app-header></app-header>
 <div class="fluid-container">
   <div class="container">
 
        <!--  <div class="card card-header">
         <h4 class="col-sm-3 font-weight-bold">Navigation</h4> -->
-      
+
         <div class="col-sm-4 mt-5 mb-3 mx-auto">
           <input class="form-control mr-sm-2" placeholder="Filter by Name" type="text">
         </div>
-     
-     
+
+
 
         <ngb-tabset justify="center">
           <ngb-tab title="Client">
@@ -25,32 +24,32 @@
                         </tr>
                     </thead>
                     <!--Table head-->
-        
+
                     <!--Table body-->
                     <tbody>
                         <tr>
                             <th scope="row">4</th>
                             <td>Jerry</td>
 
-        
+
                         </tr>
                         <tr>
                             <th scope="row">5</th>
                             <td>Janis</td>
 
-        
+
                         </tr>
                         <tr>
                             <th scope="row">6</th>
                             <td>Gary</td>
 
-        
+
                         </tr>
                         <tr>
                             <th scope="row">7</th>
                             <td>Angie</td>
- 
-        
+
+
                         </tr>
                         <tr>
                             <th scope="row">8</th>
@@ -66,23 +65,23 @@
                             <th scope="row">9</th>
                             <td>Otto</td>
 
-        
+
                         </tr>
                         <tr>
                             <th scope="row">9</th>
                             <td>Otto</td>
- 
-        
+
+
                         </tr>
                         <tr>
                             <th scope="row">9</th>
                             <td>Otto</td>
 
                         </tr>
-                      
+
                     </tbody>
                     <!--Table body-->
-        
+
                 </table>
               </div>
             </ng-template>
@@ -93,7 +92,7 @@
             <ng-template ngbTabContent>
                 <div class="card col-sm-4 mx-auto">
                     <table class="table table-hover table-responsive-md table-fixed">
-    
+
                         <!--Table head-->
                         <thead>
                             <tr>
@@ -102,49 +101,49 @@
                             </tr>
                         </thead>
                         <!--Table head-->
-            
+
                         <!--Table body-->
                         <tbody>
                             <tr>
                                 <th scope="row">4</th>
                                 <td>Jerry</td>
-    
-            
+
+
                             </tr>
                             <tr>
                                 <th scope="row">5</th>
                                 <td>Janis</td>
-    
-            
+
+
                             </tr>
                             <tr>
                                 <th scope="row">4</th>
                                 <td>Jerry</td>
-    
-            
+
+
                             </tr>
                             <tr>
                                 <th scope="row">5</th>
                                 <td>Janis</td>
-    
-            
+
+
                             </tr>
                             <tr>
                                 <th scope="row">4</th>
                                 <td>Jerry</td>
-    
-            
+
+
                             </tr>
                             <tr>
                                 <th scope="row">5</th>
                                 <td>Janis</td>
-    
-            
+
+
                             </tr>
-                          
+
                         </tbody>
                         <!--Table body-->
-            
+
                     </table>
                   </div>
             </ng-template>
@@ -163,4 +162,3 @@
         </ngb-tabset>
       </div>
     </div>
- 
\ No newline at end of file