diff --git a/.github/workflows/label-issues.yaml b/.github/workflows/label-issues.yaml
new file mode 100644
index 00000000..4284f4cb
--- /dev/null
+++ b/.github/workflows/label-issues.yaml
@@ -0,0 +1,30 @@
+name: Label Issues Based on Template
+
+on:
+  issues:
+    types: [opened, edited]
+
+jobs:
+  label-issues:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Check if issue needs a label
+        id: check_label
+        run: |
+          echo "Checking labels for issue #${{ github.event.issue.number }}"
+
+          if [[ "${{ github.event.issue.body }}" == *"I'm a GSSOC'24 contributor"* ]]; then
+            echo "::set-output name=label::gssoc"
+          elif [[ "${{ github.event.issue.body }}" == *"I'm a VSOC'24 contributor"* ]]; then
+            echo "::set-output name=label::VSoC'24"
+          else
+            echo "::set-output name=label::"
+          fi
+
+      - name: Apply Label
+        if: steps.check_label.outputs.label != ''
+        uses: actions-ecosystem/action-add-labels@v1
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          labels: ${{ steps.check_label.outputs.label }}
diff --git a/Untitled (1).mp4 b/Untitled (1).mp4
new file mode 100644
index 00000000..a9f4b9dc
Binary files /dev/null and b/Untitled (1).mp4 differ
diff --git a/explore.css b/explore.css
index e97aeafd..646224f1 100644
--- a/explore.css
+++ b/explore.css
@@ -1,119 +1,123 @@
 * {
-    box-sizing: border-box;
-    /* ADDED BORDER RADIUS IN IMAGE SECTION */
-    border-radius: 20px;
-  }
-  
-  .outer-box {
-    font-family: Verdana, Geneva, Tahoma, sans-serif;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 100vh;
-    overflow: hidden;
-    margin: 0;
-    
-  }
+  box-sizing: border-box;
+  /* ADDED BORDER RADIUS IN IMAGE SECTION */
+  border-radius: 20px;
+}
+
+.outer-box {
+  font-family: Verdana, Geneva, Tahoma, sans-serif;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100vh;
+  overflow: hidden;
+  margin: 0;
+}
+
+.containers {
+  display: flex;
+  width: 90vw;
   
+}
+
+.card {
+  background-size: cover;
+  background-position: center;
+  background-repeat: no-repeat;
+  height: 70vh;
+  border-radius: 35px 35px;
+  /* border-radius: 20px; */
+  color: #fff;
+  cursor: pointer;
+  flex: 0.5;
+  margin: 10px;
+  position: relative;
+  transition: flex 0.7s ease-in;
+  display: flex;
+  flex-direction: column; 
+}
+
+/* .card:hover {
+    flex: 3;
+}
+
+.card:hover h3, .card:hover p {
+    opacity: 1;
+    transition: opacity 0.5s ease-in 0.8s;
+}
+
+.card:hover .info {
+    visibility: visible;
+} */
+
+.info {
+  position: absolute;
+  bottom: 20px;
+  left: 25%;
+  visibility: hidden;
+  background: rgba(221, 206, 216, 0.462);
+  backdrop-filter:blur(0px);
+  width: 500px;
+  border-radius: 15px 15px;
+}
+
+.card h3 {
+  font-size: 24px;
+  opacity: 0;
+  color: black !important;
+  font-family:Georgia, 'Times New Roman', Times, serif ;
+  font-weight: bolder;
+  -webkit-text-stroke:1px navy;
+}
+
+.card p {
+  font-size: 16px;
+  opacity: 0;
+  color:black !important;
+  margin-top: 10px;
+  font-weight: 500;
+  /* -webkit-text-stroke:0.5px beige; */
+}
+
+.card.active {
+  flex: 3;
+}
+
+.card.active h3, .card.active p {
+  opacity: 1;
+  transition: opacity 0.5s ease-in 0.8s;
+}
+
+.card.active .info {
+  visibility: visible;
+}
+
+@media (max-width: 1300px) {
   .containers {
-    display: flex;
-    width: 90vw;
-    
-  }
-  
-  .card {
-    background-size: cover;
-    background-position: center;
-    background-repeat: no-repeat;
-    height: 70vh;
-    border-radius: 35px 35px;
-    /* border-radius: 20px; */
-    color: #fff;
-    cursor: pointer;
-    flex: 0.5;
-    margin: 10px;
-    position: relative;
-    transition: flex 0.7s ease-in;
     display: flex;
     flex-direction: column;
+    height: 100vh;
   }
-  
-  .info {
-    position: absolute;
-    bottom: 20px;
-    left: 25%;
-    visibility: hidden;
-    background: rgba(221, 206, 216, 0.462);
-    backdrop-filter:blur(0px);
-    width: 500px;
-    border-radius: 15px 15px;
+  .info{
+    left: 10%;
   }
-  
   .card h3 {
-    font-size: 24px;
-    opacity: 0;
-    color: black !important;
-    font-family:Georgia, 'Times New Roman', Times, serif ;
-    font-weight: bolder;
-    -webkit-text-stroke:1px navy;
-  }
-  
-  .card p {
     font-size: 16px;
-    opacity: 0;
-    color:black !important;
-    margin-top: 10px;
-    font-weight: 500;
-    /* -webkit-text-stroke:0.5px beige; */
   }
-  
-  .card.active {
-    flex: 3;
-  }
-  
-  .card.active h3 {
-    opacity: 1;
-    transition: opacity 0.5s ease-in 0.8s;
-  }
-  
-  .card.active p {
-    opacity: 1;
-    transition: opacity 0.5s ease-in 0.8s;
-  }
-  
-  .card.active .info {
-    visibility: visible;
-  }
-  .hedd{
-    font-size: 25px;
-  }
-  @media (max-width: 1300px) {
-    .containers {
-      display: flex;
-      flex-direction: column;
-      height: 100vh;
-    }
-    .info{
-      left: 10%;
-    }
-    .card h3 {
-      font-size: 16px;
-    }
-  
-    .card p {
-      font-size: 12px;
-    }
+
+  .card p {
+    font-size: 12px;
   }
-  @media (max-width: 620px){
-    .info{
-      width: 200px;
-      left: 20px;
-    }
+}
+@media (max-width: 620px){
+  .info{
+    width: 200px;
+    left: 20px;
   }
-  @media (max-width: 280px){
-    .info{
-      width: 100px;
-      left: 0px;
-    }
+}
+@media (max-width: 280px){
+  .info{
+    width: 100px;
+    left: 0px;
   }
-  
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/explore.js b/explore.js
index 09512a4c..97a2d9db 100644
--- a/explore.js
+++ b/explore.js
@@ -1,14 +1,28 @@
+let lastClickedCard = document.querySelector(".active");
+
+// Function to handle click events
+function handleClick(card) {
+  // Remove active classes from all cards
+  const panels = document.querySelectorAll(".card");
+  panels.forEach(panel => panel.classList.remove("active"));
+
+  // Add active class to the clicked card
+  card.classList.add("active");
+  lastClickedCard = card; // Update the reference to the last clicked card
+}
+
+// Attach click event listener to all cards
 const panels = document.querySelectorAll(".card");
+panels.forEach(panel => panel.addEventListener("click", () => handleClick(panel)));
 
-panels.forEach((card) => {
-  card.addEventListener("click", () => {
-    removeActiveClasses(); // Add fuctions to remove active class first
-    card.classList.add("active");
+// Adjust the mouseover event listener
+panels.forEach(panel => {
+  panel.addEventListener('mouseover', () => {
+      lastClickedCard.classList.remove("active");
+      panel.classList.add('active');
   });
+  panel.addEventListener('mouseout', () => {
+    panel.classList.remove('active');
+    lastClickedCard.classList.add("active");
+});
 });
-
-function removeActiveClasses() {
-  panels.forEach((card) => {
-    card.classList.remove("active");
-  });
-}
diff --git a/faq-website.css b/faq-website.css
index a0cf1449..ff45a771 100644
--- a/faq-website.css
+++ b/faq-website.css
@@ -232,11 +232,16 @@
     color: white;
     background-color: rgb(40, 87, 241);
   }
-  
-  
-  
-  
-  
+  @media only screen and (max-width:465px){
+    .newNav img{
+      position: relative;
+      right: 14px;
+    }
+    .nav__logo{
+      position: relative;
+      right: 16px;
+    }
+  }
   
   
   
diff --git a/faq-website.js b/faq-website.js
index 760971bb..dc12dac0 100644
--- a/faq-website.js
+++ b/faq-website.js
@@ -1,4 +1,3 @@
-
 const accordions = document.querySelectorAll(".accordion");
 
 accordions.forEach((accordion, index) => {
@@ -19,3 +18,68 @@ accordions.forEach((accordion, index) => {
     });
   });
 });
+
+document.addEventListener("DOMContentLoaded", function () {
+  // Highlight active navbar
+  const navLinks = document.querySelectorAll(".navLinks a");
+
+  function highlightNavLink() {
+    const scrollPosition = window.scrollY;
+
+    navLinks.forEach((link) => {
+      const sectionId = link.getAttribute("href").substring(1);
+      const section = document.getElementById(sectionId);
+
+      // Adjust this value to control when the link should be highlighted
+      const offsetPercentage = 20;
+
+      if (
+        section.offsetTop - window.innerHeight * (offsetPercentage / 100) <=
+          scrollPosition &&
+        section.offsetTop + section.offsetHeight > scrollPosition
+      ) {
+        link.classList.add("active");
+      } else {
+        link.classList.remove("active");
+      }
+    });
+  }
+
+  document.addEventListener("scroll", highlightNavLink);
+  window.addEventListener("resize", highlightNavLink);
+
+  // Initialize AOS library
+  AOS.init();
+
+  // Set animation delays for FAQs
+  const faqs = document.querySelectorAll(".faq");
+  faqs.forEach((faq, index) => {
+    faq.style.animationDelay = `${index * 0.2}s`;
+  });
+});
+
+// Logout Button
+document.addEventListener("DOMContentLoaded", function () {
+  var isLoggedIn = localStorage.getItem("isLoggedIn");
+  var loginButton = document.getElementById("btn-style");
+  var logoutButton = document.getElementById("logout-btn");
+
+  if (isLoggedIn === "true") {
+    loginButton.style.display = "none";
+    logoutButton.style.display = "block";
+    loginButton.disabled = true;
+    logoutButton.disabled = false;
+    logoutButton.style.cursor = "pointer";
+    logoutButton.addEventListener("click", function () {
+      localStorage.setItem("isLoggedIn", "false");
+      window.location.href = "./index.html";
+    });
+  } else {
+    loginButton.style.display = "block";
+    logoutButton.disabled = true;
+  }
+});
+
+function sendEmail() {
+  window.location.href = "mailto:arpanchowdhury003@gmail.com";
+}
diff --git a/faq.css b/faq.css
new file mode 100644
index 00000000..efc4b90e
--- /dev/null
+++ b/faq.css
@@ -0,0 +1,228 @@
+@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;800&display=swap");
+
+* {
+  box-sizing: border-box;
+  border-radius: 20px;
+}
+
+:root {
+  --color-primary: #ffd54b;
+  --color-text: #545d7a;
+  --color-white: #fff;
+  --color-title: #242e4c;
+  --color-background: #f7f8fb;
+  --color-border: #dae1f5;
+  --transition: 0.4s ease-in-out;
+  --shadow: 0px 60px 56px -12px rgba(9, 40, 163, 0.05);
+}
+
+body {
+  font-family: "Poppins", sans-serif;
+  color: var(--color-text);
+  font-size: 16px;
+  font-weight: 400;
+  margin: 0;
+  padding: 0;
+}
+
+/* .container {
+  width: 100% !important;
+  margin: auto;
+  min-height: 100vh;
+  padding: 2rem;
+  display: grid;
+  place-items: center;
+} */
+
+.faq-container {
+  margin: 0 auto;
+  max-width: 900px !important;
+  width: 80%;
+}
+
+.faq {
+  background-color: rgb(176, 196, 242, 0.3);
+  border: 1px solid #9a9afb;
+  color: black;
+  border-radius: 25px;
+  margin: 20px 0;
+  overflow: hidden;
+  padding: 30px;
+  position: relative;
+  transition: 0.3s ease;
+  cursor: pointer;
+  opacity: 0;
+  transform: translateX(-100%);
+  animation: slideInFromLeft 2s ease-in-out forwards; /* Animation duration is now 2 seconds */
+}
+
+.faq.active {
+  background: rgb(239, 239, 239);
+  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1), 0 3px 6px rgba(0, 0, 0, 0.1);
+}
+
+.faq.active::before,
+.faq.active::after {
+  color: #2ecc71;
+  content: "\f075";
+  font-family: "Poppins", sans-serif;
+  font-size: 7rem;
+  left: 20px;
+  opacity: 0.2;
+  position: absolute;
+  top: 20px;
+  z-index: 0;
+}
+
+.faq.active::before {
+  color: #3498db;
+  left: -30px;
+  top: -10px;
+  transform: rotateY(180deg);
+}
+
+.faq-title {
+  margin: 0 35px 0 0;
+  color: #3685fb;
+  transition: transform 0.3s ease;
+}
+
+.faq-title:hover {
+  transform: scale(1.1);
+}
+
+.faq-text {
+  margin: 30px 0 0;
+  color: black;
+}
+
+.faq-toggle {
+  align-items: center;
+  background: rgb(239, 239, 239);
+  border: 0;
+  border-radius: 50%;
+  cursor: pointer;
+  display: flex;
+  font-size: 1rem;
+  height: 30px;
+  justify-content: center;
+  padding: 0;
+  position: absolute;
+  right: 30px;
+  top: 10px; /* Moving toggle button to top to remove overlapping with faq-title  */
+  width: 30px;
+}
+
+.faq-toggle .fa-times,
+.faq.active .faq-toggle .fa-chevron-down {
+  display: none;
+}
+
+.accordion__wrapper {
+  background: url("https://img.freepik.com/free-photo/pouch-map-toy-airplane-blue-background-with-space-writing-text_23-2147958180.jpg")
+    no-repeat center center fixed;
+  background-size: cover;
+  box-shadow: var(--shadow);
+  border-radius: 10px;
+  width: 100%;
+  margin-top: 20px;
+  min-height: 100vh;
+  padding: 2rem;
+  display: grid;
+  place-items: center;
+  position: relative; /* Ensure position is relative for z-index to work */
+  z-index: 1; /* Ensure the FAQ wrapper is above the background image */
+}
+
+.accordion__title {
+  font-size: 25px;
+  font-weight: 800;
+  color: var(--color-title);
+  text-align: center;
+  margin-bottom: 4rem;
+}
+
+.accordion {
+  border-bottom: 0.1rem solid var(--color-border);
+  padding-bottom: 2rem;
+  margin-bottom: 3rem;
+  width: 100%;
+}
+
+.accordion__header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  gap: 1rem;
+  cursor: pointer;
+}
+
+.accordion__icon {
+  background-color: var(--color-primary);
+  width: 2.2rem;
+  height: 2.2rem;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: 50%;
+  color: var(--color-white);
+  flex-shrink: 0;
+}
+
+.accordion__question {
+  font-size: 18px;
+  font-weight: 700;
+  color: var(--color-title);
+  width: 100%;
+}
+
+.accordion__answer {
+  padding: 2rem 0;
+  font-size: 16px;
+}
+
+.accordion__content {
+  overflow: hidden;
+  height: 0;
+  transition: var(--transition);
+}
+
+@media screen and (min-width: 580px) {
+  .accordion__wrapper {
+    padding: 5rem 8rem;
+  }
+}
+
+.more {
+  padding: 50px;
+  background: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQ9dwjbQHiWY1sgKRxCurFvyI4pwTMM9L2AVQ&s")
+    no-repeat center center fixed;
+  background-size: cover;
+  margin: 10px auto;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+
+.more p {
+  color: grey;
+}
+
+.moreemail {
+  padding: 10px 20px;
+  font-size: 18px;
+  border-radius: 10px;
+  color: white;
+  background-color: rgb(40, 87, 241);
+}
+
+@keyframes slideInFromLeft {
+  0% {
+    opacity: 0;
+    transform: translateX(-100%);
+  }
+  100% {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
diff --git a/faq.html b/faq.html
index fb9db66d..3e179956 100644
--- a/faq.html
+++ b/faq.html
@@ -1,15 +1,11 @@
 <!DOCTYPE html>
-
-
-
-
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link rel="stylesheet" href="./loader.css">
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" />
-    <link rel="stylesheet" href="faq-website.css">
+    <link rel="stylesheet" href="faq.css">
     <link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet"
       integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
@@ -131,6 +127,25 @@
     justify-content: center;
     gap: 8px; /* Adjust the gap between buttons */
   }
+  .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;
+    }
     </style>
   <link rel="stylesheet" href="imstyle.css">
   <link rel="stylesheet" href="jquery.flipster.min.css">
@@ -141,6 +156,78 @@
   <body style="background-color: var(--secondary-color);">
   
     <body>
+
+      <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>
+      <script>
+        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;
+          });
+  
+          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;
+  
+            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;
+  
+              x += (nextCircle.x - x) * 0.3;
+              y += (nextCircle.y - y) * 0.3;
+            });
+  
+            requestAnimationFrame(animateCircles);
+          }
+  
+          animateCircles();
+        });
+  
+      </script>
   
       
       <div id="bg">
@@ -159,22 +246,22 @@
   
           <ul class="navLinks">
   
-            <li class="link" data-aos=""><a href="#Home">Home</a></li>
-            <li class="link" data-aos=""><a href="#AboutUs"> AboutUs</a></li>
-            <li class="link" data-aos=""><a href="#Destinations">Destinations</a></li>
-            <li class="link" data-aos=""><a href="#trip">Pricing</a></li>
-            <li class="link" data-aos=""><a href="#ReviewGallery">Trip Gallery</a></li>
-            <li class="link" data-aos=""><a href="#testimonials">Testimonials</a></li>
+            <li class="link" data-aos=""><a href="index.html#Home">Home</a></li>
+            <li class="link" data-aos=""><a href="index.html#AboutUs"> AboutUs</a></li>
+            <li class="link" data-aos=""><a href="index.html#Destinations">Destinations</a></li>
+            <li class="link" data-aos=""><a href="index.html#trip">Pricing</a></li>
+            <li class="link" data-aos=""><a href="index.html#ReviewGallery">Trip Gallery</a></li>
+            <li class="link" data-aos=""><a href="index.html#testimonials">Testimonials</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>
+            <li class="link" data-aos=""><a href="index.html#cnt-form">Contact Us</a></li>
   
   
           </ul>
   
   
-          <a href="newLogin.html" class="contact-btn"><button class="btn" id="btn-style" style="margin: 0;"
+          <a href="newLogin.html" class="contact-btn"><button class="btn but2" id="btn-style" style="margin: 0;"
               data-aos="fade-down">Login/SignUp</button></a>
-              <a href="mapa.html" class="contact-btn"><button class="btn" id="btn-style" style="margin: 0;"
+              <a href="mapa.html" class="contact-btn"><button class="btn but" 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" id="logout-btn" style="margin: 0; display: none;"
@@ -199,101 +286,85 @@
 
 
   <!-- --FAQ-- -->
-    <div class="container">
-        <div class="accordion__wrapper">
-            <h1 class="accordion__title">Frequently Asked Questions</h1>
-    
-            <!-- Accordion 1  -->
-            <div class="accordion">
-                <div class="accordion__header">
-                    <h2 class="accordion__question">How do I book my travel arrangements through your website?</h2>
-                    <span class="accordion__icon">
-                        <i id="accordion-icon" class="ri-add-line"></i>
-                    </span>
-                </div>
-                <div class="accordion__content">
-                    <p class="accordion__answer">Booking your travel with us is simple and convenient. 
-                      Start by entering your destination, travel dates, and other relevant details on our homepage. 
-                      Browse through the available options, including flights, hotels, and car rentals. Once you find 
-                      the perfect combination for your trip, follow the easy step-by-step process to confirm your booking. 
-                      If you encounter any issues or have questions during the booking process, our customer support team is
-                       available 24/7 to assist you.</p>
-                </div>
-            </div>
-    
-            <!-- Accordion 2  -->
-            <div class="accordion">
-                <div class="accordion__header">
-                    <h2 class="accordion__question">What measures are in place to ensure the safety of my personal information?</h2>
-                    <span class="accordion__icon">
-                        <i id="accordion-icon" class="ri-add-line"></i>
-                    </span>
-                </div>
-                <div class="accordion__content">
-                    <p class="accordion__answer"> We take the security of your personal information seriously. 
-                      Our website employs state-of-the-art encryption technology to safeguard your data during the booking process. 
-                      Additionally, we adhere to strict privacy policies and comply with industry standards to protect your information. 
-                      Rest assured that your details are used solely for the purpose of facilitating your travel arrangements, 
-                      and we do not share your information with third parties without your consent. 
-                      For more details, please refer to our Privacy Policy.</p>
-                </div>
-            </div>
-    
-            <!-- Accordion 3 -->
-            <div class="accordion">
-                <div class="accordion__header">
-                    <h2 class="accordion__question">Can I make changes to my booking or cancel it if needed?</h2>
-                    <span class="accordion__icon">
-                        <i id="accordion-icon" class="ri-add-line"></i>
-                    </span>
-                </div>
-                <div class="accordion__content">
-                    <p class="accordion__answer">Yes, we understand that plans can change. Depending on the terms and conditions 
-                      of your specific booking, you may be able to make modifications or cancel your reservation. 
-                      Log in to your account on our website, navigate to the "Manage Booking" section, and follow 
-                      the provided instructions. Keep in mind that there may be associated fees or restrictions depending 
-                      on the type of booking and the time of the requested changes. For further assistance, feel free to 
-                      contact our customer support team, and they will guide you through the process.</p>
-                </div>
-            </div>
-
-            <!-- Accordion 4 -->
-            <div class="accordion">
-                <div class="accordion__header">
-                    <h2 class="accordion__question">Will I get assistance while on travel?</h2>
-                    <span class="accordion__icon">
-                        <i id="accordion-icon" class="ri-add-line"></i>
-                    </span>
-                </div>
-                <div class="accordion__content">
-                    <p class="accordion__answer">Yes, We provide 24X7 support and customer assistance while we are serving you.</p>
-                </div>
-            </div>
-    
-            <!-- Accordion 5 -->
-            <div class="accordion">
-                <div class="accordion__header">
-                    <h2 class="accordion__question">Can I negotiate the prices?</h2>
-                    <span class="accordion__icon">
-                        <i id="accordion-icon" class="ri-add-line"></i>
-                    </span>
-                </div>
-                <div class="accordion__content">
-                    <p class="accordion__answer">Sure! If it's a customized trip, we can negotiate prices based on requirements. However, if on group tours or offers, we cannot negotiate the prices.</p>
-                </div>
-            </div>
+    <div class="accordion__wrapper">
+      <h1 class="accordion__title">Frequently Asked Questions</h1>
+  
+      <!-- Accordion 1 -->
+      <div class="accordion faq">
+        <div class="accordion__header">
+          <h2 class="accordion__question">How do I book my travel arrangements through your website?</h2>
+          <span class="accordion__icon">
+            <i id="accordion-icon" class="ri-add-line"></i>
+          </span>
         </div>
-    </div>
-
-    <div class="more">
-      <div>
+        <div class="accordion__content">
+          <p class="accordion__answer">Booking your travel with us is simple and convenient. Start by entering your destination, travel dates, and other relevant details on our homepage. Browse through the available options, including flights, hotels, and car rentals. Once you find the perfect combination for your trip, follow the easy step-by-step process to confirm your booking. If you encounter any issues or have questions during the booking process, our customer support team is available 24/7 to assist you.</p>
+        </div>
+      </div>
+  
+      <!-- Accordion 2 -->
+      <div class="accordion faq">
+        <div class="accordion__header">
+          <h2 class="accordion__question">What measures are in place to ensure the safety of my personal information?</h2>
+          <span class="accordion__icon">
+            <i id="accordion-icon" class="ri-add-line"></i>
+          </span>
+        </div>
+        <div class="accordion__content">
+          <p class="accordion__answer">We take the security of your personal information seriously. Our website employs state-of-the-art encryption technology to safeguard your data during the booking process. Additionally, we adhere to strict privacy policies and comply with industry standards to protect your information. Rest assured that your details are used solely for the purpose of facilitating your travel arrangements, and we do not share your information with third parties without your consent. For more details, please refer to our Privacy Policy.</p>
+        </div>
+      </div>
+  
+      <!-- Accordion 3 -->
+      <div class="accordion faq">
+        <div class="accordion__header">
+          <h2 class="accordion__question">Can I make changes to my booking or cancel it if needed?</h2>
+          <span class="accordion__icon">
+            <i id="accordion-icon" class="ri-add-line"></i>
+          </span>
+        </div>
+        <div class="accordion__content">
+          <p class="accordion__answer">Yes, we understand that plans can change. Depending on the terms and conditions of your specific booking, you may be able to make modifications or cancel your reservation. Log in to your account on our website, navigate to the "Manage Booking" section, and follow the provided instructions. Keep in mind that there may be associated fees or restrictions depending on the type of booking and the time of the requested changes. For further assistance, feel free to contact our customer support team, and they will guide you through the process.</p>
+        </div>
+      </div>
+  
+      <!-- Accordion 4 -->
+      <div class="accordion faq">
+        <div class="accordion__header">
+          <h2 class="accordion__question">Will I get assistance while on travel?</h2>
+          <span class="accordion__icon">
+            <i id="accordion-icon" class="ri-add-line"></i>
+          </span>
+        </div>
+        <div class="accordion__content">
+          <p class="accordion__answer">Yes, We provide 24X7 support and customer assistance while we are serving you.</p>
+        </div>
+      </div>
+  
+      <!-- Accordion 5 -->
+      <div class="accordion faq">
+        <div class="accordion__header">
+          <h2 class="accordion__question">Can I negotiate the prices?</h2>
+          <span class="accordion__icon">
+            <i id="accordion-icon" class="ri-add-line"></i>
+          </span>
+        </div>
+        <div class="accordion__content">
+          <p class="accordion__answer">Sure! If it's a customized trip, we can negotiate prices based on requirements. However, if on group tours or offers, we cannot negotiate the prices.</p>
+        </div>
+      </div>
+  </div>
+  
+  <div class="more">
+    <div>
       <h2>Have More questions?</h2>
       <p>Feel Free to Email us!</p>
     </div>
     <div>
-      <button class="moreemail">Send Email</button>
-    </div>
+      <button class="moreemail" onclick="sendEmail()">Send Email</button>
     </div>
+  </div>
+  
 
     <script>
       let hamburger = document.querySelector('.hamburger');
@@ -367,6 +438,11 @@ <h2>Have More questions?</h2>
         logoutButton.disabled = true;
     }
 });
+
+
+function sendEmail() {
+  window.location.href = "mailto:arpanchowdhury003@gmail.com";
+}
 </script>
 </body>
 </html>
diff --git a/feedback.html b/feedback.html
index 21d3e5d2..ae15a3aa 100644
--- a/feedback.html
+++ b/feedback.html
@@ -21,9 +21,101 @@
 
     <!-- FontAwsome-->
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.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;
+    }
+    </style>
 </head>
 
 <body>
+  <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>
+  <script>
+    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;
+      });
+
+      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;
+
+        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;
+
+          x += (nextCircle.x - x) * 0.3;
+          y += (nextCircle.y - y) * 0.3;
+        });
+
+        requestAnimationFrame(animateCircles);
+      }
+
+      animateCircles();
+    });
+
+  </script>
     <div class="nav-container">
       <nav class="newNav">
         <a href="index.html" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
@@ -35,7 +127,7 @@
           <li class="link" data-aos="fade-down"><a href="./index.html#trip" target="_blank">Pricing</a></li>
           <li class="link" data-aos="fade-down"><a href="./index.html#ReviewGallery" target="_blank">Trip Gallery</a></li>
           <li class="link" data-aos="fade-down"><a href="./index.html#testimonials" target="_blank">Testimonials</a></li>
-          <li class="link" data-aos="fade-down"><a href="./index.htmlfeedback.html" target="_blank">Rate Us?</a></li>
+          <li class="link" data-aos="fade-down"><a href="./feedback.html" target="_blank">Rate Us?</a></li>
           <li class="link" data-aos="fade-down"><a href="./index.html#cnt-form" target="_blank">Contact Us</a></li>
 
         </ul>
diff --git a/img/bg video term3.mp4 b/img/bg video term3.mp4
new file mode 100644
index 00000000..3827b261
Binary files /dev/null and b/img/bg video term3.mp4 differ
diff --git a/img/bg video terms.mp4 b/img/bg video terms.mp4
new file mode 100644
index 00000000..351421df
Binary files /dev/null and b/img/bg video terms.mp4 differ
diff --git a/img/bg video terms2.mp4 b/img/bg video terms2.mp4
new file mode 100644
index 00000000..db7accff
Binary files /dev/null and b/img/bg video terms2.mp4 differ
diff --git a/index.html b/index.html
index fbcbc312..284bf404 100644
--- a/index.html
+++ b/index.html
@@ -11,6 +11,8 @@
     .center-card {
       margin: 0 auto;
       display: block;
+      position: relative;
+      bottom: 18px;
     }
   </style>
   <link rel="stylesheet" href="./loader.css">
@@ -24,10 +26,10 @@
     integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA=="
     crossorigin="anonymous" referrerpolicy="no-referrer" />
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
-<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
-<link rel="stylesheet" href="counter.css" class="rel href">
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
+  <link rel="stylesheet" href="counter.css" class="rel href">
 
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
+  <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="./Image-Gallery/style.css">
@@ -35,7 +37,12 @@
   <link rel="stylesheet" href="explore.css">
   <title>Tourguide</title>
   <!-- adding a fav-icon -->
+
+   <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>
@@ -78,100 +85,114 @@
     .active {
       color: red !important;
     }
-    @media screen and (max-width:390px){
-      .nav__logo{
+
+    @media screen and (max-width:390px) {
+      .nav__logo {
         position: relative;
         right: 1.9rem;
       }
-      .contact-btn{
+
+      .contact-btn {
         position: relative;
         right: 2.5rem;
       }
-      .toggle-container{
+
+      .toggle-container {
         position: relative;
         right: 2.5rem;
 
       }
-      .toggle{
+
+      .toggle {
         width: 130%;
-      } 
-      .line{
+      }
+
+      .line {
         width: 150%;
       }
-      .hamburger{
+
+      .hamburger {
         position: relative;
         right: 1rem;
       }
     }
+
     @media screen and (max-width:364px) {
-      .toggle{
-        width:190%;
+      .toggle {
+        width: 190%;
       }
-      .line{
+
+      .line {
         width: 190%;
       }
     }
+
     .gallery-rotate-image .image-container {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 16px; /* Adjust the gap between images */
-}
-
-.gallery-rotate-image .image-container span {
-  display: inline-block;
-}
-
-.trip-gallery-container {
-  display: flex;
-  flex-wrap: wrap;
-  gap: 16px; /* Adjust the gap between images */
-}
-
-.trip-gallery-container .image-container {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-
-.trip-gallery-container .image-container img {
-  max-width: 100%;
-  height: auto;
-}
-
-.btn-container {
-  display: flex;
-  justify-content: center;
-  gap: 8px; /* Adjust the gap between buttons */
-}
-
-.nav-wrapperr{
-    position: fixed;
-    height: 10px;
-    width: 100%;
-    top: 80px;
-    left: 0%;
-    background-color: white;
-    z-index: 999;
-  }
-
-  .progress-bar{
-    height: 10px;
-    left: 0%;
-    top: 80px;
-    position: fixed;
-    background-color: #6a5acd;
-    z-index: 9999; 
-  }
-
-@media screen and (max-width: 768px) {  
-body{
-  align-items: flex-end;
-  width: auto;
-}  
-}
+      display: flex;
+      flex-wrap: wrap;
+      gap: 16px;
+      /* Adjust the gap between images */
+    }
+
+    .gallery-rotate-image .image-container span {
+      display: inline-block;
+    }
+
+    .trip-gallery-container {
+      display: flex;
+      flex-wrap: wrap;
+      gap: 16px;
+      /* Adjust the gap between images */
+    }
+
+    .trip-gallery-container .image-container {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+    }
+
+    .trip-gallery-container .image-container img {
+      max-width: 100%;
+      height: auto;
+    }
+
+    .btn-container {
+      display: flex;
+      justify-content: center;
+      gap: 8px;
+      /* Adjust the gap between buttons */
+    }
+
+    @media screen and (max-width: 768px) {
+      body {
+        align-items: flex-end;
+        width: auto;
+      }
+    }
+
+    .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;
+    }
+
   </style>
-<link rel="stylesheet" href="imstyle.css">
-<link rel="stylesheet" href="jquery.flipster.min.css">
+  <link rel="stylesheet" href="imstyle.css">
+  <link rel="stylesheet" href="jquery.flipster.min.css">
 
 </head>
 
@@ -179,7 +200,77 @@
 <body style="background-color: var(--secondary-color);">
 
   <body>
+    <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>
+    <script>
+      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;
+        });
+
+        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;
+
+          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;
+
+            x += (nextCircle.x - x) * 0.3;
+            y += (nextCircle.y - y) * 0.3;
+          });
+
+          requestAnimationFrame(animateCircles);
+        }
 
+        animateCircles();
+      });
+
+    </script>
     <div id="pre-loader">
       <h1>TourGuide . . .</h1>
     </div>
@@ -210,8 +301,10 @@ <h1>TourGuide . . .</h1>
   </nav> -->
     <div class="nav-container" id="top">
       <nav class="newNav">
-        <img src="./img/A T logo with a white background and a square shape, connected to nature for a travel company.png" style="width:30px;height:30px;border-radius:50%;">
-        
+        <img
+          src="./img/A T logo with a white background and a square shape, connected to nature for a travel company.png"
+          style="width:30px;height:30px;border-radius:50%;">
+
         <a href="#" class="nav__logo" data-aos="fade-right">Tourguide</span></a>
 
         <ul class="navLinks">
@@ -231,10 +324,10 @@ <h1>TourGuide . . .</h1>
         <a href="newLogin.html" class="contact-btn"><button class="btn login" id="btn-style"
             data-aos="fade-down">Login/SignUp</button></a>
         <a href="mapa.html" class="contact-btn"><button class="btn" id="btn-style" style="margin: 0;"
-              data-aos="fade-down">view <map name=""></map></button></a>
+            data-aos="fade-down">view <map name=""></map></button></a>
 
-        <a href="loginPage.html" class="contact-btn"><button class="btn" id="logout-btn" style="margin: 0; display: none;"
-              data-aos="fade-down" disabled>Log Out</button></a>
+        <a href="loginPage.html" class="contact-btn"><button class="btn" 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> -->
@@ -261,8 +354,9 @@ <h1>TourGuide . . .</h1>
         </div>
         <div class="header__content">
           <div>
-            <h1 data-aos="fade-in">Find Your Perfect Getaway<br />Discover the World's Best Kept   <div> <span
-                class="auto-typed" style="color: var(--head-text);"></span></div></h1>
+            <h1 data-aos="fade-in">Find Your Perfect Getaway<br />Discover the World's Best Kept <div> <span
+                  class="auto-typed" style="color: var(--head-text);"></span></div>
+            </h1>
             <p class="section__subtitle" data-aos="fade-in">
               Make your travel more enjoyable with us. We are the best travel
               agency and we are providing the best travel services for our
@@ -277,7 +371,7 @@ <h1 data-aos="fade-in">Find Your Perfect Getaway<br />Discover the World's Best
                   style="box-shadow: 2px 2px 8px red;">Book Now</button></a>
             </div>
 
-              
+
             <br>
             <div class="story">
               <div class="video">
@@ -286,6 +380,7 @@ <h1 data-aos="fade-in">Find Your Perfect Getaway<br />Discover the World's Best
                 <!-- link to the hmtl page with the video -->
                 <a href="story.html" class="btn_video">
                   <span><i class="ri-play-fill"></i></span>
+                </a>
               </div>
                
             </div>
@@ -379,7 +474,7 @@ <h2 data-max="10">+ Projects</h2>
 
       <div class="space-y-4 sm:grid sm:grid-cols-2 lg:grid-cols-1 sm:gap-4 xl:gap-8 sm:space-y-0 md:mt-12">
          Box 1 - Number of Guides -->
-        <!-- <div class="box1">
+    <!-- <div class="box1">
           <div class="iconss">
 
             <svg class="w-12 h-12 mx-auto dark:text-gray-100 group-hover:text-pink-500 group-hover:dark:text-pink-500"
@@ -387,7 +482,7 @@ <h2 data-max="10">+ Projects</h2>
               stroke-linejoin="round">
               <path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2" />
               SVG Path for the icon -->
-              <!-- <circle cx="8.5" cy="7" r="4" />
+    <!-- <circle cx="8.5" cy="7" r="4" />
               <polyline points="17 11 19 13 23 9" />
             </svg>
             <h3 id="guidesCount"
@@ -398,16 +493,16 @@ <h2 data-max="10">+ Projects</h2>
               Guides</p>
           </div>
         </div>  -->
-        <!-- Box 2 - Number of Tours -->
-        <!-- <div class="box1">
+    <!-- Box 2 - Number of Tours -->
+    <!-- <div class="box1">
           <div class="iconss">
             <svg class="w-12 h-12 mx-auto dark:text-gray-100 group-hover:text-pink-500 group-hover:dark:text-pink-500"
               viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round"
               stroke-linejoin="round">
               <path stroke="none" d="M0 0h24v24H0z" />
               <circle cx="12" cy="10" r="4" /> -->
-              <!-- SVG Path for the icon -->
-              <!-- <path d="M6.75 16a8.015 8.015 0 1 0 9.25 -13" />
+    <!-- SVG Path for the icon -->
+    <!-- <path d="M6.75 16a8.015 8.015 0 1 0 9.25 -13" />
               <line x1="12" y1="18" x2="12" y2="22" />
               <line x1="8" y1="22" x2="16" y2="22" />
             </svg>
@@ -418,14 +513,14 @@ <h2 data-max="10">+ Projects</h2>
               data-aos="fade-in">Tours</p>
           </div>
         </div> -->
-        <!-- Box 3 - Number of Destinations -->
-        <!-- <div class="box1">
+    <!-- Box 3 - Number of Destinations -->
+    <!-- <div class="box1">
           <a href="affordable-destinations.html" class="iconss">
             <svg class="w-12 h-12 mx-auto group-hover:text-pink-500 dark:text-gray-100 group-hover:dark:text-pink-500"
               viewBox="0 0 24 24" stroke-width="2" stroke="black" fill="none" stroke-linecap="round"
               stroke-linejoin="round"> -->
-              <!-- SVG Path for the icon -->
-              <!-- <path stroke="none" d="M0 0h24v24H0z" />
+    <!-- SVG Path for the icon -->
+    <!-- <path stroke="none" d="M0 0h24v24H0z" />
               <line x1="18" y1="6" x2="18" y2="6.01" />
               <path d="M18 13l-3.5 -5a4 4 0 1 1 7 0l-3.5 5" />
               <polyline points="10.5 4.75 9 4 3 7 3 20 9 17 15 20 21 17 21 15" />
@@ -447,47 +542,47 @@ <h2 data-max="30" id="test">+ Developers</h2>
       </div>  -->
 
 
-      <section>
-        <div class="wrapper">
-            <div class="countitem">
-              <i class="fa-solid fa-handshake-angle"></i>
-              <span class="num" data-val="25000">000</span>
-              <span class="text">Guides</span>
-            </div>
-            <div class="countitem">
-              <i class="fa-solid fa-suitcase-rolling"></i>
-              <span class="num" data-val="20000">000</span>
-              <span class="text">Tours</span>
-            </div>
-            <div class="countitem">
-              <i class="fa-solid fa-location-dot"></i>
-              <span class="num" data-val="20000">000</span>
-              <span class="text">Destinations</span>
-            </div>
-            
-          </div>
-        </section>
-    
-<script>
-  let valueDisplays = document.querySelectorAll(".num");
-let interval = 4000;
-valueDisplays.forEach((valueDisplay) => {
-  let startValue = 0;
-  let endValue = parseInt(valueDisplay.getAttribute("data-val"));
-  let duration = Math.floor(interval / endValue);
-  let counter = setInterval(function () {
-    startValue += 10;
-    valueDisplay.textContent = startValue;
-    if (startValue == endValue) {
-      clearInterval(counter);
-    }
-  }, duration);
-});
-</script>
-    
+    <section>
+      <div class="wrapper">
+        <div class="countitem">
+          <i class="fa-solid fa-handshake-angle"></i>
+          <span class="num" data-val="25000">000</span>
+          <span class="text">Guides</span>
+        </div>
+        <div class="countitem">
+          <i class="fa-solid fa-suitcase-rolling"></i>
+          <span class="num" data-val="20000">000</span>
+          <span class="text">Tours</span>
+        </div>
+        <div class="countitem">
+          <i class="fa-solid fa-location-dot"></i>
+          <span class="num" data-val="20000">000</span>
+          <span class="text">Destinations</span>
+        </div>
+
+      </div>
+    </section>
+
+    <script>
+      let valueDisplays = document.querySelectorAll(".num");
+      let interval = 4000;
+      valueDisplays.forEach((valueDisplay) => {
+        let startValue = 0;
+        let endValue = parseInt(valueDisplay.getAttribute("data-val"));
+        let duration = Math.floor(interval / endValue);
+        let counter = setInterval(function () {
+          startValue += 10;
+          valueDisplay.textContent = startValue;
+          if (startValue == endValue) {
+            clearInterval(counter);
+          }
+        }, duration);
+      });
+    </script>
+
+
+
 
-  
-  
     <br><br>
     <!-- ending the section of About Us -->
 
@@ -526,26 +621,27 @@ <h3 style="font-weight: 600;font-size: 24px;">Get Flat 15% OFF</h3>
     </div>
 
     <section class="section__container destination__container" id="Destinations" data-aos="fade-up">
-    <div class="section__header">
-      <div>
-        <h2 class="section__title" data-aos="fade-in"><span style="margin-left: 300px;"></span>Explore top destinations</h2>
-        <p class="section__subtitle" data-aos="fade-in"style="margin-left: 300px;">
-          Explore your dream places around the world. Here you can find your perfect destination.
-        </p>
+      <div class="section__header">
+        <div>
+          <h2 class="section__title" data-aos="fade-in"><span style="margin-left: 300px;"></span>Explore top
+            destinations</h2>
+          <p class="section__subtitle" data-aos="fade-in" style="margin-left: 300px;">
+            Explore your dream places around the world. Here you can find your perfect destination.
+          </p>
+        </div>
       </div>
-    </div>
 
-    <!-- slideshow -->
-<!-- <div class="slideshow-container" data-aos="fade-up"> -->
+      <!-- slideshow -->
+      <!-- <div class="slideshow-container" data-aos="fade-up"> -->
 
-<!-- Next and previous buttons -->
-<!-- <div class="destination__nav">
+      <!-- Next and previous buttons -->
+      <!-- <div class="destination__nav">
       <span onclick="pullSlide(-1)"><i class="ri-arrow-left-s-line"></i></span>
       <span onclick="pullSlide(1)"><i class="ri-arrow-right-s-line"></i></span>
     </div> -->
 
-<!-- Full-width images with number and caption text -->
-<!-- <div class="mySlides">
+      <!-- Full-width images with number and caption text -->
+      <!-- <div class="mySlides">
       <img src="./img/eiffelTower.webp" style="width:100%">
     </div>
 
@@ -567,59 +663,60 @@ <h2 class="section__title" data-aos="fade-in"><span style="margin-left: 300px;">
           <span></span>
         </div>
       </div> -->
-    <div class="outer-box">
-      <div class="containers">
-            
-          <div class="card active" style="
-            background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 50%),
-              url('/img/paris.jpg')
-          ">
-          <div class="info">
-
-            <p>
-              ||Eiffel Tower||
-            </p>
-            <h3>PARIS</h3>
+
+      <div class="outer-box">
+        <div class="containers">
+              
+            <div class="card active" style="
+              background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 50%),
+                url('./img/paris.jpg')
+            ">
+            <div class="info">
+  
+              <p>
+                ||Eiffel Tower||
+              </p>
+              <h3>PARIS</h3>
+            </div>
           </div>
+  
+      <div class="card" style="
+        background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 50%),
+          url('./img/london.jpg')
+      ">
+        <div class="info">
+          
+          <p>||Giant Wheel||</p>
+          <h3>LONDON</h3>
         </div>
-
-    <div class="card" style="
-      background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 50%),
-        url('./img/london.jpg')
-    ">
-      <div class="info">
-        
-        <p>||Giant Wheel||</p>
-        <h3>LONDON</h3>
       </div>
-    </div>
-
-    <div class="card" style="
-      background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 50%),
-        url('./img/goa.jpg')
-    ">
-      <div class="info">
-        
-        <p>||Goa Beach||</p>
-        <h3>GOA</h3>
+  
+      <div class="card" style="
+        background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 50%),
+          url('./img/goa.jpg')
+      ">
+        <div class="info">
+          
+          <p>||Goa Beach||</p>
+          <h3>GOA</h3>
+        </div>
       </div>
-    </div>
-
-    <div class="card" style="
-      background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 50%),
-        url('./img/maldives.jpg')
-    ">
-      <div class="info">
-       
-        <p>||Male Beach||</p>
-        <h3>MALDIVES</h3>
+  
+      <div class="card" style="
+        background-image: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 7%, rgba(255, 255, 255, 0) 50%),
+          url('./img/maldives.jpg')
+      ">
+        <div class="info">
+         
+          <p>||Male Beach||</p>
+          <h3>MALDIVES</h3>
+        </div>
       </div>
+  
     </div>
-
   </div>
-</div>
-
-    <script src="explore.js"></script>
+  
+      <script src="explore.js"></script>
     </section>
 
     <section class="trip" id="trip" data-aos="zoom-in" data-aos-offset="100">
@@ -671,62 +768,69 @@ <h2 class="section__title">Best trip packages</h2>
         <div class="view__all">
           <a href="./package.html"><button class="btn" id="btn-style" style="box-shadow: 2px 2px 8px red;">View
               All</button></a>
-              <br>
-              <br>
-            <a href="trending.html"><button class="btn" id="btn-style" style="box-shadow: 2px 2px 8px red;">View Trending</button></a>
+          <br>
+          <br>
+          <a href="trending.html"><button class="btn" id="btn-style" style="box-shadow: 2px 2px 8px red;">View
+              Trending</button></a>
         </div>
       </div>
     </section>
     <div class="hero">
       <div class="carousel">
         <ul>
-            <li><img src="https://i.ibb.co/ZYDJ6vv/pexels-spencer-davis-4356144.jpg"></li>
-            <li><img src="https://i.ibb.co/W3HTbYG/pexels-zakaria-boumliha-2827374.jpg"></li>
-            <li><img src="https://i.ibb.co/KwHd8PQ/pexels-stijn-dijkstra-2499699.jpg"></li>
-            <li><img src="https://www.shutterstock.com/image-photo/attractive-young-female-tourist-exploring-260nw-2206967581.jpg"></li>
-            <li><img src="https://thumbs.dreamstime.com/b/young-man-tourist-sail-long-tail-thailand-boat-ocean-sea-vacation-travel-trip-beautiful-nature-87331931.jpg"></li>
-            <li><img src="https://www.tourmyindia.com/blog//wp-content/uploads/2020/11/Feature-Akshardham-Temple.jpg"></li>
-            <li><img src="https://etimg.etb2bimg.com/photo/106124800.cms"></li>
-            <li><img src="https://i.insider.com/5dcc2f02e94e860aff271137?width=700"></li>
-            <li><img src="https://static01.nyt.com/images/2022/03/23/multimedia/23-virus-briefing-capitol/23-virus-briefing-capitol-articleLarge.jpg?quality=75&auto=webp&disable=upscale"></li>
-            <li><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTWh9aGHycWhRya4V6ZiJFL26LyIHheiu-EoQ&s"></li>
-        
+          <li><img src="https://i.ibb.co/ZYDJ6vv/pexels-spencer-davis-4356144.jpg"></li>
+          <li><img src="https://i.ibb.co/W3HTbYG/pexels-zakaria-boumliha-2827374.jpg"></li>
+          <li><img src="https://i.ibb.co/KwHd8PQ/pexels-stijn-dijkstra-2499699.jpg"></li>
+          <li><img
+              src="https://www.shutterstock.com/image-photo/attractive-young-female-tourist-exploring-260nw-2206967581.jpg">
+          </li>
+          <li><img
+              src="https://thumbs.dreamstime.com/b/young-man-tourist-sail-long-tail-thailand-boat-ocean-sea-vacation-travel-trip-beautiful-nature-87331931.jpg">
+          </li>
+          <li><img src="https://www.tourmyindia.com/blog//wp-content/uploads/2020/11/Feature-Akshardham-Temple.jpg">
+          </li>
+          <li><img src="https://etimg.etb2bimg.com/photo/106124800.cms"></li>
+          <li><img src="https://i.insider.com/5dcc2f02e94e860aff271137?width=700"></li>
+          <li><img
+              src="https://static01.nyt.com/images/2022/03/23/multimedia/23-virus-briefing-capitol/23-virus-briefing-capitol-articleLarge.jpg?quality=75&auto=webp&disable=upscale">
+          </li>
+          <li><img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTWh9aGHycWhRya4V6ZiJFL26LyIHheiu-EoQ&s">
+          </li>
+
         </ul>
       </div>
-    
-     
 
-</div>
 
-    <script
-    src="https://code.jquery.com/jquery-3.7.1.min.js"
-    integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo="
-    crossorigin="anonymous"></script>
+
+    </div>
+
+    <script src="https://code.jquery.com/jquery-3.7.1.min.js"
+      integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
     <script src="jquery.flipster.min.js"></script>
-<script>
-$('.carousel').flipster({
-    style:'carousel',
-    spacing: -0.3,
-});
-</script>
-<section class="gallary" id="ReviewGallery">
-  <div class="section__container gallary__container">
-    <div class="section__container gallary__container" id="originalDiv">
-      <div class="gallary__content">
-        <div>
-          <h2 class="section__title" data-aos="zoom-in" style="text-align: center;">
-            Our trip gallery that will inspire you
-          </h2>
-          <p class="section__subtitle" data-aos="zoom-in">
-            Visual Stories of Adventure to Spark Your Imagination.<br>
-            Get inspired for your next journey.
-          </p>
-          <button class="btn btn-style" id="btn-page" onclick="replaceDivs()" data-aos="zoom-in"
-            style="box-shadow: 2px 2px 8px rgb(0, 191, 255);">View All</button>
+    <script>
+      $('.carousel').flipster({
+        style: 'carousel',
+        spacing: -0.3,
+      });
+    </script>
+    <section class="gallary" id="ReviewGallery">
+      <div class="section__container gallary__container">
+        <div class="section__container gallary__container" id="originalDiv">
+          <div class="gallary__content">
+            <div>
+              <h2 class="section__title" data-aos="zoom-in" style="text-align: center;">
+                Our trip gallery that will inspire you
+              </h2>
+              <p class="section__subtitle" data-aos="zoom-in">
+                Visual Stories of Adventure to Spark Your Imagination.<br>
+                Get inspired for your next journey.
+              </p>
+              <button class="btn btn-style" id="btn-page" onclick="replaceDivs()" data-aos="zoom-in"
+                style="box-shadow: 2px 2px 8px rgb(0, 191, 255);">View All</button>
+            </div>
+          </div>
         </div>
       </div>
-    </div>
-  </div>
       <br><br>
       <!-- New div components (hidden initially) -->
       <div id="newDiv" style="display: none;" data-aos="zoom-in">
@@ -837,28 +941,31 @@ <h2 class="section__title" data-aos="zoom-in" style="text-align: center;">
     </section>
     <script>
       function replaceDivs() {
-    document.querySelector('.hero').style.display = 'none';
-    document.getElementById('originalDiv').style.display = 'none';
-    document.getElementById('newDiv').style.display = 'block';
-  }
+        document.querySelector('.hero').style.display = 'none';
+        document.getElementById('originalDiv').style.display = 'none';
+        document.getElementById('newDiv').style.display = 'block';
+      }
     </script>
     <br /><br />
 
     <!-- Toursit Guide Section -->
-     <section class="tourist" id ="tourist">
+    <section class="tourist" id="tourist">
       <h2 class="tourist-heading section__title" align-items="center" data-aos="fade-in">Tourist Guide</h2>
-       <h4 style="color: rgb(231, 62, 118); font-style: italic;font-family: cursive;">Have an amazing trip and explore the destiny</h4>
-       <br></br>
-       <h3 style="color: rgb(6, 151, 241); font-style: inherit;font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;">Connect with the Guide</h3>
-       <br></br>
-       <div class="center-card">
-       <img src="./tg1.jpg" alt="guide1"/>
-       <br></br>
-       <img src="./tg2.jpg" alt="guide2"/>
-       <br></br>
-       <img src="./tg3.jpg" alt="guide3"/>
+      <h4 style="color: rgb(231, 62, 118); font-style: italic;font-family: cursive;">Have an amazing trip and explore
+        the destiny</h4>
+      <br></br>
+      <h3
+        style="color: rgb(6, 151, 241); font-style: inherit;font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;">
+        Connect with the Guide</h3>
+      <br></br>
+      <div class="center-card">
+        <img src="./tg1.jpg" alt="guide1" />
+        <br></br>
+        <img src="./tg2.jpg" alt="guide2" />
+        <br></br>
+        <img src="./tg3.jpg" alt="guide3" />
       </div>
-      </section>
+    </section>
     <br /><br /><br /><br />
     <!-- Testimonials Section -->
 
@@ -872,20 +979,24 @@ <h2 class="testimonial-heading section__title" align-items="center" data-aos="fa
                 <img class="testi-img" src="./img/testimonial1.jpg" alt="">
                 <div>
                   <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
+                    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 class="testimonial-user" >
+              <div class="testimonial-user">
                 <img class="testi-img" src="./img/Abhisek Tamang.jpg" alt="">
                 <div>
-                  <p><sup><i class="fas fa-quote-left"></i></sup>Our cultural tour with TourGuide exceeded all expectations.
+                  <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
+                    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>
@@ -894,12 +1005,14 @@ <h3>Charles</h3>
                   </div>
                 </div>
               </div>
-              <div class="testimonial-user" >
+              <div class="testimonial-user">
                 <img class="testi-img" src="./img/testimonial2.jpg" alt="">
                 <div>
-                  <p><sup><i class="fas fa-quote-left"></i></sup>Traveling with the family has never been easier! TourGuide
+                  <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
+                    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">
@@ -911,20 +1024,24 @@ <h3>Katie</h3>
                 <img class="testi-img" src="./img/testimonial1.jpg" alt="">
                 <div>
                   <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
+                    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 class="testimonial-user" >
+              <div class="testimonial-user">
                 <img class="testi-img" src="./img/Abhisek Tamang.jpg" alt="">
                 <div>
-                  <p><sup><i class="fas fa-quote-left"></i></sup>Our cultural tour with TourGuide exceeded all expectations.
+                  <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
+                    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>
@@ -933,12 +1050,14 @@ <h3>Charles</h3>
                   </div>
                 </div>
               </div>
-              <div class="testimonial-user" >
+              <div class="testimonial-user">
                 <img class="testi-img" src="./img/testimonial2.jpg" alt="">
                 <div>
-                  <p><sup><i class="fas fa-quote-left"></i></sup>Traveling with the family has never been easier! TourGuide
+                  <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
+                    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">
@@ -951,7 +1070,7 @@ <h3>Katie</h3>
           </div>
         </div>
       </div>
-      
+
     </section>
 
 
@@ -959,12 +1078,12 @@ <h3>Katie</h3>
 
 
 
-   
 
 
 
 
-    
+
+
 
     <!----------------------------------------------------- FAQ section ---------------------- -->
 
@@ -977,54 +1096,58 @@ <h2 class="section__title" data-aos="zoom-in">
           <h3 class="accordion__question faq-title">How do I book my travel arrangements through your website?</h3>
           <span class="accordion__icon">
             <i id="accordion-icon" class="ri-add-line"></i>
-        </span>
+          </span>
         </div>
         <div class="accordion__content">
-          <p class="faq-text accordion__answer">Booking your travel with us is simple and convenient. Start by entering your destination,
+          <p class="faq-text accordion__answer">Booking your travel with us is simple and convenient. Start by entering
+            your destination,
             travel dates, and other relevant details on our homepage. Browse through the available options, including
             flights, hotels, and car rentals. Once you find the perfect combination for your trip, follow the easy
             step-by-step process to confirm your booking. If you encounter any issues or have questions during the
             booking process, our customer support team is available 24/7 to assist you.</p>
-           
+
+        </div>
+      </div>
+
+      <div class="accordion faq-container faq">
+        <div class="accordion__header" data-aos="zoom-in">
+          <h3 class="accordion__question faq-title">What measures are in place to ensure the safety of my personal
+            information?</h3>
+          <span class="accordion__icon">
+            <i id="accordion-icon" class="ri-add-line"></i>
+          </span>
         </div>
+        <div class="accordion__content">
+          <p class="faq-text accordion__answer">We take the security of your personal information seriously. Our website
+            employs
+            state-of-the-art encryption technology to safeguard your data during the booking process. Additionally, we
+            adhere to strict privacy policies and comply with industry standards to protect your information. Rest
+            assured that your details are used solely for the purpose of facilitating your travel arrangements, and we
+            do not share your information with third parties without your consent. For more details, please refer to our
+            Privacy Policy.</p>
+
         </div>
+      </div>
 
-        <div class="accordion faq-container faq">
-          <div class="accordion__header" data-aos="zoom-in">
-            <h3 class="accordion__question faq-title">What measures are in place to ensure the safety of my personal information?</h3>
-            <span class="accordion__icon">
-              <i id="accordion-icon" class="ri-add-line"></i>
+      <div class="accordion faq-container faq">
+        <div class="accordion__header" data-aos="zoom-in">
+          <h3 class="accordion__question faq-title">Can I make changes to my booking or cancel it if needed?</h3>
+          <span class="accordion__icon">
+            <i id="accordion-icon" class="ri-add-line"></i>
           </span>
-          </div>
-          <div class="accordion__content">
-            <p class="faq-text accordion__answer">We take the security of your personal information seriously. Our website employs
-              state-of-the-art encryption technology to safeguard your data during the booking process. Additionally, we
-              adhere to strict privacy policies and comply with industry standards to protect your information. Rest
-              assured that your details are used solely for the purpose of facilitating your travel arrangements, and we
-              do not share your information with third parties without your consent. For more details, please refer to our
-              Privacy Policy.</p>
-             
-          </div>
-          </div>
+        </div>
+        <div class="accordion__content">
+          <p class="faq-text accordion__answer">Yes, we understand that plans can change. Depending on the terms and
+            conditions of your
+            specific booking, you may be able to make modifications or cancel your reservation. Log in to your account
+            on our website, navigate to the "Manage Booking" section, and follow the provided instructions. Keep in mind
+            that there may be associated fees or restrictions depending on the type of booking and the time of the
+            requested changes. For further assistance, feel free to contact our customer support team, and they will
+            guide you through the process.</p>
+
+        </div>
+      </div>
 
-          <div class="accordion faq-container faq">
-            <div class="accordion__header" data-aos="zoom-in">
-              <h3 class="accordion__question faq-title">Can I make changes to my booking or cancel it if needed?</h3>
-              <span class="accordion__icon">
-                <i id="accordion-icon" class="ri-add-line"></i>
-            </span>
-            </div>
-            <div class="accordion__content">
-              <p class="faq-text accordion__answer">Yes, we understand that plans can change. Depending on the terms and conditions of your
-                specific booking, you may be able to make modifications or cancel your reservation. Log in to your account
-                on our website, navigate to the "Manage Booking" section, and follow the provided instructions. Keep in mind
-                that there may be associated fees or restrictions depending on the type of booking and the time of the
-                requested changes. For further assistance, feel free to contact our customer support team, and they will
-                guide you through the process.</p>
-               
-            </div>
-            </div>
-    
 
       </div>
     </section>
@@ -1110,18 +1233,19 @@ <h1>Contact Us</h1>
             <form id="contact-form" name="CalcDiverse Contact" autocomplete="off">
               <div class="one" style="position: relative;">
                 <i class="icon1 fa-solid fa-user"></i>
-                <input type="text" id="Name" placeholder="Name"  style="padding-left: 6%;">
+                <input type="text" id="Name" placeholder="Name" style="padding-left: 6%;">
               </div>
               <div style="position: relative;">
-                <i class="icon2 fa-solid fa-envelope" ></i>
-                <input type="email" id="email" placeholder="Email"style="padding-left:6%;" required>
+                <i class="icon2 fa-solid fa-envelope"></i>
+                <input type="email" id="email" placeholder="Email" style="padding-left:6%;" required>
               </div>
               <div style="position: relative;">
                 <i class="icon3 fa-solid fa-message"></i>
-                <textarea id="message" placeholder="Type your message here.." style="padding-left:6%;" required></textarea><br>
+                <textarea id="message" placeholder="Type your message here.." style="padding-left:6%;"
+                  required></textarea><br>
               </div>
               <button type="submit" class="btn btn-style" data-aos="fade-in" id="btn-style"
-              style="margin-right: 40px;box-shadow: 2px 2px 8px red;">Send</button>
+                style="margin-right: 40px;box-shadow: 2px 2px 8px red;">Send</button>
               <button onclick="window.location.href='feed.html'" class="btn  btn-style" data-aos="fade-in"
                 id="btn-style" style="box-shadow: 2px 2px 8px red;">Feedback</button>
             </form>
@@ -1146,32 +1270,33 @@ <h2 class="section__title" data-aos="fade-up">Subscribe to get special prize</h2
             <input type="email" placeholder="Your email here" id="emailInput" required />
             <button class="btn-send" id="send" type="submit" style="box-shadow: 2px 2px 8px blue;">Subscribe</button>
           </form>
-          <p id="subscriptionMessage" style="display: none; color: green; margin-top: 10px;">Subscription successful! 🎉</p>
+          <p id="subscriptionMessage" style="display: none; color: green; margin-top: 10px;">Subscription successful! 🎉
+          </p>
         </div>
       </div>
     </section>
     <!--DISPLAY SUBSCRIPTION SUCCESS MESSAGE-->
     <script>
-      document.getElementById('subscriptionForm').addEventListener('submit', function(event) {
+      document.getElementById('subscriptionForm').addEventListener('submit', function (event) {
         event.preventDefault(); // Prevent submission
-    
-        
-    
+
+
+
         //  success message 
         showSubscriptionMessage();
       });
-    
+
       function showSubscriptionMessage() {
         var messageElement = document.getElementById('subscriptionMessage');
         messageElement.style.display = 'block';
-    
+
         // Hide message after 4 seconds
-        setTimeout(function() {
+        setTimeout(function () {
           messageElement.style.display = 'none';
         }, 4000); // 4000 milliseconds = 4 seconds
       }
     </script>
-    
+
 
     <footer class="footer" data-aos="fade-up">
       <div class="section__container footer__container">
@@ -1186,27 +1311,27 @@ <h3 class="footer-head" class="footer__title">Tourguide<span>.</span></h3>
         </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"> 
-           
-            <a href="Cultural_Exp.html" >Cultural Experiences</a>
-           
+          <p class="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">
           <div class="footer__area">
             <h4 class="footer-head" class="footer__subtitle">Support</h4>
-          <p><a href="./faq.html" class="footer__link">FAQs</a></p>
-          <p><a href="./tnc.html" class="footer__link">Terms & Conditions</a></p>
-           <p><a href="./privacy.html" class="footer__link">Privacy Policy</a></p>
-          <p><a href="#cnt-form" class="footer__link">Contact Us</a></p>
+            <p><a href="./faq.html" class="footer__link">FAQs</a></p>
+            <p><a href="./tnc.html" class="footer__link">Terms & Conditions</a></p>
+            <p><a href="./privacy.html" class="footer__link">Privacy Policy</a></p>
+            <p><a href="#cnt-form" class="footer__link">Contact Us</a></p>
           </div>
         </div>
         <div class="footer__col">
-          <h4 class="footer-head" style="padding-left: 35px;">  Address</h4>
+          <h4 class="footer-head" style="padding-left: 35px;"> Address</h4>
           <div class="mapouter">
             <div class="gmap_canvas"><iframe width="200" height="200" id="gmap_canvas"
                 src="https://maps.google.com/maps?q=wellington%20street%20kolkata&t=k&z=11&ie=UTF8&iwloc=&output=embed"
@@ -1246,35 +1371,41 @@ <h4>Contact Us</h4>
                   <i class="fab fa-linkedin" title="linkedin" style="cursor: pointer;"></i>
                 </div>
               </a>
-          
+
               <a href="">
                 <div class="icon">
-                  <i class="fab fa-twitter" title="X"style="cursor: pointer;"></i>
+                  <i class="fab fa-twitter" title="X" style="cursor: pointer;"></i>
                 </div>
               </a>
-          
+
               <a href="">
                 <div class="icon">
-                  <i class="fab fa-instagram" title="Instagram"style="cursor: pointer;"></i>
+                  <i class="fab fa-instagram" title="Instagram" style="cursor: pointer;"></i>
                 </div>
               </a>
-              
-          
+
+
               <a href="" title="YouTube">
                 <div class="icon">
                   <i class="fab fa-youtube" style="cursor: pointer;"></i>
                 </div>
               </a>
-          
+
               <a href="">
                 <div class="icon">
                   <i class="fab fa-github" title="Github"></i>
                 </div>
               </a>
-             
+
+            </div>
+            <!-- Visitor Widget -->
+            <div class="visitor-widget mt-3">
+              <a>
+                <img alt="Hits" src="https://hits.sh/apu52.github.io/Travel_Website.svg?style=for-the-badge&label=Visitors&extraCount=786&color=526180&labelColor=9bbbff"/>
+              </a>
             </div>
           </div>
-        
+
         </div>
 
         <div class="footer__col">
@@ -1287,41 +1418,41 @@ <h4>Contact Us</h4>
               }, 'google_element');
             }
           </script>
-      </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>
+
+        <!--  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>
-      </div>
 
-    </footer> 
+    </footer>
 
     <a class="goupbtn" href="#" onclick="goToTop()"><i class="fa-solid fa-arrow-up"></i></a>
 
-<script>
-  // Get the button
-  var mybutton = document.querySelector(".goupbtn");
-
-  // When the user scrolls, check if the button should be displayed
-  window.addEventListener("scroll", function() {
-    if (window.scrollY > 20) {
-      mybutton.style.display = "block";
-    } else {
-      mybutton.style.display = "none";
-    }
-  });
+    <script>
+      // Get the button
+      var mybutton = document.querySelector(".goupbtn");
+
+      // When the user scrolls, check if the button should be displayed
+      window.addEventListener("scroll", function () {
+        if (window.scrollY > 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; // For Safari
+        document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
+      }
+    </script>
 
-  // When the user clicks on the button, scroll to the top of the document
-  function goToTop() {
-    document.body.scrollTop = 0; // For Safari
-    document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
-  }
-</script>
 
-    
 
 
 
@@ -1772,16 +1903,16 @@ <h4>Contact Us</h4>
   <script src="faq-website.js"></script>
 
   <script>
-    window.onload = function() {
-        var link = top.document.createElement("link");
-        link.type = "image/x-icon";
-        link.rel = "icon";
-        link.href = "favicon.ico?v=1";
-        top.document.getElementsByTagName("head")[0].appendChild(link);
+    window.onload = function () {
+      var link = top.document.createElement("link");
+      link.type = "image/x-icon";
+      link.rel = "icon";
+      link.href = "favicon.ico?v=1";
+      top.document.getElementsByTagName("head")[0].appendChild(link);
     }
-</script>
+  </script>
 
-<script src="index.js"></script>
+  <script src="index.js"></script>
 
 
   <!--  Adding copyright javascript code to make it dynamic and display current year -->
@@ -1790,30 +1921,31 @@ <h4>Contact Us</h4>
   </script>
 
   <script>
-        // Logout Button
+    // Logout Button
 
-      document.addEventListener('DOMContentLoaded', function () {
+    document.addEventListener('DOMContentLoaded', function () {
       var isLoggedIn = localStorage.getItem('isLoggedIn');
       var loginButton = document.getElementById('btn-style');
       var logoutButton = document.getElementById('logout-btn');
 
       if (isLoggedIn === 'true') {
-          loginButton.style.display = 'none';
-          logoutButton.style.display = 'block';
-          loginButton.disabled = true ;
-          logoutButton.disabled = false;
-          logoutButton.style.cursor = 'pointer';
-          logoutButton.addEventListener('click', function() {
-              localStorage.setItem('isLoggedIn', 'false');
-              window.location.href = './index.html';
-          });
+        loginButton.style.display = 'none';
+        logoutButton.style.display = 'block';
+        loginButton.disabled = true;
+        logoutButton.disabled = false;
+        logoutButton.style.cursor = 'pointer';
+        logoutButton.addEventListener('click', function () {
+          localStorage.setItem('isLoggedIn', 'false');
+          window.location.href = './index.html';
+        });
       } else {
-          loginButton.style.display = 'block';
-          logoutButton.disabled = true;
+        loginButton.style.display = 'block';
+        logoutButton.disabled = true;
       }
-  });
+    });
   </script>
 
+
 <script>
 
   document.addEventListener('DOMContentLoaded', function() {
@@ -1828,19 +1960,14 @@ <h4>Contact Us</h4>
         obj.textContent = currentValue;
         if (progress < 1) {
           requestAnimationFrame(updateValue);
+
         }
-      }
 
-      requestAnimationFrame(updateValue);
-    }
+        requestAnimationFrame(updateValue);
+      }
+</script>
 
-    // Call the function for each count-up element
-    animateValue("guidesCount", 0, 25000, 20000);
-    animateValue("toursCount", 0, 20000, 20000);
-    animateValue("destinationsCount", 0, 10994, 20000);
-  });
 
-</script>
 <script>
     const scrollline = document.querySelector('.progress-bar');
 
@@ -1855,6 +1982,13 @@ <h4>Contact Us</h4>
 
     window.addEventListener('scroll', fillscrollline);
 
+
+      // Call the function for each count-up element
+      animateValue("guidesCount", 0, 25000, 20000);
+      animateValue("toursCount", 0, 20000, 20000);
+      animateValue("destinationsCount", 0, 10994, 20000);
+    });
+
   </script>
 
 
@@ -1895,4 +2029,4 @@ <h4>Contact Us</h4>
 
 
 </div> -->
-<!-- New bubble background end -->
+<!-- New bubble background end -->
\ No newline at end of file
diff --git a/login.css b/login.css
index 20af43ab..2c758567 100644
--- a/login.css
+++ b/login.css
@@ -29,6 +29,7 @@ body {
 
 .left-section {
     flex: 3;
+    margin-top: 58px;
     display: flex;
     flex-direction: column;
     justify-content: center;
diff --git a/maps.css b/maps.css
index 2b9cd7eb..88e19fe9 100644
--- a/maps.css
+++ b/maps.css
@@ -14,4 +14,5 @@
     height: 100%;
     margin: 0;
     padding: 0;
+    margin-top: 0;
   }
\ No newline at end of file
diff --git a/mouseEffect.css b/mouseEffect.css
deleted file mode 100644
index ef52c6b6..00000000
--- a/mouseEffect.css
+++ /dev/null
@@ -1,18 +0,0 @@
-
-.ripple {
-    position: absolute;
-    width: 10px;
-    height: 10px;
-    border-radius: 45%;
-    background: linear-gradient(45deg, #b3e0f1, #01baef);
-    pointer-events: none;
-    transform: scale(0);
-    z-index: 1000;
-    transition: transform 1.2s, opacity 1s;
-    opacity: 1;
-}
-
-.ripple-active {
-    transform: scale(3);
-    opacity: 0;
-}
\ No newline at end of file
diff --git a/mouseEffect.js b/mouseEffect.js
deleted file mode 100644
index fe3edc86..00000000
--- a/mouseEffect.js
+++ /dev/null
@@ -1,27 +0,0 @@
-document.addEventListener('mousemove', function(event) {
-    const ripple = document.createElement('div');
-    const element = document.getElementById('top');
-
-    let x = event.clientX;
-    let y = event.clientY;
-    let scrollLeft = window.pageXOffset;
-    let scrollTop = window.pageYOffset;
-    ripple.className = 'ripple';
-    let relativeX = x + scrollLeft;
-    let relativeY = y + scrollTop;
-    ripple.style.left = `${relativeX  - 5}px`;
-    ripple.style.top = `${relativeY - 5}px`;
-    
-    document.body.appendChild(ripple);
-
-
-    // Trigger the animation by adding the class after a short delay
-    setTimeout(() => {
-        ripple.classList.add('ripple-active');
-    }, 10);
-
-    // Remove the ripple element after the animation ends
-    ripple.addEventListener('transitionend', () => {
-        ripple.remove();
-    });
-});
diff --git a/pricing/style.css b/pricing/style.css
index 35c568c2..80c3d90f 100644
--- a/pricing/style.css
+++ b/pricing/style.css
@@ -337,6 +337,7 @@ header {
   position: absolute;
   top: 3px;
   left: 60px;
+  margin-left: 2rem;
 }
 .price-area .inner-area .price{
   font-size: 45px;
diff --git a/privacy.html b/privacy.html
index 250cc32d..e84aaa85 100644
--- a/privacy.html
+++ b/privacy.html
@@ -13,18 +13,113 @@
 
     <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;
+    }
+</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>
+    <script>
+      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;
+        });
+
+        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;
+
+          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;
+
+            x += (nextCircle.x - x) * 0.3;
+            y += (nextCircle.y - y) * 0.3;
+          });
+
+          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>
     <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>
+          <h1 class="title" style="color: #041338;">Privacy Policy</h1>
         </div>
 
         <div class="col-xs-12 col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2">
@@ -73,6 +168,9 @@ <h2 class="section-title">Changes to This Privacy Policy</h2>
         </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
diff --git a/story.html b/story.html
index 64670405..98dc190c 100644
--- a/story.html
+++ b/story.html
@@ -17,6 +17,7 @@
     <link rel="icon" type="image/x-icon" href="favicon.ico"/>
     
     <script src="index.js"></script>
+    <link rel="stylesheet" href="style.css">
 
     <script type="text/javascript"
         src="https://cdn.jsdelivr.net/npm/@emailjs/browser@3/dist/email.min.js">
@@ -47,8 +48,12 @@
     </nav> -->
     <div class="nav-container">
       <nav class="newNav">
-        <a href="#" class="nav__logo" data-aos="fade-right">Tourguide<span>.</span></a>
-
+        <div class="logo">
+          <video id="logo-video" autoplay loop muted>
+              <source src="Untitled (1).mp4" type="video/mp4">
+              Your browser does not support the video tag.
+          </video>
+          </div>
         <ul class="navLinks">
           <li class="link home" data-aos="fade-down"><a href="index.html">Home</a></li>
           <li class="link" data-aos="fade-down"><a href="index.html#AboutUs">AboutUs</a></li>
@@ -111,7 +116,7 @@ <h4>Address</h4>
             <span>Address:</span> 3/2 Wellington Street, Kolkata , West Bengal , India 
           </p>
           <p><span>Email:</span><a href="mailto:tour@tourguide.com">tour@tourguide.com</a></p>
-          <p><span>Phone:</span><a href="tel:8562145852">+91 8562145852</a></p>
+          <p><span>Phone:</span><a href="tel:8562145852"> +91 8562145852</a></p>
         </div>
         </div>
       </div>
diff --git a/style.css b/style.css
index ca97f2d9..e5dbd7ee 100644
--- a/style.css
+++ b/style.css
@@ -53,13 +53,51 @@ button, input[type="submit"]{
     align-items: center;
     
 }
-.logo a{
-    font-size: 2.4rem;
-    font-weight: bold;
-    color: #fff;
-    text-decoration: none;
+/* 
+ */
+ .logo {
+  display: flex;
+  align-items: center;
+}
+
+.logo video {
+  height: 100px;
+  margin-right: 10px;
+  transition: transform 0.3s;
 }
 
+.logo video:hover {
+  transform: scale(1.1);
+}
+
+.logo h1 {
+  font-size: 24px;
+  color: #0d213f;;
+  margin: 0;
+}
+
+nav ul {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+}
+
+nav ul li {
+  margin-left: 20px;
+}
+
+nav ul li a {
+  text-decoration: none;
+  color:  #0d213f;;
+  font-size: 16px;
+}
+
+nav ul li a:hover {
+  color: #007bff;
+}
+
+
 main{
     min-height: 80vh;
     display: flex;
diff --git a/styles.css b/styles.css
index 6b769d34..9dbae098 100644
--- a/styles.css
+++ b/styles.css
@@ -1,3 +1,6 @@
+
+
+
 @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;800&display=swap");
 @import url("https://fonts.googleapis.com/css2?family=Noto+Serif:wght@700&family=Oxygen:wght@300&display=swap");
 
@@ -232,6 +235,30 @@
 }
 */
 
+.footer__link {
+  position: relative;
+  text-decoration: none;
+  color: black;
+  font-size: 18px;
+}
+.footer__link::after {
+  content: '';
+  position: absolute;
+  width: 0%;
+  height: 2px;
+  bottom: -5px;
+  left: 0;
+  background-color: black;
+  transition: all 0.3s ease-in-out;
+}
+.footer__link:hover {
+  color: red;
+}
+.footer__link:hover::after {
+  width: 100%;
+  background-color: red;
+}
+
 /* new bubble end */
 #scrollPath {
   position: fixed;
@@ -357,7 +384,6 @@ body {
   justify-content: space-between;
   gap: 2rem;
   flex-wrap: wrap;
-  margin-bottom: 4rem;
 }
 
 .section__title {
@@ -506,7 +532,7 @@ body {
 }
 
 nav {
-  background-color: #091020;
+  background-color: #123456;
   position: fixed;
   top: 0;
   width: 100%;
@@ -526,30 +552,32 @@ nav {
   color: #3685fb;
   /* Assuming this is your primary color */
 }
-
-/* .nav__links {
-  list-style: none;
+/* 
+.nav__links {
+  /* list-style: none;
   display: flex;
   align-items: center;
   gap: 1rem; /* Increased gap between links */
 /* font-size: 1.2rem; Increased font size for the links   */
 /* } */
-
 .link a {
-  /* padding: 0.5rem 1rem; Adjusted padding for links */
-  color: #ffffff;
-  transition: 0.3s;
-  font-weight: 600;
+  color: #fff; /* Sets text color to white */
+  padding-top: 1.75rem; /* Equivalent to py-7 in Tailwind, adjust according to your base font size */
+  padding-bottom: 1.75rem; /* Equivalent to py-7 in Tailwind */
+  transition: color 0.3s; /* Transition effect for color change */
+  font-weight: 600; /* Sets font weight to 600 */
 }
 
-.link a:hover {
-  color: #ff0000;
+link a:hover {
+  color: #60a5fa; 
+  background-color:red;
 }
 
 .home {
   margin-left: 210px;
 }
 
+
 header {
   background-color: var(--secondary-color);
 }
@@ -1060,7 +1088,7 @@ header {
     gap: 2rem;
   }
 }
-@media screen and (max-width:768px) {
+/* @media screen and (max-width:768px) {
   .hamburger{
     position: relative;
     left: 20px;
@@ -1069,7 +1097,7 @@ header {
     position: relative;
     left: 90px;
   }
-}
+} */
 
 .image__gallary {
   display: grid;
@@ -1204,7 +1232,16 @@ body, html {
 
 .footer {
   width: 100%;
-  background-color: #091020;
+  background-color: rgb(102, 116, 204);
+  padding: 2rem;
+}
+.footer:hover{
+   background-color :#16171c;
+}
+
+.footer__col p {
+  font-size: 0.8rem;
+  font-weight: 100;
 }
 
 .footer__container {
@@ -1224,18 +1261,18 @@ body, html {
   margin-left: 15px;
   flex: 1;
   display: flex;
-  max-width: 200px;
+  max-width: 220px;
   text-align: left;
   flex-direction: column;
 }
 
-.footer__text a {
+/* .footer__text a {
   margin-top: 5px;
   color: white;
 }
 .footer__text a:hover {
   color: red;
-}
+} */
 
 .footer:hover {
   background: linear-gradient(135deg, #654ea3, #eaafc8);
@@ -1251,15 +1288,15 @@ body, html {
   color: var(--primary-color);
 }
 
-.footer__link {
+/* .footer__link {
   color: white;
-  margin-right: 15px; /* Adjust spacing between icons */
-  font-size: 1em; /* Initial font size */
+  margin-right: 15px; 
+  font-size: 1em; 
 }
 
 .footer__link:hover {
-  transform: scale(10); /* Scale up the icon on hover */
-}
+  transform: scale(10);
+} */
 
 .footer__col p span {
   font-weight: 600;
@@ -1276,14 +1313,16 @@ body, html {
   margin: auto;
   padding: 0.5rem;
   text-align: center;
-  font-size: 1rem;
+  font-size: 0.9rem;
   /*   color: var(--secondary-color); */
   color: var(--extra-light);
+  padding-top: 1rem;
+  margin-top: 1rem;
   border-top: 2px solid var(--text-light);
 }
 
 .footer__area {
-  margin-left: 2.3rem;
+  margin-left: 0rem;
 }
 
 .footer__area a {
@@ -2114,7 +2153,7 @@ body {
   padding: 10px 0;
 }
 
-.footer-head::before,
+/* .footer-head::before,
 .footer-head::after {
   content: "";
   position: absolute;
@@ -2122,7 +2161,7 @@ body {
   height: 2px;
   background-color: red;
   transition: width 0.2s ease-in;
-}
+} */
 
 .footer-head::before {
   top: 0;
@@ -2136,20 +2175,20 @@ body {
   transform: translateX(-50%);
 }
 
-.footer-head:hover::before {
-  width: 100%;
-}
-.footer-head:hover::after {
-  width: 100%;
-}
-.navLinks .link a:active {
+  /* .footer-head:hover::before {
+    width: 100%;
+  }
+  .footer-head:hover::after {
+    width: 100%;
+  } */
+.navLinks:active {
   color: red;
 }
 
 .navLinks.activeHamburger {
   width: 100%;
 }
-@media screen and (max-width: 1146px) {
+/* @media screen and (max-width: 1146px) {
   .toggle-container {
     position: relative;
     right: 148px;
@@ -2158,8 +2197,16 @@ body {
     position: relative;
     right: 150px;
   }
-}
-@media screen and (max-width: 846px) {
+} */
+/* @media only screen and (max-width:957px){
+  .toggle-container{
+    left: 30px;
+  }
+  .hamburger{
+    left: 30px;
+  }
+} */
+/* @media screen and (max-width: 846px) {
   .toggle-container {
     position: relative;
     right: 200px;
@@ -2173,7 +2220,7 @@ body {
     right: 57px;
     top: 1px;
   }
-}
+} */
 @media screen and (max-width: 652px) {
   .toggle {
     width: 5vw;
@@ -2181,35 +2228,50 @@ body {
   .line {
     width: 5vw;
   }
-  .newNav {
-    height: 130px;
-  }
   .newNav img {
     position: relative;
-    bottom: 35px;
-    left: 130px;
+    bottom: 23px;
+    left: 109px;
   }
   .nav__logo {
     position: relative;
     left: 85px;
-    bottom: 35px;
+    bottom: 20px;
   }
   .btn {
     position: relative;
     top: 30px;
     left: -147px;
   }
-  .toggle-container {
+}
+@media only screen and (max-width:577px){
+  .but{
     position: relative;
-    top: 30px;
-    right: 377px;
+    top: -37px;
+    left: 85px;
   }
-  .hamburger {
+}
+@media only screen and (max-width: 465.5px){
+  .newNav img{
+    position: relative;
+    left: -58px;
+  }
+  .nav__logo{
     position: relative;
-    right: 388px;
+    left: -82px;
+  }
+  .but{
+    position: relative;
+    left:17px;
+    top: -4px;
+  }
+  .but2{
+    position: relative;
+    left: 30px;
+    top: -2px;
   }
 }
-@media screen and (max-width: 430px) {
+/* @media screen and (max-width: 430px) {
   .toggle-container {
     right: 374px;
   }
@@ -2219,7 +2281,7 @@ body {
   .nav__logo {
     left: 36px;
   }
-}
+} */
 /* New NAvbar CSS Ends Here*/
 /* #canvas {
   background: #232323;
@@ -2442,6 +2504,7 @@ body {
   background-color: #91b4ffe7;
   overflow: hidden;
   margin-bottom: 50px;
+  top: 45px;
 }
 
 .swiper-slide {
@@ -2725,3 +2788,51 @@ button:hover {
     font-size: small;
   }
 }
+
+a {
+  position: relative;
+  text-decoration: none;
+  color: black;
+  font-size: 18px;
+}
+a::after {
+  content: '';
+  position: absolute;
+  width: 0%;
+  height: 2px;
+  bottom: -5px;
+  left: 0;
+  background-color: black;
+  transition: all 0.3s ease-in-out;
+}
+a:hover {
+  color: red;
+}
+a:hover::after {
+  width: 100%;
+  background-color: red;
+}
+/* Footer specific styles */
+.footer__link {
+  position: relative;
+  text-decoration: none;
+  color: black;
+  font-size: 18px;
+}
+.footer__link::after {
+  content: '';
+  position: absolute;
+  width: 0%;
+  height: 2px;
+  bottom: -5px;
+  left: 0;
+  background-color: black;
+  transition: all 0.3s ease-in-out;
+}
+.footer__link:hover {
+  color: red;
+}
+.footer__link:hover::after {
+  width: 100%;
+  background-color: red;
+}
\ No newline at end of file
diff --git a/thankyou.css b/thankyou.css
new file mode 100644
index 00000000..25077d09
--- /dev/null
+++ b/thankyou.css
@@ -0,0 +1,44 @@
+body {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100vh;
+  margin: 0;
+  background-image: linear-gradient(to right, rgb(91, 57, 165) , rgb(108, 144, 185));
+  font-family: 'Roboto', sans-serif;
+}
+
+/* .container {
+  text-align: center;
+  padding: 20px;
+  background-color: #fff;
+  border-radius: 10px;
+  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+  max-width: 400px;
+  width: 90%;
+} */
+
+.container {
+  text-align: center;
+  padding: 20px;
+  background-color: #fff;
+  border-radius: 10px;
+  box-shadow: rgb(38, 57, 77) 0px 20px 30px -10px,
+              rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset,
+              rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset;
+  max-width: 400px;
+  text-shadow: 2px 2px 5px rgb(121, 113, 113);
+  width: 90%;
+}
+
+
+
+.container:hover {
+  transform: scale(1.05);
+  transition: transform 0.3s ease;
+}
+
+h2 {
+  color: #333;
+  font-family: Arial, sans-serif;
+}
diff --git a/thankyou.html b/thankyou.html
index cae0f45f..876630f3 100644
--- a/thankyou.html
+++ b/thankyou.html
@@ -4,8 +4,11 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Thankyou</title>
+    <link rel="stylesheet" href="thankyou.css">
 </head>
 <body>
-    <h2>Thankyou for the valuable feedback!</h2>
+    <div class="container">
+        <h2>Thank you for the valuable feedback! <span>&#128077;</span></h2>
+    </div>
 </body>
 </html>
\ No newline at end of file
diff --git a/tnc.css b/tnc.css
index 8986895d..52299225 100644
--- a/tnc.css
+++ b/tnc.css
@@ -87,7 +87,7 @@
     margin: 10px 0; }
     #terms-and-conditions .terms-and-conditions-section.grey {
       background-color: #f8f8fb; }
-    #terms-and-conditions .terms-and-conditions-section .section-title {
+    #terms-and-conditions .terms-and-conditions-section {
       color: #979797; }
   
   #about .about-section {
@@ -114,18 +114,7 @@
       height: 100px;
       margin-top: -50px; }
   
-  .title {
-    font-family: Lato;
-    font-weight: 100;
-    font-style: italic;
-    color: #979797;
-    margin-bottom: 30px; }
-  
-  .section-header {
-    font-family: Aller;
-    font-weight: bold;
-    color: #6e7fd8; }
-  
+
   .subtext {
     font-family: Lato;
     font-size: 18px;
@@ -144,4 +133,88 @@
         height: auto;
         margin-top: 0; }
     .how-to-image {
-      height: 200px; } }
\ No newline at end of file
+      height: 200px; } }
+
+    .container-fluid .logo {
+        width: 130px;
+        border-radius: 6px;
+        margin-top: 20px;
+        margin-left: 20px;
+    }
+    
+    .container.terms-container {
+        max-width: 70%;
+        margin: 0 auto;
+        padding: 20px;
+        background-color: #0e1525;
+        border-radius: 10px;
+        box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
+    }
+
+    .video-background {
+      position: fixed;
+      right: 0;
+      bottom: 0;
+      min-width: 100%;
+      min-height: 100%;
+      z-index: -1;
+      opacity: 0.3;
+  }
+
+    
+    .container-fluid .title {
+        font-size: 4.3em;
+        color: #0d94ba;
+        font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+        margin-bottom: 20px;
+        font-weight: 700;
+
+    }
+    
+    .container-fluid .section-title {
+        font-size: 2em;
+        color: #0dcaf0;
+        margin-top: 20px;
+    }
+    
+    .container-fluid .content p {
+        font-size: 1.2em;
+        line-height: 1.6;
+        color: #f0f0f0;
+        margin-bottom: 20px;
+    }
+    .text-center hr {
+      width: 50%;
+      color: #d56fa1;
+      opacity: 0.3;
+    }
+    
+    @media (max-width: 768px) {
+        .container-fluid .title {
+            font-size: 2em;
+        }
+    
+        .container-fluid .section-title {
+            font-size: 1.5em;
+        }
+    
+        .container-fluid .content p {
+            font-size: 1em;
+        }
+    }
+
+    body {
+      font-family: 'Lato', sans-serif;
+      /* background-color: #0e1525; */
+      background: linear-gradient(to top, #080f21, #06255b);
+      color: #ffffff;
+      margin: 0;
+      padding: 0;
+  }
+  .copyright-footer {
+    display: flex;
+    justify-content: center;
+    margin-top: 25px;
+    font-size: 17px;
+    color: rgb(185, 185, 185);
+  }
\ No newline at end of file
diff --git a/tnc.html b/tnc.html
index 2103f89e..3a1d7c89 100644
--- a/tnc.html
+++ b/tnc.html
@@ -13,84 +13,181 @@
 
     <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;
+    }
+</style>
    
   </head>
 
   <body id="terms-and-conditions">
+
+    <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>
+      <script>
+        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;
+          });
+  
+          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;
+  
+            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;
+  
+              x += (nextCircle.x - x) * 0.3;
+              y += (nextCircle.y - y) * 0.3;
+            });
+  
+            requestAnimationFrame(animateCircles);
+          }
+  
+          animateCircles();
+        });
+  
+      </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>
+  
+  <video autoplay muted loop class="video-background">
+    <source src="/img/bg video term3.mp4" type="video/mp4">
+     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">Terms and Conditions</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") operates Tourguide Platform (as defined below), your use of Tourguide Platform is governed by these Terms of Service (“Terms”), and your use of Tourguide Platform constitutes your acceptance of the Terms.
-
-                "Tourguide Platform" (the "Service") means Tourguide tourism management solution made available at https://apu52.github.io/Travel_Website/ and any other software, sites, and services offered by Tourguide in connection therewith but does not include any sites, services, products, or offerings governed by other terms of use, or, other agreements between you and Tourguide. "Traveler Data" means any data you make available to Tourguide or Tourguide Platform for the purpose of using Tourguide Platform. "Content" means all content generated by Tourguide on your behalf (including metric data) and does not include Traveler Data.
-                
-                We will endeavor to provide you with notice about major changes to the Terms or Tourguide Platform and other changes (via email to the address on your account), but we make no guarantees. Other changes could be, without limitation, changes to payment policies, security patches, added or removed functionality, and other enhancements or restrictions to Tourguide Platform. Your use of Tourguide Platform after the Terms have changed constitutes your acceptance of the Terms as changed. You may reject changes to the Terms by terminating your subscription in accordance with the "Cancellation and Termination" section of these Terms of Service. Tourguide shall not be liable to you or to any third party for any change to Tourguide Platform.
-                
-                Please use Tourguide Platform responsibly and in compliance with these Terms. If you don't, we reserve the right to terminate your subscription in accordance with the "Cancellation and Termination" section of these Terms of Service.
-            </p>
-
-            <h2 class="section-title">1. Use of Tourguide Platform</h2>
-            <p>
-                By accessing and utilizing Tourguide Platform, you agree to abide by these Terms of Service ("Terms") set forth by Tourguide, LLC ("Tourguide"). Your use of Tourguide Platform constitutes your acceptance of these Terms.
-
-                You are granted a non-exclusive, non-transferable, and revocable license to use Tourguide Platform for its intended purposes. Any unauthorized use or access may result in termination of your subscription.
-
-            </p>
-
-            <h2 class="section-title">2. Cancellation and Termination</h2>
-            <p>
-                Tourguide reserves the right to terminate or suspend your subscription to Tourguide Platform for any violation of these Terms. You may also terminate your subscription at any time by following the procedures outlined in this section.
-
-                Upon termination, you will lose access to Tourguide Platform, and Tourguide will not be liable for any loss of data or information. Fees paid for the subscription are non-refundable, except as expressly stated in these Terms.            </p>
-           
-
-            <h2 class="section-title">3. Traveller Data</h2>
-            <p>
-                "Traveler Data" refers to any data you provide to Tourguide for the purpose of using Tourguide Platform. Tourguide acknowledges that Traveler Data is owned by you, and Tourguide will take reasonable measures to protect and secure such data.
-
-                You grant Tourguide a limited license to use Traveler Data solely for the purpose of providing and improving Tourguide Platform. Tourguide will not disclose Traveler Data to third parties without your consent, except as required by law or as necessary for providing the services.            </p>
-            
-            <h2 class="section-title">4. Ideas and Feedback</h2>
-            <p>
-                Tourguide welcomes your ideas and feedback regarding Tourguide Platform. However, please be aware that any suggestions, ideas, or feedback you provide may be used by Tourguide without any obligation to compensate you. By submitting such content, you grant Tourguide a perpetual, irrevocable, worldwide, royalty-free license to use, modify, and distribute the ideas and feedback.            </p>
-
-            <h2 class="section-title">5. External Sites and Content</h2>
-            <p>
-                Tourguide Platform may contain links to external sites or content that are not owned or controlled by Tourguide. Tourguide is not responsible for the content or practices of these external sites and disclaims any liability for their actions. Your use of external sites is at your own risk.            </p>
-
-            <h2 class="section-title">6. License and Restrictions</h2>
-            <p>
-                Tourguide grants you a limited, non-exclusive, and non-transferable license to use Tourguide Platform in accordance with these Terms. You may not modify, reproduce, or distribute the software or content without express permission from Tourguide.
-
-                You agree not to engage in any unauthorized access, use, or interference with Tourguide Platform or its associated systems. Violation of these restrictions may result in the termination of your subscription and legal action.            </p>
-            
-
-            <h2 class="section-title">7. Open Source Software</h2>
-            <p>
-                Certain components of Tourguide Platform may be subject to open-source licenses. Your use of such components is governed by the respective open-source license terms. The terms of any open-source licenses do not override the terms specified in this agreement.            </p>
-
-
-            <h2 class="section-title">8. Our Copyright Dispute Policy</h2>
-            <p>
-                Tourguide respects the intellectual property rights of others and expects users of Tourguide Platform to do the same. If you believe that your copyrighted work has been used in a way that constitutes copyright infringement, please follow Tourguide's Copyright Dispute Policy, outlined in a separate document, to address and resolve such concerns.
-            </p>
-            
-
-            
-          </div>
+        <div class="row terms-and-conditions-section">
+            <div class="col-xs-12 text-center">
+                <h1 class="title">Terms and Conditions</h1>
+                <hr>
+            </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") operates Tourguide Platform (as defined below), your use of Tourguide Platform is governed by these Terms of Service (“Terms”), and your use of Tourguide Platform constitutes your acceptance of the Terms.
+                        "Tourguide Platform" (the "Service") means Tourguide tourism management solution made available at https://apu52.github.io/Travel_Website/ and any other software, sites, and services offered by Tourguide in connection therewith but does not include any sites, services, products, or offerings governed by other terms of use, or, other agreements between you and Tourguide. "Traveler Data" means any data you make available to Tourguide or Tourguide Platform for the purpose of using Tourguide Platform. "Content" means all content generated by Tourguide on your behalf (including metric data) and does not include Traveler Data.
+                        We will endeavor to provide you with notice about major changes to the Terms or Tourguide Platform and other changes (via email to the address on your account), but we make no guarantees. Other changes could be, without limitation, changes to payment policies, security patches, added or removed functionality, and other enhancements or restrictions to Tourguide Platform. Your use of Tourguide Platform after the Terms have changed constitutes your acceptance of the Terms as changed. You may reject changes to the Terms by terminating your subscription in accordance with the "Cancellation and Termination" section of these Terms of Service. Tourguide shall not be liable to you or to any third party for any change to Tourguide Platform.
+                        Please use Tourguide Platform responsibly and in compliance with these Terms. If you don't, we reserve the right to terminate your subscription in accordance with the "Cancellation and Termination" section of these Terms of Service.
+                    </p>
+
+                    <h2 class="section-title">1. Use of Tourguide Platform</h2>
+                    <p>
+                        By accessing and utilizing Tourguide Platform, you agree to abide by these Terms of Service ("Terms") set forth by Tourguide, LLC ("Tourguide"). Your use of Tourguide Platform constitutes your acceptance of these Terms.
+                        You are granted a non-exclusive, non-transferable, and revocable license to use Tourguide Platform for its intended purposes. Any unauthorized use or access may result in termination of your subscription.
+                    </p>
+
+                    <h2 class="section-title">2. Cancellation and Termination</h2>
+                    <p>
+                        Tourguide reserves the right to terminate or suspend your subscription to Tourguide Platform for any violation of these Terms. You may also terminate your subscription at any time by following the procedures outlined in this section.
+                        Upon termination, you will lose access to Tourguide Platform, and Tourguide will not be liable for any loss of data or information. Fees paid for the subscription are non-refundable, except as expressly stated in these Terms.
+                    </p>
+
+                    <h2 class="section-title">3. Traveller Data</h2>
+                    <p>
+                        "Traveler Data" refers to any data you provide to Tourguide for the purpose of using Tourguide Platform. Tourguide acknowledges that Traveler Data is owned by you, and Tourguide will take reasonable measures to protect and secure such data.
+                        You grant Tourguide a limited license to use Traveler Data solely for the purpose of providing and improving Tourguide Platform. Tourguide will not disclose Traveler Data to third parties without your consent, except as required by law or as necessary for providing the services.
+                    </p>
+
+                    <h2 class="section-title">4. Ideas and Feedback</h2>
+                    <p>
+                        Tourguide welcomes your ideas and feedback regarding Tourguide Platform. However, please be aware that any suggestions, ideas, or feedback you provide may be used by Tourguide without any obligation to compensate you. By submitting such content, you grant Tourguide a perpetual, irrevocable, worldwide, royalty-free license to use, modify, and distribute the ideas and feedback.
+                    </p>
+
+                    <h2 class="section-title">5. External Sites and Content</h2>
+                    <p>
+                        Tourguide Platform may contain links to external sites or content that are not owned or controlled by Tourguide. Tourguide is not responsible for the content or practices of these external sites and disclaims any liability for their actions. Your use of external sites is at your own risk.
+                    </p>
+
+                    <h2 class="section-title">6. License and Restrictions</h2>
+                    <p>
+                        Tourguide grants you a limited, non-exclusive, and non-transferable license to use Tourguide Platform in accordance with these Terms. You may not modify, reproduce, or distribute the software or content without express permission from Tourguide.
+                        You agree not to engage in any unauthorized access, use, or interference with Tourguide Platform or its associated systems. Violation of these restrictions may result in the termination of your subscription and legal action.
+                    </p>
+
+                    <h2 class="section-title">7. Open Source Software</h2>
+                    <p>
+                        Certain components of Tourguide Platform may be subject to open-source licenses. Your use of such components is governed by the respective open-source license terms. The terms of any open-source licenses do not override the terms specified in this agreement.
+                    </p>
+
+                    <h2 class="section-title">8. Our Copyright Dispute Policy</h2>
+                    <p>
+                        Tourguide respects the intellectual property rights of others and expects users of Tourguide Platform to do the same. If you believe that your copyrighted work has been used in a way that constitutes copyright infringement, please follow Tourguide's Copyright Dispute Policy, outlined in a separate document, to address and resolve such concerns.
+                    </p>
+                </div>
+            </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
diff --git a/trending.css b/trending.css
index bf3d4c55..247de9eb 100644
--- a/trending.css
+++ b/trending.css
@@ -50,7 +50,7 @@ div.niha{
 
 #button1 {
     color: black;
-    margin: 18px 18px 50px 680px;
+    margin: 18px 18px 50px 540px;
     transition: 1s;
     border: none;
     background-color:#C07F00;
@@ -63,6 +63,8 @@ div.niha{
     font-weight: bold;
     border-radius: 20px ;
     cursor: pointer;
+    box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px, rgba(255, 255, 255, 1) 0px 0px 10px;
+
    
 }
 
@@ -89,15 +91,19 @@ a {
 
 #container2 {
     text-align: center;
-    width: 1360px;
+    /* width:  1360px; */
+    width: 1159px;
     height: 500px;
     display: flex;
     flex-direction: row;
-    margin-left: 75px;
-    margin-right: 100px;
+    margin-left: 40px;
+    margin-right: 40px;
     margin-top:5px;
     margin-bottom: 110px;
+    box-sizing:border-box;
     border: 10 solid rgb(255, 130, 130);
+    /* align-items:center; */
+    justify-content:space-between;
 }
 
 #box5 {
@@ -109,6 +115,8 @@ a {
     margin-right: 10px;
     position: relative;
     border: 2px solid rgb(206, 9, 6);
+    box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px, rgba(255, 255, 255, 1) 0px 0px 10px;
+
 }
 
 #box5:hover {
@@ -116,6 +124,7 @@ a {
     border: 3px solid rgb(206, 9, 6);
     transition: 0.9s;
     box-shadow: rgb(206, 9, 6);
+   
 }
 
 #box6 {
@@ -129,6 +138,8 @@ a {
     position: relative;
     top: 45px;
     border: 2px solid rgb(206, 9, 6);
+    box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px, rgba(255, 255, 255, 1) 0px 0px 10px;
+
 
 }
 
@@ -136,6 +147,7 @@ a {
     transform: scale(1.1);
     border: 5px solid rgb(206, 9, 6);
     transition: 0.9s;
+   
 }
 
 #box7 {
@@ -150,6 +162,8 @@ a {
     top: 80px;
     text-align: center;
     border: 2px solid rgb(206, 9, 6);
+    box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px, rgba(255, 255, 255, 1) 0px 0px 10px;
+
 
 
 
@@ -159,6 +173,7 @@ a {
     transform: scale(1.1);
     border: 5px solid rgb(206, 9, 6);
     transition: 0.9s;
+   
 }
 
 #box8 {
@@ -172,6 +187,9 @@ a {
     position: relative;
     top: 45px;
     border: 2px solid rgb(206, 9, 6);
+    box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px, rgba(255, 255, 255, 1) 0px 0px 10px;
+
+  
     
 }
 
@@ -180,7 +198,6 @@ a {
     border: 5px solid rgb(206, 9, 6);
     transition: 0.9s;
 }
-
 #box9 {
     background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRPF21UstFZ23Hy_Kfnad_8zlAcnMohJLuoBg&s");
     background-size: cover;
@@ -191,13 +208,16 @@ a {
     margin-left: 10px;
     position: relative;
     border: 2px solid rgb(206, 9, 6);
+    box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px, rgba(255, 255, 255, 1) 0px 0px 10px;
 
+   
 }
 
 #box9:hover {
     transform: scale(1.1);
     border: 5px solid rgb(206, 9, 6);
     transition: 0.9s;
+  
 }
 #text1{
     color: #c84d4d;