diff --git a/static/css/main.css b/static/css/main.css
index 97e4fa9..349d0b9 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -97,8 +97,9 @@ a:hover {
 }
 
 .row-section {
-    display: flex;
-    flex-direction: row;
+    display: grid;
+    grid-auto-flow: column;
+    grid-auto-columns: 1fr 0fr 1fr;
 }
 
 .column-section {
@@ -197,7 +198,11 @@ button[type="submit"]:hover {
     #logo > img {
         width: 150px;
     }
+    #spacer {
+        display: none;
+    }
     .row-section {
+        display: flex;
         flex-direction: column;
         width: 100%;
         align-items: center;
diff --git a/static/js/main.js b/static/js/main.js
index 77d249f..288a118 100644
--- a/static/js/main.js
+++ b/static/js/main.js
@@ -1,11 +1,18 @@
 const base_url = "https://oss110metz.rezo-rm.fr/"
 
+var page = ['#main-page', '#admin-page', '#login-page', '#demande-page'];
+var historyHandler = [];
+window.onpopstate = history.onpushstate = function(e) {
+    show_page(e.state);
+};
+history.pushState("#main-page", "", "")
+
 function show_page(id) {
-    $('#main-page').hide();
-    $('#admin-page').hide();
-    $('#login-page').hide();
-    $('#demande-page').hide();
+    for(i in page) {
+        $(page[i]).hide();
+    }
     $(id).show();
+    history.pushState(id, "", "")
 }
 
 $("#login-button").click(function (e) {
@@ -27,7 +34,7 @@ $("#login-button").click(function (e) {
                 localStorage.setItem("user", data.user);
                 show_page('#demande-page');
             } else {
-                
+
             }
 
         }
@@ -51,6 +58,10 @@ $(window).on("load", function() {
         navigator.serviceWorker.register('./js/sw.js');
     }
 
+    for(i in page) {
+        $(page[i]).css('z-index', i);
+    }
+
     /* load timer */
     window.setInterval(function() {
         var time = $("#timer").text();
@@ -76,4 +87,3 @@ $(window).on("load", function() {
         }));
     }, 1000);
 });
-