diff --git a/index.html b/index.html
index 32c571f..bbc027b 100644
--- a/index.html
+++ b/index.html
@@ -13,43 +13,72 @@
   <body class="d-flex flex-column min-vh-100">
     <div id="tsparticles"></div>
     <div class="container m-5 mx-auto text-center">
-      <h1 class="ml2">Bienvenue sur orabis.fr</h1>
-      <h2>Retrouvez tous mes projets déployés :</h2>
+      <h1>Bienvenue sur <strong>orabis.fr</strong></h1>
+      <h2>Retrouvez ici tous mes projets déployés</h2>
+      <div class="d-flex justify-content-center mt-4">
+        <a href="http://x.com/orabisss" target="_blank">
+          <img class="img-fluid social-icon" src="/x.svg" alt="x.com" >
+        </a>
+        <a href="http://github.com/orabis">
+          <img class="img-fluid social-icon" src="/github.svg" alt="github.com">
+        </a>
+        <a href="https://behance.net/orabis">
+          <img class="img-fluid social-icon" src="/behance.svg" alt="behance.com">
+        </a>
+      </div>
     </div>
-    <hr class="my-4" />
+    <hr class="my-4 w-50 mx-auto"/>
     <div class="container m-5 mx-auto row">
       <div class="col-sm-6 mb-4">
         <div class="card bg-dark bg-opacity-50 text-white">
-          <img class="card-img-top" src="/berserk.png" alt="Card image cap">
+          <img class="card-img-fluid" src="/stockseekerimage.png" alt="Image du projet">
+
           <div class="card-body">
-            <h5 class="card-title">Projet 1</h5>
-            <p class="card-text">Description du projet 1</p>
-            <a href="#" class="btn btn-outline-light">Voir le projet</a>
+            <h5 class="card-title">E5-Stockseeker</h5>
+            <p class="card-text">
+              Outil de gestion de stock. Ajoutez vos entrepôts, 
+              créez vos produits et gérez vos stocks en toute simplicité. 
+              Profitez d’une interface épurée et intuitive pour une gestion efficace. 
+              Suivez vos stocks en temps réel, sans complication.
+            </p>
+            <a href="#" class="btn btn-outline-light">Accéder au projet <img class="icon" src="/arrow.svg" alt=""></a>
+            <a href="#" class="btn btn-outline-light">Code source <img class="icon icon-gear" src="/gear.svg" alt=""></a>
+
           </div>
         </div>
       </div>
       <div class="col-sm-6 mb-4">
         <div class="card bg-dark bg-opacity-50 text-white">
-          <img class="card-img-top" src="/berserk.png" alt="Card image cap">
+          <img class="card-img-fluid" src="/exportgit.png" alt="Image du projet">
           <div class="card-body opacity-100">
-            <h5 class="card-title">Projet 2</h5>
-            <p class="card-text">Description du projet 2</p>
-            <a href="#" class="btn btn-outline-light">Voir le projet</a>
+            <h5 class="card-title">E5-ExportGitlab</h5>
+            <p class="card-text">
+              L'application simplifie l'exportation des issues d'un projet, 
+              permettant de les télécharger au format PDF. 
+              Le projet a été réalisé pendant ma période de formation à la Direction du Numérique de l'Université de Strasbourg.
+            </p>
+            <a href="#" class="btn btn-outline-light">Accéder au projet <img class="icon" src="/arrow.svg" alt=""></a>
+            <a href="#" class="btn btn-outline-light">Code source <img class="icon icon-gear" src="/gear.svg" alt=""></a>
+
           </div>
         </div>
       </div>
       <div class="col-sm-6 mb-4">
         <div class="card bg-dark bg-opacity-50 text-white">
-          <img class="card-img-top" src="/berserk.png" alt="Card image cap">
+          <img class="card-img-top" src="/blog.png" alt="Image du projet">
           <div class="card-body opacity-100">
-            <h5 class="card-title">Projet 2</h5>
-            <p class="card-text">Description du projet 2</p>
-            <a href="#" class="btn btn-outline-light">Voir le projet</a>
+            <h5 class="card-title">La chambre à l'heure</h5>
+            <p class="card-text">
+              Blog interactif fait avec WordPress, un coin détente pour lire mes articles. 
+              J’y partage mes veilles technologiques, mes analyses d'œuvres, 
+              mes idées de développement ainsi que diverses astuces et conseils.
+            </p>
+            <a href="#" class="btn btn-outline-light">Accéder au projet <img class="icon" src="/arrow.svg" alt=""></a>
           </div>
         </div>
       </div>
     </div>
-    <footer class="mt-auto">
+    <footer>
       <div class="container m-5 mx-auto text-center">
         <p>© 2025 Orabis</p>
       </div>
diff --git a/public/arrow.svg b/public/arrow.svg
new file mode 100644
index 0000000..4038c3a
--- /dev/null
+++ b/public/arrow.svg
@@ -0,0 +1,7 @@
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools -->
+<svg fill="#ffffff" height="201px" width="201px" version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="-33 -33 396.00 396.00" xml:space="preserve" stroke="#ffffff" transform="matrix(1, 0, 0, 1, 0, 0)rotate(0)">
+<g id="SVGRepo_bgCarrier" stroke-width="0"/>
+<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/>
+<g id="SVGRepo_iconCarrier"> <path id="XMLID_27_" d="M15,180h263.787l-49.394,49.394c-5.858,5.857-5.858,15.355,0,21.213C232.322,253.535,236.161,255,240,255 s7.678-1.465,10.606-4.394l75-75c5.858-5.857,5.858-15.355,0-21.213l-75-75c-5.857-5.857-15.355-5.857-21.213,0 c-5.858,5.857-5.858,15.355,0,21.213L278.787,150H15c-8.284,0-15,6.716-15,15S6.716,180,15,180z"/> </g>
+</svg>
\ No newline at end of file
diff --git a/public/behance.svg b/public/behance.svg
new file mode 100644
index 0000000..bf40bd5
--- /dev/null
+++ b/public/behance.svg
@@ -0,0 +1 @@
+<svg fill="#FFFFFF" xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 32 32" width="32px" height="32px"><path d="M 1 6.75 L 1 25.25 L 9.9375 25.25 C 10.765625 25.25 16.46875 25.082031 16.46875 19.875 C 16.46875 16.621094 14.230469 15.515625 13.09375 15.1875 C 13.929688 14.792969 15.59375 13.855469 15.59375 11.34375 C 15.59375 9.945313 15.394531 6.75 9.6875 6.75 Z M 21.375 8.46875 L 21.375 10.15625 L 28.28125 10.15625 L 28.28125 8.46875 Z M 5.0625 9.90625 L 8.875 9.90625 C 9.234375 9.90625 11.65625 9.714844 11.65625 12.03125 C 11.65625 14.011719 9.90625 14.21875 9.1875 14.21875 L 5.0625 14.21875 Z M 25 11.6875 C 19.777344 11.6875 18.6875 16.222656 18.6875 18.1875 C 18.6875 24.019531 23.46875 24.6875 25 24.6875 C 29.128906 24.6875 30.300781 22.015625 30.78125 20.53125 L 27.78125 20.53125 C 27.664063 20.914063 26.789063 22.15625 25.125 22.15625 C 22.335938 22.15625 22.09375 19.976563 22.09375 19 L 30.96875 19 C 31.148438 15.625 29.671875 11.6875 25 11.6875 Z M 24.90625 14.21875 C 25.738281 14.21875 26.410156 14.460938 26.8125 14.90625 C 27.214844 15.355469 27.511719 16.011719 27.59375 16.875 L 22.09375 16.875 C 22.109375 16.636719 22.164063 16.363281 22.25 16.0625 C 22.335938 15.753906 22.46875 15.460938 22.6875 15.1875 C 22.90625 14.917969 23.210938 14.683594 23.5625 14.5 C 23.921875 14.3125 24.367188 14.21875 24.90625 14.21875 Z M 5.0625 17 L 9.46875 17 C 10.34375 17 12.40625 17.136719 12.40625 19.65625 C 12.40625 22.097656 9.808594 22.09375 9.40625 22.09375 L 5.0625 22.09375 Z"/></svg>
\ No newline at end of file
diff --git a/public/berserk.png b/public/berserk.png
deleted file mode 100644
index ca455ef..0000000
Binary files a/public/berserk.png and /dev/null differ
diff --git a/public/blog.png b/public/blog.png
new file mode 100644
index 0000000..501bc86
Binary files /dev/null and b/public/blog.png differ
diff --git a/public/exportgit.png b/public/exportgit.png
new file mode 100644
index 0000000..c539cdf
Binary files /dev/null and b/public/exportgit.png differ
diff --git a/public/gear.svg b/public/gear.svg
new file mode 100644
index 0000000..3b89fa4
--- /dev/null
+++ b/public/gear.svg
@@ -0,0 +1,9 @@
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="SVGRepo_bgCarrier" stroke-width="0"/>
+<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/>
+<g id="SVGRepo_iconCarrier">
+<path clip-rule="evenodd" d="m12 2.25c-1.5208 0-2.79833 1.14348-2.96627 2.65494l-.0917.82526c-.01543.13888-.11542.30627-.31935.42432-.20104.11638-.39276.11958-.52314.06246l-.7609-.33338c-1.39293-.61029-3.022-.07562-3.78238 1.2414s-.40889 2.9952.81611 3.8963l.66963.4927c.11406.0839.20801.2529.20801.486s-.09395.4021-.20801.486l-.66963.4927c-1.225.9011-1.57649 2.5793-.81611 3.8963s2.38945 1.8517 3.78238 1.2414l.7609-.3334c.13038-.0571.3221-.0539.52314.0625.20393.118.30392.2854.31935.4243l.0917.8253c.16794 1.5114 1.44547 2.6549 2.96627 2.6549s2.7983-1.1435 2.9663-2.6549l.0917-.8253c.0154-.1389.1154-.3063.3193-.4243.2011-.1164.3928-.1196.5232-.0625l.7609.3334c1.3929.6103 3.022.0756 3.7824-1.2414.7603-1.317.4088-2.9952-.8162-3.8963l-.6696-.4927c-.114-.0839-.208-.2529-.208-.486s.094-.4021.208-.486l.6696-.4927c1.225-.9011 1.5765-2.57928.8162-3.8963-.7604-1.31702-2.3895-1.85169-3.7824-1.2414l-.7609.33337c-.1304.05713-.3221.05393-.5232-.06245-.2039-.11805-.3039-.28544-.3193-.42433l-.0917-.82525c-.168-1.51146-1.4455-2.65494-2.9663-2.65494zm-1.4754 2.82059c.0835-.75181.719-1.32059 1.4754-1.32059s1.3919.56878 1.4755 1.32059l.0917.82525c.0781.70365.5289 1.25021 1.0586 1.55686.5335.30881 1.2296.42166 1.8766.13819l.7609-.33337c.6929-.30357 1.5032-.03762 1.8814.61748s.2034 1.48982-.4059 1.93807l-.6696.49263c-.5691.4186-.8192 1.0794-.8192 1.6943s.2501 1.2757.8192 1.6943l.6696.4926c.6093.4483.7841 1.283.4059 1.9381s-1.1885.921-1.8814.6175l-.7609-.3334c-.647-.2835-1.3431-.1706-1.8766.1382-.5297.3067-.9805.8532-1.0586 1.5569l-.0917.8252c-.0836.7518-.7191 1.3206-1.4755 1.3206s-1.3919-.5688-1.4754-1.3206l-.0917-.8252c-.0782-.7037-.529-1.2502-1.05873-1.5569-.53347-.3088-1.2296-.4217-1.87659-.1382l-.76089.3334c-.69286.3035-1.50317.0376-1.88139-.6175-.37823-.6551-.20339-1.4898.40594-1.9381l.66963-.4926c.56902-.4186.81914-1.0794.81914-1.6943s-.25012-1.2757-.81914-1.6943l-.66963-.49263c-.60933-.44825-.78417-1.28297-.40594-1.93807.37822-.6551 1.18853-.92105 1.88139-.61748l.76089.33337c.64699.28347 1.34312.17062 1.87659-.13819.52973-.30665.98053-.85321 1.05873-1.55685zm.2254 6.92941c0-.6904.5597-1.25 1.25-1.25.6904 0 1.25.5596 1.25 1.25s-.5596 1.25-1.25 1.25c-.6903 0-1.25-.5596-1.25-1.25zm1.25-2.75c-1.5188 0-2.74999 1.2312-2.74999 2.75s1.23119 2.75 2.74999 2.75 2.75-1.2312 2.75-2.75-1.2312-2.75-2.75-2.75z" fill="#ffffff" fill-rule="evenodd"/>
+</g>
+</svg>
\ No newline at end of file
diff --git a/public/github.svg b/public/github.svg
new file mode 100644
index 0000000..ead4ea0
--- /dev/null
+++ b/public/github.svg
@@ -0,0 +1 @@
+<?xml version="1.0"?><svg fill="#FFFFFF" xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 30 30" width="30px" height="30px">    <path d="M15,3C8.373,3,3,8.373,3,15c0,5.623,3.872,10.328,9.092,11.63C12.036,26.468,12,26.28,12,26.047v-2.051 c-0.487,0-1.303,0-1.508,0c-0.821,0-1.551-0.353-1.905-1.009c-0.393-0.729-0.461-1.844-1.435-2.526 c-0.289-0.227-0.069-0.486,0.264-0.451c0.615,0.174,1.125,0.596,1.605,1.222c0.478,0.627,0.703,0.769,1.596,0.769 c0.433,0,1.081-0.025,1.691-0.121c0.328-0.833,0.895-1.6,1.588-1.962c-3.996-0.411-5.903-2.399-5.903-5.098 c0-1.162,0.495-2.286,1.336-3.233C9.053,10.647,8.706,8.73,9.435,8c1.798,0,2.885,1.166,3.146,1.481C13.477,9.174,14.461,9,15.495,9 c1.036,0,2.024,0.174,2.922,0.483C18.675,9.17,19.763,8,21.565,8c0.732,0.731,0.381,2.656,0.102,3.594 c0.836,0.945,1.328,2.066,1.328,3.226c0,2.697-1.904,4.684-5.894,5.097C18.199,20.49,19,22.1,19,23.313v2.734 c0,0.104-0.023,0.179-0.035,0.268C23.641,24.676,27,20.236,27,15C27,8.373,21.627,3,15,3z"/></svg>
\ No newline at end of file
diff --git a/public/stockseekerimage.png b/public/stockseekerimage.png
new file mode 100644
index 0000000..b14e684
Binary files /dev/null and b/public/stockseekerimage.png differ
diff --git a/public/twitter.svg b/public/twitter.svg
new file mode 100644
index 0000000..cb2bb16
--- /dev/null
+++ b/public/twitter.svg
@@ -0,0 +1 @@
+<svg fill="#FFFFFF" xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 50 50" width="50px" height="50px"><path d="M 5.9199219 6 L 20.582031 27.375 L 6.2304688 44 L 9.4101562 44 L 21.986328 29.421875 L 31.986328 44 L 44 44 L 28.681641 21.669922 L 42.199219 6 L 39.029297 6 L 27.275391 19.617188 L 17.933594 6 L 5.9199219 6 z M 9.7167969 8 L 16.880859 8 L 40.203125 42 L 33.039062 42 L 9.7167969 8 z"/></svg>
\ No newline at end of file
diff --git a/public/x.svg b/public/x.svg
new file mode 100644
index 0000000..b7142b7
--- /dev/null
+++ b/public/x.svg
@@ -0,0 +1 @@
+<svg fill="#FFFFFF" xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 30 30" width="30px" height="30px"><path d="M26.37,26l-8.795-12.822l0.015,0.012L25.52,4h-2.65l-6.46,7.48L11.28,4H4.33l8.211,11.971L12.54,15.97L3.88,26h2.65 l7.182-8.322L19.42,26H26.37z M10.23,6l12.34,18h-2.1L8.12,6H10.23z"/></svg>
\ No newline at end of file
diff --git a/src/styles.scss b/src/styles.scss
index 7212938..006b256 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -1,6 +1,6 @@
 @import "bootstrap/scss/bootstrap";
 $primary-color: #3498db;
-$secondary-color: #2ecc71;
+$secondary-color: #ffffff;
 $font-stack: 'Quicksand', sans-serif;
 
 body {
@@ -9,4 +9,30 @@ body {
   color: #ffffff;
   margin: 0;
   padding: 0;
+}
+
+.social-icon{
+  width: 50px;
+  height: auto;
+  margin: 0 5px;
+}
+
+.icon{
+  width: 20px;
+  height: auto;
+  margin-left: 5px;
+}
+@keyframes infinite-rotate {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+.btn:hover .icon{
+  filter: invert(100%) sepia(100%) hue-rotate(180deg);
+}
+.btn:hover .icon-gear{
+  animation: infinite-rotate 5s linear infinite;
 }
\ No newline at end of file
