diff --git a/public/css/header.css b/public/css/header.css
index 4e8c158..fe6473a 100644
--- a/public/css/header.css
+++ b/public/css/header.css
@@ -83,3 +83,21 @@ text-decoration: none;
     }
   }
 
+  .headerMenuMobile{
+    font-family: "Poppins";
+    font-weight: 400; /*regular*/ 
+    font-size: 1.25rem; /*20px*/
+    color: #000;  /*Noir pur*/
+    list-style: none;
+    font-style: none;
+    display: none;
+  }
+  .nav-is-active{
+    background-color: #fff;
+    display: flex;
+    flex-flow: column;
+    justify-content: space-between;
+    position: fixed;
+    top: 75px;
+  }
+
diff --git a/templates/html/header.gohtml b/templates/html/header.gohtml
index c9bed6a..4e470f9 100644
--- a/templates/html/header.gohtml
+++ b/templates/html/header.gohtml
@@ -2,22 +2,28 @@
     <link rel="stylesheet" href="/public/css/header.css">
     <script>
         function  onToggleNav() {
-        var menu = document.querySelector(".headerMenu");
+        var menu = document.querySelector(".headerMenuMobile");
         console.log(menu);
         menu.classList.toggle('nav-is-active');
       }
         </script>
 <div class="header">   
-<div class="wrapper headerWrapper">
+    <div class="wrapper headerWrapper">
         <a class="headerLink" href="/"><img class="headerMenuLogo" src="/public/icones/agecem-logo.svg"></img></a>
-    <ul class="headerMenu">
+        <ul class="headerMenu">
+            <li class="headerMenuElement"><a href="/">AGECEM</a></li>
+            <li class="headerMenuElement"><a href="/vie-etudiante">Vie étudiante</a></li>
+            <li class="headerMenuElement"><a href="/documentation">Documentation</a></li>
+            <li class="headerMenuElement"><a href="/admin">admin</a></li>
+        </ul>
+        <img class="headerMenuHamburger" src="/public/icones/hamburger-menu.svg" onclick="onToggleNav()"></img>
+    </div>
+    <ul class="headerMenuMobile">
         <li class="headerMenuElement"><a href="/">AGECEM</a></li>
         <li class="headerMenuElement"><a href="/vie-etudiante">Vie étudiante</a></li>
         <li class="headerMenuElement"><a href="/documentation">Documentation</a></li>
         <li class="headerMenuElement"><a href="/admin">admin</a></li>
-      </ul>
-<img class="headerMenuHamburger" src="/public/icones/hamburger-menu.svg" onclick="onToggleNav()"></img>
-    </div>
+    </ul>
 </div>