feat: redesign donation section (#505)

* feat: redesign donation section

* color correction

css/airspace.css

@@ -245,6 +245,42 @@ font header .navbar-default .navbar-nav li a:hover {
   font-size: 14px;
   line-height: 1.8;
 }
+
+#donation{
+  background-color: #474354;
+  color: white;
+  padding: 60px 0;
+  margin: 2rem 1.5rem;
+  border-radius: 10px;
+}
+#donation h1{
+  font-size: 2.5rem;
+  font-weight: bold;
+  margin-bottom: 20px;
+}
+#donation button {
+  background-color:#fbd04f;
+  margin: 2rem 0px;
+  color: black;
+  font-size: 1.1rem;
+  font-weight: 600;
+  padding: 12px 24px;
+  border: none;
+  border-radius: 50px;
+  cursor: pointer;
+  transition: background-color 0.3s ease;
+}
+#donation button:hover {
+  background-color: #ffbf00;
+}
+#donation a {
+  color: #3498db;
+  text-decoration: underline;
+}
+#donation a:hover {
+  color: #0099ff;
+}
+
 /*--
   call-to-action Start
 --*/

index.html

@@ -543,32 +543,21 @@ <h3>Check out the remaining hundreds of activities!</h3>
 </section>
 
 <!-- Donate -->
-<section id="testimonial" class="customPadding5">
+<section id="donation">
   <div class="container">
-    <div class="row">
-      <div class="col-md-12" >
-        <div class="row justify-content-center">
-          <div class="col-md-8 col-md-push-2" >
-            <div class="section-title text-center">	    
-	      <br>
-	      <h3 >INTERESTED IN MAKING A DONATION?</h3>
-	      <p>Are you able to make a one-time or reoccurring
-		(tax-deductable) donation?</p>
-	      <form action="https://www.paypal.com/donate" method="post" target="_top">
-		<input type="hidden" name="hosted_button_id" value="V9SNCQGVEFM2Q" />
-		<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif" border="0" name="submit" title="PayPal - The safer, easier way to pay online!" alt="Donate with PayPal button" />
-		<img alt="" border="0" src="https://www.paypal.com/en_US/i/scr/pixel.gif" width="1" height="1" />
-	      </form>
-	      <br>
-	      <p>Want to read more about what your donation means? Learn
-		more on our <a href="{{ site.baseurl }}/donate">donate</a>
-		page.</p>
-	      <a href="{{ site.baseurl }}/donate"><button type="button" class="btn bt-raised btn-custom bt customMargin4" >Read about donations!</button></a>
-	    </div>
-	  </div>
-	</div>
-      </div>
+    <div class="text-center">
+      <h1>INTERESTED IN MAKING A DONATION?</h2>
+      <h6>Are you able to make a one-time or recurring (tax-deductible) donation?</h3>
+      <form action="https://www.paypal.com/donate" method="post" target="_top">
+        <input type="hidden" name="hosted_button_id" value="V9SNCQGVEFM2Q"/>
+        <button type="submit">Donate with PayPal</button>
+      </form>
+      <p>
+        Want to read more about what your donation means? 
+        <a href="{{ site.baseurl }}/donate">Learn more on our donate page</a>.
+      </p>
     </div>
+  </div>
 </section>
 
 <!-- "Integration and inquiry" section --><!-- Change this to "contact us now"???-->