create nav barre for phone

resources/css/index.css

@@ -60,7 +60,7 @@ body {
   display: none;
   height: 70px;
   position: fixed;
-  width: 100%;
+  width: calc(100% - 100px);
   top: 0;
   left: 0;
   background-color: rgba(255, 255, 255, 0.1); 
@@ -77,6 +77,12 @@ body {
   text-align: center;
 }
 
+.depli-nav {
+  background: none;
+  border: none;
+  cursor: pointer;
+}
+
 main,
 section {
   margin: 100px 100px 100px;
@@ -174,6 +180,32 @@ main {
   h1 {
     margin-top: 80px;
   }
+
+  .mini-nav {
+    justify-content: space-between;
+  }
+
+  #nav a {
+    padding: 5px 15px;
+  }
+
+  #nav a:hover {
+    padding: 5px 14px;
+  }
+
+  #nav ul {
+    width: 300px;
+    display: flex;
+    justify-content: space-between;
+  }
+
+  .nav-dark {
+    background-color: #1c1c1e;
+  }
+
+  .nav-light {
+    background-color: #fefefe;
+  }
 }
 
 @media (max-width: 940px) {
@@ -272,7 +304,7 @@ main {
 .btn_theme:hover {
   border: 1px solid rgb(83, 83, 83); 
   border-radius: 5px; 
-  padding: 5px 14px;
+  padding: 4px 14px;
 }
 
 #text {