diff --git a/app/Resources/public/css/base.css b/app/Resources/public/css/base.css
index 3291c7c793..15cc175818 100644
--- a/app/Resources/public/css/base.css
+++ b/app/Resources/public/css/base.css
@@ -6429,3 +6429,23 @@ input.form-control[type="color"] {
     padding: 2px;
 }
 
+/* Extra small devices (phones, less than 768px) */
+/* No media query since this is the default in Bootstrap */
+
+/* Small devices (tablets, 768px and up) */
+@media (min-width: 768px) {
+
+}
+
+/* Medium devices (desktops, 992px and up) */
+@media (min-width: 992px) {
+    div.navbar-collapse {
+        padding-left: 0;
+    }
+}
+
+/* Large devices (large desktops, 1200px and up) */
+@media (min-width: 1200px) {
+
+}
+
diff --git a/main/inc/lib/banner.lib.php b/main/inc/lib/banner.lib.php
index 1e19a8ccf7..863ebb96f5 100755
--- a/main/inc/lib/banner.lib.php
+++ b/main/inc/lib/banner.lib.php
@@ -702,9 +702,8 @@ function return_breadcrumb($interbreadcrumb, $language_file, $nameTools)
         }
 
         // View as student/teacher link
-        $view = null;
         if (!empty($view_as_student_link)) {
-            $view .= Display::tag('div', $view_as_student_link, array('id' => 'view_as_link','class' => 'pull-right'));
+            $html .= Display::tag('div', $view_as_student_link, array('id' => 'view_as_link','class' => 'pull-right'));
         }
 
         if (!empty($navigation_right)) {
@@ -715,7 +714,6 @@ function return_breadcrumb($interbreadcrumb, $language_file, $nameTools)
         }
 
         if (!empty($lis)) {
-            $html .= $view;
             $html .= Display::tag('ul', $lis, array('class'=>'breadcrumb'));
         }
 
diff --git a/main/template/default/layout/layout_1_col.tpl b/main/template/default/layout/layout_1_col.tpl
index 3ea3ec7f6c..887b6132e7 100755
--- a/main/template/default/layout/layout_1_col.tpl
+++ b/main/template/default/layout/layout_1_col.tpl
@@ -1,6 +1,7 @@
 {% extends template ~ "/layout/page.tpl" %}
 
 {% block body %}
+    <div class="row">
     {% if plugin_main_top %}
         <div id="plugin_main_top" class="col-md-12">
             {{ plugin_main_top }}
@@ -35,4 +36,5 @@
             {{ plugin_main_bottom }}
         </div>
     {% endif %}
+    </div>
 {% endblock %}
diff --git a/main/template/default/layout/layout_2_col.tpl b/main/template/default/layout/layout_2_col.tpl
index 3e8a1ad797..f9857d14d3 100755
--- a/main/template/default/layout/layout_2_col.tpl
+++ b/main/template/default/layout/layout_2_col.tpl
@@ -1,6 +1,7 @@
 {% extends template ~ "/layout/page.tpl" %}
 
 {% block body %}
+    <div class="row">
 {% if plugin_main_top %}
     <div id="plugin_main_top" class="col-md-12">
         {{ plugin_main_top }}
@@ -93,4 +94,5 @@
         {{ plugin_main_bottom }}
     </div>
 {% endif %}
+    </div>
 {% endblock %}
diff --git a/main/template/default/layout/menu.tpl b/main/template/default/layout/menu.tpl
index a262536395..6423cfd445 100755
--- a/main/template/default/layout/menu.tpl
+++ b/main/template/default/layout/menu.tpl
@@ -2,7 +2,8 @@
     <div class="container">
         <!-- Brand and toggle get grouped for better mobile display -->
         <div class="navbar-header">
-            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#menuone" aria-expanded="false">
+            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#menuone"
+                    aria-expanded="false">
                 <span class="sr-only">Toggle navigation</span>
                 <span class="icon-bar"></span>
                 <span class="icon-bar"></span>
@@ -18,59 +19,57 @@
                     </li>
                 {% endfor %}
             </ul>
-           {% if _u.logged == 1 %}
-               <script>
-               $(document).ready(function() {
-                    $.ajax({
-                        type: "GET",
-                        url: "{{ _p.web_main }}inc/ajax/message.ajax.php?a=get_count_message",
-                        success: function(data) {
-                            if (data != '') {
-                                $("#count_message_li").show();
-                                $("#count_message").html(data);
-                            }
-                        }
+            {% if _u.logged == 1 %}
+                <script>
+                    $(document).ready(function () {
+                        $("#count_message")
+                            .load('{{ _p.web_main }}inc/ajax/message.ajax.php?a=get_count_message', function () {
+                                $("#count_message_li").removeClass('hidden');
+                            });
                     });
-                });
-               </script>
-            <ul class="nav navbar-nav navbar-right">
-               <li id="count_message_li" style="display: none">
-                   <a href="{{ message_url }}">
-                       <span id="count_message"></span>
-                   </a>
-               </li>
-               {% if _u.status != 6 %}
-                <li class="dropdown avatar-user">
-                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
-                        <img class="img-circle" src="{{ _u.avatar_small }}" alt="{{ _u.complete_name }}" />  <span class="caret"></span>
-                    </a>
-                    <ul class="dropdown-menu" role="menu">
-                        <li class="user-header">
-                            <div class="text-center">
-                            <img class="img-circle" src="{{ _u.avatar_medium }}" alt="{{ _u.complete_name }}" />
-                            <p class="name"><a href="{{ profile_url }}">{{ _u.complete_name }}</a></p>
-                            <p><i class="fa fa-envelope-o" aria-hidden="true"></i> {{ _u.email }}</p>
-                            </div>
-                        </li>
-                        <li role="separator" class="divider"></li>
-                        <li class="user-body">
-                            <a title="{{ "Inbox"|get_lang }}" href="{{ message_url }}">
-                                <em class="fa fa-envelope" aria-hidden="true"></em> {{ "Inbox"|get_lang }}
-                            </a>
-                            {% if certificate_url %}
-                            <a title="{{ "MyCertificates"|get_lang }}" href="{{ certificate_url }}">
-                                <em class="fa fa-graduation-cap" aria-hidden="true"></em> {{ "MyCertificates"|get_lang }}
+                </script>
+                <ul class="nav navbar-nav navbar-right">
+                    <li id="count_message_li" class="hidden">
+                        <a href="{{ message_url }}">
+                            <span id="count_message"></span>
+                        </a>
+                    </li>
+                    {% if _u.status != 6 %}
+                        <li class="dropdown avatar-user">
+                            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button"
+                               aria-expanded="false">
+                                <img class="img-circle" src="{{ _u.avatar_small }}" alt="{{ _u.complete_name }}"/> <span
+                                        class="caret"></span>
                             </a>
-                            {% endif %}
+                            <ul class="dropdown-menu" role="menu">
+                                <li class="user-header">
+                                    <div class="text-center">
+                                        <img class="img-circle" src="{{ _u.avatar_medium }}"
+                                             alt="{{ _u.complete_name }}"/>
+                                        <p class="name"><a href="{{ profile_url }}">{{ _u.complete_name }}</a></p>
+                                        <p><i class="fa fa-envelope-o" aria-hidden="true"></i> {{ _u.email }}</p>
+                                    </div>
+                                </li>
+                                <li role="separator" class="divider"></li>
+                                <li class="user-body">
+                                    <a title="{{ "Inbox"|get_lang }}" href="{{ message_url }}">
+                                        <em class="fa fa-envelope" aria-hidden="true"></em> {{ "Inbox"|get_lang }}
+                                    </a>
+                                    {% if certificate_url %}
+                                        <a title="{{ "MyCertificates"|get_lang }}" href="{{ certificate_url }}">
+                                            <em class="fa fa-graduation-cap"
+                                                aria-hidden="true"></em> {{ "MyCertificates"|get_lang }}
+                                        </a>
+                                    {% endif %}
 
-                            <a id="logout_button" title="{{ "Logout"|get_lang }}" href="{{ logout_link }}" >
-                                <em class="fa fa-sign-out"></em> {{ "Logout"|get_lang }}
-                            </a>
+                                    <a id="logout_button" title="{{ "Logout"|get_lang }}" href="{{ logout_link }}">
+                                        <em class="fa fa-sign-out"></em> {{ "Logout"|get_lang }}
+                                    </a>
+                                </li>
+                            </ul>
                         </li>
-                    </ul>
-                </li>
-               {% endif %}
-            </ul>
+                    {% endif %}
+                </ul>
             {% endif %}
         </div>
     </div>
diff --git a/main/template/default/layout/page.tpl b/main/template/default/layout/page.tpl
index 5087feced2..1865d0eefa 100755
--- a/main/template/default/layout/page.tpl
+++ b/main/template/default/layout/page.tpl
@@ -44,7 +44,9 @@
 	<section id="content-section">
         <div class="container">
             {% block breadcrumb %}
-                {{ breadcrumb }}
+                <div id="page-breadcrumb">
+                    {{ breadcrumb }}
+                </div>
             {% endblock %}
 
             {% block body %}
diff --git a/main/template/default/layout/page_header.tpl b/main/template/default/layout/page_header.tpl
index 11c849c890..3c81f265b5 100755
--- a/main/template/default/layout/page_header.tpl
+++ b/main/template/default/layout/page_header.tpl
@@ -7,58 +7,52 @@
 {% endblock %}
 <div class="extra-header">{{ header_extra_content }}</div>
 <header id="header-section">
-<section>
     <div class="container">
-	<div class="row">
-	    <div class="col-md-3">
-	    	<div class="logo">
-                {{ logo }}
+        <div class="row">
+            <div class="col-md-3">
+                <div class="logo">
+                    {{ logo }}
+                </div>
             </div>
-	    </div>
             <div class="col-md-9">
-                <div class="col-sm-4">
-                    {% if plugin_header_left is not null %}
-                    <div id="plugin_header_left">
-                        {{ plugin_header_left }}
-                    </div>
-                    {% endif %}
-                </div>
-                <div class="col-sm-4">
-                    {% if plugin_header_center is not null %}
-                    <div id="plugin_header_center">
-                        {{ plugin_header_center }}
+                <div class="row">
+                    <div class="col-sm-4">
+                        {% if plugin_header_left is not null %}
+                            <div id="plugin_header_left">
+                                {{ plugin_header_left }}
+                            </div>
+                        {% endif %}
                     </div>
-                    {% endif %}
-                </div>
-                <div class="col-sm-4">
-                    {% if plugin_header_right is not null %}
-                    <div id="plugin_header_right">
-                        {{ plugin_header_right }}
+                    <div class="col-sm-4">
+                        {% if plugin_header_center is not null %}
+                            <div id="plugin_header_center">
+                                {{ plugin_header_center }}
+                            </div>
+                        {% endif %}
                     </div>
-                    {% endif %}
-                     <script>
-                       $(document).ready(function() {
-                            $.ajax({
-                                type: "GET",
-                                url: "{{ _p.web_main }}inc/ajax/online.ajax.php?a=get_users_online",
-                                success: function(data) {
-                                    $("#notifications").append(data);
-                                }
+                    <div class="col-sm-4">
+                        {% if plugin_header_right is not null %}
+                            <div id="plugin_header_right">
+                                {{ plugin_header_right }}
+                            </div>
+                        {% endif %}
+                        <script>
+                            $(document).on('ready', function () {
+                                $("#notifications").load("{{ _p.web_main }}inc/ajax/online.ajax.php?a=get_users_online");
                             });
-                        });
-                       </script>
-                    <div class="section-notifications">
-                        <ul id="notifications" class="nav nav-pills pull-right">
-                        </ul>
+                        </script>
+                        <div class="section-notifications">
+                            <ul id="notifications" class="nav nav-pills pull-right">
+                            </ul>
+                        </div>
+                        {{ accessibility }}
                     </div>
-                    {{ accessibility }}
                 </div>
             </div>
         </div>
     </div>
-</section>
+</header>
 {% block menu %}
     {% include template ~ "/layout/menu.tpl" %}
 {% endblock %}
-</header>
 {% include template ~ "/layout/course_navigation.tpl" %}
diff --git a/main/template/default/layout/show_header.tpl b/main/template/default/layout/show_header.tpl
index 01bff4126c..ade002ecdd 100755
--- a/main/template/default/layout/show_header.tpl
+++ b/main/template/default/layout/show_header.tpl
@@ -37,7 +37,9 @@
 <section id="content-section">
     <div class="container">
         {% block breadcrumb %}
-            {{ breadcrumb }}
+            <div id="page-breadcrumb">
+                {{ breadcrumb }}
+            </div>
         {% endblock %}
         {{ flash_messages }}
 {% endif %}
\ No newline at end of file