diff --git a/assets/css/src/_global.scss b/assets/css/src/_global.scss
deleted file mode 100644
index 8afc05d..0000000
--- a/assets/css/src/_global.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-button {
-  background-color: transparent;
-}
diff --git a/assets/css/src/_main.scss b/assets/css/src/_main.scss
index 81e001c..039f24d 100644
--- a/assets/css/src/_main.scss
+++ b/assets/css/src/_main.scss
@@ -37,6 +37,7 @@
   --font-size-XL: 11vw;
   --line-height-S: var(--font-size-S);
   --text-color: black;
+  --bg-color: white;
   --body-margin: 0.6rem;
   --nav-margin: 1rem;
   --apparition-duration: 0.3s;
@@ -46,6 +47,7 @@
   --half-screen: 50vw;
   --index-width: 40rem;
   --close-cursor: url(/assets/images/close-cursor.png), crosshair;
+  --main-title-top: -0.7vw;
 }
 
 body {
@@ -74,10 +76,9 @@ h1 {
 }
 
 p {
-  /*! padding: var(--margin-S); */
   box-sizing: border-box;
   margin: 0;
-  width: 50rem;
+  width: fit-content;
   max-width: 100%;
 }
 
@@ -105,12 +106,14 @@ ul {
 nav {
   &.filter-menu {
     display: flex;
+    flex-wrap: wrap;
     opacity: 1;
     position: relative;
     font-size: var(--font-size-L);
     pointer-events: all;
-    gap: calc(2 * var(--body-margin));
+    column-gap: calc(2 * var(--body-margin));
     margin: calc(4 * var(--line-height-S)) 0 var(--line-height-S) 0;
+    width: calc(var(--index-width) - var(--body-margin));
 
     a {
       text-decoration: none;
@@ -183,7 +186,6 @@ button.next {
 
 .toggle {
   display: none;
-  /*! margin-bottom: var(--line-height-S); */
 }
 
 .fix:hover + .toggle {
@@ -218,13 +220,16 @@ button.next {
   opacity: 1;
 }
 
+.projects-index:has(li:hover) li:not(:hover) {
+  opacity: var(--low-opacity);
+}
+
 .unselected:hover .toggle {
   display: none;
 }
 
 .unselected:hover .slide-number {
   display: none;
-  color: red;
 }
 
 .selected {
@@ -266,6 +271,11 @@ button.next {
   gap: var(--body-margin);
   pointer-events: all;
   padding-bottom: var(--line-height-S);
+  cursor: inherit;
+}
+
+.project-toggler span {
+  cursor: pointer;
 }
 
 .project-description {
@@ -311,4 +321,17 @@ button.next {
 [data-template="infos"] main {
   position: absolute;
   top: calc(var(--line-height-S) + 0.35rem);
+  display: flex;
+  flex-wrap: wrap;
+  bottom: auto;
+  padding-bottom: var(--font-size-XL);
+}
+
+[data-template="infos"] .main-infos {
+  max-width: 100%;
+  width: 660px;
+}
+
+[data-template="infos"] .secondary-infos {
+  max-width: 100%;
 }
diff --git a/assets/css/src/_mobile.scss b/assets/css/src/_mobile.scss
index 60300e2..d898348 100644
--- a/assets/css/src/_mobile.scss
+++ b/assets/css/src/_mobile.scss
@@ -1,10 +1,12 @@
 @media screen and (max-width: 1000px) {
-  * {
+  :root {
     --slider-height: 50vh;
+    --font-size-XL: 12.5vw;
+    --font-size-L: 1.5rem;
+    --font-size-S: 0.75rem;
   }
 
   body {
-    background-color: red;
   }
 
   .project-slideshow {
@@ -26,7 +28,7 @@
     line-break: strict;
     left: -0.65vw;
     position: relative;
-    top: -0.7vw;
+    top: var(--main-title-top);
     margin-top: var(--body-margin);
     line-height: 0.75;
   }
@@ -34,11 +36,12 @@
   .project-index :has(.selected) {
   }
 
-  .fix {
-    display: block;
+  .project-toggler.grid {
+    grid-template-columns: 2fr 2fr 1fr;
+    width: 100%;
   }
 
-  .project-toggler.grid {
+  .fix {
     display: block;
   }
 
@@ -48,31 +51,93 @@
     bottom: 0;
     overflow: auto;
     width: calc(100% - var(--body-margin));
+    padding-top: var(--font-size-XL);
   }
 
   main:has(ul li.selected) {
     top: var(--slider-height);
+    padding-top: 0;
   }
 
   nav.filter-menu {
-    position: absolute;
+    position: sticky;
     top: 0;
-    margin-top: calc(var(--line-height-S) * 2);
+    padding-top: var(--line-height-S);
+    margin: 0;
+    width: 100%;
+  }
+
+  nav.filter-menu:has(+ ul li.selected) {
   }
 
   ul.projects-index {
-    top: calc(var(--line-height-S) * 5);
+    padding-top: var(--line-height-S);
     position: absolute;
+    width: calc(100vw - (var(--body-margin) * 3));
+    overflow: auto;
+    padding-bottom: var(--font-size-XL);
+  }
+
+  .selected .fix:hover + .toggle {
+    display: block;
   }
 
   .fix:hover + .toggle {
     display: none;
   }
 
+  .selected .fix:hover .slide-number {
+    display: block;
+  }
+
   .slide-number {
     position: fixed;
     top: var(--slider-height);
     margin-top: calc(-2 * (var(--line-height-S)));
     right: var(--body-margin);
   }
+
+  .main-menu {
+    display: none;
+  }
+
+  .mobile-menu {
+    display: flex;
+  }
+
+  .close-mobile-menu {
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    left: 0;
+    font-size: var(--font-size-XL);
+    display: flex;
+    justify-content: center;
+  }
+
+  header:hover ~ main {
+    opacity: 1;
+    transition-duration: 0;
+  }
+
+  .main-title:hover {
+    opacity: 1;
+    transition-duration: 0;
+  }
+
+  .main-title:has(+ nav:hover) {
+    opacity: 1;
+    transition-duration: 0;
+  }
+
+  #home-slideshow img:not(.slide.active img) {
+    display: none;
+  }
+}
+
+@media (max-width: 687px) {
+  [data-template="infos"] div {
+    padding-right: var(--body-margin);
+    width: calc(100% - var(--body-margin));
+  }
 }
diff --git a/assets/css/src/_nav.scss b/assets/css/src/_nav.scss
index 32931d4..4ca89bb 100644
--- a/assets/css/src/_nav.scss
+++ b/assets/css/src/_nav.scss
@@ -37,7 +37,7 @@ nav li a {
   line-break: strict;
   left: -0.65vw;
   position: relative;
-  top: -0.7vw;
+  top: var(--main-title-top);
   margin-top: var(--body-margin);
   line-height: 0.75;
 }
@@ -48,11 +48,14 @@ nav li a {
   /* background-color: yellow; */
 }
 
+.title-nav-mobile {
+  display: none;
+}
+
 .main-title {
   z-index: 2;
   font-size: var(--font-size-S);
   top: var(--body-margin);
-  transition-duration: var(--disparition-duration);
   cursor: pointer;
   width: fit-content;
   position: fixed;
@@ -83,13 +86,18 @@ header:hover ~ main {
   transition-duration: var(--apparition-duration);
 }
 
+main {
+  transition-duration: var(--disparition-duration);
+  transition-property: opacity;
+}
+
 .main-title:hover {
-  opacity: var(--low-opacity);
+  opacity: 0;
   transition-duration: var(--apparition-duration);
 }
 
 .main-title:has(+ nav:hover) {
-  opacity: var(--low-opacity);
+  opacity: 0;
   transition-duration: var(--apparition-duration);
 }
 
@@ -119,7 +127,7 @@ nav.main-menu:hover {
   line-break: strict;
   left: -0.65vw;
   position: relative;
-  top: -0.7vw;
+  top: var(--main-title-top);
   margin-top: var(--body-margin);
   line-height: 0.75;
 }
@@ -128,6 +136,61 @@ nav.main-menu:hover {
   color: transparent;
 }
 
-[data-template="home"] .main-title span {
-  color: var(--text-color);
+[data-template="home"] header {
+  mix-blend-mode: difference;
+}
+
+[data-template="home"] .main-title span {
+  color: white;
+}
+
+@media (min-width: 1500px) {
+  :root {
+    --main-title-top: -0.4vw;
+  }
+}
+
+/* MOBILE-MENU */
+
+.mobile-menu {
+  display: none;
+  position: fixed;
+  bottom: var(--body-margin);
+  width: 100%;
+  left: 0;
+  box-sizing: border-box;
+  justify-content: center;
+}
+
+.mobile-menu button {
+  pointer-events: all;
+}
+
+.mobile-menu button:has(+ dialog:open) {
+  display: none;
+}
+
+dialog#mobile-menu-content:open {
+  padding: 0;
+  border: none;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  overflow: visible;
+}
+
+dialog#mobile-menu-content::backdrop {
+  background-color: var(--bg-color);
+  opacity: calc(1 - var(--low-opacity));
+}
+
+#mobile-menu-content ul {
+  margin-top: 0;
+  display: flex;
+  text-align: center;
+}
+
+#mobile-menu-content .title-nav {
+  position: fixed;
+  padding: var(--body-margin);
 }
diff --git a/assets/css/src/_reset.scss b/assets/css/src/_reset.scss
index ca5b625..8dccd4d 100644
--- a/assets/css/src/_reset.scss
+++ b/assets/css/src/_reset.scss
@@ -5,4 +5,5 @@ button {
   text-align: inherit;
   font: inherit;
   cursor: pointer;
+  background-color: transparent;
 }
diff --git a/assets/css/style.css b/assets/css/style.css
index 4f2cb9c..fcd7a94 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -6,6 +6,7 @@ button {
   text-align: inherit;
   font: inherit;
   cursor: pointer;
+  background-color: transparent;
 }
 
 @font-face {
@@ -31,6 +32,7 @@ button {
   --font-size-XL: 11vw;
   --line-height-S: var(--font-size-S);
   --text-color: black;
+  --bg-color: white;
   --body-margin: 0.6rem;
   --nav-margin: 1rem;
   --apparition-duration: 0.3s;
@@ -40,6 +42,7 @@ button {
   --half-screen: 50vw;
   --index-width: 40rem;
   --close-cursor: url(/assets/images/close-cursor.png), crosshair;
+  --main-title-top: -0.7vw;
 }
 
 body {
@@ -68,10 +71,10 @@ h1 {
 }
 
 p {
-  /*! padding: var(--margin-S); */
   box-sizing: border-box;
   margin: 0;
-  width: 50rem;
+  width: -moz-fit-content;
+  width: fit-content;
   max-width: 100%;
 }
 
@@ -98,12 +101,15 @@ ul {
 
 nav.filter-menu {
   display: flex;
+  flex-wrap: wrap;
   opacity: 1;
   position: relative;
   font-size: var(--font-size-L);
   pointer-events: all;
-  gap: calc(2 * var(--body-margin));
+  -moz-column-gap: calc(2 * var(--body-margin));
+       column-gap: calc(2 * var(--body-margin));
   margin: calc(4 * var(--line-height-S)) 0 var(--line-height-S) 0;
+  width: calc(var(--index-width) - var(--body-margin));
 }
 nav.filter-menu a {
   text-decoration: none;
@@ -173,7 +179,6 @@ button.next {
 
 .toggle {
   display: none;
-  /*! margin-bottom: var(--line-height-S); */
 }
 
 .fix:hover + .toggle {
@@ -208,13 +213,16 @@ button.next {
   opacity: 1;
 }
 
+.projects-index:has(li:hover) li:not(:hover) {
+  opacity: var(--low-opacity);
+}
+
 .unselected:hover .toggle {
   display: none;
 }
 
 .unselected:hover .slide-number {
   display: none;
-  color: red;
 }
 
 .selected {
@@ -250,6 +258,11 @@ button.next {
   gap: var(--body-margin);
   pointer-events: all;
   padding-bottom: var(--line-height-S);
+  cursor: inherit;
+}
+
+.project-toggler span {
+  cursor: pointer;
 }
 
 .project-description {
@@ -294,6 +307,19 @@ button.next {
 [data-template=infos] main {
   position: absolute;
   top: calc(var(--line-height-S) + 0.35rem);
+  display: flex;
+  flex-wrap: wrap;
+  bottom: auto;
+  padding-bottom: var(--font-size-XL);
+}
+
+[data-template=infos] .main-infos {
+  max-width: 100%;
+  width: 660px;
+}
+
+[data-template=infos] .secondary-infos {
+  max-width: 100%;
 }
 
 nav.main-menu {
@@ -335,7 +361,7 @@ nav li a {
   line-break: strict;
   left: -0.65vw;
   position: relative;
-  top: -0.7vw;
+  top: var(--main-title-top);
   margin-top: var(--body-margin);
   line-height: 0.75;
 }
@@ -346,11 +372,14 @@ nav li a {
   /* background-color: yellow; */
 }
 
+.title-nav-mobile {
+  display: none;
+}
+
 .main-title {
   z-index: 2;
   font-size: var(--font-size-S);
   top: var(--body-margin);
-  transition-duration: var(--disparition-duration);
   cursor: pointer;
   width: -moz-fit-content;
   width: fit-content;
@@ -382,13 +411,18 @@ header:hover ~ main {
   transition-duration: var(--apparition-duration);
 }
 
+main {
+  transition-duration: var(--disparition-duration);
+  transition-property: opacity;
+}
+
 .main-title:hover {
-  opacity: var(--low-opacity);
+  opacity: 0;
   transition-duration: var(--apparition-duration);
 }
 
 .main-title:has(+ nav:hover) {
-  opacity: var(--low-opacity);
+  opacity: 0;
   transition-duration: var(--apparition-duration);
 }
 
@@ -417,7 +451,7 @@ nav.main-menu:hover {
   line-break: strict;
   left: -0.65vw;
   position: relative;
-  top: -0.7vw;
+  top: var(--main-title-top);
   margin-top: var(--body-margin);
   line-height: 0.75;
 }
@@ -426,8 +460,61 @@ nav.main-menu:hover {
   color: transparent;
 }
 
+[data-template=home] header {
+  mix-blend-mode: difference;
+}
+
 [data-template=home] .main-title span {
-  color: var(--text-color);
+  color: white;
+}
+
+@media (min-width: 1500px) {
+  :root {
+    --main-title-top: -0.4vw;
+  }
+}
+/* MOBILE-MENU */
+.mobile-menu {
+  display: none;
+  position: fixed;
+  bottom: var(--body-margin);
+  width: 100%;
+  left: 0;
+  box-sizing: border-box;
+  justify-content: center;
+}
+
+.mobile-menu button {
+  pointer-events: all;
+}
+
+.mobile-menu button:has(+ dialog:open) {
+  display: none;
+}
+
+dialog#mobile-menu-content:open {
+  padding: 0;
+  border: none;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  overflow: visible;
+}
+
+dialog#mobile-menu-content::backdrop {
+  background-color: var(--bg-color);
+  opacity: calc(1 - var(--low-opacity));
+}
+
+#mobile-menu-content ul {
+  margin-top: 0;
+  display: flex;
+  text-align: center;
+}
+
+#mobile-menu-content .title-nav {
+  position: fixed;
+  padding: var(--body-margin);
 }
 
 #home-slideshow {
@@ -483,11 +570,11 @@ nav.main-menu:hover {
 }
 
 @media screen and (max-width: 1000px) {
-  * {
+  :root {
     --slider-height: 50vh;
-  }
-  body {
-    background-color: red;
+    --font-size-XL: 12.5vw;
+    --font-size-L: 1.5rem;
+    --font-size-S: 0.75rem;
   }
   .project-slideshow {
     position: fixed;
@@ -508,14 +595,15 @@ nav.main-menu:hover {
     line-break: strict;
     left: -0.65vw;
     position: relative;
-    top: -0.7vw;
+    top: var(--main-title-top);
     margin-top: var(--body-margin);
     line-height: 0.75;
   }
-  .fix {
-    display: block;
-  }
   .project-toggler.grid {
+    grid-template-columns: 2fr 2fr 1fr;
+    width: 100%;
+  }
+  .fix {
     display: block;
   }
   main {
@@ -524,26 +612,75 @@ nav.main-menu:hover {
     bottom: 0;
     overflow: auto;
     width: calc(100% - var(--body-margin));
+    padding-top: var(--font-size-XL);
   }
   main:has(ul li.selected) {
     top: var(--slider-height);
+    padding-top: 0;
   }
   nav.filter-menu {
-    position: absolute;
+    position: sticky;
     top: 0;
-    margin-top: calc(var(--line-height-S) * 2);
+    padding-top: var(--line-height-S);
+    margin: 0;
+    width: 100%;
   }
   ul.projects-index {
-    top: calc(var(--line-height-S) * 5);
+    padding-top: var(--line-height-S);
     position: absolute;
+    width: calc(100vw - var(--body-margin) * 3);
+    overflow: auto;
+    padding-bottom: var(--font-size-XL);
+  }
+  .selected .fix:hover + .toggle {
+    display: block;
   }
   .fix:hover + .toggle {
     display: none;
   }
+  .selected .fix:hover .slide-number {
+    display: block;
+  }
   .slide-number {
     position: fixed;
     top: var(--slider-height);
     margin-top: calc(-2 * (var(--line-height-S)));
     right: var(--body-margin);
   }
+  .main-menu {
+    display: none;
+  }
+  .mobile-menu {
+    display: flex;
+  }
+  .close-mobile-menu {
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    left: 0;
+    font-size: var(--font-size-XL);
+    display: flex;
+    justify-content: center;
+  }
+  header:hover ~ main {
+    opacity: 1;
+    transition-duration: 0;
+  }
+  .main-title:hover {
+    opacity: 1;
+    transition-duration: 0;
+  }
+  .main-title:has(+ nav:hover) {
+    opacity: 1;
+    transition-duration: 0;
+  }
+  #home-slideshow img:not(.slide.active img) {
+    display: none;
+  }
+}
+@media (max-width: 687px) {
+  [data-template=infos] div {
+    padding-right: var(--body-margin);
+    width: calc(100% - var(--body-margin));
+  }
 }/*# sourceMappingURL=style.css.map */
\ No newline at end of file
diff --git a/assets/css/style.css.map b/assets/css/style.css.map
index e21f461..d3a7802 100644
--- a/assets/css/style.css.map
+++ b/assets/css/style.css.map
@@ -1 +1 @@
-{"version":3,"sources":["src/_main.scss","src/_reset.scss","style.css","src/_nav.scss","src/_home.scss","src/_mobile.scss"],"names":[],"mappings":"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","file":"style.css"}
\ No newline at end of file
+{"version":3,"sources":["src/_main.scss","src/_reset.scss","style.css","src/_nav.scss","src/_home.scss","src/_mobile.scss"],"names":[],"mappings":"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","file":"style.css"}
\ No newline at end of file
diff --git a/site/snippets/nav.php b/site/snippets/nav.php
index ffd286d..a20f6c2 100644
--- a/site/snippets/nav.php
+++ b/site/snippets/nav.php
@@ -7,11 +7,6 @@
             <span>Hic&nbsp;et&nbsp;Nunc&nbsp;Studio</span>
         </a>
     </h1>
-    <h1 class="title-nav-mobile">
-        <a href="">
-            <span>menu</span>
-        </a>
-    </h1>
     <ul>
         <li>
             <a class="nav-item-home" href="<?= page('home')->url() ?>"><?= page('home')->title() ?></a>,&nbsp;
@@ -23,4 +18,36 @@
             <a class="nav-item-about" href="<?= page('infos')->url() ?>"><?= page('infos')->title() ?></a>
         </li>
     </ul>
+</nav>
+
+<nav class="mobile-menu">
+
+    <button command="show-modal" commandfor="mobile-menu-content">
+        <h1 class="title-nav">
+                <span>Menu</span>
+        </h1>
+    </button>
+
+    <dialog id="mobile-menu-content" closedby="any">
+        <h1 class="title-nav">
+            <a href="<?= page('home')->url() ?>">
+                <span>Hic&nbsp;et&nbsp;Nunc&nbsp;Studio</span>
+            </a>
+        </h1>
+        <ul>
+            <li>
+                <a class="nav-item-home" href="<?= page('home')->url() ?>"><?= page('home')->title() ?></a>,&nbsp;
+            </li>
+            <li>
+                <a class="nav-item-projects" href="<?= page('index')->url() ?>"><?= page('index')->title() ?></a>,&nbsp;
+            </li>
+            <li>
+                <a class="nav-item-about" href="<?= page('infos')->url() ?>"><?= page('infos')->title() ?></a>
+            </li>
+        </ul>
+        <button commandfor="mobile-menu-content" command="close" class="close-mobile-menu">
+            Fermer
+        </button>
+    </dialog>
+
 </nav>
\ No newline at end of file
diff --git a/site/templates/infos.php b/site/templates/infos.php
index 545703c..26465c4 100644
--- a/site/templates/infos.php
+++ b/site/templates/infos.php
@@ -1,24 +1,20 @@
 <?php snippet('header') ?>
 
-<div class="main-infos">
+<section class="main-infos">
     <p>
-        <?= $page->presentation() ?>
-        <br>
-        <?= $page->contact() ?>
+        <?= $page->presentation() ?>     
     </p>
-</div>
-
-<div class="skills">
-    <p>
-        <?= $page->skills() ?>
-    </p>
-</div>
-
-<div class="clients">
-    <p class="clients">
-        <?= $page->clients() ?>
-    </p>
-</div>
-
+</section>
+<section class="secondary-infos">
+    <div class="skills">
+        <p>
+              <?= $page->contact() ?><br>
+            <?= $page->skills() ?>
+        </p>
+    </div>
+    <div class="clients">
+            <?= $page->clients() ?>
+    </div>
+</section>
 
 <?php snippet('footer') ?>
\ No newline at end of file