diff --git a/@salix/app/src/components/main-menu/main-menu.html b/@salix/app/src/components/main-menu/main-menu.html
index a3b20197c..a6c095acd 100644
--- a/@salix/app/src/components/main-menu/main-menu.html
+++ b/@salix/app/src/components/main-menu/main-menu.html
@@ -1,7 +1,8 @@
-<div style="position: fixed; top: 0; right: 0; padding: 1.5em; color: white;">
+<div style="position: fixed; top: 0; right: 0; padding: 1em 1.5em; color: white; z-index: 10;">
+    <i class="material-icons" title="Logout" ng-click="$ctrl.onLogoutClick()">exit_to_app</i>
     <i class="material-icons" id="apps" style="cursor: pointer;">apps</i>
-    <i class="material-icons">notifications</i>
-    <i class="material-icons">account_circle</i>
+    <i class="material-icons" title="Notifications">notifications</i>
+    <i class="material-icons" title="Profile" style="font-size: 35px;">account_circle</i>
     <ul class="mdl-menu mdl-js-menu mdl-menu--bottom-right user-menu" pad-medium for="apps" >
          <a ui-sref="clients"><i class="material-icons" id="clients">person</i></a>
     </ul>
diff --git a/@salix/app/src/components/main-menu/main-menu.js b/@salix/app/src/components/main-menu/main-menu.js
index a774f7071..afb5869c3 100644
--- a/@salix/app/src/components/main-menu/main-menu.js
+++ b/@salix/app/src/components/main-menu/main-menu.js
@@ -1,8 +1,18 @@
+require('./style.css');
 import template from './main-menu.html';
 import {module} from '../../module';
 
-export const NAME = "vnMainmenu";
+export const NAME = 'vnMainMenu';
 export const COMPONENT = {
-    template: template
+    template: template,
+    controller: function ()
+    {
+        this.onLogoutClick = function ()
+        {
+            let appName = 'salix';
+            document.cookie = `${appName}-session=; expires=Thu, 01 Jan 1970 00:00:01 GMT;`;
+            window.location = `/account?api_key=${appName}`;
+        }
+    }
 };
 module.component(NAME, COMPONENT);
diff --git a/@salix/app/src/components/main-menu/style.css b/@salix/app/src/components/main-menu/style.css
new file mode 100644
index 000000000..73fc9ec51
--- /dev/null
+++ b/@salix/app/src/components/main-menu/style.css
@@ -0,0 +1,9 @@
+vn-main-menu i {
+    padding: .1em;
+    border-radius: .1em;
+    vertical-align: middle;
+}
+vn-main-menu i:hover {
+    cursor: pointer;
+    opacity: .85;
+}
\ No newline at end of file
diff --git a/@salix/app/src/styles/misc.scss b/@salix/app/src/styles/misc.scss
index 7a95408b4..7ea83980b 100644
--- a/@salix/app/src/styles/misc.scss
+++ b/@salix/app/src/styles/misc.scss
@@ -5,4 +5,21 @@
     box-sizing: border-box;
     padding: $pad-large;
     max-width: 1000px;
+}
+
+html [vn-auto], vn-auto, .vn-auto,
+html [vn-none], vn-none, .vn-none,
+html [vn-one], vn-one, .vn-one,
+html [vn-two], vn-two, .vn-two,
+html [vn-three], vn-three, .vn-three,
+html [vn-four], vn-four, .vn-four,
+html [vn-five], vn-five, .vn-five,
+html [vn-six], vn-six, .vn-six,
+html [vn-seven], vn-seven, .vn-seven,
+html [vn-eight], vn-eight, .vn-eight,
+html [vn-nine], vn-nine, .vn-nine,
+html [vn-ten], vn-ten, .vn-ten,
+html [vn-eleven], vn-eleven, .vn-eleven,
+html [vn-twelve], vn-twelve, .vn-twelve,{
+    padding-right: .4em;
 }
\ No newline at end of file
diff --git a/@salix/core/src/core.js b/@salix/core/src/core.js
index 8c1cfa7ef..5949f15c2 100644
--- a/@salix/core/src/core.js
+++ b/@salix/core/src/core.js
@@ -38,8 +38,7 @@ export {NAME as COMBO_MDL, factory as comboMdl} from './combo/combo.mdl'
 export {NAME as DATE_PICKER, directive as DatePickerDirective} from './date-picker/date-picker'
 export {NAME as DATE_PICKER_MDL, factory as datePickerMdl} from './date-picker/date-picker.mdl'
 
-export {NAME as TITLE, directive as TitleDirective} from './title/title'
-export {NAME as TITLE_MDL, factory as titleMdl} from './title/title.mdl'
+export {NAME as TITLE, COMPONENT as TITLE_COMPONENT} from './title/title'
 
 
 
diff --git a/@salix/core/src/title/title.html b/@salix/core/src/title/title.html
new file mode 100644
index 000000000..bf40c9a3b
--- /dev/null
+++ b/@salix/core/src/title/title.html
@@ -0,0 +1,2 @@
+<h3 style="margin-top: 0;" class="border-solid-bottom margin-medium-bottom" level="*[level]*" ng-transclude>
+</h3>
\ No newline at end of file
diff --git a/@salix/core/src/title/title.js b/@salix/core/src/title/title.js
index a31d23616..7cde9b468 100644
--- a/@salix/core/src/title/title.js
+++ b/@salix/core/src/title/title.js
@@ -1,19 +1,9 @@
+import template from './title.html';
 import {module} from '../module';
-import * as resolveFactory from '../resolveDefaultComponents';
-import * as util from '../util';
 
-const _NAME = 'title';
-export const NAME = util.getName(_NAME);
-
-directive.$inject = [resolveFactory.NAME];
-export function directive (resolve){
-    return {
-        require:'E',
-        transclude: true,
-        template: function(_,attr){
-           return resolve.getTemplate(_NAME, attr);
-        }
-    }
-}
-
-module.directive(NAME,directive);
+export const NAME = "vnTitle";
+export const COMPONENT = {
+    template: template,
+    transclude: true
+};
+module.component(NAME, COMPONENT);
diff --git a/@salix/core/src/title/title.mdl.html b/@salix/core/src/title/title.mdl.html
deleted file mode 100644
index ae367dc10..000000000
--- a/@salix/core/src/title/title.mdl.html
+++ /dev/null
@@ -1,2 +0,0 @@
-<h3 style="margin: 0; padding-bottom: .1em; margin-bottom: .4em; border-bottom: 1px solid gray;" level="*[level]*" ng-transclude>
-</h3>
\ No newline at end of file
diff --git a/@salix/core/src/title/title.mdl.js b/@salix/core/src/title/title.mdl.js
deleted file mode 100644
index 27e25f251..000000000
--- a/@salix/core/src/title/title.mdl.js
+++ /dev/null
@@ -1,13 +0,0 @@
-import {module} from '../module';
-import template from './title.mdl.html';
-
-export const NAME = 'vnTitleMdlFactory';
-
-export function factory() {
-    return {
-        template: template,
-        default: {}
-    }
-}
-
-module.factory(NAME, factory);
\ No newline at end of file
diff --git a/services/salix/client/index.ejs b/services/salix/client/index.ejs
index 2194cf7df..9881a4421 100644
--- a/services/salix/client/index.ejs
+++ b/services/salix/client/index.ejs
@@ -7,7 +7,7 @@
 	</head>
 	<body>
 		<vn-vertical id="app" class="full-height">
-			<vn-mainmenu></vn-mainmenu>	
+			<vn-main-menu></vn-main-menu>	
 			<vn-vertical ui-view scrollable></vn-vertical>
 		</vn-vertical>
 		<script