diff --git a/app/templates/base.j2 b/app/templates/base.j2
index 640a4d72e7..27618bba62 100644
--- a/app/templates/base.j2
+++ b/app/templates/base.j2
@@ -62,7 +62,7 @@
 {% endblock %}
 
 {% block content %}
-<div class="container">
+<div class="container flashes">
     {% with messages = get_flashed_messages(with_categories=true) %}
     {% for category, message in messages %}
     <div class="alert alert-info alert-{{ category }}" role="alert">{{ message }}</div>
@@ -72,6 +72,14 @@
     {# application content needs to be provided in the app_content block #}
     {% block app_content %}{% endblock %}
 </div>
+<script>
+    setTimeout(function() {
+        var flashes = document.getElementsByClassName("flashes")[0];
+        if (flashes) {
+            flashes.style.display = "none";
+        }
+    }, 5000);
+</script>
 {% endblock %}
 
 {% block scripts %}
diff --git a/app/templates/flashed_messages.j2 b/app/templates/flashed_messages.j2
index 5ded75245a..b96ee27d40 100644
--- a/app/templates/flashed_messages.j2
+++ b/app/templates/flashed_messages.j2
@@ -1,9 +1,18 @@
-{# Message flask : utilisé uniquement par les anciennes pages ScoDoc #}
-{# -*- mode: jinja-html -*- #}
-<div class="head_message_container">
+{# Messages flask  (flash) #}
+
+<div class="container flashes">
     {% with messages = get_flashed_messages(with_categories=true) %}
         {% for category, message in messages %}
-            <div class="head_message alert-info alert-{{ category }}" role="alert">{{ message }}</div>
+            <div class="alert alert-info alert-{{ category }}" role="alert">{{ message }}</div>
         {% endfor %}
     {% endwith %}
-</div>
\ No newline at end of file
+</div>
+
+<script>
+    setTimeout(function() {
+        var flashes = document.getElementsByClassName("flashes")[0];
+        if (flashes) {
+            flashes.style.display = "none";
+        }
+    }, 5000);
+</script>
diff --git a/app/templates/sco_page.j2 b/app/templates/sco_page.j2
index 1e1e784300..a6e200d630 100644
--- a/app/templates/sco_page.j2
+++ b/app/templates/sco_page.j2
@@ -24,13 +24,7 @@
     {% endblock %}
 
 <div id="gtrcontent" class="gtrcontent">
-    <div class="container">
-        {% with messages = get_flashed_messages(with_categories=true) %}
-        {% for category, message in messages %}
-        <div class="alert alert-info alert-{{ category }}" role="alert">{{ message }}</div>
-        {% endfor %}
-        {% endwith %}
-    </div>
+    {% include "flashed_messages.j2" %}
     {% if sco.sem %}
     {% block formsemestre_header %}
     {% include "formsemestre_header.j2" %}