diff --git a/src/app/app-routing-module.ts b/src/app/app-routing-module.ts
new file mode 100644
index 0000000..915571e
--- /dev/null
+++ b/src/app/app-routing-module.ts
@@ -0,0 +1,26 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { Router, RouterModule } from '@angular/router';
+
+import { NotFoundComponent } from './not-found/not-found.component';
+import {DashboardComponent} from './dashboard/dashboard.component';
+import {ImpressumComponent} from './impressum/impressum.component';
+
+export const appRoutes = [
+  { path: 'impressum', component: ImpressumComponent },
+  { path: 'dashboard', component: DashboardComponent },
+  { path: '', pathMatch: 'full', redirectTo: '/dashboard' },
+  { path: '**', component: NotFoundComponent }
+];
+
+@NgModule({
+  imports: [
+    CommonModule,
+    RouterModule.forRoot(appRoutes)
+  ],
+  declarations: [],
+  exports: [
+    RouterModule
+  ]
+})
+export class AppRoutingModule { }
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 4d105e8..44314b4 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,7 +1,7 @@
 <div class="page-wrap">
   <app-header></app-header>
   <main class="content">
-    <app-dashboard></app-dashboard>
+    <router-outlet></router-outlet>
   </main>
   <footer>
     <app-footer></app-footer>
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index d8bb918..870cb9a 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -1,8 +1,13 @@
 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
+import {FormsModule, ReactiveFormsModule} from '@angular/forms';
+import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
+import {ChartsModule} from 'ng2-charts';
+import {HttpClientModule} from '@angular/common/http';
+import {DatePipe} from '@angular/common';
+import {FlexLayoutModule} from '@angular/flex-layout';
 import { CUSTOM_ELEMENTS_SCHEMA} from '@angular/core';
 
-
 import { AppComponent } from './app.component';
 import { FooterComponent } from './menu/footer/footer.component';
 import { HeaderComponent } from './menu/header/header.component';
@@ -10,27 +15,19 @@ import { DashboardComponent } from './dashboard/dashboard.component';
 import { WelcomeComponent } from './dashboard/welcome/welcome.component';
 import { FormComponent } from './dashboard/form/form.component';
 import { MetricComponent } from './dashboard/metric/metric.component';
-import {PublicChartsComponent} from "./dashboard/charts/public-charts/public-charts.component";
-import {PrivateChartsComponent} from "./dashboard/charts/private-charts/private-charts.component";
-import {BarchartComponent} from "./dashboard/charts/barchart/barchart.component";
-import {LinechartComponent} from "./dashboard/charts/linechart/linechart.component";
-
-
+import { PublicChartsComponent } from './dashboard/charts/public-charts/public-charts.component';
+import { PrivateChartsComponent } from './dashboard/charts/private-charts/private-charts.component';
+import { BarchartComponent } from './dashboard/charts/barchart/barchart.component';
+import { LinechartComponent } from './dashboard/charts/linechart/linechart.component';
+import { NotFoundComponent } from './not-found/not-found.component';
+import { AppRoutingModule } from './app-routing-module';
 
 import {
   MatButtonModule, MatIconModule, MatToolbarModule, MatCardModule, MatCheckboxModule,
-  MatDatepickerModule, MatFormFieldModule, MatNativeDateModule, MatInputModule, 
+  MatDatepickerModule, MatFormFieldModule, MatNativeDateModule, MatInputModule,
   MatSnackBarModule, MatSelectModule,
-} from "@angular/material";
-import {FormsModule, ReactiveFormsModule} from "@angular/forms";
-import {BrowserAnimationsModule} from "@angular/platform-browser/animations";
-import {ChartsModule} from "ng2-charts";
-import {HttpClientModule} from "@angular/common/http";
-import {DatePipe} from "@angular/common";
-import {FlexLayoutModule} from "@angular/flex-layout";
-
-
-
+} from '@angular/material';
+import { ImpressumComponent } from './impressum/impressum.component';
 
 @NgModule({
   declarations: [
@@ -45,6 +42,8 @@ import {FlexLayoutModule} from "@angular/flex-layout";
     PrivateChartsComponent,
     BarchartComponent,
     LinechartComponent,
+    NotFoundComponent,
+    ImpressumComponent,
   ],
   imports: [
     BrowserModule,
@@ -54,6 +53,7 @@ import {FlexLayoutModule} from "@angular/flex-layout";
     ChartsModule,
     HttpClientModule,
     FlexLayoutModule,
+    AppRoutingModule,
     MatToolbarModule,
     MatButtonModule,
     MatIconModule,
diff --git a/src/app/dashboard/dashboard.component.css b/src/app/dashboard/dashboard.component.css
index e69de29..5ddbc30 100644
--- a/src/app/dashboard/dashboard.component.css
+++ b/src/app/dashboard/dashboard.component.css
@@ -0,0 +1,5 @@
+.margin {
+  margin-left: 10px;
+  margin-top: 10px;
+  margin-bottom: 10px;
+}
diff --git a/src/app/dashboard/dashboard.component.html b/src/app/dashboard/dashboard.component.html
index 3cf3c0a..1025e66 100644
--- a/src/app/dashboard/dashboard.component.html
+++ b/src/app/dashboard/dashboard.component.html
@@ -1,9 +1,17 @@
 <app-welcome></app-welcome>
 <br>
-<div fxLayout="row" fxLayoutAlign="space-evenly center">
+<div fxLayout="row" fxLayoutAlign="space-evenly center" *ngIf="!publicCheck && !privateCheck">
   <app-form (showData)="loadRequestedData($event)"></app-form>
   <app-metric [publicStatistics]="currentPublicStatistics" [privateStatistics]="currentPrivateStatistics"></app-metric>
 </div>
+<div  class ="margin" *ngIf="publicCheck || privateCheck">
+  <button mat-raised-button (click)="resetChecks()">
+    <mat-icon>
+      arrow_back
+    </mat-icon>
+    Update Data
+  </button>
+</div>
 <br>
 <div fxLayout="row" fxLayoutAlign="center start" *ngIf="currentPrivateStatistics && currentPublicStatistics">
   <div *ngIf="publicCheck" fxFlex="45">
@@ -25,7 +33,14 @@
   <div *ngIf="!timeBasedPrivateStatistics">
     <app-private-charts [currentPrivateData]="currentPrivateStatistics"></app-private-charts>
   </div>
-  </div>  
+  </div>
+</div>
+<div  class ="margin" *ngIf="(publicCheck || privateCheck) && (timeBasedPrivateStatistics || timeBasedPublicStatistics)">
+  <button mat-raised-button (click)="resetChecks()">
+    <mat-icon>
+      arrow_back
+    </mat-icon>
+    Update Data
+  </button>
 </div>
-
 
diff --git a/src/app/dashboard/dashboard.component.ts b/src/app/dashboard/dashboard.component.ts
index f5c759a..8f4f686 100644
--- a/src/app/dashboard/dashboard.component.ts
+++ b/src/app/dashboard/dashboard.component.ts
@@ -1,8 +1,8 @@
 import {Component, OnDestroy, OnInit} from '@angular/core';
-import {PrivateStatisticsService} from "../services/private-statistics.service";
-import {PublicStatisticsService} from "../services/public-statistics.service";
-import {PrivateStatistics} from "../services/PrivateStatistics";
-import {PublicStatistics} from "../services/PublicStatistics";
+import {PrivateStatisticsService} from '../services/private-statistics.service';
+import {PublicStatisticsService} from '../services/public-statistics.service';
+import {PrivateStatistics} from '../services/PrivateStatistics';
+import {PublicStatistics} from '../services/PublicStatistics';
 
 @Component({
   selector: 'app-dashboard',
@@ -22,7 +22,7 @@ export class DashboardComponent implements OnInit, OnDestroy {
   currentPrivateStatistics: PrivateStatistics;
   currentPublicStatistics: PublicStatistics;
   timeBasedPublicStatistics: any; // TODO fix type
-  timeBasedPrivateStatistics: any; //TODO fix type
+  timeBasedPrivateStatistics: any; // TODO fix type
 
   constructor(private privateStatisticsService: PrivateStatisticsService, private publicStatisticsService: PublicStatisticsService) { }
 
@@ -51,7 +51,7 @@ export class DashboardComponent implements OnInit, OnDestroy {
         response => {
           this.currentPrivateStatistics = response[0];
         }
-      )
+      );
   }
 
   loadLatestPublicData() {
@@ -60,7 +60,7 @@ export class DashboardComponent implements OnInit, OnDestroy {
         response => {
           this.currentPublicStatistics = response[0];
         }
-      )
+      );
   }
 
   loadRequestedData(userInput: Array<any>) {
@@ -71,38 +71,43 @@ export class DashboardComponent implements OnInit, OnDestroy {
 
     this.timeBasedPublicStatistics = null;
     this.timeBasedPrivateStatistics = null;
-    if(this.startDate && this.endDate){
-      if(this.checkValidDates(this.startDate, this.endDate)) {
+    if (this.startDate && this.endDate) {
+      if (this.checkValidDates(this.startDate, this.endDate)) {
       this.loadTimeBasedPublicData(this.startDate, this.endDate);
       this.loadTimeBasedPrivateData(this.startDate, this.endDate);
       }
     }
   }
 
-  loadTimeBasedPublicData(start: Date, end: Date){
-      let query = 'startTime=' + start.toISOString() + '&endTime=' + end.toISOString();
-      console.log(start);
+  loadTimeBasedPublicData(start: Date, end: Date) {
+      const query = 'startTime=' + start.toISOString() + '&endTime=' + end.toISOString();
       this.publicStatisticsService.query(query)
         .subscribe(
           response => {
             this.timeBasedPublicStatistics = response;
           }
-        )
+        );
   }
 
-  loadTimeBasedPrivateData(start:Date, end:Date) {
-      let query = 'startTime=' + start.toISOString() + '&endTime=' + end.toISOString();
+  loadTimeBasedPrivateData(start: Date, end: Date) {
+      const query = 'startTime=' + start.toISOString() + '&endTime=' + end.toISOString();
+      console.log(start.toISOString());
       this.privateStatisticsService.query(query)
       .subscribe(
         response => {
           this.timeBasedPrivateStatistics = response;
         }
-      )
+      );
   }
 
    checkValidDates(start: Date, end: Date) {
     return start < end;
   }
+
+  resetChecks() {
+    this.privateCheck = false;
+    this.publicCheck = false;
+  }
 }
 
 
diff --git a/src/app/dashboard/dashboard.module.ts b/src/app/dashboard/dashboard.module.ts
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/dashboard/form/form.component.html b/src/app/dashboard/form/form.component.html
index 5ebca4c..33e21ce 100644
--- a/src/app/dashboard/form/form.component.html
+++ b/src/app/dashboard/form/form.component.html
@@ -55,7 +55,6 @@ <h2 class="mat-h3">Define Time Span</h2>
               send
             </mat-icon></button>
         </mat-card-actions>
-
       </form>
     </mat-card-content>
   </mat-card>
diff --git a/src/app/dashboard/metric/metric.component.css b/src/app/dashboard/metric/metric.component.css
index f9d3c98..1ceebf8 100644
--- a/src/app/dashboard/metric/metric.component.css
+++ b/src/app/dashboard/metric/metric.component.css
@@ -3,12 +3,11 @@ mat-card {
 }
 
 table {
-
 }
 
-th, td {
+th,
+td {
   padding: 15px;
   text-align: left;
-  border-bottom: 1px solid #A7A7A7;
-
+  border-bottom: 1px solid #a7a7a7;
 }
diff --git a/src/app/dashboard/welcome/welcome.component.css b/src/app/dashboard/welcome/welcome.component.css
index d5a8258..ad4685a 100644
--- a/src/app/dashboard/welcome/welcome.component.css
+++ b/src/app/dashboard/welcome/welcome.component.css
@@ -9,24 +9,24 @@
 }
 
 .transparent-background {
-  background-color: rgba(0,0,0,0);
+  background-color: rgba(0, 0, 0, 0);
 }
 
-.spacer{
+.spacer {
   flex: 1 1 auto;
 }
 
-.white-text{
+.white-text {
   color: white;
   text-align: center;
   vertical-align: middle;
 }
 
-.mat-h1{
+.mat-h1 {
   font-size: 4.2rem;
 }
 
-.mat-h2{
+.mat-h2 {
   font-size: 1.64rem;
   font-weight: 300;
   margin: .82rem 0 .656rem 0;
diff --git a/src/app/impressum/impressum.component.css b/src/app/impressum/impressum.component.css
new file mode 100644
index 0000000..978d1f1
--- /dev/null
+++ b/src/app/impressum/impressum.component.css
@@ -0,0 +1,4 @@
+mat-card {
+  background: whitesmoke;
+  width: 50%;
+}
diff --git a/src/app/impressum/impressum.component.html b/src/app/impressum/impressum.component.html
new file mode 100644
index 0000000..c087305
--- /dev/null
+++ b/src/app/impressum/impressum.component.html
@@ -0,0 +1,8 @@
+<br>
+<div fxLayout="column" fxLayoutAlign="space-around center" >
+  <mat-card> <!-- TODO write useful text -->
+    <mat-card-title>Lorem ipsum</mat-card-title>
+    <mat-card-content>dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</mat-card-content>
+  </mat-card>
+  <br>
+</div>
diff --git a/src/app/impressum/impressum.component.spec.ts b/src/app/impressum/impressum.component.spec.ts
new file mode 100644
index 0000000..0c86bab
--- /dev/null
+++ b/src/app/impressum/impressum.component.spec.ts
@@ -0,0 +1,27 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ImpressumComponent } from './impressum.component';
+import {CUSTOM_ELEMENTS_SCHEMA} from '@angular/core';
+
+describe('ImpressumComponent', () => {
+  let component: ImpressumComponent;
+  let fixture: ComponentFixture<ImpressumComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ImpressumComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ImpressumComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/impressum/impressum.component.ts b/src/app/impressum/impressum.component.ts
new file mode 100644
index 0000000..a59d2bb
--- /dev/null
+++ b/src/app/impressum/impressum.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-impressum',
+  templateUrl: './impressum.component.html',
+  styleUrls: ['./impressum.component.css']
+})
+export class ImpressumComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}
diff --git a/src/app/menu/footer/footer.component.css b/src/app/menu/footer/footer.component.css
index 3432b4e..46cbf23 100644
--- a/src/app/menu/footer/footer.component.css
+++ b/src/app/menu/footer/footer.component.css
@@ -1,9 +1,9 @@
-.description{
+.description {
   font-size: 12px;
   font-style: normal;
 }
 
-.spacer{
+.spacer {
   flex: 1 1 auto;
 }
 
diff --git a/src/app/menu/header/header.component.css b/src/app/menu/header/header.component.css
index 931faae..a3d744f 100644
--- a/src/app/menu/header/header.component.css
+++ b/src/app/menu/header/header.component.css
@@ -1,7 +1,11 @@
 .logo {
-  width:20%;
+  width: 20%;
 }
 
 .mat-h1 {
   font-size: 2rem;
 }
+
+.spacer {
+  flex: 1 1 auto;
+}
diff --git a/src/app/menu/header/header.component.html b/src/app/menu/header/header.component.html
index f84de1e..ec4b0c8 100644
--- a/src/app/menu/header/header.component.html
+++ b/src/app/menu/header/header.component.html
@@ -1,8 +1,10 @@
 <mat-toolbar color="secondary">
   <mat-toolbar-row>
-    <a mat-button href="#" aria-label="Chainboard">
+    <a mat-button routerLink="/dashboard" aria-label="Chainboard">
       <img class="logo" src="assets/images/logo.png">
       <span class="mat-h1">Chainboard</span>
     </a>
+    <span class="spacer"></span>
+    <button mat-button routerLink="/impressum">Impressum</button>
   </mat-toolbar-row>
 </mat-toolbar>
diff --git a/src/app/not-found/not-found.component.css b/src/app/not-found/not-found.component.css
new file mode 100644
index 0000000..dae50d3
--- /dev/null
+++ b/src/app/not-found/not-found.component.css
@@ -0,0 +1,34 @@
+.background {
+  background-image: url("../../assets/images/background.png");
+  background-size: cover;
+  background-repeat: no-repeat;
+  height: 400px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.transparent-background {
+  background-color: rgba(0, 0, 0, 0);
+}
+
+.spacer {
+  flex: 1 1 auto;
+}
+
+.white-text {
+  color: white;
+  text-align: center;
+  vertical-align: middle;
+}
+
+.mat-h1 {
+  font-size: 4.2rem;
+}
+
+.mat-h2 {
+  font-size: 1.64rem;
+  font-weight: 300;
+  margin: .82rem 0 .656rem 0;
+}
+
diff --git a/src/app/not-found/not-found.component.html b/src/app/not-found/not-found.component.html
new file mode 100644
index 0000000..a3fb084
--- /dev/null
+++ b/src/app/not-found/not-found.component.html
@@ -0,0 +1,14 @@
+<div class="background">
+  <mat-toolbar class="transparent-background white-text">
+    <mat-toolbar-row>
+      <span class="spacer"></span>
+      <span class="mat-h1">ERROR - 404 Not Found</span>
+      <span class="spacer"></span>
+    </mat-toolbar-row>
+    <mat-toolbar-row>
+      <span class="spacer"></span>
+      <span class="mat-h2">Looks like this isn't the site your looking for</span>
+      <span class="spacer"></span>
+    </mat-toolbar-row>
+  </mat-toolbar>
+</div>
diff --git a/src/app/not-found/not-found.component.spec.ts b/src/app/not-found/not-found.component.spec.ts
new file mode 100644
index 0000000..c93a1a0
--- /dev/null
+++ b/src/app/not-found/not-found.component.spec.ts
@@ -0,0 +1,27 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { NotFoundComponent } from './not-found.component';
+import {CUSTOM_ELEMENTS_SCHEMA} from '@angular/core';
+
+describe('NotFoundComponent', () => {
+  let component: NotFoundComponent;
+  let fixture: ComponentFixture<NotFoundComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ NotFoundComponent ],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(NotFoundComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/app/not-found/not-found.component.ts b/src/app/not-found/not-found.component.ts
new file mode 100644
index 0000000..029bd54
--- /dev/null
+++ b/src/app/not-found/not-found.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-not-found',
+  templateUrl: './not-found.component.html',
+  styleUrls: ['./not-found.component.css']
+})
+export class NotFoundComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}
diff --git a/src/styles.scss b/src/styles.scss
index 60fcd8a..3b52c5d 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -1,6 +1,7 @@
 @import 'theme.scss';
 
-html, body {
+html,
+body {
   height: 100%;
   margin: 0;
 }
diff --git a/src/theme.scss b/src/theme.scss
index 8ced419..600aba2 100644
--- a/src/theme.scss
+++ b/src/theme.scss
@@ -1,25 +1,19 @@
 @import url('https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic&subset=latin-ext');
 @import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,400italic&amp;subset=latin-ext');
-
 @import '~@angular/material/theming';
 @include mat-core();
-
 $general-typography: mat-typography-config(
-  $font-family: 'Roboto, sans-serif',
-  $body-2:        mat-typography-level(14px, 24px, 600)
+  $font-family: 'Roboto, sans-serif', $body-2:        mat-typography-level(14px, 24px, 600)
 );
-
 $secondary-typography: mat-typography-config(
   $font-family: '"Open Sans", "Helvetica Neue", sans-serif'
 
 );
 
 @include mat-core($general-typography);
-
 $my-app-primary: mat-palette($mat-blue-grey, 800);
-$my-app-accent:  mat-palette($mat-teal, 400);
-$my-app-warn:    mat-palette($mat-deep-orange);
-
+$my-app-accent: mat-palette($mat-teal, 400);
+$my-app-warn: mat-palette($mat-deep-orange);
 $my-app-theme: mat-light-theme($my-app-primary, $my-app-accent, $my-app-warn);
 
 @include angular-material-theme($my-app-theme);
diff --git a/tslint.json b/tslint.json
index 1c7b38b..52a5ae9 100644
--- a/tslint.json
+++ b/tslint.json
@@ -127,7 +127,10 @@
       "app",
       "kebab-case"
     ],
-    "angular-whitespace": [true, "check-interpolation"],
+    "angular-whitespace": [
+      true,
+      "check-interpolation"
+    ],
     "no-output-on-prefix": true,
     "use-input-property-decorator": true,
     "use-output-property-decorator": true,