Created new subscribe section

Issue resolved: anuragverma108#3308

index.html

@@ -3585,6 +3585,101 @@ <h4>How do I ensure the safety and security of my personal information on SwapRe
       </div>
     </div>
   </div>
+  <style>
+  .newsletter {
+            width: 100%;
+            max-width: 875px;
+            margin: 50px auto;
+            background-color:  #f48a8a ;
+            padding: 20px;
+            border-radius: 10px;
+            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+  }
+  .newsletter h1 {
+            text-align: center;
+            color: rgb(255, 247, 247);
+            font-size: 25px;
+        }
+
+  .newsletter p {
+    text-align: center;
+    color: rgb(245, 8, 8);
+    font-size: 15px;
+  }
+
+
+        form {
+            display: flex;
+            flex-direction: column;
+            gap: 15px;
+        }
+        input[type="email"], input[type="text"] {
+            width: 100%;
+            padding: 10px;
+            border: 1px solid rgb(251, 243, 243);
+            border-radius: 5px;
+            font-size: 16px;
+        }
+        subscribe {
+            padding: 10px;
+            background-color: white;
+            color: rgb(251, 162, 177);
+            border: none;
+            border-radius: 5px;
+            font-size: 25px;
+            cursor: pointer;
+        }
+        .subscribe:hover {
+  background: linear-gradient(hwb(357 6% 36%), #d26d6d);
+  transform: scale(1.1);
+}
+       subscribe:active {
+        transform: scale(0.98);
+       }
+       subscribe:focus {
+        outline: none;
+       }
+
+        .newsletter:hover {
+  background: linear-gradient(hwb(357 68% 7%), #d26d6d);
+
+}
+</style>
+
+<!--<script>
+  function showSuccessMessage() 
+  {
+    // Show success message
+    const successMessage = document.getElementById('successMessage');
+    successMessage.innerHTML = "Thank you for subscribing!";
+    successMessage.style.display = 'block';
+
+    // Reset the form after 3 seconds
+    setTimeout(function() 
+    {
+        document.getElementById('newsletterForm').reset();
+        successMessage.style.display = 'none';
+        
+    }, 3000);
+
+    return false; 
+}
+</script>-->
+
+  <div class="newsletter">
+        <h1>Subscribe to Our Newsletter</h1>
+        <p>Stay updated with our latest news and offers</p>
+
+        <form id="newsform" onsubmit="return showSuccessMessage();">
+            <input type="text" id="name" placeholder="Your Name" required>
+            <input type="email" id="email" placeholder="Your Email Address" required>
+            <input type="submit" value="Subscribe" name="subscribe" class="subscribe" id="subs">
+        </form>
+        <div id="successmessage" style="display: none;">Thank you for subscribing!</div>
+    </div>
+
+
+
 
   <script>
     document.addEventListener('DOMContentLoaded', () => {
@@ -3772,66 +3867,8 @@ <h2 style="margin-left: 2rem; margin-top: 2.75rem;">Quick Links</h2>
 
 
 </script>
-<style>
-
-.subscribe {
-  background-color: #A30F17;
-  color: white; 
-  border: none; 
-  padding: 1rem 2rem; 
-  font-size: 1.6rem; 
-  font-family: Arial, sans-serif;
-  border-radius: 0.5rem; 
-  cursor: pointer; 
-  transition: background-color 0.3s, transform 0.2s;
-}
 
-.subscribe:hover {
-  background: linear-gradient(hwb(357 6% 36%), #d26d6d);
-  transform: scale(1.1);
-}
-
-.subscribe:active {
-  transform: scale(0.98); 
-}
-
-.subscribe:focus {
-  outline: none; 
-}
-
-</style>
-
-<!--<script>
-  function showConfirmationMessage() 
-  {
-    // Show confirmation message
-    const confirmationMessage = document.getElementById('confirmationMessage');
-    confirmationMessage.innerHTML = "Thank you for subscribing!";
-    confirmationMessage.style.display = 'block';
-
-    // Reset the form after 3 seconds
-    setTimeout(function() 
-    {
-        document.getElementById('newsletterForm').reset();
-        confirmationMessage.style.display = 'none';
-        
-    }, 3000);
-
-    return false; 
-}
-</script>-->
-        <div class="foot-right">
-        <h2 style="margin-bottom: 2.4rem; margin-top:0.5rem;">Stay Connected</h2>
-        <form id="newsform" onsubmit="return showConfirmationMessage();">
-            <label for="new-email" class="news-form">Subscribe to our Newsletter</label>
-            <div class="row-flex display-flex">
-                <input class="finput" type="email" id="new-email" name="email" placeholder="Email address"
-                      pattern="[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}\.com$"
-                      title="Please enter a valid email address that ends with '.com'" required>
-                <input type="submit" value="Subscribe" name="subscribe" class="subscribe" id="subs">
-            </div>
-        </form>
-        <div id="confirmationmessage" style="display: none;">Thank you for subscribing!</div>
+
         <div class="icons">
           <!-- Discord icon -->
           <a href="https://www.discord.com/" target="_blank">