diff --git a/index.html b/index.html
index e307bfe..ea961ea 100644
--- a/index.html
+++ b/index.html
@@ -48,6 +48,10 @@
             </div>
 
         </main>
+        <footer>
+            <p>Sokoban 2022</p>
+            <p>Pour une meilleure expérience, veuillez utiliser ce jeu sur un ordinateur avec un écran horizontal.</p>
+        </footer>
 
     </body>
     <!-- <script type="module" src="./modules/ressources.mjs"></script> -->
diff --git a/style.css b/style.css
index b98fa8e..bff0043 100644
--- a/style.css
+++ b/style.css
@@ -9,12 +9,54 @@ body {
     color: --main-invert-color;
     display: flex;
     flex-direction: column;
+    margin: 0;
+    min-height: 100vh;
 }
 
 main {
     display: flex;
     flex-direction: column;
     align-items: center;
+    margin: 1rem 0;
+}
+
+nav {
+    display: flex;
+    /*width: 100%; */
+    background-color: yellowgreen;
+    padding: 0 20%;
+}
+
+nav ol {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    list-style-type: none;
+}
+
+nav ol li {
+    margin: auto 1rem;
+}
+
+nav ol li button {
+    background-color: transparent;
+    padding: 0.5rem;
+    font-size: large;
+}
+
+
+footer {
+    display: flex;
+    align-items: center;
+    flex-direction: column;
+    position:fixed;
+    width: 100%;
+    bottom: 0;
+    background-color: yellowgreen;
+}
+
+footer p:last-child {
+    font-weight: bolder;
 }
 
 .text-bubble {