diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 00000000..6f3a2913
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}
\ No newline at end of file
diff --git a/Adventure.html b/Adventure.html
index ec4de8e3..624825dc 100644
--- a/Adventure.html
+++ b/Adventure.html
@@ -88,6 +88,67 @@
       }
     }
   </style>
+  <style>
+    /* Toggle button styles */
+.toggle-container {
+  position: fixed; /* Change this as needed for positioning */
+  top: 10px;
+  right: 10px;
+}
+
+.toggle {
+    appearance: none;
+    outline: none;
+    cursor: pointer;
+    width: 100%;
+    height: 100%;
+    box-shadow: inset calc(var(--size)* 0.33) calc(var(--size)* -0.25) 0;
+    border-radius: 999px;
+    color: hsl(240, 100%, 95%);
+    transition: all 500ms;
+    position: absolute;
+    top: 0;
+    left: 0;
+}
+
+.toggle:checked {
+  background-color: #333;
+}
+.toggle:checked:before {
+  transform: translateX(25px);
+}
+.sticky {
+    margin: 10px 5px;
+    border-radius: 10px;
+    margin-top: 0.5rem;
+    background: linear-gradient(#002152, #271050);
+    scale: 0.99;
+}
+nav {
+    background-color: #123456;
+    position: fixed;
+    top: 0;
+    width: 100%;
+    z-index: 1001;
+}
+/* Dark mode feature */
+body.dark-mode{
+  --secondary-color:#0e1525;
+  --btn-border: red;
+}
+body.dark-mode {
+  background-color: var(--secondary-color);
+}
+
+body.dark-mode .nav-container {
+  background-color: #343a40;
+}
+
+body.dark-mode .section__container {
+  background-color: #002152;
+  color: #ffffff;
+}
+  </style>
 
   <link href="https://cdn.jsdelivr.net/npm/remixicon@3.2.0/fonts/remixicon.css" rel="stylesheet" />
   <link rel="stylesheet" href="styles.css" />
@@ -132,29 +193,50 @@
       </ul>
       <a href="/index.html"><button class="btn">Contact Us</button></a>
     </nav> -->
-  <div class="nav-container">
     <nav class="newNav">
-      <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
+      <div style="display: flex; flex-direction: row; align-items: center;">
+      <img src="./img/tour1.png" class="sitelogo">
+      
+      <a href="#" class="nav__logo aos-init aos-animate" data-aos="fade-right">Tourguide<span>.</span></a>
+    </div>
 
       <ul class="navLinks">
-        <li class="link" data-aos="fade-down"><a href="./index.html#Home">Home</a></li>
-        <li class="link" data-aos="fade-down"><a href="./index.html#AboutUs">AboutUs</a></li>
-        <li class="link" data-aos="fade-down"><a href="./index.html#Destinations">Destinations</a></li>
-        <li class="link" data-aos="fade-down"><a href="./index.html#trip">Pricing</a></li>
-        <li class="link" data-aos="fade-down"><a href="./index.html#testimonials">Testimonials</a></li>
-        <li class="link" data-aos="fade-down"><a href="./index.html#ReviewGallery">Reviews</a></li>
-        <li class="link" data-aos="fade-down"><a href="./feedback.html">Rate Us?</a></li>
-        <li class="link" data-aos="fade-down"><a href="./login.html">Login</a></li>
-      </ul>
-      <a href="./index.html#contact" class="contact-btn"><button class="btn" id="btn-style" style="margin: 0;"
-          data-aos="fade-down">Contact Us</button></a>
-      <div class="hamburger" data-aos="fade-down">
+        <li class="link aos-init aos-animate" id="View-link" data-aos=""><a href="mapa.html">View</a></li>
+        <li class="link aos-init aos-animate" id="LogIn-link" data-aos=""><a href="newLogin.html">Log In</a></li>
+        <li class="link aos-init aos-animate" data-aos=""><a href="#Home">Home</a></li>
+        <li class="link aos-init aos-animate" data-aos=""><a href="#AboutUs">About</a></li>
+        <li class="link dropdown aos-init aos-animate" data-aos="">
+            <a href="#Services" class="dropdown">Services</a>
+            <ul class="dropdown-menu">
+                <li><a href="#Destinations">Destination</a></li>
+                <li><a href="#trip">Prices</a></li>
+                <li><a href="#ReviewGallery">Trip Gallery</a></li>
+                <li><a href="#tourist">Tourist Guide</a></li>
+                <li><a href="#hotel">Hotel &amp; Resort</a></li>
+            </ul>
+        </li>
+        <li class="link aos-init aos-animate" data-aos=""><a href="#testimonials">Testimonial</a></li>
+        <li class="link aos-init aos-animate" data-aos=""><a href="feedback.html">Rate Us?</a></li>
+        <li class="link aos-init aos-animate" data-aos=""><a href="#cnt-form">Contact Us</a></li>
+    </ul>
+
+      <a href="newLogin.html" class="contact-btn" id="nav-login-btn"><button class="btn login aos-init aos-animate" id="btn-style" data-aos="fade-down" style="display: block;">Login/SignUp</button></a>
+      <a href="mapa.html" class="contact-btn" id="nav-view-btn"><button class="btn aos-init aos-animate" id="btn-style" style="margin: 0;" data-aos="fade-down">view <map name=""></map></button></a>
+
+      <a href="loginPage.html" class="contact-btn"><button class="btn aos-init aos-animate" id="logout-btn" style="margin: 0; display: none;" data-aos="fade-down" disabled="">Log Out</button></a>
+
+      <!-- <a href="login-modified.html" class="contact-btn"><button class="btn" id="btn-style"
+          style="margin: 0; box-shadow:1.5px 1.5px 6px red;" data-aos="fade-down">Login</button></a> -->
+
+      <div class="toggle-container aos-init aos-animate" data-aos="fade-down">
+        <input id="themeToggle" class="toggle" type="checkbox">
+      </div>
+      <div class="hamburger aos-init aos-animate" data-aos="fade-down">
         <div class="line"></div>
         <div class="line"></div>
         <div class="line"></div>
       </div>
     </nav>
-  </div>
   <section class="trip" id="trip">
 
     <div class="section__container trip__container">
@@ -666,15 +748,15 @@ <h4>Contact Us</h4>
   <button class="top-btn" id="goToTopBtn" onclick="goToTop()"><i class="fa-solid fa-chevron-up"
       style="color: #ffffff;"></i></button>
 
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js"
+  <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js"
     integrity="sha512-7eHRwcbYkK4d9g/6tD/mhkf++eoTHwpNM9woBxtPUBWm67zeAfFC+HrdoE2GanKeocly/VxeLvIqwvCdk7qScg=="
     crossorigin="anonymous" referrerpolicy="no-referrer"></script>
 
-  <script>
+  <script> -->
 
 
 
-    var tl = gsap.timeline();
+    <!-- var tl = gsap.timeline();
 
     tl.from("nav", {
       opacity: 0,
@@ -710,7 +792,7 @@ <h4>Contact Us</h4>
       opacity: 0,
       x:-50,
       duration: 0.7,
-    })
+    }) -->
 
   </script>
 
@@ -788,6 +870,30 @@ <h4>Contact Us</h4>
     }
   }
 </script>
+<script>
+  document.addEventListener('DOMContentLoaded', () => {
+    const toggleCheckbox = document.getElementById('themeToggle');
+    const body = document.body;
+
+    // Load saved dark mode preference from localStorage
+    if (localStorage.getItem('dark-mode') === 'enabled') {
+      body.classList.add('dark-mode');
+      toggleCheckbox.checked = true;
+    } else {
+      toggleCheckbox.checked = false;
+    }
+
+    toggleCheckbox.addEventListener('change', () => {
+      if (toggleCheckbox.checked) {
+        body.classList.add('dark-mode');
+        localStorage.setItem('dark-mode', 'enabled');
+      } else {
+        body.classList.remove('dark-mode');
+        localStorage.setItem('dark-mode', 'disabled');
+      }
+    });
+  });
+</script>
 <script src="./Image-Gallery/script.js"></script>
 
 </html>
\ No newline at end of file
diff --git a/Image-Gallery/style.css b/Image-Gallery/style.css
index ab61f2d9..4888e898 100644
--- a/Image-Gallery/style.css
+++ b/Image-Gallery/style.css
@@ -102,7 +102,7 @@ body {
 }
 
 .btn {
-  bottom: -80px;
+  top : -40px;
   background-color: slateblue;
   color: white;
   border: none;
diff --git a/Licensing.html b/Licensing.html
index 81800170..e7e8a360 100644
--- a/Licensing.html
+++ b/Licensing.html
@@ -74,14 +74,53 @@
     color: rgb(185, 185, 185);
 }
 
+    </style>
+    <style>
+        #progress-container {
+    position: fixed ;
+    top: 0px;
+    left: 0;
+    width: 100%;
+    height: 15px;
+    z-index: 99990;
+    /* background: #f3f3f3; */
+}
+
+#progress-bar {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 0%;
+    height: 7px;
+    width: 0;
+    background: linear-gradient(90deg, rgb(0, 72, 255) 0%, rgb(153, 187, 255) 50%, rgb(0, 184, 250) 100%);
+    box-shadow: 0 0 4px rgba(0, 166, 255, 0.7), 0 0 10px rgba(255, 255, 255, 0.7);
+    transition: width 0.09s ease-in-out;
+    border-radius: 10px;
+}
+
+
     </style>
 </head>
 <body>
+    <div id="progress-container">
+        <div id="progress-bar"></div>
+      </div>
+      <script>
+            
+        window.addEventListener('scroll', function() {
+            const winScroll = document.body.scrollTop || document.documentElement.scrollTop;
+            const height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
+            const scrolled = (winScroll / height) * 100;
+            document.getElementById('progress-bar').style.width = scrolled + '%';
+        });
+        </script>
     <a href="index.html">
         <img src="./img/Screenshot 2024-01-23 003448.png" style="width: 130px; border-radius: 6px; margin-top: 20px; margin-left: 20px;">
     </a>
     <div class="container">
         <h1 class="title">Licensing Page</h1>
+
         <div class="license-text">
             <h2 class="section-title">MIT License</h2>
             <p>Copyright (c) 2023 Arpan Chowdhury</p>
diff --git a/README.md b/README.md
index c4d515c4..7194362a 100644
--- a/README.md
+++ b/README.md
@@ -202,30 +202,18 @@ Show some ❤️&nbsp; by giving <img src="https://imgur.com/o7ncZFp.jpg" height
 <tr>
 <td align="center"><a href="https://github.com/KrishnenduDG"><img src="img/krishnendu DG.png" width=130px height=130px /></a></br> <h4 style="color:red;">Krishnendu Dasgupta</h4>
  <a href="https://www.linkedin.com/in/krishnendu-dasgupta-450391186/"><img src="https://img.icons8.com/fluency/2x/linkedin.png" width="32px" height="32px"></img></a>
-   </td>
-
-</tr>
-</table>
+</td>
 
-<table>
-<tr>
 <td align="center"><a href="https://github.com/itsekta"><img src="img/Ekta.jfif" width=130px height=130px /></a></br> <h4 style="color:red;">Ekta Chaudhary</h4>
  <a href="https://www.linkedin.com/in/ekta-software-engineer/"><img src="https://img.icons8.com/fluency/2x/linkedin.png" width="32px" height="32px"></img></a>
-   </td>
-
-</tr>
-</table>
+</td>
 
-<table>
-<tr>
 <td align="center"><a href="https://github.com/Ghanshyam89"><img src="img/GhanshyamNewPic.jpg" width=130px height=130px /></a></br> <h4 style="color:red;">Ghanshyam Prajapati</h4>
  <a href="https://www.linkedin.com/in/ghanshyam-prajapati/"><img src="https://img.icons8.com/fluency/2x/linkedin.png" width="32px" height="32px"></img></a>
-   </td>
-
+</td>
 </tr>
 </table>
 
-</div>
   
  # Project Admin⚡
  
@@ -247,6 +235,11 @@ Show some ❤️&nbsp; by giving <img src="https://imgur.com/o7ncZFp.jpg" height
   <img src="https://github.com/shruti-sen2004/Travel_Website/assets/115914670/d544fd3b-aed2-4a05-a2f8-0b7a2ff9014f" width="700" height= "250" />
 </p>
 
+
+## Acknowledgements
+
+Thank you to all the amazing contributors who have made this project possible! 💝
+
 <p align ="center">
   <img src="https://api.vaunt.dev/v1/github/entities/apu52/repositories/Travel_Website/contributors?format=svg&limit=54" width="700" height= "250" />
 </p>
@@ -255,10 +248,15 @@ Show some ❤️&nbsp; by giving <img src="https://imgur.com/o7ncZFp.jpg" height
   <img align="center" src="https://contrib.rocks/image?max=100&repo=apu52/Travel_Website" />
 </a> 
 <br><br>
-Thank you to all the amazing contributors who have made this project possible!!💝
 
-## License 
-<img src = "https://img.shields.io/badge/License-MIT-blue.svg?style=for-the-badge">
+## License
+
+This project is licensed under the MIT License. See the [LICENSE](LICENSE) file for more details.
+
+<p align="center">
+  <img src="https://img.shields.io/badge/License-MIT-blue.svg?style=for-the-badge" alt="License: MIT">
+</p>
+
 
 <p align="right"><a href="#top"><img src="https://img.shields.io/badge/Move%20to%20top-Blue?style=plastic" alt="Back To Top"></a></p>
 
diff --git a/back5.mp4 b/back5.mp4
new file mode 100644
index 00000000..ec64a0e2
Binary files /dev/null and b/back5.mp4 differ
diff --git a/blog.css b/blog.css
index 9bdba1a7..45321d77 100644
--- a/blog.css
+++ b/blog.css
@@ -11,7 +11,7 @@
 body, html {
     margin: 0;
     padding: 0;
-    font-family: 'Outfit', sans-serif;
+    font-family: 'Outfit', sans-serif !important;
     line-height: 1.6;
     color: var(--text-color);
     height: 100%;
@@ -101,6 +101,37 @@ body, html {
     padding: 2rem;
     margin-top: 10vh;
 }
+.tag {
+    cursor: pointer;
+    transition: background-color 0.3s ease;
+}
+
+.tag:hover {
+    background-color: #007bff;
+    color: white;
+}
+
+.filter-controls {
+    margin-bottom: 20px;
+    text-align: left;
+}
+
+.reset-filters-btn {
+    font-family: "Outfit";
+    padding: 5px 10px;
+    font-size: 1.0rem;
+    font-weight: 500;
+    background-color: #f39c12;
+    border: 3px solid #011c34;
+    color: #ffffff;
+    border-radius: 4px;
+    cursor: pointer;
+    transition: background-color 0.3s ease;
+}
+
+.reset-filters-btn:hover {
+    background-color: #e2e6ea;
+}
 
 main {
     display: flex;
@@ -111,6 +142,7 @@ main {
 
 #blog-posts {
     flex: 2;
+    margin-top: 20px;
     display: flex;
     flex-direction: column;
     gap: 2rem;
@@ -179,6 +211,8 @@ main {
 
 .tag:hover {
     background-color: var(--primary-color);
+    color: #f39c12;
+    transition: background-color 0.3s ease;
 }
 
 .read-more {
@@ -294,6 +328,8 @@ aside {
 
 .newsletter-form button:hover {
     background-color: var(--primary-color);
+    color: #f39c12;
+    transition: background-color 0.3s ease;
 }
 
 @media (max-width: 768px) {
diff --git a/blog.html b/blog.html
index 4934b2c8..d7f6fee3 100644
--- a/blog.html
+++ b/blog.html
@@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
@@ -7,7 +8,9 @@
     <link href="https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;700&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
     <link rel="stylesheet" href="blog.css">
+    <link rel="icon" type="image/x-icon" href="favicon.ico"/>
 </head>
+
 <body>
     <a href="./index.html" class="home-button">
         <i class="fas fa-home"></i> TourGuide
@@ -32,31 +35,27 @@ <h1>↓</h1>
 
     <div class="content-wrapper">
         <main>
+            <div class="filter-controls">
+                <button id="reset-filters" class="reset-filters-btn">Reset Filters</button>
+            </div>
             <section id="blog-posts">
                 <!-- Blog posts will be dynamically inserted here -->
             </section>
             <aside>
-                <div class="widget semi-transparent-box">
-                    <h3>Categories</h3>
-                    <ul>
-                        <li><a href="#">Backpacker <span>(6)</span></a></li>
-                        <li><a href="#">Hiking <span>(1)</span></a></li>
-                        <li><a href="#">Tips <span>(2)</span></a></li>
-                        <li><a href="#">Tourism <span>(4)</span></a></li>
-                        <li><a href="#">Travel <span>(6)</span></a></li>
-                        <li><a href="#">Travel Tips <span>(7)</span></a></li>
-                        <li><a href="#">Traveling <span>(5)</span></a></li>
-                        <li><a href="#">Uncategorized <span>(1)</span></a></li>
-                        <li><a href="#">World Tour <span>(21)</span></a></li>
+                <div class="widget semi-transparent-box" id="categories-widget">
+                    <h3>Popular Categories</h3>
+                    <ul id="categories-list">
+                        <!-- Categories will be dynamically inserted here -->
                     </ul>
                 </div>
+                
                 <div class="widget semi-transparent-box">
                     <h3>Useful Links</h3>
                     <ul>
-                        <li><a href="#">Travel Insurance Guide</a></li>
-                        <li><a href="#">Packing Essentials Checklist</a></li>
-                        <li><a href="#">Budget Travel Hacks</a></li>
-                        <li><a href="#">Solo Travel Safety Tips</a></li>
+                        <li><a href="./plantrip.html">Plan Your Trip</a></li>
+                        <li><a href="./index.html#hotel">Book Your Hotel</a></li>
+                        <li><a href="./feedback.html">Rate Our Services</a></li>
+                        <li><a href="./index.html#testimonials">Know from Our Past Customers</a></li>
                     </ul>
                 </div>
                 <div class="widget semi-transparent-box">
@@ -75,56 +74,139 @@ <h3>Subscribe to Our Newsletter</h3>
     </div>
 
     <script>
-        document.addEventListener("DOMContentLoaded", () => {
-            const blogPosts = [
-                {
-                    title: "Island Hopping in Greece: A Mediterranean Odyssey",
-                    date: "July 12, 2024",
-                    author: "Nikos Papadopoulos",
-                    image: "/img/pexels-josh-hild-2422259.jpg",
-                    content: "Embark on a sun-soaked journey through the Greek islands, from the iconic white-washed buildings of Santorini to the vibrant nightlife of Mykonos and the historical wonders of Crete. Discover hidden beaches, indulge in mouthwatering cuisine, and immerse yourself in the rich tapestry of Greek culture.",
-                    tags: ["Greece", "Islands", "Mediterranean", "Culture"],
-                    likes: 342,
-                    comments: 56,
-                    link: "#"
-                },
-                {
-                    title: "A Week in Bali: Discovering Paradise and Inner Peace",
-                    date: "July 16, 2024",
-                    author: "Emma Thompson",
-                    image: "/img/bali.jpg",
-                    content: "Bali, the Island of Gods, offers a perfect blend of spiritual awakening and tropical bliss. From the serene rice terraces of Ubud to the bustling beaches of Seminyak, experience a week of yoga retreats, traditional ceremonies, and unforgettable sunsets that will rejuvenate your body and soul.",
-                    tags: ["Bali", "Wellness", "Beaches", "Culture"],
-                    likes: 287,
-                    comments: 42,
-                    link: "#"
-                },
-                {
-                    title: "Conquering the Inca Trail: A Journey to Machu Picchu",
-                    date: "July 15, 2024",
-                    author: "Carlos Rodriguez",
-                    image: "/img/machu picchu.jpg",
-                    content: "Follow in the footsteps of ancient Incas as we trek through the challenging but rewarding Inca Trail. Witness breathtaking Andean vistas, explore mysterious ruins, and finally arrive at the magnificent lost city of Machu Picchu. An adventure that will test your limits and leave you in awe.",
-                    tags: ["Peru", "Hiking", "History", "Adventure"],
-                    likes: 401,
-                    comments: 73,
-                    link: "#"
-                },
-                {
-                    title: "Cherry Blossom Magic: Springtime in Japan",
-                    date: "July 14, 2024",
-                    author: "Yuki Tanaka",
-                    image: "/img/cherry_blossom.jpg",
-                    content: "Experience the ephemeral beauty of Japan's cherry blossom season. From the bustling streets of Tokyo to the serene gardens of Kyoto, witness the country transform into a pink wonderland. Partake in hanami picnics, visit ancient temples, and immerse yourself in the timeless traditions of Japan.",
-                    tags: ["Japan", "Cherry Blossoms", "Culture", "Spring"],
-                    likes: 365,
-                    comments: 58,
-                    link: "#"
-                }
-            ];
+        const blogPosts = [
+            {
+                title: "Island Hopping in Greece: A Mediterranean Odyssey",
+                date: "July 12, 2024",
+                author: "Nikos Papadopoulos",
+                image: "./img/pexels-josh-hild-2422259.jpg",
+                content: "Embark on a sun-soaked journey through the Greek islands, from the iconic white-washed buildings of Santorini to the vibrant nightlife of Mykonos and the historical wonders of Crete. Discover hidden beaches, indulge in mouthwatering cuisine, and immerse yourself in the rich tapestry of Greek culture.",
+                tags: ["Greece", "Islands", "Mediterranean", "Culture"],
+                likes: 342,
+                comments: 56,
+                link: "#"
+            },
+            {
+                title: "A Week in Bali: Discovering Paradise and Inner Peace",
+                date: "July 16, 2024",
+                author: "Emma Thompson",
+                image: "./img/bali.jpg",
+                content: "Bali, the Island of Gods, offers a perfect blend of spiritual awakening and tropical bliss. From the serene rice terraces of Ubud to the bustling beaches of Seminyak, experience a week of yoga retreats, traditional ceremonies, and unforgettable sunsets that will rejuvenate your body and soul.",
+                tags: ["Bali", "Wellness", "Beaches", "Culture"],
+                likes: 287,
+                comments: 42,
+                link: "#"
+            },
+            {
+                title: "Conquering the Inca Trail: A Journey to Machu Picchu",
+                date: "July 15, 2024",
+                author: "Carlos Rodriguez",
+                image: "./img/machu picchu.jpg",
+                content: "Follow in the footsteps of ancient Incas as we trek through the challenging but rewarding Inca Trail. Witness breathtaking Andean vistas, explore mysterious ruins, and finally arrive at the magnificent lost city of Machu Picchu. An adventure that will test your limits and leave you in awe.",
+                tags: ["Peru", "Hiking", "History", "Adventure"],
+                likes: 401,
+                comments: 73,
+                link: "#"
+            },
+            {
+                title: "Cherry Blossom Magic: Springtime in Japan",
+                date: "July 14, 2024",
+                author: "Yuki Tanaka",
+                image: "./img/cherry_blossom.jpg",
+                content: "Experience the ephemeral beauty of Japan's cherry blossom season. From the bustling streets of Tokyo to the serene gardens of Kyoto, witness the country transform into a pink wonderland. Partake in hanami picnics, visit ancient temples, and immerse yourself in the timeless traditions of Japan.",
+                tags: ["Japan", "Cherry Blossoms", "Culture", "Spring"],
+                likes: 365,
+                comments: 58,
+                link: "#"
+            },
+            {
+                title: "Wildlife Safari in Kenya: An Unforgettable Adventure",
+                date: "July 22, 2024",
+                author: "Zara Patel",
+                image: "./img/kenya_safari.jpg",
+                content: "Embark on a thrilling safari through the vast African savanna. Encounter majestic lions, graceful giraffes, and powerful elephants in their natural habitat. Experience the magic of the African wilderness.",
+                tags: ["Africa", "Safari", "Wildlife", "Adventure","Kenya"],
+                likes: 385,
+                comments: 72,
+                link: "#"
+            },
+            {
+                title: "Hiking the Appalachian Trail: A Journey of Self-Discovery",
+                date: "July 21, 2024",
+                author: "Ben Carter",
+                image: "./img/appalachian_trail.jpg",
+                content: "Challenge yourself with a hike along the iconic Appalachian Trail. Discover stunning natural beauty, encounter diverse wildlife, and connect with nature on a deeper level.",
+                tags: ["Hiking", "Nature", "Adventure", "USA"],
+                likes: 312,
+                comments: 48,
+                link: "#"
+            },
+            {
+                title: "Exploring the Wonders of the Amazon Rainforest",
+                date: "July 23, 2024",
+                author: "Maria Silva",
+                image: "./img/amazon_rainforest.jpg",
+                content: "Immerse yourself in the lush greenery of the Amazon rainforest. Encounter exotic wildlife, learn about indigenous cultures, and contribute to rainforest conservation.",
+                tags: ["Amazon", "Rainforest", "Nature", "Conservation"],
+                likes: 420,
+                comments: 85,
+                link: "#"
+            },
+            {
+                title: "Culinary Tour of Italy: A Taste of La Dolce Vita",
+                date: "July 24, 2024",
+                author: "Luca Rossi",
+                image: "./img/italian_food.jpg",
+                content: "Indulge your taste buds with a culinary journey through Italy. From the rich flavors of Bologna to the fresh seafood of Sicily, experience the authentic taste of Italian cuisine.",
+                tags: ["Italy", "Food", "Travel", "Culture"],
+                likes: 350,
+                comments: 60,
+                link: "#"
+            },
+            {
+                title: "Discovering the Hidden Gems of Southeast Asia",
+                date: "July 25, 2024",
+                author: "Linh Nguyen",
+                image: "./img/southeast_asia.jpg",
+                content: "Uncover the hidden treasures of Southeast Asia. Explore bustling cities, relax on pristine beaches, and immerse yourself in rich cultural experiences.",
+                tags: ["Southeast Asia", "Travel", "Culture", "Adventure"],
+                likes: 390,
+                comments: 75,
+                link: "#"
+            },
+            {
+                title: "Winter Wonderland: A Ski Vacation in the Alps",
+                date: "July 26, 2024",
+                author: "Chloe Dubois",
+                image: "./img/alps_skiing.jpg",
+                content: "Escape the winter blues with a thrilling ski vacation in the Alps. Enjoy breathtaking mountain views, carve fresh powder, and cozy up by a fireplace in the evening.",
+                tags: ["Alps", "Skiing", "Winter", "Adventure"],
+                likes: 330,
+                comments: 55,
+                link: "#"
+            },
+            {
+                title: "Exploring the Ancient Ruins of Egypt: A Journey Through Time",
+                date: "July 27, 2024",
+                author: "Omar Ahmed",
+                image: "./img/egypt_ruins.jpg",
+                content: "Unveil the mysteries of ancient Egypt by visiting iconic landmarks like the pyramids of Giza and the Sphinx. Immerse yourself in the rich history and culture of this fascinating country.",
+                tags: ["Egypt", "History", "Culture", "Adventure"],
+                likes: 410,
+                comments: 80,
+                link: "#"
+            }
+        ];
 
+        function filterPostsByTag(tag) {
+            const filteredPosts = blogPosts.filter(post => post.tags.includes(tag));
+            displayPosts(filteredPosts);
+        }
+
+        function displayPosts(posts) {
             const blogSection = document.getElementById("blog-posts");
-            blogPosts.forEach(post => {
+            blogSection.innerHTML = ''; // Clear existing posts
+            posts.forEach(post => {
                 const article = document.createElement("article");
                 article.className = "blog-post semi-transparent-box";
                 article.innerHTML = `
@@ -139,13 +221,25 @@ <h2>${post.title}</h2>
                         </div>
                         <p>${post.content}</p>
                         <div class="tags">
-                            ${post.tags.map(tag => `<span class="tag">${tag}</span>`).join('')}
+                            ${post.tags.map(tag => `<span class="tag" onclick="filterPostsByTag('${tag}')">${tag}</span>`).join('')}
                         </div>
                         <a href="${post.link}" class="read-more">Read More <i class="fas fa-arrow-right"></i></a>
                     </div>
                 `;
                 blogSection.appendChild(article);
             });
+        }
+
+        function resetFilters() {
+            displayPosts(blogPosts);
+        }
+
+        document.addEventListener("DOMContentLoaded", () => {
+            // Display all posts initially
+            displayPosts(blogPosts);
+
+            // Add event listener for reset filters button
+            document.getElementById('reset-filters').addEventListener('click', resetFilters);
 
             const relatedPosts = blogPosts.slice(1, 4);
             const relatedWidget = document.querySelector('.widget:nth-child(3)');
@@ -163,6 +257,43 @@ <h4>${post.title}</h4>
             });
         });
 
+        function displayTopCategories() {
+        const categoriesCount = {};
+
+        blogPosts.forEach(post => {
+            post.tags.forEach(tag => {
+                if (categoriesCount[tag]) {
+                    categoriesCount[tag]++;
+                } else {
+                    categoriesCount[tag] = 1;
+                }
+            });
+        });
+
+        const sortedCategories = Object.entries(categoriesCount)
+            .sort((a, b) => b[1] - a[1])
+            .slice(0, 5);
+
+        const categoriesList = document.getElementById('categories-list');
+        categoriesList.innerHTML = '';
+
+        sortedCategories.forEach(([category, count]) => {
+            const listItem = document.createElement('li');
+            listItem.innerHTML = `<a href="#" onclick="filterPostsByTag('${category}')">${category} <span>(${count})</span></a>`;
+            categoriesList.appendChild(listItem);
+        });
+    }
+
+    // Display posts and top categories when the document is loaded
+    displayPosts(blogPosts);
+    displayTopCategories();
+
+    // Add event listener for reset filters button
+    document.getElementById('reset-filters').addEventListener('click', () => {
+        displayPosts(blogPosts);
+    });
+
+
         window.addEventListener('scroll', () => {
             const header = document.querySelector('.hero');
             if (window.scrollY > 50) {
@@ -173,4 +304,5 @@ <h4>${post.title}</h4>
         });
     </script>
 </body>
-</html>
+
+</html>
\ No newline at end of file
diff --git a/contributors.css b/contributors.css
index 1aff105f..5661c5bd 100644
--- a/contributors.css
+++ b/contributors.css
@@ -1,60 +1,66 @@
 body {
-    font-family: Arial, sans-serif;
-    background-color: #f4f4f4;
-    color: #333;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    min-height: 100vh;
-    margin: 0;
-  }
-  
-  .container {
-    text-align: center;
-  }
-  
-  .title {
-    font-size: 2em;
-    margin-bottom: 20px;
-  }
-  
-  .contributors-grid {
-    display: flex;
-    flex-wrap: wrap;
-    gap: 20px;
-    justify-content: center;
-  }
-  
-  .contributor-card {
-    background-color: #fff;
-    border: 1px solid #ddd;
-    border-radius: 10px;
-    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
-    padding: 20px;
-    width: 200px;
-    text-align: center;
-    transition: transform 0.3s, box-shadow 0.3s;
-  }
-  
-  .contributor-card:hover {
-    transform: scale(1.05);
-    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
-  }
-  
-  .contributor-card img {
-    border-radius: 50%;
-    width: 80px;
-    height: 80px;
-    object-fit: cover;
-    margin-bottom: 10px;
-  }
-  
-  .contributor-card h2 {
-    font-size: 1.2em;
-    margin: 0 0 10px;
-  }
-  
-  .contributor-card p {
-    color: #666;
-  }
-  
\ No newline at end of file
+  font-family: "Poppins";
+  background-color: #f4f4f4;
+  color: #333;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  min-height: 100vh;
+  margin: 0;
+}
+
+.container {
+  text-align: center;
+}
+
+.title {
+  display: inline-block;
+  font-size: 3em;
+  margin-bottom: 20px;
+  padding: 10px;
+  color: #055364;
+  border-radius: 20px;
+  background-color: rgba(209, 209, 255, 0.8);
+}
+
+.contributors-grid {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 20px;
+  justify-content: center;
+  padding: 10px;
+  gap: 40px;
+}
+
+.contributor-card {
+  background-color: #e5e5f8;
+  border: 2px solid #101010;
+  border-radius: 10px;
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+  padding: 20px;
+  width: 200px;
+  text-align: center;
+  transition: transform 0.3s, box-shadow 0.3s;
+}
+
+.contributor-card:hover {
+  transform: scale(1.05);
+  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.9);
+}
+
+.contributor-card img {
+  border-radius: 50%;
+  width: 100px;
+  height: 100px;
+  object-fit: cover;
+  margin-bottom: 10px;
+}
+
+.contributor-card h2 {
+  font-size: 1.2em;
+  margin: 0 0 10px;
+}
+
+.contributor-card p {
+  color: #040404;
+}
diff --git a/contributors.html b/contributors.html
index 2d1d60e7..78b10551 100644
--- a/contributors.html
+++ b/contributors.html
@@ -1,16 +1,101 @@
 <!DOCTYPE html>
 <html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Contributors</title>
-  <link rel="stylesheet" href="contributors.css">
-</head>
-<body>
-  <div class="container">
-    <h1 class="title">Contributors</h1>
-    <div id="contributors" class="contributors-grid"></div>
-  </div>
-  <script src="contributors.js"></script>
-</body>
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Contributors</title>
+    <link rel="stylesheet" href="contributors.css" />
+    <link
+      rel="stylesheet"
+      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
+      integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA=="
+      crossorigin="anonymous"
+      referrerpolicy="no-referrer"
+    />
+    <link
+      href="https://cdn.jsdelivr.net/npm/remixicon@3.2.0/fonts/remixicon.css"
+      rel="stylesheet"
+    />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
+      rel="stylesheet"
+    />
+
+    <style>
+      html {
+        scroll-behavior: smooth;
+      }
+      .top-btn {
+        display: none;
+        width: 50px;
+        height: 50px;
+        position: fixed;
+        bottom: 10px;
+        right: 0px;
+        background-color: #ab45e7;
+        color: #fff;
+        padding: 2px;
+        border: none;
+        margin-right: 36px;
+        border-radius: 50%;
+        cursor: pointer;
+      }
+
+      .top-btn:hover {
+        background-color: #0056b3;
+      }
+
+      video#background-video {
+        position: fixed;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+        z-index: -1;
+        background-size: cover;
+      }
+    </style>
+  </head>
+  <body>
+    <video id="background-video" autoplay muted loop>
+      <source src="back5.mp4" type="video/mp4" />
+      Your browser does not support the video tag.
+    </video>
+
+    <div class="container">
+      <h1 class="title">Contributors</h1>
+      <div id="contributors" class="contributors-grid"></div>
+    </div>
+    <button class="top-btn" id="goToTopBtn" onclick="goToTop()">
+      <i class="fa-solid fa-chevron-up" style="color: #ffffff"></i>
+    </button>
+    <script>
+      // Get the button
+      var mybutton = document.getElementById("goToTopBtn");
+
+      // When the user scrolls down 20px from the top of the document, show the button
+      window.onscroll = function () {
+        scrollFunction();
+      };
+
+      function scrollFunction() {
+        if (
+          document.body.scrollTop > 20 ||
+          document.documentElement.scrollTop > 20
+        ) {
+          mybutton.style.display = "block";
+        } else {
+          mybutton.style.display = "none";
+        }
+      }
+
+      // When the user clicks on the button, scroll to the top of the document
+      function goToTop() {
+        document.body.scrollTop = 0;
+        document.documentElement.scrollTop = 0;
+      }
+    </script>
+    <script src="contributors.js"></script>
+  </body>
 </html>
diff --git a/explore.css b/explore.css
index 148f0541..31621806 100644
--- a/explore.css
+++ b/explore.css
@@ -134,6 +134,7 @@
   flex-direction: column;
   align-items: center;
   justify-content: center;
+  width: 100vw;
 }
 .section__title {
   margin: 10px;
diff --git a/faq-website.css b/faq-website.css
index ff45a771..f06f0f80 100644
--- a/faq-website.css
+++ b/faq-website.css
@@ -2,7 +2,7 @@
 
 * {
   box-sizing: border-box;
-  border-radius: 20px;
+  /* border-radius: 20px; */
 }
 
 
diff --git a/faq.html b/faq.html
index 7d2a6dbe..b7da01c8 100644
--- a/faq.html
+++ b/faq.html
@@ -182,14 +182,52 @@
     </style>
   <link rel="stylesheet" href="imstyle.css">
   <link rel="stylesheet" href="jquery.flipster.min.css">
+  <style>
+   
+  #progress-container {
+    position: fixed ;
+    top: 0px;
+    left: 0;
+    width: 100%;
+    height: 15px;
+    z-index: 99990;
+    /* background: #f3f3f3; */
+}
+
+#progress-bar {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 0%;
+    height: 7px;
+    width: 0;
+    background: linear-gradient(90deg, rgb(0, 72, 255) 0%, rgb(153, 187, 255) 50%, rgb(0, 184, 250) 100%);
+    box-shadow: 0 0 4px rgba(0, 166, 255, 0.7), 0 0 10px rgba(255, 255, 255, 0.7);
+    transition: width 0.09s ease-in-out;
+    border-radius: 10px;
+}
+
+  </style>
   
   </head>
   
   
   <body style="background-color: var(--secondary-color);">
-  
+    <div id="progress-container">
+      <div id="progress-bar"></div>
+    </div>
+    <script>
+          
+      window.addEventListener('scroll', function() {
+          const winScroll = document.body.scrollTop || document.documentElement.scrollTop;
+          const height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
+          const scrolled = (winScroll / height) * 100;
+          document.getElementById('progress-bar').style.width = scrolled + '%';
+      });
+      </script>
     <body>
 
+
       <div class="circle-container">
         <div class="circle"></div>
         <div class="circle"></div>
diff --git a/footer.css b/footer.css
new file mode 100644
index 00000000..9cc8570d
--- /dev/null
+++ b/footer.css
@@ -0,0 +1,45 @@
+.footer__container {
+    width: 100%;
+    /* max-width: 1800px; */
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    align-items: flex-start;
+    justify-content: space-between;
+    grid-template-columns: repeat(3, 1fr);
+    gap: 20px;
+    color: var(--secondary-color);
+    margin: 0;
+    padding: 0;
+  }
+
+.goog-te-combo{
+    background: #5074cf;
+    color: white;
+    height: 40px;
+    border-radius: 70px;
+    padding: 10px;
+    border: #1457ff;
+    backdrop-filter: blur(20px);
+    font-size: medium;
+    font-weight: 400;
+}
+
+.goog-te-combo option{
+    background: #9fbaff;
+    height: 40px;
+    margin-top: 5px;
+    font-size: medium;
+    color: black;
+}
+
+.footer_text{
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+}
+
+.footer_text a{
+    color: white;
+    /* margin-top: 10px; */
+}
diff --git a/img/alps_skiing.jpg b/img/alps_skiing.jpg
new file mode 100644
index 00000000..5668e911
Binary files /dev/null and b/img/alps_skiing.jpg differ
diff --git a/img/amazon_rainforest.jpg b/img/amazon_rainforest.jpg
new file mode 100644
index 00000000..e37d87a1
Binary files /dev/null and b/img/amazon_rainforest.jpg differ
diff --git a/img/appalachian_trail.jpg b/img/appalachian_trail.jpg
new file mode 100644
index 00000000..356b03d4
Binary files /dev/null and b/img/appalachian_trail.jpg differ
diff --git a/img/egypt_ruins.jpg b/img/egypt_ruins.jpg
new file mode 100644
index 00000000..b83c4461
Binary files /dev/null and b/img/egypt_ruins.jpg differ
diff --git a/img/italian_food.jpg b/img/italian_food.jpg
new file mode 100644
index 00000000..4a581c55
Binary files /dev/null and b/img/italian_food.jpg differ
diff --git a/img/kenya_safari.jpg b/img/kenya_safari.jpg
new file mode 100644
index 00000000..eeb59579
Binary files /dev/null and b/img/kenya_safari.jpg differ
diff --git a/img/southeast_asia.jpg b/img/southeast_asia.jpg
new file mode 100644
index 00000000..4d3f28a7
Binary files /dev/null and b/img/southeast_asia.jpg differ
diff --git a/index.html b/index.html
index 2e4bcc8a..cefcb13f 100644
--- a/index.html
+++ b/index.html
@@ -33,6 +33,7 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 
   <link rel="stylesheet" href="styles.css" />
+  <link rel="stylesheet" href="footer.css">
   <link rel="stylesheet" href="./Image-Gallery/style.css">
   <link rel="stylesheet" href="./Image-Gallery/stylecaptions.css">
   <link rel="stylesheet" href="explore.css">
@@ -42,8 +43,6 @@
    <img src="Untitled (1).mp4" alt="">
   <link rel="icon" type="image/x-icon" href="favicon.ico"/>
 
-  <link rel="icon" type="image/x-icon" href="favicon.ico" />
-
   <link rel="stylesheet" href="tilt.css">
   <script src="tilt.js"></script>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/countup.js/2.0.7/countUp.min.js"></script>
@@ -81,7 +80,7 @@
     html {
       scroll-behavior: smooth;
     }
-  </style>
+  </style> 
   <style>
     .active {
       color: red !important;
@@ -189,12 +188,178 @@
       pointer-events: none;
       z-index: 9999;
     }
+ 
+    /* cookie-consent */
+    #cookie-consent {
+  position: fixed;
+  bottom: 10px;
+  left: 70px;
+  background-color: #e3e4fc;
+  padding: 20px;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  align-items: center;
+  width: 300px;
+  height: fit-content;
+  z-index: 10000;
+  border-radius: 10px;
+  margin-bottom: 5px;
+  margin: 20px;
+  border-right: 4px solid transparent;
+  border-bottom: 4px solid transparent;
+  transition: border-color 0.3s;
+  border: 1px solid rgb(4, 4, 215);
+  border-bottom: #3950ac;
+}
+
+#cookie-consent:hover {
+  border-right:6px solid #0207a3;
+  border-bottom:6px solid #3202a3;
+}
+
+#cookie-consent p {
+  color: black;  /* Make the text black for better visibility */
+  text-align: center;  /* Center align the text */
+}
+
+.accept-cookies,
+.reject-cookies {
+  width: 260px;  /* Decrease the button width */
+  height: 35px;  /* Decrease the button height */
+  color: white;
+  background-color: #150267;
+  border: none;
+  border-radius: 5px;  /* Add rounded corners */
+  cursor: pointer;
+  transition: transform 0.3s, box-shadow 0.3s, background-color 0.3s, color 0.3s;  /* Smooth transition for effects */
+}
+
+.reject-cookies {
+  margin-top: 10px;
+}
+
+.accept-cookies:hover,
+.reject-cookies:hover {
+  transform: scale(0.95);
+  box-shadow: 0 0 15px rgb(75, 215, 239,0.6);  /* Reduce the shadow size */
+}
+
+.accept-cookies:hover {
+  background-color: rgb(57, 159, 222);
+  color: #0d0b0b;
+  border: 1px solid rgb(2, 2, 53);
+}
+
+.reject-cookies:hover {
+  background-color: rgb(57, 159, 222);
+  color: #0d0b0b;
+  border: 1px solid rgb(2, 2, 53);
+}
+
+#learn-more-link,
+#show-less-link {
+  color: #f90814;  
+  text-decoration: none;
+  cursor: pointer;
+  font-size: 16px;
+}
+.header__image{
+  margin-right: 15rem;
+}
+
+#cookie-content {
+  display: none;
+  margin-top: 10px;
+} 
+
 
     @media (max-width: 725px) {
       .circle-container{
         display: none;
       }
     }
+/* testimonials */
+    .card1 {
+  width: 330px;
+  height: 450px;
+  transition: opacity 0.5s ease;
+}
+
+.card-inner {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  text-align: center;
+  transform-style: preserve-3d;
+  transition: transform 0.8s;
+}
+
+.card1:hover .card-inner {
+  transform: rotateY(180deg);
+}
+
+.card-front,
+.card-back {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  backface-visibility: hidden;
+}
+
+.card-back {
+  transform: rotateY(180deg);
+  background-color: rgb(228, 224, 238);
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  color: black;
+}
+
+.card-img-top {
+  height: 300px;
+  width: 100%;
+  object-fit: cover;
+}
+
+
+@media (max-width: 995px) {
+  .row1 {
+    flex-direction: column;
+    align-items: center;
+  }
+
+  .card1 {
+    width: 80%;
+    margin-bottom: 20px;
+  }
+}
+
+  </style>
+  <style>
+    #progress-container {
+    position: fixed ;
+    top: 0px;
+    left: 0;
+    width: 100%;
+    height: 15px;
+    z-index: 99990;
+    /* background: #f3f3f3; */
+}
+
+#progress-bar {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 0%;
+    height: 7px;
+    width: 0;
+    background: linear-gradient(90deg, rgb(0, 72, 255) 0%, rgb(153, 187, 255) 50%, rgb(0, 184, 250) 100%);
+    box-shadow: 0 0 4px rgba(0, 166, 255, 0.7), 0 0 10px rgba(255, 255, 255, 0.7);
+    transition: width 0.09s ease-in-out;
+    border-radius: 10px;
+}
 
   </style>
   <link rel="stylesheet" href="imstyle.css">
@@ -206,6 +371,8 @@
 <body style="background-color: var(--secondary-color);">
 
   <body>
+
+
     <div class="circle-container">
       <div class="circle"></div>
       <div class="circle"></div>
@@ -277,6 +444,15 @@
       });
 
     </script>
+
+  <!-- sticky animation  -->
+ <script type="text/javascript">
+  window.addEventListener("scroll", function () {
+    var header = document.querySelector("nav");
+    header.classList.toggle("sticky", window.scrollY > 50)
+  })
+</script>
+
     <div id="pre-loader">
       <h1>TourGuide . . .</h1>
     </div>
@@ -285,8 +461,12 @@ <h1>TourGuide . . .</h1>
       <canvas></canvas>
       <canvas></canvas>
     </div>
+    
+
     <!-- <div id="progressbar"></div> -->
-    <div id="scrollPath"></div>
+
+    <!-- <div id="scrollPath"></div> -->
+
     <!-- <canvas id="canvas"></canvas> -->
     <!-- <nav>
 
@@ -305,11 +485,14 @@ <h1>TourGuide . . .</h1>
     <button id="toggle" data-aos="fade-down">Dark Theme</button>
     <a href="#contact"><button class="btn" id="btn-style">Contact Us</button></a>
   </nav> -->
+
     <div class="nav-container" id="top">
       <nav class="newNav">
+        <div style="display: flex; flex-direction: row; align-items: center;">
         <img src="./img/tour1.png" class="sitelogo">
         
         <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
+      </div>
 
         <ul class="navLinks">
           <li class="link" id="View-link" data-aos=""><a href="mapa.html">View</a></li>
@@ -327,7 +510,7 @@ <h1>TourGuide . . .</h1>
               </ul>
           </li>
           <li class="link" data-aos=""><a href="#testimonials">Testimonial</a></li>
-          <li class="link" data-aos=""><a href="feedback.html">Rate Us</a></li>
+          <li class="link" data-aos=""><a href="feedback.html">Rate Us?</a></li>
           <li class="link" data-aos=""><a href="#cnt-form">Contact Us</a></li>
       </ul>
 
@@ -354,7 +537,26 @@ <h1>TourGuide . . .</h1>
     </div>
     <header>
       <div class="nav-wrapperr">
-        <div class="progress-bar"></div>
+        <div id="progress-container">
+          <div id="progress-bar"></div>
+        </div>
+    
+        <script>
+        window.addEventListener('scroll', function() {
+    // Get the current scroll position
+    const winScroll = document.documentElement.scrollTop || document.body.scrollTop;
+    
+    // Get the total scrollable height
+    const height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
+    
+    // Calculate the percentage scrolled
+    const scrolled = (winScroll / height) * 100;
+    
+    // Set the progress bar width
+    document.getElementById('progress-bar').style.width = scrolled + '%';
+});
+
+        </script>
       </div>
       
       <section class="section__container header__container" id="Home">
@@ -423,7 +625,23 @@ <h1 class="headingofAbout section__title " data-aos=" fade-in"><b>About Us</b></
                       transform: scale(1.8);
                       transition: transform 0.8s ease;
                     }
+                    .video-container {
+                      display: flex;
+                      align-items: center;
+                      justify-content: center;
+                      height: 30vh;
+                    }
+                    .iframe {
+                       width: 760px;
+                       height: 515px;
+                       border: none;
+
+                    }
                   </style>
+                  <br>
+                  <div class="video-container">
+                    <iframe src="https://www.youtube.com/embed/veULUjsSrPg?si=eq3sDAt3-yZnZUme" allowfullscreen></iframe>
+                  </div>
                   <p class="aboutcontent" data-aos="fade-in" style="text-align: justify;">
                     <span style="margin-left: 80px;"></span>Welcome to TourGuide, where we firmly believe that life's
                     true purpose unfolds amidst the thrill of exploration, the embrace of the unfamiliar, and the
@@ -1096,7 +1314,220 @@ <h3 style="color: rgb(151, 6, 241); font-style: italic;font-family: Cambria, Coc
     <br /><br /><br /><br />
 
     <!-- Testimonials Section -->
-    <section class="testimonials" id="testimonials">
+    <section id="testimo" class="testimo">
+      <h2 class="testimonial-heading section__title" align-items="center" data-aos="fade-in">Testimonials</h2>
+      <div class="container" style="display: flex; flex-wrap: wrap">
+        <div
+          class="card text-center card1"
+          style="
+            height: 450px;
+            display: flex;
+            flex-direction: column;
+            justify-content: space-between;
+            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+            margin: 10px;
+            perspective: 1000px;
+            transition: transform 0.8s;
+          "
+        >
+          <div
+            class="card-inner"
+            style="
+              position: relative;
+              width: 100%;
+              height: 100%;
+              text-align: center;
+              transform-style: preserve-3d;
+              transition: transform 0.8s;
+            "
+          >
+            <div
+              class="card-front"
+              style="
+                position: absolute;
+                width: 100%;
+                height: 100%;
+                backface-visibility: hidden;
+              "
+            >
+              <img
+                src="./img/testimonial1.jpg"
+                class="card-img-top"
+                alt="Broccoli"
+                style="width: 100%; height: 100%; object-fit: cover"
+              />
+            </div>
+            <div
+              class="card-back"
+              style="
+                position: absolute;
+                width: 100%;
+                height: 100%;
+                backface-visibility: hidden;
+                transform: rotateY(180deg);
+                background-color: rgb(228, 224, 238);
+                display: flex;
+                flex-direction: column;
+                justify-content: center;
+                align-items: center;
+                color: black;
+              "
+            >
+            <p><sup><i class="fas fa-quote-left"></i></sup>TourGuide made our dream vacation a reality! From the
+              breathtaking landscapes to the seamless logistics, every moment was a new adventure. The
+              personalized
+              itinerary and expert guides added a special touch to our journey. We can't wait to book our next
+              trip with
+              TourGuide!<sup><i class="fas fa-quote-right"></i></sup></p>
+            <div class="user-info">
+              <h3>Joseph</h3>
+            </div>
+            </div>
+          </div>
+        </div>
+        <div
+          class="card text-center card1"
+          style="
+            height: 450px;
+            display: flex;
+            flex-direction: column;
+            justify-content: space-between;
+            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+            margin: 10px;
+            perspective: 1000px;
+            transition: transform 0.8s;
+          "
+        >
+          <div
+            class="card-inner"
+            style="
+              position: relative;
+              width: 100%;
+              height: 100%;
+              text-align: center;
+              transform-style: preserve-3d;
+              transition: transform 0.8s;
+            "
+          >
+            <div
+              class="card-front"
+              style="
+                position: absolute;
+                width: 100%;
+                height: 100%;
+                backface-visibility: hidden;
+              "
+            >
+              <img
+                src="./img/testimonial2.jpg"
+                class="card-img-top"
+                alt="Tomato"
+                style="width: 100%; height: 100%; object-fit: cover"
+              />
+            </div>
+            <div
+              class="card-back"
+              style="
+                position: absolute;
+                width: 100%;
+                height: 100%;
+                backface-visibility: hidden;
+                transform: rotateY(180deg);
+                background-color: rgb(228, 224, 238);;
+                display: flex;
+                flex-direction: column;
+                justify-content: center;
+                align-items: center;
+                color: black;
+              "
+            >
+            <p><sup><i class="fas fa-quote-left"></i></sup>Traveling with the family has never been easier!
+              TourGuide
+              took
+              care of every detail, ensuring a stress-free and enjoyable vacation for all. The kid-friendly
+              activities
+              and
+              family-oriented guides made our trip unforgettable.<sup><i class="fas fa-quote-right"></i></sup></p>
+            <div class="user-info">
+              <h3>Katie</h3>
+            </div>
+            </div>
+          </div>
+        </div>
+        <div
+          class="card text-center card1"
+          style="
+            height: 450px;
+            display: flex;
+            flex-direction: column;
+            justify-content: space-between;
+            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+            margin: 10px;
+            perspective: 1000px;
+            transition: transform 0.8s;
+          "
+        >
+          <div
+            class="card-inner"
+            style="
+              position: relative;
+              width: 100%;
+              height: 100%;
+              text-align: center;
+              transform-style: preserve-3d;
+              transition: transform 0.8s;
+            "
+          >
+            <div
+              class="card-front"
+              style="
+                position: absolute;
+                width: 100%;
+                height: 100%;
+                backface-visibility: hidden;
+              "
+            >
+              <img
+                src="/img/Abhisek Tamang.jpg"
+                class="card-img-top"
+                alt="Broccoli"
+                style="width: 100%; height: 100%; object-fit: cover"
+              />
+            </div>
+            <div
+              class="card-back"
+              style="
+                position: absolute;
+                width: 100%;
+                height: 100%;
+                backface-visibility: hidden;
+                transform: rotateY(180deg);
+                background-color: rgb(228, 224, 238);
+                display: flex;
+                flex-direction: column;
+                justify-content: center;
+                align-items: center;
+                color: black;
+              "
+            >
+            <p><sup><i class="fas fa-quote-left"></i></sup>Our cultural tour with TourGuide exceeded all
+              expectations.
+              The
+              immersive experiences, knowledgeable guides, and carefully curated activities allowed us to connect
+              with
+              the
+              local culture in a way we never thought possible. Thanks to TourGuide.<sup><i
+                  class="fas fa-quote-right"></i></sup></p>
+            <div class="user-info">
+              <h3>Charles</h3>
+            </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </section> 
+
+    <!-- <section class="testimonials" id="testimonials">
       <h2 class="testimonial-heading section__title" align-items="center" data-aos="fade-in">Testimonials</h2>
       <div class="marquee">
         <div class="track">
@@ -1198,7 +1629,7 @@ <h3>Katie</h3>
         </div>
       </div>
 
-    </section>
+    </section> -->
 
     <!----------------------------------------------------- FAQ section ---------------------- -->
 
@@ -1425,7 +1856,7 @@ <h2 class="section__title" data-aos="fade-up">Subscribe to get special prize</h2
 
 
     <footer class="footer" data-aos="fade-up">
-      <div class="section__container footer__container">
+      <div class=" footer__container">
         <div class="footer__col">
           <h3 class="footer-head" class="footer__title" style="cursor: default;">Tourguide<span>.</span></h3>
           <p>
@@ -1437,14 +1868,12 @@ <h3 class="footer-head" class="footer__title" style="cursor: default;">Tourguide
         </div>
         <div class="footer__col">
           <h3 class="footer-head" class="footer__title">Places You May Want to Visit<span>.</span></h3>
-          <p class="footer__text">
+          <p class="footer__text footer_text">
 
             <a href="Cultural_Exp.html">Cultural Experiences</a>
 
             <a href="HoneyMoon.html">Honeymoon Places</a>
             <a href="Adventure.html">Adventure travel</a>
-
-
           </p>
         </div>
         <div class="footer__col">
@@ -1456,6 +1885,7 @@ <h4 class="footer-head" class="footer__subtitle">Support</h4>
             <p><a href="./privacy.html" class="footer__link">Privacy Policy</a></p>
             <p><a href="./Licensing.html" class="footer__link">Licensing</a></p>
             <p><a href="#cnt-form" class="footer__link">Contact Us</a></p>
+            <p><a href="contributors.html" class="footer__link">Our Contributors</a></p>
           </div>
         </div>
         <div class="footer__col">
@@ -1496,32 +1926,32 @@ <h4>Contact Us</h4>
               <a href="tel:8562145852" class="text-nowrap">+91 8562145852</a>
             </div>
             <div class="icons">
-              <a href="">
+              <a href="https://www.linkedin.com/in/arpan-chowdhury-775294251/?original_referer=https%3A%2F%2Fin%2Esearch%2Eyahoo%2Ecom%2F&originalSubdomain=in">
                 <div class="icon">
                   <i class="fab fa-linkedin" title="linkedin" style="cursor: pointer;"></i>
                 </div>
               </a>
 
-              <a href="">
+              <a href="https://x.com/ArpanCh40193288">
                 <div class="icon">
                   <i class="fa-brands fa-x-twitter" title="X" style="cursor: pointer;"></i>
                 </div>
               </a>
 
-              <a href="">
+              <a href="https://www.instagram.com/anuragbasu1973/">
                 <div class="icon">
                   <i class="fab fa-instagram" title="Instagram" style="cursor: pointer;"></i>
                 </div>
               </a>
 
 
-              <a href="" title="YouTube">
+              <a href="https://www.youtube.com/@arpanchowdhury53" title="YouTube">
                 <div class="icon">
                   <i class="fab fa-youtube" style="cursor: pointer;"></i>
                 </div>
               </a>
 
-              <a href="">
+              <a href="https://github.com/apu52">
                 <div class="icon">
                   <i class="fab fa-github" title="Github"></i>
                 </div>
@@ -1537,29 +1967,71 @@ <h4>Contact Us</h4>
           </div>
 
         </div>
-
-        <div class="footer__col">
-          <div id="google_element"></div>
-          <script src="https://translate.google.com/translate_a/element.js?cb=loadGoogleTranslate"></script>
-          <script>
-            function loadGoogleTranslate() {
-              new google.translate.TranslateElement({
-                pageLanguage: 'en'
-              }, 'google_element');
-            }
-          </script>
+        <div style="padding: 32px; background-color: transparent; border-radius: 10px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);">
+          <label for="google_translate_element" style="display: block; font-weight: bold; margin-bottom: 10px; font-size: 20px; color: white;">Select Language:</label>
+          <div id="google_translate_element" style="display: inline-block; margin-top: 10px; padding: 20px; border: 1px solid #ff9fcf; border-radius: 5px; background-color: #fff;"></div>
         </div>
+      </div>
 
+      <!--  New copyright code to make it dynamic and display current year -->
+      <div class="footer__bar">
+        <div>
+          <li>Copyright &copy;<span id="year"></span> </span> Arpan Chowdhury. All rights reserved. </li>
+        </div>
+      </div>
+      
+      
+      
+      
+      <script type="text/javascript">
+        function googleTranslateElementInit() {
+            new google.translate.TranslateElement({pageLanguage: 'en'}, 'google_translate_element');
+        }
+    </script>
+    <script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
+    
 
-        <!--  New copyright code to make it dynamic and display current year -->
-        <div class="footer__bar">
-          <div>
-            <li>Copyright &copy;<span id="year"></span> </span> Arpan Chowdhury. All rights reserved. </li>
-          </div>
+        <!-- <div class="footer__col">
+          <label for="google_translate_element" style="display: block; font-weight: bold; margin-bottom: 5px;">Select Language:</label>
+          <div id="google_translate_element" style="display: inline-block; margin-top: 10px;"></div>
         </div>
+        
+        <script>
+          function googleTranslateElementInit() {
+            new google.translate.TranslateElement({
+              pageLanguage: 'en',
+              includedLanguages: 'es,fr,de,ja,ko,zh-CN',
+              layout: google.translate.TranslateElement.InlineLayout.SIMPLE,
+              autoDisplay: false,
+              gaTrack: true,
+              gaId: 'UA-XXXXXXXX-X'
+            }, 'google_translate_element');
+          }
+        </script>
+        <script src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
+        
+        <script>
+          // Apply inline styling to the select element once it is created by Google Translate
+          window.addEventListener('load', function() {
+            var interval = setInterval(function() {
+              var select = document.querySelector('#google_translate_element select');
+              if (select) {
+                select.style.padding = '5px';
+                select.style.border = '1px solid #ccc';
+                select.style.borderRadius = '0'; // Remove rounded corners to make it rectangular
+                select.style.appearance = 'none'; // Remove default styling
+                select.style.backgroundColor = '#fff';
+                select.style.cursor = 'pointer';
+                clearInterval(interval); // Stop the interval once the select element is found and styled
+              }
+            }, 100); // Check every 100ms
+          });
+        </script> -->
+        
 
     </footer>
-
+    
+  
     <a class="goupbtn" href="#" onclick="goToTop()"><i class="fa-solid fa-arrow-up"></i></a>
 
     <script>
@@ -1659,13 +2131,38 @@ <h4>Contact Us</h4>
     <script src="index.js"></script>
 
 
-    <script>
+    <!-- <script>
       window.embeddedChatbotConfig = {
         chatbotId: "yDQ_EheFvX0HAPr9beQ5L",
         domain: "www.chatbase.co"
       }
     </script>
     <script src="https://www.chatbase.co/embed.min.js" chatbotId="yDQ_EheFvX0HAPr9beQ5L" domain="www.chatbase.co" defer>
+    </script> -->
+
+    <!-- chatbot -->
+    <script src="https://cdn.botpress.cloud/webchat/v1/inject.js"></script>
+    <script>
+      window.botpressWebChat.init({
+          "composerPlaceholder": "Ask me anything!",
+          "botConversationDescription": "TourGuide",
+          "botId": "7d93db89-5ddd-48ac-91c7-d5f35eae9bdc",
+          "hostUrl": "https://cdn.botpress.cloud/webchat/v1",
+          "messagingUrl": "https://messaging.botpress.cloud",
+          "clientId": "7d93db89-5ddd-48ac-91c7-d5f35eae9bdc",
+          "webhookId": "c874de53-fdf6-4bee-bd45-30a736b1a42e",
+          "lazySocket": true,
+          "themeName": "prism",
+          "botName": "TourGuide",
+          "avatarUrl": "https://previews.123rf.com/images/hgucuk/hgucuk2012/hgucuk201200075/161468561-world-tourism-the-tour-guide-%C3%A4%C2%B0con-design.jpg",
+          "stylesheet": "https://webchat-styler-css.botpress.app/prod/28032111-a170-4e9e-be60-9c9222f20935/v72246/style.css",
+          "frontendVersion": "v1",
+          "useSessionStorage": true,
+          "enableConversationDeletion": true,
+          "theme": "prism",
+          "themeColor": "#2563eb",
+          "allowedOrigins": []
+      });
     </script>
 
 
@@ -1995,17 +2492,7 @@ <h4>Contact Us</h4>
         // Initialize AOS library
         AOS.init();
       });</script>
-    <script>
-
-      let progress = document.getElementById("progressbar");
-
-      let totalHeight = document.body.scrollHeight - window.innerHeight;
-      window.onscroll = function () {
-        let progressHeight = (window.pageYOffset / totalHeight) * 100;
-        progress.style.height = progressHeight + "%";
-      }
-
-    </script>
+    
 
 
 
@@ -2099,16 +2586,7 @@ <h4>Contact Us</h4>
 
 
 <script>
-    const scrollline = document.querySelector('.progress-bar');
-
-  function fillscrollline() {
-    const windowHeight = window.innerHeight;
-    const fullHeight = document.body.clientHeight;
-    const scrolled = window.scrollY;
-    const percentScrolled = (scrolled / (fullHeight - windowHeight)) * 100;
-
-    scrollline.style.width = percentScrolled + '%';
-  };
+    
 
     window.addEventListener('scroll', fillscrollline);
 
diff --git a/login/login.css b/login/login.css
index 54c3cb24..42900493 100644
--- a/login/login.css
+++ b/login/login.css
@@ -369,6 +369,19 @@ input {
         z-index: 10000;
     }
 
+/* Add styles for the success banners */
+.decline-banner {
+  display: none;
+  background-color: #cc0000;
+  color: white;
+  padding: 15px;
+  text-align: center;
+  position: fixed;
+  top: 0;
+  width: 100%;
+  z-index: 10000;
+}
+
 /* hover ibn social icons */
 .social-container .fb:hover {
   color: white;
diff --git a/newLogin.html b/newLogin.html
index cc0bed60..4a5710d2 100644
--- a/newLogin.html
+++ b/newLogin.html
@@ -12,7 +12,9 @@
 </head>
 <body>
   <div id="loginSuccessBanner" class="success-banner">Logged in successfully</div>
+  <div id="loginDeclineBanner" class="decline-banner">Logged in Blocked <br> credentials didn't match</div>
     <div id="registerSuccessBanner" class="success-banner">Registered successfully</div>
+    <div id="registerDeclineBanner" class="decline-banner">Registered Blocked <br> Same email address</div>
   <div class="main-container">
     <div class="container" id="container">
       <div class="form-container register-container">
@@ -112,6 +114,8 @@ <h1 class="title">Start your <br> journey now</h1>
       const container = document.getElementById("container");
       const loginSuccessBanner = document.getElementById("loginSuccessBanner");
       const registerSuccessBanner = document.getElementById("registerSuccessBanner");
+      const loginDeclineBanner = document.getElementById("loginDeclineBanner");
+      const registerDeclineBanner = document.getElementById("registerDeclineBanner");
 
       registerButton.addEventListener("click", (event) => {
         event.preventDefault();
@@ -155,10 +159,25 @@ <h1 class="title">Start your <br> journey now</h1>
             alert('Name Or Password Cannot Contain <,>,", or /');
             return;
           }
+
+          if(localStorage.getItem("email")===email){
+            registerDeclineBanner.style.display = "block";
+            setTimeout(() => {
+              registerDeclineBanner.style.display = "none";
+            }, 6000);
+          }
+
+          localStorage.setItem("name", name)
+          localStorage.setItem("email", email)
+          localStorage.setItem("password", password)
+
           // Show register success banner
           registerSuccessBanner.style.display = "block";
           setTimeout(() => {
             registerSuccessBanner.style.display = "none";
+            document.getElementById("registerName").value = "";
+            document.getElementById("registerEmail").value = "";
+            document.getElementById("registerPassword").value = "";
           }, 3000);
         } else {
           email = document.getElementById("loginEmail").value;
@@ -175,11 +194,23 @@ <h1 class="title">Start your <br> journey now</h1>
             alert('Password cannot contain <,>,", or /');
             return;
           }
-          // Show login success banner
-          loginSuccessBanner.style.display = "block";
-          setTimeout(() => {
-            loginSuccessBanner.style.display = "none";
-          }, 3000);
+          const email_check = localStorage.getItem("email")
+          const password_check = localStorage.getItem("password")
+
+          if (email_check === email && password_check=== password){
+            // Show login success banner
+            loginSuccessBanner.style.display = "block";
+            setTimeout(() => {
+              loginSuccessBanner.style.display = "none";
+            }, 3000);
+            document.getElementById("loginEmail").value = "";
+            document.getElementById("loginPassword").value = "";
+          }else{
+            loginDeclineBanner.style.display = "block";
+            setTimeout(() => {
+              loginDeclineBanner.style.display = "none";
+            }, 3000);
+          }
         }
       }
 
diff --git a/payment.css b/payment.css
index 9a9f1dd0..a55560a5 100644
--- a/payment.css
+++ b/payment.css
@@ -362,4 +362,73 @@ header {
 
 .hr:hover{
   color: whitesmoke;
+}
+/* Light mode styles (default) */
+body {
+  background-color: #f8f9fa;
+  color: #212529;
+}
+
+.nav-container {
+  background-color: #ffffff;
+}
+
+.footer {
+  background-color: #ffffff;
+  color: #212529;
+}
+
+/* Dark mode styles */
+body.dark-mode {
+  background-color: #002152;
+  color: #ffffff;
+}
+
+body.dark-mode .nav-container {
+  background-color: #343a40;
+}
+
+body.dark-mode .footer {
+  background-color: #343a40;
+  color: #ffffff;
+}
+
+/* Toggle button styles */
+.toggle-container {
+  position: fixed; /* Change this as needed for positioning */
+  top: 10px;
+  right: 10px;
+}
+
+.toggle {
+  width: 50px; /* Adjust size as needed */
+  height: 25px; /* Adjust size as needed */
+  appearance: none;
+  background-color: #ccc;
+  cursor: pointer;
+  border-radius: 25px;
+  position: relative;
+  outline: none;
+}
+
+.toggle:checked {
+  background-color: #333;
+}
+.toggle:checked:before {
+  transform: translateX(25px);
+}
+
+.text-center h2{
+  background: linear-gradient(120deg, #1c99fe 20.69%, #7644ff 50.19%, #fd4766 79.69%);
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  display: inline-block;
+  font-weight: 600;
+}
+body.dark-mode #inst{
+  background: black;
+}
+.newNav #btn-style{
+  background-color: var(--btn-border) !important;
+  border: 2px solid var(--btn-border) !important;
 }
\ No newline at end of file
diff --git a/payment.html b/payment.html
index 0990def0..38d31b1b 100644
--- a/payment.html
+++ b/payment.html
@@ -25,6 +25,9 @@
         <div class="line"></div>
         <div class="line"></div>
       </div>
+      <div class="toggle-container aos-init aos-animate" data-aos="fade-down">
+        <input id="themeToggle" class="toggle" type="checkbox">
+      </div>
     </nav>
   </div>
 
@@ -39,7 +42,7 @@ <h2 style="text-decoration: underline ;" >Guide</h2>
         
       <div class="py-4 text-left">
 
-        <div style="border:2px solid #a1a1a1; padding: 2rem;">
+        <div id="inst" style="border:2px solid #a1a1a1; padding: 2rem;border-radius: 12px;">
           <p >Before you proceed to checkout, here are some instructions : </p>
           <ul class="connected list no2">
             <li>Fill in the required fields with your personal details (name, email, username etc.)</li>
diff --git a/payment.js b/payment.js
index b461ab7f..269ad099 100644
--- a/payment.js
+++ b/payment.js
@@ -218,4 +218,29 @@ document.addEventListener("DOMContentLoaded", function () {
   
     updateShippingCost();
   });
+//   adding dark mode feature
+  // payment.js or add in a <script> tag at the end of the body
+document.addEventListener('DOMContentLoaded', () => {
+    const toggleCheckbox = document.getElementById('themeToggle');
+    const body = document.body;
+  
+    // Load saved dark mode preference from localStorage
+    if (localStorage.getItem('dark-mode') === 'enabled') {
+      body.classList.add('dark-mode');
+      toggleCheckbox.checked = true;
+    } else {
+      toggleCheckbox.checked = false;
+    }
+  
+    toggleCheckbox.addEventListener('change', () => {
+      if (toggleCheckbox.checked) {
+        body.classList.add('dark-mode');
+        localStorage.setItem('dark-mode', 'enabled');
+      } else {
+        body.classList.remove('dark-mode');
+        localStorage.setItem('dark-mode', 'disabled');
+      }
+    });
+  });
+  
   
\ No newline at end of file
diff --git a/pricing/index.html b/pricing/index.html
index 2c4f9ac6..1f5bc0d3 100644
--- a/pricing/index.html
+++ b/pricing/index.html
@@ -208,6 +208,26 @@
             list.classList.toggle('activeHamburger');
           })
         </script>
+        <script>
+          document.addEventListener('DOMContentLoaded', () => {
+    const themeToggle = document.getElementById('themeToggle');
+
+    // Check for saved theme in localStorage
+    if (localStorage.getItem('theme') === 'dark') {
+        document.body.classList.add('dark-mode');
+        themeToggle.checked = true;
+    }
+
+    themeToggle.addEventListener('change', () => {
+        if (themeToggle.checked) {
+            document.body.classList.add('dark-mode');
+            localStorage.setItem('theme', 'dark');
+        } else {
+            document.body.classList.remove('dark-mode');
+            localStorage.setItem('theme', 'light');
+        }
+    });
+});
   </script>
 
 </body>
diff --git a/pricing/style.css b/pricing/style.css
index 819c0374..e56ac595 100644
--- a/pricing/style.css
+++ b/pricing/style.css
@@ -224,9 +224,8 @@ header {
   padding-top: 12px;
   padding-bottom: 12px;
   width: auto;
-  background-color: transparent;
-  border: 2px solid slateblue;
-  color: red;
+  background-color: #6a5acd;
+  color:white;
   font-weight: 500;
   font-size: 14px;
   letter-spacing: 2px;
@@ -555,4 +554,77 @@ header img {
     
   }
   
+}
+.dark-theme {
+  --secondary-color: #0e1525;
+  --text-dark: #ffffff;
+  --arr-light: white;
+  --body-light: #0e1525;
+  --img-color: red;
+  --head-text: red;
+  --btn-border: red;
+  --btn-color: #fdbb2dbf;
+  --footer-text-color: #ffffff;
+}
+.dark-mode{
+  --secondary-color: #0e1525;
+  --btn-border: red;
+}
+/* Dark Mode Styles */
+body.dark-mode {
+  background-color:#002152;
+  color: #ffffff;
+}
+
+body.dark-mode .nav-container {
+  background-color: #1e1e1e;
+}
+
+body.dark-mode .navLinks li a {
+  color: #ffffff;
+}
+
+body.dark-mode .btn {
+  background-color: red;
+  color: #ffffff;
+}
+
+body.dark-mode .wrapper .table {
+  background-color: #1e1e1e;
+  border: 1px solid #444444;
+}
+
+body.dark-mode .wrapper .table .price-section {
+  background-color: #2e2e2e;
+}
+
+body.dark-mode .wrapper .table .purchase-btn button {
+  background-color: #333333;
+  color: #ffffff;
+}
+
+/* Additional styles */
+.hamburger .line {
+  background-color: #000000;
+}
+
+body.dark-mode .hamburger .line {
+  background-color: #ffffff;
+}
+body.dark-mode .table .package-name::before{
+  background: #1e1e1e;
+}
+body.dark-mode .wrapper .table {
+  background-color: black;
+  border: 1px solid black;
+  box-shadow: 0 4px 8px rgba(255, 255, 255, 0.2);
+}
+
+body.dark-mode .wrapper .table .price-section {
+  background-color: black;
+}
+
+body.dark-mode .wrapper .table .purchase-btn button {
+  background-color: #333333;
+  color: #ffffff;
 }
\ No newline at end of file
diff --git a/privacy.html b/privacy.html
index 59878a4b..30045353 100644
--- a/privacy.html
+++ b/privacy.html
@@ -1,5 +1,6 @@
+<!DOCTYPE html>
 <html lang="en">
-  <head>
+<head>
     <meta charset="utf-8">
     <meta http-equiv="x-ua-compatible" content="ie=edge">
     <title>Privacy Policy</title>
@@ -7,178 +8,229 @@
     <meta content="width=device-width, initial-scale=1" name="viewport">
     <link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
 
-    <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css?family=Poppins:400,700|ABeeZee" rel="stylesheet">
 
     <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
 
     <link href="./tnc.css" rel="stylesheet" type="text/css" />
 
-<style>
-  .circle {
-      position: absolute;
-      width: 25px;
-      height: 25px;
-      border-radius: 50%;
-      pointer-events: none;
-      background: radial-gradient(circle, rgba(71, 240, 255, 0.3), rgba(0, 119, 255, 0.3));
-      transition: transform 0.1s, left 0.1s, top 0.1s;
-    }
-
-    .circle-container {
-      position: fixed;
-      top: 0;
-      left: 0;
-      width: 100%;
-      height: 100%;
-      pointer-events: none;
-      z-index: 9999;
-    }
-
-    @media screen and (max-width: 768px){
-      .circle-container {
-        display: none;
-      }
-
-    }
-
-</style>
-   
-  </head>
-
-  <body id="terms-and-conditions">
+    <style>
+        body {
+            color: #333;
+            background-color: #f8f9fa;
+            padding-top: 20px;
+        }
+        .title {
+            font-family: 'Verdana', sans-serif !important;
+            font-size: 2.5rem;
+            font-weight: bold;
+            margin-bottom: 20px;
+            color: #639ace !important;
+        }
+        .section-title {
+            font-family: 'ABeeZee', sans-serif;
+            font-size: 1.75rem;
+            font-weight: bold;
+            margin-top: 20px;
+            color: #007bff;
+            text-decoration: underline;
+        }
+        .content p {
+            font-family: 'Verdana',sans-serif;
+            font-size: 1rem;
+            line-height: 1.6;
+            margin-bottom: 15px;
+        }
+        .video-background {
+            position: fixed;
+            right: 0;
+            bottom: 0;
+            min-width: 100%;
+            min-height: 100%;
+            z-index: -1;
+        }
+        .container-fluid {
+          margin: 0 auto;
+            background: transparent;
+            padding: 20px;
+            border-radius: 10px;
+            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+        }
+        .circle-container {
+            position: fixed;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            pointer-events: none;
+            z-index: 9999;
+        }
+        .circle {
+            position: absolute;
+            width: 25px;
+            height: 25px;
+            border-radius: 50%;
+            pointer-events: none;
+            background: radial-gradient(circle, rgba(71, 240, 255, 0.3), rgba(0, 119, 255, 0.3));
+            transition: transform 0.1s, left 0.1s, top 0.1s;
+        }
+        .copyright-footer {
+            text-align: center;
+            padding: 30px;
+            background-color: rgba(55, 99, 147, 0.9) ;
+            color: #fff;
+            margin-top: 20px;
+            border-radius: 6px;
+            font-family: 'Poppins', sans-serif;
+            font-style: italic;
+            opacity: 0.6;
+            font-size: 1.5rem;
+            position: relative;
+        }
+        .copyright-footer::before {
+            content: '';
+            position: absolute;
+            top: -10px;
+            left: 50%;
+            transform: translateX(-50%);
+            width: 50px;
+            height: 4px;
+            background-color: #fff;
+            border-radius: 2px;
+        }
+        @media screen and (max-width: 768px) {
+            .circle-container {
+                display: none;
+            }
+            .title {
+                font-size: 2rem;
+            }
+            .section-title {
+                font-size: 1.5rem;
+            }
+        }
+    </style>
+</head>
+<body id="terms-and-conditions">
     <div class="circle-container">
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
-      <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
+        <div class="circle"></div>
     </div>
     <script>
-      document.addEventListener("DOMContentLoaded", function () {
-        const coords = { x: 0, y: 0 };
-        const circles = document.querySelectorAll(".circle");
+        document.addEventListener("DOMContentLoaded", function () {
+            const coords = { x: 0, y: 0 };
+            const circles = document.querySelectorAll(".circle");
 
-        circles.forEach(function (circle) {
-          circle.x = 0;
-          circle.y = 0;
-        });
+            circles.forEach(function (circle) {
+                circle.x = 0;
+                circle.y = 0;
+            });
 
-        window.addEventListener("mousemove", function (e) {
-          coords.x = e.pageX;
-          coords.y = e.pageY - window.scrollY; // Adjust for vertical scroll position
-        });
+            window.addEventListener("mousemove", function (e) {
+                coords.x = e.pageX;
+                coords.y = e.pageY - window.scrollY; // Adjust for vertical scroll position
+            });
 
-        function animateCircles() {
-          let x = coords.x;
-          let y = coords.y;
+            function animateCircles() {
+                let x = coords.x;
+                let y = coords.y;
 
-          circles.forEach(function (circle, index) {
-            circle.style.left = `${x - 12}px`;
-            circle.style.top = `${y - 12}px`;
-            circle.style.transform = `scale(${(circles.length - index) / circles.length})`;
+                circles.forEach(function (circle, index) {
+                    circle.style.left = `${x - 12}px`;
+                    circle.style.top = `${y - 12}px`;
+                    circle.style.transform = `scale(${(circles.length - index) / circles.length})`;
 
-            const nextCircle = circles[index + 1] || circles[0];
-            circle.x = x;
-            circle.y = y;
+                    const nextCircle = circles[index + 1] || circles[0];
+                    circle.x = x;
+                    circle.y = y;
 
-            x += (nextCircle.x - x) * 0.3;
-            y += (nextCircle.y - y) * 0.3;
-          });
+                    x += (nextCircle.x - x) * 0.3;
+                    y += (nextCircle.y - y) * 0.3;
+                });
 
-          requestAnimationFrame(animateCircles);
-        }
-
-        animateCircles();
-      });
+                requestAnimationFrame(animateCircles);
+            }
 
+            animateCircles();
+        });
     </script>
-    
     <video autoplay muted loop class="video-background">
-      <source src="/img/bg video terms.mp4" type="video/mp4">
-       the video tag.
-  </video>
+        <source src="./img/bg video terms.mp4" type="video/mp4">
+        Your browser does not support the video tag.
+    </video>
     <a href="index.html"><img src="./img/Screenshot 2024-01-23 003448.png" style="width: 130px; border-radius: 6px; margin-top: 20px; margin-left: 20px;"></a>
-
     <div class="container-fluid">
-      <div class="row terms-and-conditions-section">
-        <div class="col-xs-12 text-center">
-          <h1 class="title">Privacy Policy</h1>
+        <div class="row terms-and-conditions-section">
+            <div class="col-xs-12 text-center">
+                <h1 class="title">Privacy Policy</h1>
+            </div>
+            <div class="col-xs-12 col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2">
+                <div class="content">
+                    <p>
+                        Tourguide, LLC ("Tourguide") built the Tourguide Platform as a Commercial service. This SERVICE is provided by Tourguide and is intended for use as is.
+                        This page is used to inform visitors regarding Tourguide's policies with the collection, use, and disclosure of Personal Information if anyone decides to use the Tourguide Platform.
+                        If you choose to use the Tourguide Platform, then you agree to the collection and use of information in relation to this policy. The Personal Information that Tourguide collects is used for providing and improving the Service. Tourguide will not use or share your information with anyone except as described in this Privacy Policy.
+                        The terms used in this Privacy Policy have the same meanings as in our Terms and Conditions, which is accessible at Tourguide Platform unless otherwise defined in this Privacy Policy.
+                    </p>
+                    <h2 class="section-title">Information Collection and Use</h2>
+                    <p>
+                        For a better experience while using Tourguide Platform, Tourguide may require you to provide certain personally identifiable information. The information requested will be retained on your device and is not collected by Tourguide in any way.
+                        The Tourguide Platform may use third-party services that collect information used to identify you.
+                    </p>
+                    <h2 class="section-title">Log Data</h2>
+                    <p>
+                        Tourguide wants to inform you that whenever you use the Tourguide Platform, in the case of an error in the platform, data and information (through third-party products) may be collected on your device called Log Data. This Log Data may include information such as your device Internet Protocol (“IP”) address, device name, operating system version, the configuration of the app when utilizing the Service, the time and date of your use of the Service, and other statistics.
+                    </p>
+                    <h2 class="section-title">Cookies</h2>
+                    <p>
+                        Cookies are files with a small amount of data that are commonly used as anonymous unique identifiers. They are sent to your browser from the websites you visit and are stored on your device's internal memory.
+                        The Tourguide Platform does not use these “cookies”
+                    </p>
+                    <h2 class="section-title">Security</h2>
+                    <p>
+                        Tourguide values the trust placed in providing Personal Information and strives to use commercially acceptable means to protect it. While efforts are made to ensure the security of the information, it's important to note that no method of transmission over the internet or electronic storage is 100% secure and reliable. Tourguide cannot guarantee the absolute security of Personal Information.
+                    </p>
+                    <h2 class="section-title">Changes to This Privacy Policy</h2>
+                    <p>
+                        Tourguide may update its Privacy Policy from time to time. Users are advised to review this page periodically for any changes. Notification of changes will be provided by posting the new Privacy Policy on this page, and these changes will be effective immediately after they are posted.
+                    </p>
+                </div>
+            </div>
         </div>
-
-        <div class="col-xs-12 col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2">
-          <div class="content">
-            <p>
-                Tourguide, LLC ("Tourguide") built the Tourguide Platform as a Commercial service. This SERVICE is provided by Tourguide and is intended for use as is.
-
-                This page is used to inform visitors regarding Tourguide's policies with the collection, use, and disclosure of Personal Information if anyone decides to use the Tourguide Platform.
-                
-                If you choose to use the Tourguide Platform, then you agree to the collection and use of information in relation to this policy. The Personal Information that Tourguide collects is used for providing and improving the Service. Tourguide will not use or share your information with anyone except as described in this Privacy Policy.
-                
-                The terms used in this Privacy Policy have the same meanings as in our Terms and Conditions, which is accessible at Tourguide Platform unless otherwise defined in this Privacy Policy.
-            </p>
-
-            <h2 class="section-title">Information Collection and Use</h2>
-            <p>
-                For a better experience while using Tourguide Platform, Tourguide may require you to provide certain personally identifiable information. The information requested will be retained on your device and is not collected by Tourguide in any way.
-
-The Tourguide Platform may use third-party services that collect information used to identify you.
-
-            </p>
-
-            <h2 class="section-title">Log Data</h2>
-            <p>
-                Tourguide wants to inform you that whenever you use the Tourguide Platform, in the case of an error in the platform, data and information (through third-party products) may be collected on your device called Log Data. This Log Data may include information such as your device Internet Protocol (“IP”) address, device name, operating system version, the configuration of the app when utilizing the Service, the time and date of your use of the Service, and other statistics.    
-            </p>
-           
-
-            <h2 class="section-title">Cookies</h2>
-            <p>
-                Cookies are files with a small amount of data that are commonly used as anonymous unique identifiers. They are sent to your browser from the websites you visit and are stored on your device's internal memory.
-
-                The Tourguide Platform does not use these “cookies”    
-            </p>
-            
-            <h2 class="section-title">Security</h2>
-            <p>
-                Tourguide values the trust placed in providing Personal Information and strives to use commercially acceptable means to protect it. While efforts are made to ensure the security of the information, it's important to note that no method of transmission over the internet or electronic storage is 100% secure and reliable. Tourguide cannot guarantee the absolute security of Personal Information.</p>
-            <h2 class="section-title">Changes to This Privacy Policy</h2>
-            <p>
-                Tourguide may update its Privacy Policy from time to time. Users are advised to review this page periodically for any changes. Notification of changes will be provided by posting the new Privacy Policy on this page, and these changes will be effective immediately after they are posted.</p>
-            
-
-            
-          </div>
-        </div>
-      </div>
     </div>
-    <div>
-      <div  class="copyright-footer"> Copyright &copy;<span id="year"></span> </span> Arpan Chowdhury. All rights reserved. </div>
-     </div>
-    
-  </body>
-</html>
\ No newline at end of file
+    <div class="copyright-footer">
+        Copyright &copy; <span id="year"></span> Arpan Chowdhury. All rights reserved.
+    </div>
+    <script>
+        document.getElementById('year').textContent = new Date().getFullYear();
+    </script>
+</body>
+</html>
diff --git a/styles.css b/styles.css
index d5530304..c93c7ce0 100644
--- a/styles.css
+++ b/styles.css
@@ -238,6 +238,27 @@
   }
 }
 */
+#google_translate_element {
+  transform: scale(1); /* Increase the size of the select language bar and Google icon */
+  transform-origin: top left; /* Adjust the origin to make the scaling look better */
+}
+
+/* Target the Google icon within the Google Translate element */
+#google_translate_element img {
+  height: 35px; /* Increase the height of the Google icon */
+}
+
+#google_translate_element .goog-te-gadget-simple {
+  padding: 0.5em 0.5em 0.5em 0.5em !important;
+  font-size: 18px !important;
+  border-color: #f2f2f2 !important;
+  border-width: 1px !important;
+  border-style: solid !important;
+  display: inline-block;
+  white-space: nowrap;
+  border-radius: 5px;
+}
+
 
 .footer__link {
   position: relative;
@@ -531,7 +552,8 @@ img {
   display: block;
 }
 .sitelogo{
-  width: 8%;
+  width: 10%;
+  height:10%;
 }
 
 body {
@@ -577,12 +599,12 @@ nav {
 
 link a:hover {
   color: #60a5fa; 
-  background-color:red;
+  background-color: rgb(169, 35, 252);
 }
 
 .navLinks a:hover{
   /* text-decoration: underline; */
-  color: red;
+  color:  rgb(169, 35, 252);
 }
 
 .home {
@@ -1258,15 +1280,17 @@ body, html {
 
 .footer__container {
   width: 100%;
+  /* max-width: 1800px; */
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   align-items: flex-start;
+  justify-content: space-between;
   grid-template-columns: repeat(3, 1fr);
   gap: 20px;
   color: var(--secondary-color);
   margin: 0;
-    padding: 0;
+  padding: 0;
 }
 
 .footer__col {
@@ -2047,6 +2071,7 @@ body {
   position: fixed;
   left: 0;
   z-index: 9999;
+
 }
 
 .newNav {
@@ -2056,7 +2081,23 @@ body {
   gap: 0.5rem;
   height: auto;
   width: 100%;
-  padding: 0rem 2rem;
+  padding: 0.4rem 0.5rem;
+  z-index: 10000;
+  transition: all 0.6s;
+}
+/* navbar sticky css  */
+.sticky{
+  /* margin: 10px 5px; */
+  border-radius: 10px;
+  margin-top: 0.5rem;
+  background: linear-gradient(#002152, #271050);
+  scale:0.99;
+  
+  /* padding: 0rem 1rem;
+  margin-top: 0.5rem;
+  margin-left:0.5rem;
+  margin-right: 0.5rem;
+  width: 99%; */
 }
 
 .navLinks {
@@ -2079,11 +2120,15 @@ body {
   display: block;
   color: white;
   text-align: center;
-  padding: 14px 20px;
+  padding: 12px 20px;
   text-decoration: none;
+  width: 100%;
+  transition: all 0.3s linear;
 }
 .link > a:hover {
-  background-color: #575757;
+  background-color: #f6ddff;
+  border-radius: 10px;
+  box-shadow: rgb(56, 0, 109) 0px 0px 8px 2px inset;
 }
 .dropdown-menu {
   display: none;
@@ -2236,7 +2281,7 @@ body {
     width: 100%;
   } */
 .navLinks:active {
-  color: red;
+  color: rgb(169, 35, 252);
 }
 
 .navLinks.activeHamburger {
@@ -2312,6 +2357,16 @@ body {
   .newNav img{
     position: relative;
   }
+  .header__image img:nth-child(1) {
+      transform: translate(0, 0%) !important;
+  }
+  .section__subtitle {
+    max-width: 100vw !important;
+    margin-left: 0 !important;
+  }
+  .testimonials {
+    padding: 0px 10px;
+  }
 }
 
 /* Move View from Hamburger to newNav */