@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
body {
font-family: 'Inter', sans-serif;
}
.timeline-item {
opacity: 0;
transform: translateY(20px);
transition: all 0.6s ease;
}
.timeline-item.visible {
opacity: 1;
transform: translateY(0);
}
.timeline-line {
background: linear-gradient(to bottom, #10b981, #059669, #047857);
}
.timeline-dot {
box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.2);
transition: all 0.3s ease;
}
.timeline-dot:hover {
transform: scale(1.2);
box-shadow: 0 0 0 8px rgba(16, 185, 129, 0.3);
}
.card-hover {
transition: all 0.3s ease;
}
.card-hover:hover {
transform: translateY(-5px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
}
.gradient-bg {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}
.pulse-animation {
animation: pulse 2s infinite;
}
@keyframes pulse {
0%, 100% { opacity: 1; }
50% { opacity: 0.7; }
}
.modal {
backdrop-filter: blur(10px);
}
.modal-content {
animation: modalSlideIn 0.3s ease;
}
@keyframes modalSlideIn {
from {
opacity: 0;
transform: translateY(-50px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
Lini Masa Sejarah
MTs An-Nawa
Perjalanan Panjang Menuju Pendidikan Berkualitas
???? Pondok Pesantren Modern An-Nawa, Serang, Banten
2010
????️
Pendirian Pondok Pesantren
KH. Bukhori, S.Ag mendirikan Pondok Pesantren Modern An-Nawa di Pengoreng Pulo Ampel, Kabupaten Serang. Angkatan pertama santri mulai belajar.
2010-2016
????
Periode Pembelajaran
Santri MTs An-Nawa terdaftar di MTs El-Rahma Kota Serang, kemudian pindah ke MTs Al-Khairiyah Pengoreng untuk mempermudah koordinasi.
2016-2017
????
Masa Persiapan
An-Nawa mulai mempersiapkan infrastruktur dan sumber daya manusia untuk mendirikan madrasah sendiri.
2018
????
Pengajuan Izin Pertama
2 November 2018: Pengajuan proposal izin operasional ke Kemenag Kabupaten Serang. Dokumen dinyatakan lengkap dengan beberapa catatan.
2019
⚡
Tahun Perjuangan
Komunikasi intensif dengan Kemenag untuk memantau perkembangan, namun belum ada hasil yang signifikan.
2020
????
Pengajuan Ulang & Visitasi
7 September: Pengajuan ulang melalui aplikasi Izop online. 29 Desember: Visitasi tim Kemenag dengan hasil positif.
2021
????
Izin Operasional Resmi
22 April 2021: MTs An-Nawa resmi mendapat SK izin operasional No. 369 Tahun 2021 dari Kanwil Kemenag Provinsi Banten.
Pencapaian MTs An-Nawa
Kepala Madrasah
Nasuhi, S.Pd.I
Ketua Yayasan
KH. Bukhori, S.Ag
NSM
121236040208
// Intersection Observer for timeline animations
const observerOptions = {
threshold: 0.1,
rootMargin: '0px 0px -50px 0px'
};
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.classList.add('visible');
}
});
}, observerOptions);
// Observe all timeline items
document.querySelectorAll('.timeline-item').forEach(item => {
observer.observe(item);
});
// Modal functions
function openModal(modalId) {
const modal = document.getElementById(modalId);
modal.classList.remove('hidden');
modal.classList.add('flex');
document.body.style.overflow = 'hidden';
}
function closeModal(modalId) {
const modal = document.getElementById(modalId);
modal.classList.add('hidden');
modal.classList.remove('flex');
document.body.style.overflow = 'auto';
}
// Close modal when clicking outside
document.querySelectorAll('.modal').forEach(modal => {
modal.addEventListener('click', (e) => {
if (e.target === modal) {
closeModal(modal.id);
}
});
});
// Close modal with Escape key
document.addEventListener('keydown', (e) => {
if (e.key === 'Escape') {
document.querySelectorAll('.modal').forEach(modal => {
if (!modal.classList.contains('hidden')) {
closeModal(modal.id);
}
});
}
});
// Smooth scrolling for better UX
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();
const target = document.querySelector(this.getAttribute('href'));
if (target) {
target.scrollIntoView({
behavior: 'smooth',
block: 'start'
});
}
});
});