diff --git a/public/img/cpne.jpg b/public/img/cpne.jpg
new file mode 100644
index 0000000..f3f3ab3
Binary files /dev/null and b/public/img/cpne.jpg differ
diff --git a/public/img/cpne.png b/public/img/cpne.png
new file mode 100644
index 0000000..ecf2311
Binary files /dev/null and b/public/img/cpne.png differ
diff --git a/public/img/discord.svg b/public/img/discord.svg
new file mode 100644
index 0000000..81f2c15
--- /dev/null
+++ b/public/img/discord.svg
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg fill="#000000" width="800px" height="800px" viewBox="0 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg">
+<title>discord</title>
+<path d="M20.992 20.163c-1.511-0.099-2.699-1.349-2.699-2.877 0-0.051 0.001-0.102 0.004-0.153l-0 0.007c-0.003-0.048-0.005-0.104-0.005-0.161 0-1.525 1.19-2.771 2.692-2.862l0.008-0c1.509 0.082 2.701 1.325 2.701 2.847 0 0.062-0.002 0.123-0.006 0.184l0-0.008c0.003 0.050 0.005 0.109 0.005 0.168 0 1.523-1.191 2.768-2.693 2.854l-0.008 0zM11.026 20.163c-1.511-0.099-2.699-1.349-2.699-2.877 0-0.051 0.001-0.102 0.004-0.153l-0 0.007c-0.003-0.048-0.005-0.104-0.005-0.161 0-1.525 1.19-2.771 2.692-2.862l0.008-0c1.509 0.082 2.701 1.325 2.701 2.847 0 0.062-0.002 0.123-0.006 0.184l0-0.008c0.003 0.048 0.005 0.104 0.005 0.161 0 1.525-1.19 2.771-2.692 2.862l-0.008 0zM26.393 6.465c-1.763-0.832-3.811-1.49-5.955-1.871l-0.149-0.022c-0.005-0.001-0.011-0.002-0.017-0.002-0.035 0-0.065 0.019-0.081 0.047l-0 0c-0.234 0.411-0.488 0.924-0.717 1.45l-0.043 0.111c-1.030-0.165-2.218-0.259-3.428-0.259s-2.398 0.094-3.557 0.275l0.129-0.017c-0.27-0.63-0.528-1.142-0.813-1.638l0.041 0.077c-0.017-0.029-0.048-0.047-0.083-0.047-0.005 0-0.011 0-0.016 0.001l0.001-0c-2.293 0.403-4.342 1.060-6.256 1.957l0.151-0.064c-0.017 0.007-0.031 0.019-0.040 0.034l-0 0c-2.854 4.041-4.562 9.069-4.562 14.496 0 0.907 0.048 1.802 0.141 2.684l-0.009-0.11c0.003 0.029 0.018 0.053 0.039 0.070l0 0c2.14 1.601 4.628 2.891 7.313 3.738l0.176 0.048c0.008 0.003 0.018 0.004 0.028 0.004 0.032 0 0.060-0.015 0.077-0.038l0-0c0.535-0.72 1.044-1.536 1.485-2.392l0.047-0.1c0.006-0.012 0.010-0.027 0.010-0.043 0-0.041-0.026-0.075-0.062-0.089l-0.001-0c-0.912-0.352-1.683-0.727-2.417-1.157l0.077 0.042c-0.029-0.017-0.048-0.048-0.048-0.083 0-0.031 0.015-0.059 0.038-0.076l0-0c0.157-0.118 0.315-0.24 0.465-0.364 0.016-0.013 0.037-0.021 0.059-0.021 0.014 0 0.027 0.003 0.038 0.008l-0.001-0c2.208 1.061 4.8 1.681 7.536 1.681s5.329-0.62 7.643-1.727l-0.107 0.046c0.012-0.006 0.025-0.009 0.040-0.009 0.022 0 0.043 0.008 0.059 0.021l-0-0c0.15 0.124 0.307 0.248 0.466 0.365 0.023 0.018 0.038 0.046 0.038 0.077 0 0.035-0.019 0.065-0.046 0.082l-0 0c-0.661 0.395-1.432 0.769-2.235 1.078l-0.105 0.036c-0.036 0.014-0.062 0.049-0.062 0.089 0 0.016 0.004 0.031 0.011 0.044l-0-0.001c0.501 0.96 1.009 1.775 1.571 2.548l-0.040-0.057c0.017 0.024 0.046 0.040 0.077 0.040 0.010 0 0.020-0.002 0.029-0.004l-0.001 0c2.865-0.892 5.358-2.182 7.566-3.832l-0.065 0.047c0.022-0.016 0.036-0.041 0.039-0.069l0-0c0.087-0.784 0.136-1.694 0.136-2.615 0-5.415-1.712-10.43-4.623-14.534l0.052 0.078c-0.008-0.016-0.022-0.029-0.038-0.036l-0-0z"></path>
+</svg>
\ No newline at end of file
diff --git a/public/img/entreprise_immo_1.png b/public/img/entreprise_immo_1.png
new file mode 100644
index 0000000..022b1bb
Binary files /dev/null and b/public/img/entreprise_immo_1.png differ
diff --git a/public/img/entreprise_immo_2.jpeg b/public/img/entreprise_immo_2.jpeg
new file mode 100644
index 0000000..31b7114
Binary files /dev/null and b/public/img/entreprise_immo_2.jpeg differ
diff --git a/public/img/entreprise_immo_3.png b/public/img/entreprise_immo_3.png
new file mode 100644
index 0000000..a90cdf8
Binary files /dev/null and b/public/img/entreprise_immo_3.png differ
diff --git a/public/img/entreprise_immo_4.png b/public/img/entreprise_immo_4.png
new file mode 100644
index 0000000..d3cebef
Binary files /dev/null and b/public/img/entreprise_immo_4.png differ
diff --git a/public/img/entreprise_immo_5.webp b/public/img/entreprise_immo_5.webp
new file mode 100644
index 0000000..b0cf183
Binary files /dev/null and b/public/img/entreprise_immo_5.webp differ
diff --git a/public/img/entreprise_immo_6.png b/public/img/entreprise_immo_6.png
new file mode 100644
index 0000000..db666c4
Binary files /dev/null and b/public/img/entreprise_immo_6.png differ
diff --git a/public/img/facebook.svg b/public/img/facebook.svg
new file mode 100644
index 0000000..2b42c69
--- /dev/null
+++ b/public/img/facebook.svg
@@ -0,0 +1,4 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M20 12.05C19.9813 10.5255 19.5273 9.03809 18.6915 7.76295C17.8557 6.48781 16.673 5.47804 15.2826 4.85257C13.8921 4.2271 12.3519 4.01198 10.8433 4.23253C9.33473 4.45309 7.92057 5.10013 6.7674 6.09748C5.61422 7.09482 4.77005 8.40092 4.3343 9.86195C3.89856 11.323 3.88938 12.8781 4.30786 14.3442C4.72634 15.8103 5.55504 17.1262 6.69637 18.1371C7.83769 19.148 9.24412 19.8117 10.75 20.05V14.38H8.75001V12.05H10.75V10.28C10.7037 9.86846 10.7483 9.45175 10.8807 9.05931C11.0131 8.66687 11.23 8.30827 11.5161 8.00882C11.8022 7.70936 12.1505 7.47635 12.5365 7.32624C12.9225 7.17612 13.3368 7.11255 13.75 7.14003C14.3498 7.14824 14.9482 7.20173 15.54 7.30003V9.30003H14.54C14.3676 9.27828 14.1924 9.29556 14.0276 9.35059C13.8627 9.40562 13.7123 9.49699 13.5875 9.61795C13.4627 9.73891 13.3667 9.88637 13.3066 10.0494C13.2464 10.2125 13.2237 10.387 13.24 10.56V12.07H15.46L15.1 14.4H13.25V20C15.1399 19.7011 16.8601 18.7347 18.0985 17.2761C19.3369 15.8175 20.0115 13.9634 20 12.05Z" fill="#000000"/>
+</svg>
\ No newline at end of file
diff --git a/public/img/infomaniak.png b/public/img/infomaniak.png
new file mode 100644
index 0000000..3d4b42c
Binary files /dev/null and b/public/img/infomaniak.png differ
diff --git a/public/img/linkedin.svg b/public/img/linkedin.svg
new file mode 100644
index 0000000..6f9ebb0
--- /dev/null
+++ b/public/img/linkedin.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg width="800px" height="800px" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="none"><path fill="#0A66C2" d="M12.225 12.225h-1.778V9.44c0-.664-.012-1.519-.925-1.519-.926 0-1.068.724-1.068 1.47v2.834H6.676V6.498h1.707v.783h.024c.348-.594.996-.95 1.684-.925 1.802 0 2.135 1.185 2.135 2.728l-.001 3.14zM4.67 5.715a1.037 1.037 0 01-1.032-1.031c0-.566.466-1.032 1.032-1.032.566 0 1.031.466 1.032 1.032 0 .566-.466 1.032-1.032 1.032zm.889 6.51h-1.78V6.498h1.78v5.727zM13.11 2H2.885A.88.88 0 002 2.866v10.268a.88.88 0 00.885.866h10.226a.882.882 0 00.889-.866V2.865a.88.88 0 00-.889-.864z"/></svg>
\ No newline at end of file
diff --git a/public/img/panoee.png b/public/img/panoee.png
new file mode 100644
index 0000000..9123fa9
Binary files /dev/null and b/public/img/panoee.png differ
diff --git a/resources/css/app.css b/resources/css/app.css
index 92abe0d..d96a167 100644
--- a/resources/css/app.css
+++ b/resources/css/app.css
@@ -58,4 +58,56 @@ @layer utilities {
         -ms-overflow-y-style: none;  /* IE and Edge */
         scrollbar-width: none;  /* Firefox */
     }
+
+    .social-icon-in {
+        animation: 0.2s social-icon-in-anim ease-out forwards;
+    }
+
+    .social-icon-out {
+        animation: 0.2s social-icon-out-anim ease-in forwards;
+    }
+
+    .slider {
+        position: absolute;
+        left: -50%;
+        animation-name: slide;
+        animation-duration: 18s;
+        animation-iteration-count: infinite;
+        animation-timing-function: linear;
+        animation-delay: var(--delay);
+    }
+
+    @keyframes social-icon-in-anim {
+        from {
+            background-color: inherit;
+            transform: scale(1);
+        }
+        to {
+            background-color: rgb(234 88 12 / 0.8);
+            transform: scale(0.9);
+        }
+    }
+
+    @keyframes social-icon-out-anim {
+        from {
+            background-color: rgb(234 88 12 / 0.8);
+            transform: scale(0.9);
+        }
+        to {
+            background-color: inherit;
+            transform: scale(1);
+        }
+    }
+
+    @keyframes slide {
+        from {
+            left: -25%;
+        }
+        to {
+            left: 100%;
+        }
+    }
+
 }
+
+
diff --git a/resources/views/demo.blade.php b/resources/views/demo.blade.php
index d243d75..5682f47 100644
--- a/resources/views/demo.blade.php
+++ b/resources/views/demo.blade.php
@@ -1,10 +1,10 @@
 @extends("layout")
 
 @section("content")
-    <div class="flex flex-col w-3/4 mx-auto mt-12 pt-10 h-full">
+    <div class="flex flex-col w-3/4 mx-auto mt-2 pt-10 h-full">
         <h1 class="px-3 text-[3rem] font-semibold">Demo</h1>
         <div class="rounded-lg overflow-hidden w-full h-3/4 mt-2 shadow-md shadow-gray-950">
-            <iframe src="https://tour.panoee.net/natadesa-endek/62621a50118202256c6ab134" class="w-full h-[500px]"></iframe>
+            <iframe src="https://tour.panoee.net/natadesa-endek/62621a50118202256c6ab134" class="w-full h-full"></iframe>
         </div>
     </div>
 @endsection
diff --git a/resources/views/home.blade.php b/resources/views/home.blade.php
index f57974c..6122132 100644
--- a/resources/views/home.blade.php
+++ b/resources/views/home.blade.php
@@ -1,28 +1,45 @@
 @extends("layout")
 
 @section("content")
-    <div class="relative flex flex-col items-center justify-center overflow-hidden mt-12">
-        <img class="w-full absolute right-0 left-0 -z-10" src="/img/immo.jpg">
+    <div class="relative flex flex-col items-center justify-center overflow-hidden">
+        <img class="w-full absolute right-0 left-0 -z-10 blur-[3px]" src="/img/immo.jpg">
         <div class="bg-gradient-to-tr from-orange-600 to-orange-400 rounded-lg shadow-md shadow-gray-800 flex flex-col items-center p-10 mt-10 mb-10 w-fit">
-            <h5 class="text-[6rem] font-bold mx-auto leading-none">MaVisite360°</h5>
+            <h5 class="text-[6rem] font-bold mx-auto leading-none">Ma Visite 360</h5>
             <h5 class="text-[1.2rem] italic text-center mx-auto">Ma visite, mon choix à 360°</h5>
         </div>
     </div>
     <div class="flex flex-col w-3/4 h-fit mx-auto mb-10">
         <h1 class="mt-10 px-3 text-[3rem] font-bold">Histoire</h1>
-        <h2 class="px-3 mx-auto text-[1.4rem] font-semibold">Fondée en 2024 et basée à Neuchâtel. MaVisite360 est une entreprise fictive spécialisée dans les technologies immersives, avec un site web accessible sous le nom de domaine mv360.ch.</h2>
-        <h2 class="mt-5 px-3 mx-auto text-[1.1rem]">MaVisite360 propose un service novateur de visites virtuelles immersives 360°, destiné principalement aux agences immobilières. Notre solution clé en main englobe toutes les étapes : prise de contact, capture de photos professionnelles, création de visites virtuelles interactives et hébergement en ligne. Cette approche permet une intégration simple et rapide sur les sites web des clients.</h2>
+        <h2 class="px-3 mx-auto text-[1.4rem] font-semibold">
+            Fondée en 2024 et basée à Neuchâtel. 
+            "Ma Visite 360" est une entreprise fictive spécialisée dans les technologies immersives, 
+            avec un site web accessible sous le nom de domaine mv360.ch.
+        </h2>
+        <h2 class="mt-5 px-3 text-[1.3rem]">
+            "Ma Visite 360" propose un service novateur de visites virtuelles immersives 360°, 
+            destiné principalement aux agences immobilières.<br> 
+            Notre solution clé en main englobe toutes les étapes : 
+        </h2>
+        <ul class="text-gray-50 text-[1.3rem] list-disc px-10">
+            <li><h3 class="font-semibold">Prise de contact.</h3></li>
+            <li><h3 class="font-semibold">Capture de photos professionnelles.</h3></li>
+            <li><h3 class="font-semibold">Création de visites virtuelles interactives et hébergement en ligne.</h3></li>
+        </ul>
+        <h2 class="px-3 text-[1.3rem] mt-1">
+            Cette approche permet une intégration simple et rapide sur les sites web des clients.
+        </h2>
+        
         <div class="w-full h-fit flex items-center justify-center flex-col">
             <div class="mt-5 flex w-full items-center">
-                <div class="w-[40%] p-3 m-3 bg-gradient-to-tr from-orange-600 to-orange-500 shadow-md shadow-gray-900 rounded-lg">
+                <div class="w-[40%] p-3 hover:scale-105 m-3 bg-gradient-to-tr from-orange-600 to-orange-500 shadow-md shadow-gray-900 rounded-lg">
                     <h5 class="text-[2rem] font-semibold w-full text-center">Vision</h5>
                     <h5 class="px-2 text-[1.2rem] font-semibold">Transformer la présentation immobilière en une expérience immersive, accessible et sans contraintes.</h5>
                 </div>
-                <div class="w-[40%] p-3 m-3 bg-gradient-to-tl from-orange-500 to-orange-600 shadow-md shadow-gray-900 rounded-lg">
+                <div class="w-[40%] p-6 hover:scale-105 m-3 bg-gradient-to-tl from-orange-500 to-orange-600 shadow-md shadow-gray-900 rounded-lg">
                     <h5 class="text-[2rem] font-semibold text-center">Mission</h5>
                     <h5 class="px-2 text-[1.2rem] pb-2 font-semibold">Offrir une solution clé en main de visites virtuelles 360°, permettant aux agences immobilières et autres secteurs de valoriser leurs espaces et de gagner en efficacité.</h5>
                 </div>
-                <div class="w-[20%] p-3 m-3 bg-gradient-to-r from-orange-500 to-orange-600 shadow-md shadow-gray-900 rounded-lg">
+                <div class="w-[20%] p-3 hover:scale-105 m-3 bg-gradient-to-r from-orange-500 to-orange-600 shadow-md shadow-gray-900 rounded-lg">
                     <h5 class="text-[2rem] font-semibold text-center">Valeurs</h5>
                     <ul class="text-gray-50 text-[1.2rem] list-disc px-5">
                         <li><h5 class="font-semibold">Innovation</h5></li>
@@ -35,7 +52,7 @@
         
         <h1 class="px-3 text-[3rem] font-semibold mt-7">Services et offres</h1>
         <div class="w-full px-3 flex justify-between items-center">
-            <div class="w-[40%] p-5 mr-2 bg-gradient-to-r from-orange-500 to-orange-600 shadow-md shadow-gray-900 rounded-lg">
+            <div class="w-[40%] p-5 mr-2 hover:scale-[1.01] bg-gradient-to-r from-orange-500 to-orange-600 shadow-md shadow-gray-900 rounded-lg">
                 <h5 class="text-[2rem] font-semibold text-center">Visite</h5>
                 <ul class="text-gray-50 text-[1rem] list-disc px-5">
                     <li><h5 class="font-semibold mb-2">Capture des photos 360° haute définition.</h5></li>
@@ -43,7 +60,7 @@
                     <li><h5 class="font-semibold">Hébergement en ligne sur notre plateforme.</h5></li>
                 </ul>
             </div>
-            <div class="w-[60%] p-5 ml-1 bg-gradient-to-r from-orange-500 to-orange-600 shadow-md shadow-gray-900 rounded-lg">
+            <div class="w-[60%] p-8 ml-1 hover:scale-[1.01] bg-gradient-to-r from-orange-500 to-orange-600 shadow-md shadow-gray-900 rounded-lg">
                 <h5 class="text-[2rem] font-semibold text-center">Valeur ajoutée</h5>
                 <ul class="text-gray-50 text-[1rem] list-disc px-5">
                     <li><h5 class="font-semibold mb-2">Simplifie les visites pour les acheteurs potentiels.</h5></li>
@@ -66,7 +83,8 @@
                             <li><h5 class="text-[1rem]">Hébergement (inclue des frais supplémentaire)</h5></li>
                         </ul>
                     </div>
-                    <button class="mt-5 self-end w-1/3 rounded-lg bg-orange-600 px-4 py-2 text-white font-bold mb-2">Consulter l'offre</button>
+                    <button class="mt-5 self-end w-1/3 rounded-lg hover:scale-105
+                    bg-orange-600 px-4 py-2 text-white font-bold mb-2">Consulter l'offre</button>
                 </div>
             </div>
             <div class="w-1/2 p-[2px] m-2 bg-gradient-to-r from-orange-400 to-orange-600 shadow-md shadow-gray-900 rounded-lg">
@@ -81,7 +99,8 @@
                             <li><h5 class="text-[1rem]">Hébergement offert</h5></li>
                         </ul>
                     </div>
-                    <button class="mt-5 self-end w-1/3 rounded-lg bg-orange-600 px-4 py-2 text-white font-bold mb-2 hover:ring-1">Consulter l'offre</button>
+                    <button class="mt-5 self-end w-1/3 rounded-lg hover:scale-105
+                    bg-orange-600 px-4 py-2 text-white font-bold mb-2">Consulter l'offre</button>
                 </div>
             </div>
         </div>
diff --git a/resources/views/layout.blade.php b/resources/views/layout.blade.php
index 85db89c..e7e0c1d 100644
--- a/resources/views/layout.blade.php
+++ b/resources/views/layout.blade.php
@@ -9,48 +9,93 @@
         <link rel="preconnect" href="https://fonts.googleapis.com">
         <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
         <link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet">
-        <title>Viewer 360 - {{ $title }}</title>
+        <title>Ma Visite 360 - {{ $title }}</title>
 
         @vite("resources/js/app.js")
         @vite("resources/css/app.css")
     </head>
-    <body class="relative w-screen h-screen antialiased font-robo bg-gray-850 -z-10">
+    <body class="w-screen h-screen antialiased font-robo bg-gray-850 -z-10">
         <!--<img src="/img/lightsource.png" class="w-full absolute top-0 right-0 left-0 -z-10">-->
-        <nav class="fixed right-0 left-0 top-0 h-14 z-50">
-            <div class="w-full h-full flex items-center justify-center bg-gradient-to-r from-gray-850 via-gray-750 to-gray-850 pb-[2px]">
+        <nav class="sticky right-0 left-0 top-0 h-16 z-50">
+            <div class="w-full h-full flex items-center justify-center bg-gradient-to-r from-gray-850 via-gray-600 to-gray-850 pb-[2px]">
                 <div class="w-full h-full px-[12.5%] flex justify-between bg-gray-800">
                     <div class="flex items-center h-full">
-                        <a href="/" class="h-full"><img src="/img/logo-mavisite360.png" class="h-full mr-2 p-2"></a>
-                        <p class="text-lg text-white bg-orange-500/90 rounded-lg px-3 font-semibold">{{ $title }}</p>
+                        <a href="/" class="h-full"><img src="/img/logo-mavisite360.png" class="h-full hover:scale-105 mr-2 p-3"></a>
+                        <p class="text-lg text-white bg-gradient-to-tr from-orange-400 to-orange-600 rounded-lg px-4 font-semibold">{{ $title }}</p>
                     </div>
                     <div class="flex items-center h-full">
-                        <a href="/"><h1 class="font-semibold mr-4 text-lg">home</h1></a>
-                        <a href="/demo"><h1 class="font-semibold mr-4 text-lg">demo</h1></a>
-                        <h1 class="font-semibold mr-9 text-lg">contact</h1>
-                        <div class="flex items-center h-fit py-1 px-2 border-l border-gray-600">
-                            <button class="relative group flex items-center justify-center mr-6">
-                                <img src="/img/dark.svg" class="w-[1.2rem] dark:invert">
-                                <div class="absolute group-focus:block hidden bg-gray-800 -bottom-[100px] left-0 w-[160px] rounded-xl overflow-hidden">
+                        <a href="/"><h1 class="mr-4 text-xl font-bold hover:scale-105">home</h1></a>
+                        <a href="/demo"><h1 class="font-bold mr-4 text-xl hover:scale-105">demo</h1></a>
+                        <a href="#contact"><h1 class="font-bold mr-9 text-xl hover:scale-105">contact</h1></a>
+                        <div class="flex items-center h-fit py-[8px] pl-5 border-l border-gray-700">
+                            <button class="relative group flex items-center justify-center mr-6" 
+                            onclick="document.querySelector('#theme-panel').classList.toggle('hidden')">
+                                <img src="/img/dark.svg" class="w-[1.4rem] hover:scale-105 invert">
+                                <div id="theme-panel" class="absolute hidden bg-gray-800 -bottom-[110px] right-4/5 
+                                w-[160px] rounded-xl overflow-hidden">
                                     <div class="px-4 pt-2 grid grid-cols-4 hover:bg-gray-600 items-center">
-                                        <img src="/img/dark.svg" class="w-[1.4rem] dark:invert pl-1">
+                                        <img src="/img/dark.svg" class="w-[1.4rem] invert pl-1">
                                         <h1 class="font-semibold text-[1.1rem] col-span-3 mb-1 text-left">Dark</h1>
                                     </div>
                                     <div class="px-4 pb-2 grid grid-cols-4 hover:bg-gray-600 items-center">
-                                        <img src="/img/light.svg" class="w-[1.4rem] dark:invert">
+                                        <img src="/img/light.svg" class="w-[1.4rem] invert">
                                         <h1 class="font-semibold text-[1.1rem] mt-1 col-span-3 text-left">Light</h1>
                                     </div>
                                 </div>
                             </button>
-                            <img src="/img/instagram.svg" class="w-[1.4rem] dark:invert mr-3">
-                            <img src="/img/twitter.svg" class="w-[1.4rem] dark:invert">
+                            <img src="/img/instagram.svg" class="w-[1.6rem] hover:scale-105 invert mr-3">
+                            <img src="/img/twitter.svg" class="w-[1.6rem] hover:scale-105 invert">
                         </div>
                     </div>
                 </div>
             </div>
         </nav>
         @yield("content")
-        <footer class="w-full h-14 px-[13%] bg-gray-800 flex items-center justify-between">
-            <p class="italic">&copy; 2024 Créer par l'équipe MaVisite360</p>
+        <footer class="w-full bg-gray-800">
+            <div class="w-3/4 px-3 mx-auto flex flex-col items-center justify-between">
+                <div class="w-full mt-10 flex flex-col items-center">
+                    <h2 class="font-semibold text-[1.4rem] mb-1">Nos partenaires</h2>
+                    <div class="relative w-full flex items-center h-20 mb-5 overflow-hidden">
+                        <img src="/img/panoee.png" class="w-32 slider" style="--delay: 0s;">
+                        <img src="/img/infomaniak.png" class="w-32 slider" style="--delay: 2s;">
+                        <img src="/img/cpne.jpg" class="w-32 slider" style="--delay: 4s;">
+                        <img src="/img/entreprise_immo_1.png" class="w-32 slider" style="--delay: 6s;">
+                        <img src="/img/entreprise_immo_2.jpeg" class="w-32 slider" style="--delay: 8s;">
+                        <img src="/img/entreprise_immo_3.png" class="w-32 slider" style="--delay: 10s;">
+                        <img src="/img/entreprise_immo_4.png" class="w-32 slider" style="--delay: 12s;">
+                        <img src="/img/entreprise_immo_5.webp" class="w-32 slider" style="--delay: 14s;">
+                        <img src="/img/entreprise_immo_6.png" class="w-32 slider" style="--delay: 16s;">
+                    </div>
+                </div>
+                <div class="w-full mt-5 flex items-center">
+                    <div id="contact" class="w-1/3 mb-10">
+                        <h2 class="font-semibold text-[1.7rem] border-b-2 border-gray-750 w-3/4 pr-20 mb-2">Nous contacter</h2>
+                        <div class="px-3">
+                            <h4 class="font-semibold mb-1">+41 78 694 09 79</h4>
+                            <h4 class="font-semibold mb-1">contact@mv360.ch</h4>
+                            <h4 class="font-semibold">Rue de la Maladière 80</h4>
+                        </div>
+                    </div>
+                    <div class="flex items-start justify-evenly w-1/3 mb-10">
+                        <div class="hover:social-icon-in social-icon-out p-2 border border-gray-750 rounded-lg">
+                            <img src="/img/linkedin.svg" class="w-[2rem] brightness-0 invert">
+                        </div>
+                        <div class="hover:social-icon-in social-icon-out p-2 border border-gray-750 rounded-lg">
+                            <img src="/img/discord.svg" class="w-[2rem] invert">
+                        </div>
+                        <div class="hover:social-icon-in social-icon-out p-2 border border-gray-750 rounded-lg">
+                            <img src="/img/facebook.svg" class="w-[2rem] invert">
+                        </div>
+                        <div class="hover:social-icon-in social-icon-out p-2 border border-gray-750 rounded-lg">
+                            <img src="/img/instagram.svg" class="w-[2rem] invert">
+                        </div>
+                        <div class="hover:social-icon-in social-icon-out p-2 border border-gray-750 rounded-lg">
+                            <img src="/img/twitter.svg" class="w-[2rem] invert">
+                        </div>
+                    </div>
+                    <p class="italic w-1/3 text-right self-end">&copy; 2024 Créer par l'équipe Ma Visite 360</p>
+                </div>
+            </div>
         </footer>
     </body>
 </html>
\ No newline at end of file