diff --git a/apply/index.php b/apply/index.php
index 9372d5a..87a79e6 100644
--- a/apply/index.php
+++ b/apply/index.php
@@ -3,96 +3,114 @@
     include 'header.php'; 
 ?>
 
-<!--Property Rented (or not) Row 1-->
-<div class="row justify-content-center text-center m-2 row-cols-3">
-<!--    <h1>Nothing for now!</h1> -->
-    <!-- <div class="col">
-        <a href="p/shankle.php"><img src="pics/shankle/shankle_front_3_perc.webp" class="d-block w-100" alt="Shankle Road"></a>
-        Shankle Road: <b>Unavailable</b>
-    </div> -->
- <!--    <div class="col">
-       <a href="p/barn.php"><img src="pics/barn/barn_front_0_perc.webp" class="d-block w-100" alt="Barn Apartment"></a>
-        Barn Apartment <b>Available</b>
-    </div> -->
+<!-- Property Grid -->
+<section class="container py-3">
+  <div class="row justify-content-center">
+    <div class="col-12 col-lg-10">
+      <div class="row g-3 row-cols-1 row-cols-sm-2 row-cols-md-3 text-center">
 
-    <div class="col">
-    <a href="p/firethorn.php"><img src="pics/firethorn/firethorn1.jpeg" class="d-block w-100" alt="Firethorn Way"></a>
-        Firethorn Way <b>Available</b>
-    </div> 
-
-    <div class="col">
-    <a href="p/rocksprings-b.php"><img src="pics/rocksprings/rocksprings-front-72-perc.webp" class="d-block w-100" alt="Rocksprings B"></a>
-        Rocksprings B: <b>Available</b>
-    </div> 
- <!--     <div class="col">
-       <a href="p/cottage.php"> <img src="pics/cottage/cottage_front_0_perc.webp" class="d-block w-100" alt="Barn Cottage"></a>
-        Barn Cottage: <b>Available</b>
-    </div> -->
-
-    <!-- <div class="col">
-       <a href="p/cotton.php"> <img src="pics/cotton/cotton_front_0_perc.webp" class="d-block w-100" alt="Cotton Street"></a>
-        Cotton Street: <b>Unavailable</b>
-    </div> -->
-
-<!-- Row 2 -->
-    <!-- <div class="col">
-       <a href="p/b.php"> <img src="pics/b/signal-2021-04-09-011605_001.jpeg" class="d-block w-100" alt="Trailer Lot B"></a>
-        Trailer Lot B: <b>Unavailable</b>
-    </div> -->
-<!--
-    <div class="col">
-       <a href="p/d.php"> <img src="pics/d/lot-d-front-20-perc.webp" class="d-block w-100" alt="Trailer Lot D"></a>
-        Trailer Lot D
-    </div> --> 
-    <!-- <div class="col">
-       <a href="p/e.php"> <img src="pics/e/lot-e-72-perc.webp" class="d-block w-100" alt="Trailer Lot E"></a>
-        Trailer Lot E: <b>Unavailable</b>
-    </div> -->
-
-<!-- Row 3 -->
-    <!-- <div class="col">
-    <a href="p/rocksprings-a.php"><img src="pics/rocksprings/rocksprings-front-72-perc.webp" class="d-block w-100" alt="Rocksprings A"></a>
-        Rocksprings A: <b>Unavailable</b>
-    </div> -->
-</div> 
-
-    <!--Icons Row-->
-  <div class="row justify-content-center text-center m-4">
-    <div class="col py-1">
-        <div class="card bg-info text-white">
-            <img class="card-img" src="pics\icons\apply.jpg" alt="Application Clipboard">
-            <div class="card-body">
-                <a href="app.php" class="stretched-link h5">Application</a>
+        <!-- Firethorn -->
+        <div class="col">
+          <a href="p/firethorn.php" class="text-decoration-none">
+            <div class="card h-100 shadow-sm">
+              <div class="ratio ratio-4x3">
+                <img 
+                  src="pics/firethorn/firethorn1.jpeg" 
+                  class="object-fit-cover rounded-top" 
+                  alt="Firethorn Way" 
+                  loading="lazy">
+              </div>
+              <div class="card-body">
+                <div class="fw-semibold">Firethorn Way</div>
+                <div class="text-success fw-semibold small">Available</div>
+              </div>
             </div>
+          </a>
         </div>
+
+        <!-- Rocksprings B -->
+        <div class="col">
+          <a href="p/rocksprings-b.php" class="text-decoration-none">
+            <div class="card h-100 shadow-sm">
+              <div class="ratio ratio-4x3">
+                <img 
+                  src="pics/rocksprings/rocksprings-front-72-perc.webp" 
+                  class="object-fit-cover rounded-top" 
+                  alt="Rocksprings B" 
+                  loading="lazy">
+              </div>
+              <div class="card-body">
+                <div class="fw-semibold">Rocksprings B</div>
+                <div class="text-success fw-semibold small">Available</div>
+              </div>
+            </div>
+          </a>
+        </div>
+
+        <!-- (Keep any future properties in this same card pattern)
+        <div class="col">
+          <a href="p/xyz.php" class="text-decoration-none">
+            <div class="card h-100 shadow-sm">
+              <div class="ratio ratio-4x3">
+                <img src="pics/xyz/cover.webp" class="object-fit-cover rounded-top" alt="XYZ" loading="lazy">
+              </div>
+              <div class="card-body">
+                <div class="fw-semibold">XYZ Address</div>
+                <div class="text-muted fw-semibold small">Unavailable</div>
+              </div>
+            </div>
+          </a>
+        </div>
+        -->
+
+      </div>
     </div>
-    <!-- <div class="col-sm-2 py-1">
-        <div class="card bg-info text-success" >
-            <img class="card-img" src="pics\icons\house.jpg" alt="House">
-            <div class="card-body">
-                <a href="property.php" class="stretched-link h5">Property Details</a>
-            </div>
-        </div>  
-    </div> -->
-    <div class="col py-1">
-        <div class="card bg-info text-secondary">
-            <img class="card-img" src="pics\icons\ticket.jpg" alt="Ticket">
-            <div class="card-body">
-                <a href="maintenance.php" class="stretched-link h5">Submit A Ticket</a>
-            </div>
-        </div>
-    </div>
-    <!-- <div class="col py-1">
-        <div class="card bg-info text-warning">
-            <img class="card-img" src="pics\icons\faq.jpg" alt="List of Questions">
-            <div class="card-body">
-                <a href="application.php" class="stretched-link h5">FAQ</a>
-            </div>
-        </div>
-    </div> -->
   </div>
+</section>
 
+<!-- Quick Actions (compact on mobile) -->
+<section class="container pb-4 pt-2">
+  <div class="row justify-content-center">
+    <div class="col-12 col-lg-8">
+      <div class="row g-3 justify-content-center">
 
+        <!-- Application -->
+        <div class="col-6 col-sm-5 col-md-4">
+          <a href="app.php" class="btn btn-primary w-100 py-3 d-flex align-items-center justify-content-center gap-2 shadow-sm">
+            <img 
+              src="pics/icons/apply.jpg" 
+              alt="Application Icon" 
+              width="28" height="28" 
+              class="rounded-circle object-fit-cover">
+            <span class="fw-semibold">Application</span>
+          </a>
+        </div>
+
+        <!-- Submit a Ticket -->
+        <div class="col-6 col-sm-5 col-md-4">
+          <a href="maintenance.php" class="btn btn-outline-primary w-100 py-3 d-flex align-items-center justify-content-center gap-2 shadow-sm">
+            <img 
+              src="pics/icons/ticket.jpg" 
+              alt="Ticket Icon" 
+              width="28" height="28" 
+              class="rounded-circle object-fit-cover">
+            <span class="fw-semibold">Submit a Ticket</span>
+          </a>
+        </div>
+
+        <!-- (Optional future quick action example)
+        <div class="col-6 col-sm-5 col-md-4">
+          <a href="property.php" class="btn btn-light w-100 py-3 d-flex align-items-center justify-content-center gap-2 border shadow-sm">
+            <img src="pics/icons/house.jpg" alt="House Icon" width="28" height="28" class="rounded-circle object-fit-cover">
+            <span class="fw-semibold">Property Details</span>
+          </a>
+        </div>
+        -->
+
+      </div>
+    </div>
+  </div>
+</section>
 
 <?php 
     include 'footer.php';