assets/image

index.html

@@ -5,9 +5,10 @@
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <meta name="description" content="Voyagez au cœur de l'histoire et de la nature béninoises.">
-  <link rel="shortcut icon" href="/assets//icon.png" type="image/x-icon">
+  <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon">
   <link href="https://cdn.jsdelivr.net/npm/[email protected]/fonts/remixicon.css" rel="stylesheet" />
   <link rel="stylesheet" href="styles.css" />
+  <link rel="preload" as="image" href="./assets/header.webp">
   <script src="https://unpkg.com/scrollreveal"></script>
   <title>Découvrir le Bénin</title>
 </head>
@@ -268,7 +269,7 @@ <h1>Parc de Pendjari</h1>
       </div>
       <div class="seller__card">
         <div class="seller__image">
-          <img width="auto" height="auto" src="assets/destinations/tanongou.webp" alt="tanongou" />
+          <img width="auto" height="auto" src="assets/destinations/benin-abomey-2.webp" alt="Abomey" />
           <div class="seller__image__content">
             <div class="badge">Nature</div>
             <div class="seller__image__footer">
@@ -281,10 +282,11 @@ <h1>Gratuit</h1>
           </div>
         </div>
         <div class="seller__details">
-          <h1>Cascade de Tanougou</h1>
-          <p>La Cascade de Tanougou offre une escapade rafraîchissante au cœur de la nature. Plongez dans les eaux
-            cristallines de la
-            cascade et détendez-vous dans ce cadre naturel paisible.</p>
+          <h1>Musée Historique d’Abomey</h1>
+          <p>Le Musée d’Abomey, situé dans les anciens palais royaux, raconte l’histoire du puissant royaume du Dahomey.
+            Ce site
+            classé à l’UNESCO abrite des trésors royaux, des objets sacrés et des témoignages de la grandeur de cette
+            civilisation.</p>
         </div>
       </div>
     </div>
@@ -294,7 +296,7 @@ <h1>Cascade de Tanougou</h1>
     <div class="section__container tour__container">
       <h1 class="font-1">Visionnez les beaux paysages du Bénin</h1>
       <div class="video__container">
-        <video src="assets/video.mp4" autoplay loop muted></video>
+        <video src="assets/video.webm" autoplay loop muted></video>
       </div>
     </div>
   </section>

styles.css

@@ -1,5 +1,4 @@
-@import url('https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&family=Sacramento&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap');
-@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,[email protected],200..800&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,[email protected],200..800&family=Sacramento&display=swap');
 
 :root {
   --primary-color: #f13033;
@@ -144,7 +143,7 @@ body {
   left: 0;
   width: 100%;
   height: 100%;
-  background-image: url("assets/header.jpg");
+  background-image: url("assets/header.webp");
   background-position: center center;
   background-size: cover;
   background-repeat: no-repeat;
@@ -207,6 +206,11 @@ nav {
 
 .header__container {
   padding: 5rem 1rem 10rem;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+  min-height: 80vh;
 }
 
 .header__container p {
@@ -867,25 +871,4 @@ nav {
     padding: 0 1rem;
   }
 
-}
-
-html.lenis,
-html.lenis body {
-  height: auto;
-}
-
-.lenis.lenis-smooth {
-  scroll-behavior: auto !important;
-}
-
-.lenis.lenis-smooth [data-lenis-prevent] {
-  overscroll-behavior: contain;
-}
-
-.lenis.lenis-stopped {
-  overflow: hidden;
-}
-
-.lenis.lenis-smooth iframe {
-  pointer-events: none;
 }