diff --git a/assets/css/menu.css b/assets/css/menu.css
index 1fa74d7..2f041c8 100644
--- a/assets/css/menu.css
+++ b/assets/css/menu.css
@@ -1,9 +1,45 @@
-.menuimg {
+.menu {
 	position: fixed;
 	bottom: 0;
-	right: 0;
-	width: 100vw;
+	left: 0;
+	width: 100%;
 	height: auto;
-	min-width: 100vmax;
+	min-width: 96vmax;
 	z-index: 2;
-}
\ No newline at end of file
+
+	overflow: visible;
+}
+
+.tuyau {
+	position: fixed;
+	bottom: 0;
+	right: 3vw;
+	width: 8%;
+	height: auto;
+	z-index: 2;
+
+	overflow: visible;
+}
+
+.menu-link use {
+	transition: transform 50ms;
+	transform-origin: center;
+}
+
+.menu-link text {
+	transition: transform 50ms;
+}
+
+.menu-link:hover text {
+	fill: #FFDC00;
+	transform: translateY(-1px);
+}
+
+.menu-link:hover use {
+	transform: scaleY(1.1);
+
+}
+
+.menu svg {
+	overflow: visible;
+}
diff --git a/structure/menu.php b/structure/menu.php
index 3425223..0284e84 100644
--- a/structure/menu.php
+++ b/structure/menu.php
@@ -4,66 +4,13 @@ if(!isset($relativepath)) {
 }
 ?>
 
-<svg class="menuimg" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
-     width="512" height="96" x="0px" y="0px"
-     viewBox="0 416 512 96" xml:space="preserve">
-<style type="text/css">
-    .st0{fill:#AA572E;}
-    .st1{fill:#C06538;}
-    .st2{fill:#2B0A00;}
-    .st3{fill:#914522;}
-    .st4{fill:#9B4D25;}
-    .st5{fill:#A04E26;}
-    .st6{fill:#491A05;}
-    .st7{fill:#3F1403;}
-    .st8{fill:#BA6135;}
-    .st9{fill:#00A15D;}
-    .st10{fill:#00A25D;}
-    .st11{fill:url(#grad1);}
-    .st12{fill:url(#grad2);}
-    .st13{fill:#FFFFFF;}
-    .st14{opacity:0.66;fill:#FFFFFF;}
-    .st15{opacity:0.3;}
-    .st16{fill:#392313;}
-    .st17{fill:#492715;}
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
+     class="tuyau" id="parent"
+     viewBox="0 0 44 78">
 
-    use {
-        transition: transform 0.1s;
-    }
-
-    use:hover {
-        transform: translateY(-1.5px);
-    }
-
-    #Tuyau {
-        transition: opacity 0.2s;
-    }
-
-    #Tuyau:hover {
-        opacity: 0.2;
-    }
-</style>
-
-    <symbol id="Brick" viewBox="0 0 47 20">
-        <rect x="1" y="1" class="st0" width="45" height="18"/>
-        <rect x="1.5" y="0" class="st1" width="44" height="1.5"/>
-        <rect x="1.5" y="18.5" class="st2" width="44" height="1.5"/>
-        <rect x="45.5" y="1.5" class="st3" width="1.5" height="17"/>
-        <rect y="1.5" class="st4" width="1.5" height="17"/>
-        <polygon class="st5" points="47,1.5 45.5,1.5 45.5,0"/>
-        <polygon class="st6" points="45.5,20 47,18.5 45.5,18.5"/>
-        <polygon class="st7" points="0,18.5 1.5,18.5 1.5,20"/>
-        <polygon class="st8" points="0,1.5 1.5,1.5 1.5,0"/>
-    </symbol>
-
-    <g id="Tuyau">
-        <!-- Ouverture : Fond -->
-        <rect  x="431" y="429.5" class="st9" width="44" height="14"/>
-
-        <!-- Cylindre : Fond-->
-        <rect id="Fond_-_Tuyau" x="436" y="443.5" class="st10" width="34" height="50"/>
-
-        <linearGradient id="grad1" gradientUnits="userSpaceOnUse" x1="431" y1="436.5" x2="469" y2="436.5">
+    <!-- espace de définition -->
+    <defs>
+        <linearGradient id="grad1" gradientUnits="userSpaceOnUse" x1="0" y1="0" x2="44" y2="0">
             <stop  offset="0" style="stop-color:#03A663"/>
             <stop  offset="0.2204" style="stop-color:#03A160"/>
             <stop  offset="0.4959" style="stop-color:#029157"/>
@@ -71,91 +18,170 @@ if(!isset($relativepath)) {
             <stop  offset="1" style="stop-color:#00633C"/>
         </linearGradient>
 
-        <!-- Ouverture : Dégradé -->
-        <rect x="431" y="429.5" class="st11" width="38" height="14"/>
-
-        <linearGradient id="grad2" gradientUnits="userSpaceOnUse" x1="436" y1="468.5" x2="464" y2="468.5">
+        <linearGradient id="grad2" gradientUnits="userSpaceOnUse" x1="5" y1="14" x2="39" y2="14">
             <stop  offset="0" style="stop-color:#03A663"/>
             <stop  offset="0.2204" style="stop-color:#03A160"/>
             <stop  offset="0.4959" style="stop-color:#029157"/>
             <stop  offset="0.7995" style="stop-color:#017848"/>
             <stop  offset="1" style="stop-color:#00633C"/>
         </linearGradient>
+    </defs>
 
-        <!-- Tuyau : Dégradé -->
-        <rect x="436" y="443.5" class="st12" width="28" height="50"/>
+    <style type="text/css">
+        .st9{fill:#00A15D;}
+        .st10{fill:#00A25D;}
+        .st11{fill:url(#grad1);}
+        .st12{fill:url(#grad2);}
+        .st13{fill:#FFFFFF;}
+        .st14{opacity:0.66;fill:#FFFFFF;}
+        .st15{opacity:0.3;}
+    </style>
 
-        <!-- Ouverture : Reflet Fort -->
-        <rect x="439.93" y="429.5" class="st13" width="5.5" height="14"/>
 
-        <!-- Ouverture : Reflet Faible -->
-        <rect x="438.43" y="429.5" class="st14" width="1.5" height="14"/>
+    <!-- Ouverture : Fond -->
+    <rect  x="0" y="0" class="st9" width="44" height="14"/>
 
-        <!-- Cylindre : Reflet Fort -->
-        <rect x="443.43" y="445.39" class="st13" width="5.5" height="48.11"/>
+    <!-- Cylindre : Fond -->
+    <rect x="5" y="14" class="st10" width="34" height="50"/>
 
-        <!-- Cylindre : Reflet Faible -->
-        <rect x="441.93" y="445.39" class="st14" width="1.5" height="48.11"/>
+    <!-- Ouverture : Dégradé -->
+    <rect x="0" y="0" class="st11" width="38" height="14"/>
 
-        <!-- Ouverture : Ombre projetée -->
-        <rect  x="436" y="443.5" class="st15" width="34" height="1.35"/>
-    </g>
+    <!-- Cylindre : Dégradé -->
+    <rect x="5" y="14" class="st12" width="28" height="50"/>
+
+    <!-- Ouverture : Reflet Fort -->
+    <rect x="9" y="0" class="st13" width="5.5" height="14"/>
+
+    <!-- Ouverture : Reflet Faible -->
+    <rect x="7.5" y="0" class="st14" width="1.5" height="14"/>
+
+    <!-- Cylindre : Reflet Fort -->
+    <rect x="12.5" y="14" class="st13" width="5.5" height="48.11"/>
+
+    <!-- Cylindre : Reflet Faible -->
+    <rect x="11" y="14" class="st14" width="1.5" height="48.11"/>
+
+    <!-- Ouverture : Ombre projetée -->
+    <rect  x="5" y="14" class="st15" width="34" height="1.35"/>
 
     <!-- Tuyau : Ombre -->
-    <rect id="Ombre_-_Tuyau" x="436" y="472.27" class="st15" width="34" height="1.35"/>
-
-    <!-- Fond -->
-    <rect id="Fond_-_Briques" x="0" y="474" class="st16" width="512" height="38"/>
-
-    <!-- Fond : Surface -->
-    <rect id="Surface_-_Briques" x="0" y="473.62" class="st17" width="512" height="0.75"/>
-
-
-    <!-- Top layer (LtR) -->
-    <use xlink:href="#Brick" width="47" height="20" x="0" y="471.65"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="48.85" y="471.65"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="97.7" y="471.65"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="146.55" y="471.65"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="195.4" y="471.65"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="244.25" y="471.65"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="293.1" y="471.65"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="341.95" y="471.65"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="390.8" y="471.65"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="439.65" y="471.65"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="488.5" y="471.65"/>
-
-    <!-- Bottom Layer (LtR) -->
-    <use xlink:href="#Brick" width="47" height="20" x="-23.5" y="493.5"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="25.35" y="493.5"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="74.2" y="493.5"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="123.05" y="493.5"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="171.9" y="493.5"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="220.75" y="493.5"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="269.6" y="493.5"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="318.45" y="493.5"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="367.3" y="493.5"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="416.15" y="493.5"/>
-
-    <use xlink:href="#Brick" width="47" height="20" x="465" y="493.5"/>
+    <rect x="5" y="42" class="st15" width="34" height="1.35"/>
+
+</svg>
+
+<!-- The actual menu -->
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
+     class="menu" id="parent"
+     viewBox="0 0 512 34.85">
+
+    <!-- Might put them somewhere else later -->
+    <style type="text/css">
+        .st0{fill:#AA572E;}
+        .st1{fill:#C06538;}
+        .st2{fill:#2B0A00;}
+        .st3{fill:#914522;}
+        .st4{fill:#9B4D25;}
+        .st5{fill:#A04E26;}
+        .st6{fill:#491A05;}
+        .st7{fill:#3F1403;}
+        .st8{fill:#BA6135;}
+        .st16{fill:#392313;}
+        .st17{fill:#492715;}
+    </style>
+    <style type="text/css">
+
+        .menu-link text {
+            fill: white;
+            text-anchor: middle;
+            alignment-baseline: central;
+            dominant-baseline: central;
+            font-size: 8px;
+        }
+
+    </style>
+
+    <!-- This svg create an image of a brick and cache it for further <use>s-->
+    <symbol id="Brick" viewBox="0 0 47 17">
+        <rect x="1" y="1" class="st0" width="45" height="15"/>
+
+        <rect x="1.5" y="0" class="st1" width="44" height="1.5"/> <!-- Top side -->
+        <rect x="1.5" y="15.5" class="st2" width="44" height="1.5"/> <!-- Bottom side -->
+        <rect x="45.5" y="1.5" class="st3" width="1.5" height="14"/> <!-- Right side -->
+        <rect x="0" y="1.5" class="st4" width="1.5" height="14"/> <!-- Left side -->
+
+        <polygon class="st5" points="47,1.5 45.5,1.5 45.5,0"/> <!-- TR corner -->
+        <polygon class="st6" points="45.5,17 47,15.5 45.5,15.5"/> <!-- BR corner -->
+        <polygon class="st7" points="0,15.5 1.5,15.5 1.5,17"/> <!-- BL corner -->
+        <polygon class="st8" points="0,1.5 1.5,1.5 1.5,0"/> <!-- TL corner -->
+    </symbol>
+
+
+    <!-- Fond -->
+    <rect x="0" y="2.85" class="st16" width="512" height="32"/>
+
+    <!-- Fond : Surface -->
+    <rect x="0" y="2.85" class="st17" width="512" height="1.5"/>
+
+
+
+
+    <!-- Top layer (LtR) -->
+
+    <use xlink:href="#Brick" width="47" height="17" x="0" y="0"/>
+
+    <!--use xlink:href="#Brick" width="47" height="17" x="48.85" y="0"/-->
+    <a href="index.php" class="menu-link">
+        <use xlink:href="#Brick" width="47" height="17" x="48.85" y="0"/>
+        <svg id="btn10" width="47" height="17" x="48.85" y="0">
+            <text x="50%" y="50%">
+                Acceuil
+            </text>
+        </svg>
+    </a>
+
+    <use xlink:href="#Brick" width="47" height="17" x="97.7" y="0"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="146.55" y="0"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="195.4" y="0"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="244.25" y="0"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="293.1" y="0"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="341.95" y="0"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="390.8" y="0"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="439.65" y="0"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="488.5" y="0"/>
+
+
+
+    <!-- Bottom Layer (LtR) -->
+    <use xlink:href="#Brick" width="47" height="17" x="-23.5" y="17.85"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="25.35" y="17.85"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="74.2" y="17.85"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="123.05" y="17.85"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="171.9" y="17.85"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="220.75" y="17.85"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="269.6" y="17.85"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="318.45" y="17.85"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="367.3" y="17.85"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="416.15" y="17.85"/>
+
+    <use xlink:href="#Brick" width="47" height="17" x="465" y="17.85"/>
 
 </svg>
 
diff --git a/structure/template.php b/structure/template.php
index 93cb5c9..5450158 100644
--- a/structure/template.php
+++ b/structure/template.php
@@ -60,7 +60,7 @@ $pagename = $infopage[4];      // nom de la page exact servant à appeler le css
             <?php include $relativepath."structure/footer.php"; ?>
         </footer>
 
-        <img src="<?php echo $relativepath.'assets/img/menu/menu.svg'; ?>" class="menu_space_bottom"> <!-- c'est un espace qui permet de couvrir la surface sous le menu, pour l'instant on utilise la même image pour pas oublier que l'espace doit être de la même taille que le menu mais faudra changer ça -->
+         <!-- TODO un espace qui permet de couvrir la surface sous le menu, pour l'instant on utilise la même image pour pas oublier que l'espace doit être de la même taille que le menu mais faudra changer ça -->
     </body>
 </html>
 <?php