PageSourceSearch

https://disdik.padang.go.id/beranda

html padang.go.id collected 2026-09-24 09:57:37 UTC 121,019 bytes, 2,910 lines download raw bytes

1<!DOCTYPE html>
2<html lang="en">
3
4<head>
5    <meta charset="utf-8" />
6    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
7    <meta name="description" content="" />
8    <meta name="author" content="" />
9    <!-- Favicon -->
10    <link rel="icon" href="/assets/img/logo.png" type="image/png">
11
12    <!-- Title -->
13    <title>DISDIK KOTA PADANG</title>
14
15    <!-- AOS Animation -->
16    <link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet" />
17
18    <!-- Custom CSS -->
19    <link href="/assets/style/main.css" rel="stylesheet" />
20
21    <!-- Bootstrap Icons -->
22    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css">
23
24    <!-- Font Awesome -->
25    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
26
27    <!-- jCarousel CSS -->
28    <link rel="stylesheet" type="text/css" href="/assets/vendor/jquery/jcarousel.responsive.css">
29
30    <!-- Select2 CSS -->
31    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css" rel="stylesheet" />
32
33    <!-- jQuery (wajib sebelum Select2) -->
34    
34<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
34
35
36    <!-- Select2 JS -->
37    
37<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>
37
38
39
40    <!-- jQuery & jCarousel Scripts -->
41    
42    
42<script src="/assets/vendor/jquery/jquery.jcarousel.min.js"></script>
42
43    
43<script src="/assets/vendor/jquery/jcarousel.responsive.js"></script>
43
44
45
46    
47
48    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/rateYo/2.3.2/jquery.rateyo.min.css">
49
50    <link rel="preload" href="/assets/img/logo-head-DISDIK1.png" as="image">
51    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/[email protected]/slick/slick.css" />
52    <link rel="stylesheet" type="text/css"
53        href="https://cdn.jsdelivr.net/npm/[email protected]/slick/slick-theme.css" />
54    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/rateYo/3.2.0/jquery.rateyo.min.css">
55
56    <!-- JS RateYo -->
57    
57<script src="https://cdnjs.cloudflare.com/ajax/libs/rateYo/3.2.0/jquery.rateyo.min.js"></script>
57
58    <!-- Slick Carousel CSS -->
59    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/[email protected]/slick/slick.css" />
60    <link rel="stylesheet" type="text/css"
61        href="https://cdn.jsdelivr.net/npm/[email protected]/slick/slick-theme.css" />
62
63
64    <style type="text/css">
65        .preloader {
66            position: fixed;
67            top: 0;
68            left: 0;
69            width: 100%;
70            height: 100%;
71            z-index: 9999;
72            background-color: #fff;
73        }
74
75        .preloader .loading {
76            position: absolute;
77            left: 50%;
78            top: 50%;
79            transform: translate(-50%, -50%);
80            font: 14px arial;
81        }
82
83        .info-banner {
84            background-color: transparent;
85            color: #dc3545;
86            /* ubah warna teks jadi merah agar tetap terlihat */
87            padding: 6px 0;
88            font-size: 15px;
89            font-weight: bold;
90            text-align: center;
91            z-index: 1040;
92            position: fixed;
93            top: 0;
94            left: 0;
95            width: 100%;
96        }
97
98        .slider-galeri .slick-slide {
99            padding: 0 10px;
100        }
101
102        .slider-galeri img.galeri-img {
103            height: 200px;
104            object-fit: cover;
105        }
106
107        .red {
108            color: #93192C;
109        }
110
111        .line {
112            width: 100px;
113            height: 3px;
114            background-color: #93192C;
115            margin: 10px auto;
116        }
117
118        .card-img-top {
119            height: 200px;
120            object-fit: cover;
121        }
122
123        .card-date-badge {
124            position: absolute;
125            top: 10px;
126            left: 10px;
127            background-color: red;
128            color: white;
129            padding: 4px 8px;
130            font-size: 13px;
131            font-weight: bold;
132            border-radius: 3px;
133        }
134
135        .card-category {
136            color: red;
137            font-size: 14px;
138            margin-bottom: 5px;
139        }
140
141        .card-title {
142            font-weight: 700;
143            font-size: 18px;
144        }
145
146        .card-text {
147            font-size: 14px;
148            color: #666;
149        }
150
151        .custom-table tbody tr:nth-child(odd) {
152            background-color: #f8f9fa;
153            /* abu muda */
154        }
155
156        .custom-table tbody tr:nth-child(even) {
157            background-color: #e9ecef;
158            /* abu agak gelap */
159        }
160
161        /* Hover effect */
162        .custom-table tbody tr:hover {
163            background-color: #cce5ff !important;
164            /* biru muda saat hover */
165            transition: background-color 0.3s ease;
166            cursor: pointer;
167        }
168
169        /* Judul tabel */
170        .custom-table thead {
171            background-color: #004085;
172            color: #fff;
173        }
174
175        /* Border tabel lebih halus */
176        .custom-table th,
177        .custom-table td {
178            border: 1px solid #dee2e6;
179            vertical-align: middle;
180        }
181    </style>
182    <!-- Font Awesome untuk icon panah -->
183    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
184
185    <style>
186        /* Back to top button */
187        .back-to-top {
188            position: fixed;
189            bottom: 30px;
190            right: 30px;
191            width: 50px;
192            height: 50px;
193            background-color: #1a2b6f;
194            color: white;
195            border-radius: 50%;
196            display: none;
197            /* Awalnya disembunyikan */
198            align-items: center;
199            justify-content: center;
200            text-decoration: none;
201            font-size: 20px;
202            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
203            opacity: 0;
204            transition: all 0.3s ease;
205            z-index: 999;
206        }
207
208        .back-to-top:hover {
209            background-color: #0f1a4b;
210            transform: translateY(-3px);
211        }
212
213        .back-to-top.active {
214            opacity: 1;
215            display: flex;
216            /* Muncul saat aktif */
217        }
218    </style>
219    
220        
220<script src="https://cdn.jsdelivr.net/npm/sienna-accessibility@latest/dist/sienna-accessibility.umd.js" defer></script>
220
221</head>
222
223<body onload="slider()">
224
225    <div class="preloader" style="background-color: rgb(199, 192, 192)">
226        <div class="loading">
227            <img src="/assets/img/logo-head-DISDIK.png" class="img-fluid" alt="Logo DISDIK" width="600">
228        </div>
229    </div>
230
231    <style>
232        /* Import Poppins Font */
233        @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap');
234
235        /* Animasi CSS */
236        .fade-in-up {
237            opacity: 0;
238            transform: translateY(20px);
239            animation: fadeInUp 0.6s forwards;
240        }
241
242        @keyframes fadeInUp {
243            to {
244                opacity: 1;
245                transform: translateY(0);
246            }
247        }
248
249        /* Delay untuk animasi berurutan */
250        .card-animation-delay-1 {
251            animation-delay: 0.2s;
252        }
253
254        .card-animation-delay-2 {
255            animation-delay: 0.4s;
256        }
257
258        .card-animation-delay-3 {
259            animation-delay: 0.6s;
260        }
261
262        .card-animation-delay-4 {
263            animation-delay: 0.8s;
264        }
265
266        .image-animation-delay {
267            animation-delay: 1s;
268        }
269
270        .video-title:hover {
271            white-space: normal;
272            overflow: visible;
273            text-overflow: unset;
274            background-color: #fff;
275            position: relative;
276            z-index: 1;
277        }
278
279        /* Back to top button */
280        .back-to-top {
281            position: fixed;
282            bottom: 30px;
283            right: 30px;
284            width: 50px;
285            height: 50px;
286            background-color: #1a2b6f;
287            color: white;
288            border-radius: 50%;
289            display: flex;
290            align-items: center;
291            justify-content: center;
292            text-decoration: none;
293            font-size: 20px;
294            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
295            opacity: 0;
296            visibility: hidden;
297            transition: all 0.3s ease;
298            z-index: 999;
299        }
300
301        .back-to-top:hover {
302            background-color: #0f1a4b;
303            transform: translateY(-3px);
304        }
305
306        .back-to-top.active {
307            opacity: 1;
308            visibility: visible;
309        }
310
311        .video-title {
312            font-size: 14px;
313            font-weight: 600;
314            min-height: 45px;
315            display: flex;
316            align-items: center;
317            justify-content: center;
318            text-align: center;
319            line-height: 1.3;
320        }
321
322        .embed-responsive {
323            border-radius: 10px;
324            overflow: hidden;
325        }
326
327        #galeriCarousel,
328        #galeriCarousel * {
329            border: none !important;
330            outline: none !important;
331            box-shadow: none !important;
332        }
333
334        .carousel-control-prev,
335        .carousel-control-next {
336            border: none !important;
337            outline: none !important;
338            box-shadow: none !important;
339            background: transparent !important;
340        }
341
342        .col-md-6 {
343            border: none !important;
344            box-shadow: none !important;
345        }
346
347        #galeriCarousel img {
348            height: 200px;
349            object-fit: cover;
350        }
351
352        .hover-scale {
353            transition: transform 0.3s ease;
354        }
355
356        .hover-scale:hover {
357            transform: translateY(-5px);
358        }
359    </style>
360
361    <!-- NAVBAR -->
362    <style>
363    /* Info Banner */
364    .info-banner {
365        background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
366        color: white;
367        padding: 8px 0;
368        font-size: 14px;
369        font-weight: 500;
370        width: 100%;
371        z-index: 1031;
372        box-shadow: 0 2px 5px rgba(0,0,0,0.1);
373    }
374
375    .info-banner marquee {
376        padding: 0 20px;
377    }
378
379    /* Navbar Base Styles */
380    .navbar-store {
381        background: transparent !important;
382        box-shadow: none;
383        padding: 15px 0 !important;
384        transition: all 0.4s ease;
385        position: fixed !important;
386        width: 100% !important;
387        z-index: 1030 !important;
388        top: 0;
389    }
390
391    .navbar-store-download {
392        background: linear-gradient(135deg, #212E60 0%, #1a2550 100%) !important;
393        box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
394        padding: 10px 0 !important;
395        transition: all 0.4s ease;
396        position: fixed !important;
397        width: 100% !important;
398        z-index: 1030 !important;
399        top: 0;
400    }
401
402    .navbar-store.scrolled {
403        background: linear-gradient(135deg, #212E60 0%, #1a2550 100%) !important;
404        box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1) !important;
405        padding: 10px 0 !important;
406    }
407
408    /* Logo */
409    .navbar-brand img {
410        max-height: 50px;
411        transition: transform 0.3s ease;
412    }
413
414    .navbar-brand:hover img {
415        transform: scale(1.05);
416    }
417
418    /* Nav Links */
419    .navbar-light .navbar-nav .nav-link {
420        color: white !important;
421        font-weight: 500;
422        padding: 10px 15px !important;
423        transition: all 0.3s ease;
424        position: relative;
425        font-size: 15px;
426    }
427
428    .navbar-light .navbar-nav .nav-link::after {
429        content: '';
430        position: absolute;
431        bottom: 5px;
432        left: 15px;
433        right: 15px;
434        height: 2px;
435        background: #19BBB5;
436        transform: scaleX(0);
437        transition: transform 0.3s ease;
438    }
439
440    .navbar-light .navbar-nav .nav-link:hover::after,
441    .navbar-light .navbar-nav .nav-item.active .nav-link::after {
442        transform: scaleX(1);
443    }
444
445    .navbar-light .navbar-nav .nav-link:hover {
446        color: #19BBB5 !important;
447    }
448
449    .navbar-light .navbar-nav .nav-item.active .nav-link {
450        color: #19BBB5 !important;
451        font-weight: 600;
452    }
453
454    /* Dropdown Menu */
455    .navbar .dropdown-menu {
456        background-color: #212E60 !important;
457        border: none !important;
458        border-radius: 10px !important;
459        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2) !important;
460        padding: 10px 0 !important;
461        margin-top: 0px !important;
462        position: absolute !important;
463        min-width: 280px;
464        display: none;
465    }
466
467    .navbar .dropdown-menu.show {
468        display: block;
469    }
470
471    .navbar .nav-item.dropdown {
472        position: relative !important;
473    }
474
475    .navbar .dropdown-toggle::after {
476        margin-left: 8px;
477        transition: transform 0.3s ease;
478    }
479
480    .navbar .dropdown.show .dropdown-toggle::after {
481        transform: rotate(180deg);
482    }
483
484    /* Dropdown Items */
485    .navbar .dropdown-item {
486        color: white !important;
487        padding: 12px 25px !important;
488        font-size: 14px !important;
489        transition: all 0.3s ease !important;
490        border-left: 3px solid transparent;
491        display: flex;
492        align-items: center;
493        gap: 12px;
494    }
495
496    .navbar .dropdown-item i {
497        width: 20px;
498        text-align: center;
499        color: #19BBB5;
500        font-size: 16px;
501    }
502
503    .navbar .dropdown-item:hover,
504    .navbar .dropdown-item:focus {
505        background-color: #19BBB5 !important;
506        border-left-color: white;
507        color: white !important;
508        padding-left: 30px !important;
509    }
510
511    .navbar .dropdown-item:hover i {
512        color: white;
513    }
514
515    /* ===== NESTED SUBMENU STYLES ===== */
516    .dropdown-nested {
517        position: relative;
518        cursor: pointer;
519        display: flex;
520        align-items: center;
521        justify-content: space-between;
522        color: white !important;
523        padding: 12px 25px !important;
524        font-size: 14px !important;
525        transition: all 0.3s ease !important;
526        border-left: 3px solid transparent;
527        gap: 12px;
528    }
529
530    .dropdown-nested:hover {
531        background-color: #19BBB5 !important;
532        border-left-color: white;
533        padding-left: 30px !important;
534    }
535
536    .dropdown-nested .menu-icon {
537        width: 20px;
538        text-align: center;
539        color: #19BBB5;
540        font-size: 16px;
541        flex-shrink: 0;
542    }
543
544    .dropdown-nested:hover .menu-icon {
545        color: white;
546    }
547
548    .dropdown-nested .menu-text {
549        flex: 1;
550        color: white;
551    }
552
553    .dropdown-nested .menu-arrow {
554        margin-left: auto;
555        font-size: 14px;
556        color: rgba(255, 255, 255, 0.7);
557        transition: all 0.3s ease;
558        flex-shrink: 0;
559        padding-left: 15px;
560    }
561
562    .dropdown-nested:hover .menu-arrow {
563        color: white;
564        transform: translateX(3px);
565    }
566
567    .dropdown-submenu {
568        position: absolute;
569        left: 100%;
570        top: 0;
571        display: none;
572        background: linear-gradient(135deg, #1a2550 0%, #162040 100%) !important;
573        border-radius: 10px;
574        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
575        padding: 10px 0;
576        min-width: 250px;
577        margin-left: 8px;
578        z-index: 1000;
579        border: 1px solid rgba(255, 255, 255, 0.1);
580    }
581
582    .dropdown-nested::before {
583        content: '';
584        position: absolute;
585        top: 0;
586        right: -12px;
587        bottom: 0;
588        width: 12px;
589        z-index: 999;
590    }
591
592    .dropdown-submenu .dropdown-item {
593        color: rgba(255, 255, 255, 0.9) !important;
594        padding: 10px 20px !important;
595        font-size: 13.5px !important;
596        border-left: 2px solid transparent;
597    }
598
599    .dropdown-submenu .dropdown-item i {
600        font-size: 12px;
601        color: #19BBB5;
602    }
603
604    .dropdown-submenu .dropdown-item:hover {
605        background: linear-gradient(90deg, #19BBB5 0%, #17a6a1 100%) !important;
606        border-left-color: white;
607        padding-left: 25px !important;
608        color: white !important;
609    }
610
611    .dropdown-submenu .dropdown-item:hover i {
612        color: white;
613    }
614
615    @media (min-width: 992px) {
616        .dropdown-nested:hover .dropdown-submenu {
617            display: block;
618            animation: slideIn 0.3s ease;
619        }
620    }
621
622    @keyframes slideIn {
623        from {
624            opacity: 0;
625            transform: translateX(-10px);
626        }
627        to {
628            opacity: 1;
629            transform: translateX(0);
630        }
631    }
632
633    /* Mobile Styles */
634    @media (max-width: 991px) {
635        .dropdown-submenu {
636            position: relative !important;
637            left: 0 !important;
638            margin-left: 0 !important;
639            margin-top: 5px;
640            box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.2) !important;
641            border-left: 3px solid #19BBB5;
642            background: rgba(26, 37, 80, 0.7) !important;
643        }
644
645        .dropdown-nested .menu-arrow {
646            transform: rotate(90deg);
647        }
648
649        .dropdown-nested.active .menu-arrow {
650            transform: rotate(-90deg);
651        }
652
653        .dropdown-nested::before {
654            display: none;
655        }
656
657        .dropdown-submenu .dropdown-item {
658            padding-left: 35px !important;
659        }
660
661        .dropdown-submenu .dropdown-item:hover {
662            padding-left: 40px !important;
663        }
664    }
665
666    /* Navbar Toggler */
667    .navbar-toggler {
668        border: 2px solid white !important;
669        padding: 5px 10px;
670    }
671
672    .navbar-toggler-icon {
673        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
674    }
675
676    .navbar-toggler:focus {
677        box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.25);
678    }
679
680    body {
681        padding-top: 0 !important;
682    }
683
684    @media (max-width: 991px) {
685        .navbar-collapse {
686            background: #212E60;
687            padding: 20px;
688            margin-top: 15px;
689            border-radius: 10px;
690            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
691        }
692
693        .navbar .dropdown-menu {
694            background-color: #1a2550 !important;
695            box-shadow: none !important;
696            margin-left: 15px;
697            position: relative !important;
698            transform: none !important;
699            opacity: 1;
700            visibility: visible;
701        }
702
703        .navbar-light .navbar-nav .nav-link::after {
704            display: none;
705        }
706
707        .navbar-light .navbar-nav .nav-link {
708            padding: 12px 15px !important;
709        }
710
711        .navbar-store,
712        .navbar-store-download {
713            background: linear-gradient(135deg, #212E60 0%, #1a2550 100%) !important;
714        }
715    }
716
717    html {
718        scroll-padding-top: 100px;
719        scroll-behavior: smooth;
720    }
721</style>
722
723<nav class="navbar navbar-expand-lg navbar-light navbar-store fixed-top navbar-fixed-top">
724    <div class="container d-flex justify-content-between align-items-center">
725
726        <a class="navbar-brand mb-0" href="https://disdik.padang.go.id">
727            <img src="/assets/img/logo-head-DISDIK1.png" alt="logo" />
728        </a>
729
730        <button class="navbar-toggler border-0" type="button" data-toggle="collapse"
731            data-target="#navbarSupportedContent">
732            <span class="navbar-toggler-icon"></span>
733        </button>
734
735        <div class="collapse navbar-collapse" id="navbarSupportedContent">
736            <ul class="navbar-nav ml-auto">
737
738                
739                <li class="nav-item active">
740                    <a class="nav-link" href="https://disdik.padang.go.id/beranda">
741                        <i class="fas fa-home"></i> Home
742                    </a>
743                </li>
744
745                
746<li class="nav-item dropdown ">
747    <a class="nav-link dropdown-toggle" href="#">
748        <i class="fas fa-building"></i> Profil
749    </a>
750
751    <div class="dropdown-content dropdown-menu">
752        
753        <a class="dropdown-item " href="https://disdik.padang.go.id/profil/visi-misi">
754            <i class="fas fa-lightbulb"></i> Visi & Misi
755        </a>
756        <a class="dropdown-item " href="https://disdik.padang.go.id/profil/pejabat-struktural">
757            <i class="fas fa-user-tie"></i> Pejabat Struktural
758        </a>
759        <a class="dropdown-item " href="https://disdik.padang.go.id/profil/struktur-organisasi">
760            <i class="fas fa-sitemap"></i> Struktur Organisasi
761        </a>
762        <a class="dropdown-item " href="https://disdik.padang.go.id/profil/tupoksi">
763            <i class="fas fa-tasks"></i> Tugas & Fungsi
764        </a>
765
766        
767                                </div>
768</li>
769
770                
771                <li class="nav-item ">
772                    <a class="nav-link" href="https://disdik.padang.go.id/dokumen-index">
773                        <i class="fas fa-chart-bar"></i> Statistik Disdik
774                    </a>
775                </li>
776
777                
778                
779                
780<li class="nav-item dropdown ">
781    <a class="nav-link dropdown-toggle" href="#">
782        <i class="fas fa-newspaper"></i> Publikasi
783    </a>
784
785    <div class="dropdown-content dropdown-menu">
786        
787        <a class="dropdown-item " href="https://disdik.padang.go.id/berita-list">
788            <i class="fas fa-newspaper"></i> Berita & Artikel
789        </a>
790        <a class="dropdown-item " href="https://disdik.padang.go.id/galeri-list">
791            <i class="fas fa-photo-video"></i> Galeri
792        </a>
793
794        
795            </div>
796</li>
797
798                
799                
800                
801<li class="nav-item dropdown ">
802    <a class="nav-link dropdown-toggle" href="#">
803        <i class="fas fa-briefcase"></i> Layanan
804    </a>
805
806    <div class="dropdown-content dropdown-menu">
807        
808        <a class="dropdown-item" href="https://psb.diknaspadang.id/" target="_blank">
809            <i class="fas fa-user-graduate"></i> SPMB
810        </a>
811
812        
813                                                                                <a class="dropdown-item " href="https://disdik.padang.go.id/page/Layanan-Layanan Online">
814                            <i class="fas fa-circle"></i> Layanan Online
815                        </a>
816                                                                                <a class="dropdown-item " href="https://disdik.padang.go.id/page/UPTDLDPI">
817                            <i class="fas fa-circle"></i> UPTD LDPI
818                        </a>
819                                                            </div>
820</li>
821
822                
823                
824                
825                                                        <li class="nav-item dropdown">
826                        <a class="nav-link dropdown-toggle" href="#">
827                            <i class="fas fa-bars"></i> Pengaduan
828                        </a>
829                        <div class="dropdown-content dropdown-menu">
830                                                                                                <a class="dropdown-item" href="https://disdik.padang.go.id/page/Pengaduan-SK Tim Pengaduan">
831                                        <i class="fas fa-circle"></i> SK Tim Pengaduan
832                                    </a>
833                                                                                    </div>
834                    </li>
835                                                    
836                                
837<li class="nav-item ">
838    <a class="nav-link" href="https://disdik.padang.go.id/antrian">
839        <i class="fas fa-ticket-alt"></i> Antrian Online
840    </a>
841</li>
842
843            </ul>
844        </div>
845    </div>
846</nav>
847
848<script>
849    document.addEventListener('DOMContentLoaded', function() {
850        const navbar = document.querySelector('.navbar');
851        const isHomePage = navbar.classList.contains('navbar-store');
852        
853        if (isHomePage) {
854            window.addEventListener('scroll', function() {
855                if (window.scrollY > 50) {
856                    navbar.classList.add('scrolled');
857                } else {
858                    navbar.classList.remove('scrolled');
859                }
860            });
861        }
862
863        const dropdowns = document.querySelectorAll('.navbar .nav-item.dropdown');
864        
865        dropdowns.forEach(dropdown => {
866            let timeoutId;
867            
868            dropdown.addEventListener('mouseenter', function() {
869                clearTimeout(timeoutId);
870                const menu = this.querySelector('.dropdown-menu');
871                menu.classList.add('show');
872                this.classList.add('show');
873            });
874            
875            dropdown.addEventListener('mouseleave', function() {
876                const menu = this.querySelector('.dropdown-menu');
877                const self = this;
878                
879                timeoutId = setTimeout(function() {
880                    menu.classList.remove('show');
881                    self.classList.remove('show');
882                }, 300);
883            });
884            
885            const toggle = dropdown.querySelector('.dropdown-toggle');
886            toggle.addEventListener('click', function(e) {
887                e.preventDefault();
888                const menu = dropdown.querySelector('.dropdown-menu');
889                const isShown = menu.classList.contains('show');
890                
891                document.querySelectorAll('.navbar .dropdown-menu.show').forEach(m => {
892                    if (m !== menu) {
893                        m.classList.remove('show');
894                        m.closest('.dropdown').classList.remove('show');
895                    }
896                });
897                
898                if (isShown) {
899                    menu.classList.remove('show');
900                    dropdown.classList.remove('show');
901                } else {
902                    menu.classList.add('show');
903                    dropdown.classList.add('show');
904                }
905            });
906        });
907        
908        const nestedItems = document.querySelectorAll('.dropdown-nested');
909        
910        nestedItems.forEach(nested => {
911            let nestedTimeoutId;
912            
913            nested.addEventListener('mouseenter', function(e) {
914                if (window.innerWidth > 991) {
915                    clearTimeout(nestedTimeoutId);
916                    const submenu = this.querySelector('.dropdown-submenu');
917                    if (submenu) {
918                        submenu.style.display = 'block';
919                    }
920                }
921            });
922            
923            nested.addEventListener('mouseleave', function(e) {
924                if (window.innerWidth > 991) {
925                    const submenu = this.querySelector('.dropdown-submenu');
926                    if (submenu) {
927                        nestedTimeoutId = setTimeout(function() {
928                            submenu.style.display = 'none';
929                        }, 200);
930                    }
931                }
932            });
933            
934            nested.addEventListener('click', function(e) {
935                if (window.innerWidth <= 991) {
936                    e.preventDefault();
937                    e.stopPropagation();
938                    
939                    const submenu = this.querySelector('.dropdown-submenu');
940                    if (submenu) {
941                        const isVisible = submenu.style.display === 'block';
942                        
943                        document.querySelectorAll('.dropdown-submenu').forEach(s => {
944                            s.style.display = 'none';
945                        });
946                        document.querySelectorAll('.dropdown-nested').forEach(n => {
947                            n.classList.remove('active');
948                        });
949                        
950                        if (isVisible) {
951                            submenu.style.display = 'none';
952                            this.classList.remove('active');
953                        } else {
954                            submenu.style.display = 'block';
955                            this.classList.add('active');
956                        }
957                    }
958                }
959            });
960        });
961        
962        document.addEventListener('click', function(e) {
963            if (!e.target.closest('.navbar .dropdown')) {
964                document.querySelectorAll('.navbar .dropdown-menu.show').forEach(menu => {
965                    menu.classList.remove('show');
966                    menu.closest('.dropdown').classList.remove('show');
967                });
968                document.querySelectorAll('.dropdown-submenu').forEach(submenu => {
969                    submenu.style.display = 'none';
970                });
971                document.querySelectorAll('.dropdown-nested').forEach(n => {
972                    n.classList.remove('active');
973                });
974            }
975        });
976    });
977</script>
977
978    <div class="page-home">
979
980        <!-- LANDING PAGE dengan CURVE DIVIDER -->
981        <section class="store-landing">
982            <div class="container-background">
983                <div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
984                    <div class="carousel-inner">
985                        <div class="carousel-item active">
986                            <img class="d-block bg-100" src="/assets/img/Intersect1.png" id="slideImg"
987                                alt="First slide">
988
989                            <!-- Overlay untuk memastikan teks di tengah -->
990                            <div class="carousel-caption d-flex align-items-center justify-content-center"
991                                style="top: 0; left: 0; right: 0; bottom: 0; transform: none; background: rgba(0, 0, 0, 0.45);">
992
993                                <div class="hero-content">
994                                    <!-- Decorative line top -->
995                                    <div class="decorative-line-top"></div>
996
997                                    <!-- Title dengan typing effect - FONT BESAR POPPINS -->
998                                    <h1 class="elegant-title">
999                                        <span id="typingText"></span>
1000                                    </h1>
1001
1002                                    <!-- Subtitle dengan aksen -->
1003                                    <p class="elegant-subtitle">
1004                                        <span class="accent-text">Kota Padang</span>
1005                                    </p>
1006
1007                                    <!-- Decorative line bottom -->
1008                                    <div class="decorative-line-bottom"></div>
1009                                </div>
1010                            </div>
1011                        </div>
1012                    </div>
1013                </div>
1014
1015                <div class="landing-page-container">
1016                    <div id="particles-js"></div>
1017                </div>
1018            </div>
1019
1020            <!-- CURVE DIVIDER - Pengganti store-landing.top -->
1021            <div class="curve-divider-wrapper">
1022                <div class="curve-divider">
1023                    <!-- SVG Curve -->
1024                    <svg viewBox="0 0 1440 320" preserveAspectRatio="none">
1025                        <path d="M0,0 C360,320 1080,320 1440,0 L1440,320 L0,320 Z"></path>
1026                    </svg>
1027
1028                    <!-- Scroll Down Button -->
1029                    <button type="button" class="scroll-down-btn" onclick="scrollToNextSection()"
1030                        aria-label="Gulir ke bawah">
1031                        <i class="fas fa-chevron-down"></i>
1032                    </button>
1033                </div>
1034            </div>
1035        </section>
1036
1037        <style>
1038            /* HERO SECTION STYLING */
1039            .store-landing {
1040                position: relative;
1041                min-height: 100vh;
1042                background: #ffffff;
1043            }
1044
1045            .store-landing .carousel-item {
1046                min-height: 100vh;
1047                position: relative;
1048            }
1049
1050            .store-landing .carousel-item img {
1051                width: 100%;
1052                height: 100vh;
1053                object-fit: cover;
1054                background-color: #ffffff;
1055                transition: opacity 0.8s ease-in-out;
1056            }
1057
1058            /* Pastikan caption berada di tengah sempurna */
1059            .store-landing .carousel-caption {
1060                position: absolute !important;
1061                top: 0 !important;
1062                left: 0 !important;
1063                right: 0 !important;
1064                bottom: 0 !important;
1065                transform: none !important;
1066                background: rgba(0, 0, 0, 0.45) !important;
1067            }
1068
1069            /* CURVE DIVIDER - Pengganti store-landing.top */
1070            .curve-divider-wrapper {
1071                position: absolute;
1072                bottom: 0;
1073                left: 0;
1074                width: 100%;
1075                z-index: 10;
1076                pointer-events: none;
1077            }
1078
1079            .curve-divider {
1080                position: relative;
1081                height: 200px;
1082            }
1083
1084            .curve-divider svg {
1085                position: absolute;
1086                inset: 0;
1087                width: 100%;
1088                height: 100%;
1089            }
1090
1091            .curve-divider path {
1092                fill: #f8f9fa;
1093                /* Warna background section visi-misi */
1094            }
1095
1096            /* SCROLL DOWN BUTTON - Navy Theme */
1097            .scroll-down-btn {
1098                position: absolute;
1099                top: 72%;
1100                left: 50%;
1101                transform: translate(-50%, -50%);
1102                z-index: 30;
1103                pointer-events: auto;
1104
1105                width: 60px;
1106                height: 60px;
1107                border-radius: 50%;
1108                background: linear-gradient(135deg, #2c3e6f 0%, #1a2b4f 100%);
1109                color: white;
1110                border: 3px solid rgba(255, 255, 255, 0.3);
1111                cursor: pointer;
1112
1113                display: flex;
1114                align-items: center;
1115                justify-content: center;
1116
1117                box-shadow: 
1118                    0 0 0 4px #f8f9fa,
1119                    0 8px 20px rgba(26, 43, 79, 0.3),
1120                    inset 0 1px 0 rgba(255, 255, 255, 0.1);
1121                transition: all 0.3s ease;
1122                animation: bounce 2s infinite;
1123            }
1124
1125            .scroll-down-btn:hover {
1126                background: linear-gradient(135deg, #1a2b4f 0%, #0f1a3a 100%);
1127                transform: translate(-50%, calc(-50% - 5px));
1128                box-shadow: 
1129                    0 0 0 4px #f8f9fa,
1130                    0 12px 30px rgba(26, 43, 79, 0.5),
1131                    inset 0 1px 0 rgba(255, 255, 255, 0.2);
1132                border-color: rgba(255, 255, 255, 0.5);
1133            }
1134
1135            .scroll-down-btn:focus {
1136                outline: none;
1137                box-shadow: 
1138                    0 0 0 4px #f8f9fa,
1139                    0 0 0 6px rgba(26, 43, 79, 0.3);
1140            }
1141
1142            .scroll-down-btn i {
1143                font-size: 22px;
1144                transition: transform 0.3s ease;
1145                filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
1146            }
1147
1148            .scroll-down-btn:hover i {
1149                transform: translateY(5px);
1150            }
1151
1152            /* Bounce Animation */
1153            @keyframes bounce {
1154                0%, 20%, 50%, 80%, 100% {
1155                    transform: translate(-50%, -50%);
1156                }
1157                40% {
1158                    transform: translate(-50%, calc(-50% - 10px));
1159                }
1160                60% {
1161                    transform: translate(-50%, calc(-50% - 5px));
1162                }
1163            }
1164
1165            /* Pulse Ring Effect */
1166            .scroll-down-btn::before {
1167                content: '';
1168                position: absolute;
1169                inset: -8px;
1170                border: 2px solid rgba(44, 62, 111, 0.4);
1171                border-radius: 50%;
1172                animation: pulse-ring 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
1173            }
1174
1175            @keyframes pulse-ring {
1176                0% {
1177                    transform: scale(1);
1178                    opacity: 1;
1179                }
1180                100% {
1181                    transform: scale(1.3);
1182                    opacity: 0;
1183                }
1184            }
1185
1186            /* HERO CONTENT CONTAINER */
1187            .hero-content {
1188                text-align: center;
1189                padding: 0 20px;
1190                max-width: 1200px;
1191                margin: 0 auto;
1192            }
1193
1194            /* HERO TITLE - FONT BESAR dengan POPPINS */
1195            .elegant-title {
1196                font-family: 'Poppins', sans-serif !important;
1197                font-size: clamp(3rem, 8vw, 7rem) !important; /* Font lebih besar: 3rem - 7rem */
1198                font-weight: 600 !important; /* Semi-bold */
1199                color: #ffffff !important;
1200                letter-spacing: -2px !important; /* Negative spacing untuk modern look */
1201                line-height: 1.1 !important;
1202                text-shadow:
1203                    0 4px 30px rgba(0, 0, 0, 0.6),
1204                    0 8px 60px rgba(0, 0, 0, 0.4) !important;
1205                margin-bottom: 20px !important;
1206                opacity: 0;
1207                animation: fadeInTitle 1.2s ease-out 0.3s forwards !important;
1208            }
1209
1210            .elegant-title * {
1211                font-weight: 600 !important; /* Pastikan semua child element juga semi-bold */
1212            }
1213
1214            #typingText {
1215                border-right: 3px solid rgba(255, 255, 255, 0.9);
1216                padding-right: 10px;
1217                animation: blink-cursor 1s step-end infinite;
1218                display: inline-block;
1219                font-weight: 600 !important; /* Semi-bold untuk text yang muncul */
1220            }
1221
1222            @keyframes blink-cursor {
1223                0%, 49% {
1224                    border-color: rgba(255, 255, 255, 0.9);
1225                }
1226                50%, 100% {
1227                    border-color: transparent;
1228                }
1229            }
1230
1231            /* SUBTITLE - Poppins dengan ukuran lebih besar */
1232            .elegant-subtitle {
1233                font-family: 'Poppins', sans-serif;
1234                font-size: clamp(1.2rem, 3vw, 2rem); /* Lebih besar */
1235                font-weight: 600; /* Semi-bold */
1236                color: rgba(255, 255, 255, 0.95);
1237                letter-spacing: 8px;
1238                text-transform: uppercase;
1239                text-shadow: 0 2px 20px rgba(0, 0, 0, 0.5);
1240                margin: 0;
1241                opacity: 0;
1242                animation: fadeInTitle 1.2s ease-out 0.6s forwards;
1243            }
1244
1245            .accent-text {
1246                position: relative;
1247                padding: 0 20px;
1248                background: linear-gradient(90deg, 
1249                    rgba(255, 255, 255, 0.1) 0%, 
1250                    rgba(255, 255, 255, 0.2) 50%, 
1251                    rgba(255, 255, 255, 0.1) 100%);
1252                border-radius: 50px;
1253                display: inline-block;
1254            }
1255
1256            /* Decorative Lines */
1257            .decorative-line-top,
1258            .decorative-line-bottom {
1259                width: 80px;
1260                height: 3px;
1261                background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.9), transparent);
1262                margin: 0 auto;
1263                opacity: 0;
1264            }
1265
1266            .decorative-line-top {
1267                margin-bottom: 30px;
1268                animation: fadeInLine 1s ease-out 0.1s forwards;
1269            }
1270
1271            .decorative-line-bottom {
1272                margin-top: 30px;
1273                animation: fadeInLine 1s ease-out 0.8s forwards;
1274            }
1275
1276            /* Animations */
1277            @keyframes fadeInTitle {
1278                from {
1279                    opacity: 0;
1280                    transform: translateY(30px);
1281                }
1282                to {
1283                    opacity: 1;
1284                    transform: translateY(0);
1285                }
1286            }
1287
1288            @keyframes fadeInLine {
1289                from {
1290                    opacity: 0;
1291                    width: 0;
1292                }
1293                to {
1294                    opacity: 1;
1295                    width: 80px;
1296                }
1297            }
1298
1299            /* Responsif untuk tablet */
1300            @media (max-width: 992px) {
1301                .elegant-title {
1302                    letter-spacing: -1px;
1303                }
1304                
1305                .elegant-subtitle {
1306                    letter-spacing: 6px;
1307                }
1308            }
1309
1310            /* Responsif untuk mobile */
1311            @media (max-width: 768px) {
1312                .curve-divider {
1313                    height: 120px;
1314                }
1315
1316                .scroll-down-btn {
1317                    width: 52px;
1318                    height: 52px;
1319                }
1320
1321                .scroll-down-btn i {
1322                    font-size: 20px;
1323                }
1324
1325                .elegant-title {
1326                    letter-spacing: -1px;
1327                }
1328
1329                .elegant-subtitle {
1330                    letter-spacing: 4px;
1331                }
1332
1333                .decorative-line-top,
1334                .decorative-line-bottom {
1335                    width: 60px;
1336                }
1337            }
1338
1339            @media (max-width: 576px) {
1340                .curve-divider {
1341                    height: 80px;
1342                }
1343
1344                .scroll-down-btn {
1345                    width: 48px;
1346                    height: 48px;
1347                }
1348
1349                .scroll-down-btn i {
1350                    font-size: 18px;
1351                }
1352
1353                .elegant-title {
1354                    letter-spacing: 0;
1355                }
1356
1357                .elegant-subtitle {
1358                    letter-spacing: 3px;
1359                }
1360
1361                .decorative-line-top,
1362                .decorative-line-bottom {
1363                    width: 50px;
1364                    height: 2px;
1365                }
1366            }
1367        </style>
1368
1369        
1369<script>
1370            // Typing Animation - Simple & Elegant
1371            document.addEventListener('DOMContentLoaded', function() {
1372                const text = "Dinas Pendidikan dan Kebudayaan";
1373                const typingElement = document.getElementById('typingText');
1374                let index = 0;
1375
1376                function typeText() {
1377                    if (index < text.length) {
1378                        typingElement.textContent += text.charAt(index);
1379                        index++;
1380                        setTimeout(typeText, 80);
1381                    } else {
1382                        // Remove cursor setelah selesai dengan delay
1383                        setTimeout(() => {
1384                            typingElement.style.borderRight = 'none';
1385                        }, 2000);
1386                    }
1387                }
1388
1389                // Mulai typing setelah 800ms (setelah fade in)
1390                setTimeout(typeText, 800);
1391            });
1392
1393            // Smooth scroll ke section berikutnya
1394            function scrollToNextSection() {
1395                const nextSection = document.getElementById('visi');
1396                if (nextSection) {
1397                    nextSection.scrollIntoView({
1398                        behavior: 'smooth',
1399                        block: 'start'
1400                    });
1401                }
1402            }
1403        </script>
1403
1404
1405
1406<!-- VISI MISI SECTION -->
1407<section class="visi-misi-section" id="visi">
1408    <div class="container">
1409        <!-- Section Header - seperti "Berita Terbaru" -->
1410        <div class="text-center mb-5">
1411            <h3 class="section-main-title" style="color: #212e60;">Visi & Misi</h3>
1412            <p class="section-subtitle">Dinas Pendidikan dan Kebudayaan <span class="badge bg-warning text-dark">DISDIKBUD</span> Kota Padang</p>
1413            <hr class="line">
1414        </div>
1415
1416                <div class="row g-4">
1417            
1418            <!-- Card VISI - 8 Kolom -->
1419            <div class="col-lg-8">
1420                <div class="card shadow-sm h-100">
1421                    <div class="card-body p-3">
1422                        <h4 class="card-title-custom mb-2">VISI</h4>
1423                        <p class="card-text-content mb-0">
1424                            &quot;Menggerakkan segala potensi untuk Mewujudkan Kota Padang sebagai Kota Pintar (Smart City) dan Kota Sehat, berlandaskan agama dan budaya, menuju kota maju dan sejahtera.&quot;
1425                        </p>
1426                    </div>
1427                </div>
1428            </div>
1429
1430            <!-- Gambar - 4 Kolom (Sebelah Visi) -->
1431            <div class="col-lg-4">
1432                                                        <div class="card shadow-sm h-100">
1433                        <div class="image-container-visi">
1434                            <img src="/storage/info-bergambar/1766044402_HL-DAN-KARIKATUR-2005732567.png" 
1435                                 class="img-fluid" 
1436                                 alt="KEPALA DINAS PENDIDIKAN DAN KEBUDAYAAN KOTA PADANG"
1437                                 style="width: 100%; height: 100%; object-fit: contain;">
1438                        </div>
1439                        <div class="card-body py-2 px-3">
1440                            <h6 class="card-title text-center fw-bold mb-0" style="color: #212e60; font-size: 0.85rem; line-height: 1.3;">
1441                                KEPALA DINAS PENDIDIKAN DAN KEBUDAYAAN KOTA PADANG
1442                            </h6>
1443                        </div>
1444                    </div>
1445                                                </div>
1446
1447            <!-- Card MISI - Full Width dengan 2 Kolom Internal -->
1448                        <div class="col-12">
1449                <div class="card shadow-sm">
1450                    <div class="card-body p-4">
1451                        <h4 class="card-title-custom mb-4">MISI</h4>
1452                        <div class="row g-4">
1453                                                        
1454                            <!-- Kolom Kiri Misi -->
1455                            <div class="col-lg-6">
1456                                <div class="misi-items">
1457                                                                                                                        <div class="misi-item-row">
1458                                                <span class="misi-number">1</span>
1459                                                <span class="misi-text">Menguatkan Tata Kelola Pemerintahan Yang Berintegritas, Responsif, Inovatif Dan Partisipatif.</span>
1460                                            </div>
1461                                                                                                                                                                <div class="misi-item-row">
1462                                                <span class="misi-number">2</span>
1463                                                <span class="misi-text">Menguatkan Pencapaian Indikator Kota Pintar Dan Kota Sehat.</span>
1464                                            </div>
1465                                                                                                                                                                <div class="misi-item-row">
1466                                                <span class="misi-number">3</span>
1467                                                <span class="misi-text">Menguatkan Masyarakat Yang Beragama Dan Berbudaya Melalui Pendidikan Karakter.</span>
1468                                            </div>
1469                                                                                                                                                                <div class="misi-item-row">
1470                                                <span class="misi-number">4</span>
1471                                                <span class="misi-text">Mendorong Terbukanya Lapangan Pekerjaan.</span>
1472                                            </div>
1473                                                                                                                                                                                                                                                                                                                                                                                                                            </div>
1474                            </div>
1475                            
1476                            <!-- Kolom Kanan Misi -->
1477                            <div class="col-lg-6">
1478                                <div class="misi-items">
1479                                                                                                                                                                                                                                                                                                                                                                                                                                        <div class="misi-item-row">
1480                                                <span class="misi-number">5</span>
1481                                                <span class="misi-text">Mewujudkan Pembangunan Dan Merevitalisasi Sarana Dan Prasarana Umum Yang Hijau Dan Berkualitas.</span>
1482                                            </div>
1483                                                                                                                                                                <div class="misi-item-row">
1484                                                <span class="misi-number">6</span>
1485                                                <span class="misi-text">Menguatkan Jaringan Ketahanan Bencana.</span>
1486                                            </div>
1487                                                                                                                                                                <div class="misi-item-row">
1488                                                <span class="misi-number">7</span>
1489                                                <span class="misi-text">Mengembangkan Perekonomian Masyarakat Yang Adaptif Dan Kondusif Melalui Penguatan Sektor Perdagangan Dan Jasa.</span>
1490                                            </div>
1491                                                                                                                                                                <div class="misi-item-row">
1492                                                <span class="misi-number">8</span>
1493                                                <span class="misi-text">Menggerakkan Potensi Kota Untuk Terwujudnya Industri Kreatif Dan Pariwisata.</span>
1494                                            </div>
1495                                                                                                            </div>
1496                            </div>
1497                        </div>
1498                    </div>
1499                </div>
1500            </div>
1501            
1502            <!-- Card MOTTO - Full Width (jika ada) -->
1503            
1504        </div>
1505        
1506    </div>
1507</section>
1508
1509<style>
1510    /* Section Styling - Clean & Professional */
1511    .visi-misi-section {
1512        background: #f8f9fa;
1513        padding: 80px 0;
1514    }
1515    
1516    /* Section Header */
1517    .section-main-title {
1518        color: #212e60;
1519        font-weight: 700;
1520        font-size: 2rem;
1521        margin-bottom: 10px;
1522    }
1523    
1524    .section-subtitle {
1525        color: #666;
1526        font-size: 1rem;
1527        margin-bottom: 15px;
1528    }
1529    
1530    .line {
1531        width: 60px;
1532        height: 3px;
1533        background: #212e60;
1534        margin: 0 auto;
1535        border: none;
1536    }
1537    
1538    /* Card Styling - seperti card dokumen */
1539    .visi-misi-section .card {
1540        border: none;
1541        border-radius: 8px;
1542        transition: all 0.3s ease;
1543        background: #ffffff;
1544    }
1545    
1546    .visi-misi-section .card:hover {
1547        transform: translateY(-3px);
1548        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15) !important;
1549    }
1550    
1551    /* Number Badge - seperti nomor urut di halaman statistik */
1552    .number-badge {
1553        width: 45px;
1554        height: 45px;
1555        background: linear-gradient(135deg, #212e60 0%, #1a2352 100%);
1556        color: white;
1557        border-radius: 8px;
1558        display: flex;
1559        align-items: center;
1560        justify-content: center;
1561        font-weight: 700;
1562        font-size: 1.3rem;
1563        flex-shrink: 0;
1564        box-shadow: 0 4px 10px rgba(33, 46, 96, 0.2);
1565    }
1566    
1567    /* Card Title */
1568    .card-title-custom {
1569        color: #212e60;
1570        font-weight: 700;
1571        font-size: 1.4rem;
1572        letter-spacing: 1px;
1573        margin-bottom: 0;
1574    }
1575    
1576    /* Card Text Content */
1577    .card-text-content {
1578        color: #555;
1579        font-size: 1rem;
1580        line-height: 1.8;
1581        text-align: justify;
1582        margin-bottom: 0;
1583    }
1584    
1585    /* Image Container for Visi Card */
1586    .image-container-visi {
1587        flex: 1;
1588        display: flex;
1589        align-items: center;
1590        justify-content: center;
1591        padding: 15px;
1592        background: #f8f9fa;
1593    }
1594    
1595    /* Misi Items Container */
1596    .misi-items {
1597        display: flex;
1598        flex-direction: column;
1599        gap: 15px;
1600    }
1601    
1602    /* Misi Item Row - Clean & Structured */
1603    .misi-item-row {
1604        display: flex;
1605        align-items: flex-start;
1606        gap: 15px;
1607        padding: 15px;
1608        background: #f8f9fa;
1609        border-radius: 8px;
1610        border-left: 3px solid #212e60;
1611        transition: all 0.3s ease;
1612    }
1613    
1614    .misi-item-row:hover {
1615        background: #e9ecef;
1616        border-left-color: #19BBB5;
1617    }
1618    
1619    /* Misi Number */
1620    .misi-number {
1621        display: inline-flex;
1622        align-items: center;
1623        justify-content: center;
1624        width: 30px;
1625        height: 30px;
1626        background: #212e60;
1627        color: white;
1628        border-radius: 6px;
1629        font-weight: 700;
1630        font-size: 0.9rem;
1631        flex-shrink: 0;
1632    }
1633    
1634    /* Misi Text */
1635    .misi-text {
1636        flex: 1;
1637        color: #555;
1638        font-size: 0.95rem;
1639        line-height: 1.6;
1640    }
1641    
1642    /* Image Card di sidebar */
1643    .visi-misi-section .card-img-top {
1644        border-radius: 8px 8px 0 0;
1645    }
1646    
1647    /* Responsive Design */
1648    @media (max-width: 991px) {
1649        .visi-misi-section {
1650            padding: 60px 0;
1651        }
1652        
1653        .section-main-title {
1654            font-size: 1.75rem;
1655        }
1656        
1657        .card-title-custom {
1658            font-size: 1.25rem;
1659        }
1660        
1661        .card-text-content,
1662        .misi-text {
1663            font-size: 0.9rem;
1664        }
1665        
1666        .number-badge {
1667            width: 40px;
1668            height: 40px;
1669            font-size: 1.1rem;
1670        }
1671    }
1672    
1673    @media (max-width: 767px) {
1674        .visi-misi-section {
1675            padding: 50px 0;
1676        }
1677        
1678        .section-main-title {
1679            font-size: 1.5rem;
1680        }
1681        
1682        .card-title-custom {
1683            font-size: 1.15rem;
1684        }
1685        
1686        .card-text-content,
1687        .misi-text {
1688            font-size: 0.85rem;
1689        }
1690        
1691        .number-badge {
1692            width: 38px;
1693            height: 38px;
1694            font-size: 1rem;
1695        }
1696        
1697        .misi-number {
1698            width: 28px;
1699            height: 28px;
1700            font-size: 0.85rem;
1701        }
1702        
1703        .misi-item-row {
1704            padding: 12px;
1705            gap: 12px;
1706        }
1707    }
1708</style>
1709
1710
1711    </div>
1712    </div>
1713
1714    </div>
1715    </div>
1716    </section>
1717
1718    <!-- PROGRAM UNGGULAN -->
1719        
1720
1721    <!-- ARTIKEL -->
1722    <section class="my-5">
1723        <div class="container">
1724            <div class="text-center mt-5">
1725                <h3 class="red" style="color: #212e60;">Berita Terbaru</h3>
1726                <p>Berita dan Artikel <b>DISDIKBUD</b> Kota Padang</p>
1727                <hr class="line">
1728            </div>
1729            <div class="row g-4">
1730                                    <div class="col-lg-4 col-md-6">
1731                        <div class="card shadow-sm position-relative h-100">
1732                            <span class="card-date-badge">
1733                                13 September, 2026
1734                            </span>
1735                            <img src="/storage/berita_thumbnails/1789615453_Desain tanpa judul (18).jpg" alt="..." class="card-img-top"
1736                                style="height: 200px; object-fit: cover;" />
1737
1738                            <div class="card-body d-flex flex-column">
1739                                <div class="card-category"><i class="fas fa-tag me-1"></i> Kegiatan</div>
1740                                <h5 class="card-title">Pelaksanaan Belajar Mengajar (PBM) akibat Kondisi Kualitas Udara Kurang Baik</h5>
1741                                <p class="card-text mt-2">Edran Pelaksanaan Belajar Mengajar (PBM) akibat&nbsp;
1741Kondisi Kualitas Udara Kurang Baik&nbsp; pada t...</p>
1742
1743                                <div class="mt-auto">
1744                                    <a href="https://disdik.padang.go.id/berita/75"
1745                                        class="btn btn-primary btn-sm mt-2">
1746                                        Lihat Selengkapnya
1747                                    </a>
1748                                </div>
1749                            </div>
1750                        </div>
1751                    </div>
1752                                    <div class="col-lg-4 col-md-6">
1753                        <div class="card shadow-sm position-relative h-100">
1754                            <span class="card-date-badge">
1755                                16 September, 2026
1756                            </span>
1757                            <img src="/storage/berita_thumbnails/1789546558_Desain tanpa judul (17).jpg" alt="..." class="card-img-top"
1758                                style="height: 200px; object-fit: cover;" />
1759
1760                            <div class="card-body d-flex flex-column">
1761                                <div class="card-category"><i class="fas fa-tag me-1"></i> Kegiatan</div>
1762                                <h5 class="card-title">Penetapan Tari Buai-Buai Pauh sebagai Warisan Budaya Takbenda Indonesia (WBTbI) dari Kota Padang Tahun 2026</h5>
1763                                <p class="card-text mt-2">Tari Buai-Buai Pauh resmi ditetapkan sebagai Warisan Budaya Takbenda Indonesia (WBTbI) dari Kota Pad...</p>
1764
1765                                <div class="mt-auto">
1766                                    <a href="https://disdik.padang.go.id/berita/74"
1767                                        class="btn btn-primary btn-sm mt-2">
1768                                        Lihat Selengkapnya
1769                                    </a>
1770                                </div>
1771                            </div>
1772                        </div>
1773                    </div>
1774                                    <div class="col-lg-4 col-md-6">
1775                        <div class="card shadow-sm position-relative h-100">
1776                            <span class="card-date-badge">
1777                                11 September, 2026
1778                            </span>
1779                            <img src="/storage/berita_thumbnails/1789534561_Desain tanpa judul (13).jpg" alt="..." class="card-img-top"
1780                                style="height: 200px; object-fit: cover;" />
1781
1782                            <div class="card-body d-flex flex-column">
1783                                <div class="card-category"><i class="fas fa-tag me-1"></i> Kegiatan</div>
1784                                <h5 class="card-title">Mengukuhkan Dedikasi dan Pengabdian: Sertijab, Purna Bakti, dan Apresiasi ASN BerAKHLAK</h5>
1785                                <p class="card-text mt-2">Dinas Pendidikan dan Kebudayaan Kota Padang telah melaksanakan kegiatan Serah Terima Jabatan (Sertij...</p>
1786
1787                                <div class="mt-auto">
1788                                    <a href="https://disdik.padang.go.id/berita/73"
1789                                        class="btn btn-primary btn-sm mt-2">
1790                                        Lihat Selengkapnya
1791                                    </a>
1792                                </div>
1793                            </div>
1794                        </div>
1795                    </div>
1796                
1797
1798            </div>
1799            <div class="text-center mt-4">
1800                <a href="https://disdik.padang.go.id/berita-list" class="btn btn-primary px-4 py-2"
1801                    style="border-radius: 30px; font-weight: 600; box-shadow: 0 4px 6px rgba(0,0,0,0.1); transition: all 0.3s ease;">
1802                    Lihat Semua Berita
1803                </a>
1804            </div>
1805
1806            <style>
1807                .btn-primary:hover {
1808                    background-color: #0056b3 !important;
1809                    transform: translateY(-2px);
1810                    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
1811                }
1812            </style>
1813
1814        </div>
1815    </section>
1816    
1817<!-- INFO GAMBAR SLIDER -->
1818<section class="my-5">
1819    <div class="container">
1820        <div class="text-center mb-4">
1821            <h3 style="color:#212e60;">Info Gambar</h3>
1822            <p>Informasi Visual <b>DISDIKBUD</b> Kota Padang</p>
1823            <hr class="line">
1824        </div>
1825                <div class="slider-info-gambar-wrapper position-relative">
1826            <div class="slider-info-gambar">
1827                                    <div class="px-2">
1828                        <div class="info-gambar-item" 
1829                             data-toggle="modal" 
1830                             data-target="#modalInfoGambar"
1831                             data-image="/storage/info-gambar/1766376972_111.jpg"
1832                             data-title="a">
1833                            <div class="info-gambar-img-wrapper">
1834                                <img src="/storage/info-gambar/1766376972_111.jpg"
1835                                     class="info-gambar-img"
1836                                     alt="a">
1837                            </div>
1838                        </div>
1839                    </div>
1840                                    <div class="px-2">
1841                        <div class="info-gambar-item" 
1842                             data-toggle="modal" 
1843                             data-target="#modalInfoGambar"
1844                             data-image="/storage/info-gambar/1766373413_logo.png"
1845                             data-title="TEST 3">
1846                            <div class="info-gambar-img-wrapper">
1847                                <img src="/storage/info-gambar/1766373413_logo.png"
1848                                     class="info-gambar-img"
1849                                     alt="TEST 3">
1850                            </div>
1851                        </div>
1852                    </div>
1853                                    <div class="px-2">
1854                        <div class="info-gambar-item" 
1855                             data-toggle="modal" 
1856                             data-target="#modalInfoGambar"
1857                             data-image="/storage/info-gambar/1766373399_logo.png"
1858                             data-title="TEST2">
1859                            <div class="info-gambar-img-wrapper">
1860                                <img src="/storage/info-gambar/1766373399_logo.png"
1861                                     class="info-gambar-img"
1862                                     alt="TEST2">
1863                            </div>
1864                        </div>
1865                    </div>
1866                                    <div class="px-2">
1867                        <div class="info-gambar-item" 
1868                             data-toggle="modal" 
1869                             data-target="#modalInfoGambar"
1870                             data-image="/storage/info-gambar/1766373385_logo.png"
1871                             data-title="TEST">
1872                            <div class="info-gambar-img-wrapper">
1873                                <img src="/storage/info-gambar/1766373385_logo.png"
1874                                     class="info-gambar-img"
1875                                     alt="TEST">
1876                            </div>
1877                        </div>
1878                    </div>
1879                            </div>
1880        </div>
1881            </div>
1882</section>
1883
1884<!-- Modal Info Gambar -->
1885<div class="modal fade" id="modalInfoGambar" tabindex="-1" role="dialog" aria-hidden="true">
1886    <div class="modal-dialog modal-dialog-centered" role="document">
1887        <div class="modal-content border-0">
1888            <button type="button" class="modal-close-btn" data-dismiss="modal" aria-label="Close">
1889                <span aria-hidden="true">&times;</span>
1890            </button>
1891            <div class="modal-body p-0">
1892                <img src="" id="modalInfoGambarImage" class="modal-image" alt="">
1893                <div class="modal-caption">
1894                    <p id="modalInfoGambarLabel" class="mb-0"></p>
1895                </div>
1896            </div>
1897        </div>
1898    </div>
1899</div>
1900
1901<style>
1902/* INFO GAMBAR SLIDER */
1903.slider-info-gambar-wrapper {
1904    margin: 0 -15px;
1905}
1906
1907.slider-info-gambar {
1908    padding: 0 50px;
1909}
1910
1911.slider-info-gambar .slick-slide {
1912    padding: 0 8px;
1913}
1914
1915.info-gambar-item {
1916    cursor: pointer;
1917}
1918
1919.info-gambar-img-wrapper {
1920    width: 100%;
1921    height: 280px;
1922    overflow: hidden;
1923    background-color: #fff;
1924    border-radius: 8px;
1925    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
1926}
1927
1928.info-gambar-item:hover .info-gambar-img-wrapper {
1929    box-shadow: 0 8px 20px rgba(0,0,0,0.15);
1930}
1931
1932.info-gambar-img {
1933    width: 100%;
1934    height: 100%;
1935    object-fit: contain;
1936    object-position: center;
1937}
1938
1939/* Custom Slick Arrow */
1940.slider-info-gambar .slick-prev,
1941.slider-info-gambar .slick-next {
1942    width: 45px;
1943    height: 45px;
1944    background-color: #fff;
1945    border: 2px solid #212e60;
1946    border-radius: 50%;
1947    z-index: 10;
1948    transition: all 0.3s ease;
1949    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
1950}
1951
1952.slider-info-gambar .slick-prev:hover,
1953.slider-info-gambar .slick-next:hover {
1954    background-color: #212e60;
1955    transform: scale(1.1);
1956}
1957
1958.slider-info-gambar .slick-prev {
1959    left: 0;
1960}
1961
1962.slider-info-gambar .slick-next {
1963    right: 0;
1964}
1965
1966.slider-info-gambar .slick-prev:before,
1967.slider-info-gambar .slick-next:before {
1968    font-size: 22px;
1969    opacity: 1;
1970    color: #212e60;
1971}
1972
1973.slider-info-gambar .slick-prev:hover:before,
1974.slider-info-gambar .slick-next:hover:before {
1975    color: #fff;
1976}
1977
1978/* Modal Styling - Ukuran Sedang */
1979#modalInfoGambar .modal-dialog {
1980    max-width: 700px;
1981}
1982
1983#modalInfoGambar .modal-content {
1984    background-color: transparent;
1985    box-shadow: none;
1986}
1987
1988#modalInfoGambar .modal-body {
1989    position: relative;
1990    padding: 0;
1991    display: flex;
1992    flex-direction: column;
1993    align-items: center;
1994}
1995
1996.modal-image {
1997    width: 100%;
1998    height: auto;
1999    max-height: 500px;
2000    object-fit: contain;
2001    border-radius: 8px;
2002    background-color: #fff;
2003    box-shadow: 0 10px 40px rgba(0,0,0,0.3);
2004}
2005
2006.modal-caption {
2007    background-color: rgba(255, 255, 255, 0.95);
2008    padding: 12px 20px;
2009    border-radius: 8px;
2010    margin-top: 15px;
2011    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
2012    width: 100%;
2013    text-align: center;
2014}
2015
2016.modal-caption p {
2017    color: #212e60;
2018    font-weight: 600;
2019    font-size: 0.95rem;
2020}
2021
2022.modal-close-btn {
2023    position: absolute;
2024    top: -15px;
2025    right: -15px;
2026    z-index: 1050;
2027    width: 40px;
2028    height: 40px;
2029    background-color: #fff;
2030    border: 2px solid #212e60;
2031    border-radius: 50%;
2032    font-size: 26px;
2033    line-height: 1;
2034    color: #212e60;
2035    cursor: pointer;
2036    transition: all 0.3s ease;
2037    display: flex;
2038    align-items: center;
2039    justify-content: center;
2040    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
2041}
2042
2043.modal-close-btn:hover {
2044    background-color: #212e60;
2045    color: #fff;
2046    transform: rotate(90deg);
2047}
2048
2049/* Responsive Adjustments */
2050@media (max-width: 768px) {
2051    .slider-info-gambar {
2052        padding: 0 45px;
2053    }
2054    
2055    .info-gambar-img-wrapper {
2056        height: 220px;
2057    }
2058    
2059    .slider-info-gambar .slick-prev,
2060    .slider-info-gambar .slick-next {
2061        width: 38px;
2062        height: 38px;
2063    }
2064    
2065    #modalInfoGambar .modal-dialog {
2066        max-width: 90%;
2067        margin: 30px auto;
2068    }
2069    
2070    .modal-image {
2071        max-height: 400px;
2072    }
2073    
2074    .modal-close-btn {
2075        width: 36px;
2076        height: 36px;
2077        font-size: 24px;
2078        top: -12px;
2079        right: -12px;
2080    }
2081    
2082    .modal-caption {
2083        margin-top: 12px;
2084        padding: 10px 15px;
2085    }
2086    
2087    .modal-caption p {
2088        font-size: 0.9rem;
2089    }
2090}
2091
2092@media (max-width: 576px) {
2093    .slider-info-gambar {
2094        padding: 0 40px;
2095    }
2096    
2097    .info-gambar-img-wrapper {
2098        height: 200px;
2099    }
2100    
2101    .slider-info-gambar .slick-prev,
2102    .slider-info-gambar .slick-next {
2103        width: 35px;
2104        height: 35px;
2105    }
2106    
2107    .slider-info-gambar .slick-prev:before,
2108    .slider-info-gambar .slick-next:before {
2109        font-size: 18px;
2110    }
2111    
2112    #modalInfoGambar .modal-dialog {
2113        max-width: 95%;
2114        margin: 20px auto;
2115    }
2116    
2117    .modal-image {
2118        max-height: 350px;
2119    }
2120    
2121    .modal-close-btn {
2122        width: 34px;
2123        height: 34px;
2124        font-size: 22px;
2125        top: -10px;
2126        right: -10px;
2127    }
2128}
2129</style>
2130
2131<script>
2132$(document).ready(function () {
2133    // Initialize Slick Slider
2134    $('.slider-info-gambar').slick({
2135        slidesToShow: 3,
2136        slidesToScroll: 1,
2137        autoplay: true,
2138        autoplaySpeed: 3500,
2139        infinite: true,
2140        arrows: true,
2141        dots: false,
2142        centerMode: false,
2143        focusOnSelect: false,
2144        responsive: [
2145            {
2146                breakpoint: 1200,
2147                settings: {
2148                    slidesToShow: 3
2149                }
2150            },
2151            {
2152                breakpoint: 992,
2153                settings: {
2154                    slidesToShow: 2
2155                }
2156            },
2157            {
2158                breakpoint: 768,
2159                settings: {
2160                    slidesToShow: 2
2161                }
2162            },
2163            {
2164                breakpoint: 576,
2165                settings: {
2166                    slidesToShow: 1,
2167                    centerMode: false
2168                }
2169            }
2170        ]
2171    });
2172
2173    // Handle Modal Click
2174    $('.info-gambar-item').on('click', function() {
2175        var imageSrc = $(this).data('image');
2176        var imageTitle = $(this).data('title');
2177        
2178        $('#modalInfoGambarImage').attr('src', imageSrc);
2179        $('#modalInfoGambarLabel').text(imageTitle);
2180    });
2181
2182    // Reset modal on close
2183    $('#modalInfoGambar').on('hidden.bs.modal', function () {
2184        $('#modalInfoGambarImage').attr('src', '');
2185        $('#modalInfoGambarLabel').text('');
2186    });
2187});
2188</script>
2188
2189
2190
2191
2192<section class="my-5 kalender-section" id="layanan">
2193    <div class="container">
2194
2195        <div class="text-center mb-4">
2196            <h3 class="title">Kalender Akademik</h3>
2197            <p>Agenda Pendidikan <b>DISDIKBUD</b> Kota Padang</p>
2198            <hr class="line">
2199        </div>
2200
2201        <div class="calendar-wrapper">
2202
2203            <!-- HEADER -->
2204            <div class="calendar-nav">
2205                <h5 id="calendarTitle"
2206                    data-year="2026"
2207                    data-month="8">
2208                    September 2026
2209                </h5>
2210
2211                <div class="calendar-controls">
2212                    <button class="btn btn-dark btn-sm" id="btnPrev">‹</button>
2213                    <button class="btn btn-dark btn-sm" id="btnToday">today</button>
2214                    <button class="btn btn-dark btn-sm" id="btnNext">›</button>
2215                </div>
2216            </div>
2217
2218            <!-- GRID -->
2219            <div class="calendar-grid" id="calendarGrid"></div>
2220
2221        </div>
2222    </div>
2223</section>
2224
2225
2226
2227
2228<style>
2229  /* SECTION */
2230.kalender-section {
2231    background: url('/assets/img/bgcal.png') center/cover no-repeat;
2232    padding: 45px 0;
2233}
2234
2235/* WRAPPER */
2236.calendar-wrapper {
2237    background: rgba(255,255,255,0.96);
2238    border-radius: 14px;
2239    padding: 14px;
2240    max-width: 820px;      /* 🔥 lebih kecil & proporsional */
2241    margin: 0 auto;
2242}
2243
2244/* HEADER */
2245.calendar-nav {
2246    display: flex;
2247    align-items: center;
2248    justify-content: space-between;
2249    margin-bottom: 10px;
2250}
2251
2252.calendar-nav h5 {
2253    margin: 0;
2254    font-weight: 700;
2255    font-size: 15px;
2256    color: #212e60;
2257}
2258
2259/* BUTTON */
2260.calendar-controls {
2261    display: flex;
2262    gap: 6px;
2263}
2264
2265.calendar-controls .btn {
2266    padding: 3px 8px;
2267    font-size: 11px;
2268    border-radius: 6px;
2269}
2270
2271/* GRID */
2272.calendar-grid {
2273    display: grid;
2274    grid-template-columns: repeat(7, minmax(0, 1fr));
2275    gap: 5px;
2276}
2277
2278/* DAY HEADER */
2279.calendar-day-header {
2280    text-align: center;
2281    font-weight: 600;
2282    color: #212e60;
2283    font-size: 11px;
2284}
2285
2286/* CELL */
2287.calendar-cell {
2288    min-height: 68px;
2289    background: #fff;
2290    border-radius: 9px;
2291    padding: 4px;
2292    font-size: 11px;
2293    min-width: 0;
2294    overflow: hidden;
2295}
2296
2297/* OTHER MONTH */
2298.calendar-cell.other-month {
2299    opacity: 0.25;
2300}
2301
2302/* TODAY */
2303.calendar-cell.today {
2304    background: #b7f5c8;
2305    border: 2px solid #28a745;
2306}
2307
2308/* DATE */
2309.date-number {
2310    font-weight: 700;
2311    font-size: 10px;
2312    color: #333;
2313}
2314
2315/* EVENT */
2316.calendar-event {
2317    margin-top: 3px;
2318    padding: 2px 5px;
2319    background: #0dcaf0;
2320    color: #fff;
2321    border-radius: 5px;
2322    font-size: 9.5px;
2323    line-height: 1.2;
2324    white-space: nowrap;
2325    overflow: hidden;
2326    text-overflow: ellipsis;
2327}
2328
2329/* RESPONSIVE */
2330@media (max-width: 768px) {
2331    .calendar-wrapper {
2332        max-width: 100%;
2333        padding: 12px;
2334    }
2335
2336    .calendar-cell {
2337        min-height: 55px;
2338    }
2339}
2340
2341@media (max-width: 576px) {
2342    .calendar-grid {
2343        gap: 4px;
2344    }
2345
2346    .calendar-cell {
2347        min-height: 48px;
2348        padding: 3px;
2349    }
2350
2351    .calendar-nav h5 {
2352        font-size: 14px;
2353    }
2354
2355    .calendar-controls .btn {
2356        font-size: 10px;
2357        padding: 2px 6px;
2358    }
2359}
2360
2361</style>
2362
2363<script>
2364const kalenderData = {"2026-07-01":[{"id":7,"tanggal":"2026-07-01","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-16T00:59:04.000000Z","updated_at":"2026-07-16T00:59:04.000000Z"}],"2026-07-02":[{"id":8,"tanggal":"2026-07-02","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-16T00:59:26.000000Z","updated_at":"2026-07-16T00:59:26.000000Z"}],"2026-07-03":[{"id":9,"tanggal":"2026-07-03","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-16T01:00:27.000000Z","updated_at":"2026-07-16T01:00:27.000000Z"}],"2026-07-04":[{"id":10,"tanggal":"2026-07-04","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-16T01:01:01.000000Z","updated_at":"2026-07-16T01:01:01.000000Z"}],"2026-07-05":[{"id":11,"tanggal":"2026-07-05","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-16T01:02:49.000000Z","updated_at":"2026-07-16T01:02:49.000000Z"}],"2026-07-06":[{"id":12,"tanggal":"2026-07-06","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-16T01:03:07.000000Z","updated_at":"2026-07-16T01:03:07.000000Z"}],"2026-07-07":[{"id":13,"tanggal":"2026-07-07","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-16T01:03:19.000000Z","updated_at":"2026-07-16T01:03:19.000000Z"}],"2026-07-08":[{"id":14,"tanggal":"2026-07-08","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-16T01:03:28.000000Z","updated_at":"2026-07-16T01:03:28.000000Z"},{"id":34,"tanggal":"2026-07-08","deskripsi":"SUMATIF AKHIR SEMESTER","created_at":"2026-07-24T04:29:55.000000Z","updated_at":"2026-07-24T04:29:55.000000Z"}],"2026-07-10":[{"id":15,"tanggal":"2026-07-10","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-16T01:03:53.000000Z","updated_at":"2026-07-16T01:03:53.000000Z"}],"2026-07-09":[{"id":16,"tanggal":"2026-07-09","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-16T01:04:01.000000Z","updated_at":"2026-07-16T01:04:01.000000Z"}],"2026-07-11":[{"id":17,"tanggal":"2026-07-11","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-16T01:04:11.000000Z","updated_at":"2026-07-16T01:04:11.000000Z"}],"2026-07-13":[{"id":18,"tanggal":"2026-07-13","deskripsi":"AWAL SEMESTER GANJIL\/GENAP","created_at":"2026-07-16T01:04:51.000000Z","updated_at":"2026-07-16T01:04:51.000000Z"}],"2026-07-14":[{"id":19,"tanggal":"2026-07-14","deskripsi":"PENGENALAN LINGKUNGAN SEKOLAH (PLS)","created_at":"2026-07-16T01:05:28.000000Z","updated_at":"2026-07-16T01:05:28.000000Z"}],"2026-07-15":[{"id":20,"tanggal":"2026-07-15","deskripsi":"PENGENALAN LINGKUNGAN SEKOLAH (PLS)","created_at":"2026-07-16T01:05:37.000000Z","updated_at":"2026-07-16T01:05:37.000000Z"}],"2026-07-16":[{"id":21,"tanggal":"2026-07-16","deskripsi":"PENGENALAN LINGKUNGAN SEKOLAH (PLS)","created_at":"2026-07-16T01:05:49.000000Z","updated_at":"2026-07-16T01:06:07.000000Z"}],"2026-07-17":[{"id":22,"tanggal":"2026-07-17","deskripsi":"PENGENALAN LINGKUNGAN SEKOLAH (PLS)","created_at":"2026-07-16T01:06:19.000000Z","updated_at":"2026-07-16T01:06:19.000000Z"}],"2026-08-18":[{"id":23,"tanggal":"2026-08-18","deskripsi":"PERINGATAN HARI BESAR","created_at":"2026-07-16T01:08:56.000000Z","updated_at":"2026-07-16T01:08:56.000000Z"}],"2026-08-28":[{"id":24,"tanggal":"2026-08-28","deskripsi":"PERINGATAN HARI BESAR","created_at":"2026-07-16T01:09:07.000000Z","updated_at":"2026-07-16T01:09:07.000000Z"}],"2026-12-25":[{"id":25,"tanggal":"2026-12-25","deskripsi":"PERINGATAN HARI BESAR","created_at":"2026-07-16T01:09:32.000000Z","updated_at":"2026-07-16T01:09:32.000000Z"}],"2026-09-21":[{"id":26,"tanggal":"2026-09-21","deskripsi":"ASESMEN TENGAH SEMESTER SD DAN SMP","created_at":"2026-07-16T01:10:32.000000Z","updated_at":"2026-07-16T01:10:32.000000Z"}],"2026-09-22":[{"id":27,"tanggal":"2026-09-22","deskripsi":"ASESMEN TENGAH SEMESTER SD DAN SMP","created_at":"2026-07-16T01:10:40.000000Z","updated_at":"2026-07-16T01:10:40.000000Z"}],"2026-09-23":[{"id":28,"tanggal":"2026-09-23","deskripsi":"ASESMEN TENGAH SEMESTER SD DAN SMP","created_at":"2026-07-16T01:10:50.000000Z","updated_at":"2026-07-16T01:10:50.000000Z"}
2364],"2026-09-24":[{"id":29,"tanggal":"2026-09-24","deskripsi":"ASESMEN TENGAH SEMESTER SD DAN SMP","created_at":"2026-07-16T01:11:40.000000Z","updated_at":"2026-07-16T01:11:40.000000Z"}],"2026-09-25":[{"id":30,"tanggal":"2026-09-25","deskripsi":"ASESMEN TENGAH SEMESTER SD DAN SMP","created_at":"2026-07-16T01:12:23.000000Z","updated_at":"2026-07-16T01:12:23.000000Z"}],"2026-09-26":[{"id":31,"tanggal":"2026-09-26","deskripsi":"ASESMEN TENGAH SEMESTER SD DAN SMP","created_at":"2026-07-16T01:12:40.000000Z","updated_at":"2026-07-16T01:12:40.000000Z"}],"2026-11-25":[{"id":32,"tanggal":"2026-11-25","deskripsi":"PERINGATAN HARI BESAR","created_at":"2026-07-24T04:28:25.000000Z","updated_at":"2026-07-24T04:28:25.000000Z"}],"2026-12-07":[{"id":33,"tanggal":"2026-12-07","deskripsi":"SUMATIF AKHIR SEMESTER","created_at":"2026-07-24T04:29:34.000000Z","updated_at":"2026-07-24T04:29:34.000000Z"}],"2026-12-09":[{"id":35,"tanggal":"2026-12-09","deskripsi":"SUMATIF AKHIR SEMESTER","created_at":"2026-07-24T04:30:10.000000Z","updated_at":"2026-07-24T04:30:10.000000Z"}],"2026-12-10":[{"id":36,"tanggal":"2026-12-10","deskripsi":"SUMATIF AKHIR SEMESTER","created_at":"2026-07-24T04:30:28.000000Z","updated_at":"2026-07-24T04:30:28.000000Z"}],"2026-12-11":[{"id":37,"tanggal":"2026-12-11","deskripsi":"SUMATIF AKHIR SEMESTER","created_at":"2026-07-24T04:30:39.000000Z","updated_at":"2026-07-24T04:30:39.000000Z"}],"2026-12-12":[{"id":38,"tanggal":"2026-12-12","deskripsi":"SUMATIF AKHIR SEMESTER","created_at":"2026-07-24T04:30:51.000000Z","updated_at":"2026-07-24T04:30:51.000000Z"}],"2026-12-08":[{"id":39,"tanggal":"2026-12-08","deskripsi":"SUMATIF AKHIR SEMESTER","created_at":"2026-07-24T04:31:22.000000Z","updated_at":"2026-07-24T04:31:22.000000Z"}],"2026-12-14":[{"id":40,"tanggal":"2026-12-14","deskripsi":"CLASS MEETING\/PENGOLAHAN NILAI RAPOR","created_at":"2026-07-24T04:32:58.000000Z","updated_at":"2026-07-24T04:32:58.000000Z"}],"2026-12-15":[{"id":41,"tanggal":"2026-12-15","deskripsi":"CLASS MEETING\/PENGOLAHAN NILAI RAPOR","created_at":"2026-07-24T04:33:11.000000Z","updated_at":"2026-07-24T04:33:11.000000Z"}],"2026-12-16":[{"id":42,"tanggal":"2026-12-16","deskripsi":"CLASS MEETING\/PENGOLAHAN NILAI RAPOR","created_at":"2026-07-24T04:33:22.000000Z","updated_at":"2026-07-24T04:33:22.000000Z"}],"2026-12-17":[{"id":43,"tanggal":"2026-12-17","deskripsi":"CLASS MEETING\/PENGOLAHAN NILAI RAPOR","created_at":"2026-07-24T04:33:34.000000Z","updated_at":"2026-07-24T04:33:34.000000Z"}],"2026-12-18":[{"id":44,"tanggal":"2026-12-18","deskripsi":"CLASS MEETING\/PENGOLAHAN NILAI RAPOR","created_at":"2026-07-24T04:33:46.000000Z","updated_at":"2026-07-24T04:33:46.000000Z"}],"2026-12-19":[{"id":45,"tanggal":"2026-12-19","deskripsi":"PEMBAGIAN RAPOR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T04:35:05.000000Z","updated_at":"2026-07-24T04:35:05.000000Z"}],"2026-12-21":[{"id":46,"tanggal":"2026-12-21","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T04:36:07.000000Z","updated_at":"2026-07-24T04:36:07.000000Z"}],"2026-12-22":[{"id":47,"tanggal":"2026-12-22","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T04:36:19.000000Z","updated_at":"2026-07-24T04:36:19.000000Z"}],"2026-12-23":[{"id":48,"tanggal":"2026-12-23","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T04:36:30.000000Z","updated_at":"2026-07-24T04:36:30.000000Z"}],"2026-12-24":[{"id":49,"tanggal":"2026-12-24","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T04:36:39.000000Z","updated_at":"2026-07-24T04:36:39.000000Z"}],"2026-12-26":[{"id":50,"tanggal":"2026-12-26","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T04:36:51.000000Z","updated_at":"2026-07-24T04:36:51.000000Z"}],"2026-12-28":[{"id":51,"tanggal":"2026-12-28","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T04:37:06.000000Z","updated_at":"2026-07-24T04:37:06.000000Z"}],"2026-12-29":[{"id":52,"tanggal":"2026-12-29","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T04:37:18.000000Z","updated_at":"2026-07-24T04:37:18.000000Z"}],"2026-12-30":[{"id":53,"tanggal":"2026-12-30","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T04:37:28.000000Z","updated_at":"2026-07-24T04:37:28.000000Z"}],"2026-12-31":[{"id":54,"tanggal":"2026-12-31","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T04:37:38.000000Z","updated_at":"2026-07-24T04:37:38.000000Z"}],"2027-01-04":[{"id":55,"tanggal":"2027-01-04","deskripsi":"AWAL SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T04:38:14.000000Z","updated_at":"2026-07-24T04:38:14.000000Z"}],"2027-01-08":[{"id":56,"tanggal":"2027-01-08","deskripsi":"PERINGATAN HARI BESAR","created_at":"2026-07-24T04:39:18.000000Z","updated_at":"2026-07-24T04:39:18.000000Z"}],"2027-02-05":[{"id":57,"tanggal":"2027-02-05","deskripsi":"LIBUR AWAL RAMADHAN 1448H","created_at":"2026-07-24T04:40:28.000000Z","updated_at":"2026-07-24T04:40:28.000000Z"}],"2027-02-08":[{"id":58,"tanggal":"2027-02-08","deskripsi":"LIBUR AWAL RAMADHAN 1448H","created_at":"2026-07-24T04:42:45.000000Z","updated_at":"2026-07-24T04:42:45.000000Z"}],"2027-02-09":[{"id":59,"tanggal":"2027-02-09","deskripsi":"LIBUR AWAL RAMADHAN 1448H","created_at":"2026-07-24T04:43:00.000000Z","updated_at":"2026-07-24T04:43:00.000000Z"}],"2027-02-10":[{"id":60,"tanggal":"2027-02-10","deskripsi":"LIBUR AWAL RAMADHAN 1448H","created_at":"2026-07-24T04:43:22.000000Z","updated_at":"2026-07-24T04:43:22.000000Z"}],"2027-02-11":[{"id":61,"tanggal":"2027-02-11","deskripsi":"LIBUR AWAL RAMADHAN 1448H","created_at":"2026-07-24T04:43:34.000000Z","updated_at":"2026-07-24T04:43:34.000000Z"}],"2027-02-12":[{"id":62,"tanggal":"2027-02-12","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:45:32.000000Z","updated_at":"2026-07-24T04:45:32.000000Z"}],"2027-02-13":[{"id":63,"tanggal":"2027-02-13","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:45:45.
2364000000Z","updated_at":"2026-07-24T04:45:45.000000Z"}],"2027-02-15":[{"id":64,"tanggal":"2027-02-15","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:46:03.000000Z","updated_at":"2026-07-24T04:46:03.000000Z"}],"2027-02-16":[{"id":65,"tanggal":"2027-02-16","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:46:14.000000Z","updated_at":"2026-07-24T04:46:14.000000Z"}],"2027-02-17":[{"id":66,"tanggal":"2027-02-17","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:46:25.000000Z","updated_at":"2026-07-24T04:46:25.000000Z"}],"2027-02-18":[{"id":67,"tanggal":"2027-02-18","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:46:36.000000Z","updated_at":"2026-07-24T04:46:36.000000Z"}],"2027-02-19":[{"id":68,"tanggal":"2027-02-19","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:46:46.000000Z","updated_at":"2026-07-24T04:46:46.000000Z"}],"2027-02-20":[{"id":69,"tanggal":"2027-02-20","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:46:56.000000Z","updated_at":"2026-07-24T04:46:56.000000Z"}],"2027-02-22":[{"id":70,"tanggal":"2027-02-22","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:47:09.000000Z","updated_at":"2026-07-24T04:47:09.000000Z"}],"2027-02-23":[{"id":71,"tanggal":"2027-02-23","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:47:19.000000Z","updated_at":"2026-07-24T04:47:19.000000Z"}],"2027-02-24":[{"id":72,"tanggal":"2027-02-24","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:47:29.000000Z","updated_at":"2026-07-24T04:47:29.000000Z"}],"2027-02-25":[{"id":73,"tanggal":"2027-02-25","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:47:39.000000Z","updated_at":"2026-07-24T04:47:39.000000Z"}],"2027-02-27":[{"id":74,"tanggal":"2027-02-27","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:47:55.000000Z","updated_at":"2026-07-24T04:47:55.000000Z"}],"2027-02-26":[{"id":75,"tanggal":"2027-02-26","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:48:23.000000Z","updated_at":"2026-07-24T04:48:23.000000Z"}],"2027-03-01":[{"id":76,"tanggal":"2027-03-01","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:49:47.000000Z","updated_at":"2026-07-24T04:49:47.000000Z"}],"2027-03-02":[{"id":77,"tanggal":"2027-03-02","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:49:57.000000Z","updated_at":"2026-07-24T04:49:57.000000Z"}],"2027-03-03":[{"id":78,"tanggal":"2027-03-03","deskripsi":"PESANTREN RAMADHAN 1448H (KURIKULER SEMESTER 2)","created_at":"2026-07-24T04:50:08.000000Z","updated_at":"2026-07-24T04:50:08.000000Z"}],"2027-03-04":[{"id":79,"tanggal":"2027-03-04","deskripsi":"LIBUR IDUL FITRI 1448H","created_at":"2026-07-24T04:51:30.000000Z","updated_at":"2026-07-24T04:51:30.000000Z"}],"2027-03-05":[{"id":80,"tanggal":"2027-03-05","deskripsi":"LIBUR IDUL FITRI 1448H","created_at":"2026-07-24T04:51:39.000000Z","updated_at":"2026-07-24T04:51:39.000000Z"}],"2027-03-06":[{"id":81,"tanggal":"2027-03-06","deskripsi":"LIBUR IDUL FITRI 1448H","created_at":"2026-07-24T04:51:51.000000Z","updated_at":"2026-07-24T04:51:51.000000Z"}],"2027-03-08":[{"id":82,"tanggal":"2027-03-08","deskripsi":"LIBUR IDUL FITRI 1448H","created_at":"2026-07-24T04:52:02.000000Z","updated_at":"2026-07-24T04:52:02.000000Z"}],"2027-03-12":[{"id":83,"tanggal":"2027-03-12","deskripsi":"LIBUR IDUL FITRI 1448H","created_at":"2026-07-24T04:52:19.000000Z","updated_at":"2026-07-24T04:52:19.000000Z"}],"2027-03-13":[{"id":84,"tanggal":"2027-03-13","deskripsi":"LIBUR IDUL FITRI 1448H","created_at":"2026-07-24T04:52:30.000000Z","updated_at":"2026-07-24T04:52:30.000000Z"}],"2027-03-15":[{"id":85,"tanggal":"2027-03-15","deskripsi":"LIBUR IDUL FITRI 1448H","created_at":"2026-07-24T04:52:42.000000Z","updated_at":"2026-07-24T04:52:42.000000Z"}],"2027-03-16":[{"id":86,"tanggal":"2027-03-16","deskripsi":"LIBUR IDUL FITRI 1448H","created_at":"2026-07-24T04:52:54.000000Z","updated_at":"2026-07-24T04:52:54.000000Z"}],"2027-03-17":[{"id":87,"tanggal":"2027-03-17","deskripsi":"LIBUR IDUL FITRI 1448H","created_at":"2026-07-24T04:53:04.000000Z","updated_at":"2026-07-24T04:53:04.000000Z"}],"2027-03-18":[{"id":88,"tanggal":"2027-03-18","deskripsi":"LIBUR IDUL FITRI 1448H","created_at":"2026-07-24T04:53:14.000000Z","updated_at":"2026-07-24T04:53:14.000000Z"}],"2027-03-19":[{"id":89,"tanggal":"2027-03-19","deskripsi":"LIBUR IDUL FITRI 1448H","created_at":"2026-07-24T04:53:27.000000Z","updated_at":"2026-07-24T04:53:27.000000Z"}],"2027-03-20":[{"id":90,"tanggal":"2027-03-20","deskripsi":"LIBUR IDUL FITRI 1448H","created_at":"2026-07-24T04:53:36.000000Z","updated_at":"2026-07-24T04:53:36.000000Z"}],"2027-03-22":[{"id":91,"tanggal":"2027-03-22","deskripsi":"AWAL SEKOLAH SETELAH LIBUR IDUL FITRI","created_at":"2026-07-24T04:54:40.000000Z","updated_at":"2026-07-24T04:54:40.000000Z"}],"2027-03-29":[{"id":92,"tanggal":"2027-03-29","deskripsi":"ASESMEN TENGAH SEMESTER SD DAN SMP","created_at":"2026-07-24T04:55:24.000000Z","updated_at":"2026-07-24T04:55:24.000000Z"}],"2027-03-30":[{"id":93,"tanggal":"2027-03-30","deskripsi":"ASESMEN TENGAH SEMESTER SD DAN SMP","created_at":"2026-07-24T04:55:37.000000Z","updated_at":"2026-07-24T04:55:37.000000Z"}],"2027-03-31":[{"id":94,"tanggal":"2027-03-31","deskripsi":"ASESMEN TENGAH SEMESTER SD DAN SMP","created_at":"2026-07-24T04:55:51.000000Z","updated_at":"2026-07-24T04:55:51.000000Z"}],"2027-04-01":[{"id":95,"tanggal":"2027-04-01","deskripsi":"ASESMEN TENGAH SEMESTER SD DAN SMP","created_at":"2026-07-24T04:56:19.000000Z","updated_at":"2026-07-24T04:56:19.000000Z"}],"2027-04-02":[{"id":96,"tanggal":"2027-04-02","deskripsi":"ASESMEN TENGAH SEMESTER SD DAN SMP","created_at":"2026-07-24T04:56:30.000000Z","updated_at":"2026-07-24T04:56:30.000000Z"}],"2027-04-03":[{"id":97,"tanggal":"2027-04-03","deskripsi":"ASESMEN TENGAH SEMESTER SD DAN SMP","created_at":"2026-07-24T04:56:39.000000Z","updated_at":"2026-07-24T04:56:39.000000Z"}],"2027-04-12":[{"id":98,"tanggal":"2027-04-12","deskripsi":"PERKIRAAN TKA SD, SMP, KESETARAAN\/UJIAN PRAKTEK","created_at":"2026-07-24T04:57:26.000000Z","updated_at":"2026-07-24T04:57:26.000000Z"}],"2027-04-13":[{"id":99,"tanggal":"2027-04-13","deskripsi":"PERKIRAAN TKA SD, SMP, KESETARAAN\/UJIAN PRAKTEK","created_at":"2026-07-24T04:57:35.000000Z","updated_at":"2026-07-24T04:57:35.000000Z"}],"2027-04-14":[{"id":100,"tanggal":"2027-04-14","deskripsi":"PERKIRAAN TKA SD, SMP, KESETARAAN\/UJIAN PRAKTEK","created_at":"2026-07-24T04:57:45.000000Z","updated_at":"2026-07-24T04:57:45.000000Z"}],"2027-04-15":[{"id":101,"tanggal":"2027-04-15","deskripsi":"PERKIRAAN TKA SD, SMP, KESETARAAN\/UJIAN PRAKTEK","created_at":"2026-07-24T04:57:55.000000Z","updated_at":"2026-07-24T04:57:55.000000Z"}],"2027-04-16":[{"id":102,"tanggal":"2027-04-16","deskripsi":"PERKIRAAN TKA SD, SMP, KESETARAAN\/UJIAN PRAKTEK","created_at":"2026-07-24T04:58:05.000000Z","updated_at":"2026-07-24T04:58:05.000000Z"}],"2027-04-17":[{"id":103,"tanggal":"2027-04-17","deskripsi":"PERKIRAAN TKA SD, SMP, KESETARAAN\/UJIAN PRAKTEK","created_at":"2026-07-24T04:58:15.000000Z","updated_at":"2026-07-24T04:58:15.000000Z"}],"2027-04-19":[{"id":104,"tanggal":"2027-04-19","deskripsi":"PERKIRAAN TKA SD, SMP, KESETARAAN\/UJIAN PRAKTEK","created_at":"2026-07-24T04:58:25.000000Z","updated_at":"2026-07-24T04:58:25.000000Z"}],"2027-04-20":[{"id":105,"tanggal":"2027-04-20","deskripsi":"PERKIRAAN TKA SD, SMP, KESETARAAN\/UJIAN PRAKTEK","created_at":"2026-07-24T04:58:35.000000Z","updated_at":"2026-07-24T04:58:35.000000Z"}],"2027-04-21":[{"id":106,"tanggal":"2027-04-21","deskripsi":"PERKIRAAN TKA SD, SMP, KESETARAAN\/UJIAN PRAKTEK","created_at":"2026-07-24T04:58:44.000000Z","updated_at":"2026-07-24T04:58:44.000000Z"}],"2027-04-22":[{"id":107,"tanggal":"2027-04-22","deskripsi":"PERKIRAAN TKA SD, SMP, KESETARAAN\/UJIAN PRAKTEK","created_at":"2026-07-24T04:58:53.000000Z","updated_at":"2026-07-24T04:58:53.000000Z"}],"2027-04-23":[{"id":108,"tanggal":"2027-04-23","deskripsi":"PERKIRAAN TKA SD, SMP, KESETARAAN\/UJIAN PRAKTEK","created_at":"2026-07-24T04:59:02.000000Z","updated_at":"2026-07-24T04:59:02.000000Z"}],"2027-04-24":[{"id":109,"tanggal":"2027-04-24","deskripsi":"PERKIRAAN TKA SD, SMP, KESETARAAN\/UJIAN PRAKTEK","created_at":"2026-07-24T04:59:11.000000Z","updated_at":"2026-07-24T04:59:11.000000Z"}],"2027-05-10":[{"id":110,"tanggal":"2027-05-10","deskripsi":"ASESMEN AKHIR SEKOLAH","created_at":"2026-07-24T05:02:33.000000Z","updated_at":"2026-07-24T05:02:33.000000Z"}],"2027-05-11":[{"id":111,"tanggal":"2027-05-11","deskripsi":"ASESMEN AKHIR SEKOLAH","created_at":"2026-07-24T05:02:45.000000Z","updated_at":"2026-07-24T05:02:45.000000Z"}],"2027-05-12":[{"id":112,"tanggal":"2027-05-12","deskripsi":"ASESMEN AKHIR SEKOLAH","created_at":"2026-07-24T05:02:54.000000Z","updated_at":"2026-07-24T05:02:54.000000Z"}],"2027-05-13":[{"id":113,"tanggal":"2027-05-13","deskripsi":"ASESMEN AKHIR SEKOLAH","created_at":"2026-07-24T05:03:04.000000Z","updated_at":"2026-07-24T05:03:04.000000Z"}],"2027-05-14":[{"id":114,"tanggal":"2027-05-14","deskripsi":"ASESMEN AKHIR SEKOLAH","created_at":"2026-07-24T05:03:15.000000Z","updated_at":"2026-07-24T05:03:15.000000Z"}],"2027-05-15":[{"id":115,"tanggal":"2027-05-15","deskripsi":"ASESMEN AKHIR SEKOLAH","created_at":"2026-07-24T05:03:25.000000Z","updated_at":"2026-07-24T05:03:25.000000Z"}],"2027-06-07":[{"id":116,"tanggal":"2027-06-07","deskripsi":"SUMATIF AKHIR SEMESTER","created_at":"2026-07-24T05:04:26.000000Z","updated_at":"2026-07-24T05:04:26.000000Z"}],"2027-06-08":[{"id":117,"tanggal":"2027-06-08","deskripsi":"SUMATIF AKHIR SEMESTER","created_at":"2026-07-24T05:04:46.000000Z","updated_at":"2026-07-24T05:04:46.000000Z"}],"2027-06-09":[{"id":118,"tanggal":"2027-06-09","deskripsi":"SUMATIF AKHIR SEMESTER","created_at":"2026-07-24T05:04:55.000000Z","updated_at":"2026-07-24T05:04:55.000000Z"}],"2027-06-10":[{"id":119,"tanggal":"2027-06-10","deskripsi":"SUMATIF AKHIR SEMESTER","created_at":"2026-07-24T05:05:05.000000Z","updated_at":"2026-07-24T05:05:05.000000Z"}],"2027-06-11":[{"id":120,"tanggal":"2027-06-11","deskripsi":"SUMATIF AKHIR SEMESTER","created_at":"2026-07-24T05:05:14.000000Z","updated_at":"2026-07-24T05:05:14.000000Z"}],"2027-06-12":[{"id":121,"tanggal":"2027-06-12","deskripsi":"SUMATIF AKHIR SEMESTER","created_at":"2026-07-24T05:05:24.000000Z","updated_at":"2026-07-24T05:05:24.000000Z"}],"2027-06-14":[{"id":122,"tanggal":"2027-06-14","deskripsi":"CLASS MEETING\/PENGOLAHAN NILAI RAPOR","created_at":"2026-07-24T05:05:52.000000Z","updated_at":"2026-07-24T05:05:52.000000Z"}],"2027-06-15":[{"id":123,"tanggal":"2027-06-15","deskripsi":"CLASS MEETING\/PENGOLAHAN NILAI RAPOR","created_at":"2026-07-24T05:06:01.000000Z","updated_at":"2026-07-24T05:06:01.000000Z"}],"2027-06-16":[{"id":124,"tanggal":"2027-06-16","deskripsi":"CLASS MEETING\/PENGOLAHAN NILAI RAPOR","created_at":"2026-07-24T05:06:12.000000Z","updated_at":"2026-07-24T05:06:12.000000Z"}],"2027-06-17":[{"id":125,"tanggal":"2027-06-17","deskripsi":"CLASS MEETING\/PENGOLAHAN NILAI RAPOR","created_at":"2026-07-24T05:06:23.000000Z","updated_at":"2026-07-24T05:06:23.000000Z"}],"2027-06-18":[{"id":126,"tanggal":"2027-06-18","deskripsi":"CLASS MEETING\/PENGOLAHAN NILAI RAPOR","created_at":"2026-07-24T05:06:37.000000Z","updated_at":"2026-07-24T05:06:37.000000Z"}],"2027-06-19":[{"id":127,"tanggal":"2027-06-19","deskripsi":"PEMBAGIAN RAPOR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T05:07:04.000000Z","updated_at":"2026-07-24T05:07:04.000000Z"}],"2027-06-21":[{"id":128,"tanggal":"2027-06-21","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T06:15:01.000000Z","updated_at":"2026-07-24T06:15:01.000000Z"}],"2027-06-22":[{"id":129,"tanggal":"2027-06-22","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T06:15:36.000000Z","updated_at":"2026-07-24T06:15:36.000000Z"}],"2027-06-23":[{"id":130,"tanggal":"2027-06-23","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T06:15:47.000000Z","updated_at":"2026-07-24T06:15:47.000000Z"}],"2027-06-24":[{"id":131,"tanggal":"2027-06-24","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T06:15:58.000000Z","updated_at":"2026-07-24T06:15:58.000000Z"}],"2027-06-25":[{"id":132,"tanggal":"2027-06-25","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T06:16:10.000000Z","updated_at":"2026-07-24T06:16:10.000000Z"}],"2027-06-26":[{"id":133,"tanggal":"2027-06-26","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T06:16:20.000000Z","updated_at":"2026-07-24T06:16:20.000000Z"}],"2027-06-28":[{"id":134,"tanggal":"2027-06-28","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T06:16:31.000000Z","updated_at":"2026-07-24T06:16:31.000000Z"}],"2027-06-29":[{"id":135,"tanggal":"2027-06-29","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T06:16:44.000000Z","updated_at":"2026-07-24T06:16:44.000000Z"}
2364],"2027-06-30":[{"id":136,"tanggal":"2027-06-30","deskripsi":"LIBUR SEMESTER GANJIL\/GENAP","created_at":"2026-07-24T06:16:53.000000Z","updated_at":"2026-07-24T06:16:53.000000Z"}]};
2365
2366const titleEl = document.getElementById('calendarTitle');
2367const gridEl  = document.getElementById('calendarGrid');
2368
2369let currentYear  = parseInt(titleEl.dataset.year);
2370let currentMonth = parseInt(titleEl.dataset.month);
2371
2372function renderCalendar(year, month) {
2373    gridEl.innerHTML = '';
2374
2375    titleEl.innerText = new Date(year, month).toLocaleDateString('id-ID', {
2376        month: 'long',
2377        year: 'numeric'
2378    });
2379
2380    titleEl.dataset.year = year;
2381    titleEl.dataset.month = month;
2382
2383    const firstDay = new Date(year, month, 1);
2384    const startDay = new Date(firstDay);
2385    startDay.setDate(firstDay.getDate() - firstDay.getDay());
2386
2387    // Header hari
2388    ['Sun','Mon','Tue','Wed','Thu','Fri','Sat'].forEach(d => {
2389        const h = document.createElement('div');
2390        h.className = 'calendar-day-header';
2391        h.innerText = d;
2392        gridEl.appendChild(h);
2393    });
2394
2395    const today = new Date();
2396
2397    for (let i = 0; i < 42; i++) {
2398        const d = new Date(startDay);
2399        d.setDate(startDay.getDate() + i);
2400
2401        const cell = document.createElement('div');
2402        cell.className = 'calendar-cell';
2403
2404        if (d.getMonth() !== month) cell.classList.add('other-month');
2405        if (d.toDateString() === today.toDateString()) cell.classList.add('today');
2406
2407        cell.innerHTML = `<span class="date-number">${d.getDate()}</span>`;
2408
2409        const key = `${d.getFullYear()}-${String(d.getMonth()+1).padStart(2,'0')}-${String(d.getDate()).padStart(2,'0')}`;
2410
2411        if (kalenderData[key]) {
2412            kalenderData[key].forEach(ev => {
2413                const e = document.createElement('div');
2414                e.className = 'calendar-event';
2415                e.innerText = ev.deskripsi;
2416                cell.appendChild(e);
2417            });
2418        }
2419
2420        gridEl.appendChild(cell);
2421    }
2422}
2423
2424// CONTROLS
2425document.getElementById('btnPrev').onclick = () => {
2426    currentMonth--;
2427    if (currentMonth < 0) {
2428        currentMonth = 11;
2429        currentYear--;
2430    }
2431    renderCalendar(currentYear, currentMonth);
2432};
2433
2434document.getElementById('btnNext').onclick = () => {
2435    currentMonth++;
2436    if (currentMonth > 11) {
2437        currentMonth = 0;
2438        currentYear++;
2439    }
2440    renderCalendar(currentYear, currentMonth);
2441};
2442
2443document.getElementById('btnToday').onclick = () => {
2444    const now = new Date();
2445    currentYear = now.getFullYear();
2446    currentMonth = now.getMonth();
2447    renderCalendar(currentYear, currentMonth);
2448};
2449
2450// INIT
2451renderCalendar(currentYear, currentMonth);
2452</script>
2452
2453
2454
2455
2456
2457
2458    <section class="store-adventeges" id="adventeges">
2459        <div class="container">
2460            <div class="row text-center">
2461                <div class="col-12 mt-5">
2462                    <h3 class="red" style="color: #212e60;">Jumlah Pengunjung</h3>
2463                    <p>Jumlah Pengunjung Website
2464                        <span class="badge bg-warning text-dark">DISDIKBUD</span> Kota Padang
2465                    </p>
2466                    <hr class="line">
2467                </div>
2468            </div>
2469
2470            <div class="row justify-content-center mt-4">
2471                <!-- Card Hari Ini -->
2472                <div class="col-md-3 col-sm-6 mb-3">
2473                    <div class="card shadow-sm border-0">
2474                        <div class="card-body text-center">
2475                            <h5 class="card-title text-muted">Hari Ini</h5>
2476                            <h2 class="fw-bold text-success">192</h2>
2477                        </div>
2478                    </div>
2479                </div>
2480
2481                <!-- Card Bulan Ini -->
2482                <div class="col-md-3 col-sm-6 mb-3">
2483                    <div class="card shadow-sm border-0">
2484                        <div class="card-body text-center">
2485                            <h5 class="card-title text-muted">Bulan Ini</h5>
2486                            <h2 class="fw-bold text-primary">14152</h2>
2487                        </div>
2488                    </div>
2489                </div>
2490
2491                <!-- Card Bulan Lalu -->
2492                <div class="col-md-3 col-sm-6 mb-3">
2493                    <div class="card shadow-sm border-0">
2494                        <div class="card-body text-center">
2495                            <h5 class="card-title text-muted">Bulan Lalu</h5>
2496                            <h2 class="fw-bold text-secondary">7434</h2>
2497                        </div>
2498                    </div>
2499                </div>
2500
2501                <!-- Card Total Pengunjung -->
2502                <div class="col-md-3 col-sm-6 mb-3">
2503                    <div class="card shadow-sm border-0">
2504                        <div class="card-body text-center">
2505                            <h5 class="card-title text-muted">Total Pengunjung</h5>
2506                            <h2 class="fw-bold text-danger">54950</h2>
2507                        </div>
2508                    </div>
2509                </div>
2510            </div>
2511
2512        </div>
2513    </section>
2514
2515
2516
2517    <!-- KONTAK -->
2518    <section class="store-adventeges" id="adventeges">
2519        <div class="container-fluid kontak">
2520            <div class="row text-center">
2521                <div class="col-12"><br>
2522                    <h3 style="color:#212e60;"> Kontak Kami</h3>
2523                    <h6>[email protected]</h6>
2524                    <hr class="line">
2525                </div>
2526            </div>
2527            <div class="row justify-content-center">
2528                
2529                <div class="col-12">
2530                    <div class="container">
2531                        <div class="w-auto mb-2">
2532                            <div class="row justify-content-center">
2533                                <div class="container-iframe">
2534
2535
2536                                    <iframe class="iframe-maps"
2537                                        src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1504.2217282869278!2d100.35873817220963!3d-0.9530398525107862!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x2fd4b938f6e103cf%3A0x89b0dbf4883e4677!2sDinas%20Pendidikan%20dan%20Kebudayaan%20Kota%20Padang!5e0!3m2!1sid!2sid!4v1765762201516!5m2!1sid!2sid"
2538                                        allowfullscreen="" loading="lazy"></iframe>
2539                                </div>
2540                            </div>
2541                        </div>
2542
2543                    </div>
2544
2545                </div>
2546
2547
2548            </div>
2549        </div>
2550    </section>
2551
2552    </div>
2553    <!-- footer -->
2554    <footer class="text-center text-lg-start">
2555    <section class="">
2556        <div class="container text-center text-md-start mt-5">
2557            <!-- Grid row -->
2558            <div class="row mt-3">
2559                <!-- Grid column - Informasi Kontak -->
2560                <div class="col-md-3 col-lg-4 col-xl-3 mx-auto mb-1">
2561                    <!-- Content -->
2562                    <h6 class="text-uppercase fw-bold mb-2 text-left">DISDIKBUD KOTA PADANG</h6>
2563                    <p class="text-left text-white">
2563Jln. Marah Roesli No.25A, Belakang Tangsi, Kec. Padang Bar., Kota Padang, Sumatera Barat</p>
2564                    
2565                                            <p class="text-left text-white">
2566                            <i class="bi bi-telephone-forward-fill"></i>
2567                            082350232165
2568                        </p>
2569                                        
2570                                            <p class="text-left text-white">
2571                            <i class="bi bi-envelope-at-fill"></i> [email protected]
2572                        </p>
2573                                        
2574                    <!-- Media Sosial -->
2575                                        
2576                                            <h6 class="text-uppercase fw-bold mb-2 text-left">media sosial: </h6>
2577                        <h5 class="text-left">
2578                                                            <a href="https://www.facebook.com/DISDIKBUDPADANG/?locale=id_ID" target="_blank" rel="noopener noreferrer" class="me-4 pl-1 text-white">
2579                                    <i class="bi bi-facebook"></i>
2580                                </a>
2581                                                            <a href="https://www.x.com/" target="_blank" rel="noopener noreferrer" class="me-4 pl-1 text-white">
2582                                    <i class="bi bi-twitter"></i>
2583                                </a>
2584                                                            <a href="https://www.google.com/" target="_blank" rel="noopener noreferrer" class="me-4 pl-1 text-white">
2585                                    <i class="bi bi-google"></i>
2586                                </a>
2587                                                            <a href="https://www.instagram.com/disdikbud_padang/" target="_blank" rel="noopener noreferrer" class="me-4 pl-1 text-white">
2588                                    <i class="bi bi-instagram"></i>
2589                                </a>
2590                                                            <a href="https://linkedin.com/" target="_blank" rel="noopener noreferrer" class="me-4 pl-1 text-white">
2591                                    <i class="bi bi-linkedin"></i>
2592                                </a>
2593                                                            <a href="https://wa.me/" target="_blank" rel="noopener noreferrer" class="me-4 pl-1 text-white">
2594                                    <i class="bi bi-whatsapp"></i>
2595                                </a>
2596                                                    </h5>
2597                                    </div> <!-- Grid column -->
2598                
2599                <!-- Grid column - Useful Links -->
2600                <div class="col-md-2 col-lg-2 col-xl-2 mx-auto mb-4">
2601                    <h6 class="text-uppercase text-left fw-bold mb-4">Useful Links</h6>
2602                                                                        <a href="https://disdik.padang.go.id" target="_blank" rel="noopener noreferrer" class="">
2603                                <p class="text-left text-white">DISDIK PADANG</p>
2604                            </a>
2605                                                    <a href="https://psb.diknaspadang.id/" target="_blank" rel="noopener noreferrer" class="">
2606                                <p class="text-left text-white">SPMB</p>
2607                            </a>
2608                                                            </div> <!-- Grid column -->
2609                
2610                <!-- Grid column - Other Website -->
2611                <div class="col-md-3 col-lg-2 col-xl-2 mx-auto mb-4">
2612                    <h6 class="text-uppercase text-left fw-bold mb-4">Other Website</h6>
2613                                            <p class="text-left text-white">-</p>
2614                                    </div> <!-- Grid column -->
2615                
2616                <!-- Grid column - Informasi Terkait -->
2617                <div class="col-md-4 col-lg-3 col-xl-3 mx-auto mb-md-0 mb-4">
2618                    <h6 class="text-uppercase text-left fw-bold mb-4">Informasi Terkait</h6>
2619                                                                        <a href="https://padang.go.id/" target="_blank" rel="noopener noreferrer" class="">
2620                                <p class="text-left text-white">Pemkot Padang</p>
2621                            </a>
2622                                                            </div> <!-- Grid column -->
2623            </div> <!-- Grid row -->
2624        </div>
2625    </section> <!-- Section: Links  -->
2626    
2627    <!-- Copyright -->
2628    <div class="text-center p-2"> 
2629        &copy;
2629 Copyright 2026
2630                    <a href="#" target="_blank" rel="noopener noreferrer" class="text-white">
2631                DISKOMINFO KOTA PADANG
2632            </a>
2633            </div> <!-- Copyright -->
2634
2635    <a href="#" class="back-to-top" id="backToTop">
2636        <i class="fas fa-arrow-up"></i>
2637    </a>
2638    
2639    
2639<script>
2640        // Back to top button untuk semua halaman
2641        document.addEventListener('DOMContentLoaded', function() {
2642            const backToTopButton = document.getElementById('backToTop');
2643
2644            if (backToTopButton) {
2645                window.addEventListener('scroll', function() {
2646                    if (window.pageYOffset > 300) {
2647                        backToTopButton.classList.add('active');
2648                    } else {
2649                        backToTopButton.classList.remove('active');
2650                    }
2651                });
2652
2653                backToTopButton.addEventListener('click', function(e) {
2654                    e.preventDefault();
2655                    window.scrollTo({
2656                        top: 0,
2657                        behavior: 'smooth'
2658                    });
2659                });
2660            }
2661        });
2662    </script>
2662
2663</footer>
2664
2665<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
2665    <!-- akhir footer -->
2666
2667    <!-- modal -->
2668    <div id="modalBerita" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="my-modal-title"
2669        aria-hidden="true">
2670        <div class="modal-dialog modal-dialog-centered" role="document">
2671            <div class="modal-content">
2672                <div class="modal-header">
2673                    <h5 class="modal-title berita-title">Contoh</h5>
2674                    <button class="close" data-dismiss="modal" aria-label="Close">
2675                        <span aria-hidden="true">&times;</span>
2676                    </button>
2677                </div>
2678                <div class="modal-body">
2679                    <div class="card">
2680                        <img class="card-img-top w-100 berita-img" src="assets/img/1123123 1.png" alt="">
2681                        <div class="card-body">
2682                            <div class="card-text berita-isi">Content</div>
2683                        </div>
2684                        <img class="card-img-bottom" src="" alt="">
2685                    </div>
2686                </div>
2687                <div class="modal-footer berita-tgl">
2688
2689                </div>
2690            </div>
2691        </div>
2692    </div>
2693    <!-- modal -->
2694
2695
2696
2697    <!-- Highlight modal artikel -->
2698
2699
2700    <!-- Bootstrap core JavaScript -->
2701
2702    <!-- scripts -->
2703
2704    
2704<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
2704
2705    
2705<script src="assets/particles.js"></script>
2705
2706    
2706<script src="assets/app.js"></script>
2706
2707    
2708
2709    
2709<script src="https://code.jquery.com/jquery-3.6.1.min.js"
2710        integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ=" crossorigin="anonymous"></script>
2710
2711
2712    
2712<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
2712
2713    
2713<script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
2713
2714    
2715    
2715<script>
2716        AOS.init();
2717    </script>
2717
2718    
2718<script src="assets/js/navbar-scroll.js"></script>
2718
2719
2720
2721    
2721<script>
2722        $(document).ready(function() {
2723            $('.preloader').fadeOut(1000);
2724
2725            $('.berita').on('click', function() {
2726                $('#modal-berita').modal('show');
2727                $('.berita-title').text($(this).attr('data-judul'));
2728                $('.berita-img').attr('src', $(this).attr('data-thumbnail'));
2729                $('.berita-isi').html($(this).attr('data-isi'));
2730                $('.berita-tgl').text($(this).attr('data-tgl'));
2731            });
2732        });
2733    </script>
2733
2734<script>
2735document.addEventListener('DOMContentLoaded', function () {
2736
2737    var slideImg = document.getElementById("slideImg");
2738
2739    if (!slideImg) {
2740        console.error('slideImg tidak ditemukan');
2741        return;
2742    }
2743
2744    var images = [
2745        "/assets/img/Intersect1.png",
2746                    "/storage/hero_sections/1772416927_Snapshot_9.jpg",
2747                    "/storage/hero_sections/1772416554_Snapshot_14.jpg",
2748                    "/storage/hero_sections/1766114464_balaikotabaru.png",
2749                    "/storage/hero_sections/1766114418_WhatsApp Image 2025-12-16 at 13.31.17.jpeg",
2750            ];
2751
2752    var i = 0;
2753    var len = images.length;
2754
2755    function slider() {
2756
2757    // fade out
2758    slideImg.style.opacity = 0;
2759
2760    setTimeout(function () {
2761        slideImg.src = images[i];
2762
2763        // setelah ganti gambar → fade in
2764        slideImg.onload = function () {
2765            slideImg.style.opacity = 1;
2766        };
2767
2768        i = (i + 1) % len;
2769
2770    }, 400); // waktu fade-out
2771
2772    setTimeout(slider, 6000);
2773}
2774
2775
2776    slider(); // JALANKAN SEKALI SAJA
2777});
2778</script>
2778
2779
2780
2781
2782
2783    
2783<script async src="//www.instagram.com/embed.js"></script>
2783
2784
2785
2786        <!-- Back to top button -->
2787    <a href="#" class="back-to-top" id="backToTop">
2788        <i class="fas fa-arrow-up"></i>
2789    </a>
2790
2791    
2791<script>
2792        // Back to top button
2793        const backToTopButton = document.getElementById('backToTop');
2794
2795        window.addEventListener('scroll', function() {
2796            if (window.pageYOffset > 300) {
2797                backToTopButton.classList.add('active');
2798            } else {
2799                backToTopButton.classList.remove('active');
2800            }
2801        });
2802
2803        backToTopButton.addEventListener('click', function(e) {
2804            e.preventDefault();
2805            window.scrollTo({
2806                top: 0,
2807                behavior: 'smooth'
2808            });
2809        });
2810    </script>
2810
2811    
2812    <!-- TTS Script -->
2813    
2813<script>
2814        // Fungsi untuk membaca teks
2815        function speakText(text) {
2816            if ('speechSynthesis' in window) {
2817                window.speechSynthesis.cancel();
2818                const utterance = new SpeechSynthesisUtterance(text);
2819                utterance.lang = 'id-ID';
2820                utterance.rate = 1;
2821                utterance.volume = 1;
2822                utterance.pitch = 1;
2823                window.speechSynthesis.speak(utterance);
2824            }
2825        }
2826
2827        // Auto-play saat pertama masuk
2828        document.addEventListener('DOMContentLoaded', function() {
2829            setTimeout(function() {
2830                speakText('Selamat datang di website Dinas Pendidikan dan Kebudayaan Kota Padang');
2831            }, 1000);
2832        });
2833
2834        // Baca teks yang di-select
2835        document.addEventListener('mouseup', function() {
2836            const selectedText = window.getSelection().toString().trim();
2837            if (selectedText.length > 0) {
2838                setTimeout(function() {
2839                    speakText(selectedText);
2840                }, 300);
2841            }
2842        });
2843    </script>
2843
2844    
2845    
2845<script src="https://cdn.jsdelivr.net/npm/sienna-accessibility@latest/dist/sienna-accessibility.umd.js" defer></script>
2845
2846    
2847    
2848</body>
2849<!-- jQuery -->
2850<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
2850
2851<!-- Slick Carousel JS -->
2852<script src="https://cdn.jsdelivr.net/npm/[email protected]/slick/slick.min.js"></script>
2852
2853<!-- Inisialisasi Slider -->
2854<script>
2855    $(document).ready(function() {
2856        console.log('slider aktif');
2857        $('.slider-galeri').slick({
2858            slidesToShow: 2.8,
2859            slidesToScroll: 1,
2860            autoplay: true,
2861            autoplaySpeed: 3000,
2862            infinite: true, // ✅ tambahkan ini
2863            centerMode: true,
2864            centerPadding: '40px',
2865            arrows: true,
2866            dots: true,
2867            responsive: [{
2868                    breakpoint: 992,
2869                    settings: {
2870                        slidesToShow: 2
2871                    }
2872                },
2873                {
2874                    breakpoint: 768,
2875                    settings: {
2876                        slidesToShow: 1
2877                    }
2878                }
2879            ]
2880        });
2881
2882    });
2883</script>
2883
2884<script>
2885    document.addEventListener('DOMContentLoaded', function() {
2886        var myCarousel = document.querySelector('#galeriCarousel');
2887        var carousel = new bootstrap.Carousel(myCarousel, {
2888            interval: 3000,
2889            ride: 'carousel'
2890        });
2891    });
2892</script>
2892
2893<script>
2894    document.addEventListener('DOMContentLoaded', function() {
2895        var detailModal = document.getElementById('detailModal');
2896        detailModal.addEventListener('show.bs.modal', function(event) {
2897            var button = event.relatedTarget;
2898
2899            var title = button.getAttribute('data-title');
2900            var image = button.getAttribute('data-image');
2901            var date = button.getAttribute('data-date');
2902
2903            detailModal.querySelector('#modalTitle').textContent = title;
2904            detailModal.querySelector('#modalImage').src = image;
2905            detailModal.querySelector('#modalDate').textContent = date;
2906        });
2907    });
2908</script>
2908
2909
2910</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.