body {font-family:'Open Sans',sans-serif;background:#fff;margin:0;padding:0;line-height:1.6;color:#000}
header {width:100%;height:auto;overflow:hidden}
header img {width:100%;height:auto;display:block;border-radius:0}
nav {position:sticky;top:0;z-index:1000;background:#003609;padding:10px;text-align:center}
nav a {color:#fff;margin:0 10px;text-decoration:none;font-weight:700;font-size:14px}
#datetime {background:#f1f1f1;text-align:center;padding:10px;font-weight:bold}
.share {margin:20px;text-align:center}
.container {padding:10px;max-width:900px;margin:10px}
h1 {font-family:'Montserrat',sans-serif;color:#003609;text-align:center;font-size:21px;line-height:25px;}
h2 {font-family:'Segoe UI',sans-serif;color:#003609;font-size:19px;margin-top:30px;line-height:23px;}
h3 {font-family:'Segoe UI',sans-serif;color:#003609;font-size:17px;margin-top:20px;line-height:21px;}
p {font-family:'Lato',sans-serif;font-size:14px;text-align:justify;color:#000}
form {background:#e0f7e9;padding:20px;border-radius:20px;margin-top:30px}
        input, textarea, select {width:90%;padding:10px;margin-bottom:10px;border:none;border-radius:10px;font-family:'Open Sans',sans-serif;font-size:14px}
        button {background:#4b0082;color:#fff;padding:10px 20px;border:none;border-radius:10px;cursor:pointer;font-weight:bold;font-size:15px}
/*
form {background:#e0f7e9;padding:20px;border-radius:20px;margin-top:30px}
input, textarea, select {width:90%;padding:10px;margin-bottom:10px;border:none;border-radius:10px;font-family:'Open Sans',sans-serif;font-size:14px}
button {background:#4b0082;color:#fff;padding:10px 20px;border:none;border-radius:10px;cursor:pointer;font-weight:bold;font-size:15px}
*/
footer {background:#003609;color:#fff;text-align:center;padding:10px;margin-top:40px;border-radius:19px;font-size:12px}
.gallery-container {display:flex;flex-wrap:wrap;gap:2px;margin-top:20px;margin-bottom:30px}
.gallery-item {width:calc(25% - 10px);aspect-ratio:1/1;overflow:hidden;border-radius:19px}
.gallery-item img {width:100%;height:100%;object-fit:cover;display:block;border-radius:19px;transition:transform 0.3s ease;max-width:100%;height:auto}
.gallery-item img:hover {transform:scale(1.05)}
.fancybox__iframe {border-radius:18px !important}
.fancybox__container {background:rgba(0,0,0,0.85)}
.fancybox__content {border-radius:18px;overflow:hidden}
.faq-accordion {margin-top:20px}
.faq-item {margin-bottom:10px;border:1px solid #ccc;border-radius:5px;overflow:hidden}
.faq-question {background-color:#003609;color:#fff;padding:12px;width:100%;text-align:left;border:none;cursor:pointer;font-size:14px;font-weight:bold}
.faq-answer {background-color:#fff;color:#003609;padding:12px;font-size:14px;display:none;line-height:1.6}
.faq-question.active + .faq-answer {display:block}
.chart-container {width:95%;max-width:1200px;margin:30px auto}
.table-container {overflow-x:auto;margin-top:40px}
table {width:100%;border-collapse:collapse;font-size:14px;min-width:700px;background-color:#fff;box-shadow:0 2px 8px #cccccc;border-radius:19px}
th, td {border:1px solid #dddddd;padding:14px 12px;text-align:left}
th {background-color:#e3f2fd;font-weight:bold}
        .footer {display:flex;justify-content:space-between;flex-wrap:wrap;background:#ffffff;padding:20px 10px;box-sizing:border-box;border-top:1px solid #cccccc}
        .footer-col {width:45%;margin-bottom:10px}
        .footer-col h4 {margin:0 0 10px 0;font-size:14px;color:#333333}
        .footer-col p {margin:18px;font-size:13px;color:#666666}
/*
footer {background:#003609;color:#fff;text-align:center;padding:10px;margin-top:40px;border-radius:0;font-size:12px}
.footer-col {width:45%;margin-bottom:10px}
.footer-col h4 {margin:0 0 10px 0;font-size:14px;color:#333333}
.footer-col p {margin:18px;font-size:13px;color:#666666}
*/
.copyright {background:#002900;color:#ffffff;text-align:center;padding:10px;font-size:12px;width:100%;box-sizing:border-box;}

@media screen and (max-width:800px) {.gallery-item {width:calc(50% - 10px)}}
@media screen and (max-width:500px) {.gallery-item {width:calc(50% - 2px)}}
@media screen and (max-width:400px) {.gallery-item {width:calc(50% - 2px)}}
@media screen and (max-width:300px) {.gallery-item {width:calc(50% - 2px)}}
@media screen and (max-width:200px) {.gallery-item {width:calc(50% - 2px)}}
@media screen and (max-width:600px) {.footer-col {width:100%}}
@media (max-width:768px) {th, td {padding:10px;font-size:13px}}
@media (max-width:500px) {th, td {font-size:12px}}
@import url('https://fonts.googleapis.com/css2?family=Segoe+UI&display=swap')
.table-container {overflow-x:auto;margin-top:20px}
.tabel-bersih {width:100%;border-collapse:collapse;font-size:14px;background:#fff;min-width:320px;box-shadow:0 2px 8px rgba(0,0,0,0.1);border-radius:12px;overflow:hidden}
.tabel-bersih th, .tabel-bersih td {border:1px solid #ccc;padding:10px;text-align:left}
.tabel-bersih .kanan {text-align:right}
.tabel-bersih .kiri {text-align:left}
.tabel-bersih th {background-color:#e3f2fd;color:#000;font-weight:bold}
@media(max-width:600px) {.tabel-bersih {font-size:13px}}
@media(max-width:400px) {.tabel-bersih th, .tabel-bersih td {padding:8px}}

        .gallery-container {display:flex;flex-wrap:wrap;gap:2px;margin-top:20px;margin-bottom:30px}
        .gallery-item {width:calc(25% - 10px);aspect-ratio:1/1;overflow:hidden;border-radius:19px}
        .gallery-item img {width:100%;height:100%;object-fit:cover;display:block;border-radius:19px;transition:transform 0.3s ease}
        .gallery-item img:hover {transform:scale(1.05)}
        @media(max-width:800px){.gallery-item{width:calc(50% - 10px)}}
        @media(max-width:500px){.gallery-item{width:calc(50% - 2px)}}
        @media(max-width:400px){.gallery-item{width:calc(50% - 2px)}}
        @media(max-width:300px){.gallery-item{width:calc(50% - 2px)}}
        @media(max-width:200px){.gallery-item{width:calc(50% - 2px)}}