diff --git a/imports/client/views/org/app/module/navigation/AuthenticatedNavigation.js b/imports/client/views/org/app/module/navigation/AuthenticatedNavigation.js
index 4b9d53e..a922d09 100644
--- a/imports/client/views/org/app/module/navigation/AuthenticatedNavigation.js
+++ b/imports/client/views/org/app/module/navigation/AuthenticatedNavigation.js
@@ -3,21 +3,24 @@ import { browserHistory }                 from 'react-router';
 import { LinkContainer }                  from 'react-router-bootstrap';
 import { logout }                         from '/imports/client/app/utils/loginMethods';
 import { Navbar,Modal, Nav, NavItem,
-  Glyphicon, Collapse, 
+  Glyphicon, Collapse,
   NavbarToggler, NavbarBrand,
   NavLink, DropdownItem, DropdownToggle, DropdownMenu,
   NavDropdown, MenuItem }                 from 'react-bootstrap';
 import { Meteor }                         from 'meteor/meteor';
+import $                                  from 'jquery';
+
 
 const handleLogout = () => Meteor.logout(() => browserHistory.push('/login'));
 
 export class AuthenticatedNavigation extends Component {
   constructor(props) {
     super(props);
-
     this.toggle = this.toggle.bind(this);
+    this.changeBodyClass = this.changeBodyClass.bind(this);
     this.state = {
-      dropdownOpen: false
+      dropdownOpen: false,
+      burgerMenu: false
     };
   }
   toggle() {
@@ -25,13 +28,22 @@ export class AuthenticatedNavigation extends Component {
       dropdownOpen: !this.state.dropdownOpen
     });
   }
+  changeBodyClass(){
+    if(this.state.burgerMenu){
+      $('body').addClass('sidebar-xs');
+      this.setState({burgerMenu: false});
+    }else{
+      $('body').removeClass('sidebar-xs');
+      this.setState({burgerMenu: true});
+    }
+  }
   render(){
     const {user, org} = this.props.data;
     return(
       <Navbar inverse collapseOnSelect className="bg-crimson">
         <Navbar.Header>
           <Navbar.Brand>
-            <a href="#"><Glyphicon glyph="link" /> 
+            <a href="#"><Glyphicon glyph="link" />
             {org.name} </a>
           </Navbar.Brand>
           <ul className="nav navbar-nav visible-xs-block">
@@ -43,9 +55,12 @@ export class AuthenticatedNavigation extends Component {
         <Navbar.Collapse id="navbar-mobile">
         <ul className="nav navbar-nav">
             <NavItem eventKey={1} href="#" className="sidebar-control sidebar-main-toggle hidden-xs">
-                <i className="icon-paragraph-justify3"/>
+                <i
+                className="icon-paragraph-justify3 burgerMenu"
+                onClick = {this.changeBodyClass}
+                />
             </NavItem>
-            
+
             <NavDropdown title="Dropdown" id="update">
                 <div className="dropdown-content">
                     <div className="dropdown-content-heading">
@@ -53,7 +68,7 @@ export class AuthenticatedNavigation extends Component {
                         <ul className="icons-list">
                             <li><a href="#"><i className="icon-sync"></i></a></li>
                         </ul>
-                     
+
                     </div>
                     <ul className="media-list dropdown-content-body width-350">
                         <li className="media">
@@ -208,7 +223,7 @@ export class AuthenticatedNavigation extends Component {
                         <ul className="media-list dropdown-content-body">
                             <li className="media">
                                 <div className="media-left">
-                                    
+
                                     <span className="badge bg-danger-400 media-badge">5</span>
                                 </div>
 
@@ -224,7 +239,7 @@ export class AuthenticatedNavigation extends Component {
 
                             <li className="media">
                                 <div className="media-left">
-                                    
+
                                     <span className="badge bg-danger-400 media-badge">4</span>
                                 </div>
 
@@ -258,13 +273,13 @@ export class AuthenticatedNavigation extends Component {
                                         <span className="media-annotation pull-right">Tue</span>
                                     </a>
 
-                                    <span className="text-muted">What a strenuous career it is that I've chosen...</span>
+                                    <span className="text-muted">What a strenuous career it is that I have chosen...</span>
                                 </div>
                             </li>
 
                             <li className="media">
                                 <div className="media-left">
-                                
+
                                 </div>
                                 <div className="media-body">
                                     <a href="#" className="media-heading">
@@ -282,19 +297,8 @@ export class AuthenticatedNavigation extends Component {
                         </div>
                     </div>
                 </NavDropdown>
-              
-             {/* <NavItem eventKey={2} href="#">
-                 <div
-                  className = "appLayout-topItem"
-                  onClick   = {() => logout()}
-                >
-                  logout
-                </div>
-              </NavItem>*/}
-              
             </Nav>
         </div>
-       
       </Navbar.Collapse>
     </Navbar>
     );
diff --git a/package.json b/package.json
index e90d2b3..598dcc1 100644
--- a/package.json
+++ b/package.json
@@ -80,6 +80,7 @@
     "react-addons-transition-group": "^15.4.2",
     "react-bootstrap": "^0.30.8",
     "react-bootstrap-date-picker": "^4.0.0",
+    "react-burger-menu": "^1.10.14",
     "react-dom": "^15.4.2",
     "react-fontawesome": "^1.5.0",
     "react-komposer": "^1.13.1",