Updated contact.html

Author: jvinodraj

assets/css/style.css

@@ -296,6 +296,33 @@ main {
   margin-bottom: 0.45rem;
 }
 
+.service-info {
+  display: grid;
+  gap: 0.7rem;
+  margin-bottom: 1rem;
+}
+
+.service-item {
+  border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--border));
+  background: color-mix(in srgb, var(--surface-2) 62%, var(--surface));
+  border-radius: 12px;
+  padding: 0.7rem 0.8rem;
+}
+
+.service-item h4 {
+  margin: 0 0 0.35rem;
+  color: var(--primary-strong);
+  font-size: 0.98rem;
+  letter-spacing: 0.01em;
+}
+
+.service-subline {
+  margin: 0.12rem 0;
+  color: var(--muted);
+  font-size: 0.94rem;
+  line-height: 1.45;
+}
+
 .timeline {
   display: grid;
   gap: 0.9rem;

contact.html

@@ -37,16 +37,28 @@ <h1>Contact & Visit</h1>
         <div class="grid grid-2">
           <article class="card">
             <h3>Service Information</h3>
-            <p>Sunday Worship: 9:30 AM</p>
-            <p>Prayer Meeting: Friday 7:00 PM</p>
-            <p>Bible Study: Wednesday 7:00 PM</p>
-            <p>Youth Meeting: Saturday 5:00 PM</p>
+            <div class="service-info">
+              <section class="service-item" aria-label="Sunday Services">
+                <h4>Sunday Services</h4>
+                <p class="service-subline">1st Service: 6:00 AM - 8:00 AM</p>
+                <p class="service-subline">2nd Service: 8:15 AM - 10:00 AM</p>
+                <p class="service-subline">3rd Service: 10:30 AM - 12:00 PM</p>
+              </section>
+              <section class="service-item" aria-label="Fasting Prayer">
+                <h4>Fasting Prayer</h4>
+                <p class="service-subline">Friday 10:30 AM - 12:00 PM</p>
+              </section>
+              <section class="service-item" aria-label="Junior Sunday Class">
+                <h4>Junior Sunday Class</h4>
+                <p class="service-subline">Sunday 4:00 PM - 5:30 PM</p>
+              </section>
+            </div>
             <h3>Location</h3>
             <p>Chennai, Tamil Nadu, India</p>
             <div style="border-radius: 12px; overflow: hidden; margin: 0.75rem 0;">
               <iframe
                 title="Zion Gospel Ministry Location"
-                src="https://www.google.com/maps?q=Zion+Gospel+Ministry,+Chennai,+Tamil+Nadu,+India&output=embed"
+                src="https://www.google.com/maps?q=13.0640071,80.2112303&z=17&output=embed"
                 width="100%"
                 height="280"
                 style="border:0;"
@@ -56,7 +68,7 @@ <h3>Location</h3>
               </iframe>
             </div>
             <p>
-              <a href="https://www.google.com/maps/dir/?api=1&destination=Zion+Gospel+Ministry,+Chennai,+Tamil+Nadu,+India&travelmode=driving" target="_blank" rel="noopener">
+              <a href="https://maps.app.goo.gl/DefDBPsvYjo8B8f46" target="_blank" rel="noopener">
                 Get Directions in Google Maps
               </a>
             </p>