adaptation pour petits écrans

assets/css/menu.css

@@ -24,19 +24,7 @@
 	bottom: 5vh;
 }
 
-@media all and (max-width: 800px) {
-	/* Add styles for smartphones screens */
-	#menu ul {
-	  height: auto;
-	  flex-direction: column;
-	  justify-content: center;
-	}
-	
-	#menu li {
-	  margin: 5px 0;
-	}
 
-}
 
 #menu li {
 margin: 0 10px;
@@ -56,11 +44,33 @@ margin: 0 10px;
 }
 
 #menu a:hover{
-	color: #c22828;
+	color: #e01111;
 	transform: translateY(-2px);
 }
-  
 
+/* Add styles for smartphones screens */
+@media all and (max-width: 800px) {
+	.menu {
+		position: fixed;
+		bottom: 0;
+		width: 100%;
+		height: 25vh;
+		z-index: 2;
+		overflow: visible;
+		transition: transform 0.3s;
+	}
+
+	#menu ul {
+	  height: auto;
+	  flex-direction: column;
+	  justify-content: center;
+	}
+	
+	#menu li {
+	  margin: 5px 0;
+	}
+
+}
 
 .mobile-menu {
 	display: block;