diff --git a/client/stylesheets/custom.css b/client/stylesheets/custom.css
index dc89720..f8887a2 100644
--- a/client/stylesheets/custom.css
+++ b/client/stylesheets/custom.css
@@ -30,6 +30,12 @@ table .dropdown-menu > li > span{
   padding: 6px 16px;
   display: block;
 }
+span.logout {
+  background-color: #1a222f;
+  border-color: #ffffff;
+  color: #fff;
+  cursor: pointer;
+}
 button.close span{
   font-size: 24px;
   color: black;
diff --git a/imports/client/views/org/app/module/navigation/AuthenticatedNavigation.js b/imports/client/views/org/app/module/navigation/AuthenticatedNavigation.js
index 291ec42..d56a171 100644
--- a/imports/client/views/org/app/module/navigation/AuthenticatedNavigation.js
+++ b/imports/client/views/org/app/module/navigation/AuthenticatedNavigation.js
@@ -45,7 +45,7 @@ export class AuthenticatedNavigation extends Component {
           <Navbar.Brand>
             <a href="#">
               <Glyphicon glyph="link" />
-              &nbsp; YoungDesk 
+              &nbsp; YoungDesk
             </a>
           </Navbar.Brand>
           <ul className="nav navbar-nav visible-xs-block">
@@ -136,7 +136,11 @@ export class AuthenticatedNavigation extends Component {
         </ul>
         <div className="navbar-right">
             <p className="navbar-text">Hello {user.getFullName()}</p>
-            <p className="navbar-text"><span className="label bg-success-400">Online</span></p>
+            <p className="navbar-text"
+              onClick   = {() => logout()}
+            >
+              <span className="label logout">logout</span>
+              </p>
             <Nav>
                 <NavDropdown title="Activity" id="activity">
                     <div className="dropdown-content">