diff --git a/src/index.html b/src/index.html
index b1e1ecb..33924f8 100755
--- a/src/index.html
+++ b/src/index.html
@@ -8,9 +8,10 @@
 
     <title>Mail</title>
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" media="all" href="css/all.css" type="text/css">
 
-    <link href="css/reset.css" rel="stylesheet">
-    <link href="css/style.css" rel="stylesheet">
+    <!--<link href="css/reset.css" rel="stylesheet">
+    <link href="css/style.css" rel="stylesheet">-->
 
     <!-- The Scripts -->
     <script src="lib/require.js"></script>
@@ -19,7 +20,7 @@
   </head>
   <body>
 
-    <div ng-view></div>
+    <div ng-view class="main-app-view"></div>
 
   </body>
 </html>
diff --git a/src/js/app.js b/src/js/app.js
index 2eed706..677712f 100644
--- a/src/js/app.js
+++ b/src/js/app.js
@@ -6,9 +6,10 @@ require([
     'js/controller/login',
     'js/controller/message-list',
     'js/controller/write',
+    'js/controller/navigation',
     'angularRoute',
     'angularTouch'
-], function(angular, LoginCtrl, MessageListCtrl, WriteCtrl) {
+], function(angular, LoginCtrl, MessageListCtrl, WriteCtrl, NavigationCtrl) {
     'use strict';
 
     var app = angular.module('mail', ['ngRoute', 'ngTouch', 'write']);
@@ -29,6 +30,10 @@ require([
             templateUrl: 'tpl/write.html',
             controller: WriteCtrl
         });
+        $routeProvider.when('/desktop', {
+            templateUrl: 'tpl/desktop.html',
+            controller: NavigationCtrl
+        });
         $routeProvider.otherwise({
             redirectTo: '/login'
         });
diff --git a/src/js/controller/navigation.js b/src/js/controller/navigation.js
new file mode 100644
index 0000000..1d44d43
--- /dev/null
+++ b/src/js/controller/navigation.js
@@ -0,0 +1,17 @@
+define(function() {
+    'use strict';
+
+    var NavigationCtrl = function($scope) {
+        $scope.navOpen = false;
+
+        $scope.openNav = function() {
+            $scope.navOpen = true;
+        };
+
+        $scope.closeNav = function() {
+            $scope.navOpen = false;
+        };
+    };
+
+    return NavigationCtrl;
+});
\ No newline at end of file
diff --git a/src/sass/_scaffolding.scss b/src/sass/_scaffolding.scss
index 643c198..a532870 100755
--- a/src/sass/_scaffolding.scss
+++ b/src/sass/_scaffolding.scss
@@ -33,6 +33,10 @@ textarea {
 }
 
 // Basic layout
+.main-app-view {
+    height: 100%;
+}
+
 .column {
 
 }
\ No newline at end of file
diff --git a/src/tpl/desktop.html b/src/tpl/desktop.html
new file mode 100644
index 0000000..41358e6
--- /dev/null
+++ b/src/tpl/desktop.html
@@ -0,0 +1,86 @@
+<div class="nav-container nav-effect" ng-class="{'nav-menu-open': navOpen}">
+
+  <!-- main navigation -->
+  <nav class="nav-menu nav-effect">
+    <div class="content">
+      <header>
+        <h1>WHITEOUT.IO</h1>
+      </header>
+      <ul class="nav-primary">
+        <li>
+          <a href="#">
+            Inbox
+            <span class="label-wrapper"><span class="label label-light">1000+</span></span>
+          </a>
+        </li>
+        <li>
+          <a href="#">Sent</a>
+        </li>
+        <li>
+          <a href="#">Outbox</a>
+        </li>
+        <li>
+          <a href="#">
+            Drafts
+            <span class="label-wrapper"><span class="label label-light">2</span></span>
+          </a>
+        </li>
+        <li>
+          <a href="#">
+            Trash
+            <span class="label-wrapper"><span class="label label-light">100</span></span>
+          </a>
+        </li>
+      </ul>
+      <ul class="nav-secondary">
+        <li><a href="#">Account</a></li>
+        <li><a href="#">About whiteout.io</a></li>
+        <li><a href="#">Help</a></li>
+      </ul>
+      <footer>
+        Last update: 12:22 PM
+      </footer>
+    </div>
+  </nav><!--/.nav-menu-->
+
+  <!-- content wrapper pushed right -->
+  <div class="nav-pusher" ng-click="closeNav()">
+    <section class="content main-content">
+
+      <!-- left column: containing list view and navigation header -->
+      <div class="column view-mail-list">
+        <!-- nav controll and section headline -->
+        <header data-icon="&#xe004;" ng-click="openNav(); $event.stopPropagation()">
+          <h2>Inbox</h2>
+        </header>
+
+        <div class="">
+
+        </div>
+      </div>
+
+      <div class="column">
+
+      </div>
+
+    </section>
+  </div><!--/.nav-pusher-->
+
+</div><!--/.nav-container-->
+
+<!-- lightbox  -->
+<div class="lightbox-overlay">
+  <div class="lightbox lightbox-effect">
+    <div class="lightbox-body">
+      <header>
+        <!-- add lightbox title -->
+        <h2>New email</h2>
+        <button class="close" data-action="lightbox-close">&#xe007;</button>
+      </header>
+      <div class="content">
+        <!-- add lightbox content here -->
+        some content
+      </div>
+    </div>
+  </div>
+</div><!--/.lightbox-->
\ No newline at end of file
