[MERGE] forward port of branch saas-10 up to b26fd22

96 files changed, 7201 insertions, 2776 deletions

diff --git a/doc/_extensions/odoo/__init__.py b/doc/_extensions/odoo/__init__.py
index 782a5f3b82e..bb0cac5588f 100644
--- a/doc/_extensions/odoo/__init__.py
+++ b/doc/_extensions/odoo/__init__.py
@@ -2,6 +2,7 @@
 
 from . import pygments_override
 from . import switcher
+from . import translator
 
 import sphinx.environment
 import sphinx.builders.html
@@ -67,10 +68,10 @@ def navbarify(node, navbar=None):
             # no subrefs -> ignore
             if not list_item.children[1].children:
                 continue
-            # otherwise replace reference node by its own children
+            # otherwise replace reference node by an inline (so it can still be styled)
             para = n.parent
             para.remove(n)
-            para.extend(n.children)
+            para.append(nodes.inline('', '', *n.children))
 
 
 def resolve_content_toctree(
diff --git a/doc/_extensions/odoo/breadcrumb_list.html b/doc/_extensions/odoo/breadcrumb_list.html
new file mode 100644
index 00000000000..9d670a4879c
--- /dev/null
+++ b/doc/_extensions/odoo/breadcrumb_list.html
@@ -0,0 +1,23 @@
+{# warning: if doc structure change, these rules may have to change as well #}
+
+{# =====  VARIABLES  ====== #}
+{% set master_doc_short_name = 'Developer Doc' %}
+
+{% if pagename == master_doc %}
+    <li><a href="{{ pathto(master_doc) }}" class="active">{{ master_doc_short_name }}</a></li>
+{% else %}
+    {% for parent in parents %}
+        {% if loop.length > 1%}
+            {% if loop.first %}
+                <li><a href="{{ pathto(master_doc) }}">{{ master_doc_short_name }}</a></li>
+            {% else %}
+                {% if loop.index == 2 %}
+                    <li><a href="{{ parent.link|e }}">{{parent.title}}</a></li>
+                {% endif %}
+            {% endif %}
+        {% else %}
+            <li><a href="{{ pathto(master_doc) }}">{{ master_doc_short_name }}</a></li>
+        {% endif %}
+    {% endfor %}
+    <li class="active"><a href="#">{{ meta.get('main-title', title) }}</a></li>
+{% endif %}
\ No newline at end of file
diff --git a/doc/_extensions/odoo/layout.html b/doc/_extensions/odoo/layout.html
index 8f00a47474d..a7ed5078040 100644
--- a/doc/_extensions/odoo/layout.html
+++ b/doc/_extensions/odoo/layout.html
@@ -45,83 +45,213 @@
 {%- endblock -%}
 
 {%- block header -%}
-  <header class="{{ ' '.join(classes) }}">
-    <figure class="card top">
-      <span class="card-img" {% if meta['banner'] %}style="background-image: url('{{ pathto('_static/' + meta['banner'], True) }}');"{% endif %}></span>
-    </figure>
-  </header>
-  <nav id="main_navbar" class="navbar {{ ' '.join(classes) }}">
-    <div class="container-fluid">
-      <!-- Brand and toggle get grouped for better mobile display -->
-      <div class="navbar-header">
-        <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target=".navbar-main">
-          <span class="sr-only">Toggle navigation</span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-          <span class="icon-bar"></span>
-        </button>
-        <nav class="nav navbar-nav navbar-left">
-          <li id="main-back"><a href="{{ pathto(master_doc) }}" class="mdi-navigation-arrow-back"></a></li>
-          <li>
-            <h1 id="main_title">{{ meta.get('main-title', title) }}</h1>
-          </li>
-        </nav>
+  <header class="o_main_header o_has_sub_nav o_inverted {{ ' '.join(classes) }}">
+    <div class="o_main_header_main">
+      <a class="pull-left o_logo" href="/"></a>
+      <a href="#" class="o_mobile_menu_toggle visible-xs-block pull-right">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="mdi-navigation-menu"></span>
+      </a>
+      <div class="o_header_buttons">
+        <a href="http://www.odoo.com/trial" class="btn btn-primary">Start Now</a>
       </div>
+      <ul class="o_primary_nav">
+        <li class="dropdown">
+          <a href="#" class="dropdown-toggle">Apps</a>
+          <div class="dropdown-menu o_secondary_nav">
+            <div class="container">
+              <div class="row">
+                <div class="col-sm-3 o_website_apps">
+                  <div class="o_nav_app_family">
+                    <span></span> Websites
+                    <div>Build great user experience</div>
+                  </div>
+                  <ul>
+                    <li><a href="https://www.odoo.com/page/website-builder">Website Builder</a></li>
+                    <li><a href="https://www.odoo.com/page/e-commerce">eCommerce</a></li>
+                    <li><a href="https://www.odoo.com/page/blog-engine">Blogs</a></li>
+                    <li><a href="https://www.odoo.com/page/community-builder">Forums</a></li>
+                    <li><a href="https://www.odoo.com/page/slides">Slides</a></li>
+                    <li><a href="https://adspike.odoo.com">SEA</a></li>
+                  </ul>
+                </div>
+                <div class="col-sm-3 o_sale_apps">
+                  <div class="o_nav_app_family">
+                    <span></span> Sales
+                    <div>Boost your success rate</div>
+                  </div>
+                  <ul>
+                    <li><a href="https://www.odoo.com/page/sales">Sales</a></li>
+                    <li><a href="https://www.odoo.com/page/crm">CRM</a></li>
+                    <li><a href="https://www.odoo.com/page/billing">Invoicing</a></li>
+                    <li class="dropdown">
+                      <a href="#0" class="dropdown-toggle">Point of Sale</a>
+                      <ul>
+                        <li><a href="https://www.odoo.com/page/point-of-sale">Shops</a></li>
+                        <li><a href="https://www.odoo.com/page/pos-restaurant">Restaurants</a></li>
+                      </ul>
+                    </li>
+                    <li><a href="https://www.odoo.com/page/subscriptions">Subscriptions</a></li>
+                    <li><a href="https://www.odoo.com/page/sign">Sign</a></li>
+                  </ul>
+                </div>
+                <div class="col-sm-3 o_operation_apps">
+                  <div class="o_nav_app_family">
+                    <span></span> Operations
+                    <div>It's all about efficiency</div>
+                  </div>
+                  <ul>
+                    <li><a href="https://www.odoo.com/page/accounting/">Accounting</a></li>
+                    <li><a href="https://www.odoo.com/page/project-management/">Project</a></li>
+                    <li class="dropdown">
+                      <a href="#0" class="dropdown-toggle">Human Resources</a>
+                      <ul>
+                        <li><a href="https://www.odoo.com/page/recruitment">Recruitment</a></li>
+                        <li><a href="https://www.odoo.com/page/employees">Employees</a></li>
+                        <li><a href="https://www.odoo.com/page/expenses">Expenses</a></li>
+                        <li><a href="https://www.odoo.com/page/appraisal">Appraisal</a></li>
+                        <li><a href="https://www.odoo.com/page/fleet">Fleet</a></li>
+                        <li><a href="https://www.odoo.com/page/leaves">Leaves</a></li>
+                      </ul>
+                    </li>
+                    <li><a href="https://www.odoo.com/page/warehouse">Inventory</a></li>
+                    <li><a href="https://www.odoo.com/page/purchase">Purchase</a></li>
+                    <li class="dropdown">
+                      <a href="#0" class="dropdown-toggle">Manufacturing</a>
+                      <ul>
+                        <li><a href="https://www.odoo.com/page/manufacturing">MRP</a></li>
+                        <li><a href="https://www.odoo.com/page/plm">PLM</a></li>
+                        <li><a href="https://www.odoo.com/page/maintenance">Maintenance</a></li>
+                        <li><a href="https://www.odoo.com/page/quality">Quality</a></li>
+                      </ul>
+                    </li>
+                  </ul>
+                </div>
+                <div class="col-sm-3 o_productivity_apps">
+                  <div class="o_nav_app_family">
+                    <span></span> Productivity Tools
+                    <div>Great Tools = Happy People</div>
+                  </div>
+                  <ul>
+                    <li class="dropdown">
+                      <a href="#0" class="dropdown-toggle">Communication</a>
+                      <ul>
+                        <li><a href="https://www.odoo.com/page/discuss">Discuss</a></li>
+                        <li><a href="https://www.odoo.com/page/discuss-groups">Mailing Lists</a></li>
+                        <li><a href="https://www.odoo.com/page/notes">Notes</a></li>
+                        <li><a href="#">Help desk</a></li>
+                        <li><a href="#">Appointment</a></li>
+                      </ul>
+                    </li>
+                    <li><a href="https://www.odoo.com/page/timesheet">Timesheet</a></li>
+                    <li><a href="https://www.odoo.com/page/email-marketing">Email Marketing</a></li>
+                    <li><a href="https://www.odoo.com/page/events">Events</a></li>
+                    <li><a href="https://www.odoo.com/page/survey">Survey</a></li>
+                    <li><a href="https://www.odoo.com/page/live-chat">Live Chat</a></li>
+                  </ul>
+                </div>
+              </div>
+            </div>
+            <a href="http://www.odoo.com/apps/modules" class="o_store_link"><i class="fa fa-cube fa-fw"></i> Third party apps</a>
+          </div>
+        </li>
+        <li><a href="https://www.odoo.com/page/tour">Tour</a></li>
+        <li><a href="https://www.odoo.com/pricing">Pricing</a></li>
+        <li><a href="https://www.odoo.com/page/docs">Docs</a></li>
+      </ul>
+    </div>
+    <nav class="navbar o_sub_nav">
+      <div class="container">
+        <div class="navbar-header visible-xs">
+            <button type="button" class="navbar-toggle collapsed text-left btn-block" data-toggle="collapse" data-target="#o_sub-menu" aria-expanded="false">
+              Navigate
+              <span class="mdi-hardware-keyboard-arrow-down pull-right"></span>
+            </button>
+        </div>
 
-      <nav class="collapse navbar-collapse navbar-main navbar-right" role="navigation">
-        {% if versions %}
-          <ul class="navbar-nav navbar-right nav">
-            <li class="versions">
-              <a class="dropdown-toggle" data-toggle="dropdown">
-                {{ version }} <span class="caret"></span>
-              </a>
-              <ul class="dropdown-menu" role="menu">
-                {% for name, url in versions %}
-                  <li><a href="{{ url }}">{{ name }}</a></li>
-                {% endfor %}
-              </ul>
-            </li>
+        <div class="collapse navbar-collapse" id="o_sub-menu">
+          <ol class="o_breadcrumb breadcrumb nav navbar-left">
+              {% block breadcrumb_desktop %}
+              {% include "breadcrumb_list.html" %}
+              {% endblock %}
+          </ol>
+
+          <div class="call-to-action navbar-right hidden-xs">
+            <a href="http://www.odoo.com/trial" class="btn btn-primary">Start Now</a>
+          </div>
+
+          <ul class="navbar-nav navbar-right nav o_sub_nav_actions">
+            {% if pagename != master_doc %}
+              <li class="divider"></li>
+            {% endif%}
+
+            {% block switchers_desktop %}
+            {% include "switchers_list.html" %}
+            {% endblock %}
           </ul>
-        {% endif %}
-        {{ toctree(titles_only=True, maxdepth=2, includehidden=True, collapse=False, navbar='main') }}
-      </nav>
-    </div>
-  </nav>
+
+          <ul class="nav navbar-nav navbar-right">
+            {% if languages or versions %}
+              <li class="divider"></li>
+            {% endif %}
+
+            {% block sub_menu_desktop %}
+            {% include "sub-menu_list.html" %}
+            {% endblock %}
+
+            {% if languages or versions %}
+              <li class="divider"></li>
+            {% endif %}
+          </ul>
+        </div>
+      </div>
+    </nav>
+  </header>
+
 {%- endblock -%}
 
 {%- block content -%}
-  {% if 'code-column' in meta %}
+  <div id="wrap" class="{{' '.join(classes) }}">
+    {% if meta['banner'] %}
+    {% set has_banner = 'has_banner' %}
+    {% endif %}
+    <figure class="card top {{ has_banner }}">
+      <span class="card-img" {% if meta['banner'] %}style="background-image: url('{{ pathto('_static/' + meta['banner'], True) }}');"{% endif %}></span>
+      <div class="container text-center">
+        <h1> {{ meta.get('main-title', title) }} </h1>
+      </div>
+    </figure>
+    {% if 'code-column' in meta %}
     {% set container = 'container-fluid' %}
-  {% else %}
+    {% else %}
     {% set container = 'container' %}
-  {% endif %}
-  <main class="{{ container }} {{ ' '.join(classes) }}">
-    {% if pagename != master_doc %}
-    <div class="row">
-      {% if 'has-toc' not in meta %}
-      <aside>
-        <div class="navbar-aside text-center">
-          <div class="logo_box">
-            <span class="logo"></span>
-            Documentation
-          </div>
-          {{ toc }}
-          {% if github_link %}
-          <p class="gith-container"><a href="{{ github_link(mode='edit') }}" class="gith-link">
-              Edit on GitHub
-          </a></p>
+    {% endif %}
+    <div class="{{ container}} {{ ' '.join(classes) }}">
+      <main class="container-fluid {{ ' '.join(classes) }}">
+        {% if pagename != master_doc %}
+        <div class="row">
+          {% if 'has-toc' not in meta %}
+          <aside>
+            <div class="navbar-aside text-center">
+              {{ toc }}
+              {% if github_link %}
+              <p class="gith-container"><a href="{{ github_link(mode='edit') }}" class="gith-link">
+                  Edit on GitHub
+              </a></p>
+              {% endif %}
+            </div>
+          </aside>
           {% endif %}
+          <article class="doc-body {% if 'has-toc' in meta %}doc-toc{% endif %}">
+            {% endif %}
+            {% block body %} {% endblock %}
+          {% if pagename != master_doc %}</article>
         </div>
-      </aside>
-      {% endif %}
-      <article class="doc-body {% if 'has-toc' in meta %}doc-toc{% endif %}">
         {% endif %}
-        {% block body %} {% endblock %}
-      {% if pagename != master_doc %}</article>
+        <div id="mask"></div>
+      </main>
     </div>
-    {% endif %}
-    <div id="mask"></div>
-  </main>
+  </div>
 
   <div class="floating_action_container">
     <a id="floating_action" class="ripple" href="#">
@@ -138,4 +268,76 @@
       </ul>
     </div>
   </div>
+  <footer>
+    <div id="footer" class="container">
+      <span class="o_logo o_logo_inverse center-block o_footer_logo"></span>
+      <div class="row">
+        <div class="col-sm-7 col-md-7 col-lg-6">
+          <div class="row">
+            <div class="col-xs-6 col-sm-4">
+              <span class="menu_title">Community</span>
+              <ul>
+                <li><a href="https://github.com/odoo/odoo">Github</a></li>
+                <li><a href="http://www.odoo.com/page/download">Download</a></li>
+                <li class="divider"></li>
+                <li><a href="http://runbot.odoo.com/runbot/repo/git-github-com-odoo-enterprise-7">Runbot</a></li>
+                <li><a href="https://github.com/odoo/odoo/wiki/Translations">Translations</a></li>
+                <li class="divider"></li>
+                <li><a href="http://www.odoo.com/page/odoo-community">Mailing Lists</a></li>
+                <li><a href="http://www.odoo.com/forum/help-1">Forum</a></li>
+              </ul>
+            </div>
+            <div class="col-xs-6 col-sm-4">
+              <span class="menu_title">Services</span>
+              <ul>
+                <li><a href="http://www.odoo.com/pricing">Editions</a></li>
+                <li><a href="http://www.odoo.com/pricing-online">Cloud Pricing</a></li>
+                <li><a href="http://www.odoo.com/page/upgrade">Upgrade</a></li>
+                <li class="divider"></li>
+                <li><a href="http://www.odoo.com/partners">Find a partner</a></li>
+                <li><a href="http://www.odoo.com/page/become-a-partner">Become a partner</a></li>
+                <li class="divider"></li>
+                <li><a href="http://www.odoo.com/page/education-program">Education</a></li>
+                <li class="divider"></li>
+                <li><a href="http://www.odoo.com/page/security">Security</a></li>
+              </ul>
+            </div>
+            <div class="col-sm-4 mb64">
+              <span class="menu_title">About us</span>
+              <ul>
+                <li><a href="http://www.odoo.com/page/about-us">Our company</a></li>
+                <li><a href="http://www.odoo.com/page/contactus">Contact</a></li>
+                <li class="divider" />
+                <li><a href="http://www.odoo.com/event">Events</a></li>
+                <li><a href="http://www.odoo.com/blog/">Blog</a></li>
+                <li><a href="http://www.odoo.com/blog/6">Customers</a></li>
+                <li class="divider" />
+                <li><a href="http://www.odoo.com/jobs">Jobs</a></li>
+              </ul>
+            </div>
+          </div>
+        </div>
+        <div class="col-sm-5 col-md-4 col-md-offset-1 col-lg-5 col-lg-offset-1">
+          <p>
+            <small>
+              Odoo is a suite of open source business apps that cover all your company needs: CRM, eCommerce, accounting, inventory, point of sale, project management, etc.
+              <br/><br/>
+              Odoo's unique value proposition is to be at the same time very easy to use and fully integrated.
+            </small>
+          </p>
+        </div>
+      </div>
+    </div>
+    <div class="o_footer_bottom">
+      <div class="container">
+        <a class="small" href="http://www.odoo.com/page/website-builder">Website made with <span class="o_logo o_logo_inverse o_logo_15"></span></a>
+        <div class="social-links pull-right">
+          <a href="http://www.odoo.com/web/about/facebook"><i class="fa fa-facebook"></i></a>
+          <a href="http://www.odoo.com/web/about/twitter"><i class="fa fa-twitter"></i></a>
+          <a href="http://www.odoo.com/web/about/linkedin"><i class="fa fa-linkedin"></i></a>
+          <a href="mailto:info@odoo.com"><i class="fa fa-envelope"></i></a>
+        </div>
+      </div>
+    </div>
+  </footer>
 {%- endblock -%}
diff --git a/doc/_extensions/odoo/pygments_override.py b/doc/_extensions/odoo/pygments_override.py
index 58458f417e1..d03fb4f0ebc 100644
--- a/doc/_extensions/odoo/pygments_override.py
+++ b/doc/_extensions/odoo/pygments_override.py
@@ -1,16 +1,122 @@
 # -*- coding: utf-8 -*-
 from pygments.style import Style
-from pygments.styles.paraiso_dark import ParaisoDarkStyle
-from pygments.token import *
+from pygments.token import Keyword, Name, Comment, String, Error, Text, \
+    Number, Operator, Generic, Whitespace, Punctuation, Other, Literal
+
+
+BACKGROUND = '#272727'
+CURRENT_LINE = "#41323f"
+SELECTION = "#4f424c"
+FOREGROUND = "#e7e9db"
+COMMENT = "#776e71"
+RED = "#ef6155"
+ORANGE = "#f99b15"
+YELLOW = "#fec418"
+GREEN = "#48b685"
+AQUA = "#5bc4bf"
+BLUE = "#06b6ef"
+PURPLE = "#815ba4"
 
-# extracted from getbootstrap.com
 class OdooStyle(Style):
-    background_color = '#272727'
-    highlight_color = ParaisoDarkStyle.highlight_color
+    """Modified version of Paraiso Dark style to avoid Pygments version
+    annoyances.
+
+    Paraíso (Dark) by Jan T. Sott
+
+    Pygments template by Jan T. Sott (https://github.com/idleberg)
+    Created with Base16 Builder by Chris Kempson
+    (https://github.com/chriskempson/base16-builder).
+
+    :copyright: Copyright 2006-2014 by the Pygments team
+    :license: BSD
+    """
+
+    default_style = ''
+
+    background_color = BACKGROUND
+    highlight_color = SELECTION
+
+    styles = {
+        # No corresponding class for the following:
+        Text:                      FOREGROUND,
+        Whitespace:                "",
+        Error:                     RED,
+        Other:                     "",
+
+        Comment:                   COMMENT,
+        Comment.Multiline:         "",
+        Comment.Preproc:           "",
+        Comment.Single:            "",
+        Comment.Special:           "",
+
+        Keyword:                   '#cb49a8',
+        Keyword.Constant:          "",
+        Keyword.Declaration:       "",
+        Keyword.Namespace:         AQUA,
+        Keyword.Pseudo:            "",
+        Keyword.Reserved:          "",
+        Keyword.Type:              YELLOW,
+
+        Operator:                  AQUA,
+        Operator.Word:             "",
+
+        Punctuation:               FOREGROUND,
+
+        Name:                      FOREGROUND,
+        Name.Attribute:            BLUE,
+        Name.Builtin:              "",
+        Name.Builtin.Pseudo:       "",
+        Name.Class:                YELLOW,
+        Name.Constant:             RED,
+        Name.Decorator:            AQUA,
+        Name.Entity:               "",
+        Name.Exception:            RED,
+        Name.Function:             BLUE,
+        Name.Property:             "",
+        Name.Label:                "",
+        Name.Namespace:            YELLOW,
+        Name.Other:                BLUE,
+        Name.Tag:                  '#21b799',
+        Name.Variable:             RED,
+        Name.Variable.Class:       "",
+        Name.Variable.Global:      "",
+        Name.Variable.Instance:    "",
+
+        Number:                    ORANGE,
+        Number.Float:              "",
+        Number.Hex:                "",
+        Number.Integer:            "",
+        Number.Integer.Long:       "",
+        Number.Oct:                "",
+
+        Literal:                   ORANGE,
+        Literal.Date:              GREEN,
+
+        String:                    GREEN,
+        String.Backtick:           "",
+        String.Char:               FOREGROUND,
+        String.Doc:                COMMENT,
+        String.Double:             "",
+        String.Escape:             ORANGE,
+        String.Heredoc:            "",
+        String.Interpol:           ORANGE,
+        String.Other:              "",
+        String.Regex:              "",
+        String.Single:             "",
+        String.Symbol:             "",
 
-    styles = dict(ParaisoDarkStyle.styles)
-    styles[Keyword] = '#cb49a8'
-    styles[Name.Tag] = '#21b799'
+        Generic:                   "",
+        Generic.Deleted:           RED,
+        Generic.Emph:              "italic",
+        Generic.Error:             "",
+        Generic.Heading:           "bold " + FOREGROUND,
+        Generic.Inserted:          GREEN,
+        Generic.Output:            "",
+        Generic.Prompt:            "bold " + COMMENT,
+        Generic.Strong:            "bold",
+        Generic.Subheading:        "bold " + AQUA,
+        Generic.Traceback:         "",
+    }
 
 import imp
 import sys
diff --git a/doc/_extensions/odoo/static/animations.less b/doc/_extensions/odoo/static/animations.less
index c95cd342322..bebebfe66f3 100644
--- a/doc/_extensions/odoo/static/animations.less
+++ b/doc/_extensions/odoo/static/animations.less
@@ -48,9 +48,9 @@
   display: block;
   position: absolute;
   border-radius: 100%;
-  opacity: 1.3;
+  opacity: 1;
   z-index: -1;
-  background: rgba(0, 0, 0, .2);
+  background: rgba(0, 0, 0, .05);
   pointer-events: none;
   .scale(0);
 }
diff --git a/doc/_extensions/odoo/static/aside.less b/doc/_extensions/odoo/static/aside.less
new file mode 100644
index 00000000000..610ab5fad93
--- /dev/null
+++ b/doc/_extensions/odoo/static/aside.less
@@ -0,0 +1,309 @@
+// ======   Aside =======
+// ======================
+
+.navbar-aside {
+    position    : relative;
+    overflow    : hidden;
+    font-family : @headings-font-family;
+    font-size   : 0.85em;
+    line-height : 1.5;
+    font-weight : @fw_medium;
+    overflow-y  : auto;
+    height      : 100%;
+
+    &.affix {
+        z-index            : 2;
+        top                : @w-sub-nav-height - 1;
+        position           : fixed;
+        backface-visibility: hidden;
+
+        @media (max-width:@screen-md-min) {
+            display: none;
+        }
+    }
+
+    > ul.list-group {
+        margin    : 0;
+        z-index   : 0;
+    }
+
+    > h3 {
+        margin        : 0;
+        padding       : 15px 0 10px;
+        text-transform: uppercase;
+        font-weight   : @fw_semibold;
+        font-size     : 16px;
+        color         : @text-color;
+        overflow-x    : hidden;
+        position      : relative;
+        z-index       : 1;
+        .box-shadow(0 10px 9px -10px #d2d2d2);
+    }
+
+    .logo_box {
+        width        : 100%;
+        background   : rgb(253, 253, 253);
+        position     : relative;
+        display      : block;
+        padding      : 15px 30px 10px;
+        border-bottom: 1px solid fadeout(@text-color, 90%);
+        text-align   : center;
+        .box-shadow(inset 0px 0 40px rgba(114, 122, 142, .1));
+
+        .logo {
+            float              : left;
+            width              : 90%;
+            margin             : auto auto 10px 5%;
+            height             : 50px;
+            background-image   : url('img/odoo_logo_rgb.png');
+            background-repeat  : no-repeat;
+            background-position: center center;
+            background-size    : contain;
+            text-decoration    : none;
+        }
+    }
+
+    .gith-container {
+        margin    : 0;
+        z-index   : 1;
+        position  : relative;
+        overflow-x: hidden;
+
+        .gith-link {
+            font-weight    : 600;
+            color          : @text-color;
+            text-decoration: none;
+            display        : inline-block;
+            position       : relative;
+            margin         : 10px 0;
+            .transition(color .2s);
+
+            &:hover {
+                color          : @headings-color;
+                text-decoration: none;
+            }
+
+            &:before {
+                .size(20px;20px);
+                .opacity(.5);
+                content         : '';
+                position        : relative;
+                background-image: url('img/github-square_32.png');
+                background-size : 100%;
+                display         : inline-block;
+                vertical-align  : middle;
+                .translate(0;-1px);
+                .transition(opacity .2s);
+            }
+
+            &:hover, &:focus {
+                &:before {
+                    .opacity(1);
+                }
+            }
+        }
+    }
+
+    //-- All menu levels
+    ul {
+        padding      : 0;
+        position     : relative;
+        margin-bottom: 0 !important;
+
+        li {
+            padding: 0;
+            margin-bottom: 0;
+
+            &:first-child, &:last-child {
+                // Reset border radius
+                border-radius: 0;
+            }
+
+            &:first-child {
+                overflow     : hidden;
+                border-radius: 2px 0 0 0;
+            }
+
+            > a {
+                display: block;
+                padding: 5px 15px;
+                color  : @text-color;
+
+                &:hover, &:focus {
+                    color: @headings-color;
+                }
+            }
+        }
+
+        //-- Inner menu list
+        ul {
+            max-height      : 0;
+            background-color: @gray-lighter;
+            padding-left    : 15px;
+            overflow        : hidden;
+            .transition(max-height 0.3s @o-ease);
+        }
+    }
+
+    //-- Active lis
+    li.active {
+        &, &:hover, &:focus {
+            border-color: @gray-lighter;
+            background  : transparent;
+            > a {
+                color: @headings-color;
+            }
+        }
+
+        > ul {
+            max-height: 1000px;
+        }
+    }
+
+    // First menu level
+    > ul > li {
+        border-bottom: 1px solid @gray-lighter;
+        background   : white;
+
+        > a {
+            padding: 10px 15px;
+        }
+
+        &:hover, &:focus {
+            > a {
+                box-shadow      : inset 5px 0 0 -3px @gray-light;
+                background-color: transparent;
+            }
+        }
+
+        &.active, &.active:hover, &.active:focus{
+            > a {
+                box-shadow      : inset 5px 0 0 -3px @brand-primary;
+            }
+        }
+
+        &.parent {
+            > a:after {
+                content    : '\e7c1';
+                font-family: 'Material-Design-Icons';
+                opacity    : 0.5;
+                .o-position-absolute(auto, 10px);
+            }
+        }
+    }
+}
+
+.floating_action_container {
+    position: fixed;
+    right   : 8px;
+    bottom  : 8px;
+    width   : auto;
+    z-index : @zIndex--float_action;
+
+    @media (min-width:@screen-md-min) {
+        display: none;
+    }
+}
+
+#floating_action {
+    width           : 56px;
+    height          : 56px;
+    display         : inline-block;
+    z-index         : 0;
+    background-color: transparent;
+    border-radius   : 50%;
+    padding         : 16px;
+    box-shadow      : 0 8px 17px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 0.05);
+    background-color: @brand-primary;
+    .transition(transform 500ms @o-ease);
+
+    i {
+        color: white;
+    }
+
+    &.active {
+        .transform(~"translateZ(0px) rotateZ(-180deg)");
+    }
+}
+
+#floating_action_menu {
+    position     : absolute;
+    z-index      : 1;
+    overflow     : hidden;
+    right        : 0;
+    width        : 380px;
+    bottom       : 0;
+    padding      : 0;
+    display      : block;
+    border-radius: 2px;
+    visibility   : hidden;
+    .transition(all 0.5s);
+    .box-shadow(0 0 0 transparent);
+
+    .content {
+        margin: 0;
+        .opacity(0);
+
+        li {
+            border    : none;
+            border-top: 1px solid #DDD;
+            &:first-child {
+                border-top: none;
+            }
+        }
+
+        a {
+            display        : inline-block;
+            cursor         : pointer;
+            color          : @headings-color;
+            text-decoration: none;
+            float          : left;
+            width          : 100%;
+            padding        : 5px 10px;
+        }
+    }
+
+    .bubble {
+        position     : absolute;
+        .size(1px; 1px);
+        background   : @brand-primary;
+        content      : '';
+        bottom       : 28px;
+        right        : 28px;
+        color        : #fff;
+        border-radius: 50%;
+        .transition(all 300ms @o-ease);
+    }
+
+    &:before {
+        .bubble;
+        background: white;
+    }
+
+    &.active {
+        display   : block;
+        visibility: visible;
+        .transition(all 500ms @o-ease);
+
+        .bubble, &:before {
+            .size(1000px; 2000px);
+            border-radius: 50%;
+            .opacity(0);
+            margin-right : -500px;
+            margin-bottom: -500px;
+            display      : block;
+            .transition(all .4s @o-ease);
+        }
+
+        &:before {
+            .opacity(1);
+        }
+
+        .content {
+            position: relative;
+            z-index : 1;
+            .opacity(1);
+            .transition(all 500ms @ease-material-3);
+        }
+    }
+}
\ No newline at end of file
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/alerts.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/alerts.less
index c4199db927e..c4199db927e 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/alerts.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/alerts.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/badges.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/badges.less
index c70bb939ebe..6ee16dca413 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/badges.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/badges.less
@@ -12,7 +12,7 @@
   font-weight: @badge-font-weight;
   color: @badge-color;
   line-height: @badge-line-height;
-  vertical-align: baseline;
+  vertical-align: middle;
   white-space: nowrap;
   text-align: center;
   background-color: @badge-bg;
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/bootstrap.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/bootstrap.less
index 10cad64fac8..1c0477805fa 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/bootstrap.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/bootstrap.less
@@ -1,3 +1,9 @@
+/*!
+ * Bootstrap v3.3.6 (http://getbootstrap.com)
+ * Copyright 2011-2015 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ */
+
 // Core variables and mixins
 @import "variables.less";
 @import "mixins.less";
@@ -5,7 +11,7 @@
 // Reset and dependencies
 @import "normalize.less";
 @import "print.less";
-//@import "glyphicons.less";
+@import "glyphicons.less";
 
 // Core CSS
 @import "scaffolding.less";
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/breadcrumbs.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/breadcrumbs.less
index cb01d503fbe..cb01d503fbe 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/breadcrumbs.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/breadcrumbs.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/button-groups.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/button-groups.less
index 13c1800deaa..293245a6503 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/button-groups.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/button-groups.less
@@ -36,6 +36,7 @@
   margin-left: -5px; // Offset the first child's margin
   &:extend(.clearfix all);
 
+  .btn,
   .btn-group,
   .input-group {
     float: left;
@@ -172,12 +173,12 @@
     border-radius: 0;
   }
   &:first-child:not(:last-child) {
-    border-top-right-radius: @border-radius-base;
+    .border-top-radius(@btn-border-radius-base);
     .border-bottom-radius(0);
   }
   &:last-child:not(:first-child) {
-    border-bottom-left-radius: @border-radius-base;
     .border-top-radius(0);
+    .border-bottom-radius(@btn-border-radius-base);
   }
 }
 .btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/buttons.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/buttons.less
index 5a746049e3c..9cbb8f416fa 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/buttons.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/buttons.less
@@ -17,7 +17,7 @@
   background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214
   border: 1px solid transparent;
   white-space: nowrap;
-  .button-size(@padding-base-vertical; @padding-base-horizontal; @font-size-base; @line-height-base; @border-radius-base);
+  .button-size(@padding-base-vertical; @padding-base-horizontal; @font-size-base; @line-height-base; @btn-border-radius-base);
   .user-select(none);
 
   &,
@@ -47,10 +47,16 @@
   &[disabled],
   fieldset[disabled] & {
     cursor: @cursor-disabled;
-    pointer-events: none; // Future-proof disabling of clicks
     .opacity(.65);
     .box-shadow(none);
   }
+
+  a& {
+    &.disabled,
+    fieldset[disabled] & {
+      pointer-events: none; // Future-proof disabling of clicks on `<a>` elements
+    }
+  }
 }
 
 
@@ -126,14 +132,14 @@
 
 .btn-lg {
   // line-height: ensure even-numbered height of button next to large input
-  .button-size(@padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large);
+  .button-size(@padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @btn-border-radius-large);
 }
 .btn-sm {
   // line-height: ensure proper height of button next to small input
-  .button-size(@padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small);
+  .button-size(@padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @btn-border-radius-small);
 }
 .btn-xs {
-  .button-size(@padding-xs-vertical; @padding-xs-horizontal; @font-size-small; @line-height-small; @border-radius-small);
+  .button-size(@padding-xs-vertical; @padding-xs-horizontal; @font-size-small; @line-height-small; @btn-border-radius-small);
 }
 
 
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/carousel.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/carousel.less
index 4bbe946d3aa..252011e9e25 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/carousel.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/carousel.less
@@ -29,7 +29,7 @@
     @media all and (transform-3d), (-webkit-transform-3d) {
       .transition-transform(~'0.6s ease-in-out');
       .backface-visibility(~'hidden');
-      .perspective(1000);
+      .perspective(1000px);
 
       &.next,
       &.active.right {
@@ -101,6 +101,7 @@
   color: @carousel-control-color;
   text-align: center;
   text-shadow: @carousel-text-shadow;
+  background-color: rgba(0, 0, 0, 0); // Fix IE9 click-thru bug
   // We can't have this transition here because WebKit cancels the carousel
   // animation if you trip this while in the middle of another animation.
 
@@ -130,6 +131,7 @@
   .glyphicon-chevron-right {
     position: absolute;
     top: 50%;
+    margin-top: -10px;
     z-index: 5;
     display: inline-block;
   }
@@ -147,7 +149,6 @@
   .icon-next {
     width:  20px;
     height: 20px;
-    margin-top: -10px;
     line-height: 1;
     font-family: serif;
   }
@@ -240,18 +241,18 @@
     .glyphicon-chevron-right,
     .icon-prev,
     .icon-next {
-      width: 30px;
-      height: 30px;
-      margin-top: -15px;
-      font-size: 30px;
+      width: (@carousel-control-font-size * 1.5);
+      height: (@carousel-control-font-size * 1.5);
+      margin-top: (@carousel-control-font-size / -2);
+      font-size: (@carousel-control-font-size * 1.5);
     }
     .glyphicon-chevron-left,
     .icon-prev {
-      margin-left: -15px;
+      margin-left: (@carousel-control-font-size / -2);
     }
     .glyphicon-chevron-right,
     .icon-next {
-      margin-right: -15px;
+      margin-right: (@carousel-control-font-size / -2);
     }
   }
 
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/close.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/close.less
index 6d5bfe087ae..6d5bfe087ae 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/close.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/close.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/code.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/code.less
index a08b4d48c4c..a08b4d48c4c 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/code.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/code.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/component-animations.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/component-animations.less
index 0bcee910ac5..0bcee910ac5 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/component-animations.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/component-animations.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/dropdowns.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/dropdowns.less
index af344607bd9..f6876c1a9b2 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/dropdowns.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/dropdowns.less
@@ -11,6 +11,7 @@
   margin-left: 2px;
   vertical-align: middle;
   border-top:   @caret-width-base dashed;
+  border-top:   @caret-width-base solid ~"\9"; // IE8
   border-right: @caret-width-base solid transparent;
   border-left:  @caret-width-base solid transparent;
 }
@@ -184,7 +185,8 @@
   // Reverse the caret
   .caret {
     border-top: 0;
-    border-bottom: @caret-width-base solid;
+    border-bottom: @caret-width-base dashed;
+    border-bottom: @caret-width-base solid ~"\9"; // IE8
     content: "";
   }
   // Different positioning for bottom up menu
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/forms.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/forms.less
index e4b50629e97..e8b071a138e 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/forms.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/forms.less
@@ -56,7 +56,6 @@ input[type="checkbox"] {
   line-height: normal;
 }
 
-// Set the height of file controls to match text inputs
 input[type="file"] {
   display: block;
 }
@@ -133,6 +132,12 @@ output {
   // Placeholder
   .placeholder();
 
+  // Unstyle the caret on `<select>`s in IE10+.
+  &::-ms-expand {
+    border: 0;
+    background-color: transparent;
+  }
+
   // Disabled and read-only inputs
   //
   // HTML5 says that controls under a fieldset > legend:first-child won't be
@@ -175,13 +180,17 @@ input[type="search"] {
 // text within the input to become vertically misaligned. As a workaround, we
 // set a pixel line-height that matches the given height of the input, but only
 // for Safari. See https://bugs.webkit.org/show_bug.cgi?id=139848
+//
+// Note that as of 8.3, iOS doesn't support `datetime` or `week`.
 
 @media screen and (-webkit-min-device-pixel-ratio: 0) {
   input[type="date"],
   input[type="time"],
   input[type="datetime-local"],
   input[type="month"] {
-    line-height: @input-height-base;
+    &.form-control {
+      line-height: @input-height-base;
+    }
 
     &.input-sm,
     .input-group-sm & {
@@ -322,14 +331,26 @@ input[type="checkbox"] {
 }
 .form-group-sm {
   .form-control {
-    .input-size(@input-height-small; @padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @input-border-radius-small);
-  }
-  .form-control-static {
     height: @input-height-small;
     padding: @padding-small-vertical @padding-small-horizontal;
     font-size: @font-size-small;
     line-height: @line-height-small;
+    border-radius: @input-border-radius-small;
+  }
+  select.form-control {
+    height: @input-height-small;
+    line-height: @input-height-small;
+  }
+  textarea.form-control,
+  select[multiple].form-control {
+    height: auto;
+  }
+  .form-control-static {
+    height: @input-height-small;
     min-height: (@line-height-computed + @font-size-small);
+    padding: (@padding-small-vertical + 1) @padding-small-horizontal;
+    font-size: @font-size-small;
+    line-height: @line-height-small;
   }
 }
 
@@ -338,14 +359,26 @@ input[type="checkbox"] {
 }
 .form-group-lg {
   .form-control {
-    .input-size(@input-height-large; @padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @input-border-radius-large);
-  }
-  .form-control-static {
     height: @input-height-large;
     padding: @padding-large-vertical @padding-large-horizontal;
     font-size: @font-size-large;
     line-height: @line-height-large;
+    border-radius: @input-border-radius-large;
+  }
+  select.form-control {
+    height: @input-height-large;
+    line-height: @input-height-large;
+  }
+  textarea.form-control,
+  select[multiple].form-control {
+    height: auto;
+  }
+  .form-control-static {
+    height: @input-height-large;
     min-height: (@line-height-computed + @font-size-large);
+    padding: (@padding-large-vertical + 1) @padding-large-horizontal;
+    font-size: @font-size-large;
+    line-height: @line-height-large;
   }
 }
 
@@ -376,12 +409,16 @@ input[type="checkbox"] {
   text-align: center;
   pointer-events: none;
 }
-.input-lg + .form-control-feedback {
+.input-lg + .form-control-feedback,
+.input-group-lg + .form-control-feedback,
+.form-group-lg .form-control + .form-control-feedback {
   width: @input-height-large;
   height: @input-height-large;
   line-height: @input-height-large;
 }
-.input-sm + .form-control-feedback {
+.input-sm + .form-control-feedback,
+.input-group-sm + .form-control-feedback,
+.form-group-sm .form-control + .form-control-feedback {
   width: @input-height-small;
   height: @input-height-small;
   line-height: @input-height-small;
@@ -402,10 +439,10 @@ input[type="checkbox"] {
 .has-feedback label {
 
   & ~ .form-control-feedback {
-     top: (@line-height-computed + 5); // Height of the `label` and its margin
+    top: (@line-height-computed + 5); // Height of the `label` and its margin
   }
   &.sr-only ~ .form-control-feedback {
-     top: 0;
+    top: 0;
   }
 }
 
@@ -550,7 +587,7 @@ input[type="checkbox"] {
   // Reposition the icon because it's now within a grid column and columns have
   // `position: relative;` on them. Also accounts for the grid gutter padding.
   .has-feedback .form-control-feedback {
-    right: (@grid-gutter-width / 2);
+    right: floor((@grid-gutter-width / 2));
   }
 
   // Form group sizes
@@ -560,7 +597,8 @@ input[type="checkbox"] {
   .form-group-lg {
     @media (min-width: @screen-sm-min) {
       .control-label {
-        padding-top: ((@padding-large-vertical * @line-height-large) + 1);
+        padding-top: (@padding-large-vertical + 1);
+        font-size: @font-size-large;
       }
     }
   }
@@ -568,6 +606,7 @@ input[type="checkbox"] {
     @media (min-width: @screen-sm-min) {
       .control-label {
         padding-top: (@padding-small-vertical + 1);
+        font-size: @font-size-small;
       }
     }
   }
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/glyphicons.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/glyphicons.less
index 335d80aa6bf..7bc5852d2c0 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/glyphicons.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/glyphicons.less
@@ -32,8 +32,8 @@
 }
 
 // Individual icons
-.glyphicon-asterisk               { &:before { content: "\2a"; } }
-.glyphicon-plus                   { &:before { content: "\2b"; } }
+.glyphicon-asterisk               { &:before { content: "\002a"; } }
+.glyphicon-plus                   { &:before { content: "\002b"; } }
 .glyphicon-euro,
 .glyphicon-eur                    { &:before { content: "\20ac"; } }
 .glyphicon-minus                  { &:before { content: "\2212"; } }
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/grid.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/grid.less
index e100655b70e..e100655b70e 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/grid.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/grid.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/input-groups.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/input-groups.less
index a8712f25b93..5f73eec40ca 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/input-groups.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/input-groups.less
@@ -29,6 +29,10 @@
 
     width: 100%;
     margin-bottom: 0;
+    
+    &:focus {
+      z-index: 3;
+    }
   }
 }
 
@@ -79,18 +83,18 @@
   text-align: center;
   background-color: @input-group-addon-bg;
   border: 1px solid @input-group-addon-border-color;
-  border-radius: @border-radius-base;
+  border-radius: @input-border-radius;
 
   // Sizing
   &.input-sm {
     padding: @padding-small-vertical @padding-small-horizontal;
     font-size: @font-size-small;
-    border-radius: @border-radius-small;
+    border-radius: @input-border-radius-small;
   }
   &.input-lg {
     padding: @padding-large-vertical @padding-large-horizontal;
     font-size: @font-size-large;
-    border-radius: @border-radius-large;
+    border-radius: @input-border-radius-large;
   }
 
   // Nuke default margins from checkboxes and radios to vertically center within.
@@ -160,6 +164,7 @@
   &:last-child {
     > .btn,
     > .btn-group {
+      z-index: 2;
       margin-left: -1px;
     }
   }
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/jumbotron.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/jumbotron.less
index 93036d3c950..1d9b515b386 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/jumbotron.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/jumbotron.less
@@ -4,7 +4,8 @@
 
 
 .jumbotron {
-  padding: @jumbotron-padding (@jumbotron-padding / 2);
+  padding-top:    @jumbotron-padding;
+  padding-bottom: @jumbotron-padding;
   margin-bottom: @jumbotron-padding;
   color: @jumbotron-color;
   background-color: @jumbotron-bg;
@@ -27,6 +28,8 @@
   .container &,
   .container-fluid & {
     border-radius: @border-radius-large; // Only round corners at higher resolutions if contained in a container
+    padding-left:  (@grid-gutter-width / 2);
+    padding-right: (@grid-gutter-width / 2);
   }
 
   .container {
@@ -34,7 +37,8 @@
   }
 
   @media screen and (min-width: @screen-sm-min) {
-    padding: (@jumbotron-padding * 1.6) 0;
+    padding-top:    (@jumbotron-padding * 1.6);
+    padding-bottom: (@jumbotron-padding * 1.6);
 
     .container &,
     .container-fluid & {
@@ -44,7 +48,7 @@
 
     h1,
     .h1 {
-      font-size: (@font-size-base * 4.5);
+      font-size: @jumbotron-heading-font-size;
     }
   }
 }
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/labels.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/labels.less
index 9a5a27006a5..9a5a27006a5 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/labels.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/labels.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/list-group.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/list-group.less
index 1462ce16b32..216b91230ab 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/list-group.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/list-group.less
@@ -38,12 +38,13 @@
 }
 
 
-// Linked list items
+// Interactive list items
 //
-// Use anchor elements instead of `li`s or `div`s to create linked list items.
+// Use anchor or button elements instead of `li`s or `div`s to create interactive items.
 // Includes an extra `.active` modifier class for showing selected items.
 
-a.list-group-item {
+a.list-group-item,
+button.list-group-item {
   color: @list-group-link-color;
 
   .list-group-item-heading {
@@ -59,6 +60,11 @@ a.list-group-item {
   }
 }
 
+button.list-group-item {
+  width: 100%;
+  text-align: left;
+}
+
 .list-group-item {
   // Disabled state
   &.disabled,
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/media.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/media.less
index a6bf7819246..8c835e861ed 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/media.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/media.less
@@ -19,6 +19,11 @@
 
 .media-object {
   display: block;
+
+  // Fix collapse in webkit from max-width: 100% and display: table-cell.
+  &.img-thumbnail {
+    max-width: none;
+  }
 }
 
 .media-right,
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins.less
index af4408fc2d6..e6f9fe684b7 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins.less
@@ -11,6 +11,7 @@
 @import "mixins/responsive-visibility.less";
 @import "mixins/size.less";
 @import "mixins/tab-focus.less";
+@import "mixins/reset-text.less";
 @import "mixins/text-emphasis.less";
 @import "mixins/text-overflow.less";
 @import "mixins/vendor-prefixes.less";
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/alerts.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/alerts.less
index 396196f438f..396196f438f 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/alerts.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/alerts.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/background-variant.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/background-variant.less
index 556e490d45d..a85c22b7453 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/background-variant.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/background-variant.less
@@ -2,7 +2,8 @@
 
 .bg-variant(@color) {
   background-color: @color;
-  a&:hover {
+  a&:hover,
+  a&:focus {
     background-color: darken(@color, 10%);
   }
 }
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/border-radius.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/border-radius.less
index ca05dbf4570..ca05dbf4570 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/border-radius.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/border-radius.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/buttons.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/buttons.less
index 92d8a056cd3..b294d8c210e 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/buttons.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/buttons.less
@@ -8,15 +8,31 @@
   background-color: @background;
   border-color: @border;
 
-  &:hover,
   &:focus,
-  &.focus,
+  &.focus {
+    color: @color;
+    background-color: darken(@background, 10%);
+        border-color: darken(@border, 25%);
+  }
+  &:hover {
+    color: @color;
+    background-color: darken(@background, 10%);
+        border-color: darken(@border, 12%);
+  }
   &:active,
   &.active,
   .open > .dropdown-toggle& {
     color: @color;
     background-color: darken(@background, 10%);
         border-color: darken(@border, 12%);
+
+    &:hover,
+    &:focus,
+    &.focus {
+      color: @color;
+      background-color: darken(@background, 17%);
+          border-color: darken(@border, 25%);
+    }
   }
   &:active,
   &.active,
@@ -26,12 +42,9 @@
   &.disabled,
   &[disabled],
   fieldset[disabled] & {
-    &,
     &:hover,
     &:focus,
-    &.focus,
-    &:active,
-    &.active {
+    &.focus {
       background-color: @background;
           border-color: @border;
     }
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/center-block.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/center-block.less
index d18d6de9ed6..d18d6de9ed6 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/center-block.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/center-block.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/clearfix.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/clearfix.less
index 3f7a3820c1c..3f7a3820c1c 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/clearfix.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/clearfix.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/forms.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/forms.less
index 6f55ed96708..6f55ed96708 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/forms.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/forms.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/gradients.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/gradients.less
index 0b88a89cc56..0b88a89cc56 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/gradients.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/gradients.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/grid-framework.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/grid-framework.less
index f3b3929d6d0..8c23eed24e6 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/grid-framework.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/grid-framework.less
@@ -19,8 +19,8 @@
       // Prevent columns from collapsing when empty
       min-height: 1px;
       // Inner gutter via padding
-      padding-left:  (@grid-gutter-width / 2);
-      padding-right: (@grid-gutter-width / 2);
+      padding-left:  ceil((@grid-gutter-width / 2));
+      padding-right: floor((@grid-gutter-width / 2));
     }
   }
   .col(1); // kickstart it
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/grid.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/grid.less
index cae5eaff924..df496d0b3c1 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/grid.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/grid.less
@@ -6,15 +6,15 @@
 .container-fixed(@gutter: @grid-gutter-width) {
   margin-right: auto;
   margin-left: auto;
-  padding-left:  (@gutter / 2);
-  padding-right: (@gutter / 2);
+  padding-left:  floor((@gutter / 2));
+  padding-right: ceil((@gutter / 2));
   &:extend(.clearfix all);
 }
 
 // Creates a wrapper for a series of columns
 .make-row(@gutter: @grid-gutter-width) {
-  margin-left:  (@gutter / -2);
-  margin-right: (@gutter / -2);
+  margin-left:  ceil((@gutter / -2));
+  margin-right: floor((@gutter / -2));
   &:extend(.clearfix all);
 }
 
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/hide-text.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/hide-text.less
index c2315e572f8..2bb84a3b444 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/hide-text.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/hide-text.less
@@ -1,12 +1,12 @@
 // CSS image replacement
 //
-// Heads up! v3 launched with with only `.hide-text()`, but per our pattern for
+// Heads up! v3 launched with only `.hide-text()`, but per our pattern for
 // mixins being reused as classes with the same name, this doesn't hold up. As
 // of v3.0.1 we have added `.text-hide()` and deprecated `.hide-text()`.
 //
 // Source: https://github.com/h5bp/html5-boilerplate/commit/aa0396eae757
 
-// Deprecated as of v3.0.1 (will be removed in v4)
+// Deprecated as of v3.0.1 (has been removed in v4)
 .hide-text() {
   font: ~"0/0" a;
   color: transparent;
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/image.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/image.less
index f233cb3e199..f233cb3e199 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/image.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/image.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/labels.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/labels.less
index 9f7a67ee3d0..9f7a67ee3d0 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/labels.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/labels.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/list-group.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/list-group.less
index 8b5b065cb84..03aa19069d9 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/list-group.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/list-group.less
@@ -5,7 +5,8 @@
     color: @color;
     background-color: @background;
 
-    a& {
+    a&,
+    button& {
       color: @color;
 
       .list-group-item-heading {
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/nav-divider.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/nav-divider.less
index feb1e9ed0da..feb1e9ed0da 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/nav-divider.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/nav-divider.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/nav-vertical-align.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/nav-vertical-align.less
index d458c78613e..d458c78613e 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/nav-vertical-align.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/nav-vertical-align.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/opacity.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/opacity.less
index 33ed25ce676..33ed25ce676 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/opacity.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/opacity.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/pagination.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/pagination.less
index 7deb505d25f..618804f2dee 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/pagination.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/pagination.less
@@ -1,11 +1,12 @@
 // Pagination
 
-.pagination-size(@padding-vertical; @padding-horizontal; @font-size; @border-radius) {
+.pagination-size(@padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) {
   > li {
     > a,
     > span {
       padding: @padding-vertical @padding-horizontal;
       font-size: @font-size;
+      line-height: @line-height;
     }
     &:first-child {
       > a,
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/panels.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/panels.less
index 49ee10d4ad3..49ee10d4ad3 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/panels.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/panels.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/progress-bar.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/progress-bar.less
index f07996a34db..f07996a34db 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/progress-bar.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/progress-bar.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/reset-filter.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/reset-filter.less
index 68cdb5e1860..68cdb5e1860 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/reset-filter.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/reset-filter.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/reset-text.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/reset-text.less
new file mode 100755
index 00000000000..58dd4d19b4d
--- /dev/null
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/reset-text.less
@@ -0,0 +1,18 @@
+.reset-text() {
+  font-family: @font-family-base;
+  // We deliberately do NOT reset font-size.
+  font-style: normal;
+  font-weight: normal;
+  letter-spacing: normal;
+  line-break: auto;
+  line-height: @line-height-base;
+  text-align: left; // Fallback for where `start` is not supported
+  text-align: start;
+  text-decoration: none;
+  text-shadow: none;
+  text-transform: none;
+  white-space: normal;
+  word-break: normal;
+  word-spacing: normal;
+  word-wrap: normal;
+}
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/resize.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/resize.less
index 3acd3afdbac..3acd3afdbac 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/resize.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/resize.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/responsive-visibility.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/responsive-visibility.less
index f7951c3d75c..ecf1e979fd2 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/responsive-visibility.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/responsive-visibility.less
@@ -4,7 +4,7 @@
 // More easily include all the states for responsive-utilities.less.
 .responsive-visibility() {
   display: block !important;
-  table&  { display: table; }
+  table&  { display: table !important; }
   tr&     { display: table-row !important; }
   th&,
   td&     { display: table-cell !important; }
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/size.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/size.less
index a8be6508960..a8be6508960 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/size.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/size.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/tab-focus.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/tab-focus.less
index 1f1f05ab054..1f1f05ab054 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/tab-focus.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/tab-focus.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/table-row.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/table-row.less
index 0f287f1a8bd..0f287f1a8bd 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/table-row.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/table-row.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/text-emphasis.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/text-emphasis.less
index 0868ef9f2ca..9e8a77a6985 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/text-emphasis.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/text-emphasis.less
@@ -2,7 +2,8 @@
 
 .text-emphasis-variant(@color) {
   color: @color;
-  a&:hover {
+  a&:hover,
+  a&:focus {
     color: darken(@color, 10%);
   }
 }
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/text-overflow.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/text-overflow.less
index c11ad2fb747..c11ad2fb747 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/text-overflow.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/text-overflow.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/vendor-prefixes.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/vendor-prefixes.less
index afd3331c31d..2b5e74b99ed 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/mixins/vendor-prefixes.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/mixins/vendor-prefixes.less
@@ -1,7 +1,7 @@
 // Vendor Prefixes
 //
 // All vendor mixins are deprecated as of v3.2.0 due to the introduction of
-// Autoprefixer in our Gruntfile. They will be removed in v4.
+// Autoprefixer in our Gruntfile. They have been removed in v4.
 
 // - Animations
 // - Backface visibility
@@ -54,7 +54,7 @@
 // Prevent browsers from flickering when using CSS 3D transforms.
 // Default value is `visible`, but can be changed to `hidden`
 
-.backface-visibility(@visibility){
+.backface-visibility(@visibility) {
   -webkit-backface-visibility: @visibility;
      -moz-backface-visibility: @visibility;
           backface-visibility: @visibility;
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/modals.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/modals.less
index 1de622050e5..767ce36ba37 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/modals.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/modals.less
@@ -79,7 +79,7 @@
 .modal-header {
   padding: @modal-title-padding;
   border-bottom: 1px solid @modal-header-border-color;
-  min-height: (@modal-title-padding + @modal-title-line-height);
+  &:extend(.clearfix all);
 }
 // Close icon
 .modal-header .close {
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/navbar.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/navbar.less
index 6d751bb9ce0..6d751bb9ce0 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/navbar.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/navbar.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/navs.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/navs.less
index a3d11b13621..a3d11b13621 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/navs.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/navs.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/normalize.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/normalize.less
index 62a085a4841..9dddf73ad29 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/normalize.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/normalize.less
@@ -1,9 +1,9 @@
-/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
+/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
 
 //
 // 1. Set default font family to sans-serif.
-// 2. Prevent iOS text size adjust after orientation change, without disabling
-//    user zoom.
+// 2. Prevent iOS and IE text size adjust after device orientation change,
+//    without disabling user zoom.
 //
 
 html {
@@ -71,7 +71,7 @@ audio:not([controls]) {
 
 //
 // Address `[hidden]` styling not present in IE 8/9/10.
-// Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
+// Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
 //
 
 [hidden],
@@ -91,7 +91,8 @@ a {
 }
 
 //
-// Improve readability when focused and also mouse hovered in all browsers.
+// Improve readability of focused elements when they are also in an
+// active/hover state.
 //
 
 a:active,
@@ -209,7 +210,6 @@ figure {
 //
 
 hr {
-  -moz-box-sizing: content-box;
   box-sizing: content-box;
   height: 0;
 }
@@ -350,15 +350,12 @@ input[type="number"]::-webkit-outer-spin-button {
 
 //
 // 1. Address `appearance` set to `searchfield` in Safari and Chrome.
-// 2. Address `box-sizing` set to `border-box` in Safari and Chrome
-//    (include `-moz` to future-proof).
+// 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
 //
 
 input[type="search"] {
   -webkit-appearance: textfield; // 1
-  -moz-box-sizing: content-box;
-  -webkit-box-sizing: content-box; // 2
-  box-sizing: content-box;
+  box-sizing: content-box; //2
 }
 
 //
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/pager.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/pager.less
index 41abaaadc5d..41abaaadc5d 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/pager.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/pager.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/pagination.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/pagination.less
index 38c4c3d346f..31f77aae4ed 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/pagination.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/pagination.less
@@ -40,6 +40,7 @@
   > li > span {
     &:hover,
     &:focus {
+      z-index: 2;
       color: @pagination-hover-color;
       background-color: @pagination-hover-bg;
       border-color: @pagination-hover-border;
@@ -51,7 +52,7 @@
     &,
     &:hover,
     &:focus {
-      z-index: 2;
+      z-index: 3;
       color: @pagination-active-color;
       background-color: @pagination-active-bg;
       border-color: @pagination-active-border;
@@ -79,10 +80,10 @@
 
 // Large
 .pagination-lg {
-  .pagination-size(@padding-large-vertical; @padding-large-horizontal; @font-size-large; @border-radius-large);
+  .pagination-size(@padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large);
 }
 
 // Small
 .pagination-sm {
-  .pagination-size(@padding-small-vertical; @padding-small-horizontal; @font-size-small; @border-radius-small);
+  .pagination-size(@padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small);
 }
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/panels.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/panels.less
index 04eb2b39ca1..425eb5e642c 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/panels.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/panels.less
@@ -76,6 +76,7 @@
         .border-top-radius((@panel-border-radius - 1));
       }
     }
+
     // Add border bottom radius for last one
     &:last-child {
       .list-group-item:last-child {
@@ -84,6 +85,11 @@
       }
     }
   }
+  > .panel-heading + .panel-collapse > .list-group {
+    .list-group-item:first-child {
+      .border-top-radius(0);
+    }
+  }
 }
 // Collapse space between when there's no additional content.
 .panel-heading + .list-group {
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/popovers.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/popovers.less
index 2748eead13f..3a62a6455ac 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/popovers.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/popovers.less
@@ -11,12 +11,11 @@
   display: none;
   max-width: @popover-max-width;
   padding: 1px;
-  // Reset font and text properties given new insertion method
-  font-family: @font-family-base;
+  // Our parent element can be arbitrary since popovers are by default inserted as a sibling of their target element.
+  // So reset our font and text properties to avoid inheriting weird values.
+  .reset-text();
   font-size: @font-size-base;
-  font-weight: normal;
-  line-height: @line-height-base;
-  text-align: left;
+
   background-color: @popover-bg;
   background-clip: padding-box;
   border: 1px solid @popover-fallback-border-color;
@@ -24,9 +23,6 @@
   border-radius: @border-radius-large;
   .box-shadow(0 5px 10px rgba(0,0,0,.2));
 
-  // Overrides for proper insertion
-  white-space: normal;
-
   // Offset the popover to account for the popover arrow
   &.top     { margin-top: -@popover-arrow-width; }
   &.right   { margin-left: @popover-arrow-width; }
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/print.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/print.less
index 94ca58f12a9..66e54ab489e 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/print.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/print.less
@@ -67,12 +67,6 @@
     }
 
     // Bootstrap specific changes start
-    //
-    // Chrome (OSX) fix for https://github.com/twbs/bootstrap/issues/11245
-    // Once fixed, we can just straight up remove this.
-    select {
-        background: #fff !important;
-    }
 
     // Bootstrap components
     .navbar {
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/progress-bars.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/progress-bars.less
index 8868a1feef0..8868a1feef0 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/progress-bars.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/progress-bars.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/responsive-embed.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/responsive-embed.less
index 080a5118fe9..080a5118fe9 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/responsive-embed.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/responsive-embed.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/responsive-utilities.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/responsive-utilities.less
index b1db31d7bfc..b1db31d7bfc 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/responsive-utilities.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/responsive-utilities.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/scaffolding.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/scaffolding.less
index 47b1d5a1aab..1929bfc5cfa 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/scaffolding.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/scaffolding.less
@@ -155,8 +155,7 @@ hr {
 // Fixes "clickability" issue (and more generally, the firing of events such as focus as well)
 // for traditionally non-focusable elements with role="button"
 // see https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
-// Upstream patch for normalize.css submitted: https://github.com/necolas/normalize.css/pull/379 - remove this fix once that is merged
 
 [role="button"] {
   cursor: pointer;
-}
\ No newline at end of file
+}
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/tables.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/tables.less
index 2242c036868..2242c036868 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/tables.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/tables.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/theme.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/theme.less
index 6f2eb62126f..8f51d913dc9 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/theme.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/theme.less
@@ -1,3 +1,8 @@
+/*!
+ * Bootstrap v3.3.6 (http://getbootstrap.com)
+ * Copyright 2011-2015 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ */
 
 //
 // Load core variables and mixins
@@ -28,6 +33,12 @@
     .box-shadow(inset 0 3px 5px rgba(0,0,0,.125));
   }
 
+  &.disabled,
+  &[disabled],
+  fieldset[disabled] & {
+    .box-shadow(none);
+  }
+
   .badge {
     text-shadow: none;
   }
@@ -53,10 +64,17 @@
   }
 
   &.disabled,
-  &:disabled,
-  &[disabled] {
-    background-color: darken(@btn-color, 12%);
-    background-image: none;
+  &[disabled],
+  fieldset[disabled] & {
+    &,
+    &:hover,
+    &:focus,
+    &.focus,
+    &:active,
+    &.active {
+      background-color: darken(@btn-color, 12%);
+      background-image: none;
+    }
   }
 }
 
@@ -132,7 +150,7 @@
 .navbar-inverse {
   #gradient > .vertical(@start-color: lighten(@navbar-inverse-bg, 10%); @end-color: @navbar-inverse-bg);
   .reset-filter(); // Remove gradient in IE<10 to fix bug where dropdowns don't get triggered; see https://github.com/twbs/bootstrap/issues/10257
-
+  border-radius: @navbar-border-radius;
   .navbar-nav > .open > a,
   .navbar-nav > .active > a {
     #gradient > .vertical(@start-color: @navbar-inverse-link-active-bg; @end-color: lighten(@navbar-inverse-link-active-bg, 2.5%));
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/thumbnails.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/thumbnails.less
index 0713e67d006..0713e67d006 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/thumbnails.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/thumbnails.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/tooltip.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/tooltip.less
index 9d568474330..b48d63e07ad 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/tooltip.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/tooltip.less
@@ -8,11 +8,11 @@
   position: absolute;
   z-index: @zindex-tooltip;
   display: block;
-  // Reset font and text properties given new insertion method
-  font-family: @font-family-base;
+  // Our parent element can be arbitrary since tooltips are by default inserted as a sibling of their target element.
+  // So reset our font and text properties to avoid inheriting weird values.
+  .reset-text();
   font-size: @font-size-small;
-  font-weight: normal;
-  line-height: 1.4;
+
   .opacity(0);
 
   &.in     { .opacity(@tooltip-opacity); }
@@ -28,7 +28,6 @@
   padding: 3px 8px;
   color: @tooltip-color;
   text-align: center;
-  text-decoration: none;
   background-color: @tooltip-bg;
   border-radius: @border-radius-base;
 }
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/type.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/type.less
index 68ba6017bf1..0d4fee48486 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/type.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/type.less
@@ -211,7 +211,7 @@ dd {
     &:extend(.clearfix all); // Clear the floated `dt` if an empty `dd` is present
   }
 
-  @media (min-width: @grid-float-breakpoint) {
+  @media (min-width: @dl-horizontal-breakpoint) {
     dt {
       float: left;
       width: (@dl-horizontal-offset - 20);
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/utilities.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/utilities.less
index 7a8ca27a8ff..7a8ca27a8ff 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/utilities.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/utilities.less
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/variables.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/variables.less
index b5fb9d02cf5..b057ef5bf90 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/variables.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/variables.less
@@ -170,6 +170,11 @@
 
 @btn-link-disabled-color:        @gray-light;
 
+// Allows for customizing button radius independently from global border radius
+@btn-border-radius-base:         @border-radius-base;
+@btn-border-radius-large:        @border-radius-large;
+@btn-border-radius-small:        @border-radius-small;
+
 
 //== Forms
 //
@@ -383,7 +388,7 @@
 @navbar-default-toggle-border-color:       #ddd;
 
 
-// Inverted navbar
+//=== Inverted navbar
 // Reset inverted navbar basics
 @navbar-inverse-color:                      lighten(@gray-light, 15%);
 @navbar-inverse-bg:                         #222;
@@ -484,6 +489,7 @@
 @jumbotron-bg:                   @gray-lighter;
 @jumbotron-heading-color:        inherit;
 @jumbotron-font-size:            ceil((@font-size-base * 1.5));
+@jumbotron-heading-font-size:    ceil((@font-size-base * 4.5));
 
 
 //== Form states and alerts
@@ -857,5 +863,7 @@
 @page-header-border-color:    @gray-lighter;
 //** Width of horizontal description list titles
 @dl-horizontal-offset:        @component-offset-horizontal;
+//** Point at which .dl-horizontal becomes horizontal
+@dl-horizontal-breakpoint:    @grid-float-breakpoint;
 //** Horizontal line color.
 @hr-border:                   @gray-lighter;
diff --git a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/wells.less b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/wells.less
index 15d072b0cd0..15d072b0cd0 100755
--- a/doc/_extensions/odoo/static/bootstrap-3.3.4/less/wells.less
+++ b/doc/_extensions/odoo/static/bootstrap-3.3.6/less/wells.less
diff --git a/doc/_extensions/odoo/static/doc.js b/doc/_extensions/odoo/static/doc.js
index 4b7e11cb7fb..7d86eded5c0 100644
--- a/doc/_extensions/odoo/static/doc.js
+++ b/doc/_extensions/odoo/static/doc.js
@@ -1,333 +1,343 @@
 (function ($) {
-var log = function(data){
-  return console.log(data);
-}
-
-var update_page = function  () {
-
-  var
-  $header               = $("header"),
-  $main_navbar          = $("#main_navbar"),
-  $navbar_aside         = $(".navbar-aside"),
-  $navClone             = null,
-  $floating_action      = $("#floating_action"),
-  $floating_action_menu = $("#floating_action_menu"),
-  $body                 = $("body"),
-  $main                 = $("main"), // remove
-  $aside                = $("aside"),
-  $mask                 = $("#mask"),
-  $title                = $("#main_title"),
-  $cardTop              = $(".card.top")
-  $cover_img            = $(".card.top .card-img"),
-  ripples               = $(".ripple"),
-  $main_back            = $("#main-back");
-
-  var titleZoom = 1.5,
-           Hgap = 60;
-
-  var nav_h   = $main_navbar.height(),
-  wW          = $(window).width(),
-  titleOffset = ($main.offset().left - $main_back.outerWidth())-15;
-  if($main.hasClass("index")){Hgap = 0}
-  var img_h = $cover_img.height() - Hgap;
-  $navbar_aside.find("li").has("ul").addClass("parent");
-
-  if ($main.hasClass("index")){
-    $main.find("#index .index-tree > .row").each(function(){
-      var childs = $(this).find(".col-md-3");
-      if(childs.length == 2){
-        childs.removeClass("col-md-3").addClass("col-md-6");
-      }
-      if(childs.length == 3){
-        childs.removeClass("col-md-3").addClass("col-md-4");
-      }
-    })
-    $(".floating_action_container").remove();
-  }
-
-  var resize_aside = function(){
-    var navbar_aside_data = $navbar_aside[0].getBoundingClientRect();
-    var $navClone_ul = $navClone.find("> ul");
-    var $navbar_aside_ul = $navbar_aside.find("> ul");
-    var maxH = $(window).height() - 45;
-    maxH_ul = maxH - ($navClone_ul.position().top + 45);
-    $navClone.css({
-      "width": navbar_aside_data.width,
-      "left": navbar_aside_data .left,
-      "height": maxH
-    })
-    $navClone_ul.add($navbar_aside_ul).css("max-height",maxH_ul)
-  }
-
-  var resize = function() {
-    nav_h       = $main_navbar.height();
-    wW          = $(window).width();
-    titleOffset = $main.offset().left - $main_back.outerWidth();
-    if($main.hasClass("index")){Hgap = 0}
-    img_h = $cover_img.height() - Hgap;
-    if($navClone != null){
-      resize_aside();
-    }
-    header_layout();
-  }
-
-
-  var header_layout = function  () {
-    var wTop  = $(window).scrollTop();
-    var r = (wTop)/(img_h - 50);
-
-    function rat() {
-      if(r<0) return 0;
-      if(r>1) return 1;
-      return Number(r.toString().match(/^\d+(?:\.\d{0,2})?/));
-    }
-
-    var ratio = rat();
-
-    if (wW >= 768) {
-
-      $title.css({"font-size": "", "position": "", 'transform':'scale('+(1-(titleZoom-1)*ratio)+')'});
-
-      if( (img_h - wTop) > 0 ){
-        $main_navbar[0].style.cssText += "; height: " + (img_h - wTop)+ "px;";
-        $cover_img[0].style.cssText += "; opacity: " + (0.8-ratio) + ";";
-      }
-
-      if (titleOffset > 0) {
-        $main_back.css("margin-right", titleOffset);
-      } else {
-        $main_back.css("margin-right", "");
-      }
-
-      if (ratio == 1) {
-        $main_navbar.css("height","").add($header).addClass("stacked");
-      } else {
-        $main_navbar.add($header).removeClass("stacked");
-      }
-
-      if ($navClone != null && ($aside.css("display") != "none" )) {
-        var gap = $aside.offset().top - 45;
-        if((wTop > gap)) {
-          $navClone.removeClass("hidden");
-          $navbar_aside.addClass("invisible");
-          resize_aside();
-
-          // ScrollSpy
-          // if(!($navClone.hasClass("binded"))){
-          //   $body.scrollspy({target: "#navClone", offset: 100 });
-          //   $navClone.addClass("binded");
-          //   $body.scrollspy('refresh');
-          // }
-        } else {
-          $navClone.addClass("hidden");
-          $navbar_aside.removeClass("invisible");
+
+    $(document).ready(function () {
+
+        // =======  Define variables =======
+        // =================================
+        // --  Screen resolutions
+        var screen_md = 992;
+
+        // --  Window, window's properties
+        var $win  = $(window),
+            win_w = $win.width();
+
+        // --  Main elements
+        var $body       = $('body'),
+            $header     = $body.find('> header'),
+            $sub_nav    = $header.find(".o_sub_nav");
+            $wrap       = $body.find('> #wrap'),
+            $card_top   = $wrap.find('> .card.top'),
+            $card_top_t = $card_top.find('> .container'),
+            $main       = $wrap.find('main'),
+            $footer     = $body.find('> footer');
+
+        // --  Floating action
+        var $mask       = $body.find('#mask'),
+            $float      = $body.find("#floating_action"),
+            $float_menu = $body.find("#floating_action_menu");
+
+        // -- Elements' heights
+        var body_h    = $body.height(),
+            header_h  = $header.outerHeight(),
+            sub_nav_h = $sub_nav.height();
+
+        // --  Aside
+        var $aside       = $main.find('aside'),
+            has_aside    = $aside.length > 0,
+            $aside_nav   = undefined;
+            aside_links  = undefined;
+
+        if (has_aside) {
+            $aside_nav   = $aside.find('> .navbar-aside');
+            aside_links  = $aside_nav.find("li > a");
         }
-      }
-
-    } else {
-
-      $cover_img.css("opacity","");
-      $title.css({
-        "position": "relative",
-        "height" : "",
-        "transform":"",
-        "font-size": 18
-      });
-      $main_navbar.addClass("stacked").css({
-        "height":"",
-        "margin": 0
-      })
-    }
-  };
-  header_layout();
-
-  var floating_menu_layout = function () {
-    var lis = $navbar_aside.find("> ul > li").clone(true)
-      .addClass("ripple")
-      .css({
-        position: 'relative',
-        overflow: 'hidden'
-      });
-    lis.find("ul").remove().end()
-      .find("a").removeClass("ripple").on("click", function  () {
-        floating_menu_toggle();
-      });
-    $floating_action_menu.find(".content").empty().append(lis);
-  }
-  floating_menu_layout();
-
-  var floating_menu_toggle = function  () {
-    $floating_action.toggleClass("active");
-    setTimeout(function  () {
-      $floating_action_menu.toggleClass("active");
-      $mask.toggleClass("active");
-    }, 300);
-  };
-
-  var scroll_to = function(el_list) {
-    var offset = 80;
-    el_list.each(function () {
-      var $link = $(this),
-          href = $link.attr("href");
-
-      $link.on("click", function () {
-        var val = $(href).offset().top - 60;
-        $('html, body').animate({
-          scrollTop: val
-        }, 600);
-        log(el_list)
-        $navClone.find("li").removeClass("active");
-        $link.parents("li").addClass("active");
-        return false;
-      })
-    })
-  }
-
-
-  var ripple_animation = function(el_list) {
-    el_list.each(function () {
-      var btn = $(this);
-      btn
-        .css({
-          position: 'relative',
-          overflow: 'hidden'
-        })
-        .bind('mousedown', function (e) {
-          var ripple;
-          if (btn.find('.inner-ripple').length === 0) {
-            ripple = $('<span class="inner-ripple"/>');
-            btn.prepend(ripple);
-          } else {
-            ripple = btn.find('.inner-ripple');
-          }
-          ripple.removeClass('inner-ripple-animated');
-
-          if (!ripple.height() && !ripple.width()) {
-            var diameter = Math.max(btn.outerWidth(), btn.outerHeight());
-            ripple.css({
-              height: diameter,
-              width: diameter
+
+        // ======= Affix =================
+        // ===============================
+        function set_affix(body_h) {
+            var aside_offset = $aside.offset().top - sub_nav_h,
+                aside_width  = $aside.width(),
+                main_bottom  = 40;
+
+            $aside_nav.css('width', aside_width);
+            $aside_nav.affix({
+                target: window,
+                offset: {
+                    top    : aside_offset,
+                    bottom : main_bottom
+                }
             });
-          }
-          var x = e.pageX - btn.offset().left - ripple.width() / 2;
-          var y = e.pageY - btn.offset().top - ripple.height() / 2;
-          ripple .css({top: y + 'px', left: x + 'px'}) .addClass('inner-ripple-animated');
-          setTimeout(function () {
-            ripple.removeClass('inner-ripple-animated');
-          }, 351);
-        });
-    });
-  }
-  var aside_layout = function  () {
-
-    if ($navbar_aside.length > 0) {
-
-      var navbar_aside_data = $navbar_aside[0].getBoundingClientRect();
-
-      if ($navClone == null) { // build affix menu
-
-        $navClone = $navbar_aside.clone().attr("id","navClone").appendTo($body);
-
-        //force repainting
-        $navClone[0].style.display='none';
-        setTimeout(function () {
-          $navClone[0].offsetHeight;
-          $navClone[0].style.display='';
-        }, 10);
-        $navClone.addClass("affix hidden");
-
-        ripple_animation($navClone.find("li > a"));
-        scroll_to($navClone.find("li > a"));
-
-        $navClone.css({
-          "width": navbar_aside_data.width,
-          "left": navbar_aside_data .left
-        })
-        $(window).trigger("resize");
-        //$body.scrollspy('refresh');
-      } // End - build affix menu
-
-    }
-  };
-  aside_layout();
-
-  var cards_animate = function  (type, speed) {
-    type = type || 'in';
-    speed = speed || 2000;
-    var $container = $(".container.index"),
-      $cards = $container.find(".card"),
-      $titles = $container.find("h2");
-
-    $cards.each(function  () {
-      var $card = $(this),
-        cardOffset = this.getBoundingClientRect(),
-        offset = cardOffset.left * 0.8 + cardOffset.top,
-        delay = parseFloat(offset / speed).toFixed(2);
-      $card.css("transition-delay", delay + "s");
-    });
+        };
+
+        // ======= Footer animations =====
+        // ===============================
+        var footer_animation = function () {
+            var footer_effect = $main.outerHeight() >= $win.outerHeight();
+
+            if (!footer_effect) {
+                footer_stop();
+                return;
+            };
+
+            $footer.toggleClass('o_footer_effect', footer_effect);
+            $body.css('padding-bottom', $footer.outerHeight());
+
+            var checkIfSearch = function(e) {
+                if ((e.ctrlKey || e.metaKey) && String.fromCharCode(e.which).toLowerCase() === 'f') {
+                    footer_stop();
+                }
+            };
+            $win.on('keydown.footer', function(e) {
+                checkIfSearch(e);
+            });
+        };
+
+        var footer_stop = function() {
+            $footer.removeClass('o_footer_effect');
+            $body.css('padding-bottom', 0);
+            $win.off('keydown.footer');
+        };
+
+
+        // ======= Docs Functions ==========
+        // =================================
+        // -- Layouting
+        var layouting = function () {
+            if ($main.hasClass("index")) {
+                $main.find("#index .index-tree > .row").each(function() {
+                    var childs = $(this).find(".col-md-3");
+                    if (childs.length == 2) {
+                        childs.removeClass("col-md-3").addClass("col-md-6");
+                    }
+                    if (childs.length == 3) {
+                        childs.removeClass("col-md-3").addClass("col-md-4");
+                    }
+                })
+                $(".floating_action_container").remove();
+            }
+            if (has_aside) { $aside_nav.find("li").has("ul").addClass("parent"); };
+        }
 
-    if (type === "in") {
-      $titles.fadeTo(0, 0);
-      $titles.fadeTo(1000, 1);
-      $container.addClass("animating");
-    } else {
-      $titles.fadeTo(300, 0);
-      $container.removeClass("animating");
-    }
-  };
-  cards_animate();
-
-
-  // BIND EVENTS
-
-  $floating_action.on("click", function  () {
-    floating_menu_toggle();
-    return false;
-  });
-
-  $mask.on("click", function  () {
-    floating_menu_toggle();
-    return false;
-  });
-
-  $(".content-switcher").each(function  (index, switcher) {
-    var $switcher = $(switcher),
-        $links = $switcher.find('> ul > li'),
-        $tabs = $switcher.find('> .tabs > *'),
-        $all = $links.add($tabs);
-
-    function select(index) {
-      $all.removeClass('active');
-      $links.eq(index).add($tabs.eq(index)).addClass('active');
-    }
-    select(0);
-    $switcher.on('click', '> ul > li', function () {
-      select($(this).index());
-      return false;
-    });
-  });
+        // -- Float action menu
+        var floating_menu_layout = function() {
+            var lis = $aside_nav.find("> ul > li").clone(true)
+                .addClass("ripple")
+                .css({
+                    position: 'relative',
+                    overflow: 'hidden'
+                });
+            lis.find("ul").remove().end()
+                .find("a").removeClass("ripple").on("click", function() {
+                    floating_menu_toggle();
+                });
+            $float_menu.find(".content").empty().append(lis);
+            $float.add($mask).on("click", function  () {
+                floating_menu_toggle();
+                return false;
+            });
+        }
+        var floating_menu_toggle = function() {
+            $float.toggleClass("active");
+            setTimeout(function() {
+                $float_menu.toggleClass("active");
+                $mask.toggleClass("active");
+            }, 300);
+        };
+
+        // -- Scroll To
+        var scroll_to = function(el_list) {
+            var offset = 80;
+            el_list.each(function() {
+                var $link = $(this),
+                    href  = $link.attr("href");
+
+                $link.on("click", function() {
+                    var val = $(href).offset().top - 60;
+                    $('html, body').animate({
+                        scrollTop: val
+                    }, 400);
+                    $aside_nav.find("li").removeClass("active");
+                    $link.parents("li").addClass("active");
+                    window.location.hash = $link.prop('hash');
+                    return false;
+                })
+            })
+        }
 
+        // -- Ripple buttons
+        var ripple_animation = function(el_list) {
+            el_list.each(function() {
+                var btn = $(this);
+                btn
+                    .css({
+                        position: 'relative',
+                        overflow: 'hidden'
+                    })
+                    .bind('mousedown', function(e) {
+                        var ripple;
+                        if (btn.find('.inner-ripple').length === 0) {
+                            ripple = $('<span class="inner-ripple"/>');
+                            btn.prepend(ripple);
+                        } else {
+                            ripple = btn.find('.inner-ripple');
+                        }
+                        ripple.removeClass('inner-ripple-animated');
+
+                        if (!ripple.height() && !ripple.width()) {
+                            var diameter = Math.max(btn.outerWidth(), btn.outerHeight());
+                            ripple.css({
+                                height: diameter,
+                                width: diameter
+                            });
+                        }
+                        var x = e.pageX - btn.offset().left - ripple.width() / 2;
+                        var y = e.pageY - btn.offset().top - ripple.height() / 2;
+                        ripple.css({
+                            top: y + 'px',
+                            left: x + 'px'
+                        }).addClass('inner-ripple-animated');
+                        setTimeout(function() {
+                            ripple.removeClass('inner-ripple-animated');
+                        }, 351);
+                    });
+            });
+        };
+
+        // -- Cards animation
+        var cards_animate = function(type, speed) {
+            type  = type || 'in';
+            speed = speed || 2000;
+            var $container = $("main.index"),
+                $cards  = $container.find(".card"),
+                $titles = $container.find("h2");
+
+            $cards.each(function() {
+                var $card      = $(this),
+                    cardOffset = this.getBoundingClientRect(),
+                    offset     = cardOffset.left * 0.8 + cardOffset.top,
+                    delay      = parseFloat(offset / speed).toFixed(2);
+                $card.css("transition-delay", delay + "s");
+            });
 
-  $(window)
-    .on("scroll", function () {
-      header_layout();
-      //aside_layout();
-    })
-    .on("resize", function () {
-      resize();
-      header_layout();
-      //aside_layout();
-    })
-    .trigger("scroll");
+            if (type === "in") {
+                $titles.fadeTo(0, 0);
+                $titles.fadeTo(1000, 1);
+                $container.addClass("animating");
+            } else {
+                $titles.fadeTo(300, 0);
+                $container.removeClass("animating");
+            }
+        };
+
+        // -- Header buttons
+        var header_buttons = function () {
+            var timer;
+            $header.on('click', '.o_primary_nav .dropdown-toggle', function(e) {
+                e.preventDefault();
+
+                var $a = $(this);
+                clearTimeout(timer);
+
+                $a.parent().toggleClass('open');
+                $a.closest('ul').toggleClass('o_sub_opened', $a.parent().hasClass('open'));
+                if ($a.closest('.o_primary_nav').children('.open').length > 0) {
+                    $header.addClass("o_sub_opened");
+                } else {
+                    timer = setTimeout(function() {
+                        $header.removeClass("o_sub_opened");
+                    }, 200);
+                }
+            });
+            $header.on('click', '.o_primary_nav .o_secondary_nav', function(e) {
+                if (e.target === e.currentTarget) {
+                    $header.find('.open').removeClass('open');
+                    $header.find('.o_sub_opened').andSelf().removeClass('o_sub_opened');
+                }
+            });
 
-  //Ripples
+            // -- Mobile menu opening
+            $header.on('click', '.o_mobile_menu_toggle', function(e) {
+                e.preventDefault();
+                $(this).find('i').toggleClass('fa-bars fa-times');
+                $header.toggleClass('o_mobile_menu_opened');
+            });
+        };
+
+        var card_top_animation = function (win_top){
+            var scrollFactor = 1.6,
+                bannerHeight = Math.max(450, $card_top.outerHeight(true) - 60),
+                top          = Math.min(win_top, bannerHeight/scrollFactor),
+                base_value   = top * (scrollFactor - 1),
+                opacity      = top/bannerHeight * scrollFactor;
+
+            $card_top.css('transform', 'translateY(' + base_value + 'px)');
+            $card_top_t.css({
+                'transform' : 'translateY( -' + ( base_value - (top/2))  + 'px)',
+                'opacity'   : 1 - opacity
+            });
+        }
 
-  ripple_animation(ripples);
+        $(".content-switcher").each(function(index, switcher) {
+            var $switcher = $(switcher),
+                $links    = $switcher.find('> ul > li'),
+                $tabs     = $switcher.find('> .tabs > *'),
+                $all      = $links.add($tabs);
+
+            function select(index) {
+                $all.removeClass('active');
+                $links.eq(index).add($tabs.eq(index)).addClass('active');
+            }
+            select(0);
+            $switcher.on('click', '> ul > li', function() {
+                select($(this).index());
+                return false;
+            });
+        });
 
-};
+        // ======= Onload ==================
+        // =================================
+        // -- Call default functions
+        layouting();
+        cards_animate();
+        header_buttons();
+        ripple_animation($(".ripple"));
+
+        if (has_aside) {
+            floating_menu_layout();
+            scroll_to(aside_links);
+            ripple_animation(aside_links);
+        }
 
-$(document).ready(function () {
-  update_page();
-});
+        // -- Conditionally call specific functions according to resolution
+        if (win_w >= screen_md){
+            footer_animation();
+
+            if (has_aside) {
+                $win.load(function (){
+                    // wait until page load before affix
+                    body_h = $body.height();
+                    set_affix(body_h);
+                })
+            }
+        };
+
+        // ======= On resize ==============
+        // ================================
+        // Update properties and conditionally call functions according to resolution
+        $win.on('resize', function () {
+            win_w  = $win.width();
+            body_h = $body.height();
+
+            if (win_w >= screen_md){
+                footer_animation();
+                if (has_aside) { set_affix(body_h); };
+            } else {
+                footer_stop();
+            };
+        });
 
+        // ======= On scroll ==============
+        // ================================
+        $win.on('scroll', function () {
+            if (win_w >= screen_md) {
+                var win_top  = $win.scrollTop();
+                    header_h = $header.outerHeight();
+
+                $header.toggleClass('o_scrolled', win_top > header_h);
+                card_top_animation(win_top);
+            } else {
+                $card_top.css('transform', '');
+            }
+        });
+    });
 })(jQuery);
diff --git a/doc/_extensions/odoo/static/footer.less b/doc/_extensions/odoo/static/footer.less
new file mode 100644
index 00000000000..d5019e29ce5
--- /dev/null
+++ b/doc/_extensions/odoo/static/footer.less
@@ -0,0 +1,95 @@
+// Based on http://www.odoo.com/openerp_website/static/src/less/footer.less
+// ========================================================================
+
+body > footer {
+    font-size: 14px;
+    position: relative;
+    width: 100%;
+    height: auto;
+    min-height: @footer-heigth;
+    background-color: @footer-bg-color;
+    color: @gray;
+
+    z-index: 1;
+    @media screen and (min-width: @screen-md-min) {
+        &.o_footer_effect {
+            .o-position-absolute(auto, 0, 0, 0);
+            position: fixed;
+            z-index: 0;
+        }
+    }
+
+    .o_footer_logo {
+        margin-bottom: 3em;
+        margin-top: 3em;
+    }
+
+    a {
+        color: @footer-text;
+        &:hover, &:active, &:focus {
+            color: white;
+        }
+    }
+    .dropdown-menu a {
+        color: @dropdown-link-color;
+        &:hover, &:focus {
+            color: @dropdown-link-hover-color;
+        }
+        &:active {
+            color: @dropdown-link-active-color;
+        }
+    }
+
+    .divider {
+        margin: 10px 0;
+    }
+    ul, ol {
+        list-style: none;
+        padding-left: 0;
+    }
+    span.menu_title {
+        font-weight: @fw_semibold;
+        color: white;
+        + ul {
+            margin-top: 10px;
+        }
+    }
+    .o_language_selector, .o_country_selector {
+        display: inline-block;
+        .opacity(0.8);
+        a {
+            font-size: 0.9em;
+            font-weight: bold;
+        }
+        img {
+            max-height: 20px;
+            margin-right: 10px;
+            vertical-align: bottom;
+        }
+        &:hover {
+            .opacity(1);
+        }
+    }
+    .o_country_selector {
+        float: right;
+    }
+
+    hr {
+        border-top-color: lighten(@footer-bg-color, 10%);
+    }
+    .o_footer_bottom {
+        background-color: @footer-bottom-bg-color;
+        color: @footer-text;
+        padding: 1em 0;
+        margin-top: 3em;
+        a {
+            .opacity(0.6);
+            &:hover {
+                .opacity(1);
+            }
+        }
+        .social-links .fa {
+            margin-left: 20px;
+        }
+    }
+}
diff --git a/doc/_extensions/odoo/static/header.less b/doc/_extensions/odoo/static/header.less
new file mode 100644
index 00000000000..dcd5ae0fb81
--- /dev/null
+++ b/doc/_extensions/odoo/static/header.less
@@ -0,0 +1,834 @@
+// Based on http://www.odoo.com/openerp_website/static/src/less/header.less
+// ========================================================================
+
+// =============  MIXINS
+.o-top-menu-links() {
+    &:not(.btn) {
+        display: inline-block;
+        padding: 0 20px;
+        font-weight: @fw_semibold;
+        text-transform: uppercase;
+
+        @media screen and (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
+            font-size: 11px;
+
+            &:not(.dropdown-toggle) {
+                padding: 0 10px;
+            }
+        }
+    }
+}
+
+.o-white-header() {
+    background-color: @w-header-white;
+    color: @header-link-normal;
+    .deep-1();
+
+    .o_logo {
+        background-position: 0 0;
+    }
+
+    > .o_main_header_main > .o_primary_nav > li.dropdown > a {
+        &::before, &::after {
+            background-color: @header-link-normal;
+            box-shadow: 0 1px 1px fade(@header-link-normal,10%);
+        }
+    }
+}
+
+// =============  MAIN HEADER
+#oe_main_menu_navbar ~ #wrapwrap .o_main_header {
+    &.o_has_sub_nav.o_scrolled {
+        top: 34px - (@w-header-height + 1);
+    }
+}
+
+.o_main_header {
+    @secondary-menu-animation-duration-opening: 500ms;
+    @secondary-menu-animation-duration-closing: @secondary-menu-animation-duration-opening * 2/3;
+
+    position: fixed;
+    width: 100%;
+    height: @w-header-height;
+    z-index: 2;
+    background-color: fade(white, 60%);
+    color: @header-link-normal;
+    font-family: @headings-font-family;
+    font-size: 12px;
+    .transition(all .2s ease);
+    .transition-property(~'background, box-shadow' );
+    .translate3d(auto, auto, 0);
+
+    a:focus, a:active, a:focus:active {
+        outline: none;
+    }
+
+    .btn-primary {
+        color: white!important;
+        font-size: inherit!important;
+        font-weight: @fw_bold;
+        text-transform: uppercase;
+    }
+
+    > .o_main_header_main {
+        .container(); // FIXME Remove this once the web_editor "container container" rule is fixed.
+        height: 100%;
+
+        a {
+            color: inherit;
+            &:hover, &:focus {
+                color: saturate(@header-link-normal, 10%);
+            }
+        }
+
+        .o_logo {
+            margin:  15px 0;
+            .size(63px, 20px);
+            background-size: cover;
+        }
+
+        > .o_primary_nav {
+            @w-header-arrow-length: 10px;
+
+            @media (min-width: @screen-sm-min) {
+                height: 100%;
+                &:before {
+                    content: "";
+                    background: transparent;
+                    z-index: -1;
+                    visibility: hidden;
+                    box-shadow: 0 1px 0 transparent;
+                    .size( 100%, @w-header-height);
+                    .o-position-absolute(0,0);
+                    .transition(~'background @{secondary-menu-animation-duration-opening} @{o-ease} 0ms, visibility 0ms linear @{secondary-menu-animation-duration-opening}, box-shadow @{secondary-menu-animation-duration-opening} linear 0ms' );
+                }
+
+                &.o_sub_opened:before {
+                    visibility: visible;
+                    background: @w-header-white;
+                    box-shadow: 0 1px 0 @gray-lighter;
+                    .transition(~'background @{secondary-menu-animation-duration-opening} @{o-ease} 0ms, visibility 0ms linear 0s, box-shadow @{secondary-menu-animation-duration-opening} linear 0ms');
+
+                }
+            }
+
+            margin: 0 auto;
+            padding: 0;
+            text-align: center;
+            white-space: nowrap;
+
+            .dropdown {
+                position: static;
+
+                > a {
+                    position: relative;
+                    .backface-visibility(hidden);
+
+                    &::before, &::after {
+                        content: "";
+                        display: block;
+                        .o-position-absolute(50%, 0);
+                        .o-transform-origin(50%, 50%);
+                        .o-transition(all, 300ms);
+                        width: @w-header-arrow-length;
+                        height: 1px;
+                        background-color: @headings-color;
+                        box-shadow: 0 1px 1px fade(@headings-color, 10%);
+                    }
+                    &::before {
+                        .rotate(45deg);
+                        right: @w-header-arrow-length / sqrt(2) - 1;
+                    }
+                    &::after {
+                        .rotate(-45deg);
+                    }
+                }
+                &.open > a {
+                    color: @odoo-brand-primary!important;
+                    font-weight: @fw_semibold;
+
+                    &::before, &::after {
+                        background-color: @odoo-brand-primary!important;
+                        box-shadow: 0 1px 1px fade(@odoo-brand-primary, 10%);
+                        right: @w-header-arrow-length / sqrt(2) / 2;
+                    }
+                    &::before {
+                        .rotate(-45deg);
+                    }
+                    &::after {
+                        .rotate(45deg);
+                    }
+                }
+                > .dropdown-menu {
+                    border: none;
+                    border-radius: 0;
+                    margin: 0;
+                }
+            }
+
+            > li {
+                display: inline-block;
+
+                > a {
+                    height: 100%;
+                    line-height: @w-header-height;
+                    .o-top-menu-links();
+                }
+                &.dropdown > a {
+                    margin-right: @w-header-arrow-length * 2;
+                }
+
+                // Secondary nav animation
+                @media (min-width: @screen-sm-min) {
+                    &.open > .o_secondary_nav {
+                        visibility: visible;
+                        background-color: white;
+                        .translate(0, 0);
+                        .transition(~'transform @{secondary-menu-animation-duration-opening} @{o-ease} 0ms, visibility 0ms linear 0ms, background-color 0ms linear @{secondary-menu-animation-duration-opening}');
+
+                        .container > .row > div {
+                            opacity: 1;
+                            .translate(0, 0);
+
+                            &:nth-child(1) {
+                                .transition-delay(@secondary-menu-animation-duration-opening * 1/5);
+                            }
+                            &:nth-child(2) {
+                                .transition-delay(@secondary-menu-animation-duration-opening * 2/5);
+                            }
+                            &:nth-child(3) {
+                                .transition-delay(@secondary-menu-animation-duration-opening * 3/5);
+                            }
+                            &:nth-child(4) {
+                                .transition-delay(@secondary-menu-animation-duration-opening * 4/5);
+                            }
+                        }
+                        .o_store_link {
+                            max-height: @w-header-height;
+                            .o-transition(max-height, @secondary-menu-animation-duration-opening, @o-ease, @secondary-menu-animation-duration-opening * 3/5);
+                        }
+
+                        &::before {
+                            opacity: 0.5;
+                        }
+                    }
+                }
+            }
+
+            .o_secondary_nav {
+                @w-li-link-height: 30px;
+                @w-li-link-animation-time: 300ms;
+                @w-menu-gutter-increase: 60px;
+
+                width: 100%;
+                padding: 15px 0 (@w-header-height + 15);
+                box-shadow: 0 3px 6px fade(black, 5%);
+
+                @media (min-width: @screen-md-min) { // Change gutter width for that case
+                    > .container > .row {
+                        margin-left: (@grid-gutter-width + @w-menu-gutter-increase) / -2;
+                        margin-right: (@grid-gutter-width + @w-menu-gutter-increase) / -2;
+
+                        > div {
+                            padding-left: (@grid-gutter-width + @w-menu-gutter-increase) / 2;
+                            padding-right: (@grid-gutter-width + @w-menu-gutter-increase) / 2;
+                        }
+                    }
+                }
+
+                > .container > .row > div {
+                    font-size: 16px;
+                    overflow: hidden;
+
+                    @media (min-width: @screen-sm-min) {
+                        height: 340px;
+                        padding-top: 10px;
+
+                        + div {
+                            border-left: 1px solid @gray-lighter;
+                        }
+                    }
+
+                    ul {
+                        position: relative;
+                        list-style: none;
+                        padding: 0;
+
+                        > li {
+                            height: @w-li-link-height;
+                            .o-transition(all, @w-li-link-animation-time, @o-ease, @w-li-link-animation-time/3);
+                            .transition-property(~'height, opacity');
+
+                            > a {
+                                display: block;
+                                height: 100%;
+                                line-height: @w-li-link-height;
+                                font-weight: @fw_medium;
+                                font-size: 1.4rem;
+                            }
+
+                            &.dropdown {
+                                &:not(.open) > a {
+                                    &::before, &::after {
+                                        .o-transform-origin((@w-header-arrow-length * 0.8), 50%);
+                                        width: @w-header-arrow-length * 0.8;
+                                        right: 0;
+                                    }
+                                }
+
+                                > ul {
+                                    .o-position-absolute(@w-li-link-height, 0, 0, 0);
+                                    .translate(100%, 0);
+                                    .opacity(0);
+                                    .o-transition(all, @w-li-link-animation-time, @o-ease, 0);
+                                }
+                                &.open > ul {
+                                    .translate(0, 0);
+                                    .opacity(1);
+                                    .o-transition(all, @w-li-link-animation-time, @o-ease, @w-li-link-animation-time/3);
+                                }
+                            }
+                        }
+                        &.o_sub_opened > li:not(.open) {
+                            opacity: 0;
+                            height: 0 !important;
+                            overflow: hidden;
+                            .o-transition(all, @w-li-link-animation-time, @o-ease, 0);
+                        }
+                    }
+
+                    .o_nav_app_family {
+                        text-align: center;
+                        font-weight: @fw_medium;
+                        line-height: 2;
+                        .o-no-select();
+
+                        > span {
+                            .o-retina-bg("apps_families_s.png", 0px, 50%);
+                            display: none;
+                        }
+
+                        @media (min-width: @screen-sm-min) {
+                            > span {
+                                display: block;
+                                margin: 0 auto;
+                                background-size: auto 100%;
+                                width: 51px;
+                                height: 50px;
+                            }
+                            > div {
+                                font-size: 0.7em;
+                                font-weight: @fw_medium;
+                                line-height: 1.5;
+                                color: @text-color;
+                                margin-bottom: 1.3em;
+                            }
+                        }
+                    }
+
+                    @media (min-width: @screen-sm-min) {
+                        &.o_website_apps {
+                            a:hover, a:focus, .o_nav_app_family {
+                                color: @color-beta;
+                            }
+                        }
+                        &.o_sale_apps {
+                            a:hover, a:focus, .o_nav_app_family {
+                                color: @color-gamma;
+                            }
+                            .o_nav_app_family > span {
+                                background-position: -60px 50%;
+                            }
+                        }
+                        &.o_operation_apps {
+                            a:hover, a:focus, .o_nav_app_family {
+                                color: @color-delta;
+                            }
+                            .o_nav_app_family > span {
+                                background-position: -120px 50%;
+                            }
+                        }
+                        &.o_productivity_apps {
+                            a:hover, a:focus, .o_nav_app_family {
+                                color: @color-epsilon;
+                            }
+                            .o_nav_app_family > span {
+                                background-position: -181px 50%;
+                            }
+                        }
+                    }
+                }
+
+                > .o_store_link {
+                    .o-position-absolute(auto, 0, 0, 0);
+                    overflow: hidden;
+                    display: block;
+                    height: @w-header-height;
+                    line-height: @w-header-height;
+                    border-top: 1px solid @gray-lighter;
+                    text-align: center;
+                    font-size: 12px;
+                    font-weight: @fw_semibold;
+                }
+
+                @media (min-width: @screen-sm-min) {
+                    // Animation
+                    display: block;
+                    background-color: @w-header-white;
+                    visibility: hidden;
+                    z-index: -2;
+                    .translate(0, -115%);
+                    .transition(~'transform @{secondary-menu-animation-duration-closing} @{o-ease} 0ms, visibility 0ms linear @{secondary-menu-animation-duration-closing}, background-color 0ms linear 0ms');
+
+                    .container > .row > div {
+                        opacity: 0;
+                        .translate(0, -30%);
+                        .o-transition(all, @secondary-menu-animation-duration-opening, @o-ease, 0ms);
+                    }
+                    .o_store_link {
+                        max-height: 0;
+                        .o-transition(max-height, @secondary-menu-animation-duration-opening/2, @o-ease, 0s);
+                    }
+
+                    // Overlay
+                    &::before {
+                        content: "";
+                        .o-position-absolute(100%, 0, -1000px, 0);
+                        display: block;
+                        background-color: #000;
+                        opacity: 0;
+                        .o-transition(opacity, @secondary-menu-animation-duration-opening, @o-ease);
+                    }
+                }
+            }
+        }
+
+        .o_header_buttons {
+            height: 100%;
+            line-height: @w-header-height;
+            float: right;
+
+            > * {
+                display: inline-block;
+                float: left;
+            }
+
+            a {
+                .o-top-menu-links();
+
+                &.dropdown-toggle {
+                    padding: 0 10px;
+                }
+
+                &.o_my_cart {
+                    padding: 0;
+
+                    .my_cart_quantity {
+                        font-family: sans-serif;
+                        border-radius: 100%;
+                        font-weight: bold;
+                        font-size: 90%;
+                        padding: 4px 0;
+                        min-width: 19px;
+                        text-align: center;
+                        display: inline-block;
+                    }
+                }
+            }
+
+            .btn-primary {
+                margin-top: 9px;
+            }
+
+            > .dropdown {
+                margin: 0 5px;
+
+                @media screen and (min-width: @screen-md-min) {
+                    margin: 0 15px;
+                }
+
+                &, .dropdown-toggle {
+                    height: 100%;
+                }
+
+                > .dropdown-menu {
+                    left: auto;
+                    right: 0;
+                    li a {
+                        padding-top: 5px;
+                        padding-bottom: 5px;
+                        color: @text-color;
+                    }
+                }
+            }
+        }
+    }
+
+    > .o_sub_nav {
+        min-height: @w-sub-nav-height;
+        border: 1px solid fade(black, 5%);
+        border-width: 1px 0;
+        background-color: fade(white, 80%);
+
+        > .container {
+
+            .navbar-header {
+                height: @w-sub-nav-height - 2;
+                line-height: @w-sub-nav-height - 2;
+                font-weight: @fw_semibold;
+                color: @text-color;
+                overflow: hidden;
+
+                .o_app_name_logo,
+                .o_app_name_title {
+                    .translate(-61px, 0);
+                    .o-transition(transform, 400ms);
+                }
+
+                &:hover {
+                    color: @headings-color;
+                }
+
+                .o_app_name_logo {
+                    .o_logo();
+                    .o_logo_15();
+                    vertical-align: middle;
+                    margin: auto 5px 3px 0;
+                }
+                .o_app_name_title {
+                    color: inherit;
+                    vertical-align: middle;
+                    display: inline-block;
+
+                    span{
+                        margin-right: 5px;
+                    }
+                }
+            }
+
+            .nav {
+                margin-right: -15px; // gutter's right compensation
+            }
+
+            .nav > li {
+                margin-left: 20px;
+                height: @w-sub-nav-height - 2;
+                line-height: @w-sub-nav-height - 2;
+
+                > a {
+                    height: 100%;
+                    line-height: @w-sub-nav-height - 2;
+                    padding: 0;
+                    font-size: 12px;
+                    font-weight: @fw_medium;
+                    color: @text-color;
+
+                    &:hover, &:focus {
+                        color: @headings-color;
+                        background-color: transparent;
+                    }
+                }
+                &.active > a {
+                    color: @headings-color;
+                    font-weight: @fw_semibold;
+                }
+            }
+
+            .call-to-action {
+                line-height: @w-sub-nav-height - 4;
+                overflow: hidden;
+                width: 100%;
+                max-width: 0px;
+                transform-origin: 0 0;
+                .transition(max-width 0.3s ease 0ms);
+
+
+                > a {
+                    margin-left: 35px;
+                    font-weight: @fw_semibold;
+                    padding: (@padding-base-vertical - 2px)  @padding-base-horizontal;
+                    line-height: 1.4em;
+                    font-size: 12px!important;
+                }
+            }
+        }
+    }
+    &.o_inverted:not(.o_scrolled) > .o_sub_nav {
+        .transition( 0.3s background-color);
+        background-color: fade(white, 5%);
+        border-color: fade(white, 10%);
+
+        .nav > li > a,
+        .o_app_name_title {
+            color: fade(white, 90%);
+
+            &:hover, &:focus {
+                color: white;
+            }
+        }
+    }
+
+    @media (min-width: @screen-sm-min) {
+        // Top menu styles
+        // --------------------------------
+        &.o_has_sub_nav {
+            position: absolute;
+            &.o_scrolled {
+                position: fixed;
+                top: -(@w-header-height + 1);
+            }
+        }
+
+        &.o_inverted {
+            background-color: transparent;
+            color: white;
+            a:hover, a:focus {
+                color: inherit;
+            }
+
+            .o_logo {
+                .o_logo_inverse;
+            }
+
+            .o_main_header_main > .o_primary_nav > li.dropdown > a {
+                &::before, &::after {
+                    background-color: white;
+                    box-shadow: 0 1px 1px fade(white, 10%);
+                }
+            }
+        }
+        > .o_main_header_main > .o_header_buttons {
+            .dropdown.open {
+                background-color: @w-header-white;
+                color: @header-link-normal;
+
+                .dropdown-menu {
+                    background-color: @w-header-white;
+                    margin-top: 0;
+                    border: none;
+                    border-radius: 0;
+                    .deep-1();
+                    text-align: left;
+                    min-width: 100%;
+                    padding-bottom: @w-header-height/4;
+
+                    > li > a {
+                        display: block;
+                        color: @header-link-normal;
+                        float: none;
+                        text-transform: none;
+                        font-weight: normal;
+                    }
+                }
+            }
+        }
+    }
+
+    &.o_scrolled:not(.o_transparent_blocked), &.o_sub_opened {
+        .o-white-header();
+    }
+
+    &.o_scrolled .o_sub_nav {
+        background: @w-header-white;
+
+        > .container {
+            .navbar-header > span{
+                .translate(0, 0);
+            }
+            .call-to-action {
+                max-width: 133px;
+            }
+        }
+    }
+
+    &.o_sub_opened .o_sub_nav {
+        display: none;
+    }
+}
+
+@media (max-width: @screen-xs-max) {
+    .o_main_header {
+        @mobile-dark: #25252D;
+        @mobile-light: #33343D;
+
+        position: relative;
+        height: auto;
+        min-height: @w-header-height;
+        .o-white-header();
+
+        > .o_main_header_main {
+            position: relative;
+
+            > .o_primary_nav, .o_header_buttons {
+                display: none;
+            }
+
+            > .o_mobile_menu_toggle {
+                .o-position-absolute(0, 0);
+                width: @w-header-height;
+                line-height: @w-header-height;
+                font-size: @w-header-height/3;
+                text-align: center;
+            }
+        }
+
+        > .o_sub_nav {
+            display: none;
+        }
+
+        &.o_mobile_menu_opened {
+            > .o_main_header_main {
+                margin: 0;
+
+                > .o_header_buttons {
+                    float: none;
+                    background-color: @mobile-dark;
+                    padding: 0 (@grid-gutter-width/2);
+                    box-sizing: content-box;
+                    margin: @w-header-height (-@grid-gutter-width/2) 0;
+                    display: block;
+                    text-align: center;
+                    .size(100%, auto);
+
+                    > * {
+                        overflow: visible!important;
+                        color: @w-header-white;
+                        float: none;
+                        display: inline;
+
+                        > a:not(.btn) {
+                            display: initial!important;
+                        }
+
+                        .dropdown-toggle {
+                            color: @w-header-white!important;
+                        }
+
+                        .dropdown-menu {
+                            position: relative;
+                            line-height: 2;
+                            background: fade(white, 5%);
+                            width: 100%;
+                            margin: 0 (-@grid-gutter-width/2) 0;
+                            box-sizing: content-box;
+                            padding: 5px (@grid-gutter-width/2);
+
+                            > li > a {
+                                float: none;
+                                display: block;
+                                margin-bottom: 5px;
+                                padding: 10px;
+                                color: @w-header-white!important;
+                                font-size: 0.8em;
+
+                                &:hover {
+                                    background: fade(white, 5%);
+                                }
+                            }
+                        }
+                    }
+                }
+
+
+                > .o_primary_nav {
+                    display: block;
+                    background-color: @mobile-dark;
+                    color: white;
+                    margin: 0 (-@grid-gutter-width/2) 0;
+                    padding: 0;
+                    float: none;
+                    white-space: normal;
+
+                    a:hover, a:focus, a:active {
+                        color: white;
+                    }
+
+                    li {
+                        border: 0 solid @mobile-light;
+                        border-width: 1px 5px 0;
+                    }
+
+                    > li {
+                        width: 100%;
+                        padding: 0 @grid-gutter-width/2;
+
+                        &.dropdown {
+                            padding: 0;
+
+                            > a {
+                                display: none;
+                            }
+                            > .dropdown-menu {
+                                position: static;
+                                display: block;
+                                background-color: transparent;
+                                box-shadow: none;
+                            }
+
+                            > .o_secondary_nav {
+                                padding: 0;
+
+                                > .container > .row > div {
+                                    padding: 0;
+
+                                    ul {
+                                        list-style-type: none;
+
+                                        > li {
+                                            height: @w-header-height;
+                                            padding: 0 @grid-gutter-width/2;
+                                            border-width: 1px 0 0;
+
+                                            > a {
+                                                line-height: @w-header-height;
+                                            }
+
+                                            &.dropdown.open {
+                                                height: auto;
+                                                border: none;
+                                                > ul {
+                                                    position: static;
+                                                }
+                                            }
+                                        }
+                                    }
+                                    > .o_nav_app_family {
+                                        height: @w-header-height;
+                                        line-height: @w-header-height;
+                                        background-color: @mobile-light;
+
+                                        > * {
+                                            display: none;
+                                        }
+
+                                        &::after {
+                                            content: "(Apps)";
+                                        }
+                                    }
+                                }
+
+                                > .o_store_link {
+                                    position: relative;
+                                    border: 0 solid @mobile-light;
+                                    border-width: 14px 0 0;
+                                    padding-top: 14px;
+                                    line-height: 1.5;
+                                    height: 60px;
+                                }
+                            }
+
+                            &::after {
+                                content: "";
+                                display: inline-block;
+                                width: 100%;
+                                height: 20px;
+                                margin-bottom: -5px; // FIXME don't know why
+                                background-color: @mobile-light;
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
diff --git a/doc/_extensions/odoo/static/img/2x_apps_families_s.png b/doc/_extensions/odoo/static/img/2x_apps_families_s.png
new file mode 100644
index 00000000000..f364d40139e
--- /dev/null
+++ b/doc/_extensions/odoo/static/img/2x_apps_families_s.png
diff --git a/doc/_extensions/odoo/static/img/apps_families_s.png b/doc/_extensions/odoo/static/img/apps_families_s.png
new file mode 100644
index 00000000000..344232c936b
--- /dev/null
+++ b/doc/_extensions/odoo/static/img/apps_families_s.png
diff --git a/doc/_extensions/odoo/static/img/banner_bg.png b/doc/_extensions/odoo/static/img/banner_bg.png
new file mode 100644
index 00000000000..468c0d14d92
--- /dev/null
+++ b/doc/_extensions/odoo/static/img/banner_bg.png
diff --git a/doc/_extensions/odoo/static/img/logos/odoo_logo.png b/doc/_extensions/odoo/static/img/logos/odoo_logo.png
new file mode 100644
index 00000000000..55b03ae38c8
--- /dev/null
+++ b/doc/_extensions/odoo/static/img/logos/odoo_logo.png
diff --git a/doc/_extensions/odoo/static/img/logos/odoo_logo.svg b/doc/_extensions/odoo/static/img/logos/odoo_logo.svg
new file mode 100644
index 00000000000..0d404edf64a
--- /dev/null
+++ b/doc/_extensions/odoo/static/img/logos/odoo_logo.svg
@@ -0,0 +1,31 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="1254px" height="200px" viewBox="0 0 1254 200" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
+    <!-- Generator: Sketch 3.3.3 (12081) - http://www.bohemiancoding.com/sketch -->
+    <title>odoo_logo</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
+        <g id="odoo_logo" sketch:type="MSArtboardGroup">
+            <g id="odoo_logo_rgb" sketch:type="MSLayerGroup" transform="translate(0.000000, 1.000000)">
+                <path d="M550.5,198.865327 C592.197499,198.865327 626,165.062825 626,123.365327 C626,81.667828 592.197499,47.8653266 550.5,47.8653266 C508.802501,47.8653266 475,81.667828 475,123.365327 C475,165.062825 508.802501,198.865327 550.5,198.865327 Z M550.5,167.865327 C575.076671,167.865327 595,147.941998 595,123.365327 C595,98.7886553 575.076671,78.8653266 550.5,78.8653266 C525.923329,78.8653266 506,98.7886553 506,123.365327 C506,147.941998 525.923329,167.865327 550.5,167.865327 Z" id="Oval-3" fill="#888888" sketch:type="MSShapeGroup"></path>
+                <path d="M390.5,198.865327 C432.197499,198.865327 466,165.062825 466,123.365327 C466,81.667828 432.197499,47.8653266 390.5,47.8653266 C348.802501,47.8653266 315,81.667828 315,123.365327 C315,165.062825 348.802501,198.865327 390.5,198.865327 Z M390.5,167.865327 C415.076671,167.865327 435,147.941998 435,123.365327 C435,98.7886553 415.076671,78.8653266 390.5,78.8653266 C365.923329,78.8653266 346,98.7886553 346,123.365327 C346,147.941998 365.923329,167.865327 390.5,167.865327 Z" id="Oval-2" fill="#888888" sketch:type="MSShapeGroup"></path>
+                <g id="D" transform="translate(157.000000, 0.000000)" fill="#888888" sketch:type="MSShapeGroup">
+                    <g id="d-+-Rectangle-1">
+                        <path d="M151.130367,122.770274 C151.131897,122.968444 151.132663,123.166796 151.132663,123.365327 C151.132663,165.062825 117.330162,198.865327 75.6326633,198.865327 C33.9351647,198.865327 0.132663317,165.062825 0.132663317,123.365327 C0.132663317,81.667828 33.9351647,47.8653266 75.6326633,47.8653266 C92.7270283,47.8653266 108.494494,53.5464573 121.149994,63.1236518 L121.149994,15.0040777 C121.149994,6.71755439 127.863901,0 136.149994,0 C144.434265,0 151.149994,6.72381102 151.149994,15.0040777 L151.149994,121.995922 C151.149994,122.255634 151.143399,122.513804 151.130367,122.770274 L151.130367,122.770274 Z M75.6326633,167.865327 C100.209335,167.865327 120.132663,147.941998 120.132663,123.365327 C120.132663,98.7886553 100.209335,78.8653266 75.6326633,78.8653266 C51.055992,78.8653266 31.1326633,98.7886553 31.1326633,123.365327 C31.1326633,147.941998 51.055992,167.865327 75.6326633,167.865327 Z" id="d"></path>
+                    </g>
+                </g>
+                <path d="M76.1924623,198.697487 C117.889961,198.697487 151.692462,164.894986 151.692462,123.197487 C151.692462,81.4999888 117.889961,47.6974874 76.1924623,47.6974874 C34.4949637,47.6974874 0.692462312,81.4999888 0.692462312,123.197487 C0.692462312,164.894986 34.4949637,198.697487 76.1924623,198.697487 Z M75.5,168 C100.076671,168 120,148.076671 120,123.5 C120,98.9233286 100.076671,79 75.5,79 C50.9233286,79 31,98.9233286 31,123.5 C31,148.076671 50.9233286,168 75.5,168 Z" id="Oval-1" fill="#9C5789" sketch:type="MSShapeGroup"></path>
+            </g>
+            <g id="odoo_logo_white" sketch:type="MSLayerGroup" transform="translate(627.000000, 1.000000)" fill="#FFFFFF">
+                <path d="M550.5,198.865327 C592.197499,198.865327 626,165.062825 626,123.365327 C626,81.667828 592.197499,47.8653266 550.5,47.8653266 C508.802501,47.8653266 475,81.667828 475,123.365327 C475,165.062825 508.802501,198.865327 550.5,198.865327 Z M550.5,167.865327 C575.076671,167.865327 595,147.941998 595,123.365327 C595,98.7886553 575.076671,78.8653266 550.5,78.8653266 C525.923329,78.8653266 506,98.7886553 506,123.365327 C506,147.941998 525.923329,167.865327 550.5,167.865327 Z" id="Oval-3" sketch:type="MSShapeGroup"></path>
+                <path d="M390.5,198.865327 C432.197499,198.865327 466,165.062825 466,123.365327 C466,81.667828 432.197499,47.8653266 390.5,47.8653266 C348.802501,47.8653266 315,81.667828 315,123.365327 C315,165.062825 348.802501,198.865327 390.5,198.865327 Z M390.5,167.865327 C415.076671,167.865327 435,147.941998 435,123.365327 C435,98.7886553 415.076671,78.8653266 390.5,78.8653266 C365.923329,78.8653266 346,98.7886553 346,123.365327 C346,147.941998 365.923329,167.865327 390.5,167.865327 Z" id="Oval-2" sketch:type="MSShapeGroup"></path>
+                <g id="D" transform="translate(157.000000, 0.000000)" sketch:type="MSShapeGroup">
+                    <g id="d-+-Rectangle-1">
+                        <path d="M151.130367,122.770274 C151.131897,122.968444 151.132663,123.166796 151.132663,123.365327 C151.132663,165.062825 117.330162,198.865327 75.6326633,198.865327 C33.9351647,198.865327 0.132663317,165.062825 0.132663317,123.365327 C0.132663317,81.667828 33.9351647,47.8653266 75.6326633,47.8653266 C92.7270283,47.8653266 108.494494,53.5464573 121.149994,63.1236518 L121.149994,15.0040777 C121.149994,6.71755439 127.863901,0 136.149994,0 C144.434265,0 151.149994,6.72381102 151.149994,15.0040777 L151.149994,121.995922 C151.149994,122.255634 151.143399,122.513804 151.130367,122.770274 L151.130367,122.770274 Z M75.6326633,167.865327 C100.209335,167.865327 120.132663,147.941998 120.132663,123.365327 C120.132663,98.7886553 100.209335,78.8653266 75.6326633,78.8653266 C51.055992,78.8653266 31.1326633,98.7886553 31.1326633,123.365327 C31.1326633,147.941998 51.055992,167.865327 75.6326633,167.865327 Z" id="d"></path>
+                    </g>
+                </g>
+                <path d="M76.1924623,198.697487 C117.889961,198.697487 151.692462,164.894986 151.692462,123.197487 C151.692462,81.4999888 117.889961,47.6974874 76.1924623,47.6974874 C34.4949637,47.6974874 0.692462312,81.4999888 0.692462312,123.197487 C0.692462312,164.894986 34.4949637,198.697487 76.1924623,198.697487 Z M75.5,168 C100.076671,168 120,148.076671 120,123.5 C120,98.9233286 100.076671,79 75.5,79 C50.9233286,79 31,98.9233286 31,123.5 C31,148.076671 50.9233286,168 75.5,168 Z" id="Oval-1" sketch:type="MSShapeGroup"></path>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/doc/_extensions/odoo/static/img/logos/odoo_logo_small.png b/doc/_extensions/odoo/static/img/logos/odoo_logo_small.png
new file mode 100644
index 00000000000..49ff16ac50d
--- /dev/null
+++ b/doc/_extensions/odoo/static/img/logos/odoo_logo_small.png
diff --git a/doc/_extensions/odoo/static/layout.less b/doc/_extensions/odoo/static/layout.less
index c7ce372f6b6..c350defa2a1 100644
--- a/doc/_extensions/odoo/static/layout.less
+++ b/doc/_extensions/odoo/static/layout.less
@@ -14,7 +14,6 @@
   position: absolute;
   width: 43%;
   height: 100%;
-  //z-index: 0;
   top: 0;
   right: 0;
 }
@@ -24,60 +23,22 @@ body, header {
   position: relative;
 }
 
-// @screen-xs     : 480px;
-// @screen-sm     : 768px;
-// @screen-md     : 992px;
-// @screen-lg     : 1200px;
-
-// @w-size-small  : 480px;
-// @w-size-medium : 992px;
-// @w-size-large  : 1170px;
-// @w-size-xlarge : 1440px;
-
-#main_navbar{
-  .container-fluid {
-    // @media screen and (min-width: @w-size-medium){
-    //   padding: 0;
-    // }
-    .navbar-header {
-      li { float:left}
-    }
-  }
-  // .navbar-nav {
-  //   @media screen and (max-width: @w-size-medium){
-  //     margin: 0;
-  //   }
-  // }
-}
-
-header{
-  @media (min-width:@screen-sm) {
-    margin-bottom: -50px;
-  }
-}
-
-.card.top {
-  height: 0;
-  margin-bottom: 0;
-  overflow: hidden;
-  position: relative;
-  padding-top: 50%;
-  padding-bottom: 15%;
-
-  @media (min-width:@screen-sm) {
-    padding-top: 30%;
-  }
+// Index layout
+#wrap {
+  > .container.index {
+    background-color: @gray-lightest;
+    width: 100%;
+    position: relative;
 
-  @media (min-width:@w-size-medium) {
-    padding-top: 10%;
-    padding-bottom: 15%;
+    > .index {
+      .container;
+    }
   }
 }
 
-
 #main_title {
   margin: 10px;
-  @media (min-width:@w-size-medium) {
+  @media (min-width:@screen-md-min) {
     margin: 0 0 9px 0;
   }
 }
@@ -108,15 +69,15 @@ main{
     padding:0;
     display:block;
     float:left;
-    @media (max-width:@w-size-medium) {
+    @media (max-width:@screen-md-min) {
       display: none;
     }
   }
   article.doc-body {
     background: @doc_paper;
-    padding-right: 30px;
-    padding-left: 30px;
-    @media (min-width: @w-size-medium) {
+    border-left: 1px solid @gray-lighter;
+    padding: 15px 30px;
+    @media (min-width: @screen-md-min) {
       width: 75%;
       &.doc-toc {
         width: 100%;
@@ -130,18 +91,15 @@ main{
 }
 
 main.has_code_col{
-  @media (max-width:@w-size-xlarge) {
-    width: 100%;
-  }
+  .container;
 
   aside {
-    width: 16.66666667%;
-    @media (max-width:@w-size-large) {
-      width: 25%;
-    }
+    display: none;
   }
 
   article.doc-body {
+    width: 100%;
+
     > *{
       max-width: 100%;
     }
@@ -152,15 +110,16 @@ main.has_code_col{
       width: 100%;
     }
 
-    @media (min-width: @w-size-large) {
-      width: 83.33333333%;
+    @media (min-width: @screen-lg-min) {
+      width: 100%;
       padding-right: 0;
       &:before {
         .code-col();
       }
       section {
         > * {
-          width: 55.633333%;
+          width: 54.633333%;
+          max-width: 600px;
           float: left;
           clear: left;
         }
@@ -174,9 +133,17 @@ main.has_code_col{
           float: none;
           clear: none;
           margin-right: 15px;
-          margin-left: 56%;
+          margin-left: 57%;
+
           .content-switcher{
             margin-top:0;
+            > ul {
+              margin-bottom: 0;
+            }
+
+            > ul > li {
+               color: @gray-light;
+            }
           }
         }
       }
@@ -212,6 +179,10 @@ main.index .toctree-wrapper{
   }
 }
 
+article.doc-toc .toctree-wrapper > ul > li > span {
+  display: block;
+  font-size: 28px;
+}
 
 .code-fields{
   display: table;
@@ -222,7 +193,7 @@ main.index .toctree-wrapper{
   .code-field-body{
     display: block;
     padding-left:  15px;
-    @media screen and (min-width: @w-size-medium ){
+    @media screen and (min-width: @screen-md-min){
       display: table-cell;
       padding-left:  0;
     }
@@ -230,7 +201,7 @@ main.index .toctree-wrapper{
   .code-field-name{
     width:auto;
     display:block;
-    @media screen and (min-width: @w-size-medium ){
+    @media screen and (min-width: @screen-md-min){
       width:20%;
       padding-right: 20px;
       display: table-cell;
diff --git a/doc/_extensions/odoo/static/mixins.less b/doc/_extensions/odoo/static/mixins.less
index 1888c0d3a04..7c11317f07a 100644
--- a/doc/_extensions/odoo/static/mixins.less
+++ b/doc/_extensions/odoo/static/mixins.less
@@ -1,4 +1,196 @@
-// Mixins
+// ================================================
+// ================  Mixins =======================
+// ================================================
+
+// Utilities
+// ------------------------------------------------------------------
+.o-no-select {
+    pointer-events: none;
+    cursor: default;
+    &, & * {
+        &::selection {
+            background: transparent;
+        }
+        &::-moz-selection {
+            background: transparent;
+        }
+    }
+}
+
+.o-position-absolute(@top: auto, @right: auto, @bottom: auto, @left: auto) {
+    position: absolute;
+    top: @top;
+    left: @left;
+    bottom: @bottom;
+    right: @right;
+}
+
+.o-transform-origin(@x: 50%, @y: 50%, @z: 0) {
+    -ms-transform-origin: @x @y @z;
+    -webkit-transform-origin: @x @y @z;
+    -moz-transform-origin: @x @y @z;
+    transform-origin: @x @y @z;
+}
+
+.o-transition(@property: all, @duration: 0s, @timing-function: ease, @transition-delay: 0s) {
+    -webkit-transition: @property @duration @timing-function @transition-delay;
+    -moz-transition: @property @duration @timing-function @transition-delay;
+    -o-transition: @property @duration @timing-function @transition-delay;
+    transition: @property @duration @timing-function @transition-delay;
+}
+
+// Backgrounds
+// ------------------------------------------------------------------
+.o-svg-bg(@file_name,@file_ext,@x:50%, @y:50%, @repeat: no-repeat, @folder: '') {
+    @std-url: url("img/@{folder}@{file_name}.@{file_ext}");
+    @svg-url: url("img/@{folder}@{file_name}.svg");
+    background-image: @std-url;
+    background-image: @svg-url;
+    background-position: @x @y;
+    background-repeat: @repeat;
+}
+
+.o-retina-bg(@img,@x:50%, @y:50%, @repeat: no-repeat, @folder: '') {
+    @std-url: url("img/@{folder}@{img}");
+    background-image: @std-url;
+    background-position: @x @y;
+    background-repeat: @repeat;
+
+    @media
+    only screen and (-webkit-min-device-pixel-ratio: 2),
+    only screen and (   min--moz-device-pixel-ratio: 2),
+    only screen and (     -o-min-device-pixel-ratio: 2/1),
+    only screen and (        min-device-pixel-ratio: 2),
+    only screen and (                min-resolution: 192dpi),
+    only screen and (                min-resolution: 2dppx) {
+    @2x-url: url("img/@{folder}@{website-2x-prefix}@{img}");
+        background-image: @2x-url;
+    }
+}
+
+.o-gradient(@deg: 99deg , @startColor: @o-violet-dark, @endColor: @o-violet-darker, @startOffset: 10%, @endOffset: 90%) {
+    background: mix(@startColor, @endColor);
+    background: -webkit-linear-gradient(@deg, @startColor @startOffset, @endColor @endOffset);
+    background: -moz-linear-gradient(@deg, @startColor @startOffset, @endColor @endOffset);
+    background: -ms-linear-gradient(@deg, @startColor @startOffset, @endColor @endOffset);
+    background: -o-linear-gradient(@deg, @startColor @startOffset, @endColor @endOffset);
+    background: linear-gradient(@deg, @startColor @startOffset, @endColor @endOffset);
+}
+
+// Logos
+// ------------------------------------------------------------------
+.o-logo-size(@height) {
+    @ratio: 3.135;
+    .size((@height * @ratio), @height);
+    background-size: auto @height;
+}
+.generate-logo-classes(@n, @i: 15) when (@i =< @n) {
+    .o_logo_@{i} {
+        .o-logo-size(@i*1px)
+    }
+    .generate-logo-classes(@n, (@i * 2));
+}
+
+.o_logo {
+    .o-svg-bg("odoo_logo","png", 0, 0, no-repeat, "logos/" );
+    display: inline-block;
+    .o-logo-size(30px); // 30px height is default size
+
+    &.center-block,
+    &.o_logo_responsive_half {
+        position: relative;
+        margin-left: auto;
+        margin-right: auto;
+        display: block;
+    }
+
+    &.o_logo_responsive {
+        background-size: cover;
+        width: 100%;
+        height: 0;
+        padding-bottom: 31.9%;
+    }
+
+    &.o_logo_responsive_half {
+        background-size: cover;
+        width: 50%;
+        height: 0;
+        padding-bottom: 15.94%;
+    }
+}
+
+// Generate Logo's sizes classes
+// heights:  15 - 30 - 60 - 120 - 240
+// ------------------------------------------------------------------
+.generate-logo-classes(240);
+
+&.o_logo_inverse {
+    background-position: 100% 0;
+    &.o_logo_15.center-block {
+        background-position: 102% 0;
+    }
+}
+
+// Elevation Shadows
+// Visual cue indicating the amount of separation between surfaces.
+// An object’s elevation determines the appearance of its shadow.
+// ------------------------------------------------------------------
+.deep-1-shadow() {
+    box-shadow: 0  1px  1px 0 rgba(0, 0, 0, 0.17);
+}
+.deep-2-shadow() {
+    box-shadow: 0  6px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.05);
+}
+.deep-3-shadow() {
+    box-shadow: 0 13px 25px 0 rgba(0, 0, 0, 0.1), 0 11px 7px 0 rgba(0, 0, 0, 0.09);
+}
+.deep-4-shadow() {
+    box-shadow: 0 20px 40px 0 rgba(0, 0, 0, 0.1), 0 14px 12px 0 rgba(0, 0, 0, 0.07);
+}
+.deep-5-shadow() {
+    box-shadow: 0 27px 55px 0 rgba(0, 0, 0, 0.1), 0 17px 17px 0 rgba(0, 0, 0, 0.05);
+}
+.deep-transition() {
+    .o-transition(box-shadow, 0.3s, @o-ease);
+}
+
+.deep-1() {
+    .deep-1-shadow();
+
+    &.deep_hover:hover {
+        .deep-transition();
+        .deep-2-shadow();
+    }
+}
+.deep-2() {
+    .deep-2-shadow();
+
+    &.deep_hover:hover {
+        .deep-transition();
+        .deep-3-shadow();
+    }
+}
+.deep-3() {
+    .deep-3-shadow();
+
+    &.deep_hover:hover {
+        .deep-transition();
+        .deep-4-shadow();
+    }
+}
+.deep-4() {
+    .deep-4-shadow();
+
+    &.deep_hover:hover {
+        .deep-transition();
+        .deep-5-shadow();
+    }
+}
+.deep-5() {
+    .deep-5-shadow();
+}
+
+
 .transform(@args) {
   -webkit-transform : @args;
   -moz-transform    : @args;
@@ -7,27 +199,121 @@
   transform         : @args;
 }
 
-.antialiased{
-  -moz-osx-font-smoothing : grayscale;
-  -webkit-font-smoothing  : antialiased;
-  text-rendering          : geometricPrecision;
-}
-
-.mdi-icon {
-  font-family: 'Material-Design-Icons';
-  display: inline-block;
-  text-rendering: geometricPrecision;
-  .antialiased;
+//-- Material Design Icons
+.mdi-icon(@content) {
+    font-family: 'Material-Design-Icons';
+    content: @content;
+    display: inline-block;
+    text-rendering: geometricPrecision;
+    font-size: 1em;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
 }
 
-
-
 .keyframes(@name; @arguments) {
   @-moz-keyframes @name { @arguments(); }
   @-webkit-keyframes @name { @arguments(); }
   @keyframes @name { @arguments(); }
 }
 
+//-- Documentation Dropdown style
+.o-doc-dropdown {
+    > a.dropdown-toggle {
+        padding: 0 5px 0 10px;
+        &:after {
+            .mdi-icon( "\e7c1");
+
+            @media screen and (max-width: @screen-xs-max) {
+                font-size: 1.5em
+            }
+        }
+    }
+
+    &.open {
+        z-index: 1;
+        position: relative;
+        background-color: @gray-light;
+        color: @header-link-normal;
+
+        @media screen and (min-width: @screen-sm-min){
+            background-color: @w-header-white;
+        }
+
+        .dropdown-toggle {
+            color: @header-link-normal;
+
+            &:hover {
+                color: @headings-color;
+            }
+        }
+
+        .dropdown-menu {
+            margin-top: 0;
+            border: none;
+            border-radius: 0;
+            text-align: left;
+            min-width: 100%;
+            background-color: @w-header-white;
+            padding-bottom: @w-header-height/4;
+            .deep-1();
+
+            > li > a {
+                font-size: 12px;
+                display: block;
+                color: @header-link-normal;
+                float: none;
+                text-transform: none;
+                font-weight: @fw_medium;
+
+                @media screen and (max-width: @screen-xs-max) {
+                    padding-left: 10px;
+                }
+            }
+            > li.active > a {
+                color: white;
+                background-color: desaturate(@brand-primary, 40%);
+            }
+
+            @media screen and (max-width: @screen-xs-max) {
+                position: static;
+            }
+            @media screen and (min-width: @screen-sm-min) {
+                background-color: @w-header-white;
+            }
+        }
+    }
+
+    &.o_dropdown_mobile_nav {
+        margin-left: 0;
+
+        > .dropdown-toggle {
+            &:after {
+                .o-position-absolute(0, 0);
+            }
+        }
+
+        .o_breadcrumb_dropdown_menu > li{
+            > a {
+                white-space: nowrap;
+                overflow: hidden;
+                text-overflow: ellipsis;
+            }
+            > a:before {
+                content: "|";
+                margin-right: 0.5em;
+            }
+            &:nth-child(1) > a:before {
+                display: none;
+            }
+            &:nth-child(2) > a:before {
+                padding-left: 0.5em;
+            }
+            &:nth-child(3) > a:before {
+                padding-left: 1em;
+            }
+        }
+    }
+}
 
 
 // Shadows
@@ -36,21 +322,27 @@
 .shadow-none {
   .box-shadow(none);
 }
-.shadow-0 {
-  .box-shadow(0 1px 4px rgba(0, 0, 0, 0.1));
+
+.deep-1 {
+    box-shadow: 0  1px  1px 0 rgba(0, 0, 0, 0.17);
+}
+.deep-2 {
+    box-shadow: 0  6px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.05);
+}
+.deep-3 {
+    box-shadow: 0 13px 25px 0 rgba(0, 0, 0, 0.1), 0 11px 7px 0 rgba(0, 0, 0, 0.09);
 }
-.shadow-1 {
-  box-shadow: 0 1.5px 4px rgba(0, 0, 0, 0.24), 0 1.5px 6px rgba(0, 0, 0, 0.12);
+.deep-4 {
+    box-shadow: 0 20px 40px 0 rgba(0, 0, 0, 0.1), 0 14px 12px 0 rgba(0, 0, 0, 0.07);
 }
-.shadow-2 {
-  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.23), 0 3px 12px rgba(0, 0, 0, 0.16);
+.deep-5 {
+    box-shadow: 0 27px 55px 0 rgba(0, 0, 0, 0.1), 0 17px 17px 0 rgba(0, 0, 0, 0.05);
 }
-.shadow-3 {
-  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.23), 0 10px 40px rgba(0, 0, 0, 0.19);
+
+// overwrite bootstrap inline forcing
+.img-responsive {
+  display: inline-block;
 }
-.shadow-4 {
-  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.22), 0 14px 56px rgba(0, 0, 0, 0.25);
+.img-responsive.center-block {
+  display: block;
 }
-.shadow-5 {
-  box-shadow: 0 15px 24px rgba(0, 0, 0, 0.22), 0 19px 76px rgba(0, 0, 0, 0.3);
-}
\ No newline at end of file
diff --git a/doc/_extensions/odoo/static/print.less b/doc/_extensions/odoo/static/print.less
new file mode 100644
index 00000000000..3e7dfc8f3bf
--- /dev/null
+++ b/doc/_extensions/odoo/static/print.less
@@ -0,0 +1,58 @@
+
+@media print {
+  body {
+
+    header, footer{
+      display: none;
+    }
+    .fadeInUp, .fadeIn{
+      .opacity(1)!important;
+      .animation(none);
+    }
+
+    #main_navbar{
+      position: relative;
+      display: block;
+      height: 100px!important;
+      #main-back {
+        display: none;
+      }
+      #main_title{
+        position: relative;
+        transform: none;
+      }
+      .navbar-main{
+        display: none!important;
+      }
+    }
+
+    main{
+      .opacity(1);
+      .animation(none);
+      aside{
+        display:none;
+      }
+      article{
+        h1, .h1 {
+          font-size: 2em;
+        }
+        h2, .h2{
+          font-size: 1.642857143em;
+        }
+        h3, .h3{
+          font-size: 1.25em;
+        }
+        p, ul, ol, table, blockquote, .alert, .doc-code, .admonition{
+          margin-top: inherit;
+          margin-bottom: inherit;
+          font-size: inherit;
+        }
+      }
+    }
+
+    .floating_action_container{
+      display: none;
+    }
+
+  } // /body
+}
\ No newline at end of file
diff --git a/doc/_extensions/odoo/static/style.css b/doc/_extensions/odoo/static/style.css
index d1802c8abfb..65ad613a94e 100644
--- a/doc/_extensions/odoo/static/style.css
+++ b/doc/_extensions/odoo/static/style.css
@@ -1,5 +1,10 @@
-@import url(https://fonts.googleapis.com/css?family=Lato:300,400,900,300italic,400italic);
-/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
+/*!
+ * Bootstrap v3.3.6 (http://getbootstrap.com)
+ * Copyright 2011-2015 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ */
+/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
+@import url(https://fonts.googleapis.com/css?family=Work+Sans:300,400,500,600,700&subset=latin,latin-ext);
 html {
   font-family: sans-serif;
   -ms-text-size-adjust: 100%;
@@ -89,7 +94,6 @@ figure {
   margin: 1em 40px;
 }
 hr {
-  -moz-box-sizing: content-box;
   box-sizing: content-box;
   height: 0;
 }
@@ -149,8 +153,6 @@ input[type="number"]::-webkit-outer-spin-button {
 }
 input[type="search"] {
   -webkit-appearance: textfield;
-  -moz-box-sizing: content-box;
-  -webkit-box-sizing: content-box;
   box-sizing: content-box;
 }
 input[type="search"]::-webkit-search-cancel-button,
@@ -229,9 +231,6 @@ th {
   h3 {
     page-break-after: avoid;
   }
-  select {
-    background: #fff !important;
-  }
   .navbar {
     display: none;
   }
@@ -254,6 +253,809 @@ th {
     border: 1px solid #ddd !important;
   }
 }
+@font-face {
+  font-family: 'Glyphicons Halflings';
+  src: url('../fonts/glyphicons-halflings-regular.eot');
+  src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
+}
+.glyphicon {
+  position: relative;
+  top: 1px;
+  display: inline-block;
+  font-family: 'Glyphicons Halflings';
+  font-style: normal;
+  font-weight: normal;
+  line-height: 1;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+.glyphicon-asterisk:before {
+  content: "\002a";
+}
+.glyphicon-plus:before {
+  content: "\002b";
+}
+.glyphicon-euro:before,
+.glyphicon-eur:before {
+  content: "\20ac";
+}
+.glyphicon-minus:before {
+  content: "\2212";
+}
+.glyphicon-cloud:before {
+  content: "\2601";
+}
+.glyphicon-envelope:before {
+  content: "\2709";
+}
+.glyphicon-pencil:before {
+  content: "\270f";
+}
+.glyphicon-glass:before {
+  content: "\e001";
+}
+.glyphicon-music:before {
+  content: "\e002";
+}
+.glyphicon-search:before {
+  content: "\e003";
+}
+.glyphicon-heart:before {
+  content: "\e005";
+}
+.glyphicon-star:before {
+  content: "\e006";
+}
+.glyphicon-star-empty:before {
+  content: "\e007";
+}
+.glyphicon-user:before {
+  content: "\e008";
+}
+.glyphicon-film:before {
+  content: "\e009";
+}
+.glyphicon-th-large:before {
+  content: "\e010";
+}
+.glyphicon-th:before {
+  content: "\e011";
+}
+.glyphicon-th-list:before {
+  content: "\e012";
+}
+.glyphicon-ok:before {
+  content: "\e013";
+}
+.glyphicon-remove:before {
+  content: "\e014";
+}
+.glyphicon-zoom-in:before {
+  content: "\e015";
+}
+.glyphicon-zoom-out:before {
+  content: "\e016";
+}
+.glyphicon-off:before {
+  content: "\e017";
+}
+.glyphicon-signal:before {
+  content: "\e018";
+}
+.glyphicon-cog:before {
+  content: "\e019";
+}
+.glyphicon-trash:before {
+  content: "\e020";
+}
+.glyphicon-home:before {
+  content: "\e021";
+}
+.glyphicon-file:before {
+  content: "\e022";
+}
+.glyphicon-time:before {
+  content: "\e023";
+}
+.glyphicon-road:before {
+  content: "\e024";
+}
+.glyphicon-download-alt:before {
+  content: "\e025";
+}
+.glyphicon-download:before {
+  content: "\e026";
+}
+.glyphicon-upload:before {
+  content: "\e027";
+}
+.glyphicon-inbox:before {
+  content: "\e028";
+}
+.glyphicon-play-circle:before {
+  content: "\e029";
+}
+.glyphicon-repeat:before {
+  content: "\e030";
+}
+.glyphicon-refresh:before {
+  content: "\e031";
+}
+.glyphicon-list-alt:before {
+  content: "\e032";
+}
+.glyphicon-lock:before {
+  content: "\e033";
+}
+.glyphicon-flag:before {
+  content: "\e034";
+}
+.glyphicon-headphones:before {
+  content: "\e035";
+}
+.glyphicon-volume-off:before {
+  content: "\e036";
+}
+.glyphicon-volume-down:before {
+  content: "\e037";
+}
+.glyphicon-volume-up:before {
+  content: "\e038";
+}
+.glyphicon-qrcode:before {
+  content: "\e039";
+}
+.glyphicon-barcode:before {
+  content: "\e040";
+}
+.glyphicon-tag:before {
+  content: "\e041";
+}
+.glyphicon-tags:before {
+  content: "\e042";
+}
+.glyphicon-book:before {
+  content: "\e043";
+}
+.glyphicon-bookmark:before {
+  content: "\e044";
+}
+.glyphicon-print:before {
+  content: "\e045";
+}
+.glyphicon-camera:before {
+  content: "\e046";
+}
+.glyphicon-font:before {
+  content: "\e047";
+}
+.glyphicon-bold:before {
+  content: "\e048";
+}
+.glyphicon-italic:before {
+  content: "\e049";
+}
+.glyphicon-text-height:before {
+  content: "\e050";
+}
+.glyphicon-text-width:before {
+  content: "\e051";
+}
+.glyphicon-align-left:before {
+  content: "\e052";
+}
+.glyphicon-align-center:before {
+  content: "\e053";
+}
+.glyphicon-align-right:before {
+  content: "\e054";
+}
+.glyphicon-align-justify:before {
+  content: "\e055";
+}
+.glyphicon-list:before {
+  content: "\e056";
+}
+.glyphicon-indent-left:before {
+  content: "\e057";
+}
+.glyphicon-indent-right:before {
+  content: "\e058";
+}
+.glyphicon-facetime-video:before {
+  content: "\e059";
+}
+.glyphicon-picture:before {
+  content: "\e060";
+}
+.glyphicon-map-marker:before {
+  content: "\e062";
+}
+.glyphicon-adjust:before {
+  content: "\e063";
+}
+.glyphicon-tint:before {
+  content: "\e064";
+}
+.glyphicon-edit:before {
+  content: "\e065";
+}
+.glyphicon-share:before {
+  content: "\e066";
+}
+.glyphicon-check:before {
+  content: "\e067";
+}
+.glyphicon-move:before {
+  content: "\e068";
+}
+.glyphicon-step-backward:before {
+  content: "\e069";
+}
+.glyphicon-fast-backward:before {
+  content: "\e070";
+}
+.glyphicon-backward:before {
+  content: "\e071";
+}
+.glyphicon-play:before {
+  content: "\e072";
+}
+.glyphicon-pause:before {
+  content: "\e073";
+}
+.glyphicon-stop:before {
+  content: "\e074";
+}
+.glyphicon-forward:before {
+  content: "\e075";
+}
+.glyphicon-fast-forward:before {
+  content: "\e076";
+}
+.glyphicon-step-forward:before {
+  content: "\e077";
+}
+.glyphicon-eject:before {
+  content: "\e078";
+}
+.glyphicon-chevron-left:before {
+  content: "\e079";
+}
+.glyphicon-chevron-right:before {
+  content: "\e080";
+}
+.glyphicon-plus-sign:before {
+  content: "\e081";
+}
+.glyphicon-minus-sign:before {
+  content: "\e082";
+}
+.glyphicon-remove-sign:before {
+  content: "\e083";
+}
+.glyphicon-ok-sign:before {
+  content: "\e084";
+}
+.glyphicon-question-sign:before {
+  content: "\e085";
+}
+.glyphicon-info-sign:before {
+  content: "\e086";
+}
+.glyphicon-screenshot:before {
+  content: "\e087";
+}
+.glyphicon-remove-circle:before {
+  content: "\e088";
+}
+.glyphicon-ok-circle:before {
+  content: "\e089";
+}
+.glyphicon-ban-circle:before {
+  content: "\e090";
+}
+.glyphicon-arrow-left:before {
+  content: "\e091";
+}
+.glyphicon-arrow-right:before {
+  content: "\e092";
+}
+.glyphicon-arrow-up:before {
+  content: "\e093";
+}
+.glyphicon-arrow-down:before {
+  content: "\e094";
+}
+.glyphicon-share-alt:before {
+  content: "\e095";
+}
+.glyphicon-resize-full:before {
+  content: "\e096";
+}
+.glyphicon-resize-small:before {
+  content: "\e097";
+}
+.glyphicon-exclamation-sign:before {
+  content: "\e101";
+}
+.glyphicon-gift:before {
+  content: "\e102";
+}
+.glyphicon-leaf:before {
+  content: "\e103";
+}
+.glyphicon-fire:before {
+  content: "\e104";
+}
+.glyphicon-eye-open:before {
+  content: "\e105";
+}
+.glyphicon-eye-close:before {
+  content: "\e106";
+}
+.glyphicon-warning-sign:before {
+  content: "\e107";
+}
+.glyphicon-plane:before {
+  content: "\e108";
+}
+.glyphicon-calendar:before {
+  content: "\e109";
+}
+.glyphicon-random:before {
+  content: "\e110";
+}
+.glyphicon-comment:before {
+  content: "\e111";
+}
+.glyphicon-magnet:before {
+  content: "\e112";
+}
+.glyphicon-chevron-up:before {
+  content: "\e113";
+}
+.glyphicon-chevron-down:before {
+  content: "\e114";
+}
+.glyphicon-retweet:before {
+  content: "\e115";
+}
+.glyphicon-shopping-cart:before {
+  content: "\e116";
+}
+.glyphicon-folder-close:before {
+  content: "\e117";
+}
+.glyphicon-folder-open:before {
+  content: "\e118";
+}
+.glyphicon-resize-vertical:before {
+  content: "\e119";
+}
+.glyphicon-resize-horizontal:before {
+  content: "\e120";
+}
+.glyphicon-hdd:before {
+  content: "\e121";
+}
+.glyphicon-bullhorn:before {
+  content: "\e122";
+}
+.glyphicon-bell:before {
+  content: "\e123";
+}
+.glyphicon-certificate:before {
+  content: "\e124";
+}
+.glyphicon-thumbs-up:before {
+  content: "\e125";
+}
+.glyphicon-thumbs-down:before {
+  content: "\e126";
+}
+.glyphicon-hand-right:before {
+  content: "\e127";
+}
+.glyphicon-hand-left:before {
+  content: "\e128";
+}
+.glyphicon-hand-up:before {
+  content: "\e129";
+}
+.glyphicon-hand-down:before {
+  content: "\e130";
+}
+.glyphicon-circle-arrow-right:before {
+  content: "\e131";
+}
+.glyphicon-circle-arrow-left:before {
+  content: "\e132";
+}
+.glyphicon-circle-arrow-up:before {
+  content: "\e133";
+}
+.glyphicon-circle-arrow-down:before {
+  content: "\e134";
+}
+.glyphicon-globe:before {
+  content: "\e135";
+}
+.glyphicon-wrench:before {
+  content: "\e136";
+}
+.glyphicon-tasks:before {
+  content: "\e137";
+}
+.glyphicon-filter:before {
+  content: "\e138";
+}
+.glyphicon-briefcase:before {
+  content: "\e139";
+}
+.glyphicon-fullscreen:before {
+  content: "\e140";
+}
+.glyphicon-dashboard:before {
+  content: "\e141";
+}
+.glyphicon-paperclip:before {
+  content: "\e142";
+}
+.glyphicon-heart-empty:before {
+  content: "\e143";
+}
+.glyphicon-link:before {
+  content: "\e144";
+}
+.glyphicon-phone:before {
+  content: "\e145";
+}
+.glyphicon-pushpin:before {
+  content: "\e146";
+}
+.glyphicon-usd:before {
+  content: "\e148";
+}
+.glyphicon-gbp:before {
+  content: "\e149";
+}
+.glyphicon-sort:before {
+  content: "\e150";
+}
+.glyphicon-sort-by-alphabet:before {
+  content: "\e151";
+}
+.glyphicon-sort-by-alphabet-alt:before {
+  content: "\e152";
+}
+.glyphicon-sort-by-order:before {
+  content: "\e153";
+}
+.glyphicon-sort-by-order-alt:before {
+  content: "\e154";
+}
+.glyphicon-sort-by-attributes:before {
+  content: "\e155";
+}
+.glyphicon-sort-by-attributes-alt:before {
+  content: "\e156";
+}
+.glyphicon-unchecked:before {
+  content: "\e157";
+}
+.glyphicon-expand:before {
+  content: "\e158";
+}
+.glyphicon-collapse-down:before {
+  content: "\e159";
+}
+.glyphicon-collapse-up:before {
+  content: "\e160";
+}
+.glyphicon-log-in:before {
+  content: "\e161";
+}
+.glyphicon-flash:before {
+  content: "\e162";
+}
+.glyphicon-log-out:before {
+  content: "\e163";
+}
+.glyphicon-new-window:before {
+  content: "\e164";
+}
+.glyphicon-record:before {
+  content: "\e165";
+}
+.glyphicon-save:before {
+  content: "\e166";
+}
+.glyphicon-open:before {
+  content: "\e167";
+}
+.glyphicon-saved:before {
+  content: "\e168";
+}
+.glyphicon-import:before {
+  content: "\e169";
+}
+.glyphicon-export:before {
+  content: "\e170";
+}
+.glyphicon-send:before {
+  content: "\e171";
+}
+.glyphicon-floppy-disk:before {
+  content: "\e172";
+}
+.glyphicon-floppy-saved:before {
+  content: "\e173";
+}
+.glyphicon-floppy-remove:before {
+  content: "\e174";
+}
+.glyphicon-floppy-save:before {
+  content: "\e175";
+}
+.glyphicon-floppy-open:before {
+  content: "\e176";
+}
+.glyphicon-credit-card:before {
+  content: "\e177";
+}
+.glyphicon-transfer:before {
+  content: "\e178";
+}
+.glyphicon-cutlery:before {
+  content: "\e179";
+}
+.glyphicon-header:before {
+  content: "\e180";
+}
+.glyphicon-compressed:before {
+  content: "\e181";
+}
+.glyphicon-earphone:before {
+  content: "\e182";
+}
+.glyphicon-phone-alt:before {
+  content: "\e183";
+}
+.glyphicon-tower:before {
+  content: "\e184";
+}
+.glyphicon-stats:before {
+  content: "\e185";
+}
+.glyphicon-sd-video:before {
+  content: "\e186";
+}
+.glyphicon-hd-video:before {
+  content: "\e187";
+}
+.glyphicon-subtitles:before {
+  content: "\e188";
+}
+.glyphicon-sound-stereo:before {
+  content: "\e189";
+}
+.glyphicon-sound-dolby:before {
+  content: "\e190";
+}
+.glyphicon-sound-5-1:before {
+  content: "\e191";
+}
+.glyphicon-sound-6-1:before {
+  content: "\e192";
+}
+.glyphicon-sound-7-1:before {
+  content: "\e193";
+}
+.glyphicon-copyright-mark:before {
+  content: "\e194";
+}
+.glyphicon-registration-mark:before {
+  content: "\e195";
+}
+.glyphicon-cloud-download:before {
+  content: "\e197";
+}
+.glyphicon-cloud-upload:before {
+  content: "\e198";
+}
+.glyphicon-tree-conifer:before {
+  content: "\e199";
+}
+.glyphicon-tree-deciduous:before {
+  content: "\e200";
+}
+.glyphicon-cd:before {
+  content: "\e201";
+}
+.glyphicon-save-file:before {
+  content: "\e202";
+}
+.glyphicon-open-file:before {
+  content: "\e203";
+}
+.glyphicon-level-up:before {
+  content: "\e204";
+}
+.glyphicon-copy:before {
+  content: "\e205";
+}
+.glyphicon-paste:before {
+  content: "\e206";
+}
+.glyphicon-alert:before {
+  content: "\e209";
+}
+.glyphicon-equalizer:before {
+  content: "\e210";
+}
+.glyphicon-king:before {
+  content: "\e211";
+}
+.glyphicon-queen:before {
+  content: "\e212";
+}
+.glyphicon-pawn:before {
+  content: "\e213";
+}
+.glyphicon-bishop:before {
+  content: "\e214";
+}
+.glyphicon-knight:before {
+  content: "\e215";
+}
+.glyphicon-baby-formula:before {
+  content: "\e216";
+}
+.glyphicon-tent:before {
+  content: "\26fa";
+}
+.glyphicon-blackboard:before {
+  content: "\e218";
+}
+.glyphicon-bed:before {
+  content: "\e219";
+}
+.glyphicon-apple:before {
+  content: "\f8ff";
+}
+.glyphicon-erase:before {
+  content: "\e221";
+}
+.glyphicon-hourglass:before {
+  content: "\231b";
+}
+.glyphicon-lamp:before {
+  content: "\e223";
+}
+.glyphicon-duplicate:before {
+  content: "\e224";
+}
+.glyphicon-piggy-bank:before {
+  content: "\e225";
+}
+.glyphicon-scissors:before {
+  content: "\e226";
+}
+.glyphicon-bitcoin:before {
+  content: "\e227";
+}
+.glyphicon-btc:before {
+  content: "\e227";
+}
+.glyphicon-xbt:before {
+  content: "\e227";
+}
+.glyphicon-yen:before {
+  content: "\00a5";
+}
+.glyphicon-jpy:before {
+  content: "\00a5";
+}
+.glyphicon-ruble:before {
+  content: "\20bd";
+}
+.glyphicon-rub:before {
+  content: "\20bd";
+}
+.glyphicon-scale:before {
+  content: "\e230";
+}
+.glyphicon-ice-lolly:before {
+  content: "\e231";
+}
+.glyphicon-ice-lolly-tasted:before {
+  content: "\e232";
+}
+.glyphicon-education:before {
+  content: "\e233";
+}
+.glyphicon-option-horizontal:before {
+  content: "\e234";
+}
+.glyphicon-option-vertical:before {
+  content: "\e235";
+}
+.glyphicon-menu-hamburger:before {
+  content: "\e236";
+}
+.glyphicon-modal-window:before {
+  content: "\e237";
+}
+.glyphicon-oil:before {
+  content: "\e238";
+}
+.glyphicon-grain:before {
+  content: "\e239";
+}
+.glyphicon-sunglasses:before {
+  content: "\e240";
+}
+.glyphicon-text-size:before {
+  content: "\e241";
+}
+.glyphicon-text-color:before {
+  content: "\e242";
+}
+.glyphicon-text-background:before {
+  content: "\e243";
+}
+.glyphicon-object-align-top:before {
+  content: "\e244";
+}
+.glyphicon-object-align-bottom:before {
+  content: "\e245";
+}
+.glyphicon-object-align-horizontal:before {
+  content: "\e246";
+}
+.glyphicon-object-align-left:before {
+  content: "\e247";
+}
+.glyphicon-object-align-vertical:before {
+  content: "\e248";
+}
+.glyphicon-object-align-right:before {
+  content: "\e249";
+}
+.glyphicon-triangle-right:before {
+  content: "\e250";
+}
+.glyphicon-triangle-left:before {
+  content: "\e251";
+}
+.glyphicon-triangle-bottom:before {
+  content: "\e252";
+}
+.glyphicon-triangle-top:before {
+  content: "\e253";
+}
+.glyphicon-console:before {
+  content: "\e254";
+}
+.glyphicon-superscript:before {
+  content: "\e255";
+}
+.glyphicon-subscript:before {
+  content: "\e256";
+}
+.glyphicon-menu-left:before {
+  content: "\e257";
+}
+.glyphicon-menu-right:before {
+  content: "\e258";
+}
+.glyphicon-menu-down:before {
+  content: "\e259";
+}
+.glyphicon-menu-up:before {
+  content: "\e260";
+}
 * {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
@@ -270,11 +1072,11 @@ html {
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }
 body {
-  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-  font-size: 16px;
+  font-family: -apple-system, BlinkMacSystemFont, Helvetica, "Helvetica Neue", Arial, sans-serif;
+  font-size: 15px;
   line-height: 1.42857143;
-  color: #232b41;
-  background-color: #e5e5e5;
+  color: #666c75;
+  background-color: #f9f9f9;
 }
 input,
 button,
@@ -285,13 +1087,13 @@ textarea {
   line-height: inherit;
 }
 a {
-  color: #198c75;
+  color: #875a7b;
   text-decoration: none;
 }
 a:hover,
 a:focus {
-  color: #393f4f;
-  text-decoration: underline;
+  color: #926485;
+  text-decoration: none;
 }
 a:focus {
   outline: thin dotted;
@@ -312,6 +1114,7 @@ img {
   display: block;
   max-width: 100%;
   height: auto;
+  display: inline-block;
 }
 .img-rounded {
   border-radius: 6px;
@@ -319,7 +1122,7 @@ img {
 .img-thumbnail {
   padding: 4px;
   line-height: 1.42857143;
-  background-color: #e5e5e5;
+  background-color: #f9f9f9;
   border: 1px solid #dddddd;
   border-radius: 4px;
   -webkit-transition: all 0.2s ease-in-out;
@@ -333,10 +1136,10 @@ img {
   border-radius: 50%;
 }
 hr {
-  margin-top: 22px;
-  margin-bottom: 22px;
+  margin-top: 21px;
+  margin-bottom: 21px;
   border: 0;
-  border-top: 1px solid #eeeeee;
+  border-top: 1px solid #f2f2f2;
 }
 .sr-only {
   position: absolute;
@@ -372,10 +1175,10 @@ h6,
 .h4,
 .h5,
 .h6 {
-  font-family: Lato, sans-serif;
+  font-family: "Work Sans", sans-serif;
   font-weight: 300;
   line-height: 1.1;
-  color: #393f4f;
+  color: #21313a;
 }
 h1 small,
 h2 small,
@@ -403,7 +1206,7 @@ h6 .small,
 .h6 .small {
   font-weight: normal;
   line-height: 1;
-  color: #777777;
+  color: #21313a;
 }
 h1,
 .h1,
@@ -411,8 +1214,8 @@ h2,
 .h2,
 h3,
 .h3 {
-  margin-top: 22px;
-  margin-bottom: 11px;
+  margin-top: 21px;
+  margin-bottom: 10.5px;
 }
 h1 small,
 .h1 small,
@@ -434,8 +1237,8 @@ h5,
 .h5,
 h6,
 .h6 {
-  margin-top: 11px;
-  margin-bottom: 11px;
+  margin-top: 10.5px;
+  margin-bottom: 10.5px;
 }
 h4 small,
 .h4 small,
@@ -453,45 +1256,45 @@ h6 .small,
 }
 h1,
 .h1 {
-  font-size: 41px;
+  font-size: 39px;
 }
 h2,
 .h2 {
-  font-size: 34px;
+  font-size: 32px;
 }
 h3,
 .h3 {
-  font-size: 28px;
+  font-size: 26px;
 }
 h4,
 .h4 {
-  font-size: 20px;
+  font-size: 19px;
 }
 h5,
 .h5 {
-  font-size: 16px;
+  font-size: 15px;
 }
 h6,
 .h6 {
-  font-size: 14px;
+  font-size: 13px;
 }
 p {
-  margin: 0 0 11px;
+  margin: 0 0 10.5px;
 }
 .lead {
-  margin-bottom: 22px;
-  font-size: 18px;
+  margin-bottom: 21px;
+  font-size: 17px;
   font-weight: 300;
   line-height: 1.4;
 }
 @media (min-width: 768px) {
   .lead {
-    font-size: 24px;
+    font-size: 22.5px;
   }
 }
 small,
 .small {
-  font-size: 87%;
+  font-size: 86%;
 }
 mark,
 .mark {
@@ -523,78 +1326,88 @@ mark,
   text-transform: capitalize;
 }
 .text-muted {
-  color: #777777;
+  color: #888888;
 }
 .text-primary {
-  color: #337ab7;
+  color: #21b799;
 }
-a.text-primary:hover {
-  color: #286090;
+a.text-primary:hover,
+a.text-primary:focus {
+  color: #198c75;
 }
 .text-success {
   color: #3c763d;
 }
-a.text-success:hover {
+a.text-success:hover,
+a.text-success:focus {
   color: #2b542c;
 }
 .text-info {
   color: #31708f;
 }
-a.text-info:hover {
+a.text-info:hover,
+a.text-info:focus {
   color: #245269;
 }
 .text-warning {
   color: #8a6d3b;
 }
-a.text-warning:hover {
+a.text-warning:hover,
+a.text-warning:focus {
   color: #66512c;
 }
 .text-danger {
   color: #a94442;
 }
-a.text-danger:hover {
+a.text-danger:hover,
+a.text-danger:focus {
   color: #843534;
 }
 .bg-primary {
   color: #fff;
-  background-color: #337ab7;
+  background-color: #21b799;
 }
-a.bg-primary:hover {
-  background-color: #286090;
+a.bg-primary:hover,
+a.bg-primary:focus {
+  background-color: #198c75;
 }
 .bg-success {
   background-color: #dff0d8;
 }
-a.bg-success:hover {
+a.bg-success:hover,
+a.bg-success:focus {
   background-color: #c1e2b3;
 }
 .bg-info {
   background-color: #d9edf7;
 }
-a.bg-info:hover {
+a.bg-info:hover,
+a.bg-info:focus {
   background-color: #afd9ee;
 }
 .bg-warning {
   background-color: #fcf8e3;
 }
-a.bg-warning:hover {
+a.bg-warning:hover,
+a.bg-warning:focus {
   background-color: #f7ecb5;
 }
 .bg-danger {
   background-color: #f2dede;
 }
-a.bg-danger:hover {
+a.bg-danger:hover,
+a.bg-danger:focus {
   background-color: #e4b9b9;
 }
 .page-header {
-  padding-bottom: 10px;
-  margin: 44px 0 22px;
-  border-bottom: 1px solid #eeeeee;
+  padding-bottom: 9.5px;
+  margin: 42px 0 21px;
+  border-bottom: 1px solid #f2f2f2;
 }
 ul,
 ol {
   margin-top: 0;
-  margin-bottom: 11px;
+  margin-bottom: 10.5px;
 }
 ul ul,
 ol ul,
@@ -618,7 +1431,7 @@ ol ol {
 }
 dl {
   margin-top: 0;
-  margin-bottom: 22px;
+  margin-bottom: 21px;
 }
 dt,
 dd {
@@ -647,17 +1460,17 @@ dd {
 abbr[title],
 abbr[data-original-title] {
   cursor: help;
-  border-bottom: 1px dotted #777777;
+  border-bottom: 1px dotted #dcddde;
 }
 .initialism {
   font-size: 90%;
   text-transform: uppercase;
 }
 blockquote {
-  padding: 11px 22px;
-  margin: 0 0 22px;
-  font-size: 20px;
-  border-left: 5px solid #eeeeee;
+  padding: 10.5px 21px;
+  margin: 0 0 21px;
+  font-size: 18.75px;
+  border-left: 5px solid #f2f2f2;
 }
 blockquote p:last-child,
 blockquote ul:last-child,
@@ -670,7 +1483,7 @@ blockquote .small {
   display: block;
   font-size: 80%;
   line-height: 1.42857143;
-  color: #777777;
+  color: #dcddde;
 }
 blockquote footer:before,
 blockquote small:before,
@@ -681,7 +1494,7 @@ blockquote .small:before {
 blockquote.pull-right {
   padding-right: 15px;
   padding-left: 0;
-  border-right: 5px solid #eeeeee;
+  border-right: 5px solid #f2f2f2;
   border-left: 0;
   text-align: right;
 }
@@ -702,7 +1515,7 @@ blockquote.pull-right .small:after {
   content: '\00A0 \2014';
 }
 address {
-  margin-bottom: 22px;
+  margin-bottom: 21px;
   font-style: normal;
   line-height: 1.42857143;
 }
@@ -735,13 +1548,13 @@ kbd kbd {
 }
 pre {
   display: block;
-  padding: 10.5px;
-  margin: 0 0 11px;
-  font-size: 15px;
+  padding: 10px;
+  margin: 0 0 10.5px;
+  font-size: 14px;
   line-height: 1.42857143;
   word-break: break-all;
   word-wrap: break-word;
-  color: #333333;
+  color: #6b6d70;
   background-color: #f5f5f5;
   border: 1px solid #cccccc;
   border-radius: 4px;
@@ -1431,7 +2244,7 @@ table {
 caption {
   padding-top: 8px;
   padding-bottom: 8px;
-  color: #777777;
+  color: #888888;
   text-align: left;
 }
 th {
@@ -1440,7 +2253,7 @@ th {
 .table {
   width: 100%;
   max-width: 100%;
-  margin-bottom: 22px;
+  margin-bottom: 21px;
 }
 .table > thead > tr > th,
 .table > tbody > tr > th,
@@ -1469,7 +2282,7 @@ th {
   border-top: 2px solid #dddddd;
 }
 .table .table {
-  background-color: #e5e5e5;
+  background-color: #f9f9f9;
 }
 .table-condensed > thead > tr > th,
 .table-condensed > tbody > tr > th,
@@ -1623,7 +2436,7 @@ table th[class*="col-"] {
 @media screen and (max-width: 767px) {
   .table-responsive {
     width: 100%;
-    margin-bottom: 16.5px;
+    margin-bottom: 15.75px;
     overflow-y: hidden;
     -ms-overflow-style: -ms-autohiding-scrollbar;
     border: 1px solid #dddddd;
@@ -1675,10 +2488,10 @@ legend {
   display: block;
   width: 100%;
   padding: 0;
-  margin-bottom: 22px;
-  font-size: 24px;
+  margin-bottom: 21px;
+  font-size: 22.5px;
   line-height: inherit;
-  color: #333333;
+  color: #6b6d70;
   border: 0;
   border-bottom: 1px solid #e5e5e5;
 }
@@ -1720,18 +2533,18 @@ input[type="checkbox"]:focus {
 output {
   display: block;
   padding-top: 7px;
-  font-size: 16px;
+  font-size: 15px;
   line-height: 1.42857143;
-  color: #555555;
+  color: #888888;
 }
 .form-control {
   display: block;
   width: 100%;
-  height: 36px;
+  height: 35px;
   padding: 6px 12px;
-  font-size: 16px;
+  font-size: 15px;
   line-height: 1.42857143;
-  color: #555555;
+  color: #888888;
   background-color: #ffffff;
   background-image: none;
   border: 1px solid #cccccc;
@@ -1758,10 +2571,14 @@ output {
 .form-control::-webkit-input-placeholder {
   color: #999999;
 }
+.form-control::-ms-expand {
+  border: 0;
+  background-color: transparent;
+}
 .form-control[disabled],
 .form-control[readonly],
 fieldset[disabled] .form-control {
-  background-color: #eeeeee;
+  background-color: #f2f2f2;
   opacity: 1;
 }
 .form-control[disabled],
@@ -1775,11 +2592,11 @@ input[type="search"] {
   -webkit-appearance: none;
 }
 @media screen and (-webkit-min-device-pixel-ratio: 0) {
-  input[type="date"],
-  input[type="time"],
-  input[type="datetime-local"],
-  input[type="month"] {
-    line-height: 36px;
+  input[type="date"].form-control,
+  input[type="time"].form-control,
+  input[type="datetime-local"].form-control,
+  input[type="month"].form-control {
+    line-height: 35px;
   }
   input[type="date"].input-sm,
   input[type="time"].input-sm,
@@ -1789,7 +2606,7 @@ input[type="search"] {
   .input-group-sm input[type="time"],
   .input-group-sm input[type="datetime-local"],
   .input-group-sm input[type="month"] {
-    line-height: 33px;
+    line-height: 31px;
   }
   input[type="date"].input-lg,
   input[type="time"].input-lg,
@@ -1799,7 +2616,7 @@ input[type="search"] {
   .input-group-lg input[type="time"],
   .input-group-lg input[type="datetime-local"],
   .input-group-lg input[type="month"] {
-    line-height: 49px;
+    line-height: 48px;
   }
 }
 .form-group {
@@ -1814,7 +2631,7 @@ input[type="search"] {
 }
 .radio label,
 .checkbox label {
-  min-height: 22px;
+  min-height: 21px;
   padding-left: 20px;
   margin-bottom: 0;
   font-weight: normal;
@@ -1871,7 +2688,7 @@ fieldset[disabled] .checkbox label {
   padding-top: 7px;
   padding-bottom: 7px;
   margin-bottom: 0;
-  min-height: 38px;
+  min-height: 36px;
 }
 .form-control-static.input-lg,
 .form-control-static.input-sm {
@@ -1879,84 +2696,84 @@ fieldset[disabled] .checkbox label {
   padding-right: 0;
 }
 .input-sm {
-  height: 33px;
+  height: 31px;
   padding: 5px 10px;
-  font-size: 14px;
+  font-size: 13px;
   line-height: 1.5;
   border-radius: 3px;
 }
 select.input-sm {
-  height: 33px;
-  line-height: 33px;
+  height: 31px;
+  line-height: 31px;
 }
 textarea.input-sm,
 select[multiple].input-sm {
   height: auto;
 }
 .form-group-sm .form-control {
-  height: 33px;
+  height: 31px;
   padding: 5px 10px;
-  font-size: 14px;
+  font-size: 13px;
   line-height: 1.5;
   border-radius: 3px;
 }
-select.form-group-sm .form-control {
-  height: 33px;
-  line-height: 33px;
+.form-group-sm select.form-control {
+  height: 31px;
+  line-height: 31px;
 }
-textarea.form-group-sm .form-control,
-select[multiple].form-group-sm .form-control {
+.form-group-sm textarea.form-control,
+.form-group-sm select[multiple].form-control {
   height: auto;
 }
 .form-group-sm .form-control-static {
-  height: 33px;
-  padding: 5px 10px;
-  font-size: 14px;
+  height: 31px;
+  min-height: 34px;
+  padding: 6px 10px;
+  font-size: 13px;
   line-height: 1.5;
-  min-height: 36px;
 }
 .input-lg {
-  height: 49px;
+  height: 48px;
   padding: 10px 16px;
-  font-size: 20px;
+  font-size: 19px;
   line-height: 1.3333333;
   border-radius: 6px;
 }
 select.input-lg {
-  height: 49px;
-  line-height: 49px;
+  height: 48px;
+  line-height: 48px;
 }
 textarea.input-lg,
 select[multiple].input-lg {
   height: auto;
 }
 .form-group-lg .form-control {
-  height: 49px;
+  height: 48px;
   padding: 10px 16px;
-  font-size: 20px;
+  font-size: 19px;
   line-height: 1.3333333;
   border-radius: 6px;
 }
-select.form-group-lg .form-control {
-  height: 49px;
-  line-height: 49px;
+.form-group-lg select.form-control {
+  height: 48px;
+  line-height: 48px;
 }
-textarea.form-group-lg .form-control,
-select[multiple].form-group-lg .form-control {
+.form-group-lg textarea.form-control,
+.form-group-lg select[multiple].form-control {
   height: auto;
 }
 .form-group-lg .form-control-static {
-  height: 49px;
-  padding: 10px 16px;
-  font-size: 20px;
+  height: 48px;
+  min-height: 40px;
+  padding: 11px 16px;
+  font-size: 19px;
   line-height: 1.3333333;
-  min-height: 42px;
 }
 .has-feedback {
   position: relative;
 }
 .has-feedback .form-control {
-  padding-right: 45px;
+  padding-right: 43.75px;
 }
 .form-control-feedback {
   position: absolute;
@@ -1964,21 +2781,25 @@ select[multiple].form-group-lg .form-control {
   right: 0;
   z-index: 2;
   display: block;
-  width: 36px;
-  height: 36px;
-  line-height: 36px;
+  width: 35px;
+  height: 35px;
+  line-height: 35px;
   text-align: center;
   pointer-events: none;
 }
-.input-lg + .form-control-feedback {
-  width: 49px;
-  height: 49px;
-  line-height: 49px;
+.input-lg + .form-control-feedback,
+.input-group-lg + .form-control-feedback,
+.form-group-lg .form-control + .form-control-feedback {
+  width: 48px;
+  height: 48px;
+  line-height: 48px;
 }
-.input-sm + .form-control-feedback {
-  width: 33px;
-  height: 33px;
-  line-height: 33px;
+.input-sm + .form-control-feedback,
+.input-group-sm + .form-control-feedback,
+.form-group-sm .form-control + .form-control-feedback {
+  width: 31px;
+  height: 31px;
+  line-height: 31px;
 }
 .has-success .help-block,
 .has-success .control-label,
@@ -2071,7 +2892,7 @@ select[multiple].form-group-lg .form-control {
   color: #a94442;
 }
 .has-feedback label ~ .form-control-feedback {
-  top: 27px;
+  top: 26px;
 }
 .has-feedback label.sr-only ~ .form-control-feedback {
   top: 0;
@@ -2080,7 +2901,7 @@ select[multiple].form-group-lg .form-control {
   display: block;
   margin-top: 5px;
   margin-bottom: 10px;
-  color: #506294;
+  color: #a7acb3;
 }
 @media (min-width: 768px) {
   .form-inline .form-group {
@@ -2142,7 +2963,7 @@ select[multiple].form-group-lg .form-control {
 }
 .form-horizontal .radio,
 .form-horizontal .checkbox {
-  min-height: 29px;
+  min-height: 28px;
 }
 .form-horizontal .form-group {
   margin-left: -15px;
@@ -2160,12 +2981,14 @@ select[multiple].form-group-lg .form-control {
 }
 @media (min-width: 768px) {
   .form-horizontal .form-group-lg .control-label {
-    padding-top: 14.333333px;
+    padding-top: 11px;
+    font-size: 19px;
   }
 }
 @media (min-width: 768px) {
   .form-horizontal .form-group-sm .control-label {
     padding-top: 6px;
+    font-size: 13px;
   }
 }
 .btn {
@@ -2180,7 +3003,7 @@ select[multiple].form-group-lg .form-control {
   border: 1px solid transparent;
   white-space: nowrap;
   padding: 6px 12px;
-  font-size: 16px;
+  font-size: 15px;
   line-height: 1.42857143;
   border-radius: 4px;
   -webkit-user-select: none;
@@ -2215,20 +3038,31 @@ select[multiple].form-group-lg .form-control {
 .btn[disabled],
 fieldset[disabled] .btn {
   cursor: not-allowed;
-  pointer-events: none;
   opacity: 0.65;
   filter: alpha(opacity=65);
   -webkit-box-shadow: none;
   box-shadow: none;
 }
+a.btn.disabled,
+fieldset[disabled] a.btn {
+  pointer-events: none;
+}
 .btn-default {
   color: #333333;
   background-color: #ffffff;
   border-color: #cccccc;
 }
-.btn-default:hover,
 .btn-default:focus,
-.btn-default.focus,
+.btn-default.focus {
+  color: #333333;
+  background-color: #e6e6e6;
+  border-color: #8c8c8c;
+}
+.btn-default:hover {
+  color: #333333;
+  background-color: #e6e6e6;
+  border-color: #adadad;
+}
 .btn-default:active,
 .btn-default.active,
 .open > .dropdown-toggle.btn-default {
@@ -2236,14 +3070,24 @@ fieldset[disabled] .btn {
   background-color: #e6e6e6;
   border-color: #adadad;
 }
+.btn-default:active:hover,
+.btn-default.active:hover,
+.open > .dropdown-toggle.btn-default:hover,
+.btn-default:active:focus,
+.btn-default.active:focus,
+.open > .dropdown-toggle.btn-default:focus,
+.btn-default:active.focus,
+.btn-default.active.focus,
+.open > .dropdown-toggle.btn-default.focus {
+  color: #333333;
+  background-color: #d4d4d4;
+  border-color: #8c8c8c;
+}
 .btn-default:active,
 .btn-default.active,
 .open > .dropdown-toggle.btn-default {
   background-image: none;
 }
-.btn-default.disabled,
-.btn-default[disabled],
-fieldset[disabled] .btn-default,
 .btn-default.disabled:hover,
 .btn-default[disabled]:hover,
 fieldset[disabled] .btn-default:hover,
@@ -2252,13 +3096,7 @@ fieldset[disabled] .btn-default:hover,
 fieldset[disabled] .btn-default:focus,
 .btn-default.disabled.focus,
 .btn-default[disabled].focus,
-fieldset[disabled] .btn-default.focus,
-.btn-default.disabled:active,
-.btn-default[disabled]:active,
-fieldset[disabled] .btn-default:active,
-.btn-default.disabled.active,
-.btn-default[disabled].active,
-fieldset[disabled] .btn-default.active {
+fieldset[disabled] .btn-default.focus {
   background-color: #ffffff;
   border-color: #cccccc;
 }
@@ -2268,27 +3106,45 @@ fieldset[disabled] .btn-default.active {
 }
 .btn-primary {
   color: #ffffff;
-  background-color: #337ab7;
-  border-color: #2e6da4;
+  background-color: #21b799;
+  border-color: #1da187;
 }
-.btn-primary:hover,
 .btn-primary:focus,
-.btn-primary.focus,
+.btn-primary.focus {
+  color: #ffffff;
+  background-color: #198c75;
+  border-color: #0a352d;
+}
+.btn-primary:hover {
+  color: #ffffff;
+  background-color: #198c75;
+  border-color: #146e5c;
+}
 .btn-primary:active,
 .btn-primary.active,
 .open > .dropdown-toggle.btn-primary {
   color: #ffffff;
-  background-color: #286090;
-  border-color: #204d74;
+  background-color: #198c75;
+  border-color: #146e5c;
+}
+.btn-primary:active:hover,
+.btn-primary.active:hover,
+.open > .dropdown-toggle.btn-primary:hover,
+.btn-primary:active:focus,
+.btn-primary.active:focus,
+.open > .dropdown-toggle.btn-primary:focus,
+.btn-primary:active.focus,
+.btn-primary.active.focus,
+.open > .dropdown-toggle.btn-primary.focus {
+  color: #ffffff;
+  background-color: #146e5c;
+  border-color: #0a352d;
 }
 .btn-primary:active,
 .btn-primary.active,
 .open > .dropdown-toggle.btn-primary {
   background-image: none;
 }
-.btn-primary.disabled,
-.btn-primary[disabled],
-fieldset[disabled] .btn-primary,
 .btn-primary.disabled:hover,
 .btn-primary[disabled]:hover,
 fieldset[disabled] .btn-primary:hover,
@@ -2297,18 +3153,12 @@ fieldset[disabled] .btn-primary:hover,
 fieldset[disabled] .btn-primary:focus,
 .btn-primary.disabled.focus,
 .btn-primary[disabled].focus,
-fieldset[disabled] .btn-primary.focus,
-.btn-primary.disabled:active,
-.btn-primary[disabled]:active,
-fieldset[disabled] .btn-primary:active,
-.btn-primary.disabled.active,
-.btn-primary[disabled].active,
-fieldset[disabled] .btn-primary.active {
-  background-color: #337ab7;
-  border-color: #2e6da4;
+fieldset[disabled] .btn-primary.focus {
+  background-color: #21b799;
+  border-color: #1da187;
 }
 .btn-primary .badge {
-  color: #337ab7;
+  color: #21b799;
   background-color: #ffffff;
 }
 .btn-success {
@@ -2316,9 +3166,17 @@ fieldset[disabled] .btn-primary.active {
   background-color: #50af51;
   border-color: #489e49;
 }
-.btn-success:hover,
 .btn-success:focus,
-.btn-success.focus,
+.btn-success.focus {
+  color: #ffffff;
+  background-color: #408c41;
+  border-color: #204620;
+}
+.btn-success:hover {
+  color: #ffffff;
+  background-color: #408c41;
+  border-color: #357435;
+}
 .btn-success:active,
 .btn-success.active,
 .open > .dropdown-toggle.btn-success {
@@ -2326,14 +3184,24 @@ fieldset[disabled] .btn-primary.active {
   background-color: #408c41;
   border-color: #357435;
 }
+.btn-success:active:hover,
+.btn-success.active:hover,
+.open > .dropdown-toggle.btn-success:hover,
+.btn-success:active:focus,
+.btn-success.active:focus,
+.open > .dropdown-toggle.btn-success:focus,
+.btn-success:active.focus,
+.btn-success.active.focus,
+.open > .dropdown-toggle.btn-success.focus {
+  color: #ffffff;
+  background-color: #357335;
+  border-color: #204620;
+}
 .btn-success:active,
 .btn-success.active,
 .open > .dropdown-toggle.btn-success {
   background-image: none;
 }
-.btn-success.disabled,
-.btn-success[disabled],
-fieldset[disabled] .btn-success,
 .btn-success.disabled:hover,
 .btn-success[disabled]:hover,
 fieldset[disabled] .btn-success:hover,
@@ -2342,13 +3210,7 @@ fieldset[disabled] .btn-success:hover,
 fieldset[disabled] .btn-success:focus,
 .btn-success.disabled.focus,
 .btn-success[disabled].focus,
-fieldset[disabled] .btn-success.focus,
-.btn-success.disabled:active,
-.btn-success[disabled]:active,
-fieldset[disabled] .btn-success:active,
-.btn-success.disabled.active,
-.btn-success[disabled].active,
-fieldset[disabled] .btn-success.active {
+fieldset[disabled] .btn-success.focus {
   background-color: #50af51;
   border-color: #489e49;
 }
@@ -2361,9 +3223,17 @@ fieldset[disabled] .btn-success.active {
   background-color: #4b9eb6;
   border-color: #438fa5;
 }
-.btn-info:hover,
 .btn-info:focus,
-.btn-info.focus,
+.btn-info.focus {
+  color: #ffffff;
+  background-color: #3b7f93;
+  border-color: #1e404a;
+}
+.btn-info:hover {
+  color: #ffffff;
+  background-color: #3b7f93;
+  border-color: #316979;
+}
 .btn-info:active,
 .btn-info.active,
 .open > .dropdown-toggle.btn-info {
@@ -2371,14 +3241,24 @@ fieldset[disabled] .btn-success.active {
   background-color: #3b7f93;
   border-color: #316979;
 }
+.btn-info:active:hover,
+.btn-info.active:hover,
+.open > .dropdown-toggle.btn-info:hover,
+.btn-info:active:focus,
+.btn-info.active:focus,
+.open > .dropdown-toggle.btn-info:focus,
+.btn-info:active.focus,
+.btn-info.active.focus,
+.open > .dropdown-toggle.btn-info.focus {
+  color: #ffffff;
+  background-color: #316979;
+  border-color: #1e404a;
+}
 .btn-info:active,
 .btn-info.active,
 .open > .dropdown-toggle.btn-info {
   background-image: none;
 }
-.btn-info.disabled,
-.btn-info[disabled],
-fieldset[disabled] .btn-info,
 .btn-info.disabled:hover,
 .btn-info[disabled]:hover,
 fieldset[disabled] .btn-info:hover,
@@ -2387,13 +3267,7 @@ fieldset[disabled] .btn-info:hover,
 fieldset[disabled] .btn-info:focus,
 .btn-info.disabled.focus,
 .btn-info[disabled].focus,
-fieldset[disabled] .btn-info.focus,
-.btn-info.disabled:active,
-.btn-info[disabled]:active,
-fieldset[disabled] .btn-info:active,
-.btn-info.disabled.active,
-.btn-info[disabled].active,
-fieldset[disabled] .btn-info.active {
+fieldset[disabled] .btn-info.focus {
   background-color: #4b9eb6;
   border-color: #438fa5;
 }
@@ -2406,9 +3280,17 @@ fieldset[disabled] .btn-info.active {
   background-color: #f0ad4e;
   border-color: #eea236;
 }
-.btn-warning:hover,
 .btn-warning:focus,
-.btn-warning.focus,
+.btn-warning.focus {
+  color: #ffffff;
+  background-color: #ec971f;
+  border-color: #985f0d;
+}
+.btn-warning:hover {
+  color: #ffffff;
+  background-color: #ec971f;
+  border-color: #d58512;
+}
 .btn-warning:active,
 .btn-warning.active,
 .open > .dropdown-toggle.btn-warning {
@@ -2416,14 +3298,24 @@ fieldset[disabled] .btn-info.active {
   background-color: #ec971f;
   border-color: #d58512;
 }
+.btn-warning:active:hover,
+.btn-warning.active:hover,
+.open > .dropdown-toggle.btn-warning:hover,
+.btn-warning:active:focus,
+.btn-warning.active:focus,
+.open > .dropdown-toggle.btn-warning:focus,
+.btn-warning:active.focus,
+.btn-warning.active.focus,
+.open > .dropdown-toggle.btn-warning.focus {
+  color: #ffffff;
+  background-color: #d58512;
+  border-color: #985f0d;
+}
 .btn-warning:active,
 .btn-warning.active,
 .open > .dropdown-toggle.btn-warning {
   background-image: none;
 }
-.btn-warning.disabled,
-.btn-warning[disabled],
-fieldset[disabled] .btn-warning,
 .btn-warning.disabled:hover,
 .btn-warning[disabled]:hover,
 fieldset[disabled] .btn-warning:hover,
@@ -2432,13 +3324,7 @@ fieldset[disabled] .btn-warning:hover,
 fieldset[disabled] .btn-warning:focus,
 .btn-warning.disabled.focus,
 .btn-warning[disabled].focus,
-fieldset[disabled] .btn-warning.focus,
-.btn-warning.disabled:active,
-.btn-warning[disabled]:active,
-fieldset[disabled] .btn-warning:active,
-.btn-warning.disabled.active,
-.btn-warning[disabled].active,
-fieldset[disabled] .btn-warning.active {
+fieldset[disabled] .btn-warning.focus {
   background-color: #f0ad4e;
   border-color: #eea236;
 }
@@ -2451,9 +3337,17 @@ fieldset[disabled] .btn-warning.active {
   background-color: #d9534f;
   border-color: #d43f3a;
 }
-.btn-danger:hover,
 .btn-danger:focus,
-.btn-danger.focus,
+.btn-danger.focus {
+  color: #ffffff;
+  background-color: #c9302c;
+  border-color: #761c19;
+}
+.btn-danger:hover {
+  color: #ffffff;
+  background-color: #c9302c;
+  border-color: #ac2925;
+}
 .btn-danger:active,
 .btn-danger.active,
 .open > .dropdown-toggle.btn-danger {
@@ -2461,14 +3355,24 @@ fieldset[disabled] .btn-warning.active {
   background-color: #c9302c;
   border-color: #ac2925;
 }
+.btn-danger:active:hover,
+.btn-danger.active:hover,
+.open > .dropdown-toggle.btn-danger:hover,
+.btn-danger:active:focus,
+.btn-danger.active:focus,
+.open > .dropdown-toggle.btn-danger:focus,
+.btn-danger:active.focus,
+.btn-danger.active.focus,
+.open > .dropdown-toggle.btn-danger.focus {
+  color: #ffffff;
+  background-color: #ac2925;
+  border-color: #761c19;
+}
 .btn-danger:active,
 .btn-danger.active,
 .open > .dropdown-toggle.btn-danger {
   background-image: none;
 }
-.btn-danger.disabled,
-.btn-danger[disabled],
-fieldset[disabled] .btn-danger,
 .btn-danger.disabled:hover,
 .btn-danger[disabled]:hover,
 fieldset[disabled] .btn-danger:hover,
@@ -2477,13 +3381,7 @@ fieldset[disabled] .btn-danger:hover,
 fieldset[disabled] .btn-danger:focus,
 .btn-danger.disabled.focus,
 .btn-danger[disabled].focus,
-fieldset[disabled] .btn-danger.focus,
-.btn-danger.disabled:active,
-.btn-danger[disabled]:active,
-fieldset[disabled] .btn-danger:active,
-.btn-danger.disabled.active,
-.btn-danger[disabled].active,
-fieldset[disabled] .btn-danger.active {
+fieldset[disabled] .btn-danger.focus {
   background-color: #d9534f;
   border-color: #d43f3a;
 }
@@ -2492,7 +3390,7 @@ fieldset[disabled] .btn-danger.active {
   background-color: #ffffff;
 }
 .btn-link {
-  color: #198c75;
+  color: #875a7b;
   font-weight: normal;
   border-radius: 0;
 }
@@ -2513,35 +3411,35 @@ fieldset[disabled] .btn-link {
 }
 .btn-link:hover,
 .btn-link:focus {
-  color: #393f4f;
-  text-decoration: underline;
+  color: #926485;
+  text-decoration: none;
   background-color: transparent;
 }
 .btn-link[disabled]:hover,
 fieldset[disabled] .btn-link:hover,
 .btn-link[disabled]:focus,
 fieldset[disabled] .btn-link:focus {
-  color: #777777;
+  color: #dcddde;
   text-decoration: none;
 }
 .btn-lg,
 .btn-group-lg > .btn {
   padding: 10px 16px;
-  font-size: 20px;
+  font-size: 19px;
   line-height: 1.3333333;
   border-radius: 6px;
 }
 .btn-sm,
 .btn-group-sm > .btn {
   padding: 5px 10px;
-  font-size: 14px;
+  font-size: 13px;
   line-height: 1.5;
   border-radius: 3px;
 }
 .btn-xs,
 .btn-group-xs > .btn {
   padding: 1px 5px;
-  font-size: 14px;
+  font-size: 13px;
   line-height: 1.5;
   border-radius: 3px;
 }
@@ -2596,6 +3494,7 @@ tbody.collapse.in {
   margin-left: 2px;
   vertical-align: middle;
   border-top: 4px dashed;
+  border-top: 4px solid \9;
   border-right: 4px solid transparent;
   border-left: 4px solid transparent;
 }
@@ -2617,7 +3516,7 @@ tbody.collapse.in {
   padding: 5px 0;
   margin: 2px 0 0;
   list-style: none;
-  font-size: 16px;
+  font-size: 15px;
   text-align: left;
   background-color: #ffffff;
   border: 1px solid #cccccc;
@@ -2633,7 +3532,7 @@ tbody.collapse.in {
 }
 .dropdown-menu .divider {
   height: 1px;
-  margin: 10px 0;
+  margin: 9.5px 0;
   overflow: hidden;
   background-color: #e5e5e5;
 }
@@ -2643,13 +3542,13 @@ tbody.collapse.in {
   clear: both;
   font-weight: normal;
   line-height: 1.42857143;
-  color: #333333;
+  color: #6b6d70;
   white-space: nowrap;
 }
 .dropdown-menu > li > a:hover,
 .dropdown-menu > li > a:focus {
   text-decoration: none;
-  color: #262626;
+  color: #5f6063;
   background-color: #f5f5f5;
 }
 .dropdown-menu > .active > a,
@@ -2658,12 +3557,12 @@ tbody.collapse.in {
   color: #ffffff;
   text-decoration: none;
   outline: 0;
-  background-color: #337ab7;
+  background-color: #21b799;
 }
 .dropdown-menu > .disabled > a,
 .dropdown-menu > .disabled > a:hover,
 .dropdown-menu > .disabled > a:focus {
-  color: #777777;
+  color: #dcddde;
 }
 .dropdown-menu > .disabled > a:hover,
 .dropdown-menu > .disabled > a:focus {
@@ -2690,9 +3589,9 @@ tbody.collapse.in {
 .dropdown-header {
   display: block;
   padding: 3px 20px;
-  font-size: 14px;
+  font-size: 13px;
   line-height: 1.42857143;
-  color: #777777;
+  color: #dcddde;
   white-space: nowrap;
 }
 .dropdown-backdrop {
@@ -2710,7 +3609,8 @@ tbody.collapse.in {
 .dropup .caret,
 .navbar-fixed-bottom .dropdown .caret {
   border-top: 0;
-  border-bottom: 4px solid;
+  border-bottom: 4px dashed;
+  border-bottom: 4px solid \9;
   content: "";
 }
 .dropup .dropdown-menu,
@@ -2759,6 +3659,7 @@ tbody.collapse.in {
 .btn-toolbar {
   margin-left: -5px;
 }
+.btn-toolbar .btn,
 .btn-toolbar .btn-group,
 .btn-toolbar .input-group {
   float: left;
@@ -2851,13 +3752,15 @@ tbody.collapse.in {
 }
 .btn-group-vertical > .btn:first-child:not(:last-child) {
   border-top-right-radius: 4px;
+  border-top-left-radius: 4px;
   border-bottom-right-radius: 0;
   border-bottom-left-radius: 0;
 }
 .btn-group-vertical > .btn:last-child:not(:first-child) {
-  border-bottom-left-radius: 4px;
   border-top-right-radius: 0;
   border-top-left-radius: 0;
+  border-bottom-right-radius: 4px;
+  border-bottom-left-radius: 4px;
 }
 .btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
   border-radius: 0;
@@ -2914,20 +3817,23 @@ tbody.collapse.in {
   width: 100%;
   margin-bottom: 0;
 }
+.input-group .form-control:focus {
+  z-index: 3;
+}
 .input-group-lg > .form-control,
 .input-group-lg > .input-group-addon,
 .input-group-lg > .input-group-btn > .btn {
-  height: 49px;
+  height: 48px;
   padding: 10px 16px;
-  font-size: 20px;
+  font-size: 19px;
   line-height: 1.3333333;
   border-radius: 6px;
 }
 select.input-group-lg > .form-control,
 select.input-group-lg > .input-group-addon,
 select.input-group-lg > .input-group-btn > .btn {
-  height: 49px;
-  line-height: 49px;
+  height: 48px;
+  line-height: 48px;
 }
 textarea.input-group-lg > .form-control,
 textarea.input-group-lg > .input-group-addon,
@@ -2940,17 +3846,17 @@ select[multiple].input-group-lg > .input-group-btn > .btn {
 .input-group-sm > .form-control,
 .input-group-sm > .input-group-addon,
 .input-group-sm > .input-group-btn > .btn {
-  height: 33px;
+  height: 31px;
   padding: 5px 10px;
-  font-size: 14px;
+  font-size: 13px;
   line-height: 1.5;
   border-radius: 3px;
 }
 select.input-group-sm > .form-control,
 select.input-group-sm > .input-group-addon,
 select.input-group-sm > .input-group-btn > .btn {
-  height: 33px;
-  line-height: 33px;
+  height: 31px;
+  line-height: 31px;
 }
 textarea.input-group-sm > .form-control,
 textarea.input-group-sm > .input-group-addon,
@@ -2978,23 +3884,23 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
 }
 .input-group-addon {
   padding: 6px 12px;
-  font-size: 16px;
+  font-size: 15px;
   font-weight: normal;
   line-height: 1;
-  color: #555555;
+  color: #888888;
   text-align: center;
-  background-color: #eeeeee;
+  background-color: #f2f2f2;
   border: 1px solid #cccccc;
   border-radius: 4px;
 }
 .input-group-addon.input-sm {
   padding: 5px 10px;
-  font-size: 14px;
+  font-size: 13px;
   border-radius: 3px;
 }
 .input-group-addon.input-lg {
   padding: 10px 16px;
-  font-size: 20px;
+  font-size: 19px;
   border-radius: 6px;
 }
 .input-group-addon input[type="radio"],
@@ -3049,6 +3955,7 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
 }
 .input-group-btn:last-child > .btn,
 .input-group-btn:last-child > .btn-group {
+  z-index: 2;
   margin-left: -1px;
 }
 .nav {
@@ -3068,14 +3975,14 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
 .nav > li > a:hover,
 .nav > li > a:focus {
   text-decoration: none;
-  background-color: #eeeeee;
+  background-color: #f2f2f2;
 }
 .nav > li.disabled > a {
-  color: #777777;
+  color: #dcddde;
 }
 .nav > li.disabled > a:hover,
 .nav > li.disabled > a:focus {
-  color: #777777;
+  color: #dcddde;
   text-decoration: none;
   background-color: transparent;
   cursor: not-allowed;
@@ -3083,12 +3990,12 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
 .nav .open > a,
 .nav .open > a:hover,
 .nav .open > a:focus {
-  background-color: #eeeeee;
-  border-color: #198c75;
+  background-color: #f2f2f2;
+  border-color: #875a7b;
 }
 .nav .nav-divider {
   height: 1px;
-  margin: 10px 0;
+  margin: 9.5px 0;
   overflow: hidden;
   background-color: #e5e5e5;
 }
@@ -3109,13 +4016,13 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
   border-radius: 4px 4px 0 0;
 }
 .nav-tabs > li > a:hover {
-  border-color: #eeeeee #eeeeee #dddddd;
+  border-color: #f2f2f2 #f2f2f2 #dddddd;
 }
 .nav-tabs > li.active > a,
 .nav-tabs > li.active > a:hover,
 .nav-tabs > li.active > a:focus {
-  color: #555555;
-  background-color: #e5e5e5;
+  color: #888888;
+  background-color: #f9f9f9;
   border: 1px solid #dddddd;
   border-bottom-color: transparent;
   cursor: default;
@@ -3161,7 +4068,7 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
   .nav-tabs.nav-justified > .active > a,
   .nav-tabs.nav-justified > .active > a:hover,
   .nav-tabs.nav-justified > .active > a:focus {
-    border-bottom-color: #e5e5e5;
+    border-bottom-color: #f9f9f9;
   }
 }
 .nav-pills > li {
@@ -3177,7 +4084,7 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
 .nav-pills > li.active > a:hover,
 .nav-pills > li.active > a:focus {
   color: #ffffff;
-  background-color: #337ab7;
+  background-color: #21b799;
 }
 .nav-stacked > li {
   float: none;
@@ -3229,7 +4136,7 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
   .nav-tabs-justified > .active > a,
   .nav-tabs-justified > .active > a:hover,
   .nav-tabs-justified > .active > a:focus {
-    border-bottom-color: #e5e5e5;
+    border-bottom-color: #f9f9f9;
   }
 }
 .tab-content > .tab-pane {
@@ -3246,7 +4153,7 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
 .navbar {
   position: relative;
   min-height: 50px;
-  margin-bottom: 22px;
+  margin-bottom: 21px;
   border: 1px solid transparent;
 }
 @media (min-width: 768px) {
@@ -3351,9 +4258,9 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
 }
 .navbar-brand {
   float: left;
-  padding: 14px 15px;
-  font-size: 20px;
-  line-height: 22px;
+  padding: 14.5px 15px;
+  font-size: 19px;
+  line-height: 21px;
   height: 50px;
 }
 .navbar-brand:hover,
@@ -3399,12 +4306,12 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
   }
 }
 .navbar-nav {
-  margin: 7px -15px;
+  margin: 7.25px -15px;
 }
 .navbar-nav > li > a {
   padding-top: 10px;
   padding-bottom: 10px;
-  line-height: 22px;
+  line-height: 21px;
 }
 @media (max-width: 767px) {
   .navbar-nav .open .dropdown-menu {
@@ -3421,7 +4328,7 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
     padding: 5px 15px 5px 25px;
   }
   .navbar-nav .open .dropdown-menu > li > a {
-    line-height: 22px;
+    line-height: 21px;
   }
   .navbar-nav .open .dropdown-menu > li > a:hover,
   .navbar-nav .open .dropdown-menu > li > a:focus {
@@ -3437,8 +4344,8 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
     float: left;
   }
   .navbar-nav > li > a {
-    padding-top: 14px;
-    padding-bottom: 14px;
+    padding-top: 14.5px;
+    padding-bottom: 14.5px;
   }
 }
 .navbar-form {
@@ -3449,8 +4356,8 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
   border-bottom: 1px solid transparent;
   -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
-  margin-top: 7px;
-  margin-bottom: 7px;
+  margin-top: 7.5px;
+  margin-bottom: 7.5px;
 }
 @media (min-width: 768px) {
   .navbar-form .form-group {
@@ -3535,20 +4442,20 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
   border-bottom-left-radius: 0;
 }
 .navbar-btn {
-  margin-top: 7px;
-  margin-bottom: 7px;
+  margin-top: 7.5px;
+  margin-bottom: 7.5px;
 }
 .navbar-btn.btn-sm {
-  margin-top: 8.5px;
-  margin-bottom: 8.5px;
+  margin-top: 9.5px;
+  margin-bottom: 9.5px;
 }
 .navbar-btn.btn-xs {
   margin-top: 14px;
   margin-bottom: 14px;
 }
 .navbar-text {
-  margin-top: 14px;
-  margin-bottom: 14px;
+  margin-top: 14.5px;
+  margin-bottom: 14.5px;
 }
 @media (min-width: 768px) {
   .navbar-text {
@@ -3670,7 +4577,7 @@ fieldset[disabled] .navbar-default .btn-link:focus {
   border-color: #080808;
 }
 .navbar-inverse .navbar-brand {
-  color: #9d9d9d;
+  color: #ffffff;
 }
 .navbar-inverse .navbar-brand:hover,
 .navbar-inverse .navbar-brand:focus {
@@ -3678,10 +4585,10 @@ fieldset[disabled] .navbar-default .btn-link:focus {
   background-color: transparent;
 }
 .navbar-inverse .navbar-text {
-  color: #9d9d9d;
+  color: #ffffff;
 }
 .navbar-inverse .navbar-nav > li > a {
-  color: #9d9d9d;
+  color: #ffffff;
 }
 .navbar-inverse .navbar-nav > li > a:hover,
 .navbar-inverse .navbar-nav > li > a:focus {
@@ -3728,7 +4635,7 @@ fieldset[disabled] .navbar-default .btn-link:focus {
     background-color: #080808;
   }
   .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
-    color: #9d9d9d;
+    color: #ffffff;
   }
   .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover,
   .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
@@ -3749,13 +4656,13 @@ fieldset[disabled] .navbar-default .btn-link:focus {
   }
 }
 .navbar-inverse .navbar-link {
-  color: #9d9d9d;
+  color: #ffffff;
 }
 .navbar-inverse .navbar-link:hover {
   color: #ffffff;
 }
 .navbar-inverse .btn-link {
-  color: #9d9d9d;
+  color: #ffffff;
 }
 .navbar-inverse .btn-link:hover,
 .navbar-inverse .btn-link:focus {
@@ -3769,7 +4676,7 @@ fieldset[disabled] .navbar-inverse .btn-link:focus {
 }
 .breadcrumb {
   padding: 8px 15px;
-  margin-bottom: 22px;
+  margin-bottom: 21px;
   list-style: none;
   background-color: #f5f5f5;
   border-radius: 4px;
@@ -3783,12 +4690,12 @@ fieldset[disabled] .navbar-inverse .btn-link:focus {
   color: #cccccc;
 }
 .breadcrumb > .active {
-  color: #777777;
+  color: #dcddde;
 }
 .pagination {
   display: inline-block;
   padding-left: 0;
-  margin: 22px 0;
+  margin: 21px 0;
   border-radius: 4px;
 }
 .pagination > li {
@@ -3801,7 +4708,7 @@ fieldset[disabled] .navbar-inverse .btn-link:focus {
   padding: 6px 12px;
   line-height: 1.42857143;
   text-decoration: none;
-  color: #198c75;
+  color: #875a7b;
   background-color: #ffffff;
   border: 1px solid #dddddd;
   margin-left: -1px;
@@ -3821,8 +4728,9 @@ fieldset[disabled] .navbar-inverse .btn-link:focus {
 .pagination > li > span:hover,
 .pagination > li > a:focus,
 .pagination > li > span:focus {
-  color: #393f4f;
-  background-color: #eeeeee;
+  z-index: 2;
+  color: #926485;
+  background-color: #f2f2f2;
   border-color: #dddddd;
 }
 .pagination > .active > a,
@@ -3831,10 +4739,10 @@ fieldset[disabled] .navbar-inverse .btn-link:focus {
 .pagination > .active > span:hover,
 .pagination > .active > a:focus,
 .pagination > .active > span:focus {
-  z-index: 2;
+  z-index: 3;
   color: #ffffff;
-  background-color: #337ab7;
-  border-color: #337ab7;
+  background-color: #21b799;
+  border-color: #21b799;
   cursor: default;
 }
 .pagination > .disabled > span,
@@ -3843,7 +4751,7 @@ fieldset[disabled] .navbar-inverse .btn-link:focus {
 .pagination > .disabled > a,
 .pagination > .disabled > a:hover,
 .pagination > .disabled > a:focus {
-  color: #777777;
+  color: #dcddde;
   background-color: #ffffff;
   border-color: #dddddd;
   cursor: not-allowed;
@@ -3851,7 +4759,8 @@ fieldset[disabled] .navbar-inverse .btn-link:focus {
 .pagination-lg > li > a,
 .pagination-lg > li > span {
   padding: 10px 16px;
-  font-size: 20px;
+  font-size: 19px;
+  line-height: 1.3333333;
 }
 .pagination-lg > li:first-child > a,
 .pagination-lg > li:first-child > span {
@@ -3866,7 +4775,8 @@ fieldset[disabled] .navbar-inverse .btn-link:focus {
 .pagination-sm > li > a,
 .pagination-sm > li > span {
   padding: 5px 10px;
-  font-size: 14px;
+  font-size: 13px;
+  line-height: 1.5;
 }
 .pagination-sm > li:first-child > a,
 .pagination-sm > li:first-child > span {
@@ -3880,7 +4790,7 @@ fieldset[disabled] .navbar-inverse .btn-link:focus {
 }
 .pager {
   padding-left: 0;
-  margin: 22px 0;
+  margin: 21px 0;
   list-style: none;
   text-align: center;
 }
@@ -3898,7 +4808,7 @@ fieldset[disabled] .navbar-inverse .btn-link:focus {
 .pager li > a:hover,
 .pager li > a:focus {
   text-decoration: none;
-  background-color: #eeeeee;
+  background-color: #f2f2f2;
 }
 .pager .next > a,
 .pager .next > span {
@@ -3912,7 +4822,7 @@ fieldset[disabled] .navbar-inverse .btn-link:focus {
 .pager .disabled > a:hover,
 .pager .disabled > a:focus,
 .pager .disabled > span {
-  color: #777777;
+  color: #dcddde;
   background-color: #ffffff;
   cursor: not-allowed;
 }
@@ -3942,18 +4852,18 @@ a.label:focus {
   top: -1px;
 }
 .label-default {
-  background-color: #777777;
+  background-color: #dcddde;
 }
 .label-default[href]:hover,
 .label-default[href]:focus {
-  background-color: #5e5e5e;
+  background-color: #c2c4c5;
 }
 .label-primary {
-  background-color: #337ab7;
+  background-color: #21b799;
 }
 .label-primary[href]:hover,
 .label-primary[href]:focus {
-  background-color: #286090;
+  background-color: #198c75;
 }
 .label-success {
   background-color: #50af51;
@@ -3987,14 +4897,14 @@ a.label:focus {
   display: inline-block;
   min-width: 10px;
   padding: 3px 7px;
-  font-size: 14px;
+  font-size: 13px;
   font-weight: bold;
   color: #ffffff;
   line-height: 1;
-  vertical-align: baseline;
+  vertical-align: middle;
   white-space: nowrap;
   text-align: center;
-  background-color: #777777;
+  background-color: #dcddde;
   border-radius: 10px;
 }
 .badge:empty {
@@ -4017,7 +4927,7 @@ a.badge:focus {
 }
 .list-group-item.active > .badge,
 .nav-pills > .active > a > .badge {
-  color: #198c75;
+  color: #875a7b;
   background-color: #ffffff;
 }
 .list-group-item > .badge {
@@ -4030,10 +4940,11 @@ a.badge:focus {
   margin-left: 3px;
 }
 .jumbotron {
-  padding: 30px 15px;
+  padding-top: 30px;
+  padding-bottom: 30px;
   margin-bottom: 30px;
   color: inherit;
-  background-color: #eeeeee;
+  background-color: #f2f2f2;
 }
 .jumbotron h1,
 .jumbotron .h1 {
@@ -4041,22 +4952,25 @@ a.badge:focus {
 }
 .jumbotron p {
   margin-bottom: 15px;
-  font-size: 24px;
+  font-size: 23px;
   font-weight: 200;
 }
 .jumbotron > hr {
-  border-top-color: #d5d5d5;
+  border-top-color: #d9d9d9;
 }
 .container .jumbotron,
 .container-fluid .jumbotron {
   border-radius: 6px;
+  padding-left: 15px;
+  padding-right: 15px;
 }
 .jumbotron .container {
   max-width: 100%;
 }
 @media screen and (min-width: 768px) {
   .jumbotron {
-    padding: 48px 0;
+    padding-top: 48px;
+    padding-bottom: 48px;
   }
   .container .jumbotron,
   .container-fluid .jumbotron {
@@ -4065,15 +4979,15 @@ a.badge:focus {
   }
   .jumbotron h1,
   .jumbotron .h1 {
-    font-size: 72px;
+    font-size: 68px;
   }
 }
 .thumbnail {
   display: block;
   padding: 4px;
-  margin-bottom: 22px;
+  margin-bottom: 21px;
   line-height: 1.42857143;
-  background-color: #e5e5e5;
+  background-color: #f9f9f9;
   border: 1px solid #dddddd;
   border-radius: 4px;
   -webkit-transition: border 0.2s ease-in-out;
@@ -4088,15 +5002,15 @@ a.badge:focus {
 a.thumbnail:hover,
 a.thumbnail:focus,
 a.thumbnail.active {
-  border-color: #198c75;
+  border-color: #875a7b;
 }
 .thumbnail .caption {
   padding: 9px;
-  color: #232b41;
+  color: #666c75;
 }
 .alert {
   padding: 15px;
-  margin-bottom: 22px;
+  margin-bottom: 21px;
   border: 1px solid transparent;
   border-radius: 4px;
 }
@@ -4187,8 +5101,8 @@ a.thumbnail.active {
 }
 .progress {
   overflow: hidden;
-  height: 22px;
-  margin-bottom: 22px;
+  height: 21px;
+  margin-bottom: 21px;
   background-color: #f5f5f5;
   border-radius: 4px;
   -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
@@ -4198,11 +5112,11 @@ a.thumbnail.active {
   float: left;
   width: 0%;
   height: 100%;
-  font-size: 14px;
-  line-height: 22px;
+  font-size: 13px;
+  line-height: 21px;
   color: #ffffff;
   text-align: center;
-  background-color: #337ab7;
+  background-color: #21b799;
   -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
   box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
   -webkit-transition: width 0.6s ease;
@@ -4271,6 +5185,9 @@ a.thumbnail.active {
 .media-object {
   display: block;
 }
+.media-object.img-thumbnail {
+  max-width: none;
+}
 .media-right,
 .media > .pull-right {
   padding-left: 10px;
@@ -4320,23 +5237,31 @@ a.thumbnail.active {
   border-bottom-right-radius: 4px;
   border-bottom-left-radius: 4px;
 }
-a.list-group-item {
+a.list-group-item,
+button.list-group-item {
   color: #555555;
 }
-a.list-group-item .list-group-item-heading {
+a.list-group-item .list-group-item-heading,
+button.list-group-item .list-group-item-heading {
   color: #333333;
 }
 a.list-group-item:hover,
-a.list-group-item:focus {
+button.list-group-item:hover,
+a.list-group-item:focus,
+button.list-group-item:focus {
   text-decoration: none;
   color: #555555;
   background-color: #f5f5f5;
 }
+button.list-group-item {
+  width: 100%;
+  text-align: left;
+}
 .list-group-item.disabled,
 .list-group-item.disabled:hover,
 .list-group-item.disabled:focus {
-  background-color: #eeeeee;
-  color: #777777;
+  background-color: #f2f2f2;
+  color: #dcddde;
   cursor: not-allowed;
 }
 .list-group-item.disabled .list-group-item-heading,
@@ -4347,15 +5272,15 @@ a.list-group-item:focus {
 .list-group-item.disabled .list-group-item-text,
 .list-group-item.disabled:hover .list-group-item-text,
 .list-group-item.disabled:focus .list-group-item-text {
-  color: #777777;
+  color: #dcddde;
 }
 .list-group-item.active,
 .list-group-item.active:hover,
 .list-group-item.active:focus {
   z-index: 2;
   color: #ffffff;
-  background-color: #337ab7;
-  border-color: #337ab7;
+  background-color: #21b799;
+  border-color: #21b799;
 }
 .list-group-item.active .list-group-item-heading,
 .list-group-item.active:hover .list-group-item-heading,
@@ -4371,26 +5296,33 @@ a.list-group-item:focus {
 .list-group-item.active .list-group-item-text,
 .list-group-item.active:hover .list-group-item-text,
 .list-group-item.active:focus .list-group-item-text {
-  color: #c7ddef;
+  color: #b3f1e5;
 }
 .list-group-item-success {
   color: #3c763d;
   background-color: #dff0d8;
 }
-a.list-group-item-success {
+a.list-group-item-success,
+button.list-group-item-success {
   color: #3c763d;
 }
-a.list-group-item-success .list-group-item-heading {
+a.list-group-item-success .list-group-item-heading,
+button.list-group-item-success .list-group-item-heading {
   color: inherit;
 }
 a.list-group-item-success:hover,
-a.list-group-item-success:focus {
+button.list-group-item-success:hover,
+a.list-group-item-success:focus,
+button.list-group-item-success:focus {
   color: #3c763d;
   background-color: #d0e9c6;
 }
 a.list-group-item-success.active,
+button.list-group-item-success.active,
 a.list-group-item-success.active:hover,
-a.list-group-item-success.active:focus {
+button.list-group-item-success.active:hover,
+a.list-group-item-success.active:focus,
+button.list-group-item-success.active:focus {
   color: #fff;
   background-color: #3c763d;
   border-color: #3c763d;
@@ -4399,20 +5331,27 @@ a.list-group-item-success.active:focus {
   color: #31708f;
   background-color: #d9edf7;
 }
-a.list-group-item-info {
+a.list-group-item-info,
+button.list-group-item-info {
   color: #31708f;
 }
-a.list-group-item-info .list-group-item-heading {
+a.list-group-item-info .list-group-item-heading,
+button.list-group-item-info .list-group-item-heading {
   color: inherit;
 }
 a.list-group-item-info:hover,
-a.list-group-item-info:focus {
+button.list-group-item-info:hover,
+a.list-group-item-info:focus,
+button.list-group-item-info:focus {
   color: #31708f;
   background-color: #c4e3f3;
 }
 a.list-group-item-info.active,
+button.list-group-item-info.active,
 a.list-group-item-info.active:hover,
-a.list-group-item-info.active:focus {
+button.list-group-item-info.active:hover,
+a.list-group-item-info.active:focus,
+button.list-group-item-info.active:focus {
   color: #fff;
   background-color: #31708f;
   border-color: #31708f;
@@ -4421,20 +5360,27 @@ a.list-group-item-info.active:focus {
   color: #8a6d3b;
   background-color: #fcf8e3;
 }
-a.list-group-item-warning {
+a.list-group-item-warning,
+button.list-group-item-warning {
   color: #8a6d3b;
 }
-a.list-group-item-warning .list-group-item-heading {
+a.list-group-item-warning .list-group-item-heading,
+button.list-group-item-warning .list-group-item-heading {
   color: inherit;
 }
 a.list-group-item-warning:hover,
-a.list-group-item-warning:focus {
+button.list-group-item-warning:hover,
+a.list-group-item-warning:focus,
+button.list-group-item-warning:focus {
   color: #8a6d3b;
   background-color: #faf2cc;
 }
 a.list-group-item-warning.active,
+button.list-group-item-warning.active,
 a.list-group-item-warning.active:hover,
-a.list-group-item-warning.active:focus {
+button.list-group-item-warning.active:hover,
+a.list-group-item-warning.active:focus,
+button.list-group-item-warning.active:focus {
   color: #fff;
   background-color: #8a6d3b;
   border-color: #8a6d3b;
@@ -4443,20 +5389,27 @@ a.list-group-item-warning.active:focus {
   color: #a94442;
   background-color: #f2dede;
 }
-a.list-group-item-danger {
+a.list-group-item-danger,
+button.list-group-item-danger {
   color: #a94442;
 }
-a.list-group-item-danger .list-group-item-heading {
+a.list-group-item-danger .list-group-item-heading,
+button.list-group-item-danger .list-group-item-heading {
   color: inherit;
 }
 a.list-group-item-danger:hover,
-a.list-group-item-danger:focus {
+button.list-group-item-danger:hover,
+a.list-group-item-danger:focus,
+button.list-group-item-danger:focus {
   color: #a94442;
   background-color: #ebcccc;
 }
 a.list-group-item-danger.active,
+button.list-group-item-danger.active,
 a.list-group-item-danger.active:hover,
-a.list-group-item-danger.active:focus {
+button.list-group-item-danger.active:hover,
+a.list-group-item-danger.active:focus,
+button.list-group-item-danger.active:focus {
   color: #fff;
   background-color: #a94442;
   border-color: #a94442;
@@ -4470,7 +5423,7 @@ a.list-group-item-danger.active:focus {
   line-height: 1.3;
 }
 .panel {
-  margin-bottom: 22px;
+  margin-bottom: 21px;
   background-color: #ffffff;
   border: 1px solid transparent;
   border-radius: 4px;
@@ -4492,7 +5445,7 @@ a.list-group-item-danger.active:focus {
 .panel-title {
   margin-top: 0;
   margin-bottom: 0;
-  font-size: 18px;
+  font-size: 17px;
   color: inherit;
 }
 .panel-title > a,
@@ -4530,6 +5483,10 @@ a.list-group-item-danger.active:focus {
   border-bottom-right-radius: 3px;
   border-bottom-left-radius: 3px;
 }
+.panel > .panel-heading + .panel-collapse > .list-group .list-group-item:first-child {
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
+}
 .panel-heading + .list-group .list-group-item:first-child {
   border-top-width: 0;
 }
@@ -4678,7 +5635,7 @@ a.list-group-item-danger.active:focus {
   margin-bottom: 0;
 }
 .panel-group {
-  margin-bottom: 22px;
+  margin-bottom: 21px;
 }
 .panel-group .panel {
   margin-bottom: 0;
@@ -4704,7 +5661,7 @@ a.list-group-item-danger.active:focus {
   border-color: #dddddd;
 }
 .panel-default > .panel-heading {
-  color: #333333;
+  color: #6b6d70;
   background-color: #f5f5f5;
   border-color: #dddddd;
 }
@@ -4713,28 +5670,28 @@ a.list-group-item-danger.active:focus {
 }
 .panel-default > .panel-heading .badge {
   color: #f5f5f5;
-  background-color: #333333;
+  background-color: #6b6d70;
 }
 .panel-default > .panel-footer + .panel-collapse > .panel-body {
   border-bottom-color: #dddddd;
 }
 .panel-primary {
-  border-color: #337ab7;
+  border-color: #21b799;
 }
 .panel-primary > .panel-heading {
   color: #ffffff;
-  background-color: #337ab7;
-  border-color: #337ab7;
+  background-color: #21b799;
+  border-color: #21b799;
 }
 .panel-primary > .panel-heading + .panel-collapse > .panel-body {
-  border-top-color: #337ab7;
+  border-top-color: #21b799;
 }
 .panel-primary > .panel-heading .badge {
-  color: #337ab7;
+  color: #21b799;
   background-color: #ffffff;
 }
 .panel-primary > .panel-footer + .panel-collapse > .panel-body {
-  border-bottom-color: #337ab7;
+  border-bottom-color: #21b799;
 }
 .panel-success {
   border-color: #d6e9c6;
@@ -4858,7 +5815,7 @@ a.list-group-item-danger.active:focus {
 }
 .close {
   float: right;
-  font-size: 24px;
+  font-size: 22.5px;
   font-weight: bold;
   line-height: 1;
   color: #000000;
@@ -4952,7 +5909,6 @@ button.close {
 .modal-header {
   padding: 15px;
   border-bottom: 1px solid #e5e5e5;
-  min-height: 16.42857143px;
 }
 .modal-header .close {
   margin-top: -2px;
@@ -5009,10 +5965,22 @@ button.close {
   position: absolute;
   z-index: 1070;
   display: block;
-  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-  font-size: 14px;
+  font-family: -apple-system, BlinkMacSystemFont, Helvetica, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
   font-weight: normal;
-  line-height: 1.4;
+  letter-spacing: normal;
+  line-break: auto;
+  line-height: 1.42857143;
+  text-align: left;
+  text-align: start;
+  text-decoration: none;
+  text-shadow: none;
+  text-transform: none;
+  white-space: normal;
+  word-break: normal;
+  word-spacing: normal;
+  word-wrap: normal;
+  font-size: 13px;
   opacity: 0;
   filter: alpha(opacity=0);
 }
@@ -5041,7 +6009,6 @@ button.close {
   padding: 3px 8px;
   color: #ffffff;
   text-align: center;
-  text-decoration: none;
   background-color: #000000;
   border-radius: 4px;
 }
@@ -5116,11 +6083,22 @@ button.close {
   display: none;
   max-width: 276px;
   padding: 1px;
-  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-  font-size: 16px;
+  font-family: -apple-system, BlinkMacSystemFont, Helvetica, "Helvetica Neue", Arial, sans-serif;
+  font-style: normal;
   font-weight: normal;
+  letter-spacing: normal;
+  line-break: auto;
   line-height: 1.42857143;
   text-align: left;
+  text-align: start;
+  text-decoration: none;
+  text-shadow: none;
+  text-transform: none;
+  white-space: normal;
+  word-break: normal;
+  word-spacing: normal;
+  word-wrap: normal;
+  font-size: 15px;
   background-color: #ffffff;
   background-clip: padding-box;
   border: 1px solid #cccccc;
@@ -5128,7 +6106,6 @@ button.close {
   border-radius: 6px;
   -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
   box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
-  white-space: normal;
 }
 .popover.top {
   margin-top: -10px;
@@ -5145,7 +6122,7 @@ button.close {
 .popover-title {
   margin: 0;
   padding: 8px 14px;
-  font-size: 16px;
+  font-size: 15px;
   background-color: #f7f7f7;
   border-bottom: 1px solid #ebebeb;
   border-radius: 5px 5px 0 0;
@@ -5257,9 +6234,9 @@ button.close {
     -webkit-backface-visibility: hidden;
     -moz-backface-visibility: hidden;
     backface-visibility: hidden;
-    -webkit-perspective: 1000;
-    -moz-perspective: 1000;
-    perspective: 1000;
+    -webkit-perspective: 1000px;
+    -moz-perspective: 1000px;
+    perspective: 1000px;
   }
   .carousel-inner > .item.next,
   .carousel-inner > .item.active.right {
@@ -5323,6 +6300,7 @@ button.close {
   color: #ffffff;
   text-align: center;
   text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
+  background-color: rgba(0, 0, 0, 0);
 }
 .carousel-control.left {
   background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
@@ -5354,6 +6332,7 @@ button.close {
 .carousel-control .glyphicon-chevron-right {
   position: absolute;
   top: 50%;
+  margin-top: -10px;
   z-index: 5;
   display: inline-block;
 }
@@ -5371,7 +6350,6 @@ button.close {
 .carousel-control .icon-next {
   width: 20px;
   height: 20px;
-  margin-top: -10px;
   line-height: 1;
   font-family: serif;
 }
@@ -5432,16 +6410,16 @@ button.close {
   .carousel-control .icon-next {
     width: 30px;
     height: 30px;
-    margin-top: -15px;
+    margin-top: -10px;
     font-size: 30px;
   }
   .carousel-control .glyphicon-chevron-left,
   .carousel-control .icon-prev {
-    margin-left: -15px;
+    margin-left: -10px;
   }
   .carousel-control .glyphicon-chevron-right,
   .carousel-control .icon-next {
-    margin-right: -15px;
+    margin-right: -10px;
   }
   .carousel-caption {
     left: 20%;
@@ -5480,8 +6458,16 @@ button.close {
 .pager:after,
 .panel-body:before,
 .panel-body:after,
+.modal-header:before,
+.modal-header:after,
 .modal-footer:before,
-.modal-footer:after {
+.modal-footer:after,
+#wrap > .container.index > .index:before,
+#wrap > .container.index > .index:after,
+main.has_code_col:before,
+main.has_code_col:after,
+.o_main_header > .o_main_header_main:before,
+.o_main_header > .o_main_header_main:after {
   content: " ";
   display: table;
 }
@@ -5499,7 +6485,11 @@ button.close {
 .navbar-collapse:after,
 .pager:after,
 .panel-body:after,
-.modal-footer:after {
+.modal-header:after,
+.modal-footer:after,
+#wrap > .container.index > .index:after,
+main.has_code_col:after,
+.o_main_header > .o_main_header_main:after {
   clear: both;
 }
 .center-block {
@@ -5563,7 +6553,7 @@ button.close {
     display: block !important;
   }
   table.visible-xs {
-    display: table;
+    display: table !important;
   }
   tr.visible-xs {
     display: table-row !important;
@@ -5593,7 +6583,7 @@ button.close {
     display: block !important;
   }
   table.visible-sm {
-    display: table;
+    display: table !important;
   }
   tr.visible-sm {
     display: table-row !important;
@@ -5623,7 +6613,7 @@ button.close {
     display: block !important;
   }
   table.visible-md {
-    display: table;
+    display: table !important;
   }
   tr.visible-md {
     display: table-row !important;
@@ -5653,7 +6643,7 @@ button.close {
     display: block !important;
   }
   table.visible-lg {
-    display: table;
+    display: table !important;
   }
   tr.visible-lg {
     display: table-row !important;
@@ -5706,7 +6696,7 @@ button.close {
     display: block !important;
   }
   table.visible-print {
-    display: table;
+    display: table !important;
   }
   tr.visible-print {
     display: table-row !important;
@@ -8116,40 +9106,212 @@ button.close {
 .mdi-toggle-star:before {
   content: "\e8f5";
 }
-.antialiased {
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-font-smoothing: antialiased;
-  text-rendering: geometricPrecision;
+.o-no-select {
+  pointer-events: none;
+  cursor: default;
+}
+.o-no-select::selection,
+.o-no-select *::selection {
+  background: transparent;
+}
+.o-no-select::-moz-selection,
+.o-no-select *::-moz-selection {
+  background: transparent;
+}
+.o_logo {
+  background-image: url("img/logos/odoo_logo.png");
+  background-image: url("img/logos/odoo_logo.svg");
+  background-position: 0 0;
+  background-repeat: no-repeat;
+  display: inline-block;
+  width: 94.05px;
+  height: 30px;
+  background-size: auto 30px;
+}
+.o_logo.center-block,
+.o_logo.o_logo_responsive_half {
+  position: relative;
+  margin-left: auto;
+  margin-right: auto;
+  display: block;
+}
+.o_logo.o_logo_responsive {
+  background-size: cover;
+  width: 100%;
+  height: 0;
+  padding-bottom: 31.9%;
 }
-.mdi-icon {
+.o_logo.o_logo_responsive_half {
+  background-size: cover;
+  width: 50%;
+  height: 0;
+  padding-bottom: 15.94%;
+}
+.o_logo_15 {
+  width: 47.025px;
+  height: 15px;
+  background-size: auto 15px;
+}
+.o_logo_30 {
+  width: 94.05px;
+  height: 30px;
+  background-size: auto 30px;
+}
+.o_logo_60 {
+  width: 188.1px;
+  height: 60px;
+  background-size: auto 60px;
+}
+.o_logo_120 {
+  width: 376.2px;
+  height: 120px;
+  background-size: auto 120px;
+}
+.o_logo_240 {
+  width: 752.4px;
+  height: 240px;
+  background-size: auto 240px;
+}
+.o_logo_inverse {
+  background-position: 100% 0;
+}
+.o_logo_inverse.o_logo_15.center-block {
+  background-position: 102% 0;
+}
+.o-doc-dropdown > a.dropdown-toggle {
+  padding: 0 5px 0 10px;
+}
+.o-doc-dropdown > a.dropdown-toggle:after {
   font-family: 'Material-Design-Icons';
+  content: "\e7c1";
   display: inline-block;
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-font-smoothing: antialiased;
   text-rendering: geometricPrecision;
+  font-size: 1em;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+@media screen and (max-width: 767px) {
+  .o-doc-dropdown > a.dropdown-toggle:after {
+    font-size: 1.5em;
+  }
+}
+.o-doc-dropdown.open {
+  z-index: 1;
+  position: relative;
+  background-color: #dcddde;
+  color: #5a5f68;
+}
+@media screen and (min-width: 768px) {
+  .o-doc-dropdown.open {
+    background-color: #fcfcfc;
+  }
+}
+.o-doc-dropdown.open .dropdown-toggle {
+  color: #5a5f68;
+}
+.o-doc-dropdown.open .dropdown-toggle:hover {
+  color: #21313a;
+}
+.o-doc-dropdown.open .dropdown-menu {
+  margin-top: 0;
+  border: none;
+  border-radius: 0;
+  text-align: left;
+  min-width: 100%;
+  background-color: #fcfcfc;
+  padding-bottom: 12.5px;
+  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.17);
+}
+.o-doc-dropdown.open .dropdown-menu.deep_hover:hover {
+  -webkit-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  -moz-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  -o-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.05);
+}
+.o-doc-dropdown.open .dropdown-menu > li > a {
+  font-size: 12px;
+  display: block;
+  color: #5a5f68;
+  float: none;
+  text-transform: none;
+  font-weight: 500;
+}
+@media screen and (max-width: 767px) {
+  .o-doc-dropdown.open .dropdown-menu > li > a {
+    padding-left: 10px;
+  }
+}
+.o-doc-dropdown.open .dropdown-menu > li.active > a {
+  color: white;
+  background-color: #4c8c7f;
+}
+@media screen and (max-width: 767px) {
+  .o-doc-dropdown.open .dropdown-menu {
+    position: static;
+  }
+}
+@media screen and (min-width: 768px) {
+  .o-doc-dropdown.open .dropdown-menu {
+    background-color: #fcfcfc;
+  }
+}
+.o-doc-dropdown.o_dropdown_mobile_nav {
+  margin-left: 0;
+}
+.o-doc-dropdown.o_dropdown_mobile_nav > .dropdown-toggle:after {
+  position: absolute;
+  top: 0;
+  left: auto;
+  bottom: auto;
+  right: 0;
+}
+.o-doc-dropdown.o_dropdown_mobile_nav .o_breadcrumb_dropdown_menu > li > a {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.o-doc-dropdown.o_dropdown_mobile_nav .o_breadcrumb_dropdown_menu > li > a:before {
+  content: "|";
+  margin-right: 0.5em;
+}
+.o-doc-dropdown.o_dropdown_mobile_nav .o_breadcrumb_dropdown_menu > li:nth-child(1) > a:before {
+  display: none;
+}
+.o-doc-dropdown.o_dropdown_mobile_nav .o_breadcrumb_dropdown_menu > li:nth-child(2) > a:before {
+  padding-left: 0.5em;
+}
+.o-doc-dropdown.o_dropdown_mobile_nav .o_breadcrumb_dropdown_menu > li:nth-child(3) > a:before {
+  padding-left: 1em;
 }
 .shadow-none {
   -webkit-box-shadow: none;
   box-shadow: none;
 }
-.shadow-0 {
-  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
-  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
+.deep-1 {
+  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.17);
 }
-.shadow-1 {
-  box-shadow: 0 1.5px 4px rgba(0, 0, 0, 0.24), 0 1.5px 6px rgba(0, 0, 0, 0.12);
+.deep-2 {
+  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.05);
 }
-.shadow-2 {
-  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.23), 0 3px 12px rgba(0, 0, 0, 0.16);
+.deep-3 {
+  box-shadow: 0 13px 25px 0 rgba(0, 0, 0, 0.1), 0 11px 7px 0 rgba(0, 0, 0, 0.09);
 }
-.shadow-3 {
-  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.23), 0 10px 40px rgba(0, 0, 0, 0.19);
+.deep-4 {
+  box-shadow: 0 20px 40px 0 rgba(0, 0, 0, 0.1), 0 14px 12px 0 rgba(0, 0, 0, 0.07);
 }
-.shadow-4 {
-  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.22), 0 14px 56px rgba(0, 0, 0, 0.25);
+.deep-5 {
+  box-shadow: 0 27px 55px 0 rgba(0, 0, 0, 0.1), 0 17px 17px 0 rgba(0, 0, 0, 0.05);
+}
+.img-responsive,
+.thumbnail > img,
+.thumbnail a > img,
+.carousel-inner > .item > img,
+.carousel-inner > .item > a > img {
+  display: inline-block;
 }
-.shadow-5 {
-  box-shadow: 0 15px 24px rgba(0, 0, 0, 0.22), 0 19px 76px rgba(0, 0, 0, 0.3);
+.img-responsive.center-block {
+  display: block;
 }
 @-moz-keyframes ripple {
   100% {
@@ -8276,9 +9438,9 @@ button.close {
   display: block;
   position: absolute;
   border-radius: 100%;
-  opacity: 1.3;
+  opacity: 1;
   z-index: -1;
-  background: rgba(0, 0, 0, 0.2);
+  background: rgba(0, 0, 0, 0.05);
   pointer-events: none;
   -webkit-transform: scale(0);
   -ms-transform: scale(0);
@@ -8290,266 +9452,158 @@ button.close {
   -o-animation: ripple 0.35s ease-in;
   animation: ripple 0.35s ease-in;
 }
-a {
-  -webkit-transition: color 0.1s linear;
-  -o-transition: color 0.1s linear;
-  transition: color 0.1s linear;
-}
-main,
-#navClone {
-  font-size: 0.875em;
-  line-height: 1.642857143em;
-}
-main article {
-  /* Sanitation */
-}
-main article h1,
-main article .h1 {
-  font-size: 4.214285714em;
-  line-height: 1.169491527em;
-  margin-top: 0.77966102em;
-  margin-bottom: 0.38983051em;
-}
-main article h2,
-main article .h2 {
-  font-size: 2.642857143em;
-  line-height: 1.243243244em;
-  margin-top: 1.24324324em;
-  margin-bottom: 0.62162162em;
-}
-main article h2 code,
-main article .h2 code {
-  font-size: .5em;
-}
-main article h3,
-main article .h3 {
-  font-size: 1.642857143em;
-  line-height: 1em;
-  margin-top: 1em;
-  margin-bottom: 1em;
-}
-main article h3 code,
-main article .h3 code {
-  font-size: .5em;
-}
-main article h4,
-main article .h4 {
-  font-size: 1em;
-  line-height: 1.642857143em;
-  margin-top: 1.64285714em;
-  margin-bottom: 1.64285714em;
-}
-main article p,
-main article ul,
-main article ol,
-main article table,
-main article blockquote,
-main article .alert,
-main article .doc-code,
-main article .admonition {
-  margin-top: 1.64285714em;
-  margin-bottom: 1.64285714em;
-}
-main article a {
-  font-weight: bold;
-}
-main article hr {
-  margin: -1px 0;
-  border-top: 1px solid #e5e5e5;
-}
-main article ul ul,
-main article ol ol,
-main article ul ol,
-main article ol ul {
-  margin-top: 0;
-  margin-bottom: 0;
-  margin-left: .5em;
-  padding-left: .5em;
-}
-main article ul,
-main article ol {
-  padding-left: 1em;
-  margin-left: .5em;
+body {
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
 }
-main article ul li,
-main article ol li {
-  margin-top: .5em;
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+.h1,
+.h2,
+.h3,
+.h4,
+.h5,
+.h6 {
+  text-rendering: geometricPrecision;
+  letter-spacing: -0.01em;
+  line-height: 1.4;
 }
-main article ul li p,
-main article ol li p {
-  margin: 0;
+@media (min-width: 1200px) {
+  .has_code_col h1,
+  .has_code_col h2,
+  .has_code_col h3,
+  .has_code_col h4,
+  .has_code_col h5,
+  .has_code_col h6,
+  .has_code_col .h1,
+  .has_code_col .h2,
+  .has_code_col .h3,
+  .has_code_col .h4,
+  .has_code_col .h5,
+  .has_code_col .h6 {
+    color: white;
+  }
 }
-main article ul li pre,
-main article ol li pre,
-main article ul li .highlight,
-main article ol li .highlight {
-  display: inline;
-  border-radius: 0;
+h1,
+h2,
+.h1,
+.h2 {
+  margin-top: 31.5px;
+  font-weight: 300;
 }
-main article ul li pre,
-main article ol li pre {
-  font-size: .8em;
-  padding: 0.3em .5em;
-}
-main article .alert pre,
-main article .doc-content pre {
-  font-size: .8em;
-  padding: 0.3em .5em;
-}
-main article b,
-main article strong,
-main article em,
-main article small,
-main article code {
-  line-height: 1;
+h1 b,
+h2 b,
+.h1 b,
+.h2 b,
+h1 strong,
+h2 strong,
+.h1 strong,
+.h2 strong,
+h1 a,
+h2 a,
+.h1 a,
+.h2 a {
+  font-weight: 400;
 }
-main article sup,
-main article sub {
-  vertical-align: baseline;
-  position: relative;
-  top: -0.4em;
+h3,
+.h3,
+h4,
+.h4,
+h5,
+h6,
+.h5,
+.h6 {
+  font-weight: 400;
 }
-main article sub {
-  top: 0.4em;
+h3 b,
+.h3 b,
+h4 b,
+.h4 b,
+h5 b,
+h6 b,
+.h5 b,
+.h6 b,
+h3 strong,
+.h3 strong,
+h4 strong,
+.h4 strong,
+h5 strong,
+h6 strong,
+.h5 strong,
+.h6 strong,
+h3 a,
+.h3 a,
+h4 a,
+.h4 a,
+h5 a,
+h6 a,
+.h5 a,
+.h6 a {
+  font-weight: 500;
 }
-@media screen and (min-width: 992px) {
-  .doc-body {
-    font-size: 1em;
-    line-height: 1.5em;
-    /* Sanitation */
-  }
-  .doc-body h2 {
-    font-size: 3.565em;
-    line-height: 1.058823528em;
-    margin-top: 1.3em;
-    margin-bottom: 0.505882em;
-    padding-bottom: .2em;
-    border-bottom: 1px solid #EAEAEA;
-  }
-  .doc-body h3 {
-    font-size: 2.625em;
-    line-height: 1.142857142em;
-    margin-top: 1.14285714em;
-    margin-bottom: 10px;
-  }
-  .doc-body h4 {
-    font-size: 1.625em;
-    line-height: 1.846153846em;
-    margin-top: 0.92307692em;
-    margin-bottom: 10px;
-    font-weight: 400;
-  }
-  .doc-body h5 {
-    font-size: 1.5em;
-    line-height: 1.7em;
-    margin-top: 1.5em;
-    margin-bottom: 10px;
-  }
-  .doc-body p,
-  .doc-body ul,
-  .doc-body ol,
-  .doc-body table,
-  .doc-body blockquote {
-    margin-top: 1em;
-    margin-bottom: 1em;
-  }
-  .doc-body pre {
-    margin-top: .1em;
-    margin-bottom: 0em;
-  }
-  .doc-body hr {
-    border: 1px solid;
-    margin: -1px 0;
-  }
-  .doc-body ul ul,
-  .doc-body ol ol,
-  .doc-body ul ol,
-  .doc-body ol ul {
-    margin-top: 0;
-    margin-bottom: 0;
-  }
-  .doc-body ul,
-  .doc-body ol {
-    padding-left: 1em;
-    margin-left: .5em;
-  }
-  .doc-body ul li,
-  .doc-body ol li {
-    margin-top: .5em;
-  }
-  .doc-body ul li p,
-  .doc-body ol li p {
-    margin: .5em 0;
-  }
-  .doc-body ul li pre,
-  .doc-body ol li pre,
-  .doc-body ul li .highlight,
-  .doc-body ol li .highlight {
-    display: inline;
-    border-radius: 0;
-  }
-  .doc-body ul li pre,
-  .doc-body ol li pre {
-    font-size: .8em;
-    padding: 0.3em .5em;
-  }
-  .doc-body .alert pre,
-  .doc-body .doc-content pre {
-    font-size: .8em;
-    padding: 0.3em .5em;
-  }
-  .doc-body b,
-  .doc-body strong,
-  .doc-body em,
-  .doc-body small,
-  .doc-body code {
-    line-height: 1;
-  }
-  .doc-body sup,
-  .doc-body sub {
-    vertical-align: baseline;
-    position: relative;
-    top: -0.4em;
-  }
-  .doc-body sub {
-    top: 0.4em;
-  }
+h4,
+.h4,
+h5,
+h6,
+.h5,
+.h6 {
+  margin-top: 21px;
+  margin-bottom: 7px;
 }
-.guilabel:before {
-  content: "❮";
+ul:not(:empty),
+ol:not(:empty) {
+  margin-bottom: 10.5px;
 }
-.guilabel:after {
-  content: "❯";
+ul ul:not(:empty),
+ol ul:not(:empty),
+ul ol:not(:empty),
+ol ol:not(:empty) {
+  margin-bottom: 7px;
 }
 body,
 header {
   position: relative;
 }
-#main_navbar .container-fluid .navbar-header li {
-  float: left;
+#wrap > .container.index {
+  background-color: #f9f9f9;
+  width: 100%;
+  position: relative;
+}
+#wrap > .container.index > .index {
+  margin-right: auto;
+  margin-left: auto;
+  padding-left: 15px;
+  padding-right: 15px;
 }
 @media (min-width: 768px) {
-  header {
-    margin-bottom: -50px;
+  #wrap > .container.index > .index {
+    width: 750px;
   }
 }
-.card.top {
-  height: 0;
-  margin-bottom: 0;
-  overflow: hidden;
-  position: relative;
-  padding-top: 50%;
-  padding-bottom: 15%;
+@media (min-width: 992px) {
+  #wrap > .container.index > .index {
+    width: 970px;
+  }
 }
-@media (min-width: 768px) {
-  .card.top {
-    padding-top: 30%;
+@media (min-width: 1200px) {
+  #wrap > .container.index > .index {
+    width: 1170px;
   }
 }
-@media (min-width: 992px) {
-  .card.top {
-    padding-top: 10%;
-    padding-bottom: 15%;
+#wrap > .container.index > .index > .navbar-header,
+#wrap > .container.index > .index > .navbar-collapse {
+  margin-right: -15px;
+  margin-left: -15px;
+}
+@media (min-width: 768px) {
+  #wrap > .container.index > .index > .navbar-header,
+  #wrap > .container.index > .index > .navbar-collapse {
+    margin-right: 0;
+    margin-left: 0;
   }
 }
 #main_title {
@@ -8598,8 +9652,8 @@ main aside {
 }
 main article.doc-body {
   background: #ffffff;
-  padding-right: 30px;
-  padding-left: 30px;
+  border-left: 1px solid #f2f2f2;
+  padding: 15px 30px;
 }
 @media (min-width: 992px) {
   main article.doc-body {
@@ -8612,19 +9666,45 @@ main article.doc-body {
 main article.doc-body > * {
   max-width: 100%;
 }
-@media (max-width: 1440px) {
+main.has_code_col {
+  margin-right: auto;
+  margin-left: auto;
+  padding-left: 15px;
+  padding-right: 15px;
+}
+@media (min-width: 768px) {
   main.has_code_col {
-    width: 100%;
+    width: 750px;
   }
 }
-main.has_code_col aside {
-  width: 16.66666667%;
+@media (min-width: 992px) {
+  main.has_code_col {
+    width: 970px;
+  }
 }
-@media (max-width: 1170px) {
-  main.has_code_col aside {
-    width: 25%;
+@media (min-width: 1200px) {
+  main.has_code_col {
+    width: 1170px;
+  }
+}
+main.has_code_col > .navbar-header,
+main.has_code_col > .navbar-collapse {
+  margin-right: -15px;
+  margin-left: -15px;
+}
+@media (min-width: 768px) {
+  main.has_code_col > .navbar-header,
+  main.has_code_col > .navbar-collapse {
+    margin-right: 0;
+    margin-left: 0;
   }
 }
+main.has_code_col aside {
+  display: none;
+}
+main.has_code_col article.doc-body {
+  width: 100%;
+}
 main.has_code_col article.doc-body > * {
   max-width: 100%;
 }
@@ -8634,14 +9714,14 @@ main.has_code_col article.doc-body section {
   float: left;
   width: 100%;
 }
-@media (min-width: 1170px) {
+@media (min-width: 1200px) {
   main.has_code_col article.doc-body {
-    width: 83.33333333%;
+    width: 100%;
     padding-right: 0;
   }
   main.has_code_col article.doc-body:before {
     content: "";
-    background: #21242a;
+    background: #21272b;
     -webkit-box-shadow: inset 40px 0 40px -18px rgba(22, 24, 29, 0.3);
     box-shadow: inset 40px 0 40px -18px rgba(22, 24, 29, 0.3);
     position: absolute;
@@ -8651,7 +9731,8 @@ main.has_code_col article.doc-body section {
     right: 0;
   }
   main.has_code_col article.doc-body section > * {
-    width: 55.633333%;
+    width: 54.633333%;
+    max-width: 600px;
     float: left;
     clear: left;
   }
@@ -8670,11 +9751,17 @@ main.has_code_col article.doc-body section {
     float: none;
     clear: none;
     margin-right: 15px;
-    margin-left: 56%;
+    margin-left: 57%;
   }
   main.has_code_col article.doc-body section .doc-aside .content-switcher {
     margin-top: 0;
   }
+  main.has_code_col article.doc-body section .doc-aside .content-switcher > ul {
+    margin-bottom: 0;
+  }
+  main.has_code_col article.doc-body section .doc-aside .content-switcher > ul > li {
+    color: #dcddde;
+  }
 }
 @media screen and (min-width: 992px) {
   main.index .toctree-wrapper {
@@ -8701,6 +9788,10 @@ main.has_code_col article.doc-body section {
     min-height: 420px;
   }
 }
+article.doc-toc .toctree-wrapper > ul > li > span {
+  display: block;
+  font-size: 28px;
+}
 .code-fields {
   display: table;
   width: 100%;
@@ -8733,220 +9824,1867 @@ main.has_code_col article.doc-body section {
   margin: .2em 0;
   padding: 0;
 }
-html,
-body {
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-font-smoothing: antialiased;
-  text-rendering: geometricPrecision;
+#oe_main_menu_navbar ~ #wrapwrap .o_main_header.o_has_sub_nav.o_scrolled {
+  top: -17px;
 }
-header {
-  background: #9e588b;
-  -webkit-transition: background 1s;
-  -o-transition: background 1s;
-  transition: background 1s;
+.o_main_header {
+  position: fixed;
+  width: 100%;
+  height: 50px;
+  z-index: 2;
+  background-color: rgba(255, 255, 255, 0.6);
+  color: #5a5f68;
+  font-family: "Work Sans", sans-serif;
+  font-size: 12px;
+  -webkit-transition: all 0.2s ease;
+  -o-transition: all 0.2s ease;
+  transition: all 0.2s ease;
+  -webkit-transition-property: background, box-shadow;
+  transition-property: background, box-shadow;
+  -webkit-transform: translate3d(auto, auto, 0);
+  transform: translate3d(auto, auto, 0);
+}
+.o_main_header a:focus,
+.o_main_header a:active,
+.o_main_header a:focus:active {
+  outline: none;
+}
+.o_main_header .btn-primary {
+  color: white!important;
+  font-size: inherit!important;
+  font-weight: 700;
+  text-transform: uppercase;
 }
-header.stacked {
-  background: transparent;
-  -webkit-transition: background 1s;
-  -o-transition: background 1s;
-  transition: background 1s;
+.o_main_header > .o_main_header_main {
+  margin-right: auto;
+  margin-left: auto;
+  padding-left: 15px;
+  padding-right: 15px;
+  height: 100%;
 }
-#main-back {
-  float: left;
-  -webkit-transition: margin 0.5s;
-  -o-transition: margin 0.5s;
-  transition: margin 0.5s;
+@media (min-width: 768px) {
+  .o_main_header > .o_main_header_main {
+    width: 750px;
+  }
 }
-#main-back a:hover {
-  border-bottom: 1px solid transparent!important;
+@media (min-width: 992px) {
+  .o_main_header > .o_main_header_main {
+    width: 970px;
+  }
 }
-.index #main-back {
-  visibility: hidden;
+@media (min-width: 1200px) {
+  .o_main_header > .o_main_header_main {
+    width: 1170px;
+  }
 }
-#main_title {
-  line-height: 2.4;
-  color: white;
-  font-weight: 900;
+.o_main_header > .o_main_header_main > .navbar-header,
+.o_main_header > .o_main_header_main > .navbar-collapse {
+  margin-right: -15px;
+  margin-left: -15px;
+}
+@media (min-width: 768px) {
+  .o_main_header > .o_main_header_main > .navbar-header,
+  .o_main_header > .o_main_header_main > .navbar-collapse {
+    margin-right: 0;
+    margin-left: 0;
+  }
+}
+.o_main_header > .o_main_header_main a {
+  color: inherit;
+}
+.o_main_header > .o_main_header_main a:hover,
+.o_main_header > .o_main_header_main a:focus {
+  color: #505d71;
+}
+.o_main_header > .o_main_header_main .o_logo {
+  margin: 15px 0;
+  width: 63px;
+  height: 20px;
+  background-size: cover;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav {
+  margin: 0 auto;
+  padding: 0;
+  text-align: center;
   white-space: nowrap;
+}
+@media (min-width: 768px) {
+  .o_main_header > .o_main_header_main > .o_primary_nav {
+    height: 100%;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav:before {
+    content: "";
+    background: transparent;
+    z-index: -1;
+    visibility: hidden;
+    box-shadow: 0 1px 0 transparent;
+    width: 100%;
+    height: 50px;
+    position: absolute;
+    top: 0;
+    left: auto;
+    bottom: auto;
+    right: 0;
+    -webkit-transition: background 500ms cubic-bezier(0.55, 0, 0.1, 1) 0ms, visibility 0ms linear 500ms, box-shadow 500ms linear 0ms;
+    -o-transition: background 500ms cubic-bezier(0.55, 0, 0.1, 1) 0ms, visibility 0ms linear 500ms, box-shadow 500ms linear 0ms;
+    transition: background 500ms cubic-bezier(0.55, 0, 0.1, 1) 0ms, visibility 0ms linear 500ms, box-shadow 500ms linear 0ms;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav.o_sub_opened:before {
+    visibility: visible;
+    background: #fcfcfc;
+    box-shadow: 0 1px 0 #f2f2f2;
+    -webkit-transition: background 500ms cubic-bezier(0.55, 0, 0.1, 1) 0ms, visibility 0ms linear 0s, box-shadow 500ms linear 0ms;
+    -o-transition: background 500ms cubic-bezier(0.55, 0, 0.1, 1) 0ms, visibility 0ms linear 0s, box-shadow 500ms linear 0ms;
+    transition: background 500ms cubic-bezier(0.55, 0, 0.1, 1) 0ms, visibility 0ms linear 0s, box-shadow 500ms linear 0ms;
+  }
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .dropdown {
+  position: static;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .dropdown > a {
+  position: relative;
+  -webkit-backface-visibility: hidden;
+  -moz-backface-visibility: hidden;
+  backface-visibility: hidden;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .dropdown > a::before,
+.o_main_header > .o_main_header_main > .o_primary_nav .dropdown > a::after {
+  content: "";
+  display: block;
   position: absolute;
-  bottom: 0;
+  top: 50%;
+  left: auto;
+  bottom: auto;
+  right: 0;
+  -ms-transform-origin: 50% 50% 0;
+  -webkit-transform-origin: 50% 50% 0;
+  -moz-transform-origin: 50% 50% 0;
+  transform-origin: 50% 50% 0;
+  -webkit-transition: all 300ms ease 0s;
+  -moz-transition: all 300ms ease 0s;
+  -o-transition: all 300ms ease 0s;
+  transition: all 300ms ease 0s;
+  width: 10px;
+  height: 1px;
+  background-color: #21313a;
+  box-shadow: 0 1px 1px rgba(33, 49, 58, 0.1);
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .dropdown > a::before {
+  -webkit-transform: rotate(45deg);
+  -ms-transform: rotate(45deg);
+  -o-transform: rotate(45deg);
+  transform: rotate(45deg);
+  right: 6.07106781px;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .dropdown > a::after {
+  -webkit-transform: rotate(-45deg);
+  -ms-transform: rotate(-45deg);
+  -o-transform: rotate(-45deg);
+  transform: rotate(-45deg);
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .dropdown.open > a {
+  color: #9e588b !important;
+  font-weight: 600;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .dropdown.open > a::before,
+.o_main_header > .o_main_header_main > .o_primary_nav .dropdown.open > a::after {
+  background-color: #9e588b !important;
+  box-shadow: 0 1px 1px rgba(158, 88, 139, 0.1);
+  right: 3.53553391px;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .dropdown.open > a::before {
+  -webkit-transform: rotate(-45deg);
+  -ms-transform: rotate(-45deg);
+  -o-transform: rotate(-45deg);
+  transform: rotate(-45deg);
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .dropdown.open > a::after {
+  -webkit-transform: rotate(45deg);
+  -ms-transform: rotate(45deg);
+  -o-transform: rotate(45deg);
+  transform: rotate(45deg);
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .dropdown > .dropdown-menu {
+  border: none;
+  border-radius: 0;
   margin: 0;
-  will-change: transform;
-  -webkit-transform-origin: 0% 100% 0px;
-  -moz-transform-origin: 0% 100% 0px;
-  -ms-transform-origin: 0% 100% 0px;
-  transform-origin: 0% 100% 0px;
 }
-.index #main_title {
-  font-weight: 300;
+.o_main_header > .o_main_header_main > .o_primary_nav > li {
+  display: inline-block;
 }
-.index #main_title:before {
-  content: "";
+.o_main_header > .o_main_header_main > .o_primary_nav > li > a {
+  height: 100%;
+  line-height: 50px;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav > li > a:not(.btn) {
   display: inline-block;
-  width: 75px;
-  height: 25px;
-  margin-right: 9px;
-  background-image: url(img/odoo_logo_white.png);
+  padding: 0 20px;
+  font-weight: 600;
+  text-transform: uppercase;
+}
+@media screen and (min-width: 768px) and (max-width: 991px) {
+  .o_main_header > .o_main_header_main > .o_primary_nav > li > a:not(.btn) {
+    font-size: 11px;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav > li > a:not(.btn):not(.dropdown-toggle) {
+    padding: 0 10px;
+  }
+}
+.o_main_header > .o_main_header_main > .o_primary_nav > li.dropdown > a {
+  margin-right: 20px;
+}
+@media (min-width: 768px) {
+  .o_main_header > .o_main_header_main > .o_primary_nav > li.open > .o_secondary_nav {
+    visibility: visible;
+    background-color: white;
+    -webkit-transform: translate(0, 0);
+    -ms-transform: translate(0, 0);
+    -o-transform: translate(0, 0);
+    transform: translate(0, 0);
+    -webkit-transition: transform 500ms cubic-bezier(0.55, 0, 0.1, 1) 0ms, visibility 0ms linear 0ms, background-color 0ms linear 500ms;
+    -o-transition: transform 500ms cubic-bezier(0.55, 0, 0.1, 1) 0ms, visibility 0ms linear 0ms, background-color 0ms linear 500ms;
+    transition: transform 500ms cubic-bezier(0.55, 0, 0.1, 1) 0ms, visibility 0ms linear 0ms, background-color 0ms linear 500ms;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav > li.open > .o_secondary_nav .container > .row > div {
+    opacity: 1;
+    -webkit-transform: translate(0, 0);
+    -ms-transform: translate(0, 0);
+    -o-transform: translate(0, 0);
+    transform: translate(0, 0);
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav > li.open > .o_secondary_nav .container > .row > div:nth-child(1) {
+    -webkit-transition-delay: 100ms;
+    transition-delay: 100ms;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav > li.open > .o_secondary_nav .container > .row > div:nth-child(2) {
+    -webkit-transition-delay: 200ms;
+    transition-delay: 200ms;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav > li.open > .o_secondary_nav .container > .row > div:nth-child(3) {
+    -webkit-transition-delay: 300ms;
+    transition-delay: 300ms;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav > li.open > .o_secondary_nav .container > .row > div:nth-child(4) {
+    -webkit-transition-delay: 400ms;
+    transition-delay: 400ms;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav > li.open > .o_secondary_nav .o_store_link {
+    max-height: 50px;
+    -webkit-transition: max-height 500ms cubic-bezier(0.55, 0, 0.1, 1) 300ms;
+    -moz-transition: max-height 500ms cubic-bezier(0.55, 0, 0.1, 1) 300ms;
+    -o-transition: max-height 500ms cubic-bezier(0.55, 0, 0.1, 1) 300ms;
+    transition: max-height 500ms cubic-bezier(0.55, 0, 0.1, 1) 300ms;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav > li.open > .o_secondary_nav::before {
+    opacity: 0.5;
+  }
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav {
+  width: 100%;
+  padding: 15px 0 65px;
+  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.05);
+}
+@media (min-width: 992px) {
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row {
+    margin-left: -45px;
+    margin-right: -45px;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div {
+    padding-left: 45px;
+    padding-right: 45px;
+  }
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div {
+  font-size: 16px;
+  overflow: hidden;
+}
+@media (min-width: 768px) {
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div {
+    height: 340px;
+    padding-top: 10px;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div + div {
+    border-left: 1px solid #f2f2f2;
+  }
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div ul {
+  position: relative;
+  list-style: none;
+  padding: 0;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div ul > li {
+  height: 30px;
+  -webkit-transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1) 100ms;
+  -moz-transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1) 100ms;
+  -o-transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1) 100ms;
+  transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1) 100ms;
+  -webkit-transition-property: height, opacity;
+  transition-property: height, opacity;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div ul > li > a {
+  display: block;
+  height: 100%;
+  line-height: 30px;
+  font-weight: 500;
+  font-size: 1.4rem;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div ul > li.dropdown:not(.open) > a::before,
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div ul > li.dropdown:not(.open) > a::after {
+  -ms-transform-origin: 8px 50% 0;
+  -webkit-transform-origin: 8px 50% 0;
+  -moz-transform-origin: 8px 50% 0;
+  transform-origin: 8px 50% 0;
+  width: 8px;
+  right: 0;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div ul > li.dropdown > ul {
+  position: absolute;
+  top: 30px;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  -webkit-transform: translate(100%, 0);
+  -ms-transform: translate(100%, 0);
+  -o-transform: translate(100%, 0);
+  transform: translate(100%, 0);
+  opacity: 0;
+  filter: alpha(opacity=0);
+  -webkit-transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1) 0;
+  -moz-transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1) 0;
+  -o-transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1) 0;
+  transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1) 0;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div ul > li.dropdown.open > ul {
+  -webkit-transform: translate(0, 0);
+  -ms-transform: translate(0, 0);
+  -o-transform: translate(0, 0);
+  transform: translate(0, 0);
+  opacity: 1;
+  filter: alpha(opacity=100);
+  -webkit-transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1) 100ms;
+  -moz-transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1) 100ms;
+  -o-transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1) 100ms;
+  transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1) 100ms;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div ul.o_sub_opened > li:not(.open) {
+  opacity: 0;
+  height: 0 !important;
+  overflow: hidden;
+  -webkit-transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1) 0;
+  -moz-transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1) 0;
+  -o-transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1) 0;
+  transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1) 0;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div .o_nav_app_family {
+  text-align: center;
+  font-weight: 500;
+  line-height: 2;
+  pointer-events: none;
+  cursor: default;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div .o_nav_app_family::selection,
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div .o_nav_app_family *::selection {
+  background: transparent;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div .o_nav_app_family::-moz-selection,
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div .o_nav_app_family *::-moz-selection {
+  background: transparent;
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div .o_nav_app_family > span {
+  background-image: url("img/apps_families_s.png");
+  background-position: 0px 50%;
   background-repeat: no-repeat;
-  background-position: center center;
-  background-size: contain;
-  text-decoration: none;
-  -webkit-transform: translate(0, 3px);
-  -ms-transform: translate(0, 3px);
-  -o-transform: translate(0, 3px);
-  transform: translate(0, 3px);
+  display: none;
 }
-@media screen and (min-width: 768px) {
-  .index #main_title:before {
-    width: 140px;
-    height: 48px;
-    -webkit-transform: translate(0, 5px);
-    -ms-transform: translate(0, 5px);
-    -o-transform: translate(0, 5px);
-    transform: translate(0, 5px);
+@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div .o_nav_app_family > span {
+    background-image: url("img/2x_apps_families_s.png");
+  }
+}
+@media (min-width: 768px) {
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div .o_nav_app_family > span {
+    display: block;
+    margin: 0 auto;
+    background-size: auto 100%;
+    width: 51px;
+    height: 50px;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div .o_nav_app_family > div {
+    font-size: 0.7em;
+    font-weight: 500;
+    line-height: 1.5;
+    color: #666c75;
+    margin-bottom: 1.3em;
+  }
+}
+@media (min-width: 768px) {
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div.o_website_apps a:hover,
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div.o_website_apps a:focus,
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div.o_website_apps .o_nav_app_family {
+    color: #5b899e;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div.o_sale_apps a:hover,
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div.o_sale_apps a:focus,
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div.o_sale_apps .o_nav_app_family {
+    color: #e46f78;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div.o_sale_apps .o_nav_app_family > span {
+    background-position: -60px 50%;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div.o_operation_apps a:hover,
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div.o_operation_apps a:focus,
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div.o_operation_apps .o_nav_app_family {
+    color: #5c5b80;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div.o_operation_apps .o_nav_app_family > span {
+    background-position: -120px 50%;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div.o_productivity_apps a:hover,
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div.o_productivity_apps a:focus,
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div.o_productivity_apps .o_nav_app_family {
+    color: #d5653e;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .container > .row > div.o_productivity_apps .o_nav_app_family > span {
+    background-position: -181px 50%;
+  }
+}
+.o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav > .o_store_link {
+  position: absolute;
+  top: auto;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  overflow: hidden;
+  display: block;
+  height: 50px;
+  line-height: 50px;
+  border-top: 1px solid #f2f2f2;
+  text-align: center;
+  font-size: 12px;
+  font-weight: 600;
+}
+@media (min-width: 768px) {
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav {
+    display: block;
+    background-color: #fcfcfc;
+    visibility: hidden;
+    z-index: -2;
+    -webkit-transform: translate(0, -115%);
+    -ms-transform: translate(0, -115%);
+    -o-transform: translate(0, -115%);
+    transform: translate(0, -115%);
+    -webkit-transition: transform 333.3333333333333ms cubic-bezier(0.55, 0, 0.1, 1) 0ms, visibility 0ms linear 333.3333333333333ms, background-color 0ms linear 0ms;
+    -o-transition: transform 333.3333333333333ms cubic-bezier(0.55, 0, 0.1, 1) 0ms, visibility 0ms linear 333.3333333333333ms, background-color 0ms linear 0ms;
+    transition: transform 333.3333333333333ms cubic-bezier(0.55, 0, 0.1, 1) 0ms, visibility 0ms linear 333.3333333333333ms, background-color 0ms linear 0ms;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav .container > .row > div {
+    opacity: 0;
+    -webkit-transform: translate(0, -30%);
+    -ms-transform: translate(0, -30%);
+    -o-transform: translate(0, -30%);
+    transform: translate(0, -30%);
+    -webkit-transition: all 500ms cubic-bezier(0.55, 0, 0.1, 1) 0ms;
+    -moz-transition: all 500ms cubic-bezier(0.55, 0, 0.1, 1) 0ms;
+    -o-transition: all 500ms cubic-bezier(0.55, 0, 0.1, 1) 0ms;
+    transition: all 500ms cubic-bezier(0.55, 0, 0.1, 1) 0ms;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav .o_store_link {
+    max-height: 0;
+    -webkit-transition: max-height 250ms cubic-bezier(0.55, 0, 0.1, 1) 0s;
+    -moz-transition: max-height 250ms cubic-bezier(0.55, 0, 0.1, 1) 0s;
+    -o-transition: max-height 250ms cubic-bezier(0.55, 0, 0.1, 1) 0s;
+    transition: max-height 250ms cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav .o_secondary_nav::before {
+    content: "";
+    position: absolute;
+    top: 100%;
+    left: 0;
+    bottom: -1000px;
+    right: 0;
+    display: block;
+    background-color: #000;
+    opacity: 0;
+    -webkit-transition: opacity 500ms cubic-bezier(0.55, 0, 0.1, 1) 0s;
+    -moz-transition: opacity 500ms cubic-bezier(0.55, 0, 0.1, 1) 0s;
+    -o-transition: opacity 500ms cubic-bezier(0.55, 0, 0.1, 1) 0s;
+    transition: opacity 500ms cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  }
+}
+.o_main_header > .o_main_header_main .o_header_buttons {
+  height: 100%;
+  line-height: 50px;
+  float: right;
+}
+.o_main_header > .o_main_header_main .o_header_buttons > * {
+  display: inline-block;
+  float: left;
+}
+.o_main_header > .o_main_header_main .o_header_buttons a:not(.btn) {
+  display: inline-block;
+  padding: 0 20px;
+  font-weight: 600;
+  text-transform: uppercase;
+}
+@media screen and (min-width: 768px) and (max-width: 991px) {
+  .o_main_header > .o_main_header_main .o_header_buttons a:not(.btn) {
+    font-size: 11px;
+  }
+  .o_main_header > .o_main_header_main .o_header_buttons a:not(.btn):not(.dropdown-toggle) {
+    padding: 0 10px;
   }
 }
-#main_navbar {
-  z-index: 100;
+.o_main_header > .o_main_header_main .o_header_buttons a.dropdown-toggle {
+  padding: 0 10px;
+}
+.o_main_header > .o_main_header_main .o_header_buttons a.o_my_cart {
+  padding: 0;
+}
+.o_main_header > .o_main_header_main .o_header_buttons a.o_my_cart .my_cart_quantity {
+  font-family: sans-serif;
+  border-radius: 100%;
+  font-weight: bold;
+  font-size: 90%;
+  padding: 4px 0;
+  min-width: 19px;
+  text-align: center;
+  display: inline-block;
+}
+.o_main_header > .o_main_header_main .o_header_buttons .btn-primary {
+  margin-top: 9px;
+}
+.o_main_header > .o_main_header_main .o_header_buttons > .dropdown {
+  margin: 0 5px;
+}
+@media screen and (min-width: 992px) {
+  .o_main_header > .o_main_header_main .o_header_buttons > .dropdown {
+    margin: 0 15px;
+  }
+}
+.o_main_header > .o_main_header_main .o_header_buttons > .dropdown,
+.o_main_header > .o_main_header_main .o_header_buttons > .dropdown .dropdown-toggle {
+  height: 100%;
+}
+.o_main_header > .o_main_header_main .o_header_buttons > .dropdown > .dropdown-menu {
+  left: auto;
+  right: 0;
+}
+.o_main_header > .o_main_header_main .o_header_buttons > .dropdown > .dropdown-menu li a {
+  padding-top: 5px;
+  padding-bottom: 5px;
+  color: #666c75;
+}
+.o_main_header > .o_sub_nav {
+  min-height: 40px;
+  border: 1px solid rgba(0, 0, 0, 0.05);
+  border-width: 1px 0;
+  background-color: rgba(255, 255, 255, 0.8);
+}
+.o_main_header > .o_sub_nav > .container .navbar-header {
+  height: 38px;
+  line-height: 38px;
+  font-weight: 600;
+  color: #666c75;
+  overflow: hidden;
+}
+.o_main_header > .o_sub_nav > .container .navbar-header .o_app_name_logo,
+.o_main_header > .o_sub_nav > .container .navbar-header .o_app_name_title {
+  -webkit-transform: translate(-61px, 0);
+  -ms-transform: translate(-61px, 0);
+  -o-transform: translate(-61px, 0);
+  transform: translate(-61px, 0);
+  -webkit-transition: transform 400ms ease 0s;
+  -moz-transition: transform 400ms ease 0s;
+  -o-transition: transform 400ms ease 0s;
+  transition: transform 400ms ease 0s;
+}
+.o_main_header > .o_sub_nav > .container .navbar-header:hover {
+  color: #21313a;
+}
+.o_main_header > .o_sub_nav > .container .navbar-header .o_app_name_logo {
+  background-image: url("img/logos/odoo_logo.png");
+  background-image: url("img/logos/odoo_logo.svg");
+  background-position: 0 0;
+  background-repeat: no-repeat;
+  display: inline-block;
+  width: 94.05px;
+  height: 30px;
+  background-size: auto 30px;
+  width: 47.025px;
+  height: 15px;
+  background-size: auto 15px;
+  vertical-align: middle;
+  margin: auto 5px 3px 0;
+}
+.o_main_header > .o_sub_nav > .container .navbar-header .o_app_name_logo.center-block,
+.o_main_header > .o_sub_nav > .container .navbar-header .o_app_name_logo.o_logo_responsive_half {
+  position: relative;
+  margin-left: auto;
+  margin-right: auto;
+  display: block;
+}
+.o_main_header > .o_sub_nav > .container .navbar-header .o_app_name_logo.o_logo_responsive {
+  background-size: cover;
+  width: 100%;
+  height: 0;
+  padding-bottom: 31.9%;
+}
+.o_main_header > .o_sub_nav > .container .navbar-header .o_app_name_logo.o_logo_responsive_half {
+  background-size: cover;
+  width: 50%;
+  height: 0;
+  padding-bottom: 15.94%;
+}
+.o_main_header > .o_sub_nav > .container .navbar-header .o_app_name_title {
+  color: inherit;
+  vertical-align: middle;
+  display: inline-block;
+}
+.o_main_header > .o_sub_nav > .container .navbar-header .o_app_name_title span {
+  margin-right: 5px;
+}
+.o_main_header > .o_sub_nav > .container .nav {
+  margin-right: -15px;
+}
+.o_main_header > .o_sub_nav > .container .nav > li {
+  margin-left: 20px;
+  height: 38px;
+  line-height: 38px;
+}
+.o_main_header > .o_sub_nav > .container .nav > li > a {
+  height: 100%;
+  line-height: 38px;
+  padding: 0;
+  font-size: 12px;
+  font-weight: 500;
+  color: #666c75;
+}
+.o_main_header > .o_sub_nav > .container .nav > li > a:hover,
+.o_main_header > .o_sub_nav > .container .nav > li > a:focus {
+  color: #21313a;
   background-color: transparent;
-  border-radius: 0;
-  border: none;
-  margin: 0;
-  min-height: 45px;
+}
+.o_main_header > .o_sub_nav > .container .nav > li.active > a {
+  color: #21313a;
+  font-weight: 600;
+}
+.o_main_header > .o_sub_nav > .container .call-to-action {
+  line-height: 36px;
+  overflow: hidden;
   width: 100%;
-  position: fixed;
-  top: 0;
-  -webkit-box-shadow: none;
-  box-shadow: none;
+  max-width: 0px;
+  transform-origin: 0 0;
+  -webkit-transition: max-width 0.3s ease 0ms;
+  -o-transition: max-width 0.3s ease 0ms;
+  transition: max-width 0.3s ease 0ms;
+}
+.o_main_header > .o_sub_nav > .container .call-to-action > a {
+  margin-left: 35px;
+  font-weight: 600;
+  padding: 4px 12px;
+  line-height: 1.4em;
+  font-size: 12px!important;
+}
+.o_main_header.o_inverted:not(.o_scrolled) > .o_sub_nav {
+  -webkit-transition: 0.3s background-color;
+  -o-transition: 0.3s background-color;
+  transition: 0.3s background-color;
+  background-color: rgba(255, 255, 255, 0.05);
+  border-color: rgba(255, 255, 255, 0.1);
+}
+.o_main_header.o_inverted:not(.o_scrolled) > .o_sub_nav .nav > li > a,
+.o_main_header.o_inverted:not(.o_scrolled) > .o_sub_nav .o_app_name_title {
+  color: rgba(255, 255, 255, 0.9);
+}
+.o_main_header.o_inverted:not(.o_scrolled) > .o_sub_nav .nav > li > a:hover,
+.o_main_header.o_inverted:not(.o_scrolled) > .o_sub_nav .o_app_name_title:hover,
+.o_main_header.o_inverted:not(.o_scrolled) > .o_sub_nav .nav > li > a:focus,
+.o_main_header.o_inverted:not(.o_scrolled) > .o_sub_nav .o_app_name_title:focus {
+  color: white;
+}
+@media (min-width: 768px) {
+  .o_main_header.o_has_sub_nav {
+    position: absolute;
+  }
+  .o_main_header.o_has_sub_nav.o_scrolled {
+    position: fixed;
+    top: -51px;
+  }
+  .o_main_header.o_inverted {
+    background-color: transparent;
+    color: white;
+  }
+  .o_main_header.o_inverted a:hover,
+  .o_main_header.o_inverted a:focus {
+    color: inherit;
+  }
+  .o_main_header.o_inverted .o_logo {
+    background-position: 100% 0;
+  }
+  .o_main_header.o_inverted .o_logo.o_logo_15.center-block {
+    background-position: 102% 0;
+  }
+  .o_main_header.o_inverted .o_main_header_main > .o_primary_nav > li.dropdown > a::before,
+  .o_main_header.o_inverted .o_main_header_main > .o_primary_nav > li.dropdown > a::after {
+    background-color: white;
+    box-shadow: 0 1px 1px rgba(255, 255, 255, 0.1);
+  }
+  .o_main_header > .o_main_header_main > .o_header_buttons .dropdown.open {
+    background-color: #fcfcfc;
+    color: #5a5f68;
+  }
+  .o_main_header > .o_main_header_main > .o_header_buttons .dropdown.open .dropdown-menu {
+    background-color: #fcfcfc;
+    margin-top: 0;
+    border: none;
+    border-radius: 0;
+    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.17);
+    text-align: left;
+    min-width: 100%;
+    padding-bottom: 12.5px;
+  }
+  .o_main_header > .o_main_header_main > .o_header_buttons .dropdown.open .dropdown-menu.deep_hover:hover {
+    -webkit-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+    -moz-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+    -o-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+    transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+    box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.05);
+  }
+  .o_main_header > .o_main_header_main > .o_header_buttons .dropdown.open .dropdown-menu > li > a {
+    display: block;
+    color: #5a5f68;
+    float: none;
+    text-transform: none;
+    font-weight: normal;
+  }
+}
+.o_main_header.o_scrolled:not(.o_transparent_blocked),
+.o_main_header.o_sub_opened {
+  background-color: #fcfcfc;
+  color: #5a5f68;
+  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.17);
+}
+.o_main_header.o_scrolled:not(.o_transparent_blocked).deep_hover:hover,
+.o_main_header.o_sub_opened.deep_hover:hover {
+  -webkit-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  -moz-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  -o-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.05);
+}
+.o_main_header.o_scrolled:not(.o_transparent_blocked) .o_logo,
+.o_main_header.o_sub_opened .o_logo {
+  background-position: 0 0;
+}
+.o_main_header.o_scrolled:not(.o_transparent_blocked) > .o_main_header_main > .o_primary_nav > li.dropdown > a::before,
+.o_main_header.o_sub_opened > .o_main_header_main > .o_primary_nav > li.dropdown > a::before,
+.o_main_header.o_scrolled:not(.o_transparent_blocked) > .o_main_header_main > .o_primary_nav > li.dropdown > a::after,
+.o_main_header.o_sub_opened > .o_main_header_main > .o_primary_nav > li.dropdown > a::after {
+  background-color: #5a5f68;
+  box-shadow: 0 1px 1px rgba(90, 95, 104, 0.1);
+}
+.o_main_header.o_scrolled .o_sub_nav {
+  background: #fcfcfc;
+}
+.o_main_header.o_scrolled .o_sub_nav > .container .navbar-header > span {
+  -webkit-transform: translate(0, 0);
+  -ms-transform: translate(0, 0);
+  -o-transform: translate(0, 0);
+  transform: translate(0, 0);
+}
+.o_main_header.o_scrolled .o_sub_nav > .container .call-to-action {
+  max-width: 133px;
+}
+.o_main_header.o_sub_opened .o_sub_nav {
+  display: none;
+}
+@media (max-width: 767px) {
+  .o_main_header {
+    position: relative;
+    height: auto;
+    min-height: 50px;
+    background-color: #fcfcfc;
+    color: #5a5f68;
+    box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.17);
+  }
+  .o_main_header.deep_hover:hover {
+    -webkit-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+    -moz-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+    -o-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+    transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+    box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.05);
+  }
+  .o_main_header .o_logo {
+    background-position: 0 0;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav > li.dropdown > a::before,
+  .o_main_header > .o_main_header_main > .o_primary_nav > li.dropdown > a::after {
+    background-color: #5a5f68;
+    box-shadow: 0 1px 1px rgba(90, 95, 104, 0.1);
+  }
+  .o_main_header > .o_main_header_main {
+    position: relative;
+  }
+  .o_main_header > .o_main_header_main > .o_primary_nav,
+  .o_main_header > .o_main_header_main .o_header_buttons {
+    display: none;
+  }
+  .o_main_header > .o_main_header_main > .o_mobile_menu_toggle {
+    position: absolute;
+    top: 0;
+    left: auto;
+    bottom: auto;
+    right: 0;
+    width: 50px;
+    line-height: 50px;
+    font-size: 16.66666667px;
+    text-align: center;
+  }
+  .o_main_header > .o_sub_nav {
+    display: none;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main {
+    margin: 0;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_header_buttons {
+    float: none;
+    background-color: #25252d;
+    padding: 0 15px;
+    box-sizing: content-box;
+    margin: 50px -15px 0;
+    display: block;
+    text-align: center;
+    width: 100%;
+    height: auto;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_header_buttons > * {
+    overflow: visible!important;
+    color: #fcfcfc;
+    float: none;
+    display: inline;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_header_buttons > * > a:not(.btn) {
+    display: initial!important;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_header_buttons > * .dropdown-toggle {
+    color: #fcfcfc !important;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_header_buttons > * .dropdown-menu {
+    position: relative;
+    line-height: 2;
+    background: rgba(255, 255, 255, 0.05);
+    width: 100%;
+    margin: 0 -15px 0;
+    box-sizing: content-box;
+    padding: 5px 15px;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_header_buttons > * .dropdown-menu > li > a {
+    float: none;
+    display: block;
+    margin-bottom: 5px;
+    padding: 10px;
+    color: #fcfcfc !important;
+    font-size: 0.8em;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_header_buttons > * .dropdown-menu > li > a:hover {
+    background: rgba(255, 255, 255, 0.05);
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav {
+    display: block;
+    background-color: #25252d;
+    color: white;
+    margin: 0 -15px 0;
+    padding: 0;
+    float: none;
+    white-space: normal;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav a:hover,
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav a:focus,
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav a:active {
+    color: white;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav li {
+    border: 0 solid #33343d;
+    border-width: 1px 5px 0;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav > li {
+    width: 100%;
+    padding: 0 15px;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav > li.dropdown {
+    padding: 0;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav > li.dropdown > a {
+    display: none;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav > li.dropdown > .dropdown-menu {
+    position: static;
+    display: block;
+    background-color: transparent;
+    box-shadow: none;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav > li.dropdown > .o_secondary_nav {
+    padding: 0;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav > li.dropdown > .o_secondary_nav > .container > .row > div {
+    padding: 0;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav > li.dropdown > .o_secondary_nav > .container > .row > div ul {
+    list-style-type: none;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav > li.dropdown > .o_secondary_nav > .container > .row > div ul > li {
+    height: 50px;
+    padding: 0 15px;
+    border-width: 1px 0 0;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav > li.dropdown > .o_secondary_nav > .container > .row > div ul > li > a {
+    line-height: 50px;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav > li.dropdown > .o_secondary_nav > .container > .row > div ul > li.dropdown.open {
+    height: auto;
+    border: none;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav > li.dropdown > .o_secondary_nav > .container > .row > div ul > li.dropdown.open > ul {
+    position: static;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav > li.dropdown > .o_secondary_nav > .container > .row > div > .o_nav_app_family {
+    height: 50px;
+    line-height: 50px;
+    background-color: #33343d;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav > li.dropdown > .o_secondary_nav > .container > .row > div > .o_nav_app_family > * {
+    display: none;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav > li.dropdown > .o_secondary_nav > .container > .row > div > .o_nav_app_family::after {
+    content: "(Apps)";
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav > li.dropdown > .o_secondary_nav > .o_store_link {
+    position: relative;
+    border: 0 solid #33343d;
+    border-width: 14px 0 0;
+    padding-top: 14px;
+    line-height: 1.5;
+    height: 60px;
+  }
+  .o_main_header.o_mobile_menu_opened > .o_main_header_main > .o_primary_nav > li.dropdown::after {
+    content: "";
+    display: inline-block;
+    width: 100%;
+    height: 20px;
+    margin-bottom: -5px;
+    background-color: #33343d;
+  }
+}
+body > footer {
+  font-size: 14px;
+  position: relative;
+  width: 100%;
+  height: auto;
+  min-height: 300px;
+  background-color: #282f33;
+  color: #888888;
+  z-index: 1;
+}
+@media screen and (min-width: 992px) {
+  body > footer.o_footer_effect {
+    position: absolute;
+    top: auto;
+    left: 0;
+    bottom: 0;
+    right: 0;
+    position: fixed;
+    z-index: 0;
+  }
+}
+body > footer .o_footer_logo {
+  margin-bottom: 3em;
+  margin-top: 3em;
+}
+body > footer a {
+  color: #dcddde;
+}
+body > footer a:hover,
+body > footer a:active,
+body > footer a:focus {
+  color: white;
+}
+body > footer .dropdown-menu a {
+  color: #6b6d70;
+}
+body > footer .dropdown-menu a:hover,
+body > footer .dropdown-menu a:focus {
+  color: #5f6063;
+}
+body > footer .dropdown-menu a:active {
+  color: #ffffff;
 }
-#main_navbar .navbar-toggle {
-  padding: 7px 10px 9px;
+body > footer .divider {
+  margin: 10px 0;
 }
-#main_navbar .navbar-toggle .icon-bar {
-  background: #FFF;
+body > footer ul,
+body > footer ol {
+  list-style: none;
+  padding-left: 0;
 }
-#main_navbar .navbar-nav > li > a {
+body > footer span.menu_title {
+  font-weight: 600;
   color: white;
+}
+body > footer span.menu_title + ul {
+  margin-top: 10px;
+}
+body > footer .o_language_selector,
+body > footer .o_country_selector {
+  display: inline-block;
+  opacity: 0.8;
+  filter: alpha(opacity=80);
+}
+body > footer .o_language_selector a,
+body > footer .o_country_selector a {
+  font-size: 0.9em;
+  font-weight: bold;
+}
+body > footer .o_language_selector img,
+body > footer .o_country_selector img {
+  max-height: 20px;
+  margin-right: 10px;
+  vertical-align: bottom;
+}
+body > footer .o_language_selector:hover,
+body > footer .o_country_selector:hover {
+  opacity: 1;
+  filter: alpha(opacity=100);
+}
+body > footer .o_country_selector {
+  float: right;
+}
+body > footer hr {
+  border-top-color: #3e4950;
+}
+body > footer .o_footer_bottom {
+  background-color: #21272b;
+  color: #dcddde;
+  padding: 1em 0;
+  margin-top: 3em;
+}
+body > footer .o_footer_bottom a {
+  opacity: 0.6;
+  filter: alpha(opacity=60);
+}
+body > footer .o_footer_bottom a:hover {
+  opacity: 1;
+  filter: alpha(opacity=100);
+}
+body > footer .o_footer_bottom .social-links .fa {
+  margin-left: 20px;
+}
+.navbar-aside {
+  position: relative;
+  overflow: hidden;
+  font-family: "Work Sans", sans-serif;
+  font-size: 0.85em;
+  line-height: 1.5;
+  font-weight: 500;
+  overflow-y: auto;
+  height: 100%;
+}
+.navbar-aside.affix {
+  z-index: 2;
+  top: 39px;
+  position: fixed;
+  backface-visibility: hidden;
+}
+@media (max-width: 992px) {
+  .navbar-aside.affix {
+    display: none;
+  }
+}
+.navbar-aside > ul.list-group {
+  margin: 0;
+  z-index: 0;
+}
+.navbar-aside > h3 {
+  margin: 0;
+  padding: 15px 0 10px;
+  text-transform: uppercase;
+  font-weight: 600;
+  font-size: 16px;
+  color: #666c75;
+  overflow-x: hidden;
+  position: relative;
+  z-index: 1;
+  -webkit-box-shadow: 0 10px 9px -10px #d2d2d2;
+  box-shadow: 0 10px 9px -10px #d2d2d2;
+}
+.navbar-aside .logo_box {
+  width: 100%;
+  background: #fdfdfd;
+  position: relative;
+  display: block;
+  padding: 15px 30px 10px;
+  border-bottom: 1px solid rgba(102, 108, 117, 0.1);
+  text-align: center;
+  -webkit-box-shadow: inset 0px 0 40px rgba(114, 122, 142, 0.1);
+  box-shadow: inset 0px 0 40px rgba(114, 122, 142, 0.1);
+}
+.navbar-aside .logo_box .logo {
+  float: left;
+  width: 90%;
+  margin: auto auto 10px 5%;
+  height: 50px;
+  background-image: url('img/odoo_logo_rgb.png');
+  background-repeat: no-repeat;
+  background-position: center center;
+  background-size: contain;
+  text-decoration: none;
+}
+.navbar-aside .gith-container {
+  margin: 0;
+  z-index: 1;
+  position: relative;
+  overflow-x: hidden;
+}
+.navbar-aside .gith-container .gith-link {
+  font-weight: 600;
+  color: #666c75;
+  text-decoration: none;
+  display: inline-block;
+  position: relative;
+  margin: 10px 0;
+  -webkit-transition: color 0.2s;
+  -o-transition: color 0.2s;
+  transition: color 0.2s;
+}
+.navbar-aside .gith-container .gith-link:hover {
+  color: #21313a;
+  text-decoration: none;
+}
+.navbar-aside .gith-container .gith-link:before {
+  width: 20px;
+  height: 20px;
+  opacity: 0.5;
+  filter: alpha(opacity=50);
+  content: '';
+  position: relative;
+  background-image: url('img/github-square_32.png');
+  background-size: 100%;
+  display: inline-block;
+  vertical-align: middle;
+  -webkit-transform: translate(0, -1px);
+  -ms-transform: translate(0, -1px);
+  -o-transform: translate(0, -1px);
+  transform: translate(0, -1px);
+  -webkit-transition: opacity 0.2s;
+  -o-transition: opacity 0.2s;
+  transition: opacity 0.2s;
+}
+.navbar-aside .gith-container .gith-link:hover:before,
+.navbar-aside .gith-container .gith-link:focus:before {
+  opacity: 1;
+  filter: alpha(opacity=100);
+}
+.navbar-aside ul {
+  padding: 0;
+  position: relative;
+  margin-bottom: 0 !important;
+}
+.navbar-aside ul li {
+  padding: 0;
+  margin-bottom: 0;
+}
+.navbar-aside ul li:first-child,
+.navbar-aside ul li:last-child {
   border-radius: 0;
-  padding: 5px;
-  margin: 5px;
+}
+.navbar-aside ul li:first-child {
+  overflow: hidden;
+  border-radius: 2px 0 0 0;
+}
+.navbar-aside ul li > a {
+  display: block;
+  padding: 5px 15px;
+  color: #666c75;
+}
+.navbar-aside ul li > a:hover,
+.navbar-aside ul li > a:focus {
+  color: #21313a;
+}
+.navbar-aside ul ul {
+  max-height: 0;
+  background-color: #f2f2f2;
+  padding-left: 15px;
+  overflow: hidden;
+  -webkit-transition: max-height 0.3s cubic-bezier(0.55, 0, 0.1, 1);
+  -o-transition: max-height 0.3s cubic-bezier(0.55, 0, 0.1, 1);
+  transition: max-height 0.3s cubic-bezier(0.55, 0, 0.1, 1);
+}
+.navbar-aside li.active,
+.navbar-aside li.active:hover,
+.navbar-aside li.active:focus {
+  border-color: #f2f2f2;
   background: transparent;
-  border-bottom: 1px solid transparent;
-  -webkit-transition: border 0.2s;
-  -o-transition: border 0.2s;
-  transition: border 0.2s;
 }
-#main_navbar .navbar-nav > li > a:hover,
-#main_navbar .navbar-nav > li > a:active {
+.navbar-aside li.active > a,
+.navbar-aside li.active:hover > a,
+.navbar-aside li.active:focus > a {
+  color: #21313a;
+}
+.navbar-aside li.active > ul {
+  max-height: 1000px;
+}
+.navbar-aside > ul > li {
+  border-bottom: 1px solid #f2f2f2;
+  background: white;
+}
+.navbar-aside > ul > li > a {
+  padding: 10px 15px;
+}
+.navbar-aside > ul > li:hover > a,
+.navbar-aside > ul > li:focus > a {
+  box-shadow: inset 5px 0 0 -3px #dcddde;
   background-color: transparent;
-  border-bottom: 1px solid white;
 }
-#main_navbar .navbar-nav > li {
-  height: 45px;
-  -webkit-transition: background-color 500ms;
-  -o-transition: background-color 500ms;
-  transition: background-color 500ms;
+.navbar-aside > ul > li.active > a,
+.navbar-aside > ul > li.active:hover > a,
+.navbar-aside > ul > li.active:focus > a {
+  box-shadow: inset 5px 0 0 -3px #21b799;
+}
+.navbar-aside > ul > li.parent > a:after {
+  content: '\e7c1';
+  font-family: 'Material-Design-Icons';
+  opacity: 0.5;
+  position: absolute;
+  top: auto;
+  left: auto;
+  bottom: auto;
+  right: 10px;
+}
+.floating_action_container {
+  position: fixed;
+  right: 8px;
+  bottom: 8px;
+  width: auto;
+  z-index: 800;
+}
+@media (min-width: 992px) {
+  .floating_action_container {
+    display: none;
+  }
 }
-#main_navbar .navbar-nav > li.open {
-  background-color: rgba(158, 88, 139, 0.9);
+#floating_action {
+  width: 56px;
+  height: 56px;
+  display: inline-block;
+  z-index: 0;
   background-color: transparent;
+  border-radius: 50%;
+  padding: 16px;
+  box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 0.05);
+  background-color: #21b799;
+  -webkit-transition: transform 500ms cubic-bezier(0.55, 0, 0.1, 1);
+  -o-transition: transform 500ms cubic-bezier(0.55, 0, 0.1, 1);
+  transition: transform 500ms cubic-bezier(0.55, 0, 0.1, 1);
 }
-#main_navbar .navbar-nav > li.open > a:hover {
-  background: transparent;
-  border-bottom: 1px solid transparent;
+#floating_action i {
+  color: white;
 }
-#main_navbar .dropdown-menu {
-  box-shadow: none;
+#floating_action.active {
+  -webkit-transform: translateZ(0px) rotateZ(-180deg);
+  -moz-transform: translateZ(0px) rotateZ(-180deg);
+  -ms-transform: translateZ(0px) rotateZ(-180deg);
+  -o-transform: translateZ(0px) rotateZ(-180deg);
+  transform: translateZ(0px) rotateZ(-180deg);
+}
+#floating_action_menu {
+  position: absolute;
+  z-index: 1;
+  overflow: hidden;
+  right: 0;
+  width: 380px;
+  bottom: 0;
+  padding: 0;
+  display: block;
+  border-radius: 2px;
+  visibility: hidden;
+  -webkit-transition: all 0.5s;
+  -o-transition: all 0.5s;
+  transition: all 0.5s;
+  -webkit-box-shadow: 0 0 0 transparent;
+  box-shadow: 0 0 0 transparent;
+}
+#floating_action_menu .content {
+  margin: 0;
+  opacity: 0;
+  filter: alpha(opacity=0);
+}
+#floating_action_menu .content li {
   border: none;
-  background-color: rgba(158, 88, 139, 0.9);
+  border-top: 1px solid #DDD;
+}
+#floating_action_menu .content li:first-child {
   border-top: none;
-  border-radius: 0;
+}
+#floating_action_menu .content a {
+  display: inline-block;
+  cursor: pointer;
+  color: #21313a;
+  text-decoration: none;
+  float: left;
+  width: 100%;
+  padding: 5px 10px;
+}
+#floating_action_menu .bubble {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  background: #21b799;
+  content: '';
+  bottom: 28px;
+  right: 28px;
+  color: #fff;
+  border-radius: 50%;
+  -webkit-transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1);
+  -o-transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1);
+  transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1);
+}
+#floating_action_menu:before {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  background: #21b799;
+  content: '';
+  bottom: 28px;
+  right: 28px;
+  color: #fff;
+  border-radius: 50%;
+  -webkit-transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1);
+  -o-transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1);
+  transition: all 300ms cubic-bezier(0.55, 0, 0.1, 1);
+  background: white;
+}
+#floating_action_menu.active {
+  display: block;
+  visibility: visible;
+  -webkit-transition: all 500ms cubic-bezier(0.55, 0, 0.1, 1);
+  -o-transition: all 500ms cubic-bezier(0.55, 0, 0.1, 1);
+  transition: all 500ms cubic-bezier(0.55, 0, 0.1, 1);
+}
+#floating_action_menu.active .bubble,
+#floating_action_menu.active:before {
+  width: 1000px;
+  height: 2000px;
+  border-radius: 50%;
+  opacity: 0;
+  filter: alpha(opacity=0);
+  margin-right: -500px;
+  margin-bottom: -500px;
+  display: block;
+  -webkit-transition: all 0.4s cubic-bezier(0.55, 0, 0.1, 1);
+  -o-transition: all 0.4s cubic-bezier(0.55, 0, 0.1, 1);
+  transition: all 0.4s cubic-bezier(0.55, 0, 0.1, 1);
+}
+#floating_action_menu.active:before {
+  opacity: 1;
+  filter: alpha(opacity=100);
+}
+#floating_action_menu.active .content {
+  position: relative;
+  z-index: 1;
+  opacity: 1;
+  filter: alpha(opacity=100);
+  -webkit-transition: all 500ms cubic-bezier(0.4, 0, 0.2, 1);
+  -o-transition: all 500ms cubic-bezier(0.4, 0, 0.2, 1);
+  transition: all 500ms cubic-bezier(0.4, 0, 0.2, 1);
+}
+@media print {
+  body header,
+  body footer {
+    display: none;
+  }
+  body .fadeInUp,
+  body .fadeIn {
+    opacity: 1 !important;
+    filter: alpha(opacity=100) !important;
+    -webkit-animation: none;
+    -o-animation: none;
+    animation: none;
+  }
+  body #main_navbar {
+    position: relative;
+    display: block;
+    height: 100px!important;
+  }
+  body #main_navbar #main-back {
+    display: none;
+  }
+  body #main_navbar #main_title {
+    position: relative;
+    transform: none;
+  }
+  body #main_navbar .navbar-main {
+    display: none!important;
+  }
+  body main {
+    opacity: 1;
+    filter: alpha(opacity=100);
+    -webkit-animation: none;
+    -o-animation: none;
+    animation: none;
+  }
+  body main aside {
+    display: none;
+  }
+  body main article h1,
+  body main article .h1 {
+    font-size: 2em;
+  }
+  body main article h2,
+  body main article .h2 {
+    font-size: 1.642857143em;
+  }
+  body main article h3,
+  body main article .h3 {
+    font-size: 1.25em;
+  }
+  body main article p,
+  body main article ul,
+  body main article ol,
+  body main article table,
+  body main article blockquote,
+  body main article .alert,
+  body main article .doc-code,
+  body main article .admonition {
+    margin-top: inherit;
+    margin-bottom: inherit;
+    font-size: inherit;
+  }
+  body .floating_action_container {
+    display: none;
+  }
+}
+.o_main_header.o_mobile_menu_opened .mdi-navigation-menu {
+  background-color: #282f33;
+  color: #f2f2f2;
+}
+@media screen and (min-width: 768px) {
+  .o_main_header > .o_sub_nav #o_sub-menu .o_breadcrumb {
+    background-color: transparent;
+    padding: 0;
+    margin: 0 0 0 -15px;
+    height: 38px;
+    line-height: 38px;
+  }
+}
+.o_main_header > .o_sub_nav #o_sub-menu .o_breadcrumb > li {
+  display: block;
+}
+.o_main_header > .o_sub_nav #o_sub-menu .o_breadcrumb > li,
+.o_main_header > .o_sub_nav #o_sub-menu .o_breadcrumb > li > a {
+  height: 30px;
+  line-height: 2;
+}
+.o_main_header > .o_sub_nav #o_sub-menu .o_breadcrumb > li:before {
+  font-weight: 700;
+  float: left;
   padding: 0;
-  margin-top: 0px;
-  -webkit-transition: background-color 500ms;
-  -o-transition: background-color 500ms;
-  transition: background-color 500ms;
+  margin-right: -1px;
+  display: none;
+}
+@media screen and (min-width: 768px) {
+  .o_main_header > .o_sub_nav #o_sub-menu .o_breadcrumb > li {
+    margin-left: 0;
+    margin-right: -1px;
+    height: 38px;
+    line-height: 38px;
+    display: inline-block;
+  }
+  .o_main_header > .o_sub_nav #o_sub-menu .o_breadcrumb > li:before {
+    display: block;
+  }
+  .o_main_header > .o_sub_nav #o_sub-menu .o_breadcrumb > li > a {
+    padding: 0;
+    height: 38px;
+    line-height: 40px;
+    letter-spacing: -0.1px;
+    word-spacing: -1px;
+    font-size: 0.9em;
+    display: inline-block;
+    height: 100%;
+    max-width: 80px;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
+  .o_main_header > .o_sub_nav #o_sub-menu .o_breadcrumb > li:last-child > a {
+    max-width: 170px;
+  }
+}
+@media screen and (min-width: 1980px) {
+  .o_main_header > .o_sub_nav #o_sub-menu .o_breadcrumb > li > a {
+    max-width: 120px;
+  }
+}
+@media screen and (min-width: 1200px) {
+  .o_main_header > .o_sub_nav #o_sub-menu .o_breadcrumb > li:last-child > a {
+    max-width: none;
+  }
+}
+@media screen and (max-width: 767px) {
+  .o_main_header > .o_sub_nav #o_sub-menu .o_breadcrumb > li > a {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+  .o_main_header > .o_sub_nav #o_sub-menu .o_breadcrumb > li > a:before {
+    content: "|";
+    margin-right: 0.5em;
+  }
+  .o_main_header > .o_sub_nav #o_sub-menu .o_breadcrumb > li:nth-child(1) > a:before {
+    display: none;
+  }
+  .o_main_header > .o_sub_nav #o_sub-menu .o_breadcrumb > li:nth-child(2) > a:before {
+    padding-left: 0.5em;
+  }
+  .o_main_header > .o_sub_nav #o_sub-menu .o_breadcrumb > li:nth-child(3) > a:before {
+    padding-left: 1em;
+  }
+}
+@media screen and (max-width: 767px) {
+  .o_main_header.index > .o_sub_nav #o_sub-menu .o_breadcrumb {
+    display: none;
+  }
+}
+.o_main_header > .o_sub_nav {
+  border-radius: 0;
+}
+.o_main_header > .o_sub_nav .navbar-toggle {
+  padding: 0 15px;
+  margin: 0;
+  height: 38px;
+  background-color: #f2f2f2;
+}
+.o_main_header > .o_sub_nav .navbar-toggle span {
+  line-height: 38px;
+}
+.o_main_header > .o_sub_nav .navbar-toggle.collapsed {
+  background-color: #fcfcfc;
+}
+.o_main_header > .o_sub_nav .collapse .nav {
+  margin-right: 0;
+  margin-bottom: 0;
+}
+.o_main_header > .o_sub_nav .collapse .nav:first-of-type {
+  margin-right: -15px;
 }
-#main_navbar .dropdown-menu a {
+.o_main_header > .o_sub_nav .collapse .nav > li {
+  margin: 0;
+}
+.o_main_header > .o_sub_nav .collapse .nav > li > a {
+  padding: 0 0 0 10px;
+}
+.o_main_header > .o_sub_nav .collapse .nav > li.divider {
+  height: auto;
+  line-height: 1;
+  border-bottom: 1px solid #dcddde;
+  padding: 4px 0px 5px;
+}
+.o_main_header > .o_sub_nav .collapse .nav > li.dropdown > a.dropdown-toggle {
+  padding: 0 5px 0 10px;
+}
+.o_main_header > .o_sub_nav .collapse .nav > li.dropdown > a.dropdown-toggle:after {
+  font-family: 'Material-Design-Icons';
+  content: "\e7c1";
+  display: inline-block;
+  text-rendering: geometricPrecision;
+  font-size: 1em;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+@media screen and (max-width: 767px) {
+  .o_main_header > .o_sub_nav .collapse .nav > li.dropdown > a.dropdown-toggle:after {
+    font-size: 1.5em;
+  }
+}
+.o_main_header > .o_sub_nav .collapse .nav > li.dropdown.open {
+  z-index: 1;
+  position: relative;
+  background-color: #dcddde;
+  color: #5a5f68;
+}
+@media screen and (min-width: 768px) {
+  .o_main_header > .o_sub_nav .collapse .nav > li.dropdown.open {
+    background-color: #fcfcfc;
+  }
+}
+.o_main_header > .o_sub_nav .collapse .nav > li.dropdown.open .dropdown-toggle {
+  color: #5a5f68;
+}
+.o_main_header > .o_sub_nav .collapse .nav > li.dropdown.open .dropdown-toggle:hover {
+  color: #21313a;
+}
+.o_main_header > .o_sub_nav .collapse .nav > li.dropdown.open .dropdown-menu {
+  margin-top: 0;
+  border: none;
+  border-radius: 0;
+  text-align: left;
+  min-width: 100%;
+  background-color: #fcfcfc;
+  padding-bottom: 12.5px;
+  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.17);
+}
+.o_main_header > .o_sub_nav .collapse .nav > li.dropdown.open .dropdown-menu.deep_hover:hover {
+  -webkit-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  -moz-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  -o-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.05);
+}
+.o_main_header > .o_sub_nav .collapse .nav > li.dropdown.open .dropdown-menu > li > a {
+  font-size: 12px;
+  display: block;
+  color: #5a5f68;
+  float: none;
+  text-transform: none;
+  font-weight: 500;
+}
+@media screen and (max-width: 767px) {
+  .o_main_header > .o_sub_nav .collapse .nav > li.dropdown.open .dropdown-menu > li > a {
+    padding-left: 10px;
+  }
+}
+.o_main_header > .o_sub_nav .collapse .nav > li.dropdown.open .dropdown-menu > li.active > a {
   color: white;
+  background-color: #4c8c7f;
 }
-#main_navbar .dropdown-menu a:hover {
-  background-color: #b376a2;
+@media screen and (max-width: 767px) {
+  .o_main_header > .o_sub_nav .collapse .nav > li.dropdown.open .dropdown-menu {
+    position: static;
+  }
 }
-#main_navbar.stacked {
-  background-color: #9e588b;
+@media screen and (min-width: 768px) {
+  .o_main_header > .o_sub_nav .collapse .nav > li.dropdown.open .dropdown-menu {
+    background-color: #fcfcfc;
+  }
 }
-#main_navbar.stacked .navbar-nav > li > a:hover,
-#main_navbar.stacked .navbar-nav > li > a:active {
-  background-color: rgba(255, 255, 255, 0.2);
-  background-color: transparent;
+.o_main_header > .o_sub_nav .collapse .nav > li.dropdown.o_dropdown_mobile_nav {
+  margin-left: 0;
+}
+.o_main_header > .o_sub_nav .collapse .nav > li.dropdown.o_dropdown_mobile_nav > .dropdown-toggle:after {
+  position: absolute;
+  top: 0;
+  left: auto;
+  bottom: auto;
+  right: 0;
+}
+.o_main_header > .o_sub_nav .collapse .nav > li.dropdown.o_dropdown_mobile_nav .o_breadcrumb_dropdown_menu > li > a {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
-#main_navbar.stacked .dropdown-menu {
-  background-color: #8e4f7d;
+.o_main_header > .o_sub_nav .collapse .nav > li.dropdown.o_dropdown_mobile_nav .o_breadcrumb_dropdown_menu > li > a:before {
+  content: "|";
+  margin-right: 0.5em;
 }
-#main_navbar.stacked .navbar-nav > li.open {
-  background-color: #8e4f7d;
+.o_main_header > .o_sub_nav .collapse .nav > li.dropdown.o_dropdown_mobile_nav .o_breadcrumb_dropdown_menu > li:nth-child(1) > a:before {
+  display: none;
 }
-#main_navbar.stacked .navbar-nav > li.open > a:hover {
-  background: transparent;
+.o_main_header > .o_sub_nav .collapse .nav > li.dropdown.o_dropdown_mobile_nav .o_breadcrumb_dropdown_menu > li:nth-child(2) > a:before {
+  padding-left: 0.5em;
+}
+.o_main_header > .o_sub_nav .collapse .nav > li.dropdown.o_dropdown_mobile_nav .o_breadcrumb_dropdown_menu > li:nth-child(3) > a:before {
+  padding-left: 1em;
+}
+@media screen and (min-width: 768px) and (max-width: 991px) {
+  .o_main_header > .o_sub_nav > .container > .collapse > .nav > li > a,
+  .o_main_header > .o_sub_nav > .container .o_breadcrumb > li > a {
+    font-size: 10px;
+    font-weight: 600;
+  }
+}
+.o_main_header > .o_sub_nav li.dropdown > a.dropdown-toggle {
+  padding: 0 5px 0 10px;
+}
+.o_main_header > .o_sub_nav li.dropdown > a.dropdown-toggle:after {
+  font-family: 'Material-Design-Icons';
+  content: "\e7c1";
+  display: inline-block;
+  text-rendering: geometricPrecision;
+  font-size: 1em;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
 }
 @media screen and (max-width: 767px) {
-  #main_navbar .open .dropdown-menu {
-    position: absolute;
-    width: 100%;
+  .o_main_header > .o_sub_nav li.dropdown > a.dropdown-toggle:after {
+    font-size: 1.5em;
   }
 }
-#main_navbar .container-fluid,
-#main_navbar .navbar-header,
-#main_navbar .navbar-header .navbar-right,
-#main_navbar .navbar-header .navbar-right li,
-#main_navbar .navbar-header .navbar-left,
-#main_navbar .navbar-header .navbar-left > li {
-  height: 100%;
-  min-height: 45px;
+.o_main_header > .o_sub_nav li.dropdown.open {
+  z-index: 1;
+  position: relative;
+  background-color: #dcddde;
+  color: #5a5f68;
+}
+@media screen and (min-width: 768px) {
+  .o_main_header > .o_sub_nav li.dropdown.open {
+    background-color: #fcfcfc;
+  }
+}
+.o_main_header > .o_sub_nav li.dropdown.open .dropdown-toggle {
+  color: #5a5f68;
+}
+.o_main_header > .o_sub_nav li.dropdown.open .dropdown-toggle:hover {
+  color: #21313a;
+}
+.o_main_header > .o_sub_nav li.dropdown.open .dropdown-menu {
+  margin-top: 0;
+  border: none;
+  border-radius: 0;
+  text-align: left;
+  min-width: 100%;
+  background-color: #fcfcfc;
+  padding-bottom: 12.5px;
+  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.17);
+}
+.o_main_header > .o_sub_nav li.dropdown.open .dropdown-menu.deep_hover:hover {
+  -webkit-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  -moz-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  -o-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.05);
+}
+.o_main_header > .o_sub_nav li.dropdown.open .dropdown-menu > li > a {
+  font-size: 12px;
+  display: block;
+  color: #5a5f68;
+  float: none;
+  text-transform: none;
+  font-weight: 500;
+}
+@media screen and (max-width: 767px) {
+  .o_main_header > .o_sub_nav li.dropdown.open .dropdown-menu > li > a {
+    padding-left: 10px;
+  }
+}
+.o_main_header > .o_sub_nav li.dropdown.open .dropdown-menu > li.active > a {
+  color: white;
+  background-color: #4c8c7f;
+}
+@media screen and (max-width: 767px) {
+  .o_main_header > .o_sub_nav li.dropdown.open .dropdown-menu {
+    position: static;
+  }
+}
+@media screen and (min-width: 768px) {
+  .o_main_header > .o_sub_nav li.dropdown.open .dropdown-menu {
+    background-color: #fcfcfc;
+  }
+}
+.o_main_header > .o_sub_nav li.dropdown.o_dropdown_mobile_nav {
+  margin-left: 0;
+}
+.o_main_header > .o_sub_nav li.dropdown.o_dropdown_mobile_nav > .dropdown-toggle:after {
+  position: absolute;
+  top: 0;
+  left: auto;
+  bottom: auto;
+  right: 0;
+}
+.o_main_header > .o_sub_nav li.dropdown.o_dropdown_mobile_nav .o_breadcrumb_dropdown_menu > li > a {
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.o_main_header > .o_sub_nav li.dropdown.o_dropdown_mobile_nav .o_breadcrumb_dropdown_menu > li > a:before {
+  content: "|";
+  margin-right: 0.5em;
+}
+.o_main_header > .o_sub_nav li.dropdown.o_dropdown_mobile_nav .o_breadcrumb_dropdown_menu > li:nth-child(1) > a:before {
+  display: none;
+}
+.o_main_header > .o_sub_nav li.dropdown.o_dropdown_mobile_nav .o_breadcrumb_dropdown_menu > li:nth-child(2) > a:before {
+  padding-left: 0.5em;
+}
+.o_main_header > .o_sub_nav li.dropdown.o_dropdown_mobile_nav .o_breadcrumb_dropdown_menu > li:nth-child(3) > a:before {
+  padding-left: 1em;
+}
+@media (max-width: 767px) {
+  .o_main_header.o_inverted:not(.o_scrolled) .o_sub_nav {
+    display: block;
+    margin-bottom: 0;
+  }
+  .o_main_header.o_inverted:not(.o_scrolled) .o_sub_nav .nav {
+    margin: 0 0 0 -8px;
+  }
+  .o_main_header.o_inverted:not(.o_scrolled) .o_sub_nav .nav > li > a {
+    color: #666c75;
+  }
+  .o_main_header.o_inverted:not(.o_scrolled) .o_sub_nav .nav > li > a:hover,
+  .o_main_header.o_inverted:not(.o_scrolled) .o_sub_nav .nav > li > a:focus {
+    color: #5a5f68;
+  }
 }
-#main_navbar li.versions {
+.o_main_header.o_inverted:not(.o_scrolled) .o_sub_nav_actions {
   margin-left: 10px;
-  height: auto;
-  cursor: pointer;
-  background-color: #8e4f7d;
 }
-#main_navbar li.versions > a {
-  cursor: pointer;
+.o_main_header.o_inverted:not(.o_scrolled) .o_sub_nav_actions > li {
+  background: rgba(249, 249, 249, 0.1);
+  margin-right: 1px;
 }
-#main_navbar li.versions > a:hover {
-  border-bottom: 1px solid transparent;
+.o_main_header.o_inverted:not(.o_scrolled) .o_sub_nav_actions > li:last-child {
+  margin-right: 0;
+}
+.o_main_header.o_scrolled .o_sub_nav #o_doc_title {
+  opacity: 1;
+  filter: alpha(opacity=100);
+  -webkit-transform: translate(0, 0);
+  -ms-transform: translate(0, 0);
+  -o-transform: translate(0, 0);
+  transform: translate(0, 0);
+  -webkit-transition: opacity 1s, transform 0.3s;
+  -o-transition: opacity 1s, transform 0.3s;
+  transition: opacity 1s, transform 0.3s;
+}
+.o_main_header.o_scrolled .o_sub_nav .o_sub_nav_actions {
+  margin-left: 10px;
+}
+.o_main_header.o_scrolled .o_sub_nav .o_sub_nav_actions:first-of-type {
+  margin-right: -25px;
 }
-#main_navbar li.versions .dropdown-menu {
-  min-width: 80px;
+.o_main_header.o_scrolled .o_sub_nav .o_sub_nav_actions > li {
+  background: rgba(136, 136, 136, 0.1);
+  margin-right: 1px;
+}
+.o_main_header.o_scrolled .o_sub_nav .o_sub_nav_actions > li:last-child {
+  margin-right: 0;
 }
-#main_navbar li.versions.open {
-  background-color: #8e4f7d;
+#wrap {
+  z-index: 1;
+  position: relative;
+  background: #f9f9f9;
+  padding-bottom: 40px;
 }
 main {
   z-index: 0;
   position: relative;
-  margin: 0px auto;
+  margin: -10px auto 0;
   display: block;
   border-radius: 2px;
-  color: #232b41;
-  background-color: #f4f4f4;
-  -webkit-animation: fadeIn 1s;
-  -o-animation: fadeIn 1s;
-  animation: fadeIn 1s;
-  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
-  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
+  background-color: #ffffff;
+  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.17);
+}
+main.deep_hover:hover {
+  -webkit-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  -moz-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  -o-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.05);
 }
 @media screen and (min-width: 768px) {
   main {
-    -webkit-animation: fadeInUp 1s;
-    -o-animation: fadeInUp 1s;
-    animation: fadeInUp 1s;
+    margin: -40px auto 0px;
   }
 }
 main.index {
-  -webkit-animation-name: none;
-  animation-name: none;
   -webkit-box-shadow: none;
   box-shadow: none;
   padding-top: 50px;
@@ -8959,11 +11697,12 @@ main.index .row > h2 {
 main.index .card {
   border-radius: 2px;
   position: relative;
+  overflow: hidden;
   margin-bottom: 20px;
   min-height: 200px;
   background-color: #ffffff;
   will-change: transform;
-  box-shadow: 0 1.5px 4px rgba(0, 0, 0, 0.24), 0 1.5px 6px rgba(0, 0, 0, 0.12);
+  box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 2px 0 rgba(0, 0, 0, 0.05);
   -webkit-transform: scale3d(0, 0, 0) translate3d(50px, 0, 0);
   -moz-transform: scale3d(0, 0, 0) translate3d(50px, 0, 0);
   -ms-transform: scale3d(0, 0, 0) translate3d(50px, 0, 0);
@@ -8973,26 +11712,33 @@ main.index .card {
   -o-transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
   transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
 }
+main.index .card.deep_hover:hover {
+  -webkit-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  -moz-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  -o-transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  transition: box-shadow 0.3s cubic-bezier(0.55, 0, 0.1, 1) 0s;
+  box-shadow: 0 13px 25px 0 rgba(0, 0, 0, 0.1), 0 11px 7px 0 rgba(0, 0, 0, 0.09);
+}
 main.index .card a,
 main.index .card a:hover {
-  color: #232b41;
+  color: #666c75;
   text-decoration: none;
   border-radius: 2px 2px 0 0;
 }
 main.index .card .card-img {
-  -webkit-transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
-  -o-transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
-  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
+  -webkit-transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
+  -o-transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
+  transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
   overflow: hidden;
 }
 main.index .card .card-img span {
-  height: 100%;
-  width: 100%;
   position: relative;
   display: block;
   background-size: cover;
   background-position: 50%;
   will-change: transform;
+  width: 100%;
+  height: 100%;
   -webkit-transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
   -moz-transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
   -ms-transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
@@ -9013,15 +11759,18 @@ main.index .card figcaption {
   filter: alpha(opacity=100);
   display: block;
   font-weight: 400;
-  font-family: Lato, sans-serif;
-  color: #393f4f;
+  font-family: "Work Sans", sans-serif;
+  color: #21313a;
   margin: 0;
   background-color: white;
   font-size: 1.2em;
-  top: 0;
-  position: absolute;
   width: 100%;
   padding: 8px 12px;
+  position: absolute;
+  top: 0;
+  left: auto;
+  bottom: auto;
+  right: auto;
   -webkit-transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
   -o-transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
   transition: all 0.5s cubic-bezier(0.55, 0, 0.1, 1);
@@ -9057,17 +11806,64 @@ main.index.animating .card {
   -o-transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
   transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
 }
+.card-img {
+  background: #75526b;
+  background: -webkit-linear-gradient(99deg, #875a7b 10%, #62495b 90%);
+  background: -moz-linear-gradient(99deg, #875a7b 10%, #62495b 90%);
+  background: -ms-linear-gradient(99deg, #875a7b 10%, #62495b 90%);
+  background: -o-linear-gradient(99deg, #875a7b 10%, #62495b 90%);
+  background: linear-gradient(99deg, #875a7b 10%, #62495b 90%);
+  position: absolute;
+  top: 0;
+  left: auto;
+  bottom: auto;
+  right: 0;
+  -webkit-transform: translate3d(0, 0, 0);
+  transform: translate3d(0, 0, 0);
+  width: 100%;
+  height: 100%;
+  display: block;
+  background-size: cover;
+  background-position: 50%;
+}
 .card.top {
-  background: #9e588b;
+  padding: 10% 0 8%;
+  position: relative;
+  overflow: hidden;
+  margin: 0;
+  background: #75526b;
+  background: -webkit-linear-gradient(99deg, #875a7b 10%, #62495b 90%);
+  background: -moz-linear-gradient(99deg, #875a7b 10%, #62495b 90%);
+  background: -ms-linear-gradient(99deg, #875a7b 10%, #62495b 90%);
+  background: -o-linear-gradient(99deg, #875a7b 10%, #62495b 90%);
+  background: linear-gradient(99deg, #875a7b 10%, #62495b 90%);
   -webkit-animation: fadeIn 1s;
   -o-animation: fadeIn 1s;
   animation: fadeIn 1s;
   -webkit-box-shadow: none;
   box-shadow: none;
-  -webkit-transform-origin: 0px 0px 0px;
-  -moz-transform-origin: 0px 0px 0px;
-  -ms-transform-origin: 0px 0px 0px;
-  transform-origin: 0px 0px 0px;
+  -webkit-transform-origin: 50% 0px 0px;
+  -moz-transform-origin: 50% 0px 0px;
+  -ms-transform-origin: 50% 0px 0px;
+  transform-origin: 50% 0px 0px;
+}
+@media screen and (min-width: 768px) and (max-width: 991px) {
+  .card.top {
+    padding-top: 12%;
+  }
+}
+#wrap.index .card.top {
+  padding: 0 0 4%;
+}
+@media screen and (min-width: 768px) {
+  #wrap.index .card.top {
+    padding-top: 12%;
+  }
+}
+@media screen and (min-width: 1200px) {
+  #wrap.index .card.top {
+    padding-top: 8%;
+  }
 }
 .card.top.stacked {
   background: transparent;
@@ -9075,37 +11871,161 @@ main.index.animating .card {
   -o-transition: background 1s;
   transition: background 1s;
 }
+.card.top:before {
+  content: "";
+  display: block;
+  background-image: url("img/banner_bg.png");
+  background-size: cover;
+  background-position: 50%;
+  position: absolute;
+  top: 0;
+  left: auto;
+  bottom: auto;
+  right: 0;
+  width: 100%;
+  height: 100%;
+}
 .card.top:hover {
   -webkit-box-shadow: none;
   box-shadow: none;
 }
-@media (min-width: 992px) {
+.card.top .card-img {
+  background-image: url("img/banner_bg.png");
+}
+@media screen and (min-width: 768px) and (max-width: 991px) {
   .card.top {
-    padding-top: 10%;
-    padding-bottom: 15%;
+    padding: 12% 0 8%;
+  }
+  #wrap.index .card.top {
+    padding: 12% 0 4%;
   }
 }
-.card-img {
-  top: 0;
-  left: 0;
-  display: block;
-  position: absolute;
-  background-image: url("img/geometric_gradient.png");
-  background-size: cover;
-  background-position: 50%;
-  -webkit-transform: translate3d(0, 0, 0);
-  transform: translate3d(0, 0, 0);
-  width: 100%;
-  height: 100%;
+.card.top .container {
+  position: relative;
+}
+.card.top .container h1 {
+  font-family: "Work Sans", sans-serif;
+  line-height: 1.1;
+  color: #21313a;
+  margin-top: 21px;
+  margin-bottom: 10.5px;
+  font-size: 32px;
+  text-rendering: geometricPrecision;
+  letter-spacing: -0.01em;
+  line-height: 1.4;
+  margin-top: 31.5px;
+  font-weight: 300;
+  color: white;
+}
+.card.top .container h1 small,
+.card.top .container h1 .small {
+  font-weight: normal;
+  line-height: 1;
+  color: #21313a;
+}
+.card.top .container h1 small,
+.card.top .container h1 .small {
+  font-size: 65%;
+}
+@media (min-width: 1200px) {
+  .has_code_col .card.top .container h1 {
+    color: white;
+  }
+}
+.card.top .container h1 b,
+.card.top .container h1 strong,
+.card.top .container h1 a {
+  font-weight: 400;
+}
+@media screen and (min-width: 768px) {
+  .card.top .container h1 {
+    font-family: "Work Sans", sans-serif;
+    line-height: 1.1;
+    color: #21313a;
+    margin-top: 21px;
+    margin-bottom: 10.5px;
+    font-size: 39px;
+    text-rendering: geometricPrecision;
+    letter-spacing: -0.01em;
+    line-height: 1.4;
+    margin-top: 31.5px;
+    font-weight: 300;
+    color: white;
+  }
+  .card.top .container h1 small,
+  .card.top .container h1 .small {
+    font-weight: normal;
+    line-height: 1;
+    color: #21313a;
+  }
+  .card.top .container h1 small,
+  .card.top .container h1 .small {
+    font-size: 65%;
+  }
+  .card.top .container h1 b,
+  .card.top .container h1 strong,
+  .card.top .container h1 a {
+    font-weight: 400;
+  }
+}
+@media screen and (min-width: 768px) and (min-width: 1200px) {
+  .has_code_col .card.top .container h1 {
+    color: white;
+  }
+}
+.card.top.has_banner {
+  background: #282f33;
+}
+.card.top.has_banner:before {
+  display: none;
+}
+.card.top.has_banner .card-img {
+  opacity: 0.35;
+}
+.toctree-wrapper > ul {
+  list-style: none;
+  padding: 0;
+}
+.toctree-wrapper > ul > li.toctree-l1 > span {
+  font-family: "Work Sans", sans-serif;
+  line-height: 1.1;
+  color: #21313a;
+  margin-top: 21px;
+  margin-bottom: 10.5px;
+  font-size: 32px;
+  text-rendering: geometricPrecision;
+  letter-spacing: -0.01em;
+  line-height: 1.4;
+  margin-top: 31.5px;
+  font-weight: 300;
+}
+.toctree-wrapper > ul > li.toctree-l1 > span small,
+.toctree-wrapper > ul > li.toctree-l1 > span .small {
+  font-weight: normal;
+  line-height: 1;
+  color: #21313a;
+}
+.toctree-wrapper > ul > li.toctree-l1 > span small,
+.toctree-wrapper > ul > li.toctree-l1 > span .small {
+  font-size: 65%;
+}
+@media (min-width: 1200px) {
+  .has_code_col .toctree-wrapper > ul > li.toctree-l1 > span {
+    color: white;
+  }
+}
+.toctree-wrapper > ul > li.toctree-l1 > span b,
+.toctree-wrapper > ul > li.toctree-l1 > span strong,
+.toctree-wrapper > ul > li.toctree-l1 > span a {
+  font-weight: 400;
 }
 hr.divider {
-  border-color: rgba(229, 229, 229, 0.4);
+  border-color: rgba(249, 249, 249, 0.4);
   position: absolute;
   width: 900%;
   margin-left: -13px;
 }
-main .alert,
-main .deprecated {
+main .alert {
   padding: 15px;
   border-radius: 0;
   border-width: 0 0 0 3px;
@@ -9116,200 +12036,131 @@ main .deprecated {
   background-color: #eef6f8;
   color: #173038;
 }
-@media (min-width: 480px) {
-  main .alert,
-  main .deprecated {
+@media (min-width: 768px) {
+  main .alert {
     padding-left: 5.5em;
   }
 }
 main .alert > p,
-main .deprecated > p,
-main .alert > ul,
-main .deprecated > ul {
+main .alert > ul {
   margin: .5em 0;
 }
 main .alert > .alert-title,
-main .deprecated > .alert-title,
-main .alert > h3,
-main .deprecated > h3 {
+main .alert > h3 {
   color: #4b9eb6;
 }
 main .alert > .alert-title:before,
-main .deprecated > .alert-title:before,
-main .alert > h3:before,
-main .deprecated > h3:before {
+main .alert > h3:before {
   content: "\e639";
 }
 main .alert > h3,
-main .deprecated > h3,
-main .alert > .alert-title,
-main .deprecated > .alert-title,
-main .alert > p > .versionmodified,
-main .deprecated > p > .versionmodified {
+main .alert > .alert-title {
+  font-size: 1.642857143em;
   line-height: 1em;
   margin: 0 0 10px 0;
   font-size: 14px;
-  font-weight: bold;
-  font-family: Lato, sans-serif;
+  font-weight: 700;
+  font-family: "Work Sans", sans-serif;
 }
 main .alert > h3:before,
-main .deprecated > h3:before,
-main .alert > .alert-title:before,
-main .deprecated > .alert-title:before,
-main .alert > p > .versionmodified:before,
-main .deprecated > p > .versionmodified:before {
+main .alert > .alert-title:before {
   font-family: 'Material-Design-Icons';
   content: "\e639";
   display: inline-block;
   text-rendering: geometricPrecision;
-  transform: translate(0, -0.15em);
+  font-size: 1em;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
   position: absolute;
   top: 50%;
   left: 6px;
+  bottom: auto;
+  right: auto;
+  -webkit-transform: translate(0, -0.15em);
+  -ms-transform: translate(0, -0.15em);
+  -o-transform: translate(0, -0.15em);
+  transform: translate(0, -0.15em);
   font-size: 4em;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
 }
-@media (max-width: 480px) {
+@media (max-width: 768px) {
   main .alert > h3:before,
-  main .deprecated > h3:before,
-  main .alert > .alert-title:before,
-  main .deprecated > .alert-title:before,
-  main .alert > p > .versionmodified:before,
-  main .deprecated > p > .versionmodified:before {
+  main .alert > .alert-title:before {
     display: none;
   }
 }
-main .alert.alert-success,
-main .deprecated.alert-success {
+main .alert.alert-success {
   border-color: #b9dfb9;
   background-color: #eef7ee;
   color: #183518;
 }
 main .alert.alert-success > .alert-title,
-main .deprecated.alert-success > .alert-title,
-main .alert.alert-success > h3,
-main .deprecated.alert-success > h3 {
+main .alert.alert-success > h3 {
   color: #50af51;
 }
 main .alert.alert-success > .alert-title:before,
-main .deprecated.alert-success > .alert-title:before,
-main .alert.alert-success > h3:before,
-main .deprecated.alert-success > h3:before {
+main .alert.alert-success > h3:before {
   content: "\e625";
 }
 main .alert.alert-info,
-main .deprecated.alert-info,
-main .alert.tip,
-main .deprecated.tip {
+main .alert.tip {
   border-color: #b8d9e2;
   background-color: #eef6f8;
   color: #173038;
 }
 main .alert.alert-info > .alert-title,
-main .deprecated.alert-info > .alert-title,
 main .alert.tip > .alert-title,
-main .deprecated.tip > .alert-title,
 main .alert.alert-info > h3,
-main .deprecated.alert-info > h3,
-main .alert.tip > h3,
-main .deprecated.tip > h3 {
+main .alert.tip > h3 {
   color: #4b9eb6;
 }
 main .alert.alert-info > .alert-title:before,
-main .deprecated.alert-info > .alert-title:before,
 main .alert.tip > .alert-title:before,
-main .deprecated.tip > .alert-title:before,
 main .alert.alert-info > h3:before,
-main .deprecated.alert-info > h3:before,
-main .alert.tip > h3:before,
-main .deprecated.tip > h3:before {
+main .alert.tip > h3:before {
   content: "\e639";
 }
 main .alert.alert-warning,
-main .deprecated.alert-warning,
-main .alert.warning,
-main .deprecated.warning,
-main .alert.deprecated,
-main .deprecated.deprecated {
+main .alert.warning {
   border-color: #fceedb;
   background-color: #fef9f3;
   color: #81500b;
 }
 main .alert.alert-warning > .alert-title,
-main .deprecated.alert-warning > .alert-title,
 main .alert.warning > .alert-title,
-main .deprecated.warning > .alert-title,
-main .alert.deprecated > .alert-title,
-main .deprecated.deprecated > .alert-title,
 main .alert.alert-warning > h3,
-main .deprecated.alert-warning > h3,
-main .alert.warning > h3,
-main .deprecated.warning > h3,
-main .alert.deprecated > h3,
-main .deprecated.deprecated > h3,
-main .alert.alert-warning > p > .versionmodified,
-main .deprecated.alert-warning > p > .versionmodified,
-main .alert.warning > p > .versionmodified,
-main .deprecated.warning > p > .versionmodified,
-main .alert.deprecated > p > .versionmodified,
-main .deprecated.deprecated > p > .versionmodified {
+main .alert.warning > h3 {
   color: #f0ad4e;
 }
 main .alert.alert-warning > .alert-title:before,
-main .deprecated.alert-warning > .alert-title:before,
 main .alert.warning > .alert-title:before,
-main .deprecated.warning > .alert-title:before,
-main .alert.deprecated > .alert-title:before,
-main .deprecated.deprecated > .alert-title:before,
 main .alert.alert-warning > h3:before,
-main .deprecated.alert-warning > h3:before,
-main .alert.warning > h3:before,
-main .deprecated.warning > h3:before,
-main .alert.deprecated > h3:before,
-main .deprecated.deprecated > h3:before,
-main .alert.alert-warning > p > .versionmodified:before,
-main .deprecated.alert-warning > p > .versionmodified:before,
-main .alert.warning > p > .versionmodified:before,
-main .deprecated.warning > p > .versionmodified:before,
-main .alert.deprecated > p > .versionmodified:before,
-main .deprecated.deprecated > p > .versionmodified:before {
+main .alert.warning > h3:before {
   content: "\e6a4";
 }
-main .alert.alert-danger,
-main .deprecated.alert-danger {
+main .alert.alert-danger {
   border-color: #f4cecd;
   background-color: #fdf7f7;
   color: #611715;
 }
 main .alert.alert-danger > .alert-title,
-main .deprecated.alert-danger > .alert-title,
-main .alert.alert-danger > h3,
-main .deprecated.alert-danger > h3 {
+main .alert.alert-danger > h3 {
   color: #d9534f;
 }
 main .alert.alert-danger > .alert-title:before,
-main .deprecated.alert-danger > .alert-title:before,
-main .alert.alert-danger > h3:before,
-main .deprecated.alert-danger > h3:before {
+main .alert.alert-danger > h3:before {
   content: "\e6a4";
 }
-main .alert.alert-exercise,
-main .deprecated.alert-exercise {
+main .alert.alert-exercise {
   border-color: #deddde;
   background-color: #f7f7f7;
   color: #393639;
 }
 main .alert.alert-exercise > .alert-title,
-main .deprecated.alert-exercise > .alert-title,
-main .alert.alert-exercise > h3,
-main .deprecated.alert-exercise > h3 {
+main .alert.alert-exercise > h3 {
   color: #938e94;
 }
 main .alert.alert-exercise > .alert-title:before,
-main .deprecated.alert-exercise > .alert-title:before,
-main .alert.alert-exercise > h3:before,
-main .deprecated.alert-exercise > h3:before {
+main .alert.alert-exercise > h3:before {
   -webkit-transform: translate(0, 0);
   -ms-transform: translate(0, 0);
   -o-transform: translate(0, 0);
@@ -9317,23 +12168,45 @@ main .deprecated.alert-exercise > h3:before {
   top: 28px;
   content: "\e709";
 }
-@media (min-width: 1170px) {
-  main .alert.doc-content,
-  main .deprecated.doc-content {
+main .alert.alert-go_to {
+  border-color: #b8d9e2;
+  background-color: #eef6f8;
+  border-width: 2px;
+  margin: 2em auto;
+}
+main .alert.alert-go_to a {
+  color: #25505c;
+}
+main .alert.alert-go_to > .alert-title,
+main .alert.alert-go_to > h3 {
+  color: #4b9eb6;
+}
+main .alert.alert-go_to > .alert-title:before,
+main .alert.alert-go_to > h3:before {
+  content: "\e70d";
+}
+@media (min-width: 1200px) {
+  main .alert.doc-content {
     max-width: 55%;
   }
 }
-main .deprecated .versionmodified {
-  display: block;
+img.img-responsive {
+  margin-bottom: 10.5px;
+}
+.figure h4 {
+  margin: 0.5em 0 1.5em;
+  padding-left: 1em;
+  font-size: 1em;
+  font-style: italic;
 }
 .pq-patch {
-  background: #c2c2c2;
+  background: #dcddde;
 }
 .pq-patch em {
   padding-left: 10px;
 }
 span.menuselection {
-  font-weight: bold;
+  font-weight: 600;
 }
 .list-group-item {
   border: none;
@@ -9343,15 +12216,15 @@ dt {
   margin: .5em 0 .3em;
 }
 blockquote {
-  font-family: Georgia, serif;
-  font-weight: bold;
+  font-family: Georgia, "Times New Roman", Times, serif;
+  font-weight: 600;
   font-style: italic;
 }
 blockquote footer {
-  font-family: sans-serif;
+  font-family: -apple-system, BlinkMacSystemFont, Helvetica, "Helvetica Neue", Arial, sans-serif;
   background: transparent;
   text-align: left;
-  color: #232b41;
+  color: #666c75;
   font-weight: normal;
   font-style: normal;
 }
@@ -9365,7 +12238,8 @@ blockquote footer cite {
 }
 code,
 .code {
-  font-weight: bold;
+  font-size: 0.8em;
+  font-weight: 600;
   color: #0a352d;
   background-color: #def9f4;
 }
@@ -9377,11 +12251,11 @@ dd {
 }
 .code-fields {
   font-size: .9em;
-  border: 2px solid #EAEAEA;
+  border: 2px solid #dcddde;
 }
 .code-fields .code-field-name {
-  font-weight: bold;
-  color: #393f4f;
+  font-weight: 600;
+  color: #21313a;
 }
 .code-fields .code-field-name:after {
   content: ":";
@@ -9396,15 +12270,19 @@ dd {
   list-style: none;
 }
 .code-fields ul strong {
-  color: #393f4f;
+  color: #21313a;
   font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
 }
 .code-fields ul em {
-  color: #393f4f;
+  color: #21313a;
   font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
-  font-weight: bold;
+  font-weight: 600;
   font-size: .9em;
 }
+table,
+.table {
+  font-size: 0.9em;
+}
 .code-class,
 .code-staticmethod,
 .code-classmethod,
@@ -9453,372 +12331,9 @@ dd {
 .code-data p {
   margin-bottom: .5em;
 }
-aside {
-  background: #fdfdfd;
-  margin-top: 45px;
-}
-.navbar-aside,
-#navClone {
-  position: relative;
-  overflow: hidden;
-  background-color: #f4f4f4;
-  -webkit-box-shadow: inset 0px 0 40px rgba(114, 122, 142, 0.1);
-  box-shadow: inset 0px 0 40px rgba(114, 122, 142, 0.1);
-}
-.navbar-aside.affix,
-#navClone.affix {
-  z-index: 2;
-  top: 45px;
-  position: fixed;
-  backface-visibility: hidden;
-}
-@media (max-width: 992px) {
-  .navbar-aside.affix,
-  #navClone.affix {
-    display: none;
-  }
-}
-.navbar-aside > ul.list-group,
-#navClone > ul.list-group {
-  overflow-y: scroll;
-  z-index: 0;
-}
-.navbar-aside > h3,
-#navClone > h3 {
-  margin: 0;
-  padding: 15px 0 10px;
-  text-transform: uppercase;
-  font-weight: 600;
-  font-size: 16px;
-  color: #232b41;
-  overflow-x: hidden;
-  position: relative;
-  z-index: 1;
-  -webkit-box-shadow: 0 10px 9px -10px #d2d2d2;
-  box-shadow: 0 10px 9px -10px #d2d2d2;
-}
-.navbar-aside .logo_box,
-#navClone .logo_box {
-  width: 100%;
-  background: #fdfdfd;
-  position: relative;
-  display: block;
-  padding: 15px 30px 10px;
-  border-bottom: 1px solid rgba(35, 43, 65, 0.1);
-  -webkit-box-shadow: inset 0px 0 40px rgba(114, 122, 142, 0.1);
-  box-shadow: inset 0px 0 40px rgba(114, 122, 142, 0.1);
-  text-align: center;
-}
-.navbar-aside .logo_box .logo,
-#navClone .logo_box .logo {
-  float: left;
-  width: 90%;
-  margin: auto auto 10px 5%;
-  height: 50px;
-  background-image: url(img/odoo_logo_rgb.png);
-  background-repeat: no-repeat;
-  background-position: center center;
-  background-size: contain;
-  text-decoration: none;
-}
-.navbar-aside > .list-group,
-#navClone > .list-group {
-  margin: 0;
-}
-.navbar-aside .gith-container,
-#navClone .gith-container {
-  margin: 0;
-  z-index: 1;
-  position: relative;
-  overflow-x: hidden;
-  -webkit-box-shadow: 0 -10px 9px -10px #d2d2d2;
-  box-shadow: 0 -10px 9px -10px #d2d2d2;
-}
-.navbar-aside .gith-container .gith-link,
-#navClone .gith-container .gith-link {
-  font-weight: 600;
-  color: #232b41;
-  text-decoration: none;
-  display: inline-block;
-  position: relative;
-  margin: 10px 0;
-  -webkit-transition: color 0.2s;
-  -o-transition: color 0.2s;
-  transition: color 0.2s;
-}
-.navbar-aside .gith-container .gith-link:hover,
-#navClone .gith-container .gith-link:hover {
-  color: #393f4f;
-  text-decoration: none;
-}
-.navbar-aside .gith-container .gith-link:before,
-#navClone .gith-container .gith-link:before {
-  width: 20px;
-  height: 20px;
-  opacity: 0.5;
-  filter: alpha(opacity=50);
-  content: "";
-  position: relative;
-  background-image: url("img/github-square_32.png");
-  background-size: 100%;
-  display: inline-block;
-  vertical-align: middle;
-  -webkit-transform: translate(0, -1px);
-  -ms-transform: translate(0, -1px);
-  -o-transform: translate(0, -1px);
-  transform: translate(0, -1px);
-  -webkit-transition: opacity 0.2s;
-  -o-transition: opacity 0.2s;
-  transition: opacity 0.2s;
-}
-.navbar-aside .gith-container .gith-link:hover:before,
-#navClone .gith-container .gith-link:hover:before,
-.navbar-aside .gith-container .gith-link:focus:before,
-#navClone .gith-container .gith-link:focus:before {
-  opacity: 1;
-  filter: alpha(opacity=100);
-}
-.navbar-aside ul,
-#navClone ul {
-  padding: 0;
-  position: relative;
-  margin-bottom: 0!important;
-}
-.navbar-aside ul ul,
-#navClone ul ul {
-  max-height: 0;
-  overflow: hidden;
-}
-.navbar-aside ul li,
-#navClone ul li {
-  padding: 0;
-  position: relative;
-  border-radius: 0;
-  border-bottom: 1px solid rgba(35, 43, 65, 0.1);
-}
-.navbar-aside ul li > a,
-#navClone ul li > a {
-  font-size: 0.7em;
-  border-left: 5px solid transparent;
-  margin: 0;
-  padding: 8px 0 8px 15px;
-  color: #393f4f;
-  font-weight: bold;
-  display: block;
-  border-radius: 0;
-  line-height: 1.2;
-  background: #dbdbdb;
-  border-bottom: none;
-}
-.navbar-aside ul li > a:hover,
-#navClone ul li > a:hover,
-.navbar-aside ul li > a:active,
-#navClone ul li > a:active,
-.navbar-aside ul li > a:focus,
-#navClone ul li > a:focus {
-  text-decoration: none;
-  border-radius: 0;
-  background: #cecece;
-  border-left: 5px solid rgba(33, 183, 153, 0.5);
-}
-.navbar-aside ul li:first-child,
-#navClone ul li:first-child,
-.navbar-aside ul li:last-child,
-#navClone ul li:last-child {
-  border-radius: 0;
-}
-.navbar-aside li.active,
-#navClone li.active {
-  border-color: transparent;
-  background: #e7e7e7;
-  border-bottom: 1px solid rgba(35, 43, 65, 0.1);
-  border-left: 5px solid #21b799, 50%;
-}
-.navbar-aside li.active:hover,
-#navClone li.active:hover,
-.navbar-aside li.active:active,
-#navClone li.active:active,
-.navbar-aside li.active:focus,
-#navClone li.active:focus {
-  border-color: transparent;
-  background: #e7e7e7;
-  border-bottom: 1px solid rgba(35, 43, 65, 0.1);
-  border-left: 5px solid #21b799, 50%;
-}
-.navbar-aside li.active > a,
-#navClone li.active > a {
-  border-left: 5px solid #21b799;
-}
-.navbar-aside > ul > li,
-#navClone > ul > li {
-  border-radius: 0;
-  padding: 0;
-  background: #e7e7e7;
-  border-bottom: 2px solid rgba(35, 43, 65, 0.1);
-}
-.navbar-aside > ul > li > a,
-#navClone > ul > li > a {
-  font-size: 0.9em;
-  color: #393f4f;
-  padding: 12px 30px 12px 5px;
-  background: #e7e7e7;
-}
-.navbar-aside > ul > li.parent > a:after,
-#navClone > ul > li.parent > a:after {
-  content: "\e7c1";
-  position: absolute;
-  right: 10px;
-  font-family: "Material-Design-Icons";
-  opacity: 0.5;
-}
-.navbar-aside > ul > li.active > a,
-#navClone > ul > li.active > a {
-  border-bottom: inherit;
-}
-.navbar-aside > ul > li.active ul,
-#navClone > ul > li.active ul {
-  max-height: 10000px;
-}
-.navbar-aside > ul > li.active.parent > a:after,
-#navClone > ul > li.active.parent > a:after {
-  opacity: 1;
-  color: #21b799;
-}
-.floating_action_container {
-  position: fixed;
-  right: 8px;
-  bottom: 8px;
-  width: auto;
-  z-index: 800;
-}
-@media (min-width: 992px) {
-  .floating_action_container {
-    display: none;
-  }
-}
-#floating_action {
-  width: 56px;
-  height: 56px;
-  display: inline-block;
-  z-index: 0;
-  border-radius: 50%;
-  padding: 16px;
-  box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 0.05);
-  background-color: #21b799;
-  -webkit-transition: transform 500ms cubic-bezier(0.55, 0, 0.1, 1);
-  -o-transition: transform 500ms cubic-bezier(0.55, 0, 0.1, 1);
-  transition: transform 500ms cubic-bezier(0.55, 0, 0.1, 1);
-}
-#floating_action i {
-  color: white;
-}
-#floating_action.active {
-  transform: translateZ(0px) rotateZ(-180deg);
-}
-#floating_action_menu {
-  position: absolute;
-  z-index: 1;
-  overflow: hidden;
-  right: 0;
-  width: 380px;
-  bottom: 0;
-  padding: 0;
-  display: block;
-  border-radius: 2px;
-  -webkit-transition: all 0.5s;
-  -o-transition: all 0.5s;
-  transition: all 0.5s;
-  visibility: hidden;
-  -webkit-box-shadow: 0 0 0 transparent;
-  box-shadow: 0 0 0 transparent;
-}
-#floating_action_menu .content {
-  margin: 0;
-  opacity: 0;
-  filter: alpha(opacity=0);
-}
-#floating_action_menu .content li {
-  border: none;
-  border-top: 1px solid #DDD;
-}
-#floating_action_menu .content li:first-child {
-  border-top: none;
-}
-#floating_action_menu .content a {
-  display: inline-block;
-  cursor: pointer;
-  color: #393f4f;
-  text-decoration: none;
-  float: left;
-  width: 100%;
-  padding: 5px 10px;
-}
-#floating_action_menu .bubble {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  background: #21b799;
-  content: '';
-  bottom: 28px;
-  right: 28px;
-  color: #fff;
-  border-radius: 50%;
-  -webkit-transition: all 300ms cubic-bezier(0.215, 0.61, 0.355, 1);
-  -o-transition: all 300ms cubic-bezier(0.215, 0.61, 0.355, 1);
-  transition: all 300ms cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-#floating_action_menu:before {
-  position: absolute;
-  width: 1px;
-  height: 1px;
-  background: #21b799;
-  content: '';
-  bottom: 28px;
-  right: 28px;
-  color: #fff;
-  border-radius: 50%;
-  -webkit-transition: all 300ms cubic-bezier(0.215, 0.61, 0.355, 1);
-  -o-transition: all 300ms cubic-bezier(0.215, 0.61, 0.355, 1);
-  transition: all 300ms cubic-bezier(0.215, 0.61, 0.355, 1);
-  background: white;
-}
-#floating_action_menu.active {
-  display: block;
-  visibility: visible;
-  -webkit-transition: all 500ms cubic-bezier(0.215, 0.61, 0.355, 1);
-  -o-transition: all 500ms cubic-bezier(0.215, 0.61, 0.355, 1);
-  transition: all 500ms cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-#floating_action_menu.active .bubble,
-#floating_action_menu.active:before {
-  width: 1000px;
-  height: 2000px;
-  border-radius: 50%;
-  opacity: 0;
-  filter: alpha(opacity=0);
-  margin-right: -500px;
-  margin-bottom: -500px;
-  display: block;
-  -webkit-transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
-  -o-transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
-  transition: all 0.4s cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-#floating_action_menu.active:before {
-  opacity: 1;
-  filter: alpha(opacity=100);
-}
-#floating_action_menu.active .content {
-  position: relative;
-  z-index: 1;
-  opacity: 1;
-  filter: alpha(opacity=100);
-  -webkit-transition: all 500ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
-  -o-transition: all 500ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
-  transition: all 500ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-@media (min-width: 1170px) {
+@media (min-width: 1200px) {
   main.has_code_col .doc-aside {
-    color: #7f88a2;
+    color: #dcddde;
   }
   main.has_code_col .doc-aside pre {
     font-size: 12px;
@@ -9828,14 +12343,14 @@ article.doc-body {
   background: #ffffff;
 }
 article.doc-body section.doc-content:first-of-type > p:first-child {
-  margin-bottom: 22px;
-  font-size: 18px;
+  margin-bottom: 21px;
+  font-size: 17px;
   font-weight: 300;
   line-height: 1.4;
 }
 @media (min-width: 768px) {
   article.doc-body section.doc-content:first-of-type > p:first-child {
-    font-size: 24px;
+    font-size: 22.5px;
   }
 }
 .content-switcher {
@@ -9844,30 +12359,32 @@ article.doc-body section.doc-content:first-of-type > p:first-child {
 .content-switcher > ul {
   font-size: 10px;
   padding: 0;
-  margin: 0;
-  opacity: 0.6;
-  filter: alpha(opacity=60);
+  margin: 0 0 10px;
   -webkit-transition: all 0.2s ease;
   -o-transition: all 0.2s ease;
   transition: all 0.2s ease;
 }
 .content-switcher > ul > li {
-  color: #7f88a2;
-  font-weight: bold;
-  border-bottom: 1px solid #646d80;
+  color: text-color;
+  font-weight: 600;
+  border-bottom: 1px solid transparent;
   margin: 5px;
   font-size: 1.3em;
-  -webkit-transition: all 0.2s;
-  -o-transition: all 0.2s;
-  transition: all 0.2s;
   cursor: pointer;
   display: inline-block;
   list-style: none;
+  -webkit-transition: all 0.2s;
+  -o-transition: all 0.2s;
+  transition: all 0.2s;
+  opacity: 0.6;
+  filter: alpha(opacity=60);
 }
 .content-switcher > ul > li.active {
   border-bottom: 1px solid #21b799;
+  opacity: 1;
+  filter: alpha(opacity=100);
 }
-.content-switcher:hover > ul {
+.content-switcher:hover > ul > li {
   opacity: 1;
   filter: alpha(opacity=100);
 }
@@ -9879,16 +12396,27 @@ article.doc-body section.doc-content:first-of-type > p:first-child {
 .content-switcher > .tabs > .active {
   display: block;
 }
+.highlight {
+  background: #21272b;
+  color: #dcddde;
+  border-radius: 4px;
+  margin-bottom: 10.5px;
+}
+.highlight pre {
+  margin-bottom: 0;
+}
 pre {
-  color: #e7e9db;
-  background: #21242a;
-  font-family: monospace;
-  font-weight: bold;
+  font-size: 0.8em;
+  color: #dcddde;
+  background: #21272b;
+  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
+  font-weight: 600;
   position: relative;
   border: none;
   max-width: 100%;
   overflow: auto;
   margin: 0;
+  margin-bottom: 10.5px;
 }
 #mask {
   opacity: 0;
@@ -9928,14 +12456,10 @@ pre {
 #thinking-modular > .navbar-collapse.themes,
 #thinking-modular > .pager.themes,
 #thinking-modular > .panel-body.themes,
-#thinking-modular > .modal-footer.themes {
+#thinking-modular > .modal-header.themes,
+#thinking-modular > .modal-footer.themes,
+#thinking-modular > #wrap > .container.index > .index.themes,
+#thinking-modular > main.has_code_col.themes,
+#thinking-modular > .o_main_header > .o_main_header_main.themes {
   margin-bottom: 3em;
 }
-footer {
-  display: none;
-  background-color: black;
-  color: white;
-  clear: both;
-  text-align: center;
-  padding: 5px;
-}
diff --git a/doc/_extensions/odoo/static/style.less b/doc/_extensions/odoo/static/style.less
index e4fbdabeb21..44811836068 100644
--- a/doc/_extensions/odoo/static/style.less
+++ b/doc/_extensions/odoo/static/style.less
@@ -1,230 +1,279 @@
 // Assets
-@import "bootstrap-3.3.4/less/bootstrap";
+@import "bootstrap-3.3.6/less/bootstrap";
 @import "mdi";
 
 // Define custom variables for style and layout.
 @import "variables";
 
-// Define custom mixins missing in Bootstrap
 @import "mixins";
-
 @import "animations";
-
 @import "typography";
-
 @import "layout";
+@import "header";
+@import "footer";
+@import "aside";
+@import "print";
 
 
 
-html, body {
-  .antialiased;
-}
+// Documentation header's customizations
+// --------------------------------------
+// Header style is based on odoo.com and can be find in the header.less file.
+// The following rules are specific for the documentation website.
 
+.o_main_header {
+  @o-sub-inner-h:  @w-sub-nav-height - 2;
 
+  &.o_mobile_menu_opened .mdi-navigation-menu {
+    background-color: @footer-bg-color;
+    color: @gray-lighter;
+  }
 
+  > .o_sub_nav #o_sub-menu .o_breadcrumb {
 
-// Header
-// -----------------------------------
+    @media screen and (min-width: @screen-sm-min) {
+      background-color: transparent;
+      padding: 0;
+      margin: 0 0 0 -15px;
+      height: @o-sub-inner-h;
+      line-height: @o-sub-inner-h;
+    }
 
+    > li {
+      display: block;
+      &, > a {
+        height: 30px;
+        line-height: 2;
+      }
 
-header {
-  background: @doc_violet;
+      &:before {
+        font-weight: @fw_bold;
+        float: left;
+        padding: 0;
+        margin-right: -1px;
+        display: none;
+      }
 
-  .transition(background 1s);
-  &.stacked{
-    background:transparent;
-    .transition(background 1s);
-  }
-}
+      @media screen and (min-width: @screen-sm-min) {
+        margin-left: 0;
+        margin-right: -1px;
+        height: @o-sub-inner-h;
+        line-height: @o-sub-inner-h;
+        display: inline-block;
 
-#main-back {
-  float  : left;
-  .transition(margin .5s);
-  a:hover{
-    border-bottom: 1px solid transparent!important;
-  }
-}
+        &:before {
+          display: block;
+        }
 
-.index #main-back {
-  visibility: hidden;
-}
+        > a {
+          padding: 0;
+          height: @o-sub-inner-h;
+          line-height: @w-sub-nav-height;
+          letter-spacing: -0.1px;
+          word-spacing: -1px;
+          font-size: 0.9em;
+          display: inline-block;
+          height: 100%;
+          max-width: 80px;
+          overflow: hidden;
+          white-space: nowrap;
+          text-overflow: ellipsis;
+        }
 
-#main_title {
-  line-height: 2.4;
-  color: white;
-  font-weight: 900;
-  white-space: nowrap;
-  position: absolute;
-  bottom: 0;
-  margin:0;
-  will-change: transform;
-  .transform-origin(0% 100% 0px);
-}
+        &:last-child > a {
+          max-width: 170px;
+        }
+      }
 
-.index #main_title {
-  font-weight: 300;
-  &:before {
-    content:"";
-    display: inline-block;
-    width: 75px;
-    height: 25px;
-    margin-right: 9px;
-    background-image: url(img/odoo_logo_white.png);
-    background-repeat: no-repeat;
-    background-position: center center;
-    background-size: contain;
-    text-decoration: none;
-    .translate(0; 3px);
-
-    @media screen and(min-width: @screen-sm){
-      width: 140px;
-      height: 48px;
-      .translate(0; 5px);
+      @media screen and (min-width: 1980px) {
+        > a {
+          max-width: 120px;
+        }
+      }
+
+      @media screen and (min-width: @screen-lg-min) {
+        &:last-child > a {
+          max-width: none;
+        }
+      }
+
+      @media screen and (max-width: @screen-xs-max) {
+        > a {
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+        }
+        > a:before {
+          content: "|";
+          margin-right: 0.5em;
+        }
+        &:nth-child(1) > a:before {
+          display: none;
+        }
+        &:nth-child(2) > a:before {
+          padding-left: 0.5em;
+        }
+        &:nth-child(3) > a:before {
+          padding-left: 1em;
+        }
+      }
     }
   }
-}
 
-#main_navbar {
-  z-index: @zIndex--header;
-  background-color: transparent;
-  border-radius: 0;
-  border: none;
-  margin: 0;
-  min-height: 45px;
-  width: 100%;
-  position: fixed;
-  top:0;
-  .box-shadow(none);
-
-  .navbar-toggle {
-    padding: 7px 10px 9px;
-    .icon-bar {
-      background: #FFF;
+  &.index {
+    @media screen and (max-width: @screen-xs-max ){
+       > .o_sub_nav #o_sub-menu .o_breadcrumb {
+         display: none;
+       }
     }
   }
-  .navbar-nav > li > a {
-    color: white;
+
+  > .o_sub_nav {
     border-radius: 0;
-    padding: 5px;
-    margin: 5px;
-    background: transparent;
-    border-bottom: 1px solid transparent;
-    .transition(border .2s);
 
-    &:hover, &:active {
-      background-color: transparent;
-      border-bottom: 1px solid white;
+    .navbar-toggle {
+      padding: 0 15px;
+      margin: 0;
+      height: @o-sub-inner-h;
+      background-color: @gray-lighter;
+
+      span {
+        line-height: @o-sub-inner-h;
+      }
+
+      &.collapsed {
+        background-color: @w-header-white;
+      }
     }
-  }
-  .navbar-nav {
-    > li {
-      height: 45px;
-      .transition(background-color 500ms);
-      &.open{
-        background-color: fadeout(@doc_violet, 10%);
-        background-color: transparent;
-        > a:hover{
-          background:transparent;
-          border-bottom: 1px solid transparent;
-        };
+
+    .collapse .nav {
+      margin-right: 0;
+      margin-bottom: 0;
+
+      &:first-of-type {
+        margin-right: -15px;
+      }
+
+      > li {
+        margin: 0;
+
+        > a {
+          padding:0 0 0 10px;
+        }
+
+        &.divider {
+          height: auto;
+          line-height: 1;
+          border-bottom: 1px solid @gray-light;
+          padding: 4px 0px 5px;
+        }
+
+        &.dropdown {
+         .o-doc-dropdown();
+        }
       }
     }
-  }
 
-  .dropdown-menu {
-    box-shadow: none;
-    border:none;
-    background-color: fadeout(@doc_violet, 10%);
-    border-top: none;
-    border-radius: 0;
-    padding: 0;
-    margin-top: 0px;
-    .transition(background-color 500ms);
-    a {
-      color: white;
-      &:hover{
-        background-color: lighten(@doc_violet, 10%);
+    > .container > .collapse > .nav,
+    > .container .o_breadcrumb {
+       > li > a {
+        @media screen and (min-width: @screen-sm-min) and ( max-width: @screen-sm-max ) {
+          font-size: 10px;
+          font-weight: @fw_semibold;
+        }
       }
     }
+
+    li.dropdown {
+      .o-doc-dropdown();
+    }
   }
-  &.stacked {
-    background-color: @doc_violet;
-    .navbar-nav > li > a {
-      &:hover, &:active {
-        background-color: fadeout(#fff, 80%);
-        background-color: transparent;
+
+
+  &.o_inverted:not(.o_scrolled) {
+    @media (max-width: @screen-xs-max) {
+      .o_sub_nav {
+        display: block;
+        margin-bottom: 0;
+
+        .nav {
+          margin: 0 0 0 -8px;
+
+          > li > a{
+            color: @text-color;
+
+            &:hover, &:focus {
+              color: @header-link-normal;
+            }
+          }
+        }
       }
     }
-    .dropdown-menu {
-      background-color: darken(@doc_violet,5%);
-    }
-    .navbar-nav {
+
+    .o_sub_nav_actions {
+      margin-left: 10px;
+
       > li {
-        &.open{
-          background-color: darken(@doc_violet,5%);
-          > a:hover{background:transparent};
+        background: fade(@gray-lightest, 10%);
+        margin-right: 1px;
+
+        &:last-child {
+          margin-right: 0
         }
       }
     }
   }
 
-  @media screen and (max-width: 767px) {
-    .open .dropdown-menu {
-      position: absolute;
-      width: 100%;
-    }
-  }
-}
+  &.o_scrolled {
+    .o_sub_nav {
+      #o_doc_title {
+        .opacity(1);
+        .translate(0, 0);
+        .transition(~'opacity 1s, transform 0.3s');
+      }
 
-#main_navbar {
-  .container-fluid,
-  .navbar-header,
-  .navbar-header  .navbar-right,
-  .navbar-header  .navbar-right li,
-  .navbar-header  .navbar-left,
-  .navbar-header  .navbar-left > li {
-    height:100%;
-    min-height: 45px;
-  }
-
-  li.versions {
-    margin-left: 10px;
-    height: auto;
-    cursor: pointer;
-    background-color: darken(@doc_violet,5%);
-    > a {
-      cursor: pointer;
-      &:hover{
-        border-bottom: 1px solid transparent;
+      .o_sub_nav_actions {
+        margin-left: 10px;
+
+        &:first-of-type {
+          margin-right: -25px;
+        }
+
+        > li {
+          background: fade(@gray, 10%);
+          margin-right: 1px;
+
+          &:last-child {
+            margin-right: 0
+          }
+        }
       }
     }
-    .dropdown-menu{
-      min-width: 80px;
-    }
-    &.open{
-      background-color: darken(@doc_violet,5%);
-    }
   }
 }
 
+#wrap {
+  z-index: 1;
+  position: relative;
+  background: @gray-lightest;
+  padding-bottom: 40px;
+}
+
 main {
   z-index: 0;
   position: relative;
-  margin: 0px auto;
+  margin: -10px auto 0;
   display: block;
   border-radius: 2px;
-  color: @doc_text;
-  background-color: @doc_paper_dark;
-  .fadeIn;
-  .shadow-0;
+  background-color: @doc_paper;
+  .deep-1;
 
   @media screen and(min-width: @screen-sm) {
-    .fadeInUp;
+    margin: -40px auto 0px;
   }
 }
 
 main.index {
-  .animation-name(none);
   .box-shadow(none);
   padding-top: 50px;
   background:transparent;
@@ -237,50 +286,49 @@ main.index {
   .card {
     border-radius: 2px;
     position: relative;
+    overflow: hidden;
     margin-bottom: @card_margin-bottom;
     min-height: @card_min-height;
     background-color: @doc_paper;
     will-change: transform;
-    .shadow-1;
+    .deep-2;
     .transform(scale3d(0, 0, 0) translate3d(50px, 0, 0));
-    .transition( all .5s @ease-material);
+    .transition( all .5s @o-ease );
 
     a, a:hover {
-      color: @doc_text;
+      color: @text-color;
       text-decoration: none;
       border-radius: 2px 2px 0 0;
     }
     .card-img{
-      .transition(all .5s @ease-material-3);
+      .transition(all .5s @o-ease);
       overflow:hidden;
       span {
-        height: 100%;
-        width: 100%;
         position: relative;
         display: block;
         background-size: cover;
         background-position: 50%;
         will-change: transform;
+        .square(100%);
         .transform(scale3d(1, 1, 1) translate3d(0, 0, 0));
         .transform-origin(50%);
         .opacity(1);
-        .transition(all .5s @ease-material);
+        .transition(all .5s @o-ease);
       }
     }
     figcaption {
       .opacity(1);
       display: block;
-      font-weight: 400;
+      font-weight: @fw_regular;
       font-family: @headings-font-family;
-      color: @doc_heading;
+      color: @headings-color;
       margin: 0;
       background-color: white;
       font-size: 1.2em;
-      top: 0;
-      position: absolute;
       width: 100%;
       padding: 8px 12px;
-      .transition(all .5s @ease-material);
+      .o-position-absolute(0);
+      .transition(all .5s @o-ease );
     }
 
     &:hover .card-img span{
@@ -310,57 +358,130 @@ main.index {
   }
 }
 
+.card-img {
+  .o-gradient();
+  .o-position-absolute(0, 0);
+  .translate3d(0;0;0);
+  .square(100%);
+  display: block;
+  background-size: cover;
+  background-position: 50%;
+}
 
 .card.top {
-  background: @doc_violet;
+  padding: 10% 0 8%;
+  position: relative;
+  overflow: hidden;
+  margin: 0;
+  .o-gradient();
   .animation(fadeIn 1s);
   .box-shadow(none);
-  .transform-origin(0px 0px 0px);
+  .transform-origin(50% 0px 0px);
+
+  @media screen and (min-width: @screen-sm-min) and (max-width: (@screen-md-min - 1)) {
+    padding-top: 12%;
+  }
+
+  #wrap.index & {
+    padding: 0 0 4%;
+
+    @media screen and (min-width: @screen-sm-min) {
+      padding-top: 12%;
+    }
+
+    @media screen and (min-width: @screen-lg-min) {
+      padding-top: 8%;
+    }
+  }
 
   &.stacked{
     background:transparent;
     .transition(background 1s);
   }
+
+  &:before {
+    content:"";
+    display: block;
+    background-image: url("img/banner_bg.png");
+    background-size: cover;
+    background-position: 50%;
+    .o-position-absolute(0, 0);
+    .square(100%);
+  }
+
   &:hover {
     .box-shadow(none);
   }
 
-  @media (min-width:@w-size-medium) {
-    padding-top: 10%;
-    padding-bottom: 15%;
+  .card-img {
+    background-image: url("img/banner_bg.png");
+  }
+
+  @media screen and (min-width: @screen-sm-min) and (max-width: (@screen-md-min - 1)) {
+    padding: 12% 0 8%;
+
+    #wrap.index & {
+      padding: 12% 0 4%;
+    }
+  }
+
+  .container {
+    position: relative;
+    h1 {
+      .h2;
+      color: white;
+
+      @media screen and (min-width: @screen-sm-min) {
+        .h1;
+        color: white;
+      }
+    }
   }
 }
 
-.card-img {
-  top: 0;
-  left: 0;
-  display: block;
-  position: absolute;
-  background-image: url("img/geometric_gradient.png");
-  background-size: cover;
-  background-position: 50%;
-  .translate3d(0;0;0);
-  .square(100%);
+.card.top.has_banner {
+  background: @footer-bg-color;
+
+  &:before {
+    display: none;
+  }
+
+  .card-img {
+    opacity: 0.35;
+  }
+}
+
+// the first level of an application toctree should look more like sections
+
+.toctree-wrapper > ul {
+    list-style: none;
+    padding: 0;
+
+    > li.toctree-l1 > span {
+        font-family: @headings-font-family;
+        // copy h2 content :/
+        .h2()
+    }
 }
 
 // Elements
 // -----------------------------------------------
 
 hr.divider {
-  border-color: fadeout(@doc_bg, 60%);
+  border-color: fadeout(@gray-lightest, 60%);
   position: absolute;
   width: 900%;
   margin-left: -13px;
 }
 
-main .alert, main .deprecated {
+main .alert {
   padding: 15px;
   border-radius: 0;
   border-width: 0 0 0 3px;
   position: relative;
   max-width: 95%;
   display: inline-block;;
-  @media (min-width: @w-size-small){
+  @media (min-width: @screen-sm-min){
     padding-left: 5.5em;
   }
   > p, > ul {
@@ -368,76 +489,71 @@ main .alert, main .deprecated {
   }
   .alert-info; // 'INFO' is the default style
 
-  > h3, > .alert-title, > p > .versionmodified {
+  > h3, > .alert-title {
+    font-size: 1.642857143em;
     line-height: 1em;
     margin: 0 0 10px 0;
     font-size: 14px;
-    font-weight: bold;
+    font-weight: @fw_bold;
     font-family: @headings-font-family;
 
     &:before {
-      font-family: 'Material-Design-Icons';
-      content: "\e639";
-      display: inline-block;
-      text-rendering: geometricPrecision;
-      transform: translate(0, -0.15em);
-      position: absolute;
-      top: 50%;
-      left: 6px;
+      .mdi-icon("\e639");
+      .o-position-absolute(50%, auto, auto, 6px);
+      .translate(0, -0.15em);
       font-size: 4em;
-      -webkit-font-smoothing: antialiased;
-      -moz-osx-font-smoothing: grayscale;
-      @media (max-width: @w-size-small){
+
+      @media (max-width: @screen-sm-min){
         display:none;
       }
     }
   }
   &.alert-success {
-    border-color: lighten(@doc_success, 30%);
-    background-color: lighten(@doc_success, 45%);
-    color: darken(@doc_success, 35%);
+    border-color: lighten(@brand-success, 30%);
+    background-color: lighten(@brand-success, 45%);
+    color: darken(@brand-success, 35%);
 
     > .alert-title, > h3 {
-      color: @doc_success
+      color: @brand-success
     }
     > .alert-title:before, > h3:before {
       content: "\e625";
     }
   }
   &.alert-info, &.tip {
-    border-color: lighten(@doc_info, 30%);
-    background-color: lighten(@doc_info, 45%);
-    color: darken(@doc_info, 35%);
+    border-color: lighten(@brand-info, 30%);
+    background-color: lighten(@brand-info, 45%);
+    color: darken(@brand-info, 35%);
 
     > .alert-title, > h3 {
-      color: @doc_info;
-      &:before {
-        content: "\e639";
-      }
+      color: @brand-info
+    }
+    > .alert-title:before, > h3:before {
+      content: "\e639";
     }
   }
-  &.alert-warning, &.warning, &.deprecated {
-    border-color: lighten(@doc_warning, 30%);
-    background-color: lighten(@doc_warning, 35%);
-    color: darken(@doc_warning, 35%);
+  &.alert-warning, &.warning {
+    border-color: lighten(@brand-warning, 30%);
+    background-color: lighten(@brand-warning, 35%);
+    color: darken(@brand-warning, 35%);
 
-    > .alert-title, > h3, > p > .versionmodified {
-      color: @doc_warning;
-      &:before {
-        content: "\e6a4";
-      }
+    > .alert-title, > h3 {
+      color: @brand-warning
+    }
+    > .alert-title:before, > h3:before {
+      content: "\e6a4";
     }
   }
   &.alert-danger {
-    border-color: lighten(@doc_danger, 30%);
-    background-color: lighten(@doc_danger, 40%);
-    color: darken(@doc_danger, 35%);
+    border-color: lighten(@brand-danger, 30%);
+    background-color: lighten(@brand-danger, 40%);
+    color: darken(@brand-danger, 35%);
 
     > .alert-title, > h3 {
-      color: @doc_danger;
-      &:before {
-        content: "\e6a4";
-      }
+      color: @brand-danger
+    }
+    > .alert-title:before, > h3:before {
+      content: "\e6a4";
     }
   }
   &.alert-exercise {
@@ -447,31 +563,57 @@ main .alert, main .deprecated {
 
       > .alert-title, > h3 {
           color: @doc_exercise;
-        &:before {
-          .translate(0;0);
-          top: 28px;
-          content: "\e709";
-        }
+      }
+      > .alert-title:before, > h3:before {
+        .translate(0;0);
+        top: 28px;
+        content: "\e709";
       }
   }
 
+  &.alert-go_to {
+    border-color: lighten(@brand-info, 30%);
+    background-color: lighten(@brand-info, 45%);
+    border-width: 2px;
+    margin: 2em auto;
+    a{
+      color: darken(@brand-info, 25%);
+    }
+    > .alert-title, > h3 {
+      color: @brand-info
+    }
+    > .alert-title:before, > h3:before {
+      content: "\e70d";
+    }
+  }
+
   &.doc-content{
-    @media (min-width: @w-size-large) {
+    @media (min-width: @screen-lg-min) {
       max-width: 55%;
     }
   }
 }
-main .deprecated .versionmodified {
-  display: block;
+
+img.img-responsive {
+  margin-bottom: (@line-height-computed / 2);
+}
+
+.figure {
+  h4 {
+    margin: 0.5em 0 1.5em;
+    padding-left: 1em;
+    font-size: 1em;
+    font-style: italic;
+  }
 }
 
 .pq-patch{
-  background: rgb(194, 194, 194);
+  background: @gray-light;
   em {padding-left: 10px;}
 }
 
 span.menuselection{
-  font-weight: bold;
+  font-weight: @fw_semibold;
 }
 
 .list-group-item {
@@ -482,15 +624,15 @@ span.menuselection{
 dt {  margin: .5em 0 .3em;}
 
 blockquote {
-  font-family: Georgia, serif;
-  font-weight: bold;
+  font-family: @font-family-serif;
+  font-weight: @fw_semibold;
   font-style: italic;
 
   footer {
-    font-family: sans-serif;
+    font-family: @font-family-base;
     background: transparent;
     text-align: left;
-    color: @doc_text;
+    color: @text-color;
     font-weight: normal;
     font-style: normal;
 
@@ -498,14 +640,15 @@ blockquote {
       font-style: italic;
     }
   }
-  @media (min-width:@w-size-medium) {
-    border-left: 3px solid fade(@doc_accent, 50%);
+  @media (min-width:@screen-md-min) {
+    border-left: 3px solid fade(@brand-primary, 50%);
   }
 }
 code, .code {
-  font-weight: bold;
-  color: darken(@doc_accent, 30%);
-  background-color: lighten(@doc_accent, 50%);
+  font-size: 0.8em;
+  font-weight: @fw_semibold;
+  color: darken(@brand-primary, 30%);
+  background-color: lighten(@brand-primary, 50%);
 }
 .btn {
   border-radius: 0;
@@ -516,7 +659,8 @@ dd {
 
 .code-fields {
   font-size: .9em;
-  border: 2px solid #EAEAEA;
+  border: 2px solid @gray-light;
+
   .code-field {
   }
 
@@ -524,12 +668,13 @@ dd {
   }
 
   .code-field-name {
-    font-weight: bold;
-    color: @doc_heading;
+    font-weight: @fw_semibold;
+    color: @headings-color;
+
     &:after{
       content:":";
     }
-    @media screen and (min-width: @w-size-medium ){
+    @media screen and (min-width: @screen-md-min){
       font-size: .9em;
       text-align: right;
     }
@@ -539,18 +684,22 @@ dd {
     list-style: none;
 
     strong {
-      color: @doc_heading;
+      color: @headings-color;
       font-family:@font-family-monospace;
     }
     em {
-      color: @doc_heading;
+      color: @headings-color;
       font-family:@font-family-monospace;
-      font-weight: bold;
+      font-weight: @fw_semibold;
       font-size: .9em;
     }
   }
 }
 
+table, .table {
+  font-size: 0.9em;
+}
+
 .code-class,
 .code-staticmethod, .code-classmethod, .code-method, .code-function,
 .code-attribute, .code-data {
@@ -574,312 +723,11 @@ dd {
     }
 }
 
-aside{
-  background: rgb(253, 253, 253);
-  margin-top: 45px;
-}
-
-.navbar-aside, #navClone {
-  position: relative;
-  overflow: hidden;
-  background-color: @doc_paper_dark;
-  .box-shadow(inset 0px 0 40px rgba(114, 122, 142, .1));
-  &.affix {
-    z-index: 2;
-    top: 45px;
-    position:fixed;
-    backface-visibility: hidden;
-    @media (max-width:@w-size-medium) {
-      display: none;
-    }
-  }
-  > ul.list-group{
-    overflow-y: scroll;
-    z-index: 0;
-  }
-
-  > h3 {
-    margin:0;
-    padding: 15px 0 10px;
-    text-transform: uppercase;
-    font-weight: 600;
-    font-size: 16px;
-    color: @doc_text;
-    overflow-x:hidden;
-    position:relative;
-    z-index: 1;
-    .box-shadow(0 10px 9px -10px #d2d2d2);
-  }
-
-  .logo_box{
-    width: 100%;
-    background: rgb(253, 253, 253);
-    position: relative;
-    display: block;
-    padding: 15px 30px 10px;
-    border-bottom: 1px solid fadeout(@doc_text, 90%);
-    .box-shadow(inset 0px 0 40px rgba(114, 122, 142, .1));
-
-    text-align: center;
-    .logo{
-      float: left;
-      width: 90%;
-      margin: auto auto 10px 5%;
-      height: 50px;
-      background-image: url(img/odoo_logo_rgb.png);
-      background-repeat: no-repeat;
-      background-position: center center;
-      background-size: contain;
-      text-decoration: none;
-    }
-  }
-  > .list-group {
-    margin: 0;
-  }
-
-  .gith-container {
-    margin:0;
-    z-index: 1;
-    position: relative;
-    overflow-x:hidden;
-    .box-shadow(0 -10px 9px -10px #d2d2d2;);
-    .gith-link{
-      font-weight: 600;
-      color: @doc_text;
-      text-decoration: none;
-      display: inline-block;
-      position:relative;
-      margin: 10px 0;
-      //z-index: 1;
-      .transition(color .2s);
-      &:hover{
-        color: @doc_heading;
-        text-decoration: none;
-      }
-      &:before {
-        .size(20px;20px);
-        .opacity(.5);
-        content:"";
-        position:relative;
-        background-image: url("img/github-square_32.png");
-        background-size: 100%;
-        display: inline-block;
-        vertical-align: middle;
-        .translate(0;-1px);
-        .transition(opacity .2s);
-      }
-      &:hover, &:focus{
-        &:before {
-          .opacity(1);
-        }
-      }
-    }
-  }
-
-  // All levels
-  ul {
-    padding:0;
-    position:relative;
-    margin-bottom: 0!important;
-    ul {
-      max-height: 0;
-      overflow:hidden;
-    }
-
-    li {
-      padding: 0;
-      position:relative;
-      border-radius: 0;
-      border-bottom: 1px solid fadeout(@doc_text, 90%);
-      > a {
-        font-size: 0.7em;
-        border-left: 5px solid transparent;
-        margin: 0;
-        padding: 8px 0 8px 15px;
-        color: @doc_heading;
-        font-weight: bold;
-        display: block;
-        border-radius: 0;
-        line-height: 1.2;
-        background: darken(@doc_paper_dark, 10%);
-        border-bottom: none;
-
-        &:hover, &:active, &:focus {
-          text-decoration: none;
-          border-radius: 0;
-          background: darken(@doc_paper_dark, 15%);
-          border-left: 5px solid fadeout(@doc_accent, 50%);
-        }
-      }
-
-      &:first-child, &:last-child{
-        border-radius:0;
-      }
-    }
-  }
-  li.active {
-    border-color: transparent;
-    background: darken(@doc_paper_dark, 5%);
-    border-bottom: 1px solid fadeout(@doc_text, 90%);
-    border-left: 5px solid @doc_accent, 50%;
-
-    &:hover, &:active, &:focus{
-      border-color: transparent;
-      background: darken(@doc_paper_dark, 5%);
-      border-bottom: 1px solid fadeout(@doc_text, 90%);
-      border-left: 5px solid @doc_accent, 50%;
-    }
-
-    > a {
-      border-left: 5px solid @doc_accent;
-    }
-  }
-  // First level
-  > ul > li {
-    border-radius: 0;
-    padding:0;
-    background: darken(@doc_paper_dark, 5%);
-    border-bottom: 2px solid fadeout(@doc_text, 90%);
-    > a {
-      font-size: 0.9em;
-      color: @doc_heading;
-      padding: 12px 30px 12px 5px;
-      background: darken(@doc_paper_dark, 5%);
-    }
-    &.parent{
-      > a:after {
-        content:"\e7c1";
-        position:absolute;
-        right: 10px;
-        font-family: "Material-Design-Icons";
-        opacity: 0.5;
-      }
-    }
-    &.active {
-      >a {
-        border-bottom: inherit;
-      }
-      ul{
-        max-height: 10000px;
-      }
-      &.parent{
-        > a:after {
-          opacity:1;
-          color: @doc_accent;
-        }
-      }
-    }
-
-  }
-}
-.floating_action_container {
-  position: fixed;
-  right: 8px;
-  bottom: 8px;
-  width: auto;
-  z-index: @zIndex--float_action;
-
-  @media (min-width:@w-size-medium) {
-    display: none;
-  }
-}
-#floating_action {
-  width: 56px;
-  height: 56px;
-  display: inline-block;
-  z-index: 0;
-  border-radius: 50%;
-  padding: 16px;
-  box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 0.05);
-  background-color: @doc_accent;
-  .transition(transform 500ms @ease-material);
-
-  i {
-    color: white;
-  }
-  &.active {
-    transform: translateZ(0px) rotateZ(-180deg);
-  }
-}
-#floating_action_menu {
-  position: absolute;
-  z-index: 1;
-  overflow: hidden;
-  right: 0;
-  width: 380px;
-  bottom: 0;
-  padding: 0;
-  display: block;
-  border-radius: 2px;
-  .transition(all 0.5s);
-  visibility: hidden;
-  .box-shadow(0 0 0 transparent);
-
-  .content {
-    margin:0;
-    li {
-      border: none;
-      border-top: 1px solid #DDD;
-      &:first-child{
-        border-top: none;
-      }
-    }
-    a {
-      display: inline-block;
-      cursor: pointer;
-      color: @doc_heading;
-      text-decoration: none;
-      float: left;
-      width: 100%;
-      padding: 5px 10px;
-    }
-    .opacity(0);
-  }
-  .bubble {
-    position: absolute;
-    .size(1px; 1px);
-    background: @doc_accent;
-    content: '';
-    bottom: 28px;
-    right: 28px;
-    color: #fff;
-    border-radius: 50%;
-    .transition(all 300ms @ease-material-2);
-  }
-  &:before {
-    .bubble;
-    background: white;
-  }
-  &.active {
-    display: block;
-    visibility: visible;
-    .transition(all 500ms @ease-material-2);
-
-    .bubble, &:before {
-      .size(1000px; 2000px);
-      border-radius: 50%;
-      .opacity(0);
-      margin-right: -500px;
-      margin-bottom: -500px;
-      display: block;
-      .transition(all .4s @ease-material-2);
-    }
-    &:before {
-      .opacity(1);
-    }
-    .content {
-      position: relative;
-      z-index: 1;
-      .opacity(1);
-      .transition(all 500ms cubic-bezier(0.55, 0.055, 0.675, 0.19));
-    }
-  }
-}
-
 main.has_code_col{
-  @media (min-width: @w-size-large) {
+  @media (min-width: @screen-lg-min) {
     .doc-aside {
-      color: lighten(@doc_heading, 30%);
+      color: @gray-light;
+
       pre{
         font-size: 12px;
       }
@@ -901,27 +749,28 @@ article.doc-body {
   > ul {
     font-size: 10px;
     padding: 0;
-    margin: 0;
-    .opacity(0.6);
+    margin: 0 0 10px;
     .transition(all .2s ease);
 
     > li {
-      color: lighten(@doc_heading, 30%);
-      font-weight: bold;
-      border-bottom: 1px solid lighten(@doc_code-bg, 30%);
+      color: text-color;
+      font-weight:  @fw_semibold;
+      border-bottom: 1px solid transparent;
       margin: 5px;
       font-size: 1.3em;
-      .transition(all .2s);
       cursor: pointer;
       display: inline-block;
       list-style: none;
+      .transition(all .2s);
+      .opacity(0.6);
 
       &.active {
-        border-bottom: 1px solid @doc_accent;
+        border-bottom: 1px solid @brand-primary;
+        .opacity(1);
       }
     }
   }
-  &:hover > ul {
+  &:hover > ul > li {
     .opacity(1);
   }
   > .tabs > * {
@@ -934,16 +783,28 @@ article.doc-body {
   }
 }
 
+.highlight {
+  background: @doc_code-bg;
+  color: @gray-light;
+  border-radius: @border-radius-base;
+  margin-bottom: (@line-height-computed / 2);
+  pre {
+    margin-bottom:  0;
+  }
+}
+
 pre {
-  color: #e7e9db;
+  font-size: 0.8em;
+  color: @gray-light;
   background: @doc_code-bg;
-  font-family: monospace;
-  font-weight: bold;
+  font-family: @font-family-monospace;
+  font-weight:  @fw_semibold;
   position: relative;
   border: none;
   max-width: 100%;
   overflow: auto;
   margin: 0;
+  margin-bottom: (@line-height-computed / 2);
 }
 
 #mask {
@@ -953,7 +814,7 @@ pre {
   top: 0;
   left: 0;
   .size(100%; 0);
-  background-color: rgba(0, 0, 0, 0.2);
+  background-color: fade(black, 20%);
   .transition(opacity .3s);
 
   &.active {
@@ -973,15 +834,3 @@ pre {
 }
 
 
-
-footer {
-  display: none;
-  ///  <----------------
-  background-color: black;
-  color: white;
-  clear: both;
-  text-align: center;
-  padding: 5px;
-}
-
-
diff --git a/doc/_extensions/odoo/static/typography.less b/doc/_extensions/odoo/static/typography.less
index 3c6ce8b6967..bcf7fef2acf 100644
--- a/doc/_extensions/odoo/static/typography.less
+++ b/doc/_extensions/odoo/static/typography.less
@@ -1,196 +1,58 @@
-
-
-@import url(https://fonts.googleapis.com/css?family=Lato:300,400,900,300italic,400italic);
-
+// =============================================================================
 // Typography
-@font-size-base: 16px;
-@text-color: @doc_text;
-
-@headings-font-family : Lato, sans-serif;
-@headings-color       : @doc_heading;
-@headings-font-weight : 300;
+// =============================================================================
 
-//** Global textual link color.
-a {.transition(color 0.1s linear); }
-@link-color:            darken(@doc_accent,10%);
-@link-hover-color:      @doc_heading;
-@link-hover-decoration: underline;
-
-
-main, #navClone {
-  font-size: 0.875em;
-  line-height: 1.642857143em;
+// Font rendering
+// ----------------------------------------
+body {
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
 }
-main article {
-  h1, .h1 {
-    font-size: 4.214285714em;
-    line-height: 1.169491527em;
-    margin-top: 0.77966102em;
-    margin-bottom: 0.38983051em;
-  }
-  h2, .h2 {
-    font-size: 2.642857143em;
-    line-height: 1.243243244em;
-    margin-top: 1.24324324em;
-    margin-bottom: 0.62162162em;
-    code{font-size: .5em;}
-  }
-  h3, .h3 {
-    font-size: 1.642857143em;
-    line-height: 1em;
-    margin-top: 1em;
-    margin-bottom: 1em;
-    code{font-size: .5em;}
-  }
-  h4, .h4 {
-    font-size: 1em;
-    line-height: 1.642857143em;
-    margin-top: 1.64285714em;
-    margin-bottom: 1.64285714em;
-  }
-  p, ul, ol, table, blockquote, .alert, .doc-code, .admonition {
-    margin-top: 1.64285714em;
-    margin-bottom: 1.64285714em;
-  }
-
-  a{
-    font-weight: bold;
-  }
 
-  /* Sanitation */
-
-  hr {
-    margin: -1px 0;
-    border-top: 1px solid @doc_bg;
-  }
-  ul ul, ol ol, ul ol, ol ul {
-    margin-top: 0;
-    margin-bottom: 0;
-    margin-left: .5em;
-    padding-left: .5em;
-
-  }
-  ul, ol {
-    padding-left: 1em;
-    margin-left: .5em;
-    li {
-      margin-top: .5em;
-      p {margin:0;}
-      pre, .highlight{ display: inline; border-radius: 0}
-      pre{
-        font-size: .8em;
-        padding: 0.3em .5em;
-      }
-    }
-  }
-  .alert, .doc-content {
-    pre{
-      font-size: .8em;
-      padding: 0.3em .5em;
+// Headings
+// ----------------------------------------
+h1, h2, h3, h4, h5, h6,
+.h1, .h2, .h3, .h4, .h5, .h6 {
+    text-rendering: geometricPrecision;
+    letter-spacing: -0.01em;
+    line-height: 1.4;
+
+    @media (min-width: @screen-lg-min) {
+        .has_code_col &{
+            color: white;
+        }
     }
-  }
-  b, strong, em, small, code {
-    line-height: 1;
-  }
-  sup, sub {
-    vertical-align: baseline;
-    position: relative;
-    top: -0.4em;
-  }
-  sub {
-    top: 0.4em;
-  }
 }
 
-@media screen and (min-width: 992px) {
-  .doc-body {
-    font-size: 1em;
-    line-height: 1.5em;
-    h2 {
-      font-size: 3.565em;
-      line-height: 1.058823528em;
-      margin-top: 1.3em;
-      margin-bottom: 0.505882em;
-      padding-bottom: .2em;
-      border-bottom: 1px solid #EAEAEA;
-    }
-    h3 {
-      font-size: 2.625em;
-      line-height: 1.142857142em;
-      margin-top: 1.14285714em;
-      margin-bottom: 10px;
-    }
-    h4 {
-      font-size: 1.625em;
-      line-height: 1.846153846em;
-      margin-top: 0.92307692em;
-      margin-bottom: 10px;
-      font-weight: 400;
-    }
-    h5 {
-      font-size: 1.5em;
-      line-height: 1.7em;
-      margin-top: 1.5em;
-      margin-bottom: 10px;
-    }
-    p, ul, ol, table, blockquote {
-      margin-top: 1em;
-      margin-bottom: 1em;
+h1, h2, .h1, .h2 {
+    margin-top: @line-height-computed * 1.5;
+    font-weight: @fw_light;
+    b, strong, a {
+        font-weight: @fw_regular;
     }
+}
 
-    pre{
-      margin-top: .1em;
-      margin-bottom: 0em;
+h3, .h3, h4, .h4, h5, h6, .h5, .h6 {
+    font-weight: @fw_regular;
+    b, strong, a {
+        font-weight: @fw_medium;
     }
+}
+h4, .h4, h5, h6, .h5, .h6 {
+    margin-top: @line-height-computed;
+    margin-bottom: (@line-height-computed / 3);
+}
 
-    /* Sanitation */
-    hr {
-      border: 1px solid;
-      margin: -1px 0;
-    }
-    ul ul, ol ol, ul ol, ol ul {
-      margin-top: 0;
-      margin-bottom: 0;
+// Lists
+// ----------------------------------------
+
+ul, ol {
+    &:not(:empty) {
+        margin-bottom: (@line-height-computed / 2);
     }
     ul, ol {
-      padding-left: 1em;
-      margin-left: .5em;
-      li {
-        margin-top: .5em;
-        p { margin:.5em 0;}
-        pre, .highlight{ display: inline; border-radius: 0}
-        pre{
-          font-size: .8em;
-          padding: 0.3em .5em;
+        &:not(:empty) {
+            margin-bottom: (@line-height-computed / 3);
         }
-      }
-    }
-    .alert, .doc-content {
-      pre{
-        font-size: .8em;
-        padding: 0.3em .5em;
-      }
     }
-
-    b, strong, em, small, code {
-      line-height: 1;
-    }
-    sup, sub {
-      vertical-align: baseline;
-      position: relative;
-      top: -0.4em;
-    }
-    sub {
-      top: 0.4em;
-    }
-  }
-}
-
-.guilabel {
-  &:before {
-    content: "❮";
-  }
-  &:after {
-    content: "❯";
-  }
 }
diff --git a/doc/_extensions/odoo/static/variables.less b/doc/_extensions/odoo/static/variables.less
index 446df367bb2..27399411813 100644
--- a/doc/_extensions/odoo/static/variables.less
+++ b/doc/_extensions/odoo/static/variables.less
@@ -1,6 +1,139 @@
+// Based on http://www.odoo.com/openerp_website/static/src/less/variables.less
+// ============================================================================
+
+// Prefixes
+// ==============================================
+@website-2x-prefix       : "2x_";
+
+
+// Odoo Colours
+// ==============================================
+
+@odoo-brand-optional     : #21b799;
+@odoo-brand-primary      : #9E588B;
+
+//== Odoo Colours
+@o-violet-dark           : #875A7B;
+@o-violet-darker         : #62495B;
+
+@o-inverse               : #47738F;
+@o-inverse-dark          : #5B7687;
+@o-inverse-darker        : #485761;
+
+
+//== Grayscale
+@gray-lightest           : #F9F9F9;
+@gray-lighter            : #F2F2F2;
+@gray-light              : #dcddde;
+@gray                    : #888888;
+@gray-dark               : #6B6D70;
+@gray-darker             : #282F33;
+@gray-darkest            : darken(saturate(@gray-darker, 1%), 3%);
+
+//== UI Colors
+@brand-primary           : @odoo-brand-optional;
+@brand-success           : #50AF51;
+@brand-info              : #4B9EB6;
+@brand-warning           : #F0AD4E;
+@brand-danger            : #D9534F;
+
+//== Apps' Families Colours
+@color-alpha             : @brand-primary;
+@color-alpha-dark        : #18856F;
+@color-alpha-light       : #26D1AF;
+@color-alpha-lightest    : #2AEBC4;
+
+@color-beta              : #5B899E;
+@color-beta-dark         : #3D5D6B;
+@color-beta-light        : #699FB8;
+@color-beta-lightest     : #77B5D1;
+
+@color-gamma             : #E46F78;
+@color-gamma-dark        : #B0565C;
+@color-gamma-light       : #FC7C84;
+@color-gamma-lightest    : #FC959C;
+
+@color-delta             : #5C5B80;
+@color-delta-dark        : #37364D;
+@color-delta-light       : #6E6D99;
+@color-delta-lightest    : #807FB3;
+
+@color-epsilon           : #D5653E;
+@color-epsilon-dark      : #A34E2F;
+@color-epsilon-light     : #F07346;
+@color-epsilon-lightest  : #FF8D63;
+
+
+
+@doc_paper_dark          : @gray-lighter;
+@doc_paper               : #fff;
+
+@doc_exercise            : #938E94;
+@doc_code-bg             : @gray-darkest;
+@doc_lime                : #CDDC39;
+@doc_orange              : #FF5722;
+@doc_cyan                : #0097A7;
+
+
+// Typography
+// ===============================================
+
+//== Fonts
+@import url(https://fonts.googleapis.com/css?family=Work+Sans:300,400,500,600,700&subset=latin,latin-ext);
+
+//== Font sizes/weigths
+@font-size-base : 15px;
+
+@fw_light       : 300;
+@fw_regular     : 400;
+@fw_medium      : 500;
+@fw_semibold    : 600;
+@fw_bold        : 700;
+
+//== Paragraphs
+@font-family-base        : -apple-system, BlinkMacSystemFont, Helvetica, "Helvetica Neue", Arial, sans-serif;
+@text-color              : saturate(@gray-dark, 5%);
+
+//== Headings
+@headings-color          : saturate(@gray-darker, 15%);
+@headings-font-family    : "Work Sans", sans-serif;
+@headings-font-weight    : @fw_light;
+@headings-small-color    : @headings-color;
+
+@display1-size           : 6rem;
+@display2-size           : 5.5rem;
+@display3-size           : 4.5rem;
+@display4-size           : 3.5rem;
+
+//== Global textual link color.
+@link-color              : @o-violet-dark;
+@link-hover-color        : desaturate(@odoo-brand-primary, 10%);
+@link-hover-decoration   : none;
+
+//== Mute color.
+@text-muted              : @gray;
+
+
+// Layouting
+// ===============================================
+@body-bg: @gray-lightest;
+
+//== Header
+@w-header-height         : 50px;
+@w-sub-nav-height        : 40px;
+@w-header-white          : #FCFCFC;
+@header-link-normal      : darken(@text-color,5%);
+
+//== Footer
+@footer-heigth           : 300px;
+@footer-bg-color         : @gray-darker;
+@footer-bottom-bg-color  : @gray-darkest;
+@footer-text             : @gray-light;
+@footer-text-mute        : @gray;
+
 
 // ==========================
-// == Variables =============
+// == Docs Variables ========
 // ==========================
 
 // Z-Index Scale (private vars)
@@ -21,50 +154,8 @@
 
 @zIndex--main: 0;
 @zIndex--mask: @zIndex-7;
-@zIndex--header: 100;
 @zIndex--float_action: @zIndex-8;
 @zIndex--toggle_side_menu: @zIndex-8;
-@zIndex--dev: none;
-
-
-// Colors
-// --------------------------------------------------
-
-// Base Colors
-@doc_accent  : #21b799;
-@doc_violet  : #9E588B;
-
-@doc_exercise: #938E94;
-@doc_success : #50AF51;
-@doc_info    : #4B9EB6;
-@doc_warning : #F0AD4E;
-@doc_danger  : #D9534F;
-
-@doc_bg      : #DDDFE4;
-@doc_bg      : #E5E5E5;
-@doc_paper   : #fff;
-@doc_paper_dark: #F4F4F4;
-
-@doc_code-bg : #21242A;
-
-@doc_lime    : #CDDC39;
-@doc_orange  : #FF5722;
-@doc_cyan    : #0097A7;
-
-// Typography
-@doc_text    : #232B41;
-@doc_heading : #393F4F;
-
-
-// Bootstrap Branding Colors
-@brand-success:         @doc_success;
-@brand-info:            @doc_info;
-@brand-warning:         @doc_warning;
-@brand-danger:          @doc_danger;
-
-
-// Layout
-@body-bg: @doc_bg;
 
 
 // Cards
@@ -73,16 +164,9 @@
 @card_margin-bottom: 20px;
 
 
-// Media Queries
-// --------------------------------------------------
-@w-size-small  :  480px;
-@w-size-medium :  992px;
-@w-size-large  : 1170px;
-@w-size-xlarge : 1440px;
-
-
 
 // Easing Curves
-@ease-material:   cubic-bezier(.55, 0, .1, 1);
-@ease-material-2: cubic-bezier(0.215, 0.61, 0.355, 1);
-@ease-material-3: cubic-bezier(0.4, 0, 0.2, 1);
+// --------------------------------------------------
+@o-ease          : cubic-bezier(.55,0,.1,1);
+@ease-material-2 : cubic-bezier(0.215, 0.61, 0.355, 1);
+@ease-material-3 : cubic-bezier(0.4, 0, 0.2, 1);
diff --git a/doc/_extensions/odoo/sub-menu_list.html b/doc/_extensions/odoo/sub-menu_list.html
new file mode 100644
index 00000000000..16677c10e39
--- /dev/null
+++ b/doc/_extensions/odoo/sub-menu_list.html
@@ -0,0 +1,8 @@
+{# note: if odoo.com/page/docs sub-menu's structure change, these links have to change as well #}
+
+<li><a href="http://www.odoo.com/documentation/user/9.0/index.html">User</a></li>
+<li><a href="http://www.odoo.com/documentation/9.0/index.html">Developer</a></li>
+<li><a href="http://www.odoo.com/documentation/9.0/api_integration.html">API</a></li>
+<li><a href="http://www.odoo.com/documentation/9.0/setup/install.html">Installation</a></li>
+<li><a href="http://www.odoo.com/page/odoo-white-paper">White Papers</a></li>
+<li><a href="http://www.odoo.com/page/legal">Legal</a></li>
diff --git a/doc/_extensions/odoo/switchers_list.html b/doc/_extensions/odoo/switchers_list.html
new file mode 100644
index 00000000000..1e90a61ae17
--- /dev/null
+++ b/doc/_extensions/odoo/switchers_list.html
@@ -0,0 +1,25 @@
+{% if languages %}
+<li class="languages dropdown">
+    <a class="dropdown-toggle" href="#" data-toggle="dropdown">
+        {{ language }}
+    </a>
+    <ul class="dropdown-menu" role="menu">
+        {% for name, url in languages %}
+            <li><a href="{{ url }}">{{ name }}</a></li>
+        {% endfor %}
+    </ul>
+</li>
+{% endif %}
+
+{% if versions %}
+<li class="versions dropdown">
+    <a class="dropdown-toggle" href="#" data-toggle="dropdown">
+        {{ version }}
+    </a>
+    <ul class="dropdown-menu" role="menu">
+        {% for name, url in versions %}
+            <li><a href="{{ url }}">{{ name }}</a></li>
+        {% endfor %}
+    </ul>
+</li>
+{% endif %}
diff --git a/doc/_extensions/odoo/translator.py b/doc/_extensions/odoo/translator.py
index 1fd73493098..48c5e901f28 100644
--- a/doc/_extensions/odoo/translator.py
+++ b/doc/_extensions/odoo/translator.py
@@ -247,7 +247,7 @@ class BootstrapTranslator(nodes.NodeVisitor, object):
             'note': 'alert-info',
             'hint': 'alert-info',
             'tip': 'alert-info',
-            'seealso': 'alert-info',
+            'seealso': 'alert-go_to',
 
             'warning': 'alert-warning',
             'attention': 'alert-warning',
@@ -677,3 +677,15 @@ class BootstrapTranslator(nodes.NodeVisitor, object):
 
     # internal node
     def visit_substitution_definition(self, node): raise nodes.SkipNode
+
+    # without set_translator, add_node doesn't work correctly, so the
+    # serialization of html_domain nodes needs to be embedded here
+    def visit_div(self, node):
+        self.body.append(self.starttag(node, 'div'))
+    def depart_div(self, node):
+        self.body.append(u'</div>\n')
+    def visit_address(self, node):
+        self.body.append(self.starttag(node, 'address'))
+    def depart_address(self, node):
+        self.body.append(u'</address>')
+    # TODO: inline elements