diff --git a/src/app.component.ts b/src/app.component.ts
index 9d53703..7f5165d 100644
--- a/src/app.component.ts
+++ b/src/app.component.ts
@@ -4,15 +4,16 @@ import { Component } from '@angular/core';
 
 @Component({
   selector: 'accountant',
+  styles: [ require('./main.scss').toString() ],
   template: `
-    <!-- Navbar -->
-    <nav class="navbar fixed-top navbar-dark bg-dark">
-      <a class="navbar-brand" routerLink="/accounts">&nbsp;Accountant</a>
-    </nav>
+    <md-toolbar class="mat-elevation-z6" color="primary">
+      <a md-button style="text-transform: uppercase"
+        routerLink="/accounts">
+        Accountant
+      </a>
+    </md-toolbar>
 
-    <div class="container-fluid">
-      <router-outlet></router-outlet>
-    </div>
+    <router-outlet></router-outlet>
   `
 })
 export class AppComponent { }
diff --git a/src/app.module.ts b/src/app.module.ts
index 2d81533..f9009bc 100644
--- a/src/app.module.ts
+++ b/src/app.module.ts
@@ -3,6 +3,8 @@ import 'zone.js';
 import 'reflect-metadata';
 
 import { NgModule } from '@angular/core';
+import { MdButtonModule, MdToolbarModule } from '@angular/material';
+import { FlexLayoutModule } from '@angular/flex-layout';
 import { BrowserModule } from '@angular/platform-browser';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { RouterModule } from '@angular/router';
@@ -34,6 +36,9 @@ import { ApiBaseURL, LogLevel } from './app.config';
       enableTracing: true,
       useHash: true
     }),
+    FlexLayoutModule,
+    MdButtonModule,
+    MdToolbarModule,
     LoginModule,
     NgLoggerModule.forRoot(LogLevel),
     ToastrModule.forRoot(),