diff --git a/app/assets/javascripts/sidebar.js.erb b/app/assets/javascripts/sidebar.js.erb
index 5fbbb2c6a..2d2558fbf 100644
--- a/app/assets/javascripts/sidebar.js.erb
+++ b/app/assets/javascripts/sidebar.js.erb
@@ -128,7 +128,7 @@ function setupSidebarTree() {
       }
       el
       .find(" > span i")
-      .attr("title", "Expand this branch")
+      .attr("title", I18n.t('sidebar.branch_expand'))
       .removeClass("expanded");
     } else {
       if (animate) {
@@ -138,7 +138,7 @@ function setupSidebarTree() {
       }
       el
       .find(" > span i")
-      .attr("title", "Collapse this branch")
+      .attr("title", I18n.t('sidebar.branch_collapse'))
       .addClass("expanded");
     }
   }
@@ -147,7 +147,7 @@ function setupSidebarTree() {
   $(".tree li:has(ul)")
   .addClass("parent_li")
   .find(" > span i")
-  .attr("title", "Collapse this branch");
+  .attr("title", I18n.t('sidebar.branch_collapse'));
   $(".tree li.parent_li ")
   .find("> span i")
   .addClass("glyphicon glyphicon-triangle-right expanded");
diff --git a/app/assets/javascripts/users/settings/list_toggle.js.erb b/app/assets/javascripts/users/settings/list_toggle.js.erb
new file mode 100644
index 000000000..a006dde1b
--- /dev/null
+++ b/app/assets/javascripts/users/settings/list_toggle.js.erb
@@ -0,0 +1,18 @@
+(function() {
+  'use strict';
+
+  $(".tree li.parent_li ").find("> span i").on("click", function (e) {
+    e.stopPropagation();
+    var el = $(this).closest("li.parent_li");
+
+    if (el.find(" > ul.accountNavigation").is(":visible")) {
+      el.find(" > span > i.triangleDown").hide();
+      el.find(" > span > i.triangleRight").show();
+      el.find(" > ul.accountNavigation").hide();
+    } else {
+      el.find(" > span > i.triangleDown").show();
+      el.find(" > span > i.triangleRight").hide();
+      el.find(" > ul.accountNavigation").show();
+    }
+  });
+})();
diff --git a/app/controllers/users/registrations_controller.rb b/app/controllers/users/registrations_controller.rb
index 9adfc5e6c..b50f8b9f3 100644
--- a/app/controllers/users/registrations_controller.rb
+++ b/app/controllers/users/registrations_controller.rb
@@ -4,6 +4,7 @@ class Users::RegistrationsController < Devise::RegistrationsController
                 only: %i(new create new_with_provider create_with_provider)
   before_action :sign_up_with_provider_enabled?,
                 only: %i(new_with_provider create_with_provider)
+  layout :layout
 
   def avatar
     user = User.find_by_id(params[:id]) || current_user
@@ -291,6 +292,10 @@ class Users::RegistrationsController < Devise::RegistrationsController
 
   private
 
+  def layout
+    'fluid' if action_name == 'edit'
+  end
+
   def check_captcha
     if Rails.configuration.x.enable_recaptcha
       unless verify_recaptcha
diff --git a/app/controllers/users/settings/account/addons_controller.rb b/app/controllers/users/settings/account/addons_controller.rb
index 9b18d556a..aa4412a78 100644
--- a/app/controllers/users/settings/account/addons_controller.rb
+++ b/app/controllers/users/settings/account/addons_controller.rb
@@ -2,6 +2,7 @@ module Users
   module Settings
     module Account
       class AddonsController < ApplicationController
+        layout 'fluid'
       end
     end
   end
diff --git a/app/controllers/users/settings/account/preferences_controller.rb b/app/controllers/users/settings/account/preferences_controller.rb
index 723641a49..ef983b4c9 100644
--- a/app/controllers/users/settings/account/preferences_controller.rb
+++ b/app/controllers/users/settings/account/preferences_controller.rb
@@ -9,6 +9,7 @@ module Users
           :reset_tutorial,
           :notifications_settings
         ]
+        layout 'fluid'
 
         def index
         end
diff --git a/app/controllers/users/settings/teams_controller.rb b/app/controllers/users/settings/teams_controller.rb
index 620fcd3c5..8917cd25b 100644
--- a/app/controllers/users/settings/teams_controller.rb
+++ b/app/controllers/users/settings/teams_controller.rb
@@ -22,6 +22,8 @@ module Users
       before_action :check_create_team_permission,
                     only: %i(new create)
 
+      layout 'fluid'
+
       def index
         @user_teams =
           @user
diff --git a/app/views/users/registrations/edit.html.erb b/app/views/users/registrations/edit.html.erb
index 6ac1bd0d9..5f99d1fbd 100644
--- a/app/views/users/registrations/edit.html.erb
+++ b/app/views/users/registrations/edit.html.erb
@@ -1,14 +1,11 @@
 <% provide(:head_title, t("users.registrations.edit.head_title")) %>
 
-<%= render partial: "users/settings/navigation.html.erb" %>
+<%= render partial: "users/settings/sidebar" %>
 <div class="tab-content">
   <div class="tab-pane tab-pane-settings active" role="tabpanel">
 
     <div class="row">
-      <div class="col-xs-12 col-sm-3">
-        <%= render partial: 'users/settings/account/navigation.html.erb' %>
-      </div>
-      <div class="col-xs-12 col-sm-9">
+      <div class="col-xs-12 col-sm-12">
         <div class="row">
           <div class="col-md-4">
             <h2><%=t "users.registrations.edit.title" %></h2>
diff --git a/app/views/users/settings/_navigation.html.erb b/app/views/users/settings/_navigation.html.erb
deleted file mode 100644
index a5f481cd3..000000000
--- a/app/views/users/settings/_navigation.html.erb
+++ /dev/null
@@ -1,9 +0,0 @@
-<ul data-hook="user-settings-navigation-html"
-    class="nav nav-tabs nav-settings">
-  <li role="presentation" class="<%= 'active' if on_settings_account_page? %>">
-    <%= link_to t("users.settings.navigation.account"), edit_user_registration_path %>
-  </li>
-  <li role="presentation" class="<%= "active" if on_settings_team_page? %>">
-    <%= link_to t("users.settings.navigation.teams"), teams_path %>
-  </li>
-</ul>
diff --git a/app/views/users/settings/_sidebar.html.erb b/app/views/users/settings/_sidebar.html.erb
new file mode 100644
index 000000000..d27b2be12
--- /dev/null
+++ b/app/views/users/settings/_sidebar.html.erb
@@ -0,0 +1,91 @@
+<%= content_for :sidebar do %>
+ <div id="slide-panel" class="visible">
+   <div class="tree">
+     <ul data-hook="user-settings-navigation-html">
+       <li>
+         <span class="tree-link line-wrap no-indent">
+           <strong title="<%= t('users.settings.sidebar.title') %>"><%= t('users.settings.sidebar.title') %></strong>
+         </span>
+       </li>
+       <!-- Account -->
+       <li class="parent_li" >
+         <span class="tree-link line-wrap no-indent">
+           <i title="<%= t('sidebar.branch_expand') %>"
+              class="glyphicon glyphicon-triangle-right triangleRight"
+              aria-hidden="true"
+              style="<%= 'display: none;' if on_settings_account_page? %>"
+              ></i>
+           <i title="<%= t('sidebar.branch_collapse') %>"
+              class="glyphicon glyphicon-triangle-right expanded triangleDown"
+              aria-hidden="true"
+              style="<%= 'display: none;' unless on_settings_account_page? %>"
+              ></i>
+           <% account_style = 'font-weight: bold;' if on_settings_account_page? %>
+           <%= link_to t("users.settings.sidebar.account"),
+                       edit_user_registration_path,
+                       style: account_style,
+                       data: { 'no-turbolink' => 'true' } %>
+         </span>
+
+         <ul class="accountNavigation" data-hook="user-settings-account-navigation-html" style="<%= 'display: none;' unless on_settings_account_page? %>">
+           <li class="<%= 'active' if on_settings_account_profile_page? %>" >
+             <span class="tree-link line-wrap first-indent">
+               <% if on_settings_account_profile_page? %>
+                 <span title="<%= t("users.settings.sidebar.account_nav.profile") %>"><%= t("users.settings.sidebar.account_nav.profile") %></span>
+               <% else %>
+                 <%= link_to t("users.settings.sidebar.account_nav.profile"),
+                             edit_user_registration_path,
+                             data: { 'no-turbolink' => 'true' } %>
+               <% end %>
+             </span>
+           </li>
+           <li class="<%= 'active' if on_settings_account_preferences_page? %>" >
+             <span class="tree-link line-wrap first-indent">
+               <% if on_settings_account_preferences_page? %>
+                 <span title="<%= t("users.settings.sidebar.account_nav.preferences") %>"><%= t("users.settings.sidebar.account_nav.preferences") %></span>
+               <% else %>
+                 <%= link_to t("users.settings.sidebar.account_nav.preferences"),
+                             preferences_path,
+                             data: { 'no-turbolink' => 'true' } %>
+               <% end %>
+             </span>
+           </li>
+           <li class="<%= 'active' if on_settings_account_addons_page? %>" >
+             <span class="tree-link line-wrap first-indent">
+               <% if on_settings_account_addons_page? %>
+                 <span title="<%= t("users.settings.sidebar.account_nav.addons") %>"><%= t("users.settings.sidebar.account_nav.addons") %></span>
+               <% else %>
+                 <%= link_to t("users.settings.sidebar.account_nav.addons"),
+                             addons_path,
+                             data: { 'no-turbolink' => 'true' } %>
+               <% end %>
+             </span>
+           </li>
+         </ul>
+       </li>
+
+       <!-- Teams -->
+       <li class="<%= 'active' if on_settings_team_page? %>" >
+         <span class="tree-link line-wrap no-indent">
+           <% if on_settings_team_page? %>
+           <span title="<%= t("users.settings.sidebar.teams") %>"><%= t("users.settings.sidebar.teams") %></span>
+           <% else %>
+             <%= link_to t("users.settings.sidebar.teams"),
+                         teams_path,
+                         data: { 'no-turbolink' => 'true' } %>
+           <% end %>
+         </span>
+       </li>
+
+     </ul>
+   </div>
+ </div>
+<% end %>
+
+<script>
+ $(document).ready(function() {
+   $('#wrapper').show();
+ })
+</script>
+
+<%= javascript_include_tag("users/settings/list_toggle") %>
diff --git a/app/views/users/settings/account/_navigation.html.erb b/app/views/users/settings/account/_navigation.html.erb
deleted file mode 100644
index efaf781db..000000000
--- a/app/views/users/settings/account/_navigation.html.erb
+++ /dev/null
@@ -1,11 +0,0 @@
-<ul class="nav nav-pills nav-stacked nav-stacked-arrow" data-hook="user-settings-account-navigation-html">
-  <li role="presentation" class="<%= 'active' if on_settings_account_profile_page? %>">
-    <%= link_to t('users.settings.account.navigation.profile'), edit_user_registration_path %>
-  </li>
-  <li role="presentation" class="<%= 'active' if on_settings_account_preferences_page? %>">
-    <%= link_to t('users.settings.account.navigation.preferences'), preferences_path %>
-  </li>
-  <li role="presentation" class="<%= 'active' if on_settings_account_addons_page? %>">
-    <%= link_to t('users.settings.account.navigation.addons'), addons_path %>
-  </li>
-</ul>
diff --git a/app/views/users/settings/account/addons/index.html.erb b/app/views/users/settings/account/addons/index.html.erb
index de7c58a21..6022900b6 100644
--- a/app/views/users/settings/account/addons/index.html.erb
+++ b/app/views/users/settings/account/addons/index.html.erb
@@ -1,14 +1,11 @@
 <% provide(:head_title, t('users.settings.account.addons.head_title')) %>
 
-<%= render partial: 'users/settings/navigation.html.erb' %>
+<%= render partial: 'users/settings/sidebar.html.erb' %>
 <div class="tab-content">
   <div class="tab-pane tab-pane-settings active" role="tabpanel">
 
     <div class="row">
-      <div class="col-xs-12 col-sm-3">
-        <%= render partial: 'users/settings/account/navigation.html.erb' %>
-      </div>
-      <div class="col-xs-12 col-sm-9">
+      <div class="col-xs-12 col-sm-12">
         <h4><%= t('users.settings.account.addons.title') %></h4>
         <div data-hook="settings-addons-container">
           <em data-hook="settings-addons-no-addons">
diff --git a/app/views/users/settings/account/preferences/index.html.erb b/app/views/users/settings/account/preferences/index.html.erb
index 662caf09f..2aa0d334c 100644
--- a/app/views/users/settings/account/preferences/index.html.erb
+++ b/app/views/users/settings/account/preferences/index.html.erb
@@ -1,14 +1,11 @@
 <% provide(:head_title, t("users.settings.account.preferences.head_title")) %>
 
-<%= render partial: "users/settings/navigation.html.erb" %>
+<%= render partial: "users/settings/sidebar.html.erb" %>
 <div class="tab-content">
   <div class="tab-pane tab-pane-settings active" role="tabpanel">
 
     <div class="row">
-      <div class="col-xs-12 col-sm-3">
-        <%= render partial: 'users/settings/account/navigation.html.erb' %>
-      </div>
-      <div class="col-xs-12 col-sm-9">
+      <div class="col-xs-12 col-sm-12">
         <%= form_for(@user,
                      url: update_preferences_path(format: :json),
                      remote: true,
diff --git a/app/views/users/settings/teams/index.html.erb b/app/views/users/settings/teams/index.html.erb
index 13c749e0b..f2508f7ff 100644
--- a/app/views/users/settings/teams/index.html.erb
+++ b/app/views/users/settings/teams/index.html.erb
@@ -1,6 +1,6 @@
 <% provide(:head_title, t("users.settings.teams.head_title")) %>
 
-<%= render partial: "users/settings/navigation.html.erb" %>
+<%= render partial: "users/settings/sidebar.html.erb" %>
 <div class="tab-content">
   <div class="tab-pane tab-pane-settings" role="tabpanel"></div>
   <div class="tab-pane tab-pane-settings active" role="tabpanel">
diff --git a/app/views/users/settings/teams/new.html.erb b/app/views/users/settings/teams/new.html.erb
index 72b9967ce..9c95922c7 100644
--- a/app/views/users/settings/teams/new.html.erb
+++ b/app/views/users/settings/teams/new.html.erb
@@ -1,6 +1,6 @@
 <% provide(:head_title, t("users.settings.teams.head_title")) %>
 
-<%= render partial: "users/settings/navigation.html.erb" %>
+<%= render partial: "users/settings/sidebar.html.erb" %>
 <div class="tab-content">
   <div class="tab-pane tab-pane-settings" role="tabpanel"></div>
   <div class="tab-pane tab-pane-settings active" role="tabpanel">
diff --git a/app/views/users/settings/teams/show.html.erb b/app/views/users/settings/teams/show.html.erb
index f4cc608a2..64559af9b 100644
--- a/app/views/users/settings/teams/show.html.erb
+++ b/app/views/users/settings/teams/show.html.erb
@@ -2,7 +2,7 @@
 
 <div data-hook="team-beginning"></div>
 
-<%= render partial: "users/settings/navigation.html.erb" %>
+<%= render partial: "users/settings/sidebar.html.erb" %>
 <div class="tab-content">
   <div class="tab-pane tab-pane-settings" role="tabpanel"></div>
   <div class="tab-pane tab-pane-settings active" role="tabpanel">
diff --git a/config/initializers/assets.rb b/config/initializers/assets.rb
index c76aa8e05..c32a85883 100644
--- a/config/initializers/assets.rb
+++ b/config/initializers/assets.rb
@@ -17,6 +17,7 @@ Rails.application.config.assets.precompile += %w(underscore.js)
 Rails.application.config.assets.precompile += %w(jsPlumb-2.0.4-min.js)
 Rails.application.config.assets.precompile += %w(jsnetworkx.js)
 Rails.application.config.assets.precompile += %w(handsontable.full.min.js)
+Rails.application.config.assets.precompile += %w(users/settings/list_toggle.js.erb)
 Rails.application.config.assets.precompile +=
   %w(users/settings/account/preferences/index.js)
 Rails.application.config.assets.precompile += %w(users/settings/teams/index.js)
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 31847fa5c..1210b2f88 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -111,6 +111,8 @@ en:
 
   sidebar:
     title: "Navigation"
+    branch_expand: "Expand this branch"
+    branch_collapse: "Collapse this branch"
     no_module_group: "No workflow"
     projects:
       all: "All Projects"
@@ -1354,14 +1356,15 @@ en:
       changed_team_flash: "You are working on %{team} now!"
       changed_team_error_flash: "Something went wrong! Try again later."
       changed_team_in_search: "The searched item is not in your current team. You will be redirected to %{team} team!"
-      navigation:
+      sidebar:
+        title: "Settings"
         account: "Account"
         teams: "Teams"
-      account:
-        navigation:
+        account_nav:
           profile: "Profile"
           preferences: "Preferences"
           addons: "Add-ons"
+      account:
         preferences:
           head_title: "Settings | My preferences"
           edit: