diff --git a/contracts.html b/contracts.html
index e4bfe4d..a753e09 100644
--- a/contracts.html
+++ b/contracts.html
@@ -94,8 +94,35 @@
       border-color: rgb(40, 40, 117);
       border-radius: 5px;
     }
-  </style>
 
+    /* Add your CSS styles here */
+  .slideshow-container {
+      position: relative;
+  }
+
+  .mySlides {
+      display: none;
+  }
+
+  /* Style for previous and next buttons */
+  .prev, .next {
+      position: absolute;
+      top: 50%;
+      transform: translateY(-50%);
+      padding: 16px;
+      cursor: pointer;
+      background-color: rgba(0, 0, 0, 0.5);
+      color: white;
+  }
+
+  .prev {
+      left: 0;
+  }
+
+  .next {
+      right: 0;
+  }
+  </style>
 </head>
 
 
@@ -126,7 +153,123 @@ <h1 class="myfont font-bold text-xl lg:text-3xl uppercase">
     </div>
   </header>
 
-  <div class="row bg-black">
+<div class="bg-black padd">
+  <div class="slideshow-container">
+
+    <div class="mySlides fade mx-auto" style="display: block; width: 50%;">
+        <div class="">
+          <div class="card text-white">
+            <img src="./resources/image118.png" class="mx-auto" alt="" />
+            <div style="padding-top:20px">
+              <p class="font-bold">Digital Art Collectibles</p>
+              <p>Unique NFTs for exclusive digital art
+                collectibles, ensuring scarcity and value.
+                Trade and own one-of-a-kind digital art
+                pieces with SignatureSeries.</p>
+            </div>
+    
+          </div>
+        </div>
+    </div>
+  
+    <div class="mySlides fade mx-auto" style="width: 50%;">
+      <div class="card text-white">
+        <img src="./resources/image118.png" class="w-4 mx-auto" alt="" />
+        <div style="padding-top:20px">
+        <p class="font-bold">VIP Access Passes</p>
+        <p>Exclusive NFT VIP passes for special 
+          event privileges. stand out as a 
+          privileged attendee with 
+          SignatureSeries VIP passes.</p>
+        </div>
+      </div>
+    </div>
+  
+    <div class="mySlides fade mx-auto" style="width: 50%;">
+      <div class="card text-white">
+        <img src="./resources/image118.png" class="mx-auto" alt="" />
+        <div style="padding-top:20px">
+          <p class="font-bold">In-Game Items</p>
+          <p>Unique NFT in-game items for enhanced 
+            gameplay and a thriving virtual economy. 
+            Trade and acquire valuable in-game 
+            assets with FusionSeries.</p>
+        </div>
+
+      </div>
+    </div>
+    </div>
+  </div>
+</div>
+
+<div class="bg-black">
+  <img src="./resources/Vector33.png" class="w-full mx-auto" alt="" />
+</div>
+
+<footer>
+  <section id="connect"
+  class="py-10 px-2 bg-black text-white text-center m48:flex flex-col justify-center items-center">
+  <div class="mb-8 text-5xl flex flex-col m48:flex-row m48:justify-center gap-6 sm:gap-12 items-center">
+    <div class="py-4 px-[14px] text-[36px] rounded-full bg-gradient-to-b from-[#5865f2] to-[#3a0ca3]">
+      <a href="https://discord.gg/38jktRtuY7" target="_blank"><i class="fa-brands fa-discord"></i></a>
+    </div>
+    <div class="py-5 px-[22px] text-[32px] rounded-full bg-gradient-to-b from-[#64b5f6] to-[#1565c0]">
+      <a href="https://t.me/MyriadFlow" target="_blank"><i class="fa-solid fa-paper-plane"></i></a>
+    </div>
+    <div class="py-3 px-[13px] rounded-full bg-gradient-to-b from-[#4dfaf0] to-[#3856f2]">
+      <a href="https://twitter.com/0xMyriadFlow" target="_blank"><i class="fa-brands fa-twitter"></i></a>
+    </div>
+    <div class="py-3 px-4 rounded-full bg-gradient-to-tr from-[#F58529] via-[#FEDA77] via-[#DD2A7B] to-blue-500">
+      <a href="https://www.instagram.com/lazarusnetwork/" target="_blank"><i class="fa-brands fa-instagram"></i></a>
+    </div>
+  </div>
+
+</section>
+  <section class="footer">
+    <div class="brand">
+      <!-- <div class="h5"> -->
+        <a href="#" style="margin-left: -20px;"><Image
+          src="./resources/Rectangle.png"
+          width="80"
+          height="80"
+          alt="logo"
+        /></a>
+      <!-- </div> -->
+      <!-- <h1 class="myfont font-bold text-xl lg:text-3xl uppercase"> -->
+        <a href="#"><Image
+          src="./resources/myriadflow.png"
+          width="250"
+          height="250"
+          alt="logo"
+        /></a>
+      <!-- </div> -->
+      <p>MyriadFlow is an innovative platform to explore & 
+launch NFT Experiences. Dive into the next generation 
+of Utility NFTs through our Revolutionary 
+App Store </p>
+      
+    </div>
+    
+    <div class="subjects">
+      <div class="h5">Sitemap</div>
+      <a href="#">Home</a>
+      <a href="#">Possibilities</a>
+      <a href="#">Steps</a>
+      <a href="#">Values</a>
+      <a href="#">Pricing</a>
+      <a href="#">Testimonials</a>
+    </div>
+    <div class="product">
+      <div class="h5">Company</div>
+      <a href="#">About</a>
+    </div>
+    
+  </section>
+  <p style="margin-top:10px; margin-bottom:20px;" class="text-center text-white">MyriadFlow | Copyright © 2023 Lazarus Network Inc. All Rights Reserved.</p>
+
+</footer>
+
+ <!-- <div class="row bg-black">
     <h2 class="text-2xl font-bold tracking-tight text-white padd" style="margin-left: 30px;">Signature Series</h2>
     <div class="column">
       <div class="card text-white">
@@ -155,9 +298,9 @@ <h2 class="text-2xl font-bold tracking-tight text-white padd" style="margin-left
       </div>
     </div>
 
-  </div>
+  </div> -->
 
-  <div class="row bg-black">
+  <!-- <div class="row bg-black">
     <h2 class="text-2xl font-bold tracking-tight text-white padd" style="margin-left: 30px;">Fusion Series</h2>
     <div class="column">
       <div class="card text-white">
@@ -247,8 +390,32 @@ <h2 class="text-2xl font-bold tracking-tight text-white padd" style="margin-left
       </div>
     </div>
 
-  </div>
+  </div> -->
 
   <script type="module" src="/app.js"></script>
 
+
+  <script>
+    let slideIndex = 0;
+    showSlides();
+    
+    function showSlides() {
+      let i;
+      let slides = document.getElementsByClassName("mySlides");
+      for (i = 0; i < slides.length; i++) {
+        slides[i].style.display = "none";  
+      }
+      slideIndex++;
+      if (slideIndex > slides.length) {
+        slideIndex = 1;  // Reset slideIndex to 1 when it exceeds the number of slides
+      }
+      slides[slideIndex - 1].style.display = "block";  
+      setTimeout(showSlides, 3000); // Change slide every 3 seconds (adjust the timing as needed)
+    }
+    
+    // Start the automatic slideshow immediately
+    showSlides();
+    </script>
+    
+
 </body>
\ No newline at end of file