fix ?

Author: Damonsas

pages/style.css

@@ -17,10 +17,17 @@ body {
 }
 .nav-link ul {
     display: flex;
-    flex-wrap: wrap;
     justify-content: center;
-    padding: 0;
     list-style: none;
+    padding: 0;
+}
+
+.menu-toggle {
+    display: none;
+    background: none;
+    border: none;
+    font-size: 1.5rem;
+    cursor: pointer;
 }
 .nav-link a {
   font-size: 40px;
@@ -48,7 +55,8 @@ body {
 }
 
 .footer-basic {
-    padding:40px 0;
+    text-align: center;
+    padding: 20px;
     background-color:#000000;
     color:#4b4c4d;
   }
@@ -72,6 +80,10 @@ body {
     color:inherit;
     opacity:0.75;
   }
+  .footer-basic .social a {
+    display: inline-block;
+    margin: 0 10px;
+}
 
   .footer-basic .social > a:hover {
     opacity:0.9;
@@ -123,6 +135,10 @@ footer {
             border: 2px solid #ff4a03;
 
 }
+img {
+    max-width: 100%;
+    height: auto;
+}
 
 h1 {
     font-family: Arial, Helvetica, sans-serif;
@@ -473,6 +489,23 @@ img {
         padding: 10px;
         text-align: center;
     }
+    .nav-link ul {
+        display: none;
+        flex-direction: column;
+        background-color: #f4f4f4;
+        padding: 10px;
+    }
+
+    .nav-link ul.active {
+        display: flex;
+    }
+
+    .menu-toggle {
+        display: block;
+    }
+    .footer-basic .social a {
+        margin: 5px;
+    }
 }
 
 @media (max-width: 480px) {

style.css

@@ -17,10 +17,17 @@ body {
 }
 .nav-link ul {
     display: flex;
-    flex-wrap: wrap;
     justify-content: center;
-    padding: 0;
     list-style: none;
+    padding: 0;
+}
+
+.menu-toggle {
+    display: none;
+    background: none;
+    border: none;
+    font-size: 1.5rem;
+    cursor: pointer;
 }
 .nav-link a {
   font-size: 40px;
@@ -57,7 +64,8 @@ body {
     margin-top: 20%;  
 } 
 .footer-basic {
-    padding:40px 0;
+    text-align: center;
+    padding: 20px;
     background-color:#000000;
     color:#4b4c4d;
   }
@@ -81,6 +89,10 @@ body {
     color:inherit;
     opacity:0.75;
   }
+  .footer-basic .social a {
+    display: inline-block;
+    margin: 0 10px;
+}
 
   .footer-basic .social > a:hover {
     opacity:0.9;
@@ -127,7 +139,10 @@ footer {
             padding-top: 40px;
 
 }
-
+img {
+    max-width: 100%;
+    height: auto;
+}
 
 h1 {
     font-family: Arial, Helvetica, sans-serif;
@@ -236,6 +251,38 @@ li {
         padding: 10px;
         text-align: center;
     }
+    
+    .nav-link ul {
+        display: none;
+        flex-direction: column;
+        background-color: #f4f4f4;
+        padding: 10px;
+    }
+
+    .nav-link ul.active {
+        display: flex;
+    }
+
+    .menu-toggle {
+        display: block;
+    }
+    .propos h2, .Art h2, #dev h2 {
+        font-size: 1.5rem;
+        text-align: center;
+    }
+
+    .propos h3, .Art h3, #dev h3 {
+        font-size: 1rem;
+        padding: 10px;
+    }
+
+    .Art li {
+        text-align: center;
+        margin: 5px 0;
+    }
+    .footer-basic .social a {
+        margin: 5px;
+    }
 }
 
 @media (max-width: 480px) {