diff --git a/index.html b/index.html
index dd7b849..6caa1f9 100644
--- a/index.html
+++ b/index.html
@@ -22,6 +22,12 @@
             </button>
         </div>
     </div>
+    <div class="header">
+        <div class="banner-div">
+            <img src="/src/img/banner_about.png">
+        </div>
+
+    </div>
     <div class="content">
         <nav>
             <ul>
@@ -30,6 +36,9 @@
                 <li><a class="navbar-link" href="https://abonentendeur.guams.fr">My blog</a></li>
             </ul>
         </nav>
+        <div class="navigation">
+            <a class="header-nav-button" href="/"></a>
+        </div>
         <div class="welcome">
             <span>coucou</span>
         </div>
diff --git a/src/img/banner_about.png b/src/img/banner_about.png
new file mode 100644
index 0000000..81fddd4
Binary files /dev/null and b/src/img/banner_about.png differ
diff --git a/src/img/banner_home.png b/src/img/banner_home.png
new file mode 100644
index 0000000..e5ed8f4
Binary files /dev/null and b/src/img/banner_home.png differ
diff --git a/src/img/cursor.png b/src/img/cursor.png
new file mode 100644
index 0000000..fd3e2f7
Binary files /dev/null and b/src/img/cursor.png differ
diff --git a/src/img/template_banner.xcf b/src/img/template_banner.xcf
new file mode 100644
index 0000000..8711189
Binary files /dev/null and b/src/img/template_banner.xcf differ
diff --git a/src/style.css b/src/style.css
index f4d94c7..3ba2498 100644
--- a/src/style.css
+++ b/src/style.css
@@ -1,16 +1,26 @@
 * {
     font-family: ms ui gothic, sans-serif;
     margin: 0;
-    font-size: 12px;
+    font-size: 16px;
 }
 
 body {
+    cursor: url('/src/img/cursor.png'), default;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
 }
 
+
+.banner-div {
+    box-shadow: inset -1px -1px #404040, inset 1px 1px #DFDFDF, inset -2px -2px #7F7F7F, inset 2px 2px #FFFFFF, inset -3px -3px #C3C3C3, inset 3px 3px #C3C3C3, inset -4px -4px #C3C3C3, inset 4px 4px #C3C3C3;
+    display: block;
+    max-width: 100%;
+    height: 200px;
+    background: rgba(0,0,0,0.5);
+}
+
 main {
     margin: auto;
     width: 850px;
@@ -42,13 +52,17 @@ main {
     text-shadow: 0 0 #222;
 }
 
+.header {
+    box-shadow: inset -1px -1px #404040, inset 1px 1px #DFDFDF, inset -2px -2px #7F7F7F, inset 2px 2px #FFFFFF, inset -3px -3px #C3C3C3, inset 3px 3px #C3C3C3, inset -4px -4px #C3C3C3, inset 4px 4px #C3C3C3;
+}
+
 .content {
     display: flex;
     justify-content: space-around;
     align-items: stretch;
-    background-color: #373737;
     color: white;
     box-shadow: inset -1px -1px #404040, inset 1px 1px #DFDFDF, inset -2px -2px #7F7F7F, inset 2px 2px #FFFFFF, inset -3px -3px #C3C3C3, inset 3px 3px #C3C3C3, inset -4px -4px #C3C3C3, inset 4px 4px #C3C3C3;
+    background-color: #373737;
     padding: 7px;
 }
 
@@ -65,6 +79,8 @@ li {
 }
 
 nav {
+    background-color: blue;
+    width: 80%;
     border-right: 1px solid #0a0a0a;
 }
 
@@ -74,5 +90,6 @@ nav {
 }
 
 .welcome {
+    width: 80%;
     background-color: red;
 }
\ No newline at end of file