diff --git a/FAQs.html b/FAQs.html
index 5bb5e8b..eaf542f 100644
--- a/FAQs.html
+++ b/FAQs.html
@@ -13,6 +13,57 @@
     />
 
     <style>
+
+      /* General Body Styling */
+
+    body {
+
+cursor: none; /* Hide the default cursor */
+
+}
+
+/* Cursor Tail Effect - the small dots trailing behind */
+.cursor-tail {
+
+position: absolute;
+width: 11px;  /* Small dot */
+height: 11px;
+background-color: rgba(63, 228, 253, 0.8); /* Neon green tail */
+border-radius: 50%;
+pointer-events: none; /* Ensure the trail doesn't interfere with clicks */
+z-index: 9999;
+transform: translate(-50%, -50%);
+animation: trail 0.5s forwards;
+
+}
+
+/* Tail Effect Animation - Fades and shrinks */
+@keyframes trail {
+
+0% {
+  transform: scale(1) translate(-50%, -50%);
+  opacity: 1;
+}
+100% {
+  transform: scale(0) translate(-50%, -50%);
+  opacity: 0;
+}
+
+}
+
+/* Sample content to make sure scrolling works */
+.content {
+
+height: 200vh; /* Make the page taller to enable scrolling */
+display: flex;
+flex-direction: column;
+align-items: center;
+justify-content: center;
+
+}
+
+
+
       /* Custom Scrollbar */
       html::-webkit-scrollbar {
         width: 12px;
@@ -465,5 +516,34 @@ <h2 onclick="toggleAnswer(this)">
       domain="www.chatbase.co"
       defer
     ></script>
+
+    <script>
+      // Create a trailing dot element dynamically
+      function createTrailDot(x, y) {
+        const trailDot = document.createElement('div');
+        trailDot.classList.add('cursor-tail');
+        trailDot.style.left = `${x}px`;
+        trailDot.style.top = `${y}px`;
+        document.body.appendChild(trailDot);
+
+        // Remove the trail dot after the animation completes (0.5s)
+        setTimeout(() => {
+          trailDot.remove();
+        }, 500); // Match the duration of the animation in CSS
+      }
+
+      // Function to move the cursor and generate trailing dots
+      function moveCursor(event) {
+        const x = event.pageX;
+        const y = event.pageY;
+
+        // Create a new trail dot at the cursor position
+        createTrailDot(x, y);
+      }
+
+      // Listen to mousemove event to trigger the cursor and trail
+      document.addEventListener('mousemove', moveCursor);
+    </script>
+    
   </body>
 </html>
diff --git a/contributors.html b/contributors.html
index 4879439..3d05357 100644
--- a/contributors.html
+++ b/contributors.html
@@ -10,6 +10,60 @@
 </head>
 <body>
 
+  <style>
+
+
+      /* General Body Styling */
+
+      body {
+
+cursor: none; /* Hide the default cursor */
+
+}
+
+/* Cursor Tail Effect - the small dots trailing behind */
+.cursor-tail {
+
+position: absolute;
+width: 11px;  /* Small dot */
+height: 11px;
+background-color: rgba(63, 228, 253, 0.8); /* Neon green tail */
+border-radius: 50%;
+pointer-events: none; /* Ensure the trail doesn't interfere with clicks */
+z-index: 9999;
+transform: translate(-50%, -50%);
+animation: trail 0.5s forwards;
+
+}
+
+/* Tail Effect Animation - Fades and shrinks */
+@keyframes trail {
+
+0% {
+  transform: scale(1) translate(-50%, -50%);
+  opacity: 1;
+}
+100% {
+  transform: scale(0) translate(-50%, -50%);
+  opacity: 0;
+}
+
+}
+
+/* Sample content to make sure scrolling works */
+.content {
+
+height: 200vh; /* Make the page taller to enable scrolling */
+display: flex;
+flex-direction: column;
+align-items: center;
+justify-content: center;
+
+}
+
+
+
+  </style>
     <!-- on scroll progress bar -->
   <div class="progress-bar-container">
     <div class="progress-bar" id="progress-bar-cn"></div>
@@ -72,5 +126,36 @@ <h1 class="title">Our Contributors</h1>
   </style>
 
   <script src="./contributors.js"></script>
+
+  
+<script>
+  // Create a trailing dot element dynamically
+  function createTrailDot(x, y) {
+    const trailDot = document.createElement('div');
+    trailDot.classList.add('cursor-tail');
+    trailDot.style.left = `${x}px`;
+    trailDot.style.top = `${y}px`;
+    document.body.appendChild(trailDot);
+
+    // Remove the trail dot after the animation completes (0.5s)
+    setTimeout(() => {
+      trailDot.remove();
+    }, 500); // Match the duration of the animation in CSS
+  }
+
+  // Function to move the cursor and generate trailing dots
+  function moveCursor(event) {
+    const x = event.pageX;
+    const y = event.pageY;
+
+    // Create a new trail dot at the cursor position
+    createTrailDot(x, y);
+  }
+
+  // Listen to mousemove event to trigger the cursor and trail
+  document.addEventListener('mousemove', moveCursor);
+</script>
+
+
 </body>
 </html>
diff --git a/donation_page.html b/donation_page.html
index 9291696..446af13 100644
--- a/donation_page.html
+++ b/donation_page.html
@@ -9,6 +9,60 @@
       href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css"
     />
     <style>
+
+      
+
+      /* General Body Styling */
+
+      body {
+
+cursor: none; /* Hide the default cursor */
+
+}
+
+/* Cursor Tail Effect - the small dots trailing behind */
+.cursor-tail {
+
+position: absolute;
+width: 11px;  /* Small dot */
+height: 11px;
+background-color: rgba(63, 228, 253, 0.8); /* Neon green tail */
+border-radius: 50%;
+pointer-events: none; /* Ensure the trail doesn't interfere with clicks */
+z-index: 9999;
+transform: translate(-50%, -50%);
+animation: trail 0.5s forwards;
+
+}
+
+/* Tail Effect Animation - Fades and shrinks */
+@keyframes trail {
+
+0% {
+  transform: scale(1) translate(-50%, -50%);
+  opacity: 1;
+}
+100% {
+  transform: scale(0) translate(-50%, -50%);
+  opacity: 0;
+}
+
+}
+
+/* Sample content to make sure scrolling works */
+.content {
+
+height: 200vh; /* Make the page taller to enable scrolling */
+display: flex;
+flex-direction: column;
+align-items: center;
+justify-content: center;
+
+}
+
+
+
+
       @keyframes float {
         0% {
           transform: translateY(0px);
@@ -961,5 +1015,38 @@ <h2 id="modalTitle">Become a Supporter</h2>
         `;
       document.head.appendChild(style);
     </script>
+
+    
+  
+<script>
+  // Create a trailing dot element dynamically
+  function createTrailDot(x, y) {
+    const trailDot = document.createElement('div');
+    trailDot.classList.add('cursor-tail');
+    trailDot.style.left = `${x}px`;
+    trailDot.style.top = `${y}px`;
+    document.body.appendChild(trailDot);
+
+    // Remove the trail dot after the animation completes (0.5s)
+    setTimeout(() => {
+      trailDot.remove();
+    }, 500); // Match the duration of the animation in CSS
+  }
+
+  // Function to move the cursor and generate trailing dots
+  function moveCursor(event) {
+    const x = event.pageX;
+    const y = event.pageY;
+
+    // Create a new trail dot at the cursor position
+    createTrailDot(x, y);
+  }
+
+  // Listen to mousemove event to trigger the cursor and trail
+  document.addEventListener('mousemove', moveCursor);
+</script>
+
+
+
   </body>
 </html>
diff --git a/feedback.html b/feedback.html
index 1f807cb..c8cd517 100644
--- a/feedback.html
+++ b/feedback.html
@@ -9,6 +9,60 @@
   <link rel="stylesheet" href="feedback.css" />
 </head>
 
+<style>
+
+        /* General Body Styling */
+
+        body {
+
+cursor: none; /* Hide the default cursor */
+
+}
+
+/* Cursor Tail Effect - the small dots trailing behind */
+.cursor-tail {
+
+position: absolute;
+width: 11px;  /* Small dot */
+height: 11px;
+background-color: rgba(63, 228, 253, 0.8); /* Neon green tail */
+border-radius: 50%;
+pointer-events: none; /* Ensure the trail doesn't interfere with clicks */
+z-index: 9999;
+transform: translate(-50%, -50%);
+animation: trail 0.5s forwards;
+
+}
+
+/* Tail Effect Animation - Fades and shrinks */
+@keyframes trail {
+
+0% {
+  transform: scale(1) translate(-50%, -50%);
+  opacity: 1;
+}
+100% {
+  transform: scale(0) translate(-50%, -50%);
+  opacity: 0;
+}
+
+}
+
+/* Sample content to make sure scrolling works */
+.content {
+
+height: 200vh; /* Make the page taller to enable scrolling */
+display: flex;
+flex-direction: column;
+align-items: center;
+justify-content: center;
+
+}
+
+
+
+
+</style>
 <body class="space-bg min-h-screen text-white">
 
   <!-- on scroll progress bar -->
@@ -292,6 +346,36 @@
 
 
   </script>
+
+
+<script>
+  // Create a trailing dot element dynamically
+  function createTrailDot(x, y) {
+    const trailDot = document.createElement('div');
+    trailDot.classList.add('cursor-tail');
+    trailDot.style.left = `${x}px`;
+    trailDot.style.top = `${y}px`;
+    document.body.appendChild(trailDot);
+
+    // Remove the trail dot after the animation completes (0.5s)
+    setTimeout(() => {
+      trailDot.remove();
+    }, 500); // Match the duration of the animation in CSS
+  }
+
+  // Function to move the cursor and generate trailing dots
+  function moveCursor(event) {
+    const x = event.pageX;
+    const y = event.pageY;
+
+    // Create a new trail dot at the cursor position
+    createTrailDot(x, y);
+  }
+
+  // Listen to mousemove event to trigger the cursor and trail
+  document.addEventListener('mousemove', moveCursor);
+</script>
+
 </body>
 
 </html>
\ No newline at end of file
diff --git a/login.css b/login.css
index 9376241..7655ae5 100644
--- a/login.css
+++ b/login.css
@@ -442,4 +442,45 @@ form.sign-in-form {
   pointer-events: none;
   z-index: 99999999;
   /* Stays on top of all elements */
-}
\ No newline at end of file
+}
+
+
+
+      /* General Body Styling */
+
+      body {
+
+cursor: none; /* Hide the default cursor */
+
+}
+
+/* Cursor Tail Effect - the small dots trailing behind */
+.cursor-tail {
+
+position: absolute;
+width: 11px;  /* Small dot */
+height: 11px;
+background-color: rgba(63, 228, 253, 0.8); /* Neon green tail */
+border-radius: 50%;
+pointer-events: none; /* Ensure the trail doesn't interfere with clicks */
+z-index: 9999;
+transform: translate(-50%, -50%);
+animation: trail 0.5s forwards;
+
+}
+
+/* Tail Effect Animation - Fades and shrinks */
+@keyframes trail {
+
+0% {
+  transform: scale(1) translate(-50%, -50%);
+  opacity: 1;
+}
+100% {
+  transform: scale(0) translate(-50%, -50%);
+  opacity: 0;
+}
+
+}
+
+
diff --git a/login.html b/login.html
index 5d18ffb..5b9bc3c 100644
--- a/login.html
+++ b/login.html
@@ -27,27 +27,7 @@
       </div>
     </div>
   </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="container">
     <div class="forms-container">
       <div class="signin-signup">
@@ -452,6 +432,39 @@ <h3>One of us ?</h3>
   </script>
   <script src="https://apis.google.com/js/platform.js" async defer></script>
   <!-- <script src="Firebase.js" type="module"></script> -->
+
+
+    
+  
+<script>
+  // Create a trailing dot element dynamically
+  function createTrailDot(x, y) {
+    const trailDot = document.createElement('div');
+    trailDot.classList.add('cursor-tail');
+    trailDot.style.left = `${x}px`;
+    trailDot.style.top = `${y}px`;
+    document.body.appendChild(trailDot);
+
+    // Remove the trail dot after the animation completes (0.5s)
+    setTimeout(() => {
+      trailDot.remove();
+    }, 500); // Match the duration of the animation in CSS
+  }
+
+  // Function to move the cursor and generate trailing dots
+  function moveCursor(event) {
+    const x = event.pageX;
+    const y = event.pageY;
+
+    // Create a new trail dot at the cursor position
+    createTrailDot(x, y);
+  }
+
+  // Listen to mousemove event to trigger the cursor and trail
+  document.addEventListener('mousemove', moveCursor);
+</script>
+
+
 </body>
 
 </html>
\ No newline at end of file
diff --git a/privacy_policy.html b/privacy_policy.html
index c9938cc..d1d8c15 100644
--- a/privacy_policy.html
+++ b/privacy_policy.html
@@ -8,6 +8,59 @@
   <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap" rel="stylesheet">
   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css">
   <style>
+
+    
+
+      /* General Body Styling */
+
+      body {
+
+cursor: none; /* Hide the default cursor */
+
+}
+
+/* Cursor Tail Effect - the small dots trailing behind */
+.cursor-tail {
+
+position: absolute;
+width: 11px;  /* Small dot */
+height: 11px;
+background-color: rgba(63, 228, 253, 0.8); /* Neon green tail */
+border-radius: 50%;
+pointer-events: none; /* Ensure the trail doesn't interfere with clicks */
+z-index: 9999;
+transform: translate(-50%, -50%);
+animation: trail 0.5s forwards;
+
+}
+
+/* Tail Effect Animation - Fades and shrinks */
+@keyframes trail {
+
+0% {
+  transform: scale(1) translate(-50%, -50%);
+  opacity: 1;
+}
+100% {
+  transform: scale(0) translate(-50%, -50%);
+  opacity: 0;
+}
+
+}
+
+/* Sample content to make sure scrolling works */
+.content {
+
+height: 200vh; /* Make the page taller to enable scrolling */
+display: flex;
+flex-direction: column;
+align-items: center;
+justify-content: center;
+
+}
+
+
+
     body {
       font-family: 'Roboto', sans-serif;
       line-height: 1.6;
@@ -337,6 +390,39 @@ <h2>6. Contact Us</h2>
       </div>
       <!-- Copyright -->
     </footer>
+
+    
+  
+<script>
+  // Create a trailing dot element dynamically
+  function createTrailDot(x, y) {
+    const trailDot = document.createElement('div');
+    trailDot.classList.add('cursor-tail');
+    trailDot.style.left = `${x}px`;
+    trailDot.style.top = `${y}px`;
+    document.body.appendChild(trailDot);
+
+    // Remove the trail dot after the animation completes (0.5s)
+    setTimeout(() => {
+      trailDot.remove();
+    }, 500); // Match the duration of the animation in CSS
+  }
+
+  // Function to move the cursor and generate trailing dots
+  function moveCursor(event) {
+    const x = event.pageX;
+    const y = event.pageY;
+
+    // Create a new trail dot at the cursor position
+    createTrailDot(x, y);
+  }
+
+  // Listen to mousemove event to trigger the cursor and trail
+  document.addEventListener('mousemove', moveCursor);
+</script>
+
+
+
   </body>
   <script>
 
diff --git a/welcometestimonials.html b/welcometestimonials.html
index c481485..96d0b9d 100644
--- a/welcometestimonials.html
+++ b/welcometestimonials.html
@@ -11,6 +11,59 @@
         crossorigin="anonymous" referrerpolicy="no-referrer" />
     <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap" rel="stylesheet">
     <style>
+
+
+      /* General Body Styling */
+
+      body {
+
+cursor: none; /* Hide the default cursor */
+
+}
+
+/* Cursor Tail Effect - the small dots trailing behind */
+.cursor-tail {
+
+position: absolute;
+width: 11px;  /* Small dot */
+height: 11px;
+background-color: rgba(63, 228, 253, 0.8); /* Neon green tail */
+border-radius: 50%;
+pointer-events: none; /* Ensure the trail doesn't interfere with clicks */
+z-index: 9999;
+transform: translate(-50%, -50%);
+animation: trail 0.5s forwards;
+
+}
+
+/* Tail Effect Animation - Fades and shrinks */
+@keyframes trail {
+
+0% {
+  transform: scale(1) translate(-50%, -50%);
+  opacity: 1;
+}
+100% {
+  transform: scale(0) translate(-50%, -50%);
+  opacity: 0;
+}
+
+}
+
+/* Sample content to make sure scrolling works */
+.content {
+
+height: 200vh; /* Make the page taller to enable scrolling */
+display: flex;
+flex-direction: column;
+align-items: center;
+justify-content: center;
+
+}
+
+
+
+
         body {
             margin: 0;
             overflow: hidden;
@@ -108,19 +161,8 @@
             outline: none;
         }
 
-        /* Circle styles */
-        .circle {
-            height: 24px;
-            width: 24px;
-            border-radius: 50%;
-            background-color: black;
-            position: fixed;
-            top: 0;
-            left: 0;
-            pointer-events: none;
-            z-index: 99999999;
-            transition: transform 0.1s ease-out;
-        }
+        
+    
         .counter-container {
         position: absolute;
         bottom: 30px;
@@ -309,6 +351,39 @@ <h1 class="welcome-title">Welcome to Alien-Invasion-Defense Testimonials</h1>
 
         animateCircles();
     </script>
+
+
+
+<script>
+    // Create a trailing dot element dynamically
+    function createTrailDot(x, y) {
+      const trailDot = document.createElement('div');
+      trailDot.classList.add('cursor-tail');
+      trailDot.style.left = `${x}px`;
+      trailDot.style.top = `${y}px`;
+      document.body.appendChild(trailDot);
+  
+      // Remove the trail dot after the animation completes (0.5s)
+      setTimeout(() => {
+        trailDot.remove();
+      }, 500); // Match the duration of the animation in CSS
+    }
+  
+    // Function to move the cursor and generate trailing dots
+    function moveCursor(event) {
+      const x = event.pageX;
+      const y = event.pageY;
+  
+      // Create a new trail dot at the cursor position
+      createTrailDot(x, y);
+    }
+  
+    // Listen to mousemove event to trigger the cursor and trail
+    document.addEventListener('mousemove', moveCursor);
+  </script>
+
+
+
 </body>
 
 </html>
