Aplikasi Jam Digital Masjid Gratis Site

<div class="prayer-times" id="prayerGrid">  </div>

.time-digits font-family: 'Courier New', 'Fira Mono', 'JetBrains Mono', monospace; font-size: 5rem; font-weight: bold; letter-spacing: 8px; color: #2ef7c4; text-shadow: 0 0 5px #00ffc3, 0 0 15px #00a37a; background: #010b09; display: inline-block; padding: 0.2rem 1rem; border-radius: 2rem; margin-bottom: 12px;

button background: #3c6e5f; border: none; color: white; padding: 8px 15px; border-radius: 32px; font-weight: bold; margin-top: 10px; cursor: pointer; transition: 0.2s; font-family: inherit; aplikasi jam digital masjid gratis

.azan-active background: #b3413a; color: #fff1b5; animation: pulse 1s infinite;

.footer-note text-align: center; font-size: 0.7rem; color: #bbbb88; margin-top: 20px; !-- jadwal sholat otomatis --&gt

// Tambahan geolocation (opsional) untuk lebih akurat function getLocationAndUpdate() if ("geolocation" in navigator) navigator.geolocation.getCurrentPosition(async (position) => const lat = position.coords.latitude; const lon = position.coords.longitude; try const url = `https://api.aladhan.com/v1/timings?latitude=$lat&longitude=$lon&method=2`; const res = await fetch(url); const data = await res.json(); if (data.code === 200 && data.data && data.data.timings) const timings = data.data.timings; prayerSchedule = Subuh: timings.Fajr, Dzuhur: timings.Dhuhr, Ashar: timings.Asr, Maghrib: timings.Maghrib, Isya: timings.Isha ; if(data.data.date.hijri) hijriElement.innerText = `$data.data.date.hijri.day $data.data.date.hijri.month.en $data.data.date.hijri.year H`; document.getElementById('lokasiMasjid').innerHTML = `📍 Masjid (GPS)`; renderPrayerTimes(new Date()); catch(e) console.log("Geo API error"); , () => fetchPrayerTimes(); // fallback jakarta ); else fetchPrayerTimes();

@keyframes pulse 0% opacity: 0.7; text-shadow: 0 0 0px gold; 100% opacity: 1; text-shadow: 0 0 6px #ffaa33; div class="prayer-times" id="prayerGrid"&gt

/* info lokasi & hijriah */ .location-area display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; margin-top: 18px; gap: 8px; background: #0c2722aa; border-radius: 50px; padding: 10px 18px;