diff --git a/contact.html b/contact.html
index 334d284..a278fac 100644
--- a/contact.html
+++ b/contact.html
@@ -10,7 +10,7 @@
     <header>
         <nav>
             <ul>
-                <li><a href="index.html">Accueil</a></li>
+                <li><a href="home.html">Accueil</a></li>
                 <li><a href="portfolio.html">Portfolio</a></li>
                 <li><a href="contact.html">Contact</a></li>
             </ul>
diff --git a/index.html b/home.html
similarity index 59%
rename from index.html
rename to home.html
index 7a67c4c..1f61fe8 100644
--- a/index.html
+++ b/home.html
@@ -10,15 +10,19 @@
     <header>
         <nav>
             <ul>
-                <li><a href="index.html">Accueil</a></li>
+                <li><a href="home.html">Accueil</a></li>
                 <li><a href="portfolio.html">Portfolio</a></li>
                 <li><a href="contact.html">Contact</a></li>
             </ul>
         </nav>
     </header>
-    <main>
-        <h1>Bienvenue, je suis Funiclem</h1>
-        <p>Étudiant en première année à Epitech Strasbourg, passionné de VTT, sport et informatique.</p>
+    <main class="profile">
+        <img src="img/photo-profil.jpg" alt="Photo de Funiclem" class="profile-pic">
+        <div class="profile-info">
+            <h1>Clément DORGE</h1>
+            <p>19 ans</p>
+            <p>Étudiant à Epitech Strasbourg, 2ème année, promo 2028</p>
+        </div>
     </main>
     <script src="script.js"></script>
 </body>
diff --git a/img/photo-profil.jpg b/img/photo-profil.jpg
new file mode 100644
index 0000000..e77bb90
Binary files /dev/null and b/img/photo-profil.jpg differ
diff --git a/portfolio.html b/portfolio.html
index 894a67a..4d90f17 100644
--- a/portfolio.html
+++ b/portfolio.html
@@ -10,7 +10,7 @@
     <header>
         <nav>
             <ul>
-                <li><a href="index.html">Accueil</a></li>
+                <li><a href="home.html">Accueil</a></li>
                 <li><a href="portfolio.html">Portfolio</a></li>
                 <li><a href="contact.html">Contact</a></li>
             </ul>
diff --git a/styles.css b/styles.css
index d3ce8a6..36c9a8e 100644
--- a/styles.css
+++ b/styles.css
@@ -2,6 +2,10 @@ body {
     font-family: Arial, sans-serif;
     margin: 0;
     padding: 0;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
 }
 
 header {
@@ -9,6 +13,9 @@ header {
     color: #fff;
     padding: 10px 0;
     text-align: center;
+    width: 100%;
+    position: absolute;
+    top: 0;
 }
 
 nav ul {
@@ -26,29 +33,28 @@ nav ul li a {
     text-decoration: none;
 }
 
-main {
-    padding: 20px;
-}
-
-form {
+main.profile {
     display: flex;
-    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    flex-direction: row;
+    width: 80%;
 }
 
-form label {
-    margin-top: 10px;
+.profile-pic {
+    border-radius: 50%;
+    width: 33vw;
+    height: 33vw;
+    object-fit: cover;
+    margin-right: 20px;
 }
 
-form input, form textarea {
-    padding: 5px;
-    margin-top: 5px;
+.profile-info h1 {
+    margin: 0;
+    padding: 0;
 }
 
-form button {
-    margin-top: 10px;
-    padding: 10px;
-    background-color: #333;
-    color: #fff;
-    border: none;
-    cursor: pointer;
+.profile-info p {
+    margin: 5px 0;
+    padding: 0;
 }