update navbar menu + mobile |

main
marszayn 2025-06-16 11:46:35 +07:00
parent 85e3530e9a
commit c2619f01a9
56 changed files with 4444 additions and 1142 deletions

View File

@ -41,7 +41,7 @@
<div class="icon-blob absolute inset-0 bg-white rounded-full scale-0 opacity-0"></div> <div class="icon-blob absolute inset-0 bg-white rounded-full scale-0 opacity-0"></div>
</div> </div>
</div> </div>
<div class="text-left card-content opacity-0 pointer-events-none"> <div class="text-left card-content-info opacity-0 pointer-events-none">
<div class="flex items-end gap-2"> <div class="flex items-end gap-2">
<div class="text-5xl md:text-7xl font-bold rolling-number" data-target="673">0</div> <div class="text-5xl md:text-7xl font-bold rolling-number" data-target="673">0</div>
<div class="text-lg md:text-sm font-normal">Ton</div> <div class="text-lg md:text-sm font-normal">Ton</div>
@ -76,7 +76,7 @@
<div class="icon-blob absolute inset-0 bg-white rounded-full scale-0 opacity-0"></div> <div class="icon-blob absolute inset-0 bg-white rounded-full scale-0 opacity-0"></div>
</div> </div>
</div> </div>
<div class="text-left card-content opacity-0 pointer-events-none"> <div class="text-left card-content-info opacity-0 pointer-events-none">
<div class="flex items-end gap-2"> <div class="flex items-end gap-2">
<div class="text-5xl md:text-7xl font-bold rolling-number" data-target="673">0</div> <div class="text-5xl md:text-7xl font-bold rolling-number" data-target="673">0</div>
<div class="text-lg md:text-sm font-normal">Unit</div> <div class="text-lg md:text-sm font-normal">Unit</div>
@ -111,7 +111,7 @@
<div class="icon-blob absolute inset-0 bg-white rounded-full scale-0 opacity-0"></div> <div class="icon-blob absolute inset-0 bg-white rounded-full scale-0 opacity-0"></div>
</div> </div>
</div> </div>
<div class="text-left card-content opacity-0 pointer-events-none"> <div class="text-left card-content-info opacity-0 pointer-events-none">
<div class="flex items-end gap-2"> <div class="flex items-end gap-2">
<div class="text-5xl md:text-7xl font-bold rolling-number" data-target="8">0</div> <div class="text-5xl md:text-7xl font-bold rolling-number" data-target="8">0</div>
<div class="text-lg md:text-sm font-normal">ISPU</div> <div class="text-lg md:text-sm font-normal">ISPU</div>
@ -146,7 +146,7 @@
<div class="icon-blob absolute inset-0 bg-white rounded-full scale-0 opacity-0"></div> <div class="icon-blob absolute inset-0 bg-white rounded-full scale-0 opacity-0"></div>
</div> </div>
</div> </div>
<div class="text-left card-content opacity-0 pointer-events-none"> <div class="text-left card-content-info opacity-0 pointer-events-none">
<div class="flex items-end gap-2"> <div class="flex items-end gap-2">
<div class="text-5xl md:text-7xl font-bold rolling-number" data-target="8">0</div> <div class="text-5xl md:text-7xl font-bold rolling-number" data-target="8">0</div>
<div class="text-lg md:text-sm font-normal">ISPU</div> <div class="text-lg md:text-sm font-normal">ISPU</div>
@ -377,16 +377,18 @@
<register-block dynamic-section="scripts" key="jsInformasi"> <register-block dynamic-section="scripts" key="jsInformasi">
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script> <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/ScrollTrigger.min.js"></script>
<script> <script>
AOS.init(); AOS.init();
gsap.registerPlugin(ScrollTrigger);
</script> </script>
<script> <script>
document.addEventListener("DOMContentLoaded", function () { document.addEventListener("DOMContentLoaded", function () {
// Rolling numbers animation // Rolling numbers animation
const rollingNumbers = document.querySelectorAll(".rolling-number"); const rollingNumbers = document.querySelectorAll('.rolling-number');
const infoCards = document.querySelectorAll(".info-card"); const infoCards = document.querySelectorAll('.info-card');
// Add 3D card effect // Add 3D card effect
infoCards.forEach(card => { infoCards.forEach(card => {
@ -547,7 +549,182 @@ document.addEventListener("DOMContentLoaded", function () {
return tl; return tl;
} }
// Observer for rolling numbers // Scroll-triggered card expansion
infoCards.forEach((card, index) => {
ScrollTrigger.create({
trigger: card,
start: "top 85%",
end: "bottom 15%",
onEnter: () => {
// Slower delay for smoother expansion - increased from 0.2 to 0.5
gsap.delayedCall(index * 0.5, () => {
expandCard(card);
});
},
onLeave: () => {
// Collapse when scrolling down past the card
gsap.delayedCall(index * 0.1, () => {
collapseCard(card);
});
},
onEnterBack: () => {
// Re-expand when scrolling back up into view with slower timing
gsap.delayedCall(index * 0.3, () => {
expandCard(card);
});
},
onLeaveBack: () => {
// Collapse when scrolling up past the card
gsap.delayedCall(index * 0.1, () => {
collapseCard(card);
});
}
});
});
function expandCard(card) {
if (card.classList.contains('expanded')) return;
const content = card.querySelector('.card-content-info');
const iconContainer = card.querySelector('.icon-container');
const iconBlob = card.querySelector('.icon-blob');
// Mark as expanded
card.classList.add('expanded');
// Initialize particle animation property if not exists
if (!card._particleAnimation) {
card._particleAnimation = null;
}
// Slower, more smooth expansion animation
gsap.to(card, {
height: 240,
rotateX: 0,
rotateY: 0,
duration: 0.8, // Increased from 0.5 to 0.8
ease: "power2.out" // Changed to smoother easing
});
// Animate icon with bounce - slower timing
gsap.to(iconContainer, {
scale: 1.2,
y: -5,
duration: 0.8, // Increased from 0.5 to 0.8
ease: "back.out(1.2)" // Less aggressive bounce
});
// Animate icon blob - slower
gsap.to(iconBlob, {
scale: 2,
opacity: 0.15,
duration: 0.7, // Increased from 0.5 to 0.7
ease: "power2.out"
});
// Fade in content with longer delay and stagger
const contentElements = content.children;
gsap.to(content, {
opacity: 1,
duration: 0.2, // Increased from 0.1 to 0.2
delay: 0.4 // Increased from 0.2 to 0.4
});
gsap.fromTo(contentElements,
{ y: 20, opacity: 0 }, // Increased y from 15 to 20
{
y: 0,
opacity: 1,
duration: 0.6, // Increased from 0.4 to 0.6
stagger: 0.15, // Increased from 0.1 to 0.15
delay: 0.4, // Increased from 0.2 to 0.4
ease: "power2.out" // Smoother easing
}
);
// Start particle animation for this card only
card._particleAnimation = animateParticles(card);
// Activate rolling numbers if they're in this card with delay
setTimeout(() => {
const cardNumbers = card.querySelectorAll('.rolling-number');
cardNumbers.forEach(number => {
const target = parseInt(number.getAttribute("data-target"));
let current = 0;
const increment = target / 90; // Slower rolling - increased from 60 to 90
const updateNumber = () => {
current += increment;
if (current < target) {
number.textContent = Math.floor(current);
requestAnimationFrame(updateNumber);
} else {
number.textContent = target;
}
};
updateNumber();
});
}, 500); // Delay rolling numbers by 500ms
}
function collapseCard(card) {
if (!card.classList.contains('expanded')) return;
const content = card.querySelector('.card-content-info');
const iconContainer = card.querySelector('.icon-container');
const iconBlob = card.querySelector('.icon-blob');
// Smooth collapse animation
gsap.to(card, {
height: 140,
rotateX: 0,
rotateY: 0,
clearProps: "transform",
duration: 0.6, // Increased from 0.5 to 0.6
ease: "power2.inOut", // Smoother easing
onComplete: () => {
card.classList.remove('expanded');
}
});
// Reset icon animation - slower
gsap.to(iconContainer, {
scale: 1,
y: 0,
duration: 0.6, // Increased from 0.5 to 0.6
ease: "power2.inOut"
});
// Reset icon blob - slower
gsap.to(iconBlob, {
scale: 0,
opacity: 0,
duration: 0.4, // Increased from 0.3 to 0.4
ease: "power2.inOut"
});
// Fade out content - faster but smoother
gsap.to(content, {
opacity: 0,
duration: 0.3,
ease: "power2.inOut"
});
// Stop particle animation if it exists
if (card._particleAnimation) {
card._particleAnimation.kill();
card._particleAnimation = null;
}
// Reset rolling numbers
const cardNumbers = card.querySelectorAll('.rolling-number');
cardNumbers.forEach(number => {
number.textContent = '0';
});
}
// Observer for rolling numbers (keep existing)
const observer = new IntersectionObserver((entries) => { const observer = new IntersectionObserver((entries) => {
entries.forEach((entry) => { entries.forEach((entry) => {
if (entry.isIntersecting) { if (entry.isIntersecting) {
@ -576,148 +753,37 @@ document.addEventListener("DOMContentLoaded", function () {
observer.observe(number); observer.observe(number);
}); });
// Card click handlers with GSAP animation - Modified for independent toggling // Modified card click handlers - now only for collapsing
infoCards.forEach(card => { infoCards.forEach(card => {
// Initialize particle animation property
card._particleAnimation = null;
card.addEventListener('click', function() { card.addEventListener('click', function() {
const content = this.querySelector('.card-content'); // Only allow collapsing if already expanded
const iconContainer = this.querySelector('.icon-container');
const iconBlob = this.querySelector('.icon-blob');
// Toggle current card without affecting others
if (this.classList.contains('expanded')) { if (this.classList.contains('expanded')) {
// Collapse collapseCard(this);
gsap.to(this, {
height: 140,
rotateX: 0,
rotateY: 0,
clearProps: "transform",
duration: 0.5,
ease: "power3.out",
onComplete: () => {
this.classList.remove('expanded');
}
});
// Reset icon animation
gsap.to(iconContainer, {
scale: 1,
y: 0,
duration: 0.5,
ease: "power3.out"
});
// Reset icon blob
gsap.to(iconBlob, {
scale: 0,
opacity: 0,
duration: 0.3,
ease: "power3.out"
});
// Fade out content
gsap.to(content, {
opacity: 0,
duration: 0.3,
ease: "power3.out"
});
// Stop particle animation if it exists
if (this._particleAnimation) {
this._particleAnimation.kill();
this._particleAnimation = null;
}
} else {
// Expand with unique animation per card type
this.classList.add('expanded');
gsap.to(this, {
height: 240,
rotateX: 0,
rotateY: 0,
duration: 0.5,
ease: "back.out(1.2)"
});
// Animate icon with bounce
gsap.to(iconContainer, {
scale: 1.2,
y: -5,
duration: 0.5,
ease: "back.out(1.7)"
});
// Animate icon blob
gsap.to(iconBlob, {
scale: 2,
opacity: 0.15,
duration: 0.5,
ease: "power3.out"
});
// Fade in content with slight delay and stagger
const contentElements = content.children;
gsap.to(content, {
opacity: 1,
duration: 0.1,
delay: 0.2
});
gsap.fromTo(contentElements,
{ y: 15, opacity: 0 },
{
y: 0,
opacity: 1,
duration: 0.4,
stagger: 0.1,
delay: 0.2,
ease: "back.out(1.2)"
}
);
// Start particle animation for this card only
this._particleAnimation = animateParticles(this);
// Activate rolling numbers if they're in this card
const cardNumbers = this.querySelectorAll('.rolling-number');
cardNumbers.forEach(number => {
const target = parseInt(number.getAttribute("data-target"));
let current = 0;
const increment = target / 60;
const updateNumber = () => {
current += increment;
if (current < target) {
number.textContent = Math.floor(current);
requestAnimationFrame(updateNumber);
} else {
number.textContent = target;
}
};
updateNumber();
});
} }
}); });
}); });
// Add tooltip functionality // Add tooltip functionality (keep existing)
infoCards.forEach(card => { infoCards.forEach(card => {
// Set aria attributes for accessibility // Set aria attributes for accessibility
card.setAttribute('aria-label', 'Klik untuk detail informasi'); card.setAttribute('aria-label', 'Kartu informasi akan terbuka otomatis saat scroll');
card.setAttribute('role', 'button'); card.setAttribute('role', 'region');
card.setAttribute('tabindex', '0'); card.setAttribute('tabindex', '0');
// Support keyboard interaction // Support keyboard interaction for collapsing
card.addEventListener('keydown', function(e) { card.addEventListener('keydown', function(e) {
if (e.key === 'Enter' || e.key === ' ') { if ((e.key === 'Enter' || e.key === ' ') && this.classList.contains('expanded')) {
e.preventDefault(); e.preventDefault();
this.click(); collapseCard(this);
} }
}); });
// Update tooltip text
const tooltip = card.querySelector('.tooltip span');
if (tooltip) {
tooltip.textContent = 'Klik untuk tutup detail';
}
// Hide tooltip when card is expanded // Hide tooltip when card is expanded
card.addEventListener('click', function() { card.addEventListener('click', function() {
const tooltip = this.querySelector('.tooltip'); const tooltip = this.querySelector('.tooltip');

View File

@ -317,7 +317,7 @@
}); });
setActiveService(activeService); setActiveService(activeService);
startAutoplay(); @* startAutoplay(); *@
const style = document.createElement("style"); const style = document.createElement("style");
style.innerHTML = ` style.innerHTML = `

View File

@ -1,4 +1,4 @@
<div class="relative min-h-screen overflow-hidden md:pt-12"> <section id="section1" class="relative min-h-screen overflow-hidden md:pt-12">
<!-- Enhanced Animated Background Elements --> <!-- Enhanced Animated Background Elements -->
<div class="absolute inset-0 bg-gradient-to-br from-slate-50 via-white to-gray-100"> <div class="absolute inset-0 bg-gradient-to-br from-slate-50 via-white to-gray-100">
<div class="absolute inset-0 bg-grid-pattern opacity-[0.03]"></div> <div class="absolute inset-0 bg-grid-pattern opacity-[0.03]"></div>
@ -9,6 +9,11 @@
</div> </div>
</div> </div>
<!-- Background Image -->
@* <div class="absolute inset-0 opacity-20">
<img src="@Url.Content("~/assets/images/home/pancoran-bg.svg")" alt="Background" class="w-full h-full object-cover object-center">
</div> *@
<!-- Header Content - Enhanced --> <!-- Header Content - Enhanced -->
<div class="container mx-auto px-4 items-center text-center relative z-10"> <div class="container mx-auto px-4 items-center text-center relative z-10">
<div class="animate-fade-in" style="animation-delay: 0.2s"> <div class="animate-fade-in" style="animation-delay: 0.2s">
@ -23,8 +28,8 @@
</h2> </h2>
<div class="h-16 sm:h-16 md:h-24 flex items-center justify-center overflow-hidden animate-fade-in" style="animation-delay: 0.6s"> <div class="h-16 sm:h-16 md:h-24 flex items-center justify-center overflow-hidden animate-fade-in" style="animation-delay: 0.6s">
<span id="typing-text" class="bg-oren bg-clip-text text-transparent text-2xl md:text-4xl lg:text-5xl font-bold"></span> <span id="typing-text" class="bg-oren bg-clip-text text-transparent text-3xl sm:text-4xl md:text-6xl font-bold"></span>
<span id="cursor" class="text-2xl md:text-4xl lg:text-5xl font-bold animate-blink text-oren">|</span> <span id="cursor" class="text-3xl sm:text-4xl md:text-6xl font-bold animate-blink text-oren">|</span>
</div> </div>
<p class="text-gray-600 text-lg max-w-2xl mx-auto leading-relaxed mt-2 animate-fade-in" style="animation-delay: 0.8s"> <p class="text-gray-600 text-lg max-w-2xl mx-auto leading-relaxed mt-2 animate-fade-in" style="animation-delay: 0.8s">
@ -35,16 +40,13 @@
</div> </div>
<!-- Service Cards - Enhanced --> <!-- Service Cards - Enhanced -->
<div class="select-none w-full flex items-center justify-center py-8 overflow-x-hidden max-w-6xl mx-auto"> <div class="select-none w-full flex items-center justify-center py-8 overflow-x-hidden max-w-7xl mx-auto">
<div class="w-full text-center flex flex-col md:flex-row items-center justify-center gap-5 px-4"> <div class="w-full text-center flex flex-col md:flex-row items-center justify-center gap-5 px-4">
<!-- Item 1 - DLH --> <!-- Item 1 - DLH -->
<div class="item w-[90vw] h-[18vh] rounded-2xl md:w-[calc(33.333%-1rem)] md:h-[28vh] lg:h-[35vh] bg-center bg-cover bg-no-repeat inline-block cursor-pointer transition-all duration-1000 ease-out relative overflow-hidden group shadow-xl" style="background-image: url('@Url.Content("~/assets/images/home/bg-1.jpg")')"> <div class="item w-[90vw] h-[18vh] rounded-2xl md:w-[calc(33.333%-1rem)] md:h-[28vh] lg:h-[35vh] bg-center bg-cover bg-no-repeat inline-block cursor-pointer transition-all duration-1000 ease-out relative overflow-hidden group shadow-xl" style="background-image: url('@Url.Content("~/assets/images/home/bg-1.jpg")')">
<!-- Subtle border with glow effect --> <!-- Subtle border with glow effect -->
<div class="absolute inset-0 rounded-2xl border-2 border-white/30 group-hover:border-white/50 group-hover:shadow-[0_0_15px_rgba(255,255,255,0.3)] transition-all duration-500"></div> <div class="absolute inset-0 rounded-2xl border-2 border-white/30 group-hover:border-white/50 group-hover:shadow-[0_0_15px_rgba(255,255,255,0.3)] transition-all duration-500"></div>
<!-- Enhanced gradient overlay -->
<div class="absolute inset-0 bg-gradient-to-t from-black/60 via-black/30 to-transparent rounded-b-2xl"></div>
<!-- Content cover with better backdrop blur --> <!-- Content cover with better backdrop blur -->
<div class="cover absolute inset-0 bg-gradient-to-t from-black/90 via-black/50 to-transparent rounded-2xl flex items-center justify-center backdrop-blur-sm transition-all duration-500"> <div class="cover absolute inset-0 bg-gradient-to-t from-black/90 via-black/50 to-transparent rounded-2xl flex items-center justify-center backdrop-blur-sm transition-all duration-500">
<h3 class="title text-white text-xl md:text-2xl font-bold transform md:-rotate-90 tracking-wider transition-all duration-500 group-hover:scale-110 drop-shadow-lg">DLH</h3> <h3 class="title text-white text-xl md:text-2xl font-bold transform md:-rotate-90 tracking-wider transition-all duration-500 group-hover:scale-110 drop-shadow-lg">DLH</h3>
@ -118,7 +120,7 @@
<span class="text-sm text-gray-500">Scroll</span> <span class="text-sm text-gray-500">Scroll</span>
<i class="w-4 h-4 text-gray-500" data-lucide="chevron-down"></i> <i class="w-4 h-4 text-gray-500" data-lucide="chevron-down"></i>
</div> </div>
</div> </section>
<register-block dynamic-section="css" key="cssSlider"> <register-block dynamic-section="css" key="cssSlider">
<style> <style>

View File

@ -0,0 +1,360 @@
<div class="relative min-h-screen overflow-hidden md:pt-12">
<!-- Enhanced Animated Background Elements -->
<div class="absolute inset-0 bg-gradient-to-br from-slate-50 via-white to-gray-100">
<div class="absolute inset-0 bg-grid-pattern opacity-[0.03]"></div>
<div class="absolute top-0 left-0 w-full h-full overflow-hidden">
<div class="blob blob-1 absolute top-[10%] right-[15%] w-[40vw] h-[40vw] rounded-full mix-blend-multiply filter blur-[80px] animate-blob-slow opacity-15 bg-gradient-to-br from-green-300 to-emerald-400"></div>
<div class="blob blob-2 absolute bottom-[5%] left-[20%] w-[35vw] h-[35vw] rounded-full mix-blend-multiply filter blur-[80px] animate-blob-slow animation-delay-2000 opacity-15 bg-gradient-to-br from-amber-300 to-orange-400"></div>
<div class="blob blob-3 absolute top-[30%] left-[10%] w-[30vw] h-[30vw] rounded-full mix-blend-multiply filter blur-[80px] animate-blob-slow animation-delay-4000 opacity-15 bg-gradient-to-tr from-green-400 to-teal-300"></div>
</div>
</div>
<!-- Background Image -->
<div class="absolute inset-0 opacity-20">
<img src="@Url.Content("~/assets/images/home/pancoran-bg.svg")" alt="Background" class="w-full h-full object-cover object-center">
</div>
<!-- Header Content - Enhanced -->
<div class="container mx-auto px-4 items-center text-center relative z-10">
<div class="animate-fade-in" style="animation-delay: 0.2s">
<span class="inline-flex items-center rounded-full bg-gradient-to-r from-green-50 to-emerald-50 px-4 py-1.5 text-xs md:text-sm font-medium text-ijo ring-1 ring-green-600/20 ring-inset my-4 shadow-sm transition-transform duration-300 hover:scale-105">
<span class="mr-2 bg-green-500 rounded-full w-1.5 h-1.5 animate-pulse"></span>
Selamat Datang di ✨
</span>
</div>
<h2 class="text-3xl sm:text-4xl md:text-6xl font-extrabold animate-fade-in" style="animation-delay: 0.4s">
<span class="text-oren">Website Resmi</span>
</h2>
<div class="h-16 sm:h-16 md:h-24 flex items-center justify-center overflow-hidden animate-fade-in" style="animation-delay: 0.6s">
<span id="typing-text" class="bg-oren bg-clip-text text-transparent text-2xl md:text-4xl lg:text-5xl font-bold"></span>
<span id="cursor" class="text-2xl md:text-4xl lg:text-5xl font-bold animate-blink text-oren">|</span>
</div>
<p class="text-gray-600 text-lg max-w-2xl mx-auto leading-relaxed mt-2 animate-fade-in" style="animation-delay: 0.8s">
Jelajahi berbagai layanan untuk menjaga kebersihan dan kelestarian lingkungan DKI Jakarta.
</p>
</div>
<!-- Service Cards - Enhanced -->
<div class="select-none w-full flex items-center justify-center py-8 overflow-x-hidden max-w-7xl mx-auto">
<div class="w-full text-center flex flex-col md:flex-row items-center justify-center gap-5 px-4">
<!-- Item 1 - DLH -->
<div class="item w-[90vw] h-[18vh] rounded-2xl md:w-[calc(33.333%-1rem)] md:h-[28vh] lg:h-[35vh] bg-center bg-cover bg-no-repeat inline-block cursor-pointer transition-all duration-1000 ease-out relative overflow-hidden group shadow-xl" style="background-image: url('@Url.Content("~/assets/images/home/bg-1.jpg")')">
<!-- Subtle border with glow effect -->
<div class="absolute inset-0 rounded-2xl border-2 border-white/30 group-hover:border-white/50 group-hover:shadow-[0_0_15px_rgba(255,255,255,0.3)] transition-all duration-500"></div>
<!-- Enhanced gradient overlay -->
<div class="absolute inset-0 bg-gradient-to-t from-black/60 via-black/30 to-transparent rounded-b-2xl"></div>
<!-- Content cover with better backdrop blur -->
<div class="cover absolute inset-0 bg-gradient-to-t from-black/90 via-black/50 to-transparent rounded-2xl flex items-center justify-center backdrop-blur-sm transition-all duration-500">
<h3 class="title text-white text-xl md:text-2xl font-bold transform md:-rotate-90 tracking-wider transition-all duration-500 group-hover:scale-110 drop-shadow-lg">DLH</h3>
</div>
<!-- Status indicator dot -->
<div class="absolute top-3 right-3 w-3 h-3 bg-green-500/80 rounded-full opacity-0 group-hover:opacity-100 transition-opacity duration-500 animate-pulse shadow-[0_0_10px_rgba(34,197,94,0.7)]"></div>
<!-- Enhanced action button with subtle shine effect -->
<div class="action-button absolute bottom-4 left-0 right-0 opacity-0 transition-all duration-500 flex items-center justify-center px-4">
<a href="#" class="relative overflow-hidden bg-gradient-to-r from-orange-500 to-amber-500 hover:from-orange-600 hover:to-amber-600 text-white px-6 py-2.5 rounded-lg text-sm font-semibold shadow-lg backdrop-blur-sm border border-white/10 transition-all duration-300 hover:scale-105">
<span class="relative z-10">Telusuri</span>
<span class="absolute top-0 left-0 w-full h-full bg-white/20 transform -skew-x-12 -translate-x-full group-hover:translate-x-full transition-transform duration-700 ease-out"></span>
</a>
</div>
</div>
<!-- Item 2 - BPS-RW -->
<div class="item w-[90vw] h-[18vh] rounded-2xl md:w-[calc(33.333%-1rem)] md:h-[28vh] lg:h-[35vh] bg-center bg-cover bg-no-repeat inline-block cursor-pointer transition-all duration-1000 ease-out relative overflow-hidden group shadow-xl" style="background-image: url('https://images.unsplash.com/photo-1531746020798-e6953c6e8e04?auto=format&fit=crop&w=800&q=60')">
<!-- Subtle border with glow effect -->
<div class="absolute inset-0 rounded-2xl border-2 border-white/30 group-hover:border-white/50 group-hover:shadow-[0_0_15px_rgba(255,255,255,0.3)] transition-all duration-500"></div>
<!-- Enhanced gradient overlay -->
<div class="absolute inset-0 bg-gradient-to-t from-black/60 via-black/30 to-transparent rounded-b-2xl"></div>
<!-- Content cover with better backdrop blur -->
<div class="cover absolute inset-0 bg-gradient-to-t from-black/90 via-black/50 to-transparent rounded-2xl flex items-center justify-center backdrop-blur-sm transition-all duration-500">
<h3 class="title text-white text-xl md:text-2xl font-bold transform md:-rotate-90 tracking-wider transition-all duration-500 group-hover:scale-110 drop-shadow-lg">BPS-RW</h3>
</div>
<!-- Status indicator dot -->
<div class="absolute top-3 right-3 w-3 h-3 bg-green-500/80 rounded-full opacity-0 group-hover:opacity-100 transition-opacity duration-500 animate-pulse shadow-[0_0_10px_rgba(34,197,94,0.7)]"></div>
<!-- Enhanced action button with subtle shine effect -->
<div class="action-button absolute bottom-4 left-0 right-0 opacity-0 transition-all duration-500 flex items-center justify-center px-4">
<a href="#" class="relative overflow-hidden bg-gradient-to-r from-orange-500 to-amber-500 hover:from-orange-600 hover:to-amber-600 text-white px-6 py-2.5 rounded-lg text-sm font-semibold shadow-lg backdrop-blur-sm border border-white/10 transition-all duration-300 hover:scale-105">
<span class="relative z-10">Telusuri</span>
<span class="absolute top-0 left-0 w-full h-full bg-white/20 transform -skew-x-12 -translate-x-full group-hover:translate-x-full transition-transform duration-700 ease-out"></span>
</a>
</div>
</div>
<!-- Item 3 - AMDAL -->
<div class="item w-[90vw] h-[18vh] rounded-2xl md:w-[calc(33.333%-1rem)] md:h-[28vh] lg:h-[35vh] bg-center bg-cover bg-no-repeat inline-block cursor-pointer transition-all duration-1000 ease-out relative overflow-hidden group shadow-xl" style="background-image: url('https://images.unsplash.com/photo-1531123897727-8f129e1688ce?auto=format&fit=crop&w=800&q=60')">
<!-- Subtle border with glow effect -->
<div class="absolute inset-0 rounded-2xl border-2 border-white/30 group-hover:border-white/50 group-hover:shadow-[0_0_15px_rgba(255,255,255,0.3)] transition-all duration-500"></div>
<!-- Enhanced gradient overlay -->
<div class="absolute inset-0 bg-gradient-to-t from-black/60 via-black/30 to-transparent rounded-b-2xl"></div>
<!-- Content cover with better backdrop blur -->
<div class="cover absolute inset-0 bg-gradient-to-t from-black/90 via-black/50 to-transparent rounded-2xl flex items-center justify-center backdrop-blur-sm transition-all duration-500">
<h3 class="title text-white text-xl md:text-2xl font-bold transform md:-rotate-90 tracking-wider transition-all duration-500 group-hover:scale-110 drop-shadow-lg">AMDAL</h3>
</div>
<!-- Status indicator dot -->
<div class="absolute top-3 right-3 w-3 h-3 bg-green-500/80 rounded-full opacity-0 group-hover:opacity-100 transition-opacity duration-500 animate-pulse shadow-[0_0_10px_rgba(34,197,94,0.7)]"></div>
<!-- Enhanced action button with subtle shine effect -->
<div class="action-button absolute bottom-4 left-0 right-0 opacity-0 transition-all duration-500 flex items-center justify-center px-4">
<a href="#" class="relative overflow-hidden bg-gradient-to-r from-orange-500 to-amber-500 hover:from-orange-600 hover:to-amber-600 text-white px-6 py-2.5 rounded-lg text-sm font-semibold shadow-lg backdrop-blur-sm border border-white/10 transition-all duration-300 hover:scale-105">
<span class="relative z-10">Telusuri</span>
<span class="absolute top-0 left-0 w-full h-full bg-white/20 transform -skew-x-12 -translate-x-full group-hover:translate-x-full transition-transform duration-700 ease-out"></span>
</a>
</div>
</div>
</div>
</div>
<!-- Scroll indicator -->
<div class="absolute left-1/2 bottom-4 transform -translate-x-1/2 opacity-70 animate-bounce hidden md:flex flex-col items-center">
<span class="text-sm text-gray-500">Scroll</span>
<i class="w-4 h-4 text-gray-500" data-lucide="chevron-down"></i>
</div>
</div>
<register-block dynamic-section="css" key="cssSlider">
<style>
/* Animation keyframes */
@@keyframes fade-in {
0% { opacity: 0; transform: translateY(20px); }
100% { opacity: 1; transform: translateY(0); }
}
@@keyframes blink {
0%, 100% { opacity: 1; }
50% { opacity: 0; }
}
@@keyframes blob-slow {
0%, 100% { transform: translate(0, 0) scale(1); }
25% { transform: translate(20px, -15px) scale(1.05); }
50% { transform: translate(0, 15px) scale(0.95); }
75% { transform: translate(-20px, -5px) scale(1.05); }
}
.animate-fade-in { animation: fade-in 1s ease-out forwards; }
.animate-blink { animation: blink 1s step-end infinite; }
.animate-blob-slow { animation: blob-slow 20s ease-in-out infinite; }
.animation-delay-2000 { animation-delay: 2s; }
.animation-delay-4000 { animation-delay: 4s; }
/* Grid background */
.bg-grid-pattern {
background-image: radial-gradient(circle, #000 0.5px, transparent 0.5px);
background-size: 30px 30px;
}
</style>
</register-block>
<register-block dynamic-section="scripts" key="jsSlider">
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js"></script>
<script>
// GSAP enhanced animations
document.addEventListener('DOMContentLoaded', () => {
const items = document.querySelectorAll(".item");
const covers = document.querySelectorAll(".cover");
const actionButtons = document.querySelectorAll(".action-button");
const isMobile = window.innerWidth <= 768;
// Enhanced expand function with smoother animations
const expand = (item, i) => {
const cover = item.querySelector(".cover");
const button = item.querySelector(".action-button");
const title = item.querySelector(".title");
// Reset other items
items.forEach((it, ind) => {
if (i === ind) return;
it.clicked = false;
const otherCover = it.querySelector(".cover");
const otherButton = it.querySelector(".action-button");
const otherTitle = it.querySelector(".title");
gsap.to(otherCover, { opacity: 1, backdropFilter: "blur(5px)", duration: 0.6, ease: "power2.out" });
gsap.to(otherButton, { opacity: 0, y: 20, duration: 0.4, ease: "power2.out" });
gsap.to(otherTitle, { scale: 1, opacity: 1, duration: 0.4, rotation: isMobile ? 0 : -90, ease: "power2.out" });
gsap.to(it, {
scale: 1,
rotationY: 0,
boxShadow: "0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04)",
duration: 0.8,
ease: "power2.out"
});
});
// Mobile animations
if (isMobile) {
gsap.to(items, {
height: item.clicked ? "18vh" : "12vh",
duration: 1.3,
ease: "elastic(1, .6)",
});
item.clicked = !item.clicked;
gsap.to(item, {
height: item.clicked ? "38vh" : "18vh",
duration: 1.6,
ease: "elastic(1, .3)",
scale: item.clicked ? 1 : 1,
boxShadow: item.clicked ?
"0 25px 50px -12px rgba(0, 0, 0, 0.25), 0 0 15px rgba(255, 255, 255, 0.2)" :
"0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)"
});
}
// Desktop animations
else {
gsap.to(items, {
width: item.clicked ? "calc(25% - 1rem)" : "calc(25% - 1rem)",
duration: 1.6,
ease: "elastic(1, .6)",
});
item.clicked = !item.clicked;
gsap.to(item, {
width: item.clicked ? "calc(50% - 1rem)" : "calc(33.333% - 1rem)",
duration: 1.8,
ease: "elastic(1, .3)",
scale: item.clicked ? 1 : 1,
rotationY: item.clicked ? 5 : 0,
});
}
// Content animations
gsap.to(cover, {
opacity: item.clicked ? 0.3 : 1,
backdropFilter: item.clicked ? "blur(0px)" : "blur(5px)",
duration: 0.6,
ease: "power2.out"
});
gsap.to(title, {
opacity: item.clicked ? 0 : 1,
scale: item.clicked ? 0.8 : 1,
duration: 0.4,
ease: "power2.out"
});
gsap.to(button, {
opacity: item.clicked ? 1 : 0,
y: item.clicked ? 0 : 20,
duration: item.clicked ? 0.6 : 0.4,
delay: item.clicked ? 0.2 : 0,
ease: "power2.out"
});
};
// Enhanced hover effects
items.forEach((item, i) => {
item.clicked = false;
item.addEventListener("click", (e) => {
if (!e.target.closest(".action-button")) expand(item, i);
});
item.addEventListener("mouseenter", () => {
if (!item.clicked) {
gsap.to(item, {
scale: 1.03,
boxShadow: "0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04), 0 0 15px rgba(255, 255, 255, 0.1)",
duration: 0.4,
ease: "power2.out"
});
const title = item.querySelector(".title");
gsap.to(title, { scale: 1.1, duration: 0.4, ease: "power2.out" });
}
});
item.addEventListener("mouseleave", () => {
if (!item.clicked) {
gsap.to(item, {
scale: 1,
boxShadow: "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
duration: 0.4,
ease: "power2.out"
});
const title = item.querySelector(".title");
gsap.to(title, { scale: 1, duration: 0.4, ease: "power2.out" });
}
});
});
// Enhanced entrance animations
gsap.fromTo(
items,
{ opacity: 0, y: 50, scale: 0.9 },
{
opacity: 1,
y: 0,
scale: 1,
duration: 1.2,
stagger: 0.25,
ease: "back.out(1.7)",
delay: 0.8
}
);
// Auto-expand first item with delay
setTimeout(() => expand(items[0], 0), 1500);
});
// Enhanced typing animation
document.addEventListener('DOMContentLoaded', () => {
const texts = ['Dinas Lingkungan Hidup DKI Jakarta'];
let textIndex = 0;
let charIndex = 0;
let isDeleting = false;
let typingSpeed = 80;
const typingElement = document.getElementById('typing-text');
const cursorElement = document.getElementById('cursor');
function typeWriter() {
const currentText = texts[textIndex];
if (isDeleting) {
typingElement.textContent = currentText.substring(0, charIndex - 1);
charIndex--;
typingSpeed = 40;
} else {
typingElement.textContent = currentText.substring(0, charIndex + 1);
charIndex++;
typingSpeed = 80;
}
if (!isDeleting && charIndex === currentText.length) {
setTimeout(() => {
isDeleting = true;
}, 2000);
} else if (isDeleting && charIndex === 0) {
isDeleting = false;
textIndex = (textIndex + 1) % texts.length;
setTimeout(() => {
typeWriter();
}, 500);
return;
}
setTimeout(typeWriter, typingSpeed);
}
// Start typing animation with slight delay
setTimeout(typeWriter, 800);
});
</script>
</register-block>

File diff suppressed because it is too large Load Diff

View File

@ -7,9 +7,9 @@
<div id="particle-container" class="absolute inset-0"></div> <div id="particle-container" class="absolute inset-0"></div>
</div> </div>
<div class="container mx-auto px-4 max-w-7xl relative z-10"> <div class="container mx-auto px-4 max-w-5xl relative z-10">
<!-- Heading Section with animated underline --> <!-- Heading Section with animated underline -->
<div class="text-center mb-20"> <div class="text-center">
<div class="inline-block relative"> <div class="inline-block relative">
<h2 class="text-2xl md:text-3xl font-bold text-gray-800"> <h2 class="text-2xl md:text-3xl font-bold text-gray-800">
Layanan Digital Layanan Digital
@ -25,7 +25,7 @@
<!-- 3D Website Showcase --> <!-- 3D Website Showcase -->
<div id="websites-showcase" class="relative"> <div id="websites-showcase" class="relative">
<!-- Laptop mockup container --> <!-- Laptop mockup container -->
<div class="laptop-viewport relative max-w-5xl mx-auto h-[450px] md:h-[600px]"> <div class="laptop-viewport relative max-w-3xl mx-auto h-[300px] md:h-[600px]">
<div class="laptop-container w-full h-full relative transform-gpu perspective"> <div class="laptop-container w-full h-full relative transform-gpu perspective">
<!-- Website slides will be created by JavaScript within this laptop mockup --> <!-- Website slides will be created by JavaScript within this laptop mockup -->
</div> </div>

View File

@ -10,11 +10,11 @@
ViewData["TwitterDescription"] = "Dinas Lingkungan Hidup DKI Jakarta"; ViewData["TwitterDescription"] = "Dinas Lingkungan Hidup DKI Jakarta";
} }
<partial name="~/Views/Components/Home/_Slider.cshtml" /> <partial name="~/Views/Components/Home/_Slider.cshtml"/>
<partial name="~/Views/Components/Home/_Layanan.cshtml" /> <partial name="~/Views/Components/Home/_Layanan.cshtml" />
<partial name="~/Views/Components/Home/_Informasi.cshtml" /> <partial name="~/Views/Components/Home/_Informasi.cshtml"/>
<partial name="~/Views/Components/Home/_Website.cshtml" /> <partial name="~/Views/Components/Home/_Website.cshtml" />
<partial name="~/Views/Components/Home/_Berita.cshtml" /> <partial name="~/Views/Components/Home/_Berita.cshtml" />
<partial name="~/Views/Components/Home/_Mitra.cshtml" /> <partial name="~/Views/Components/Home/_Mitra.cshtml" />
<partial name="~/Views/Components/Home/_Video.cshtml" /> <partial name="~/Views/Components/Home/_Video.cshtml" />
<partial name="~/Views/Components/Home/_Sosmed.cshtml" /> <partial name="~/Views/Components/Home/_Sosmed.cshtml" />

View File

@ -0,0 +1,100 @@
@{
Layout = "_Layout";
ViewData["Title"] = "Whistleblowing System - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["Description"] = "Sistem pelaporan pelanggaran lingkungan untuk masyarakat dalam melaporkan dugaan pelanggaran dan pencemaran lingkungan hidup.";
ViewData["Keywords"] = "Whistleblowing System, Pelaporan Pelanggaran Lingkungan, Laporan Pencemaran, Aduan Lingkungan, Sistem Pelaporan, Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgTitle"] = "Whistleblowing System - Sistem Pelaporan Pelanggaran Lingkungan | Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgDescription"] = "Layanan Whistleblowing System untuk melaporkan dugaan pelanggaran dan pencemaran lingkungan hidup. Platform pelaporan online yang aman dan terpercaya di DKI Jakarta.";
ViewData["TwitterTitle"] = "Whistleblowing System - Sistem Pelaporan Pelanggaran Lingkungan | Dinas Lingkungan Hidup DKI Jakarta";
ViewData["TwitterDescription"] = "Layanan Whistleblowing System untuk melaporkan dugaan pelanggaran dan pencemaran lingkungan hidup. Platform pelaporan online yang aman dan terpercaya di DKI Jakarta.";
// Breadcumb
ViewData["BreadcrumbText"] = "Whistleblowing System";
ViewData["TitleBeforeHighlight"] = "WHISTLEBLOWING";
ViewData["TitleHighlight"] = "SYSTEM";
}
<!-- Breadcumb -->
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
<div class="container mx-auto max-w-6xl py-8">
<div class="flex justify-center">
<div class="w-full max-w-6xl py-12">
<div class="text-center mb-8">
<h1 class="text-3xl font-bold mb-4">Whistleblowing System</h1>
<p class="text-gray-600 max-w-4xl mx-auto leading-relaxed">
Layanan Whistleblowing System untuk melaporkan dugaan pelanggaran dan pencemaran lingkungan hidup. Platform pelaporan online yang aman dan terpercaya di DKI Jakarta.
</p>
</div>
</div>
</div>
<!-- Report Section -->
<div class="bg-white rounded-2xl shadow-xl border border-gray-100 p-8">
<div class="flex items-start space-x-6">
<div class="flex-shrink-0">
<div class="w-12 h-12 bg-red-100 rounded-lg flex items-center justify-center">
<svg class="w-6 h-6 text-red-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L3.732 16.5c-.77.833.192 2.5 1.732 2.5z"></path>
</svg>
</div>
</div>
<div class="flex-1">
<h3 class="text-xl font-semibold text-gray-800 mb-3">Laporkan Dugaan PUNGLI</h3>
<p class="text-gray-600 mb-6 leading-relaxed">
Jika anda menemukan <span class="font-semibold text-red-600">PUNGLI</span> di Dinas Lingkungan Hidup DKI Jakarta, silahkan laporkan melalui:
</p>
<div class="space-y-4">
<!-- Email Report -->
<div class="flex items-center p-4 bg-blue-50 rounded-lg border border-blue-200">
<div class="w-8 h-8 bg-blue-500 rounded-full flex items-center justify-center mr-4">
<svg class="w-4 h-4 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 4.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"></path>
</svg>
</div>
<div>
<p class="text-sm text-gray-600 mb-1">Kirim email ke:</p>
<a href="mailto:dinaslh@jakarta.go.id" class="text-blue-600 font-semibold hover:text-blue-800 transition-colors">
dinaslh@jakarta.go.id
</a>
</div>
</div>
<!-- Link Report -->
<div class="flex items-center p-4 bg-green-50 rounded-lg border border-green-200">
<div class="w-8 h-8 bg-green-500 rounded-full flex items-center justify-center mr-4">
<svg class="w-4 h-4 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1"></path>
</svg>
</div>
<div>
<p class="text-sm text-gray-600 mb-1">Atau akses melalui link:</p>
<a href="https://bit.ly/wbsdlhdki" target="_blank"
class="inline-flex items-center text-green-600 font-semibold hover:text-green-800 transition-colors">
https://bit.ly/wbsdlhdki
<svg class="w-4 h-4 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"></path>
</svg>
</a>
</div>
</div>
</div>
<!-- Privacy Notice -->
<div class="mt-6 p-4 bg-gray-50 rounded-lg border-l-4 border-blue-500">
<div class="flex items-start">
<svg class="w-5 h-5 text-blue-500 mt-0.5 mr-3 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"></path>
</svg>
<p class="text-sm text-gray-600">
<span class="font-semibold">Jaminan Kerahasiaan:</span> Identitas pelapor akan dijaga kerahasiaannya dan dilindungi sesuai ketentuan peraturan perundang-undangan yang berlaku.
</p>
</div>
</div>
</div>
</div>
</div>
</div>

View File

@ -0,0 +1,146 @@
@{
Layout = "_Layout";
ViewData["Title"] = "Gas Rumah Kaca - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["Description"] = "Informasi lengkap mengenai Gas Rumah Kaca di DKI Jakarta. Temukan data emisi, inventarisasi, dan upaya mitigasi gas rumah kaca yang dilakukan oleh Dinas Lingkungan Hidup DKI Jakarta.";
ViewData["Keywords"] = "Gas Rumah Kaca, Flora Fauna Jakarta, Konservasi, Ekosistem Urban, Biodiversitas, Jakarta";
ViewData["OgTitle"] = "Gas Rumah Kaca - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgDescription"] = "Informasi lengkap mengenai Gas Rumah Kaca di DKI Jakarta. Temukan data emisi, inventarisasi, dan upaya mitigasi gas rumah kaca yang dilakukan oleh Dinas Lingkungan Hidup DKI Jakarta.";
ViewData["TwitterTitle"] = "Gas Rumah Kaca - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["TwitterDescription"] = "Informasi lengkap mengenai Gas Rumah Kaca di DKI Jakarta. Temukan data emisi, inventarisasi, dan upaya mitigasi gas rumah kaca yang dilakukan oleh Dinas Lingkungan Hidup DKI Jakarta.";
// Breadcumb
ViewData["BreadcrumbText"] = "Gas Rumah Kaca";
ViewData["TitleBeforeHighlight"] = "Gas Rumah";
ViewData["TitleHighlight"] = "Kaca";
}
<!-- Breadcumb -->
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
<div class="flex justify-center">
<div class="w-full max-w-6xl py-12">
<div class="text-center mb-8">
<h1 class="text-3xl font-bold mb-4">Gas Rumah Kaca</h1>
<p class="text-gray-600 max-w-4xl mx-auto leading-relaxed">
Informasi lengkap mengenai Gas Rumah Kaca di DKI Jakarta. Temukan data emisi, inventarisasi, dan upaya mitigasi gas rumah kaca yang dilakukan oleh Dinas Lingkungan Hidup DKI Jakarta.
</p>
</div>
</div>
</div>
<div class="container max-w-6xl mx-auto pb-8">
<div class="flex flex-col lg:flex-row gap-8">
<!-- Main Content -->
<div class="lg:w-2/3">
<div class="bg-gradient-to-br from-white to-gray-50 rounded-xl shadow-sm border border-gray-100 p-8 backdrop-blur-sm">
<div class="flex items-center justify-between mb-6">
<h2 class="text-2xl font-bold text-gray-800 flex items-center">
<i class="fas fa-file-archive text-green-600 mr-3"></i>
Dokumen
</h2>
<div class="flex items-center gap-3">
<span class="bg-green-100 text-green-800 px-3 py-1 rounded-full text-sm font-medium">8 Dokumen</span>
<div class="flex items-center gap-2">
<label class="text-sm font-medium text-gray-700">Filter:</label>
<select class="px-3 py-1 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-green-500">
<option>Semua Tahun</option>
<option>2024</option>
<option>2023</option>
<option>2019</option>
</select>
</div>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-4 gap-4">
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
</div>
</div>
</div>
<!-- Enhanced Sidebar -->
<div class="lg:w-1/3 space-y-6">
<!-- Search Box -->
<div class="bg-gradient-to-br from-white to-green-50 rounded-xl shadow-lg border border-green-100 p-6">
<h3 class="text-xl font-bold mb-4 text-gray-800 flex items-center">
<i class="fas fa-search text-green-600 mr-3"></i>
Cari Dokumen
</h3>
<div class="relative">
<input type="text" class="w-full px-4 py-3 pl-12 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500 focus:border-transparent transition-all" placeholder="Masukkan kata kunci...">
<i class="fas fa-search absolute left-4 top-1/2 transform -translate-y-1/2 text-gray-400"></i>
<button class="absolute right-2 top-1/2 transform -translate-y-1/2 bg-green-600 text-white px-4 py-2 rounded-md hover:from-green-700 hover:to-green-800 transition-all duration-300 shadow-md">
Cari
</button>
</div>
</div>
</div>
</div>
</div>
<register-block dynamic-section="css" key="cssDIKPLHD">
<link href="~/assets/dflip/css/dflip.min.css" rel="stylesheet" type="text/css">
<link href="~/assets/dflip/css/themify-icons.min.css" rel="stylesheet" type="text/css">
</register-block>
<register-block dynamic-section="scripts" key="jsDIKPLHD">
<script src="~/assets/dflip/js/libs/jquery.min.js" type="text/javascript"></script>
<script src="~/assets/dflip/js/dflip.min.js" type="text/javascript"></script>
</register-block>

View File

@ -0,0 +1,146 @@
@{
Layout = "_Layout";
ViewData["Title"] = "Indeks Kualitas Lingkungan Hidup (IKLH) - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["Description"] = "Indeks Kualitas Lingkungan Hidup (IKLH) adalah nilai yang menggambarkan kualitas Lingkungan Hidup dalam suatu wilayah pada waktu tertentu, yang merupakan nilai komposit dari Indeks Kualitas Air (IKA), Indeks Kualitas Udara (IKU), Indeks Kualitas Lahan (IKL), dan Indeks Kualitas Air Laut (IKAL).";
ViewData["Keywords"] = "Indeks Kualitas Lingkungan Hidup (IKLH), Flora Fauna Jakarta, Konservasi, Ekosistem Urban, Biodiversitas, Jakarta";
ViewData["OgTitle"] = "Indeks Kualitas Lingkungan Hidup (IKLH) - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgDescription"] = "Indeks Kualitas Lingkungan Hidup (IKLH) adalah nilai yang menggambarkan kualitas Lingkungan Hidup dalam suatu wilayah pada waktu tertentu, yang merupakan nilai komposit dari Indeks Kualitas Air (IKA), Indeks Kualitas Udara (IKU), Indeks Kualitas Lahan (IKL), dan Indeks Kualitas Air Laut (IKAL).";
ViewData["TwitterTitle"] = "Indeks Kualitas Lingkungan Hidup (IKLH) - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["TwitterDescription"] = "Indeks Kualitas Lingkungan Hidup (IKLH) adalah nilai yang menggambarkan kualitas Lingkungan Hidup dalam suatu wilayah pada waktu tertentu, yang merupakan nilai komposit dari Indeks Kualitas Air (IKA), Indeks Kualitas Udara (IKU), Indeks Kualitas Lahan (IKL), dan Indeks Kualitas Air Laut (IKAL).";
// Breadcumb
ViewData["BreadcrumbText"] = "Indeks Kualitas Lingkungan Hidup (IKLH)";
ViewData["TitleBeforeHighlight"] = "Indeks Kualitas";
ViewData["TitleHighlight"] = "Lingkungan Hidup (IKLH)";
}
<!-- Breadcumb -->
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
<div class="flex justify-center">
<div class="w-full max-w-6xl py-12">
<div class="text-center mb-8">
<h1 class="text-3xl font-bold mb-4">Indeks Kualitas Lingkungan Hidup (IKLH)</h1>
<p class="text-gray-600 max-w-4xl mx-auto leading-relaxed">
Indeks Kualitas Lingkungan Hidup (IKLH) adalah nilai yang menggambarkan kualitas Lingkungan Hidup dalam suatu wilayah pada waktu tertentu, yang merupakan nilai komposit dari Indeks Kualitas Air (IKA), Indeks Kualitas Udara (IKU), Indeks Kualitas Lahan (IKL), dan Indeks Kualitas Air Laut (IKAL).
</p>
</div>
</div>
</div>
<div class="container max-w-6xl mx-auto pb-8">
<div class="flex flex-col lg:flex-row gap-8">
<!-- Main Content -->
<div class="lg:w-2/3">
<div class="bg-gradient-to-br from-white to-gray-50 rounded-xl shadow-sm border border-gray-100 p-8 backdrop-blur-sm">
<div class="flex items-center justify-between mb-6">
<h2 class="text-2xl font-bold text-gray-800 flex items-center">
<i class="fas fa-file-archive text-green-600 mr-3"></i>
Dokumen
</h2>
<div class="flex items-center gap-3">
<span class="bg-green-100 text-green-800 px-3 py-1 rounded-full text-sm font-medium">8 Dokumen</span>
<div class="flex items-center gap-2">
<label class="text-sm font-medium text-gray-700">Filter:</label>
<select class="px-3 py-1 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-green-500">
<option>Semua Tahun</option>
<option>2024</option>
<option>2023</option>
<option>2019</option>
</select>
</div>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-4 gap-4">
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
</div>
</div>
</div>
<!-- Enhanced Sidebar -->
<div class="lg:w-1/3 space-y-6">
<!-- Search Box -->
<div class="bg-gradient-to-br from-white to-green-50 rounded-xl shadow-lg border border-green-100 p-6">
<h3 class="text-xl font-bold mb-4 text-gray-800 flex items-center">
<i class="fas fa-search text-green-600 mr-3"></i>
Cari Dokumen
</h3>
<div class="relative">
<input type="text" class="w-full px-4 py-3 pl-12 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500 focus:border-transparent transition-all" placeholder="Masukkan kata kunci...">
<i class="fas fa-search absolute left-4 top-1/2 transform -translate-y-1/2 text-gray-400"></i>
<button class="absolute right-2 top-1/2 transform -translate-y-1/2 bg-green-600 text-white px-4 py-2 rounded-md hover:from-green-700 hover:to-green-800 transition-all duration-300 shadow-md">
Cari
</button>
</div>
</div>
</div>
</div>
</div>
<register-block dynamic-section="css" key="cssDIKPLHD">
<link href="~/assets/dflip/css/dflip.min.css" rel="stylesheet" type="text/css">
<link href="~/assets/dflip/css/themify-icons.min.css" rel="stylesheet" type="text/css">
</register-block>
<register-block dynamic-section="scripts" key="jsDIKPLHD">
<script src="~/assets/dflip/js/libs/jquery.min.js" type="text/javascript"></script>
<script src="~/assets/dflip/js/dflip.min.js" type="text/javascript"></script>
</register-block>

View File

@ -0,0 +1,146 @@
@{
Layout = "_Layout";
ViewData["Title"] = "Kajian Lingkungan Hidup Strategis (KLHS) - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["Description"] = "Dokumen Kajian Lingkungan Hidup Strategis (KLHS) DKI Jakarta. Temukan informasi lengkap mengenai evaluasi dampak lingkungan strategis, kebijakan pembangunan berkelanjutan, dan upaya perlindungan lingkungan hidup di Jakarta.";
ViewData["Keywords"] = "Kajian Lingkungan Hidup Strategis (KLHS), KLHS Jakarta, Evaluasi Dampak Lingkungan, Pembangunan Berkelanjutan, Perlindungan Lingkungan, Jakarta";
ViewData["OgTitle"] = "Kajian Lingkungan Hidup Strategis (KLHS) - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgDescription"] = "Dokumen Kajian Lingkungan Hidup Strategis (KLHS) DKI Jakarta. Temukan informasi lengkap mengenai evaluasi dampak lingkungan strategis, kebijakan pembangunan berkelanjutan, dan upaya perlindungan lingkungan hidup di Jakarta.";
ViewData["TwitterTitle"] = "Kajian Lingkungan Hidup Strategis (KLHS) - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["TwitterDescription"] = "Dokumen Kajian Lingkungan Hidup Strategis (KLHS) DKI Jakarta. Temukan informasi lengkap mengenai evaluasi dampak lingkungan strategis, kebijakan pembangunan berkelanjutan, dan upaya perlindungan lingkungan hidup di Jakarta.";
// Breadcumb
ViewData["BreadcrumbText"] = "Kajian Lingkungan Hidup Strategis (KLHS)";
ViewData["TitleBeforeHighlight"] = "Kajian Lingkungan";
ViewData["TitleHighlight"] = "Hidup Strategis";
}
<!-- Breadcumb -->
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
<div class="flex justify-center">
<div class="w-full max-w-6xl py-12">
<div class="text-center mb-8">
<h1 class="text-3xl font-bold mb-4">Kajian Lingkungan Hidup Strategis (KLHS)</h1>
<p class="text-gray-600 max-w-4xl mx-auto leading-relaxed">
Dokumen Kajian Lingkungan Hidup Strategis (KLHS) DKI Jakarta. Temukan informasi lengkap mengenai evaluasi dampak lingkungan strategis, kebijakan pembangunan berkelanjutan, dan upaya perlindungan lingkungan hidup di Jakarta.
</p>
</div>
</div>
</div>
<div class="container max-w-6xl mx-auto pb-8">
<div class="flex flex-col lg:flex-row gap-8">
<!-- Main Content -->
<div class="lg:w-2/3">
<div class="bg-gradient-to-br from-white to-gray-50 rounded-xl shadow-sm border border-gray-100 p-8 backdrop-blur-sm">
<div class="flex items-center justify-between mb-6">
<h2 class="text-2xl font-bold text-gray-800 flex items-center">
<i class="fas fa-file-archive text-green-600 mr-3"></i>
Dokumen
</h2>
<div class="flex items-center gap-3">
<span class="bg-green-100 text-green-800 px-3 py-1 rounded-full text-sm font-medium">8 Dokumen</span>
<div class="flex items-center gap-2">
<label class="text-sm font-medium text-gray-700">Filter:</label>
<select class="px-3 py-1 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-green-500">
<option>Semua Tahun</option>
<option>2024</option>
<option>2023</option>
<option>2019</option>
</select>
</div>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-4 gap-4">
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
</div>
</div>
</div>
<!-- Enhanced Sidebar -->
<div class="lg:w-1/3 space-y-6">
<!-- Search Box -->
<div class="bg-gradient-to-br from-white to-green-50 rounded-xl shadow-lg border border-green-100 p-6">
<h3 class="text-xl font-bold mb-4 text-gray-800 flex items-center">
<i class="fas fa-search text-green-600 mr-3"></i>
Cari Dokumen
</h3>
<div class="relative">
<input type="text" class="w-full px-4 py-3 pl-12 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500 focus:border-transparent transition-all" placeholder="Masukkan kata kunci...">
<i class="fas fa-search absolute left-4 top-1/2 transform -translate-y-1/2 text-gray-400"></i>
<button class="absolute right-2 top-1/2 transform -translate-y-1/2 bg-green-600 text-white px-4 py-2 rounded-md hover:from-green-700 hover:to-green-800 transition-all duration-300 shadow-md">
Cari
</button>
</div>
</div>
</div>
</div>
</div>
<register-block dynamic-section="css" key="cssDIKPLHD">
<link href="~/assets/dflip/css/dflip.min.css" rel="stylesheet" type="text/css">
<link href="~/assets/dflip/css/themify-icons.min.css" rel="stylesheet" type="text/css">
</register-block>
<register-block dynamic-section="scripts" key="jsDIKPLHD">
<script src="~/assets/dflip/js/libs/jquery.min.js" type="text/javascript"></script>
<script src="~/assets/dflip/js/dflip.min.js" type="text/javascript"></script>
</register-block>

View File

@ -0,0 +1,146 @@
@{
Layout = "_Layout";
ViewData["Title"] = "Kajian - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["Description"] = "Kumpulan kajian dan penelitian terkait lingkungan hidup yang dilakukan oleh Dinas Lingkungan Hidup DKI Jakarta. Temukan hasil kajian ilmiah, analisis dampak lingkungan, dan studi evaluasi kualitas lingkungan.";
ViewData["Keywords"] = "Kajian, Regulasi Lingkungan, Kualitas Air, Data Lingkungan, Jakarta";
ViewData["OgTitle"] = "Kajian - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgDescription"] = "Kumpulan kajian dan penelitian terkait lingkungan hidup yang dilakukan oleh Dinas Lingkungan Hidup DKI Jakarta. Temukan hasil kajian ilmiah, analisis dampak lingkungan, dan studi evaluasi kualitas lingkungan.";
ViewData["TwitterTitle"] = "Kajian - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["TwitterDescription"] = "Kumpulan kajian dan penelitian terkait lingkungan hidup yang dilakukan oleh Dinas Lingkungan Hidup DKI Jakarta. Temukan hasil kajian ilmiah, analisis dampak lingkungan, dan studi evaluasi kualitas lingkungan.";
// Breadcumb
ViewData["BreadcrumbText"] = "Kajian";
ViewData["TitleBeforeHighlight"] = "Kajian";
ViewData["TitleHighlight"] = "Terkait Lingkungan Hidup";
}
<!-- Breadcumb -->
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
<div class="flex justify-center">
<div class="w-full max-w-6xl py-12">
<div class="text-center mb-8">
<h1 class="text-3xl font-bold mb-4">Kajian Terkait Lingkungan Hidup</h1>
<p class="text-gray-600 max-w-4xl mx-auto leading-relaxed">
Kumpulan kajian dan penelitian terkait lingkungan hidup yang dilakukan oleh Dinas Lingkungan Hidup DKI Jakarta. Temukan hasil kajian ilmiah, analisis dampak lingkungan, dan studi evaluasi kualitas lingkungan.
</p>
</div>
</div>
</div>
<div class="container max-w-6xl mx-auto pb-8">
<div class="flex flex-col lg:flex-row gap-8">
<!-- Main Content -->
<div class="lg:w-2/3">
<div class="bg-gradient-to-br from-white to-gray-50 rounded-xl shadow-sm border border-gray-100 p-8 backdrop-blur-sm">
<div class="flex items-center justify-between mb-6">
<h2 class="text-2xl font-bold text-gray-800 flex items-center">
<i class="fas fa-file-archive text-green-600 mr-3"></i>
Dokumen
</h2>
<div class="flex items-center gap-3">
<span class="bg-green-100 text-green-800 px-3 py-1 rounded-full text-sm font-medium">8 Dokumen</span>
<div class="flex items-center gap-2">
<label class="text-sm font-medium text-gray-700">Filter:</label>
<select class="px-3 py-1 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-green-500">
<option>Semua Tahun</option>
<option>2024</option>
<option>2023</option>
<option>2019</option>
</select>
</div>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-4 gap-4">
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
</div>
</div>
</div>
<!-- Enhanced Sidebar -->
<div class="lg:w-1/3 space-y-6">
<!-- Search Box -->
<div class="bg-gradient-to-br from-white to-green-50 rounded-xl shadow-lg border border-green-100 p-6">
<h3 class="text-xl font-bold mb-4 text-gray-800 flex items-center">
<i class="fas fa-search text-green-600 mr-3"></i>
Cari Dokumen
</h3>
<div class="relative">
<input type="text" class="w-full px-4 py-3 pl-12 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500 focus:border-transparent transition-all" placeholder="Masukkan kata kunci...">
<i class="fas fa-search absolute left-4 top-1/2 transform -translate-y-1/2 text-gray-400"></i>
<button class="absolute right-2 top-1/2 transform -translate-y-1/2 bg-green-600 text-white px-4 py-2 rounded-md hover:from-green-700 hover:to-green-800 transition-all duration-300 shadow-md">
Cari
</button>
</div>
</div>
</div>
</div>
</div>
<register-block dynamic-section="css" key="cssDIKPLHD">
<link href="~/assets/dflip/css/dflip.min.css" rel="stylesheet" type="text/css">
<link href="~/assets/dflip/css/themify-icons.min.css" rel="stylesheet" type="text/css">
</register-block>
<register-block dynamic-section="scripts" key="jsDIKPLHD">
<script src="~/assets/dflip/js/libs/jquery.min.js" type="text/javascript"></script>
<script src="~/assets/dflip/js/dflip.min.js" type="text/javascript"></script>
</register-block>

View File

@ -0,0 +1,146 @@
@{
Layout = "_Layout";
ViewData["Title"] = "Keanekaragaman Hayati - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["Description"] = "Informasi lengkap mengenai keanekaragaman hayati di DKI Jakarta. Temukan data flora dan fauna, program konservasi, serta upaya pelestarian ekosistem urban yang dilakukan oleh Dinas Lingkungan Hidup DKI Jakarta.";
ViewData["Keywords"] = "Keanekaragaman Hayati, Flora Fauna Jakarta, Konservasi, Ekosistem Urban, Biodiversitas, Jakarta";
ViewData["OgTitle"] = "Keanekaragaman Hayati - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgDescription"] = "Informasi lengkap mengenai keanekaragaman hayati di DKI Jakarta. Temukan data flora dan fauna, program konservasi, serta upaya pelestarian ekosistem urban yang dilakukan oleh Dinas Lingkungan Hidup DKI Jakarta.";
ViewData["TwitterTitle"] = "Keanekaragaman Hayati - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["TwitterDescription"] = "Informasi lengkap mengenai keanekaragaman hayati di DKI Jakarta. Temukan data flora dan fauna, program konservasi, serta upaya pelestarian ekosistem urban yang dilakukan oleh Dinas Lingkungan Hidup DKI Jakarta.";
// Breadcumb
ViewData["BreadcrumbText"] = "Keanekaragaman Hayati";
ViewData["TitleBeforeHighlight"] = "Keanekaragaman";
ViewData["TitleHighlight"] = "Hayati";
}
<!-- Breadcumb -->
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
<div class="flex justify-center">
<div class="w-full max-w-6xl py-12">
<div class="text-center mb-8">
<h1 class="text-3xl font-bold mb-4">Keanekaragaman Hayati</h1>
<p class="text-gray-600 max-w-4xl mx-auto leading-relaxed">
Informasi lengkap mengenai keanekaragaman hayati di DKI Jakarta. Temukan data flora dan fauna, program konservasi, serta upaya pelestarian ekosistem urban yang dilakukan oleh Dinas Lingkungan Hidup DKI Jakarta.
</p>
</div>
</div>
</div>
<div class="container max-w-6xl mx-auto pb-8">
<div class="flex flex-col lg:flex-row gap-8">
<!-- Main Content -->
<div class="lg:w-2/3">
<div class="bg-gradient-to-br from-white to-gray-50 rounded-xl shadow-sm border border-gray-100 p-8 backdrop-blur-sm">
<div class="flex items-center justify-between mb-6">
<h2 class="text-2xl font-bold text-gray-800 flex items-center">
<i class="fas fa-file-archive text-green-600 mr-3"></i>
Dokumen
</h2>
<div class="flex items-center gap-3">
<span class="bg-green-100 text-green-800 px-3 py-1 rounded-full text-sm font-medium">8 Dokumen</span>
<div class="flex items-center gap-2">
<label class="text-sm font-medium text-gray-700">Filter:</label>
<select class="px-3 py-1 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-green-500">
<option>Semua Tahun</option>
<option>2024</option>
<option>2023</option>
<option>2019</option>
</select>
</div>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-4 gap-4">
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
</div>
</div>
</div>
<!-- Enhanced Sidebar -->
<div class="lg:w-1/3 space-y-6">
<!-- Search Box -->
<div class="bg-gradient-to-br from-white to-green-50 rounded-xl shadow-lg border border-green-100 p-6">
<h3 class="text-xl font-bold mb-4 text-gray-800 flex items-center">
<i class="fas fa-search text-green-600 mr-3"></i>
Cari Dokumen
</h3>
<div class="relative">
<input type="text" class="w-full px-4 py-3 pl-12 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500 focus:border-transparent transition-all" placeholder="Masukkan kata kunci...">
<i class="fas fa-search absolute left-4 top-1/2 transform -translate-y-1/2 text-gray-400"></i>
<button class="absolute right-2 top-1/2 transform -translate-y-1/2 bg-green-600 text-white px-4 py-2 rounded-md hover:from-green-700 hover:to-green-800 transition-all duration-300 shadow-md">
Cari
</button>
</div>
</div>
</div>
</div>
</div>
<register-block dynamic-section="css" key="cssDIKPLHD">
<link href="~/assets/dflip/css/dflip.min.css" rel="stylesheet" type="text/css">
<link href="~/assets/dflip/css/themify-icons.min.css" rel="stylesheet" type="text/css">
</register-block>
<register-block dynamic-section="scripts" key="jsDIKPLHD">
<script src="~/assets/dflip/js/libs/jquery.min.js" type="text/javascript"></script>
<script src="~/assets/dflip/js/dflip.min.js" type="text/javascript"></script>
</register-block>

View File

@ -0,0 +1,146 @@
@{
Layout = "_Layout";
ViewData["Title"] = "Pemantauan Kualitas Udara - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["Description"] = "Pemantauan kualitas udara DKI Jakarta untuk mengukur tingkat pencemaran dan kualitas udara ambien melalui Indeks Kualitas Udara (IKU) untuk menjaga kesehatan masyarakat.";
ViewData["Keywords"] = "Pemantauan Kualitas Udara, IKU, Indeks Kualitas Udara, PM2.5, PM10, Polusi Udara Jakarta, Kualitas Udara Ambien, Pencemaran Udara";
ViewData["OgTitle"] = "Pemantauan Kualitas Udara - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgDescription"] = "Pemantauan kualitas udara DKI Jakarta untuk mengukur tingkat pencemaran dan kualitas udara ambien melalui Indeks Kualitas Udara (IKU) untuk menjaga kesehatan masyarakat.";
ViewData["TwitterTitle"] = "Pemantauan Kualitas Udara - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["TwitterDescription"] = "Pemantauan kualitas udara DKI Jakarta untuk mengukur tingkat pencemaran dan kualitas udara ambien melalui Indeks Kualitas Udara (IKU) untuk menjaga kesehatan masyarakat.";
// Breadcumb
ViewData["BreadcrumbText"] = "Pemantauan Kualitas Udara";
ViewData["TitleBeforeHighlight"] = "Pemantauan Kualitas";
ViewData["TitleHighlight"] = "Udara";
}
<!-- Breadcumb -->
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
<div class="flex justify-center">
<div class="w-full max-w-6xl py-12">
<div class="text-center mb-8">
<h1 class="text-3xl font-bold mb-4">Pemantauan Kualitas Udara</h1>
<p class="text-gray-600 max-w-4xl mx-auto leading-relaxed">
Pemantauan kualitas udara DKI Jakarta untuk mengukur tingkat pencemaran dan kualitas udara ambien melalui Indeks Kualitas Udara (IKU) untuk menjaga kesehatan masyarakat.
</p>
</div>
</div>
</div>
<div class="container max-w-6xl mx-auto pb-8">
<div class="flex flex-col lg:flex-row gap-8">
<!-- Main Content -->
<div class="lg:w-2/3">
<div class="bg-gradient-to-br from-white to-gray-50 rounded-xl shadow-sm border border-gray-100 p-8 backdrop-blur-sm">
<div class="flex items-center justify-between mb-6">
<h2 class="text-2xl font-bold text-gray-800 flex items-center">
<i class="fas fa-file-archive text-green-600 mr-3"></i>
Dokumen
</h2>
<div class="flex items-center gap-3">
<span class="bg-green-100 text-green-800 px-3 py-1 rounded-full text-sm font-medium">8 Dokumen</span>
<div class="flex items-center gap-2">
<label class="text-sm font-medium text-gray-700">Filter:</label>
<select class="px-3 py-1 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-green-500">
<option>Semua Tahun</option>
<option>2024</option>
<option>2023</option>
<option>2019</option>
</select>
</div>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-4 gap-4">
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
</div>
</div>
</div>
<!-- Enhanced Sidebar -->
<div class="lg:w-1/3 space-y-6">
<!-- Search Box -->
<div class="bg-gradient-to-br from-white to-green-50 rounded-xl shadow-lg border border-green-100 p-6">
<h3 class="text-xl font-bold mb-4 text-gray-800 flex items-center">
<i class="fas fa-search text-green-600 mr-3"></i>
Cari Dokumen
</h3>
<div class="relative">
<input type="text" class="w-full px-4 py-3 pl-12 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500 focus:border-transparent transition-all" placeholder="Masukkan kata kunci...">
<i class="fas fa-search absolute left-4 top-1/2 transform -translate-y-1/2 text-gray-400"></i>
<button class="absolute right-2 top-1/2 transform -translate-y-1/2 bg-green-600 text-white px-4 py-2 rounded-md hover:from-green-700 hover:to-green-800 transition-all duration-300 shadow-md">
Cari
</button>
</div>
</div>
</div>
</div>
</div>
<register-block dynamic-section="css" key="cssDIKPLHD">
<link href="~/assets/dflip/css/dflip.min.css" rel="stylesheet" type="text/css">
<link href="~/assets/dflip/css/themify-icons.min.css" rel="stylesheet" type="text/css">
</register-block>
<register-block dynamic-section="scripts" key="jsDIKPLHD">
<script src="~/assets/dflip/js/libs/jquery.min.js" type="text/javascript"></script>
<script src="~/assets/dflip/js/dflip.min.js" type="text/javascript"></script>
</register-block>

View File

@ -0,0 +1,146 @@
@{
Layout = "_Layout";
ViewData["Title"] = "Monitoring Emisi Sumber Tidak Bergerak - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["Description"] = "Informasi lengkap mengenai monitoring emisi sumber tidak bergerak di DKI Jakarta. Temukan data pemantauan kualitas udara, pengukuran emisi industri, dan program pengendalian pencemaran udara yang dilakukan oleh Dinas Lingkungan Hidup DKI Jakarta.";
ViewData["Keywords"] = "Monitoring Emisi Sumber Tidak Bergerak, Kualitas Udara Jakarta, Pemantauan Emisi, Pencemaran Udara, Industri Jakarta";
ViewData["OgTitle"] = "Monitoring Emisi Sumber Tidak Bergerak - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["OgDescription"] = "Informasi lengkap mengenai monitoring emisi sumber tidak bergerak di DKI Jakarta. Temukan data pemantauan kualitas udara, pengukuran emisi industri, dan program pengendalian pencemaran udara yang dilakukan oleh Dinas Lingkungan Hidup DKI Jakarta.";
ViewData["TwitterTitle"] = "Monitoring Emisi Sumber Tidak Bergerak - Dinas Lingkungan Hidup DKI Jakarta";
ViewData["TwitterDescription"] = "Informasi lengkap mengenai monitoring emisi sumber tidak bergerak di DKI Jakarta. Temukan data pemantauan kualitas udara, pengukuran emisi industri, dan program pengendalian pencemaran udara yang dilakukan oleh Dinas Lingkungan Hidup DKI Jakarta.";
// Breadcumb
ViewData["BreadcrumbText"] = "Monitoring Emisi Sumber Tidak Bergerak";
ViewData["TitleBeforeHighlight"] = "Monitoring Emisi";
ViewData["TitleHighlight"] = "Sumber Tidak Bergerak";
}
<!-- Breadcumb -->
<partial name="~/Views/Shared/Partials/_Breadcumb.cshtml" />
<div class="flex justify-center">
<div class="w-full max-w-6xl py-12">
<div class="text-center mb-8">
<h1 class="text-3xl font-bold mb-4">Monitoring Emisi Sumber Tidak Bergerak</h1>
<p class="text-gray-600 max-w-4xl mx-auto leading-relaxed">
Informasi lengkap mengenai monitoring emisi sumber tidak bergerak di DKI Jakarta. Temukan data pemantauan kualitas udara, pengukuran emisi industri, dan program pengendalian pencemaran udara yang dilakukan oleh Dinas Lingkungan Hidup DKI Jakarta.
</p>
</div>
</div>
</div>
<div class="container max-w-6xl mx-auto pb-8">
<div class="flex flex-col lg:flex-row gap-8">
<!-- Main Content -->
<div class="lg:w-2/3">
<div class="bg-gradient-to-br from-white to-gray-50 rounded-xl shadow-sm border border-gray-100 p-8 backdrop-blur-sm">
<div class="flex items-center justify-between mb-6">
<h2 class="text-2xl font-bold text-gray-800 flex items-center">
<i class="fas fa-file-archive text-green-600 mr-3"></i>
Dokumen
</h2>
<div class="flex items-center gap-3">
<span class="bg-green-100 text-green-800 px-3 py-1 rounded-full text-sm font-medium">8 Dokumen</span>
<div class="flex items-center gap-2">
<label class="text-sm font-medium text-gray-700">Filter:</label>
<select class="px-3 py-1 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-green-500">
<option>Semua Tahun</option>
<option>2024</option>
<option>2023</option>
<option>2019</option>
</select>
</div>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-4 gap-4">
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm">
<div class="relative overflow-hidden rounded-lg">
<div class="_df_thumb" source="@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")" thumb="@Url.Content("~/assets/images/dikplhd/buku.jpg")">Klik untuk Lihat & Unduh</div>
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3>
</div>
</div>
</div>
</div>
</div>
<!-- Enhanced Sidebar -->
<div class="lg:w-1/3 space-y-6">
<!-- Search Box -->
<div class="bg-gradient-to-br from-white to-green-50 rounded-xl shadow-lg border border-green-100 p-6">
<h3 class="text-xl font-bold mb-4 text-gray-800 flex items-center">
<i class="fas fa-search text-green-600 mr-3"></i>
Cari Dokumen
</h3>
<div class="relative">
<input type="text" class="w-full px-4 py-3 pl-12 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-green-500 focus:border-transparent transition-all" placeholder="Masukkan kata kunci...">
<i class="fas fa-search absolute left-4 top-1/2 transform -translate-y-1/2 text-gray-400"></i>
<button class="absolute right-2 top-1/2 transform -translate-y-1/2 bg-green-600 text-white px-4 py-2 rounded-md hover:from-green-700 hover:to-green-800 transition-all duration-300 shadow-md">
Cari
</button>
</div>
</div>
</div>
</div>
</div>
<register-block dynamic-section="css" key="cssDIKPLHD">
<link href="~/assets/dflip/css/dflip.min.css" rel="stylesheet" type="text/css">
<link href="~/assets/dflip/css/themify-icons.min.css" rel="stylesheet" type="text/css">
</register-block>
<register-block dynamic-section="scripts" key="jsDIKPLHD">
<script src="~/assets/dflip/js/libs/jquery.min.js" type="text/javascript"></script>
<script src="~/assets/dflip/js/dflip.min.js" type="text/javascript"></script>
</register-block>

View File

@ -135,102 +135,158 @@
<register-block dynamic-section="scripts" key="jsDIKPLHD"> <register-block dynamic-section="scripts" key="jsDIKPLHD">
<script src="~/assets/dflip/js/libs/jquery.min.js" type="text/javascript"></script> <script src="~/assets/dflip/js/libs/jquery.min.js" type="text/javascript"></script>
<script src="~/assets/dflip/js/dflip.min.js" type="text/javascript"></script> <script src="~/assets/dflip/js/dflip.min.js" type="text/javascript"></script>
<script type="text/javascript"> <script type="text/javascript">
// Ambil URL dari Razor agar bisa dipakai di JS // Render URL dengan Razor agar tidak terjadi masalah escape karakter
// HARDCODE hasil Razor ke dalam string agar tidak error interpretasi JS const pdfUrl = "@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")";
const pdfUrl = "@Url.Content("~/assets/documents/dikplhd/Buku_1_Ringkasan_Eksekutif_DIKPLHD_2019.pdf")"; const imgUrl = "@Url.Content("~/assets/images/dikplhd/buku.jpg")";
const imgUrl = "@Url.Content("~/assets/images/dikplhd/buku.jpg")";
const dokumenHTML = { // Object untuk menyimpan data HTML dokumen berdasarkan kategori
"Pengelolaan Limbah B3": ` const dokumenHTML = {
<div class="bg-white rounded-xl shadow-sm"> "Pengelolaan Limbah B3": `
<div class="relative overflow-hidden rounded-lg"> <div class="bg-white rounded-xl shadow-sm">
<div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div> <div class="relative overflow-hidden rounded-lg">
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3> <div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div>
</div> <h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">
Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019
</h3>
</div> </div>
<div class="bg-white rounded-xl shadow-sm"> </div>
<div class="relative overflow-hidden rounded-lg"> <div class="bg-white rounded-xl shadow-sm">
<div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div> <div class="relative overflow-hidden rounded-lg">
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3> <div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div>
</div> <h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">
Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019
</h3>
</div> </div>
<div class="bg-white rounded-xl shadow-sm"> </div>
<div class="relative overflow-hidden rounded-lg"> <div class="bg-white rounded-xl shadow-sm">
<div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div> <div class="relative overflow-hidden rounded-lg">
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3> <div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div>
</div> <h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">
Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019
</h3>
</div> </div>
<div class="bg-white rounded-xl shadow-sm"> </div>
<div class="relative overflow-hidden rounded-lg"> <div class="bg-white rounded-xl shadow-sm">
<div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div> <div class="relative overflow-hidden rounded-lg">
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019</h3> <div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div>
</div> <h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">
Buku I Ringkasan Eksekutif DIKPLHD Tahun 2019
</h3>
</div> </div>
`, </div>
"Pengendalian Pencemaran Air": ` `,
<div class="bg-white rounded-xl shadow-sm"> "Pengendalian Pencemaran Air": `
<div class="relative overflow-hidden rounded-lg"> <div class="bg-white rounded-xl shadow-sm">
<div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div> <div class="relative overflow-hidden rounded-lg">
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Panduan Pengendalian Pencemaran Air 2023</h3> <div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div>
</div> <h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">
Panduan Pengendalian Pencemaran Air 2023
</h3>
</div> </div>
`, </div>
"Pengendalian Pencemaran Udara": ` `,
<div class="bg-white rounded-xl shadow-sm"> "Pengendalian Pencemaran Udara": `
<div class="relative overflow-hidden rounded-lg"> <div class="bg-white rounded-xl shadow-sm">
<div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div> <div class="relative overflow-hidden rounded-lg">
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Pedoman Pengendalian Udara Bersih 2024</h3> <div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div>
</div> <h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">
Pedoman Pengendalian Udara Bersih 2024
</h3>
</div> </div>
`, </div>
"Pengelolaan Limbah Padat": ` `,
<div class="bg-white rounded-xl shadow-sm"> "Pengelolaan Limbah Padat": `
<div class="relative overflow-hidden rounded-lg"> <div class="bg-white rounded-xl shadow-sm">
<div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div> <div class="relative overflow-hidden rounded-lg">
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Standar Teknis Pengelolaan Limbah Padat</h3> <div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div>
</div> <h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">
Standar Teknis Pengelolaan Limbah Padat
</h3>
</div> </div>
`, </div>
"Peraturan dan Pedoman Terkait...": ` `,
<div class="bg-white rounded-xl shadow-sm"> "Peraturan dan Pedoman Terkait...": `
<div class="relative overflow-hidden rounded-lg"> <div class="bg-white rounded-xl shadow-sm">
<div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div> <div class="relative overflow-hidden rounded-lg">
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Peraturan Pengendalian Dampak Perubahan Iklim</h3> <div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div>
</div> <h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">
Peraturan Pengendalian Dampak Perubahan Iklim
</h3>
</div> </div>
`, </div>
"Peraturan Gubernur Jakarta Sadar...": ` `,
<div class="bg-white rounded-xl shadow-sm"> "Peraturan Gubernur Jakarta Sadar...": `
<div class="relative overflow-hidden rounded-lg"> <div class="bg-white rounded-xl shadow-sm">
<div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div> <div class="relative overflow-hidden rounded-lg">
<h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">Peraturan Gubernur Jakarta Sadar Sampah</h3> <div class="_df_thumb" source="${pdfUrl}" thumb="${imgUrl}">Klik untuk Lihat & Unduh</div>
</div> <h3 class="text-xs font-bold mb-3 text-gray-800 group-hover:text-green-600 transition-colors px-4">
Peraturan Gubernur Jakarta Sadar Sampah
</h3>
</div> </div>
` </div>
}; `
};
$(function() { // Fungsi untuk menginisialisasi DFlip
function getSelectedKategori() { function initializeDFlip() {
let selected = $('#kategoriSelect option:selected').text(); setTimeout(function() {
if (selected.startsWith("Peraturan dan Pedoman")) return "Peraturan dan Pedoman Terkait..."; if (typeof DFLIP !== 'undefined') {
if (selected.startsWith("Peraturan Gubernur Jakarta Sadar")) return "Peraturan Gubernur Jakarta Sadar..."; // Hapus instance DFlip yang sudah ada
return selected; $('._df_thumb').each(function() {
if ($(this).data('dflip')) {
$(this).data('dflip').dispose();
}
});
// Inisialisasi ulang DFlip
DFLIP.parseByClass('_df_thumb');
} }
}, 100);
}
// Set kategori dari localStorage jika ada $(function () {
const savedKategori = localStorage.getItem('selectedKategori'); // Inisialisasi DFlip saat halaman pertama kali dimuat
if (savedKategori) { initializeDFlip();
$('#kategoriSelect').val(savedKategori);
$('#kategoriLabel').text(savedKategori); // Fungsi untuk mengambil kategori berdasarkan dropdown
$('#dokumenGrid').html(dokumenHTML[getSelectedKategori()] || ''); function getSelectedKategori() {
} let selected = $('#kategoriSelect').val();
@* if (selected.startsWith("Peraturan dan Pedoman")) return "Peraturan dan Pedoman Terkait...";
$('#kategoriSelect').on('change', function() { if (selected.startsWith("Peraturan Gubernur Jakarta Sadar")) return "Peraturan Gubernur Jakarta Sadar...";
const selected = $(this).val(); return selected;
localStorage.setItem('selectedKategori', selected); }
location.reload();
}); *@ // Cek localStorage untuk pilihan kategori dan render konten default
const savedKategori = localStorage.getItem('selectedKategori');
if (savedKategori) {
$('#kategoriSelect').val(savedKategori);
$('#kategoriLabel').text(savedKategori);
$('#dokumenGrid').html(dokumenHTML[getSelectedKategori()] || '');
initializeDFlip();
} else {
const defaultKategori = $('#kategoriSelect').val();
$('#kategoriLabel').text(defaultKategori);
$('#dokumenGrid').html(dokumenHTML[getSelectedKategori()] || '');
initializeDFlip();
}
// Event listener ketika dropdown berubah
$('#kategoriSelect').on('change', function () {
const selected = $(this).val();
localStorage.setItem('selectedKategori', selected);
$('#kategoriLabel').text(selected);
// Update konten dokumen dengan proper reinitialization
$('#dokumenGrid').fadeOut(200, function () {
$(this).html(dokumenHTML[getSelectedKategori()] || '').fadeIn(200, function() {
// Inisialisasi ulang DFlip setelah konten dimuat
initializeDFlip();
});
});
}); });
</script> });
</script>
</register-block> </register-block>

View File

@ -1,28 +1,67 @@
@using InfiniLore.Lucide @using InfiniLore.Lucide
@addTagHelper *, InfiniLore.Lucide @addTagHelper *, InfiniLore.Lucide
<div id="mega-menu-2" class="hidden absolute left-0 w-full bg-white shadow-lg border-t border-gray-200 transition-all duration-300 z-40"> <div id="mega-menu-2" class="hidden absolute left-0 w-full bg-white shadow-xl border-t border-orange-200 transition-all duration-300 z-40">
<div class="max-w-6xl mx-auto px-4 py-6 grid grid-cols-1 md:grid-cols-3 gap-4"> <div class="max-w-7xl mx-auto px-4 py-6">
<a href="@Url.Action("Organisasi", "Profil")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="users"></i></div> <a href="@Url.Action("Organisasi", "Profil")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="users"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Struktur Organisasi</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Susunan organisasi DLH</p>
</a>
<a href="@Url.Action("Bidang", "Profil")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="building-2"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Bidang & UPT</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Informasi bidang kerja & unit pelaksana teknis DLH</p>
</a>
<a href="@Url.Action("Tupoksi", "Profil")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="clipboard-list"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Tupoksi</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Tugas pokok dan fungsi DLH</p>
</a>
</div>
</div>
</div>
<script>
// Define mobile template for Profil menu
window.profilMobileContent = `
<div class="space-y-3 max-h-[60vh] overflow-y-auto pb-4" style="scrollbar-width: thin; scrollbar-color: #f97316 #f3f4f6;">
<a href="@Url.Action("Organisasi", "Profil")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="users"></i>
</div>
<div> <div>
<div class="font-medium text-gray-900 hover:text-orange-700">Struktur Organisasi</div> <span class="font-medium text-gray-900">Struktur Organisasi</span>
<p class="text-sm text-gray-500">Susunan organisasi DLH.</p> <p class="text-sm text-gray-600">Susunan organisasi DLH</p>
</div> </div>
</a> </a>
<a href="@Url.Action("Bidang", "Profil")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("Bidang", "Profil")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="building"></i></div> <div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="building-2"></i>
</div>
<div> <div>
<div class="font-medium text-gray-900 hover:text-orange-700">Bidang & UPT</div> <span class="font-medium text-gray-900">Bidang & UPT</span>
<p class="text-sm text-gray-500">Informasi bidang kerja & unit pelaksana teknis DLH.</p> <p class="text-sm text-gray-600">Informasi bidang kerja</p>
</div> </div>
</a> </a>
<a href="@Url.Action("Tupoksi", "Profil")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("Tupoksi", "Profil")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="clipboard-list"></i></div> <div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="clipboard-list"></i>
</div>
<div> <div>
<div class="font-medium text-gray-900 hover:text-orange-700">Tupoksi</div> <span class="font-medium text-gray-900">Tupoksi</span>
<p class="text-sm text-gray-500">Tugas pokok dan fungsi DLH.</p> <p class="text-sm text-gray-600">Tugas pokok dan fungsi</p>
</div> </div>
</a> </a>
</div> </div>
</div> `;
</script>

View File

@ -1,84 +1,160 @@
@using InfiniLore.Lucide @using InfiniLore.Lucide
@addTagHelper *, InfiniLore.Lucide @addTagHelper *, InfiniLore.Lucide
<div id="mega-menu-3" class="hidden absolute left-0 w-full bg-white shadow-lg border-t border-gray-200 transition-all duration-300 z-40"> <div id="mega-menu-3" class="hidden absolute left-0 w-full bg-white shadow-xl border-t border-orange-200 transition-all duration-300 z-40">
<div class="max-w-6xl mx-auto px-4 py-6 grid grid-cols-1 md:grid-cols-3 gap-4"> <div class="max-w-7xl mx-auto px-4 py-6">
<a href="@Url.Action("DIKPLHD", "Publikasi")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <!-- First row - 6 items -->
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="database"></i></div> <div class="grid grid-cols-2 md:grid-cols-6 gap-4">
<div> <a href="@Url.Action("DIKPLHD", "Publikasi")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="font-medium text-gray-900 hover:text-orange-700">DIKPLH</div> <div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<p class="text-sm text-gray-500">Data dan Informasi Kinerja Pengelolaan Lingkungan Hidup.</p> <i class="w-6 h-6 text-white" data-lucide="database"></i>
</div> </div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">DIKPLH</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Data dan Informasi Kinerja Pengelolaan Lingkungan Hidup</p>
</a>
<a href="@Url.Action("Peraturan", "Publikasi")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="book-open"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Peraturan</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Regulasi terkait lingkungan hidup</p>
</a>
<a href="@Url.Action("LaporanKualitasAir", "Publikasi")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="waves"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Laporan Kualitas Air</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Informasi tentang kualitas air</p>
</a>
<a href="@Url.Action("LaporanKeuangan", "Publikasi")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="dollar-sign"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Laporan Keuangan</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Transparansi anggaran DLH</p>
</a>
<a href="@Url.Action("Kajian", "Publikasi")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="search"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Kajian</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Kajian ilmiah terkait lingkungan</p>
</a>
<a href="@Url.Action("KeanekaragamanHayati", "Publikasi")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="leaf"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Keanekaragaman Hayati</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Data flora dan fauna di wilayah setempat</p>
</a>
</div>
<!-- Second row - 6 items -->
<div class="grid grid-cols-2 md:grid-cols-6 gap-4 mt-4">
<a href="@Url.Action("GasRumahKaca", "Publikasi")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="cloud"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Gas Rumah Kaca</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Data terkait emisi gas rumah kaca</p>
</a>
<a href="@Url.Action("KLHS", "Publikasi")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="clipboard-check"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">KLHS</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Kajian Lingkungan Hidup Strategis</p>
</a>
<a href="@Url.Action("MonitoringEmisi", "Publikasi")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="factory"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Monitoring Emisi</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Data emisi dari sumber tetap seperti industri</p>
</a>
<a href="@Url.Action("LaporanKualitasUdara", "Publikasi")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="wind"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Laporan Kualitas Udara</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Hasil pemantauan kualitas udara</p>
</a>
<a href="@Url.Action("IKLH", "Publikasi")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="bar-chart"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">IKLH</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Indeks Kualitas Lingkungan Hidup</p>
</a>
<a href="@Url.Action("DataTambahan", "Publikasi")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="chart-line"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Data Lainnya</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Data publikasi tambahan</p>
</a>
</div>
</div>
</div>
<script>
// Define mobile template for Publikasi Data menu
window.publikasiDataMobileContent = `
<div class="grid grid-cols-2 gap-2 p-4 border-t border-orange-100">
<a href="@Url.Action("DIKPLHD", "Publikasi")" class="flex flex-col items-center p-3 bg-gradient-to-br from-orange-50 to-orange-100 rounded-lg hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<i class="w-5 h-5 text-orange-600 mb-1" data-lucide="database"></i>
<span class="text-xs font-medium text-gray-900 text-center">DIKPLHD</span>
</a> </a>
<a href="@Url.Action("Peraturan", "Publikasi")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("Peraturan", "Publikasi")" class="flex flex-col items-center p-3 bg-gradient-to-br from-orange-50 to-orange-100 rounded-lg hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="book-open"></i></div> <i class="w-5 h-5 text-orange-600 mb-1" data-lucide="book-open"></i>
<div> <span class="text-xs font-medium text-gray-900 text-center">Peraturan</span>
<div class="font-medium text-gray-900 hover:text-orange-700">Peraturan</div>
<p class="text-sm text-gray-500">Regulasi terkait lingkungan hidup.</p>
</div>
</a> </a>
<a href="@Url.Action("LaporanKualitasAir", "Publikasi")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("LaporanKualitasAir", "Publikasi")" class="flex flex-col items-center p-3 bg-gradient-to-br from-orange-50 to-orange-100 rounded-lg hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="waves"></i></div> <i class="w-5 h-5 text-orange-600 mb-1" data-lucide="waves"></i>
<div> <span class="text-xs font-medium text-gray-900 text-center">Kualitas Air</span>
<div class="font-medium text-gray-900 hover:text-orange-700">Laporan Kualitas Air</div>
<p class="text-sm text-gray-500">Informasi tentang kualitas air.</p>
</div>
</a> </a>
<a href="@Url.Action("LaporanKeuangan", "Publikasi")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("LaporanKeuangan", "Publikasi")" class="flex flex-col items-center p-3 bg-gradient-to-br from-orange-50 to-orange-100 rounded-lg hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="dollar-sign"></i></div> <i class="w-5 h-5 text-orange-600 mb-1" data-lucide="dollar-sign"></i>
<div> <span class="text-xs font-medium text-gray-900 text-center">Lap. Keuangan</span>
<div class="font-medium text-gray-900 hover:text-orange-700">Laporan Keuangan</div>
<p class="text-sm text-gray-500">Transparansi anggaran DLH.</p>
</div>
</a> </a>
<a href="@Url.Action("Kajian", "Publikasi")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("Kajian", "Publikasi")" class="flex flex-col items-center p-3 bg-gradient-to-br from-orange-50 to-orange-100 rounded-lg hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="search"></i></div> <i class="w-5 h-5 text-orange-600 mb-1" data-lucide="search"></i>
<div> <span class="text-xs font-medium text-gray-900 text-center">Kajian</span>
<div class="font-medium text-gray-900 hover:text-orange-700">Kajian</div>
<p class="text-sm text-gray-500">Kajian ilmiah terkait lingkungan.</p>
</div>
</a> </a>
<a href="@Url.Action("KeanekaragamanHayati", "Publikasi")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("KeanekaragamanHayati", "Publikasi")" class="flex flex-col items-center p-3 bg-gradient-to-br from-orange-50 to-orange-100 rounded-lg hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="leaf"></i></div> <i class="w-5 h-5 text-orange-600 mb-1" data-lucide="leaf"></i>
<div> <span class="text-xs font-medium text-gray-900 text-center">Keanekaragaman</span>
<div class="font-medium text-gray-900 hover:text-orange-700">Keanekaragaman Hayati</div>
<p class="text-sm text-gray-500">Data flora dan fauna di wilayah setempat.</p>
</div>
</a> </a>
<a href="@Url.Action("GasRumahKaca", "Publikasi")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("GasRumahKaca", "Publikasi")" class="flex flex-col items-center p-3 bg-gradient-to-br from-orange-50 to-orange-100 rounded-lg hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="cloud"></i></div> <i class="w-5 h-5 text-orange-600 mb-1" data-lucide="cloud"></i>
<div> <span class="text-xs font-medium text-gray-900 text-center">Gas Rumah Kaca</span>
<div class="font-medium text-gray-900 hover:text-orange-700">Gas Rumah Kaca</div>
<p class="text-sm text-gray-500">Data terkait emisi gas rumah kaca.</p>
</div>
</a> </a>
<a href="@Url.Action("KLHS", "Publikasi")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("KLHS", "Publikasi")" class="flex flex-col items-center p-3 bg-gradient-to-br from-orange-50 to-orange-100 rounded-lg hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="clipboard-check"></i></div> <i class="w-5 h-5 text-orange-600 mb-1" data-lucide="clipboard-check"></i>
<div> <span class="text-xs font-medium text-gray-900 text-center">KLHS</span>
<div class="font-medium text-gray-900 hover:text-orange-700">KLHS</div>
<p class="text-sm text-gray-500">Kajian Lingkungan Hidup Strategis.</p>
</div>
</a> </a>
<a href="@Url.Action("MonitoringEmisi", "Publikasi")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("LaporanKualitasUdara", "Publikasi")" class="flex flex-col items-center p-3 bg-gradient-to-br from-orange-50 to-orange-100 rounded-lg hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="factory"></i></div> <i class="w-5 h-5 text-orange-600 mb-1" data-lucide="wind"></i>
<div> <span class="text-xs font-medium text-gray-900 text-center">Kualitas Udara</span>
<div class="font-medium text-gray-900 hover:text-orange-700">Monitoring Emisi Sumber Tidak Bergerak</div>
<p class="text-sm text-gray-500">Data emisi dari sumber tetap seperti industri.</p>
</div>
</a> </a>
<a href="@Url.Action("LaporanKualitasUdara", "Publikasi")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("IKLH", "Publikasi")" class="flex flex-col items-center p-3 bg-gradient-to-br from-orange-50 to-orange-100 rounded-lg hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="wind"></i></div> <i class="w-5 h-5 text-orange-600 mb-1" data-lucide="bar-chart"></i>
<div> <span class="text-xs font-medium text-gray-900 text-center">IKLH</span>
<div class="font-medium text-gray-900 hover:text-orange-700">Laporan Kualitas Udara</div>
<p class="text-sm text-gray-500">Hasil pemantauan kualitas udara.</p>
</div>
</a> </a>
<a href="@Url.Action("IKLH", "Publikasi")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("MonitoringEmisi", "Publikasi")" class="flex flex-col items-center p-3 bg-gradient-to-br from-orange-50 to-orange-100 rounded-lg hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="bar-chart"></i></div> <i class="w-5 h-5 text-orange-600 mb-1" data-lucide="factory"></i>
<div> <span class="text-xs font-medium text-gray-900 text-center">Mon. Emisi</span>
<div class="font-medium text-gray-900 hover:text-orange-700">IKLH</div>
<p class="text-sm text-gray-500">Indeks Kualitas Lingkungan Hidup.</p>
</div>
</a> </a>
</div> </div>
</div> `;
</script>

View File

@ -1,63 +1,156 @@
@using InfiniLore.Lucide @using InfiniLore.Lucide
@addTagHelper *, InfiniLore.Lucide @addTagHelper *, InfiniLore.Lucide
<div id="mega-menu-4" class="hidden absolute left-0 w-full bg-white shadow-lg border-t border-gray-200 transition-all duration-300 z-40"> <div id="mega-menu-4" class="hidden absolute left-0 w-full bg-white shadow-xl border-t border-orange-200 transition-all duration-300 z-40">
<div class="max-w-6xl mx-auto px-4 py-6 grid grid-cols-1 md:grid-cols-3 gap-4"> <div class="max-w-7xl mx-auto px-4 py-6">
<a href="@Url.Action("Amdal", "Layanan")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <!-- First row - 4 items -->
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="leaf"></i></div> <div class="grid grid-cols-2 md:grid-cols-4 gap-4">
<a href="@Url.Action("Amdal", "Layanan")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="leaf"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">AMDAL</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Analisis Dampak Lingkungan</p>
</a>
<a href="https://ewaste.dinaslhdki.id/" target="_blank" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="smartphone"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Penjemputan e-Waste</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Layanan pengumpulan sampah elektronik</p>
</a>
<a href="@Url.Action("Lab", "Layanan")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="flask-conical"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Uji Sampel Laboratorium</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Pengujian kualitas lingkungan hidup</p>
</a>
<a href="@Url.Action("BusToilet", "Layanan")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="bus"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Bus Toilet</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Fasilitas toilet keliling untuk kegiatan umum</p>
</a>
</div>
<!-- Second row - 4 items -->
<div class="grid grid-cols-2 md:grid-cols-4 gap-4 mt-4">
<a href="https://bpsrw.dinaslhdki.id/" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="database"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">BPS-RW</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Basis data lingkungan hidup tingkat Rukun Warga</p>
</a>
<a href="@Url.Action("BulkyWaste", "Layanan")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="trash-2"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Bulky Waste</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Layanan khusus pengangkutan sampah besar</p>
</a>
<a href="@Url.Action("Ppid", "Layanan")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="file-text"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">PPID</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Pejabat Pengelola Informasi dan Dokumentasi</p>
</a>
<a href="@Url.Action("Whistleblowing", "Layanan")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="alert-triangle"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Whistleblowing System</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Sarana pelaporan pelanggaran terkait lingkungan</p>
</a>
</div>
</div>
</div>
<script>
// Define mobile template for Layanan section
window.layananMobileContent = `
<div class="space-y-3 max-h-[60vh] overflow-y-auto pb-4" style="scrollbar-width: thin; scrollbar-color: #f97316 #f3f4f6;">
<a href="@Url.Action("Amdal", "Layanan")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="leaf"></i>
</div>
<div> <div>
<div class="font-medium text-gray-900 hover:text-orange-700">AMDAL</div> <span class="font-medium text-gray-900">AMDAL</span>
<p class="text-sm text-gray-500">Analisis Dampak Lingkungan.</p> <p class="text-sm text-gray-600">Analisis Dampak Lingkungan</p>
</div> </div>
</a> </a>
<a href="https://ewaste.dinaslhdki.id/" target="_blank" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="https://ewaste.dinaslhdki.id/" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="smartphone"></i></div> <div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="smartphone"></i>
</div>
<div> <div>
<div class="font-medium text-gray-900 hover:text-orange-700">Penjemputan e-Waste</div> <span class="font-medium text-gray-900">Penjemputan e-Waste</span>
<p class="text-sm text-gray-500">Layanan pengumpulan sampah elektronik.</p> <p class="text-sm text-gray-600">Layanan pengumpulan sampah elektronik</p>
</div> </div>
</a> </a>
<a href="@Url.Action("Lab", "Layanan")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("Lab", "Layanan")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="flask-conical"></i></div> <div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="flask-conical"></i>
</div>
<div> <div>
<div class="font-medium text-gray-900 hover:text-orange-700">Uji Sampel Laboratorium</div> <span class="font-medium text-gray-900">Uji Sampel Laboratorium</span>
<p class="text-sm text-gray-500">Pengujian kualitas lingkungan hidup.</p> <p class="text-sm text-gray-600">Pengujian kualitas lingkungan hidup</p>
</div> </div>
</a> </a>
<a href="@Url.Action("BusToilet", "Layanan")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("BusToilet", "Layanan")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="bus"></i></div> <div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="bus"></i>
</div>
<div> <div>
<div class="font-medium text-gray-900 hover:text-orange-700">Bus Toilet</div> <span class="font-medium text-gray-900">Bus Toilet</span>
<p class="text-sm text-gray-500">Fasilitas toilet keliling untuk kegiatan umum.</p> <p class="text-sm text-gray-600">Fasilitas toilet keliling untuk kegiatan umum</p>
</div> </div>
</a> </a>
<a href="https://bpsrw.dinaslhdki.id/" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="https://bpsrw.dinaslhdki.id/" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="database"></i></div> <div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="database"></i>
</div>
<div> <div>
<div class="font-medium text-gray-900 hover:text-orange-700">BPS-RW</div> <span class="font-medium text-gray-900">BPS-RW</span>
<p class="text-sm text-gray-500">Basis data lingkungan hidup tingkat Rukun Warga.</p> <p class="text-sm text-gray-600">Basis data lingkungan hidup tingkat Rukun Warga</p>
</div> </div>
</a> </a>
<a href="@Url.Action("BulkyWaste", "Layanan")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("BulkyWaste", "Layanan")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="trash-2"></i></div> <div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="trash-2"></i>
</div>
<div> <div>
<div class="font-medium text-gray-900 hover:text-orange-700">Bulky Waste</div> <span class="font-medium text-gray-900">Bulky Waste</span>
<p class="text-sm text-gray-500">Layanan khusus pengangkutan sampah besar.</p> <p class="text-sm text-gray-600">Layanan khusus pengangkutan sampah besar</p>
</div> </div>
</a> </a>
<a href="@Url.Action("Ppid", "Layanan")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("Ppid", "Layanan")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="file-text"></i></div> <div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="file-text"></i>
</div>
<div> <div>
<div class="font-medium text-gray-900 hover:text-orange-700">PPID</div> <span class="font-medium text-gray-900">PPID</span>
<p class="text-sm text-gray-500">Pejabat Pengelola Informasi dan Dokumentasi.</p> <p class="text-sm text-gray-600">Pejabat Pengelola Informasi dan Dokumentasi</p>
</div> </div>
</a> </a>
<a href="@Url.Action("Whistleblowing", "Layanan")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("Whistleblowing", "Layanan")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="alert-triangle"></i></div> <div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="alert-triangle"></i>
</div>
<div> <div>
<div class="font-medium text-gray-900 hover:text-orange-700">Whistleblowing System</div> <span class="font-medium text-gray-900">Whistleblowing System</span>
<p class="text-sm text-gray-500">Sarana pelaporan pelanggaran terkait lingkungan.</p> <p class="text-sm text-gray-600">Sarana pelaporan pelanggaran terkait lingkungan</p>
</div> </div>
</a> </a>
</div> </div>
</div> `;
</script>

View File

@ -1,28 +1,52 @@
@using InfiniLore.Lucide @using InfiniLore.Lucide
@addTagHelper *, InfiniLore.Lucide @addTagHelper *, InfiniLore.Lucide
<div id="mega-menu-5" class="hidden absolute left-0 w-full bg-white shadow-lg border-t border-gray-200 transition-all duration-300 z-40"> <div id="mega-menu-5" class="hidden absolute left-0 w-full bg-white shadow-xl border-t border-orange-200 transition-all duration-300 z-40">
<div class="max-w-6xl mx-auto px-4 py-6 grid grid-cols-1 md:grid-cols-3 gap-4"> <div class="max-w-7xl mx-auto px-4 py-6">
<a href="@Url.Action("Berita", "Seputar")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="newspaper"></i></div> <a href="@Url.Action("Berita", "Seputar")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div> <div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<div class="font-medium text-gray-900 hover:text-orange-700">Berita</div> <i class="w-6 h-6 text-white" data-lucide="newspaper"></i>
<p class="text-sm text-gray-500">Kegiatan dan informasi terkini dari DLH.</p> </div>
</div> <div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Berita</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Kegiatan dan informasi terkini dari DLH</p>
</a>
<a href="@Url.Action("Video", "Seputar")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="video"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Video</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Kegiatan dan Video terkini dari DLH</p>
</a>
<a href="@Url.Action("Kontak", "Seputar")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="phone"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Kontak Kami</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Informasi kontak untuk keperluan masyarakat</p>
</a>
</div>
</div>
</div>
<script>
// Define mobile template for Seputar DLH section
window.seputarMobileContent = `
<div class="space-y-2 p-4 border-t border-orange-100">
<a href="@Url.Action("Berita", "Seputar")" class="flex items-center gap-3 p-3 bg-gradient-to-r from-orange-50 to-orange-100 rounded-lg hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<i class="w-5 h-5 text-orange-600" data-lucide="newspaper"></i>
<span class="font-medium text-gray-900">Berita</span>
</a> </a>
<a href="@Url.Action("Video", "Seputar")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("Video", "Seputar")" class="flex items-center gap-3 p-3 bg-gradient-to-r from-orange-50 to-orange-100 rounded-lg hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="video"></i></div> <i class="w-5 h-5 text-orange-600" data-lucide="video"></i>
<div> <span class="font-medium text-gray-900">Video</span>
<div class="font-medium text-gray-900 hover:text-orange-700">Video</div>
<p class="text-sm text-gray-500">Kegiatan dan Video terkini dari DLH.</p>
</div>
</a> </a>
<a href="@Url.Action("Kontak", "Seputar")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <a href="@Url.Action("Kontak", "Seputar")" class="flex items-center gap-3 p-3 bg-gradient-to-r from-orange-50 to-orange-100 rounded-lg hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="phone"></i></div> <i class="w-5 h-5 text-orange-600" data-lucide="phone"></i>
<div> <span class="font-medium text-gray-900">Kontak Kami</span>
<div class="font-medium text-gray-900 hover:text-orange-700">Kontak Kami</div>
<p class="text-sm text-gray-500">Informasi kontak untuk keperluan masyarakat.</p>
</div>
</a> </a>
</div> </div>
</div> `;
</script>

View File

@ -1,6 +1,6 @@
<footer class="bg-oren pt-8"> <footer class="bg-oren md:pt-8">
<!-- Main Footer Section --> <!-- Main Footer Section -->
<div class="relative max-w-6xl bg-ijo rounded-2xl mx-auto overflow-hidden shadow-2xl"> <div class="relative max-w-6xl bg-ijo md:rounded-2xl mx-auto overflow-hidden shadow-2xl">
<!-- Background Pattern --> <!-- Background Pattern -->
<div class="absolute inset-0 opacity-20"> <div class="absolute inset-0 opacity-20">
<div class="absolute inset-0" <div class="absolute inset-0"
@ -13,11 +13,11 @@
<div class="absolute bottom-0 left-0 w-24 h-24 bg-white/5 rounded-full translate-y-12 -translate-x-12"></div> <div class="absolute bottom-0 left-0 w-24 h-24 bg-white/5 rounded-full translate-y-12 -translate-x-12"></div>
<div class="relative container mx-auto px-6"> <div class="relative container mx-auto px-6">
<div class="grid grid-cols-1 lg:grid-cols-3 gap-12"> <div class="grid grid-cols-1 lg:grid-cols-3 gap-0 md:gap-12">
<!-- Left Section --> <!-- Left Section -->
<div class="flex flex-col text-center justify-center lg:text-left"> <div class="flex flex-col text-center justify-center md:text-left">
<div class="inline-block"> <div class="inline-block">
<h2 class="text-4xl lg:text-5xl font-black text-white mb-2 tracking-tight">SAVE OUR</h2> <h2 class="text-4xl lg:text-5xl font-black text-white mb-2 tracking-tight mt-6">SAVE OUR</h2>
<a href="#" class="flip-animate inline-block"> <a href="#" class="flip-animate inline-block">
<span class="text-4xl lg:text-5xl font-black text-yellow-300 mb-4 tracking-tight" data-hover="FUTURE">EARTH</span> <span class="text-4xl lg:text-5xl font-black text-yellow-300 mb-4 tracking-tight" data-hover="FUTURE">EARTH</span>
</a> </a>
@ -72,7 +72,7 @@
</div> </div>
<div class="text-left"> <div class="text-left">
<p class="text-white font-medium text-sm lg:text-base">Email</p> <p class="text-white font-medium text-sm lg:text-base">Email</p>
<p class="text-green-100 text-xs lg:text-sm">dinaslh@jakarta.go.id</p> <p class="text-green-100 texBt-xs lg:text-sm">dinaslh@jakarta.go.id</p>
</div> </div>
</div> </div>
</div> </div>
@ -85,7 +85,7 @@
<!-- Section 2: Tentang Kami dan Layanan --> <!-- Section 2: Tentang Kami dan Layanan -->
<div class="bg-[#f49827] py-8"> <div class="bg-[#f49827] py-8">
<div class="container max-w-6xl mx-auto px-4"> <div class="container max-w-6xl mx-auto px-4">
<div class="flex flex-col lg:flex-row justify-between items-start lg:items-center text-white space-y-8 lg:space-y-0"> <div class="flex flex-col lg:flex-row justify-between items-center text-white space-y-8 lg:space-y-0">
<!-- Tentang Kami --> <!-- Tentang Kami -->
<div class="flex flex-col md:flex-row space-y-4 md:space-y-0 md:space-x-8 items-start md:items-center"> <div class="flex flex-col md:flex-row space-y-4 md:space-y-0 md:space-x-8 items-start md:items-center">
<div> <div>
@ -93,24 +93,24 @@
</div> </div>
<div class="flex flex-col space-y-2"> <div class="flex flex-col space-y-2">
@* <a href="#" class="hover:underline">Visi Misi</a> *@ @* <a href="#" class="hover:underline">Visi Misi</a> *@
<a href="#" class="hover:underline">Struktur Organisasi</a> <a href="@Url.Action("Organisasi", "Profil")" class="hover:underline">Struktur Organisasi</a>
</div> </div>
</div> </div>
<!-- Layanan --> <!-- Layanan -->
<div class="flex flex-col md:flex-row space-y-4 md:space-y-0 md:space-x-8 items-start md:items-center"> <div class="flex flex-col md:flex-row space-y-4 md:space-y-0 md:space-x-8 items-center">
<div> <div>
<h4 class="font-semibold text-xl md:text-2xl">Layanan</h4> <h4 class="font-semibold text-xl md:text-2xl">Layanan</h4>
</div> </div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-x-4 gap-y-2"> <div class="grid grid-cols-1 md:grid-cols-2 gap-x-4 gap-y-2 items-center text-center md:text-left md:items-start">
<a href="#" class="hover:underline">Penjemputan e-Waste</a> <a href="https://ewaste.dinaslhdki.id/" target="_blank" class="hover:underline">Penjemputan e-Waste</a>
<a href="#" class="hover:underline">Bulky Waste</a> <a href="@Url.Action("BulkyWaste", "Layanan")" target="_blank" class="hover:underline">Bulky Waste</a>
<a href="#" class="hover:underline">Uji Sampel Laboratorium</a> <a href="@Url.Action("Lab", "Layanan")" target="_blank" class="hover:underline">Uji Sampel Laboratorium</a>
<a href="#" class="hover:underline">Permohonan Informasi Publik</a> <a href="@Url.Action("Ppid", "Layanan")" target="_blank" class="hover:underline">Permohonan Informasi Publik</a>
<a href="#" class="hover:underline">Bus Toilet</a> <a href="@Url.Action("BusToilet", "Layanan")" target="_blank" class="hover:underline">Bus Toilet</a>
<a href="#" class="hover:underline">BPS-RW</a> <a href="https://bpsrw.dinaslhdki.id/" target="_blank" class="hover:underline">BPS-RW</a>
<a href="#" class="hover:underline">AMDAL</a> <a href="@Url.Action("Amdal", "Layanan")" target="_blank" class="hover:underline">AMDAL</a>
<a href="#" class="hover:underline">Whistleblowing System</a> <a href="@Url.Action("Whistleblowing", "Layanan")" target="_blank" class="hover:underline">Whistleblowing System</a>
</div> </div>
</div> </div>
</div> </div>
@ -119,10 +119,10 @@
<!-- Bottom Section --> <!-- Bottom Section -->
<div class="bg-black py-6"> <div class="bg-black py-6">
<div class="container max-w-6xl mx-auto px-4"> <div class="container max-w-6xl mx-auto px-4 md:pb-0 pb-12">
<div class="flex flex-col md:flex-row justify-between items-center text-white space-y-4 md:space-y-0"> <div class="flex flex-col md:flex-row justify-between items-center text-white space-y-4 md:space-y-0">
<a href="@Url.Action("Index", "Home")" class="flex items-center space-x-3"> <a href="@Url.Action("Index", "Home")" class="flex items-center space-x-3">
<img src="https://lingkunganhidup.jakarta.go.id/images/weblink/logo-dlh.png" class="h-8 md:h-10" alt="DLH Logo" /> <img src="@Url.Content("~/logo-dlh.png")" class="h-8 md:h-10" alt="DLH Logo" />
<div class="text-center md:text-left"> <div class="text-center md:text-left">
<span class="text-sm md:text-lg font-bold text-white leading-tight">DINAS LINGKUNGAN HIDUP</span> <span class="text-sm md:text-lg font-bold text-white leading-tight">DINAS LINGKUNGAN HIDUP</span>
<span class="block text-xs md:text-sm text-white/70 font-medium">PROVINSI DKI JAKARTA</span> <span class="block text-xs md:text-sm text-white/70 font-medium">PROVINSI DKI JAKARTA</span>
@ -135,11 +135,11 @@
</div> </div>
</div> </div>
<!-- Chat Button --> <!-- Chat Button -->
<div id="chatButton" class="fixed bottom-5 right-5 p-4 rounded-full cursor-pointer z-50"> <div id="chatButton" class="fixed bottom-22 right-3 md:bottom-5 md:right-5 p-4 cursor-pointer z-20">
<img src="@Url.Content("~/chatbot.gif")" alt="Chat Icon" class="w-12 h-12 rounded-full"/> <img src="@Url.Content("~/chatbot.svg")" alt="Chat Icon" class="w-24 h-24"/>
<div class="absolute -top-8 -left-3 bg-green-500 text-white text-xs px-2 py-1 rounded whitespace-nowrap"> @* <div class="absolute -top-8 -left-5 bg-green-500 text-white md:text-xs text-sm px-2 py-1 rounded whitespace-nowrap">
Tanya saya! Tanya EcoBot!
</div> </div> *@
</div> </div>
<!-- Chatbot --> <!-- Chatbot -->
@ -369,6 +369,79 @@ document.addEventListener('DOMContentLoaded', function() {
const closeChat = document.getElementById("closeChat"); const closeChat = document.getElementById("closeChat");
const sendMessage = document.getElementById("sendMessage"); const sendMessage = document.getElementById("sendMessage");
const userInput = document.getElementById("userInput"); const userInput = document.getElementById("userInput");
// Session configuration
const SESSION_DURATION = 30 * 60 * 1000; // 30 menit dalam milliseconds
const STORAGE_KEY = 'ecobot_chat_session';
// Load chat history from localStorage
function loadChatHistory() {
try {
const sessionData = localStorage.getItem(STORAGE_KEY);
if (sessionData) {
const data = JSON.parse(sessionData);
const now = new Date().getTime();
// Check if session is still valid
if (now - data.timestamp < SESSION_DURATION) {
const chatContent = document.querySelector(".chat-content");
// Clear default welcome message
chatContent.innerHTML = '';
// Load saved messages
data.messages.forEach(msg => {
const bubble = document.createElement("div");
bubble.className = `chat-bubble ${msg.type}`;
bubble.style.cssFloat = msg.type === 'user' ? 'right' : 'left';
bubble.style.clear = 'both';
bubble.innerHTML = msg.content;
chatContent.appendChild(bubble);
});
chatContent.scrollTop = chatContent.scrollHeight;
return true; // Session restored
} else {
// Session expired, clear storage
localStorage.removeItem(STORAGE_KEY);
}
}
} catch (error) {
console.error('Error loading chat history:', error);
localStorage.removeItem(STORAGE_KEY);
}
return false; // New session
}
// Save message to localStorage
function saveMessage(type, content) {
try {
let sessionData = localStorage.getItem(STORAGE_KEY);
let data;
if (sessionData) {
data = JSON.parse(sessionData);
} else {
data = {
timestamp: new Date().getTime(),
messages: []
};
}
data.messages.push({ type, content });
localStorage.setItem(STORAGE_KEY, JSON.stringify(data));
} catch (error) {
console.error('Error saving message:', error);
}
}
// Initialize chat session
const sessionRestored = loadChatHistory();
if (!sessionRestored) {
// New session - show welcome message and save it
const welcomeMsg = `
<p>Halo! Selamat datang di layanan informasi Dinas Lingkungan Hidup DKI Jakarta! 👋</p>
<p>Saya di sini untuk membantu Anda. Ada yang ingin ditanyakan seputar layanan kami?</p>
`;
saveMessage('bot', welcomeMsg);
}
chatButton.addEventListener("click", () => { chatButton.addEventListener("click", () => {
chatbot.classList.remove('scale-0'); chatbot.classList.remove('scale-0');
@ -399,6 +472,9 @@ document.addEventListener('DOMContentLoaded', function() {
chatContent.appendChild(userBubble); chatContent.appendChild(userBubble);
chatContent.scrollTop = chatContent.scrollHeight; chatContent.scrollTop = chatContent.scrollHeight;
// Save user message
saveMessage('user', message);
userInput.value = ''; userInput.value = '';
// Show typing indicator // Show typing indicator
@ -408,7 +484,6 @@ document.addEventListener('DOMContentLoaded', function() {
<span></span> <span></span>
<span></span> <span></span>
<span></span> <span></span>
@* <span class="typing-text">EcoBot sedang mengetik...</span> *@
`; `;
chatContent.appendChild(typingIndicator); chatContent.appendChild(typingIndicator);
chatContent.scrollTop = chatContent.scrollHeight; chatContent.scrollTop = chatContent.scrollHeight;
@ -446,7 +521,6 @@ document.addEventListener('DOMContentLoaded', function() {
if (!reply) reply = "Maaf, saya tidak mengerti."; if (!reply) reply = "Maaf, saya tidak mengerti.";
// Format reply: convert **text** to bold and handle line breaks // Format reply: convert **text** to bold and handle line breaks
reply = reply.replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>').replace(/\n/g, "<br>");
reply = reply.replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>').replace(/\*(.*?)\*/g, '<em>$1</em>').replace(/\n/g, "<br>"); reply = reply.replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>').replace(/\*(.*?)\*/g, '<em>$1</em>').replace(/\n/g, "<br>");
// Bot bubble (kiri) // Bot bubble (kiri)
@ -457,18 +531,25 @@ document.addEventListener('DOMContentLoaded', function() {
botBubble.innerHTML = reply; botBubble.innerHTML = reply;
chatContent.appendChild(botBubble); chatContent.appendChild(botBubble);
chatContent.scrollTop = chatContent.scrollHeight; chatContent.scrollTop = chatContent.scrollHeight;
// Save bot message
saveMessage('bot', reply);
}) })
.catch(error => { .catch(error => {
// Remove typing indicator // Remove typing indicator
typingIndicator.remove(); typingIndicator.remove();
const errorMsg = "Maaf, terjadi kesalahan koneksi.";
const botBubble = document.createElement("div"); const botBubble = document.createElement("div");
botBubble.className = "chat-bubble bot"; botBubble.className = "chat-bubble bot";
botBubble.style.cssFloat = "left"; botBubble.style.cssFloat = "left";
botBubble.style.clear = "both"; botBubble.style.clear = "both";
botBubble.textContent = "Maaf, terjadi kesalahan koneksi."; botBubble.textContent = errorMsg;
chatContent.appendChild(botBubble); chatContent.appendChild(botBubble);
chatContent.scrollTop = chatContent.scrollHeight; chatContent.scrollTop = chatContent.scrollHeight;
// Save error message
saveMessage('bot', errorMsg);
console.error('Error:', error); console.error('Error:', error);
}); });
} }

View File

@ -2,72 +2,75 @@
@addTagHelper *, InfiniLore.Lucide @addTagHelper *, InfiniLore.Lucide
<!-- Mega Menu 1: Program --> <!-- Mega Menu 1: Program -->
<div id="mega-menu-1" class="hidden absolute left-0 w-full bg-white shadow-lg border-t border-gray-200 transition-all duration-300 z-40"> <div id="mega-menu-1" class="hidden absolute left-0 w-full bg-white shadow-xl border-t border-orange-200 transition-all duration-300 z-40">
<div class="max-w-6xl mx-auto px-4 py-6 grid grid-cols-1 md:grid-cols-3 gap-4"> <div class="max-w-7xl mx-auto px-4 py-6">
<div class="space-y-3"> <!-- First row - 4 items -->
<a href="@Url.Action("Udara", "Program")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <div class="grid grid-cols-2 md:grid-cols-4 gap-4">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="wind"></i></div> <a href="@Url.Action("Udara", "Program")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div> <div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<div class="font-medium text-gray-900 hover:text-orange-700">Udara</div> <i class="w-6 h-6 text-white" data-lucide="wind"></i>
<p class="text-sm text-gray-500">Pengelolaan dan pengawasan kualitas udara.</p>
</div> </div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Udara</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Pengelolaan dan pengawasan kualitas udara</p>
</a> </a>
<a href="@Url.Action("Sampah", "Program")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
<div class="bg-orange-100 rounded-full p-2"> <a href="@Url.Action("Air", "Program")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<i class="w-5 h-5 text-orange-600" data-lucide="trash"></i> <div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
</div> <i class="w-6 h-6 text-white" data-lucide="droplets"></i>
<div>
<div class="font-medium text-gray-900 hover:text-orange-700">Sampah</div>
<p class="text-sm text-gray-500">Pengawasan kepatuhan lingkungan.</p>
</div> </div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Air</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Pengelolaan dan pelestarian air</p>
</a> </a>
<a href="@Url.Action("Anggaran", "Program")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="banknote"></i></div> <a href="@Url.Action("Sampah", "Program")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div> <div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<div class="font-medium text-gray-900 hover:text-orange-700">Anggaran</div> <i class="w-6 h-6 text-white" data-lucide="trash-2"></i>
<p class="text-sm text-gray-500">Informasi mengenai anggaran DLH.</p>
</div> </div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Sampah</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Pengawasan kepatuhan lingkungan</p>
</a>
<a href="@Url.Action("LKIP", "Program")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="file-text"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">LKIP</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Laporan Kinerja Instansi Pemerintah</p>
</a> </a>
</div> </div>
<!-- Second row - 4 items -->
<div class="grid grid-cols-2 md:grid-cols-4 gap-4 mt-4">
<a href="@Url.Action("Pengawasan", "Program")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="eye"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Pengawasan</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Komitmen pencapaian kinerja lingkungan</p>
</a>
<a href="@Url.Action("PerjanjianKinerja", "Program")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<i class="w-6 h-6 text-white" data-lucide="handshake"></i>
</div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Perjanjian Kinerja</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Upaya pengelolaan sampah terintegrasi</p>
</a>
<div class="space-y-3"> <a href="@Url.Action("RencanaStrategis", "Program")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<a href="@Url.Action("Air", "Program")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition"> <div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="droplet"></i></div> <i class="w-6 h-6 text-white" data-lucide="target"></i>
<div>
<div class="font-medium text-gray-900 hover:text-orange-700">Air</div>
<p class="text-sm text-gray-500">Pengelolaan dan pelestarian air.</p>
</div> </div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Rencana Strategis</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Dokumen perencanaan strategis DLH</p>
</a> </a>
<a href="@Url.Action("LKIP", "Program")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="notebook-text"></i></div> <a href="@Url.Action("Anggaran", "Program")" class="flex flex-col items-center p-4 rounded-lg hover:bg-orange-50 transition-all duration-300 group text-center">
<div> <div class="w-12 h-12 rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow group-hover:scale-110 transition-transform duration-300 mb-3">
<div class="font-medium text-gray-900 hover:text-orange-700">LKIP</div> <i class="w-6 h-6 text-white" data-lucide="banknote"></i>
<p class="text-sm text-gray-500">Laporan Kinerja Instansi Pemerintah.</p>
</div>
</a>
<a href="@Url.Action("Pengawasan", "Program")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="eye"></i></div>
<div>
<div class="font-medium text-gray-900 hover:text-orange-700">Pengawasan</div>
<p class="text-sm text-gray-500">Komitmen pencapaian kinerja lingkungan.</p>
</div>
</a>
</div>
<div class="space-y-3">
<a href="@Url.Action("PerjanjianKinerja", "Program")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="file-text"></i></div>
<div>
<div class="font-medium text-gray-900 hover:text-orange-700">Perjanjian Kinerja</div>
<p class="text-sm text-gray-500">Upaya pengelolaan sampah terintegrasi.</p>
</div>
</a>
<a href="@Url.Action("RencanaStrategis", "Program")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
<div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="target"></i></div>
<div>
<div class="font-medium text-gray-900 hover:text-orange-700">Rencana Strategis</div>
<p class="text-sm text-gray-500">Dokumen perencanaan strategis DLH.</p>
</div> </div>
<div class="font-medium text-gray-900 group-hover:text-orange-700 transition-colors duration-300 mb-1">Anggaran</div>
<p class="text-xs text-gray-500 group-hover:text-gray-600 leading-tight">Informasi mengenai anggaran DLH</p>
</a> </a>
</div> </div>
</div> </div>
@ -77,3 +80,83 @@
<partial name="~/Views/Shared/Partials/MegaMenus/_MegaMenu3-PublikasiData.cshtml" /> <partial name="~/Views/Shared/Partials/MegaMenus/_MegaMenu3-PublikasiData.cshtml" />
<partial name="~/Views/Shared/Partials/MegaMenus/_MegaMenu4-Layanan.cshtml" /> <partial name="~/Views/Shared/Partials/MegaMenus/_MegaMenu4-Layanan.cshtml" />
<partial name="~/Views/Shared/Partials/MegaMenus/_MegaMenu5-SeputarDLH.cshtml" /> <partial name="~/Views/Shared/Partials/MegaMenus/_MegaMenu5-SeputarDLH.cshtml" />
<script>
// Define mobile template for Program menu
window.programMobileContent = `
<div class="space-y-3 max-h-[60vh] overflow-y-auto pb-4" style="scrollbar-width: thin; scrollbar-color: #f97316 #f3f4f6;">
<a href="@Url.Action("Udara", "Program")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="wind"></i>
</div>
<div>
<span class="font-medium text-gray-900">Udara</span>
<p class="text-sm text-gray-600">Pengelolaan dan pengawasan kualitas udara</p>
</div>
</a>
<a href="@Url.Action("Air", "Program")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="droplets"></i>
</div>
<div>
<span class="font-medium text-gray-900">Air</span>
<p class="text-sm text-gray-600">Pengelolaan dan pelestarian air</p>
</div>
</a>
<a href="@Url.Action("Sampah", "Program")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="trash-2"></i>
</div>
<div>
<span class="font-medium text-gray-900">Sampah</span>
<p class="text-sm text-gray-600">Pengawasan kepatuhan lingkungan</p>
</div>
</a>
<a href="@Url.Action("LKIP", "Program")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="file-text"></i>
</div>
<div>
<span class="font-medium text-gray-900">LKIP</span>
<p class="text-sm text-gray-600">Laporan Kinerja Instansi Pemerintah</p>
</div>
</a>
<a href="@Url.Action("Pengawasan", "Program")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="eye"></i>
</div>
<div>
<span class="font-medium text-gray-900">Pengawasan</span>
<p class="text-sm text-gray-600">Komitmen pencapaian kinerja lingkungan</p>
</div>
</a>
<a href="@Url.Action("PerjanjianKinerja", "Program")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="handshake"></i>
</div>
<div>
<span class="font-medium text-gray-900">Perjanjian Kinerja</span>
<p class="text-sm text-gray-600">Upaya pengelolaan sampah terintegrasi</p>
</div>
</a>
<a href="@Url.Action("RencanaStrategis", "Program")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="target"></i>
</div>
<div>
<span class="font-medium text-gray-900">Rencana Strategis</span>
<p class="text-sm text-gray-600">Dokumen perencanaan strategis DLH</p>
</div>
</a>
<a href="@Url.Action("Anggaran", "Program")" class="flex items-center gap-4 p-4 bg-gradient-to-r from-orange-50 to-orange-100 rounded-xl hover:from-orange-100 hover:to-orange-200 transition-all duration-300 active:scale-95">
<div class="w-12 h-12 bg-gradient-to-br from-orange-500 to-orange-600 rounded-xl flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="banknote"></i>
</div>
<div>
<span class="font-medium text-gray-900">Anggaran</span>
<p class="text-sm text-gray-600">Informasi mengenai anggaran DLH</p>
</div>
</a>
</div>
`;
</script>

View File

@ -1,205 +1,355 @@
@using InfiniLore.Lucide @using InfiniLore.Lucide
@addTagHelper *, InfiniLore.Lucide @addTagHelper *, InfiniLore.Lucide
<nav class="bg-white shadow-sm relative z-50"> <!-- Desktop Navigation -->
<div class="flex flex-wrap justify-between items-center mx-auto max-w-6xl px-4 py-3 lg:py-4"> <nav class="bg-white shadow-sm sticky top-0 z-50">
<a href="@Url.Action("Index", "Home")" class="flex items-center space-x-3"> <div class="max-w-6xl mx-auto px-4">
<img src="@Url.Content("~/logo-dlh.png")" class="h-10" alt="DLH Logo" /> <!-- Top Header with Logo -->
<div> <div class="flex items-center justify-between py-4">
<span class="text-lg font-bold text-gray-900 leading-tight">DINAS LINGKUNGAN HIDUP</span> <a href="@Url.Action("Index", "Home")" class="flex items-center space-x-3">
<span class="block text-sm text-orange-600 font-medium">PROVINSI DKI JAKARTA</span> <img src="@Url.Content("~/logo-dlh.png")" class="h-10" alt="DLH Logo" />
</div> <div>
</a> <span class="text-lg font-bold text-gray-900 leading-tight">DINAS LINGKUNGAN HIDUP</span>
<span class="block text-sm text-orange-600 font-medium">PROVINSI DKI JAKARTA</span>
<!-- Mobile menu button --> </div>
<button id="mobile-drawer-button" type="button" </a>
class="inline-flex items-center p-2 ml-3 text-gray-700 rounded-lg md:hidden hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-orange-400 transition-colors duration-200"
aria-controls="mobile-drawer" aria-expanded="false"> <!-- Desktop Menu -->
<span class="sr-only">Open main menu</span> <div class="hidden md:flex md:items-center md:space-x-8">
<i id="menu-icon" class="w-6 h-6 transition-transform duration-300" data-lucide="menu"></i> <a href="@Url.Action("Index", "Home")"
</button> class="text-gray-700 hover:text-orange-600 font-medium transition-colors duration-200">
Beranda
<!-- Desktop Menu -->
<div class="hidden md:flex md:items-center md:w-auto">
<ul class="flex flex-col md:flex-row md:space-x-6 font-medium">
<li class="relative group">
<a href="@Url.Action("Index", "Home")" class="flex items-center py-2 text-gray-900 hover:text-orange-600">
Beranda
</a> </a>
</li>
<div class="relative group">
@* Dropdown Menu Buttons *@ <button id="dropdown-button-1"
@{ class="flex items-center text-gray-700 hover:text-orange-600 font-medium transition-colors duration-200">
var menus = new[] { "Program", "Profil", "Publikasi Data", "Layanan", "Seputar DLH" }; Program
} <i class="w-4 h-4 ml-1 transition-transform group-hover:rotate-180" data-lucide="chevron-down"></i>
</button>
@for (int i = 0; i < menus.Length; i++)
{
<li class="relative group">
<button id="dropdown-button-@(i + 1)"
class="flex items-center justify-between py-2 text-gray-900 hover:text-orange-600 group">
<span>@menus[i]</span>
<i class="w-5 h-5 ml-1 transition-transform group-hover:rotate-180" data-lucide="chevron-down"></i>
</button>
</li>
}
</ul>
</div>
</div>
<!-- Mobile Drawer Overlay -->
<div id="mobile-overlay" class="fixed inset-0 bg-black bg-opacity-50 z-40 md:hidden hidden transition-opacity duration-300"></div>
<!-- Mobile Drawer -->
<div id="mobile-drawer" class="fixed top-0 right-0 h-full w-80 max-w-[85vw] bg-white shadow-xl transform translate-x-full transition-transform duration-300 ease-in-out z-50 md:hidden">
<div class="flex flex-col h-full">
<!-- Header -->
<div class="flex items-center justify-between p-4 border-b border-gray-200">
<div class="flex items-center space-x-2">
<img src="@Url.Content("~/logo-dlh.png")" class="h-8" alt="DLH Logo" />
<span class="text-lg font-bold text-gray-900">DLH Jakarta</span>
</div> </div>
<button id="mobile-drawer-close" class="p-2 rounded-lg hover:bg-gray-100 transition-colors duration-200">
<i class="w-6 h-6 text-gray-600" data-lucide="x"></i> <div class="relative group">
</button> <button id="dropdown-button-2"
</div> class="flex items-center text-gray-700 hover:text-orange-600 font-medium transition-colors duration-200">
Profil
<!-- Menu Content --> <i class="w-4 h-4 ml-1 transition-transform group-hover:rotate-180" data-lucide="chevron-down"></i>
<div class="flex-1 overflow-y-auto"> </button>
<div class="p-4 space-y-2">
<!-- Beranda -->
<a href="@Url.Action("Index", "Home")" class="flex items-center gap-3 p-3 rounded-lg hover:bg-orange-50 hover:text-orange-600 transition-colors duration-200">
<i class="w-5 h-5" data-lucide="home"></i>
<span class="font-medium">Beranda</span>
</a>
@* Mobile Menu Items *@
@{
var mobileMenus = new[] {
new { Name = "Program", Icon = "briefcase" },
new { Name = "Profil", Icon = "building" },
new { Name = "Publikasi Data", Icon = "database" },
new { Name = "Layanan", Icon = "star" },
new { Name = "Seputar DLH", Icon = "info" }
};
}
@for (int i = 0; i < mobileMenus.Length; i++)
{
<div class="mobile-menu-item">
<button class="mobile-dropdown-toggle flex items-center justify-between w-full p-3 rounded-lg hover:bg-orange-50 hover:text-orange-600 transition-colors duration-200" data-target="mobile-submenu-@(i + 1)">
<div class="flex items-center gap-3">
<i class="w-5 h-5" data-lucide="@mobileMenus[i].Icon"></i>
<span class="font-medium">@mobileMenus[i].Name</span>
</div>
<i class="w-5 h-5 transition-transform duration-200" data-lucide="chevron-down"></i>
</button>
<div id="mobile-submenu-@(i + 1)" class="hidden pl-8 pb-2 space-y-1">
@if (i == 0) // Program
{
<a href="@Url.Action("Udara", "Program")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Udara</a>
<a href="@Url.Action("Air", "Program")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Air</a>
<a href="@Url.Action("Sampah", "Program")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Sampah</a>
<a href="@Url.Action("LKIP", "Program")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">LKIP</a>
<a href="@Url.Action("Pengawasan", "Program")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Pengawasan</a>
<a href="@Url.Action("PerjanjianKinerja", "Program")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Perjanjian Kinerja</a>
<a href="@Url.Action("RencanaStrategis", "Program")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Rencana Strategis</a>
<a href="@Url.Action("Anggaran", "Program")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Anggaran</a>
}
else if (i == 1) // Profil
{
<a href="@Url.Action("Organisasi", "Profil")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Struktur Organisasi</a>
<a href="@Url.Action("Bidang", "Profil")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Bidang & UPT</a>
<a href="@Url.Action("Tupoksi", "Profil")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Tupoksi</a>
}
else if (i == 2) // Publikasi Data
{
<a href="@Url.Action("DIKPLHD", "Publikasi")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">DIKPLH</a>
<a href="@Url.Action("Peraturan", "Publikasi")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Peraturan</a>
<a href="@Url.Action("LaporanKualitasAir", "Publikasi")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Laporan Kualitas Air</a>
<a href="@Url.Action("LaporanKeuangan", "Publikasi")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Laporan Keuangan</a>
<a href="@Url.Action("Kajian", "Publikasi")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Kajian</a>
<a href="@Url.Action("KeanekaragamanHayati", "Publikasi")" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Keanekaragaman Hayati</a>
}
else if (i == 3) // Layanan
{
<a href="#" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">AMDAL</a>
<a href="#" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">PPID</a>
<a href="#" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Bulky Waste</a>
}
else if (i == 4) // Seputar DLH
{
<a href="#" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Berita</a>
<a href="#" class="block p-2 text-sm text-gray-600 hover:text-orange-600 hover:bg-orange-50 rounded transition-colors duration-200">Kontak Kami</a>
}
</div>
</div>
}
</div> </div>
</div>
<div class="relative group">
<!-- Footer --> <button id="dropdown-button-3"
<div class="p-4 border-t border-gray-200"> class="flex items-center text-gray-700 hover:text-orange-600 font-medium transition-colors duration-200">
<div class="text-center text-sm text-gray-500"> Publikasi Data
<p>&copy; @DateTime.Now.Year DLH DKI Jakarta</p> <i class="w-4 h-4 ml-1 transition-transform group-hover:rotate-180" data-lucide="chevron-down"></i>
</button>
</div>
<div class="relative group">
<button id="dropdown-button-4"
class="flex items-center text-gray-700 hover:text-orange-600 font-medium transition-colors duration-200">
Layanan
<i class="w-4 h-4 ml-1 transition-transform group-hover:rotate-180" data-lucide="chevron-down"></i>
</button>
</div>
<div class="relative group">
<button id="dropdown-button-5"
class="flex items-center text-gray-700 hover:text-orange-600 font-medium transition-colors duration-200">
Seputar DLH
<i class="w-4 h-4 ml-1 transition-transform group-hover:rotate-180" data-lucide="chevron-down"></i>
</button>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<partial name="~/Views/Shared/Partials/_MegaMenu.cshtml" />
</nav> </nav>
<!-- Mobile Bottom Navigation -->
<div class="md:hidden fixed bottom-0 left-0 right-0 z-50">
<!-- Bottom Navigation Bar -->
<div class="bg-white/95 backdrop-blur-xl border-t border-gray-200 shadow-2xl">
<div class="flex items-center justify-around py-2">
<a href="@Url.Action("Index", "Home")"
class="mobile-nav-item flex flex-col items-center py-2 px-3 rounded-xl transition-all duration-300 active:scale-95">
<div class="w-8 h-8 flex items-center justify-center rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 text-white shadow-lg">
<i class="w-5 h-5" data-lucide="home"></i>
</div>
<span class="text-xs font-medium text-gray-600 mt-1">Beranda</span>
</a>
<button id="mobile-program-btn"
class="mobile-nav-item flex flex-col items-center py-2 px-3 rounded-xl transition-all duration-300 active:scale-95">
<div class="w-8 h-8 flex items-center justify-center rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 text-white shadow-lg">
<i class="w-5 h-5" data-lucide="briefcase"></i>
</div>
<span class="text-xs font-medium text-gray-600 mt-1">Program</span>
</button>
<button id="mobile-profil-btn"
class="mobile-nav-item flex flex-col items-center py-2 px-3 rounded-xl transition-all duration-300 active:scale-95">
<div class="w-8 h-8 flex items-center justify-center rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 text-white shadow-lg">
<i class="w-5 h-5" data-lucide="building-2"></i>
</div>
<span class="text-xs font-medium text-gray-600 mt-1">Profil</span>
</button>
<button id="mobile-layanan-btn"
class="mobile-nav-item flex flex-col items-center py-2 px-3 rounded-xl transition-all duration-300 active:scale-95">
<div class="w-8 h-8 flex items-center justify-center rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 text-white shadow-lg">
<i class="w-5 h-5" data-lucide="headphones"></i>
</div>
<span class="text-xs font-medium text-gray-600 mt-1">Layanan</span>
</button>
<button id="mobile-menu-btn"
class="mobile-nav-item flex flex-col items-center py-2 px-3 rounded-xl transition-all duration-300 active:scale-95">
<div class="w-8 h-8 flex items-center justify-center rounded-lg bg-gradient-to-br from-orange-500 to-orange-600 text-white shadow-lg">
<i class="w-5 h-5" data-lucide="menu"></i>
</div>
<span class="text-xs font-medium text-gray-600 mt-1">Lainnya</span>
</button>
</div>
</div>
</div>
<!-- Mobile Modal Overlay -->
<div id="mobile-modal-overlay" class="md:hidden fixed inset-0 bg-black/50 backdrop-blur-sm z-40 hidden transition-all duration-300 opacity-0"></div>
<!-- Mobile Menu Modal -->
<div id="mobile-menu-modal" class="md:hidden fixed bottom-0 left-0 right-0 bg-white/95 backdrop-blur-xl rounded-t-3xl shadow-2xl transform translate-y-full transition-all duration-300 ease-out z-50 max-h-[80vh] overflow-hidden">
<div class="flex flex-col h-full">
<!-- Modal Header -->
<div class="flex items-center justify-between p-6 border-b border-gray-200/50">
<div class="flex items-center space-x-3">
<div class="w-10 h-10 rounded-xl bg-gradient-to-br from-orange-500 to-orange-600 flex items-center justify-center shadow-lg">
<i class="w-6 h-6 text-white" data-lucide="menu"></i>
</div>
<div>
<h3 class="text-lg font-bold text-gray-900">Menu</h3>
<p class="text-sm text-orange-600">Pilih menu navigasi</p>
</div>
</div>
<button id="mobile-modal-close" class="p-2 rounded-xl hover:bg-gray-100 transition-all duration-200 active:scale-95">
<i class="w-6 h-6 text-gray-600" data-lucide="x"></i>
</button>
</div>
<!-- Modal Content -->
<div id="mobile-modal-content" class="flex-1 overflow-y-auto p-6">
<!-- Content will be dynamically loaded here -->
</div>
</div>
</div>
<partial name="~/Views/Shared/Partials/_MegaMenu.cshtml" />
<style>
.mobile-nav-item:active {
transform: scale(0.95);
}
.mobile-nav-item:hover .w-8 {
transform: scale(1.1);
}
/* Safe area for devices with home indicator */
@@supports (padding-bottom: env(safe-area-inset-bottom)) {
.md\\:hidden.fixed.bottom-0 {
padding-bottom: env(safe-area-inset-bottom);
}
}
</style>
<script> <script>
document.addEventListener('DOMContentLoaded', function() { document.addEventListener('DOMContentLoaded', function() {
const mobileButton = document.getElementById('mobile-drawer-button'); // Mobile modal elements
const mobileDrawer = document.getElementById('mobile-drawer'); const mobileModalOverlay = document.getElementById('mobile-modal-overlay');
const mobileOverlay = document.getElementById('mobile-overlay'); const mobileMenuModal = document.getElementById('mobile-menu-modal');
const mobileClose = document.getElementById('mobile-drawer-close'); const mobileModalClose = document.getElementById('mobile-modal-close');
const menuIcon = document.getElementById('menu-icon'); const mobileModalContent = document.getElementById('mobile-modal-content');
function openDrawer() { // Mobile navigation buttons
mobileDrawer.classList.remove('translate-x-full'); const mobileProgramBtn = document.getElementById('mobile-program-btn');
mobileOverlay.classList.remove('hidden'); const mobileProfilBtn = document.getElementById('mobile-profil-btn');
const mobileLayananBtn = document.getElementById('mobile-layanan-btn');
const mobileMenuBtn = document.getElementById('mobile-menu-btn');
function showMobileModal(content, title) {
mobileModalContent.innerHTML = content;
mobileMenuModal.querySelector('h3').textContent = title;
mobileModalOverlay.classList.remove('hidden');
setTimeout(() => {
mobileModalOverlay.classList.remove('opacity-0');
mobileMenuModal.classList.remove('translate-y-full');
}, 10);
document.body.style.overflow = 'hidden'; document.body.style.overflow = 'hidden';
menuIcon.setAttribute('data-lucide', 'x');
lucide.createIcons();
} }
function closeDrawer() { function hideMobileModal() {
mobileDrawer.classList.add('translate-x-full'); mobileModalOverlay.classList.add('opacity-0');
mobileOverlay.classList.add('hidden'); mobileMenuModal.classList.add('translate-y-full');
setTimeout(() => {
mobileModalOverlay.classList.add('hidden');
}, 300);
document.body.style.overflow = ''; document.body.style.overflow = '';
menuIcon.setAttribute('data-lucide', 'menu');
lucide.createIcons();
} }
mobileButton.addEventListener('click', function() { // Event listeners for mobile buttons
if (mobileDrawer.classList.contains('translate-x-full')) { mobileProgramBtn.addEventListener('click', () => {
openDrawer(); showMobileModal(window.programMobileContent || "", 'Program');
} else { lucide.createIcons();
closeDrawer();
}
}); });
mobileClose.addEventListener('click', closeDrawer); mobileProfilBtn.addEventListener('click', () => {
mobileOverlay.addEventListener('click', closeDrawer); showMobileModal(window.profilMobileContent || "", 'Profil');
lucide.createIcons();
});
// Mobile dropdown toggles mobileLayananBtn.addEventListener('click', () => {
document.querySelectorAll('.mobile-dropdown-toggle').forEach(toggle => { showMobileModal(window.layananMobileContent || "", 'Layanan');
toggle.addEventListener('click', function() { lucide.createIcons();
const targetId = this.getAttribute('data-target'); });
const submenu = document.getElementById(targetId);
const chevron = this.querySelector('[data-lucide="chevron-down"]'); mobileMenuBtn.addEventListener('click', () => {
// Get publikasi data and seputar content from their respective mega menu files
if (submenu.classList.contains('hidden')) { const publikasiDataContent = window.publikasiDataMobileContent || "";
submenu.classList.remove('hidden'); const seputarContent = window.seputarMobileContent || "";
chevron.style.transform = 'rotate(180deg)';
} else { const allMenuContent = `
<div class="space-y-4">
<!-- Publikasi Data Section -->
<div class="border border-gray-200 rounded-xl overflow-hidden">
<button class="w-full flex items-center justify-between p-4 bg-gradient-to-r from-orange-50 to-orange-100 hover:from-orange-100 hover:to-orange-200 transition-all duration-300" onclick="toggleSubmenu('publikasi-submenu')">
<div class="flex items-center gap-3">
<i class="w-6 h-6 text-orange-600" data-lucide="database"></i>
<div class="text-left">
<span class="font-medium text-gray-900">Publikasi Data</span>
<p class="text-sm text-orange-600">Data dan informasi lingkungan hidup</p>
</div>
</div>
<i class="w-5 h-5 text-orange-600 transition-transform duration-300" data-lucide="chevron-down" id="publikasi-chevron"></i>
</button>
<div id="publikasi-submenu" class="hidden bg-white overflow-y-auto max-h-64">
${publikasiDataContent}
</div>
</div>
<!-- Seputar DLH Section -->
<div class="border border-gray-200 rounded-xl overflow-hidden">
<button class="w-full flex items-center justify-between p-4 bg-gradient-to-r from-orange-50 to-orange-100 hover:from-orange-100 hover:to-orange-200 transition-all duration-300" onclick="toggleSubmenu('seputar-submenu')">
<div class="flex items-center gap-3">
<i class="w-6 h-6 text-orange-600" data-lucide="info"></i>
<div class="text-left">
<span class="font-medium text-gray-900">Seputar DLH</span>
<p class="text-sm text-orange-600">Informasi dan kegiatan DLH</p>
</div>
</div>
<i class="w-5 h-5 text-orange-600 transition-transform duration-300" data-lucide="chevron-down" id="seputar-chevron"></i>
</button>
<div id="seputar-submenu" class="hidden bg-white">
${seputarContent}
</div>
</div>
</div>
`;
showMobileModal(allMenuContent, 'Menu Lainnya');
lucide.createIcons();
});
// Add global function for toggling submenus
window.toggleSubmenu = function(submenuId) {
const submenu = document.getElementById(submenuId);
const chevron = document.getElementById(submenuId.replace('-submenu', '-chevron'));
if (submenu.classList.contains('hidden')) {
submenu.classList.remove('hidden');
submenu.style.maxHeight = submenu.scrollHeight + 'px';
chevron.style.transform = 'rotate(180deg)';
} else {
submenu.style.maxHeight = '0px';
chevron.style.transform = 'rotate(0deg)';
setTimeout(() => {
submenu.classList.add('hidden'); submenu.classList.add('hidden');
chevron.style.transform = 'rotate(0deg)'; }, 300);
} }
}); };
// Close modal events
mobileModalClose.addEventListener('click', hideMobileModal);
mobileModalOverlay.addEventListener('click', hideMobileModal);
// Desktop dropdown functionality
const dropdownButtons = document.querySelectorAll('[id^="dropdown-button-"]');
const megaMenus = document.querySelectorAll('[id^="mega-menu-"]');
dropdownButtons.forEach((button, index) => {
const megaMenu = document.getElementById(`mega-menu-${index + 1}`);
if (megaMenu) {
button.addEventListener('mouseenter', () => {
megaMenus.forEach(menu => menu.classList.add('hidden'));
megaMenu.classList.remove('hidden');
});
button.addEventListener('mouseleave', () => {
setTimeout(() => {
if (!megaMenu.matches(':hover') && !button.matches(':hover')) {
megaMenu.classList.add('hidden');
}
}, 100);
});
megaMenu.addEventListener('mouseleave', () => {
megaMenu.classList.add('hidden');
});
}
});
});
</script>
<script>
mobileDataBtn.addEventListener('click', () => {
window.location.href = '/Publikasi/DIKPLHD';
});
mobileMenuBtn.addEventListener('click', () => {
showMobileModal(allMenuContent, 'Menu Lainnya');
lucide.createIcons();
});
// Close modal events
mobileModalClose.addEventListener('click', hideMobileModal);
mobileModalOverlay.addEventListener('click', hideMobileModal);
// Desktop dropdown functionality
const dropdownButtons = document.querySelectorAll('[id^="dropdown-button-"]');
const megaMenus = document.querySelectorAll('[id^="mega-menu-"]');
dropdownButtons.forEach((button, index) => {
const megaMenu = document.getElementById(`mega-menu-${index + 1}`);
if (megaMenu) {
button.addEventListener('mouseenter', () => {
megaMenus.forEach(menu => menu.classList.add('hidden'));
megaMenu.classList.remove('hidden');
});
button.addEventListener('mouseleave', () => {
setTimeout(() => {
if (!megaMenu.matches(':hover') && !button.matches(':hover')) {
megaMenu.classList.add('hidden');
}
}, 100);
});
megaMenu.addEventListener('mouseleave', () => {
megaMenu.classList.add('hidden');
});
}
}); });
}); });
</script> </script>

View File

@ -10,35 +10,3 @@
lucide.createIcons(); lucide.createIcons();
}); });
</script> </script>
<script type="module">
@* import { createChat } from 'https://cdn.jsdelivr.net/npm/@@n8n/chat/dist/chat.bundle.es.js'; *@
createChat({
webhookUrl: 'https://n8n.nurarif.in/webhook/f2129606-7716-415b-a83b-b9c0e84b752f/chat',
webhookConfig: {
method: 'POST',
headers: {}
},
target: '#n8n-chat',
mode: 'window',
chatInputKey: 'chatInput',
chatSessionKey: 'sessionId',
metadata: {},
showWelcomeScreen: false,
defaultLanguage: 'en',
initialMessages: [
'Hi there! 👋',
'My name is Nathan. How can I assist you today?'
],
i18n: {
en: {
title: 'Hi there! 👋',
subtitle: "Start a chat. We're here to help you 24/7.",
footer: '',
getStarted: 'New Conversation',
inputPlaceholder: 'Type your question..',
},
},
});
</script>

View File

@ -1,5 +1,4 @@
 <!DOCTYPE html>
<!DOCTYPE html>
<html lang="id"> <html lang="id">
@{ @{
@ -47,9 +46,11 @@
<link href="https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&family=Inter+Tight:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&family=Inter+Tight:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
<link rel="stylesheet" href="~/css/site.css" asp-append-version="true" /> <link rel="stylesheet" href="~/css/website.css" asp-append-version="true" />
<link rel="stylesheet" href="~/css/output.css" asp-append-version="true" /> <link rel="stylesheet" href="~/css/output.css" asp-append-version="true" />
<link rel="stylesheet" href="~/css/style.css" asp-append-version="true" /> <link rel="stylesheet" href="~/css/scroll-snap.css" />
@* <link rel="stylesheet" href="~/css/style.css" asp-append-version="true" /> *@
@await RenderSectionAsync("css", required: false) @await RenderSectionAsync("css", required: false)
<dynamic-section name="css" /> <dynamic-section name="css" />

Binary file not shown.

Binary file not shown.

Binary file not shown.

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

Binary file not shown.

View File

@ -13,7 +13,7 @@ using System.Reflection;
[assembly: System.Reflection.AssemblyCompanyAttribute("dlh-net")] [assembly: System.Reflection.AssemblyCompanyAttribute("dlh-net")]
[assembly: System.Reflection.AssemblyConfigurationAttribute("Debug")] [assembly: System.Reflection.AssemblyConfigurationAttribute("Debug")]
[assembly: System.Reflection.AssemblyFileVersionAttribute("1.0.0.0")] [assembly: System.Reflection.AssemblyFileVersionAttribute("1.0.0.0")]
[assembly: System.Reflection.AssemblyInformationalVersionAttribute("1.0.0+3fb481f1f9f26ba2171aabc0fdb596b6923e30dc")] [assembly: System.Reflection.AssemblyInformationalVersionAttribute("1.0.0+85e3530e9a465d74a88e1095efb105f83ce6daf3")]
[assembly: System.Reflection.AssemblyProductAttribute("dlh-net")] [assembly: System.Reflection.AssemblyProductAttribute("dlh-net")]
[assembly: System.Reflection.AssemblyTitleAttribute("dlh-net")] [assembly: System.Reflection.AssemblyTitleAttribute("dlh-net")]
[assembly: System.Reflection.AssemblyVersionAttribute("1.0.0.0")] [assembly: System.Reflection.AssemblyVersionAttribute("1.0.0.0")]

View File

@ -1 +1 @@
8b309c95af47ccef6d2a4591f3aa7b0fe15558ba0030b407144540a73245cb26 cf611b6f1aa9bd088def72a83e17da3e77d8a4198267ec3251f789ebbe307535

View File

@ -52,6 +52,10 @@ build_metadata.AdditionalFiles.CssScope =
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcQ29tcG9uZW50c1xIb21lXF9TbGlkZXJjb3AuY3NodG1s build_metadata.AdditionalFiles.TargetPath = Vmlld3NcQ29tcG9uZW50c1xIb21lXF9TbGlkZXJjb3AuY3NodG1s
build_metadata.AdditionalFiles.CssScope = build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Components/Home/_Slider_copy.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcQ29tcG9uZW50c1xIb21lXF9TbGlkZXJfY29weS5jc2h0bWw=
build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Components/Home/_Sosmed.cshtml] [C:/laragon/www/dlh-net/Views/Components/Home/_Sosmed.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcQ29tcG9uZW50c1xIb21lXF9Tb3NtZWQuY3NodG1s build_metadata.AdditionalFiles.TargetPath = Vmlld3NcQ29tcG9uZW50c1xIb21lXF9Tb3NtZWQuY3NodG1s
build_metadata.AdditionalFiles.CssScope = build_metadata.AdditionalFiles.CssScope =
@ -96,6 +100,10 @@ build_metadata.AdditionalFiles.CssScope =
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcTGF5YW5hblxQcGlkLmNzaHRtbA== build_metadata.AdditionalFiles.TargetPath = Vmlld3NcTGF5YW5hblxQcGlkLmNzaHRtbA==
build_metadata.AdditionalFiles.CssScope = build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Layanan/Whistleblowing.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcTGF5YW5hblxXaGlzdGxlYmxvd2luZy5jc2h0bWw=
build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Profil/Bidang.cshtml] [C:/laragon/www/dlh-net/Views/Profil/Bidang.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHJvZmlsXEJpZGFuZy5jc2h0bWw= build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHJvZmlsXEJpZGFuZy5jc2h0bWw=
build_metadata.AdditionalFiles.CssScope = build_metadata.AdditionalFiles.CssScope =
@ -144,6 +152,26 @@ build_metadata.AdditionalFiles.CssScope =
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHVibGlrYXNpXERpa3BsaGQuY3NodG1s build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHVibGlrYXNpXERpa3BsaGQuY3NodG1s
build_metadata.AdditionalFiles.CssScope = build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Publikasi/GasRumahKaca.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHVibGlrYXNpXEdhc1J1bWFoS2FjYS5jc2h0bWw=
build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Publikasi/IKLH.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHVibGlrYXNpXElLTEguY3NodG1s
build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Publikasi/Kajian.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHVibGlrYXNpXEthamlhbi5jc2h0bWw=
build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Publikasi/KeanekaragamanHayati.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHVibGlrYXNpXEtlYW5la2FyYWdhbWFuSGF5YXRpLmNzaHRtbA==
build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Publikasi/KLHS.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHVibGlrYXNpXEtMSFMuY3NodG1s
build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Publikasi/LaporanKeuangan.cshtml] [C:/laragon/www/dlh-net/Views/Publikasi/LaporanKeuangan.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHVibGlrYXNpXExhcG9yYW5LZXVhbmdhbi5jc2h0bWw= build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHVibGlrYXNpXExhcG9yYW5LZXVhbmdhbi5jc2h0bWw=
build_metadata.AdditionalFiles.CssScope = build_metadata.AdditionalFiles.CssScope =
@ -152,6 +180,14 @@ build_metadata.AdditionalFiles.CssScope =
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHVibGlrYXNpXExhcG9yYW5LdWFsaXRhc0Fpci5jc2h0bWw= build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHVibGlrYXNpXExhcG9yYW5LdWFsaXRhc0Fpci5jc2h0bWw=
build_metadata.AdditionalFiles.CssScope = build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Publikasi/LaporanKualitasUdara.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHVibGlrYXNpXExhcG9yYW5LdWFsaXRhc1VkYXJhLmNzaHRtbA==
build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Publikasi/MonitoringEmisi.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHVibGlrYXNpXE1vbml0b3JpbmdFbWlzaS5jc2h0bWw=
build_metadata.AdditionalFiles.CssScope =
[C:/laragon/www/dlh-net/Views/Publikasi/Peraturan.cshtml] [C:/laragon/www/dlh-net/Views/Publikasi/Peraturan.cshtml]
build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHVibGlrYXNpXFBlcmF0dXJhbi5jc2h0bWw= build_metadata.AdditionalFiles.TargetPath = Vmlld3NcUHVibGlrYXNpXFBlcmF0dXJhbi5jc2h0bWw=
build_metadata.AdditionalFiles.CssScope = build_metadata.AdditionalFiles.CssScope =

View File

@ -6416,7 +6416,6 @@ C:\laragon\www\dlh-net\bin\Debug\net9.0\publish\wwwroot\lib\lucide\package.json
C:\laragon\www\dlh-net\bin\Debug\net9.0\publish\wwwroot\lib\lucide\tags.json C:\laragon\www\dlh-net\bin\Debug\net9.0\publish\wwwroot\lib\lucide\tags.json
C:\laragon\www\dlh-net\bin\Debug\net9.0\publish\wwwroot\lib\lucide\tsconfig.json C:\laragon\www\dlh-net\bin\Debug\net9.0\publish\wwwroot\lib\lucide\tsconfig.json
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\whdzgwhwig-52k9nfb9i9.gz C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\whdzgwhwig-52k9nfb9i9.gz
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\1eirg8gji5-b8vwsgm4sc.gz
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\55sm932zpp-on0js6nvpu.gz C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\55sm932zpp-on0js6nvpu.gz
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\ug1ceg2arp-islyxa57bt.gz C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\ug1ceg2arp-islyxa57bt.gz
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\kui6q04f01-27plz38t4k.gz C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\kui6q04f01-27plz38t4k.gz
@ -6441,4 +6440,9 @@ C:\laragon\www\dlh-net\obj\Debug\net9.0\rjimswa.dswa.cache.json
C:\laragon\www\dlh-net\obj\Debug\net9.0\rjsmrazor.dswa.cache.json C:\laragon\www\dlh-net\obj\Debug\net9.0\rjsmrazor.dswa.cache.json
C:\laragon\www\dlh-net\obj\Debug\net9.0\rjsmcshtml.dswa.cache.json C:\laragon\www\dlh-net\obj\Debug\net9.0\rjsmcshtml.dswa.cache.json
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\s9158qcgwh-r8za1puz0v.gz C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\s9158qcgwh-r8za1puz0v.gz
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\hc40dw3fux-bsf4q98k6j.gz C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\d5dxynnpxs-x5f0iogtxy.gz
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\wj81mgrgzd-yt11h4ah29.gz
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\1eirg8gji5-6h6v874upz.gz
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\w8avq7peoa-a5oxcjr1hd.gz
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\hc40dw3fux-ajywtditkh.gz
C:\laragon\www\dlh-net\obj\Debug\net9.0\compressed\e2z0l6bcef-ki7a902c04.gz

Binary file not shown.

Binary file not shown.

File diff suppressed because one or more lines are too long

Binary file not shown.

Binary file not shown.

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1 +1 @@
Djyed7vo8rvxJS67tD6vxwI6uV46EF2UviSbLnoRQTc= 845ekAviybfgQfQgldHgn2fXbp9G2Bvyr8O8LTKgi9k=

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,103 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Layer_2" data-name="Layer 2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 3842.87 2694.32">
<defs>
<style>
.cls-1 {
fill: #38332d;
}
.cls-2 {
fill: #cbe1e6;
}
.cls-2, .cls-3, .cls-4 {
opacity: .3;
}
.cls-3 {
fill: #c3def0;
}
.cls-5 {
fill: none;
}
.cls-6 {
fill: #edc620;
opacity: .2;
}
.cls-7 {
fill: #bca28d;
}
.cls-4 {
fill: #c1dade;
}
.cls-8 {
fill: #318269;
}
.cls-9 {
fill: #968f88;
}
.cls-10 {
fill: #88817b;
}
.cls-11 {
clip-path: url(#clippath);
}
.cls-12 {
fill: #aa9481;
}
</style>
<clipPath id="clippath">
<rect class="cls-5" width="3842.87" height="2694.32"/>
</clipPath>
</defs>
<g id="Layer_3" data-name="Layer 3">
<g class="cls-11">
<g>
<polygon class="cls-8" points="2510.98 1791.14 2543.33 1794.08 2540.39 1744.08 2496.27 1667.62 2581.56 1714.67 2581.56 1773.49 2608.03 1761.73 2631.56 1761.73 2605.09 1785.26 2593.33 1799.96 2537.45 1811.73 2513.92 1814.67 2510.98 1791.14"/>
<path class="cls-8" d="M3012.91,1883.29s35.29-2.94,44.12,20.59c8.82,23.53,23.53,55.88,23.53,55.88l-8.82-82.35-5.88-23.53-32.35-5.88-11.77-17.65-61.76,8.82,35.29,17.64-17.64,17.65,8.82,11.76,26.47-2.94Z"/>
<path class="cls-8" d="M1720.6,1727.62s31.72-15.76,48.6,2.85c16.88,18.61,42.49,43.25,42.49,43.25l-38.59-73.28-14.15-19.7-32.24,6.47-17.45-12.06-54.15,30.99,54.42-3.12-51.47,35.29,39.01,1.8,23.51-12.5Z"/>
<polygon class="cls-8" points="2228.64 1919.56 2299.23 1969.56 2278.64 1996.03 2331.58 1993.09 2372.75 1984.27 2355.11 1966.62 2402.16 1943.09 2408.04 1910.74 2337.46 1960.74 2313.93 1943.09 2228.64 1919.56"/>
<polygon class="cls-8" points="3218.14 1455.93 3262.05 1503.67 3242.8 1519.85 3282.09 1526 3313.67 1525.99 3303.5 1510.28 3341.7 1500.41 3351.08 1477.61 3291.48 1503.2 3276.99 1486.57 3218.14 1455.93"/>
</g>
<g>
<polygon class="cls-8" points="1019.97 1835.51 1046.52 1837.93 1044.11 1796.89 1007.9 1734.13 1077.9 1772.75 1077.9 1821.03 1099.63 1811.37 1118.94 1811.37 1097.21 1830.68 1087.56 1842.75 1041.69 1852.41 1022.38 1854.82 1019.97 1835.51"/>
<path class="cls-8" d="M1431.94,1911.15s28.97-2.41,36.21,16.9c7.24,19.31,19.31,45.87,19.31,45.87l-7.24-67.59-4.83-19.31-26.55-4.83-9.66-14.48-50.69,7.24,28.97,14.48-14.48,14.48,7.24,9.66,21.72-2.42Z"/>
<path class="cls-8" d="M371.24,1783.38s26.03-12.93,39.89,2.34c13.86,15.28,34.87,35.5,34.87,35.5l-31.67-60.15-11.61-16.17-26.46,5.31-14.32-9.9-44.44,25.44,44.67-2.56-42.24,28.97,32.02,1.47,19.3-10.26Z"/>
<polygon class="cls-8" points="788.23 1940.92 846.17 1981.96 829.27 2003.68 872.72 2001.27 906.51 1994.03 892.03 1979.54 930.65 1960.23 935.48 1933.68 877.55 1974.71 858.24 1960.23 788.23 1940.92"/>
<polygon class="cls-8" points="1600.38 1560.38 1636.43 1599.57 1620.63 1612.85 1652.87 1617.89 1678.79 1617.89 1670.44 1604.99 1701.79 1596.89 1709.5 1578.18 1660.58 1599.18 1648.69 1585.53 1600.38 1560.38"/>
</g>
<circle class="cls-6" cx="1794.11" cy="1098.36" r="751.39"/>
<path class="cls-3" d="M2730.19,777.81l43.59-41.8,113.99-16.26,26.82-23.22s63.7-39.48,107.29-48.77c43.59-9.29,97.23-16.26,97.23-16.26l20.12,32.51s43.59-32.51,60.35-11.61c16.76,20.9-3.35,41.8-3.35,41.8l30.17,9.29s-3.35,9.29,23.47,9.29,90.52-6.97,90.52-6.97c0,0-30.17,39.48-20.12,39.48s-211.22,30.19-211.22,30.19c0,0-50.29-9.29-73.76,0-23.47,9.29-67.06-23.22-77.11-23.22s-53.64-13.93-77.11,0-150.88,25.55-150.88,25.55Z"/>
<path class="cls-3" d="M3434.28,1091.33l46.94-16.26,46.94-2.32,46.94,2.32s36.88,2.32,23.47,13.93c-13.41,11.61-46.94,23.22-83.82,23.22s-93.88-9.29-93.88-9.29l13.41-11.61Z"/>
<path class="cls-3" d="M2146.44,904.39c15.7,4.08,113.99,0,113.99,0,0,0,16.76,25.55,26.82,25.55s53.64,11.61,63.7,13.93c10.06,2.32,3.35,16.26,20.12,16.26s46.94-16.26,36.88-23.22-53.64-44.12-53.64-44.12c0,0,67.06-20.9,73.76,0,6.71,20.9,10.06,34.84,20.12,34.84s83.82-11.61,107.29-11.61h90.52l43.59-44.12,83.82-20.9h57l-77.11,23.22s-33.53,9.29-30.17,23.22c3.35,13.93,134.11-4.64,134.11-4.64l60.35-41.8-20.12,37.16s60.35-4.64,103.94-9.29c43.59-4.64,251.46-4.64,251.46-4.64,0,0-305.1,39.48-315.16,41.8-10.06,2.32-103.94,20.9-120.7,25.55-16.76,4.64-40.23,27.87-50.29,37.16-10.06,9.29-60.35,20.9-70.41,18.58-10.06-2.32-181.05-20.9-234.69-20.9h-177.7s-93.88,0-117.35-2.32c-23.47-2.32-90.52-18.58-90.52-18.58,0,0-10.06-71.99,70.41-51.09Z"/>
<path class="cls-3" d="M311.65,1127.22h306.14c14.81,0,138.26-15.73,138.26-15.73l79-11.79s19.75,3.93,44.44,3.93,103.69-27.52,103.69-27.52c0,0,74.07-11.79,79-23.59,4.94-11.79,39.5-47.18,49.38-58.97,9.88-11.79,29.63-70.77,49.38-55.04,19.75,15.73,44.44,15.73,59.25,39.31,14.81,23.59-4.94,66.83-4.94,66.83l-39.5,43.25,74.07,3.93,49.38-7.86,123.44-23.59,39.5,19.66,59.25,23.59-14.81-51.11s-19.75-23.59,0-31.45c19.75-7.86,98.75-19.66,98.75-19.66,0,0,44.44,3.93,64.19,3.93s59.25-15.73,59.25-15.73l-29.63-31.45s-24.69-70.77,14.81-58.97c39.5,11.79,98.76,3.93,118.51,15.73,19.75,11.79,49.38,39.31,54.32,51.11,4.94,11.79,34.56,0,39.5,19.66s-143.19,31.45-162.95,31.45,79,62.9,79,62.9l-34.56,43.25s-49.38,3.93-14.81,19.66c34.56,15.73,167.88,51.11,167.88,51.11,0,0,44.44,19.66,74.07,19.66,10.86,0,34.33,1.06,59.71,2.4,43.84,2.31,93.36,5.47,93.36,5.47,0,0,108.63-19.66,123.44-19.66s34.56,47.18,34.56,47.18c0,0-64.19,15.73-79,11.79-14.81-3.93-192.57-3.93-192.57-3.93h-69.13l9.88,23.59s-93.82,31.45-128.38,31.45-143.19-11.79-162.95-15.73c-19.75-3.93-98.76,0-133.32,0h-311.08c-19.75,0-123.44-11.79-158.01-19.66-34.56-7.86-64.19-35.38-172.82-47.18-108.63-11.79-276.51-11.79-276.51-11.79,0,0-256.76-23.59-276.51-23.59s-83.94,3.93-83.94-7.86-93.82-47.18-93.82-47.18l93.82-11.79Z"/>
<path class="cls-4" d="M1680.4,680.74s-106.41,26.07-130.97,19.55c-24.56-6.51-319.24-6.51-319.24-6.51h-114.6l16.37,39.1s-155.52,52.14-212.82,52.14-237.38-19.55-270.13-26.07c-32.74-6.52-163.71,0-221.01,0H.4v-362.52l149.29-28.52,65.49,32.59,98.22,39.1-24.55-84.73s-32.75-39.1,0-52.13c32.74-13.04,163.71-32.59,163.71-32.59,0,0,73.67,6.52,106.41,6.52s98.23-26.07,98.23-26.07l-49.12-52.14s-40.92-117.32,24.56-97.76c65.49,19.55,163.71,6.51,196.46,26.07,32.74,19.55,81.85,65.17,90.04,84.72,8.18,19.55,57.3,0,65.48,32.59,8.19,32.59-237.38,52.14-270.12,52.14s130.97,104.28,130.97,104.28l-57.3,71.69s-81.86,6.51-24.56,32.58c57.3,26.07,278.31,84.73,278.31,84.73,0,0,73.67,32.59,122.79,32.59,18,0,56.91,1.75,98.98,3.97,72.67,3.83,154.77,9.06,154.77,9.06,0,0,180.08-32.59,204.64-32.59s57.3,78.21,57.3,78.21Z"/>
<path class="cls-2" d="M3842.47,1080.1v280.77c-32.18-10.77-73.87-21.06-131.54-27.88-151.33-17.9-385.2-17.9-385.2-17.9,0,0-357.7-35.79-385.21-35.79s-116.93,5.97-116.93-11.94-130.7-71.58-130.7-71.58l130.7-17.9h426.47c20.64,0,192.6-23.86,192.6-23.86l110.06-17.9s27.51,5.97,61.91,5.97,144.45-41.76,144.45-41.76c0,0,50.7-8.8,83.39-20.22Z"/>
<path class="cls-7" d="M2118.56,1563.48c-.39.72-.85,1.37-1.31,2.09-9.98,15.85-27.99,31.84-27.99,31.84,0,0-10.9,13.31-40.91,37.91,0,0-.26.26-.85.72-.06.05-.12.1-.19.16-.69.56-1.4,1.13-2.11,1.71-.16.13-.33.26-.5.39-10.54,8.48-23.25,18.25-38.46,29.26-.28.21-.43.32-.43.32-2.55,1.82-5.22,3.72-7.9,5.61-21.2,15.01-65.37,40.06-91.34,58.72-116.41,83.58-261.97,182.11-426.27,311.04-131.14,102.89-278.28,212.44-395.85,326.24-17.23,16.67-35.06,34.08-53.43,52.17-89.35,87.98-191.41,192.04-298.66,305.29-7.07,7.46-14.16,14.97-21.27,22.51-53.38,56.62-107.91,115.38-162.68,175.45-14.88,16.32-29.77,32.73-44.67,49.23-164.1,181.72-324.14,368.82-442.24,509.36v-572.09c303.59-292.09,930.39-860.93,1590.6-1256.19,24.79-14.88,49.65-29.56,74.58-43.85,2.02-1.17,4.04-2.35,6-3.52,4.97-2.98,9.63-5.9,14.09-8.8l.32-.21c5.85-3.81,11.35-7.57,16.71-11.35l.2-.13c18.66-13.11,35.76-26.36,60.22-41.63,18.66-11.68,33.28-19.7,51.35-29.36l242.95,47.1h.04Z"/>
<path class="cls-1" d="M2167.56,1514.74l-39.21,40.91s-27.8,22.12-9.79,7.83c0,0-353.71,25.84-391.88,47.89l-62.05-12.79-280.04-57.74,123.97-156.59,466.13,92.33,192.87,38.17Z"/>
<polygon class="cls-7" points="1495.51 1332.05 2155.6 1439.71 2167.56 1514.74 1508.56 1384.25 1384.58 1540.84 1371.54 1488.64 1495.51 1332.05"/>
<path class="cls-10" d="M2704.74,717.61l-5.42-8.68,1.11-4.37-4.37-14.09s-11.94,3.26-16.31,4.31c-4.37,1.11-2.15-6.52-2.15-6.52,0,0,0-5.42-1.11-8.68-1.11-3.26-11.94,0-11.94,0,0,0-38.1,18.47-47.89,21.73-8.03,2.68-18.27,4.63-23.49,5.87-1.11.26-2.02.46-2.61.65-3.26,1.11-30.41,7.63-30.41,7.63,0,0-27.21,10.9-30.47,13.05s-31.51,9.79-31.51,9.79l-14.16,14.16s-33.73,6.52-40.26,9.79-26.1,16.31-26.1,16.31c0,0-23.88,10.83-40.19,14.09-16.31,3.26-32.62,14.16-32.62,14.16,0,0-25.05,18.47-31.58,22.84s-24.99,3.26-34.78,3.26-24.99,15.2-29.36,18.47c-4.37,3.26-18.47,4.37-18.47,4.37l-30.47-3.26-6.52-21.73-32.62-18.53s-34.78-16.31-78.3-20.62c-30.14-3-39.93,12.72-43.06,22.71-1.44,4.44-1.5,7.7-1.5,7.7l-38.1-2.15-2.15,27.21-.65-.2-37.52-13.18-5.35-1.89s-16.05-4.76-38.43-8.09c-12.79-1.96-27.66-3.46-42.87-3.39-12.14.07-24.53,1.17-36.15,3.91-51.09,11.94-49.98,48.94-49.98,48.94,0,0-.65-.2-1.83-.39h-.07c-3-.65-9.26-1.83-15.53-1.83-8.68,0-26.1-4.31-37-6.52-10.83-2.15-40.19-11.94-47.83-16.31-5.74-3.2-24.14-8.94-39.93-16.12-5.29-2.41-10.31-5.02-14.42-7.76-16.31-10.9-78.3-7.63-78.3-7.63,0,0,15.2,17.42,17.36,20.68,1.04,1.5,6.26,8.42,11.55,15.92,6.13,8.61,12.4,18.07,12.4,21.01,0,5.48-6.52,19.57-6.52,19.57l-21.73,17.42,4.31,23.95,56.57,7.57,144.65,5.48,12.98-30.27c-.26,1.63-2.15,13.7-2.15,24.79,0,12.01,8.74,32.62,8.74,32.62h-31.58l-76.08,12.01-39.15,19.57s-103.35,45.67-106.61,46.72c-3.26,1.11-14.09,0-20.62,0s-12.01,3.26-22.84,6.52c-10.9,3.26-16.31,4.37-25.05,4.37s-16.31,2.15-16.31,2.15c0,0-15.2,2.22-20.62,1.11-5.48-1.11-15.27,2.15-15.27,2.15l-3.26,12.01,8.74,1.04h20.62c7.63,0,7.63,10.9,7.63,10.9l-9.79,5.42h-18.47l-13.05,1.11v11.94h15.2c4.37,0,21.73,1.11,21.73,1.11l-7.57,8.68-17.42,2.22-11.94,5.42,1.04,13.05,8.74,4.37s11.94,0,15.2-1.11,15.2-11.94,15.2-11.94l17.42-1.11,2.15,5.42-9.79,8.74s-18.47,8.68-21.73,9.79c-3.26,1.04-16.31,1.04-16.31,1.04l1.11,14.16,19.57-1.11,53.24-21.73,15.27-5.42,5.42,6.52,4.37,19.57-15.27,9.79,1.37,5.42,1.89,7.63,14.16-2.22,14.16-4.31,6.52-10.9,23.36-70.14,9.79-8.16,32.62-11.42,40.78-9.79,65.25-13.05,107.66-8.16,2.74,1.04,10.31,3.85s-14.68,16.31-21.21,19.57c-2.28,1.11-6.98,3.26-12.59,6.59-10.37,6.07-24.01,16.05-31.45,30.93-11.42,22.84,1.63,40.78,1.63,40.78l-14.68,21.21-19.38.98-13.25.65s-2.28,0-6.39.33c-5.81.46-15.4,1.57-27.08,4.37-12.98,3-28.64,8.09-44.83,16.51-16.31,8.48-25.58,16.96-31.45,24.21-8.81,10.83-9.98,18.86-15.86,19.84-5.74.98-20.55,13.18-31.71,23.1-7.9,6.98-13.96,12.79-13.96,12.79,0,0-19.57,4.89-29.36,8.16-4.57,1.5-22.31,11.22-39.93,21.14-20.1,11.29-40,22.9-40,22.9l-3.98,26.95-4.18,28.51c-7.05,4.89-4.89,23.36-4.89,23.36l65.25-80.45s.65.13,1.89.33c.39.07.78.13,1.31.2l137.09,24.47,8.68-11.94s4.37-14.16,3.26-17.42c-1.04-3.26-39.15-14.09-39.15-14.09l22.84-4.37,169.64-48.94,4.37,14.16s10.9,6.52,15.2,13.05c4.37,6.52,26.1,30.41,26.1,30.41,0,0,47.89,44.63,54.42,50.04,6.52,5.42,8.68,13.05,8.68,13.05l-22.84,15.2,210.95,34.84s-7.57-23.95-9.79-31.58c-2.15-7.57-6.52-14.09-20.62-19.57-14.16-5.42-19.57-35.89-22.84-38.04s-46.78-28.25-58.72-39.15c-12.01-10.9-71.77-70.66-71.77-70.66,0,0-6-3-5.55-11.88,0-.39,0-.78.07-1.17,1.11-9.79,10.9-15.27,14.16-18.53s18.47-23.88,18.47-28.25c0-2.35.91-11.09,1.83-18.53.33-2.41.59-4.7.78-6.59.39-3.2.65-5.35.65-5.35l3.85-1.17,7.05-2.09,17.42-3.26,26.1-7.57h29.36l27.14-21.79,16.31-4.31s51.15-28.32,58.72-37c7.63-8.68,8.74-34.78,9.79-41.3,1.11-6.52,14.16-23.95,14.16-23.95l11.94-13.05s1.11-11.94,14.16-15.2c13.05-3.26,48.94-6.52,53.31-9.79,4.31-3.26,47.83-28.32,47.83-28.32l57.61-31.51s51.15-21.73,56.57-24.99c5.42-3.26,23.95-9.79,34.78-19.57,10.9-9.79,30.47-28.32,39.15-41.37,8.74-13.05,44.63-26.1,52.2-31.51,7.63-5.42,12.01,1.11,15.27,4.37s8.68,7.57,14.09,9.79c5.48,2.15,25.05,13.05,25.05,13.05,0,0,11.94,13.05,23.88,16.31,12.01,3.26,16.31-4.37,16.31-4.37l-8.68-16.31-20.68-8.68-2.15-13.05,6.52-8.74,16.31-2.15s54.35-19.57,58.72-20.68c4.37-1.04,27.21-5.42,27.21-5.42,0,0,5.42-4.37,4.31-10.9l-7.57-11.94h11.94l2.15-7.63ZM1696.66,916.61c-22.84-3.26-61.99-6.52-68.51-3.26-6.52,3.26-31.51,7.63-31.51,7.63l5.42-6.52s10.9-15.2,26.1-16.31c15.27-1.11,13.05-15.2,35.89-6.52,22.84,8.68,33.73,17.42,38.1,18.47,4.31,1.11,17.36,9.79-5.48,6.52ZM1813.07,930.77s1.04-59.83,5.42-71.77c4.37-11.94,18.47-21.73,30.47-29.36,11.94-7.63,33.67,5.42,11.94,15.2-21.73,9.79-47.83,85.93-47.83,85.93ZM1977.23,907.94c-22.84-13.05-42.41-16.31-58.72-13.05-16.31,3.26-29.36,6.52-29.36,6.52,0,0,7.63,15.2,22.84,16.31,15.27,1.11,30.47-1.11,35.89,4.37,5.48,5.42,9.79,10.83,5.48,11.94-4.37,1.11-33.73-3.26-47.89,2.15-14.09,5.48-18.47,9.79-26.1,16.31-7.57,6.52-15.2,14.16-19.57,10.9-4.31-3.26-3.26-40.26-2.15-44.56,1.11-4.37,3.26-6.52,11.94-10.9,8.74-4.37,4.37-22.84,0-24.99-4.31-2.22-17.36-4.37-17.36-4.37,0,0,11.94-39.15,47.83-27.21,35.89,12.01,59.83,18.53,70.66,26.1,10.9,7.63,33.73,26.1,40.26,27.21,6.52,1.11-10.9,16.31-33.73,3.26Z"/>
<path class="cls-9" d="M2593.17,707.17c-2.81,4.96-4.76,8.29-4.76,8.29,0,0-16.31,4.89-21.21,6.52-4.89,1.63-17.94,8.16-22.84,9.79-4.89,1.63-19.57,6.52-19.57,6.52,0,0-26.1,17.94-32.62,21.21-6.52,3.26-21.21,11.42-30.99,17.94-9.79,6.52-26.1,4.89-26.1,4.89l-22.84,14.68s-26.1,1.63-37.52,4.89c-11.42,3.26-22.84,21.21-32.62,29.36-9.79,8.16-17.94,14.68-26.1,21.21-8.16,6.52-29.36,11.42-32.62,16.31s-1.63,48.94-1.63,48.94c0,0-11.42-3.26-24.47-13.05-13.05-9.79-52.2-27.73-61.99-32.62-9.79-4.89-45.67,9.79-45.67,9.79,0,0-13.05,11.42-21.21,21.21-8.16,9.79,3.26,16.31,3.26,22.84s29.36,30.99,34.26,34.25c4.89,3.26-13.05,11.42-17.94,9.79s-40.78-14.68-40.78-14.68l-30.99,1.63s-9.79,29.36-11.42,42.41c-1.63,13.05-17.94,3.26-27.73-1.63-9.79-4.89-24.47,9.79-34.26,26.1-9.79,16.31-13.05,35.89-13.05,35.89,0,0-29.36-16.31-35.89-13.05-6.52,3.26-6.52,35.89-6.52,35.89,0,0,4.89,27.73,8.16,37.52,1.76,5.22-2.61,13.77-7.05,20.55-1.57,2.54-3.2,4.76-4.5,6.52-1.83,2.41-3.13,3.91-3.13,3.91l-37.52-47.3,1.63-9.79s-6.52-16.31-14.68-27.73c-8.16-11.42-11.42-26.1-11.42-26.1,0,0,16.31,0,17.94-6.52,1.63-6.52,4.89-19.57,11.42-26.1s30.99-4.89,29.36,6.52c-1.63,11.42,6.52,21.21,17.94,9.79,11.42-11.42,9.79-30.99,16.31-42.41,6.52-11.42,35.89-29.36,35.89-29.36l13.05,22.84s6.52-17.94,16.31-29.36c9.79-11.42,17.94-6.52,19.57-16.31,1.63-9.79,4.89-24.47,4.89-24.47,0,0-42.41-24.47-60.35-45.67-17.94-21.21-89.72-26.1-89.72-26.1,0,0-57.87-9.92-38.37-12.59,1.44-.2,3.33-.33,5.74-.46,9.72-.46,23.1,1.17,37.13,3.85,14.88,2.67,30.6,6.52,43.78,9.98,18.2,4.83,31.64,9,31.64,9l5.87,4.18,65.9,46.39s14.68,6.52,24.47,6.52,17.94-6.52,22.84-16.31c4.89-9.79,9.79-16.31,8.16-29.36-1.63-13.05-13.05-24.47-16.31-34.26-2.41-7.18-41.95-6.46-62.64-5.55,3.13-9.98,12.92-25.71,43.06-22.71,43.52,4.31,78.3,20.62,78.3,20.62l32.62,18.53,6.52,21.73,30.47,3.26s14.09-1.11,18.47-4.37c4.37-3.26,19.57-18.47,29.36-18.47s28.25,1.11,34.78-3.26,31.58-22.84,31.58-22.84c0,0,16.31-10.9,32.62-14.16,16.31-3.26,40.19-14.09,40.19-14.09,0,0,19.57-13.05,26.1-16.31s40.26-9.79,40.26-9.79l14.16-14.16s28.25-7.63,31.51-9.79,30.47-13.05,30.47-13.05c0,0,27.14-6.52,30.41-7.63.59-.2,1.5-.39,2.61-.65Z"/>
<path class="cls-9" d="M1854.37,1098.79l11.42-27.73s-14.68-3.26-19.57,4.89c-4.89,8.16-26.1,27.73-26.1,27.73l-19.12-17.88c5.61-3.33,10.31-5.48,12.59-6.59,6.52-3.26,21.21-19.57,21.21-19.57l-10.31-3.85,15.2-4.31,26.1-4.89s24.47,32.62,27.73,48.94l-39.15,3.26Z"/>
<path class="cls-9" d="M1935.93,1177.08c0,4.37-9.79,20.1-13.05,23.36s-13.05,8.74-14.16,18.53c-.07.39-.07.78-.07,1.17-6.72,2.48-11.88,4.24-11.88,4.24h-71.77c-11.42,0-29.36-6.52-39.15-9.79-9.79-3.26-24.47,14.68-29.36,14.68s-11.42-14.68-13.05-22.84c-1.44-7.05-5.28-22.71-6.33-26.75-.13-.65-.2-.98-.2-.98h19.57l14.68-21.21,13.05-3.26s34.26-27.73,39.15-32.62c4.89-4.89,48.94-13.05,48.94-13.05,0,0,12.56-4.32,22.84,4.89,20.45,18.33,40.78,62.05,40.78,63.62Z"/>
<path class="cls-9" d="M1914.72,1257.01s-21.21-29.36-26.1-13.05c-4.89,16.31-16.31,14.68,0,24.47,16.31,9.79,52.2,45.67,61.99,52.2,9.79,6.52,29.36,26.1,39.15,34.26,9.79,8.16,19.57,17.94,11.42,17.94s-89.72,1.63-89.72,1.63l-24.47,21.73,172.91,22.31-32.62-42.41-19.57-26.1s-30.99-37.52-37.52-42.41c-6.52-4.89-55.46-50.57-55.46-50.57Z"/>
<path class="cls-9" d="M1608.06,1341.83c2.94,7.31-90.69-6.46-109.36-9.27-.52-.07-.91-.13-1.31-.2-1.24-.2-1.89-.33-1.89-.33l-24.47,29.36h-11.42l-20.29-.78,3.98-26.95s19.9-11.61,40-22.9l.78,11.48s32.62-16.31,39.15-16.31,40.78,1.63,40.78,1.63l30.99,9.79,13.05,24.47Z"/>
<path class="cls-9" d="M1803.8,996.02s-58.72-4.89-75.03-4.89-40.78,4.89-40.78,4.89c0,0-81.56,35.89-88.08,39.15-6.52,3.26-50.57,4.89-52.2,21.21-1.63,16.31,4.89,22.84,4.89,22.84l8.16,19.57-4.89,16.31-14.68-22.84-13.05-14.68-29.36-8.16s-17.94,6.52-13.05,9.79,16.31,21.21,21.21,24.47c4.89,3.26,14.68,14.68,14.68,14.68l-9.79,16.31,13.05,9.79,6.52,19.57-1.63,13.05-22.84,8.16h-1.37l-1.37-5.42,15.27-9.79-4.37-19.57-5.42-6.52-15.27,5.42-53.24,21.73-19.57,1.11-1.11-14.16s13.05,0,16.31-1.04c3.26-1.11,21.73-9.79,21.73-9.79l9.79-8.74-2.15-5.42-17.42,1.11s-11.94,10.83-15.2,11.94-15.2,1.11-15.2,1.11l-8.74-4.37-1.04-13.05,11.94-5.42,17.42-2.22,7.57-8.68s-17.36-1.11-21.73-1.11h-15.2v-11.94l13.05-1.11h18.47l9.79-5.42s0-10.9-7.63-10.9h-20.62l-8.74-1.04,3.26-12.01s9.79-3.26,15.27-2.15c5.42,1.11,20.62-1.11,20.62-1.11,0,0,7.63-2.15,16.31-2.15s14.16-1.11,25.05-4.37c10.83-3.26,16.31-6.52,22.84-6.52s17.36,1.11,20.62,0c3.26-1.04,106.61-46.72,106.61-46.72l39.15-19.57,76.08-12.01h31.58l13.57,20.68Z"/>
<path class="cls-9" d="M1722.24,1235.81c-19.57,4.89-76.67,21.21-94.61,22.84-12.01,1.11-39.41,6.59-61.07,10.05,11.16-9.92,25.97-22.12,31.71-23.1,5.87-.98,7.05-9,15.86-19.84,28.64-3.85,72.36-9.53,82.02-9.53,14.68,0,16.31-16.31,9.79-21.21-2.81-2.09-9.46-6-15.53-9.98,11.68-2.81,21.27-3.91,27.08-4.37,1.44,3,2.87,5.87,4.76,7.83,4.89,4.89,14.68,8.16,14.68,17.94s4.89,24.47-14.68,29.36Z"/>
<polygon class="cls-12" points="1495.51 1340.75 1508.56 1384.25 1384.58 1540.84 1371.54 1488.64 1495.51 1340.75"/>
<path class="cls-1" d="M2047.31,1636.2c-.07.07-.15.13-.24.21-4.16,3.69-18.39,15.97-38,32.19-27.01,22.44-244.59,178.85-332.5,249.05-210.43,168.01-394.29,339.48-507.3,445.31-16.78,15.71-38.46,37-64.19,62.92-123.97,124.91-341.99,357.41-559.71,592.23-178.96,193.02-357.72,387.61-483.87,525.31v-59.92c118.1-140.54,278.14-327.64,442.24-509.36,14.9-16.5,29.79-32.91,44.67-49.23,54.77-60.07,109.3-118.83,162.68-175.45,7.11-7.54,14.2-15.05,21.27-22.51,107.25-113.25,209.31-217.31,298.66-305.29,18.37-18.09,36.2-35.5,53.43-52.17,117.57-113.8,264.71-223.35,395.85-326.24,164.3-128.93,309.86-227.46,426.27-311.04,25.97-18.66,70.14-43.71,91.34-58.72,2.68-1.89,5.35-3.79,7.9-5.61,0,0,.15-.11.43-.32,15.21-11.01,27.92-20.78,38.46-29.26.17-.13.34-.26.5-.39.71-.58,1.42-1.15,2.11-1.71Z"/>
<path class="cls-12" d="M2117.25,1565.57c-9.98,15.86-27.99,31.84-27.99,31.84,0,0-10.9,13.31-40.91,37.91,0,0-.26.26-.85.72-3.52,3.13-41.69,31.84-41.69,31.84l-275.41-57.71,33.41-22.67.2-.13,111.57-70.99,236.52,47.3,5.15,1.89Z"/>
<path class="cls-9" d="M1644.79,831.99l-.85,20.49-21.21,8.16-41.76-7.44c-5.29-7.5-10.5-14.42-11.55-15.92-2.15-3.26-17.36-20.68-17.36-20.68,0,0,61.99-3.26,78.3,7.63,4.11,2.74,9.13,5.35,14.42,7.76Z"/>
<path class="cls-9" d="M1794.01,893.26l-13.05,14.68s-11.42-4.89-16.31-8.16c-4.89-3.26-32.1-35.36-32.1-35.36,10.9,2.22,28.32,6.52,37,6.52,6.26,0,12.53,1.17,15.53,1.83h.07l8.87,20.49Z"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 19 KiB

494
wwwroot/chatbot.svg 100644
View File

@ -0,0 +1,494 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Layer_2" data-name="Layer 2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 619.39 674.02">
<defs>
<style>
.cls-1 {
fill: url(#linear-gradient-15);
}
.cls-2 {
fill: url(#linear-gradient-13);
}
.cls-3 {
fill: url(#linear-gradient-2);
}
.cls-4 {
fill: #1b5317;
}
.cls-5 {
fill: url(#linear-gradient-10);
}
.cls-6 {
fill: url(#linear-gradient-12);
}
.cls-7 {
fill: #cb493c;
}
.cls-8 {
fill: #a2e584;
}
.cls-9 {
fill: #46a519;
}
.cls-10 {
fill: #479446;
}
.cls-11 {
fill: #fff;
}
.cls-12 {
fill: #4d9223;
}
.cls-13 {
fill: url(#linear-gradient-4);
}
.cls-14 {
fill: #96a8a7;
}
.cls-15 {
fill: #103034;
}
.cls-16 {
fill: url(#linear-gradient-3);
}
.cls-17 {
fill: url(#linear-gradient-5);
}
.cls-18 {
fill: url(#linear-gradient-22);
}
.cls-19 {
fill: url(#linear-gradient-8);
}
.cls-20 {
fill: #3f1422;
}
.cls-21 {
fill: #9bd23e;
}
.cls-22 {
fill: #2c7531;
}
.cls-23 {
fill: url(#linear-gradient-14);
}
.cls-24 {
fill: #cfea77;
}
.cls-25 {
fill: url(#linear-gradient-20);
}
.cls-26 {
fill: #728685;
}
.cls-27 {
fill: url(#linear-gradient-17);
}
.cls-28 {
fill: url(#linear-gradient-7);
}
.cls-29 {
fill: url(#linear-gradient-9);
}
.cls-30 {
fill: #06240b;
}
.cls-31 {
fill: url(#linear-gradient-11);
}
.cls-32 {
fill: url(#linear-gradient-19);
}
.cls-33 {
fill: #80af45;
}
.cls-34 {
fill: url(#linear-gradient-6);
}
.cls-35 {
fill: #fd705c;
}
.cls-36 {
fill: url(#linear-gradient-21);
}
.cls-37 {
fill: #e16d2b;
}
.cls-38 {
fill: #051f1b;
}
.cls-39 {
fill: #40a511;
}
.cls-40 {
fill: #a9b9b8;
}
.cls-41 {
fill: #fefefe;
}
.cls-42 {
fill: url(#linear-gradient-16);
}
.cls-43 {
fill: #e2f597;
}
.cls-44 {
fill: url(#linear-gradient);
}
.cls-45 {
fill: #385355;
}
.cls-46 {
fill: url(#linear-gradient-23);
}
.cls-47 {
fill: #3aa00a;
}
.cls-48 {
fill: #fcfdd1;
}
.cls-49 {
fill: url(#linear-gradient-18);
}
</style>
<linearGradient id="linear-gradient" x1="2073.86" y1="-422.97" x2="1629.67" y2="297.58" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#217038"/>
<stop offset="1" stop-color="#75ba47"/>
</linearGradient>
<linearGradient id="linear-gradient-2" x1="1932.43" y1="-380.88" x2="1421.86" y2="171.61" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#b3dd4f"/>
<stop offset="1" stop-color="#f4fd73"/>
</linearGradient>
<linearGradient id="linear-gradient-3" x1="1645.04" y1="95.45" x2="1415.08" y2="359.61" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#82c14c"/>
<stop offset="1" stop-color="#bee06b"/>
</linearGradient>
<linearGradient id="linear-gradient-4" x1="2164.08" y1="451.47" x2="2054.71" y2="186.52" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#000"/>
<stop offset="1" stop-color="#011304"/>
</linearGradient>
<linearGradient id="linear-gradient-5" x1="2159.25" y1="368.63" x2="2093.62" y2="479.25" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#b6f13c"/>
<stop offset="1" stop-color="#fffc75"/>
</linearGradient>
<linearGradient id="linear-gradient-6" x1="1536.49" y1="-470.46" x2="1433.81" y2="91.73" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#3d9541"/>
<stop offset="1" stop-color="#a1d05f"/>
</linearGradient>
<linearGradient id="linear-gradient-7" x1="1825.55" y1="-857.69" x2="1556.77" y2="-592.18" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#b0db4b"/>
<stop offset="1" stop-color="#edf96e"/>
</linearGradient>
<linearGradient id="linear-gradient-8" x1="1820.57" y1="-434.77" x2="1618.82" y2="-987.58" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#247231"/>
<stop offset="1" stop-color="#429045"/>
</linearGradient>
<linearGradient id="linear-gradient-9" x1="1554.56" y1="-829.49" x2="1459.45" y2="-533.23" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#5bac4b"/>
<stop offset="1" stop-color="#b7da69"/>
</linearGradient>
<linearGradient id="linear-gradient-10" x1="1986.59" y1="-1068.58" x2="1930.56" y2="-1273.94" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#237131"/>
<stop offset="1" stop-color="#398a3a"/>
</linearGradient>
<linearGradient id="linear-gradient-11" x1="2023.71" y1="-1247.08" x2="1913.69" y2="-1097.39" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#5baa46"/>
<stop offset="1" stop-color="#a6d264"/>
</linearGradient>
<linearGradient id="linear-gradient-12" x1="1595.68" y1="-1262.35" x2="1400.33" y2="-1097.04" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#247435"/>
<stop offset="1" stop-color="#549e45"/>
</linearGradient>
<linearGradient id="linear-gradient-13" x1="1453.21" y1="-1226.38" x2="1386.07" y2="-1093.93" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#6ab14c"/>
<stop offset="1" stop-color="#bfe169"/>
</linearGradient>
<linearGradient id="linear-gradient-14" x1="2217.75" y1="-873.23" x2="2106.77" y2="-775.97" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#4da044"/>
<stop offset="1" stop-color="#a5d260"/>
</linearGradient>
<linearGradient id="linear-gradient-15" x1="1300.08" y1="-874.29" x2="1201.9" y2="-765.71" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#55a641"/>
<stop offset="1" stop-color="#bee069"/>
</linearGradient>
<linearGradient id="linear-gradient-16" x1="1306.81" y1="-832.94" x2="1370.18" y2="-844.84" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#1d6f1f"/>
<stop offset="1" stop-color="#3b8544"/>
</linearGradient>
<linearGradient id="linear-gradient-17" x1="1379.69" y1="-605.71" x2="1306.6" y2="-581.3" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#6db64f"/>
<stop offset="1" stop-color="#a9cb5e"/>
</linearGradient>
<linearGradient id="linear-gradient-18" x1="1397.59" y1="-616.5" x2="1357.64" y2="-596.65" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#2a6f34"/>
<stop offset="1" stop-color="#388a37"/>
</linearGradient>
<linearGradient id="linear-gradient-19" x1="1110.01" y1="-107.13" x2="1073.75" y2="49.14" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#88c351"/>
<stop offset="1" stop-color="#dbeb8a"/>
</linearGradient>
<linearGradient id="linear-gradient-20" x1="2357.47" y1="-104.85" x2="2277.88" y2="-92.52" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#1c7126"/>
<stop offset="1" stop-color="#448e4a"/>
</linearGradient>
<linearGradient id="linear-gradient-21" x1="1323.2" y1="423.85" x2="1285.03" y2="490.59" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#5ea846"/>
<stop offset="1" stop-color="#83c350"/>
</linearGradient>
<linearGradient id="linear-gradient-22" x1="1229.07" y1="-145.2" x2="1072.9" y2="-38.47" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#0c3a35"/>
<stop offset="1" stop-color="#4c5b5f"/>
</linearGradient>
<linearGradient id="linear-gradient-23" x1="1993.18" y1="-1292.96" x2="1993.92" y2="-1283.03" gradientTransform="translate(8.01 328.71) scale(.25 -.25)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#526e78"/>
<stop offset="1" stop-color="#2e503d"/>
</linearGradient>
</defs>
<g id="Layer_1-2" data-name="Layer 1">
<g>
<g>
<g>
<path d="M183.8,40.59c-29.17-9.15-60.1-14.59-90.37-10.3-30.27,4.29-59.9,19.26-77.25,44.43C1.22,96.42-3.2,126.35,7.7,150.73c11.06,24.74,36.59,41.2,61.85,48.53,21.99,6.38,45.18,7.21,68.08,7.3,22.9.09,45.94-.51,68.55,3.14,11.46,1.86,20.06,5.54,29.33,12.29,6,4.37,10.66,10.24,16.19,15.15,3.32,2.95,11.25,11.18,15.81,7.3,1.87-1.59,11.87-15.15,11.81-17.61-.06-2.46-1.14-4.17-1.65-6.58-2.88-13.79-7.29-18.24,2.38-28.38,9.16-9.61,22.02-15.67,30.14-26.16,41.96-54.16-91.89-114.29-126.39-125.11Z"/>
<path d="M251.77,239.42c-.43-.4-.82-.76-1.16-1.06-2.21-1.96-4.3-4.09-6.33-6.15-3.05-3.11-6.21-6.32-9.74-8.9-9.25-6.72-17.54-10.2-28.62-11.99-19.33-3.13-39.37-3.13-58.73-3.11-3.19,0-6.38,0-9.56,0-21.16-.08-45.65-.72-68.53-7.36-29.35-8.51-52.86-26.99-62.89-49.44-10.73-23.99-7.34-54.46,8.62-77.62,16.51-23.96,45.08-40.4,78.38-45.12,26.92-3.81,56.71-.43,91.09,10.36h0c13.4,4.21,43.63,16.56,71.96,33.36,43.61,25.85,57.7,47.05,61.85,60.28,3.78,12.05,1.55,23.51-6.62,34.05-4.67,6.03-10.87,10.64-16.86,15.11-4.64,3.45-9.43,7.02-13.39,11.17-7.04,7.39-6.03,11.14-3.81,19.37.59,2.18,1.25,4.66,1.86,7.53.18.84.43,1.59.7,2.39.46,1.34.93,2.74.98,4.49.09,3.47-10.92,17.65-12.39,18.91-1.18,1.01-2.49,1.42-3.84,1.42-4.61,0-9.82-4.8-12.96-7.68ZM93.67,31.92c-32.39,4.59-60.14,20.53-76.13,43.73C2.21,97.88-1.06,127.09,9.21,150.06c9.64,21.57,32.37,39.37,60.8,47.62,22.48,6.52,46.69,7.15,67.63,7.23,3.18.01,6.36.01,9.55,0,19.5-.02,39.66-.02,59.26,3.16,11.48,1.86,20.46,5.62,30.03,12.58,3.76,2.73,7.01,6.05,10.16,9.25,1.98,2.02,4.03,4.11,6.16,5.99.35.31.76.69,1.21,1.1,3.07,2.83,9.47,8.71,12.44,6.18,1.87-1.59,10.95-14.23,11.24-16.32-.03-1.25-.39-2.3-.8-3.51-.29-.86-.59-1.74-.81-2.78-.58-2.78-1.24-5.21-1.81-7.35-2.31-8.59-3.71-13.77,4.61-22.5,4.15-4.35,9.06-8.01,13.8-11.54,5.82-4.33,11.83-8.81,16.23-14.48,7.47-9.64,9.51-20.09,6.08-31.05-13.15-41.95-102.39-82.3-131.66-91.48-24.99-7.84-47.48-11.72-68.16-11.72-7.38,0-14.53.49-21.48,1.48Z"/>
</g>
<path d="M25.65,42.47c.44,0,.87-.17,1.2-.52C45.33,22.28,71.95,9.12,101.81,4.89c7.48-1.06,15.28-1.6,23.2-1.6,2.6,0,5.27.06,7.93.17.92.03,1.68-.67,1.71-1.57.04-.91-.67-1.68-1.57-1.71C130.37.06,127.65,0,125,0c-8.07,0-16.03.55-23.66,1.63-30.59,4.34-57.9,17.86-76.89,38.07-.62.66-.59,1.7.07,2.33.32.3.72.45,1.13.45Z"/>
<g>
<path class="cls-11" d="M276.4,51.26c-13.06-8.04-26.55-15.08-38.81-20.86"/>
<path d="M276.39,52.9c.55,0,1.09-.28,1.4-.78.48-.77.24-1.79-.54-2.26-11.82-7.28-24.93-14.33-38.97-20.95-.82-.39-1.8-.04-2.19.79-.39.82-.04,1.8.79,2.19,13.92,6.57,26.92,13.56,38.64,20.77.27.17.57.24.86.24Z"/>
</g>
<path d="M319.66,170.43c.37,0,.75-.13,1.06-.38,4.27-3.58,7.58-6.94,10.4-10.59,10.64-13.73,13.62-29.39,8.64-45.3-2.62-8.36-7.58-16.92-14.74-25.45-.58-.7-1.62-.79-2.32-.2-.7.58-.79,1.62-.2,2.32,6.88,8.19,11.63,16.37,14.12,24.32,4.65,14.83,1.85,29.46-8.1,42.3-2.68,3.46-5.83,6.66-9.91,10.08-.7.58-.79,1.62-.2,2.32.33.39.79.59,1.26.59Z"/>
<g>
<path class="cls-11" d="M193.67,25.78c-29.17-9.15-60.1-14.59-90.37-10.3-30.27,4.29-59.9,19.26-77.25,44.43-14.96,21.7-19.38,51.63-8.48,76.02,11.06,24.74,36.59,41.2,61.85,48.53,21.99,6.38,45.18,7.21,68.08,7.3,22.9.09,45.94-.51,68.55,3.14,11.46,1.86,20.06,5.54,29.33,12.29,6,4.37,10.66,10.24,16.19,15.15,3.32,2.95,11.25,11.18,15.81,7.3,1.87-1.59,2.58-4.22,2.52-6.68-.06-2.46-.78-4.85-1.28-7.26-2.88-13.79,1.65-28.5,11.31-38.64,9.16-9.61,22.02-15.67,30.14-26.16,41.96-54.16-91.89-114.29-126.39-125.11Z"/>
<path d="M261.65,224.61c-.43-.4-.82-.76-1.16-1.06-2.21-1.96-4.3-4.09-6.33-6.15-3.05-3.11-6.21-6.32-9.74-8.9-9.25-6.72-17.54-10.2-28.62-11.99-19.33-3.13-39.36-3.13-58.73-3.11-3.19,0-6.38,0-9.56,0-21.16-.08-45.65-.72-68.53-7.36-29.35-8.51-52.86-26.99-62.89-49.44-10.73-23.99-7.34-54.46,8.62-77.62,16.51-23.96,45.08-40.4,78.38-45.12,26.92-3.81,56.71-.43,91.09,10.36h0c13.4,4.21,43.63,16.56,71.96,33.36,43.61,25.85,57.7,47.05,61.85,60.28,3.78,12.05,1.55,23.51-6.62,34.05-4.67,6.03-10.87,10.64-16.86,15.11-4.64,3.45-9.43,7.02-13.39,11.17-9.44,9.91-13.61,24.15-10.89,37.17.12.57.25,1.15.39,1.72.43,1.87.88,3.8.93,5.83.08,3.32-1.05,6.23-3.1,7.97-1.18,1.01-2.49,1.42-3.84,1.42-4.61,0-9.82-4.8-12.96-7.68ZM103.54,17.11c-32.39,4.59-60.14,20.53-76.13,43.73-15.33,22.24-18.6,51.44-8.33,74.41,9.64,21.57,32.37,39.37,60.8,47.62,22.48,6.52,46.69,7.15,67.63,7.23,3.18.01,6.37.01,9.55,0,19.51-.02,39.66-.02,59.26,3.16,11.48,1.86,20.46,5.62,30.03,12.58,3.76,2.73,7.01,6.05,10.16,9.25,1.98,2.02,4.03,4.11,6.16,5.99.35.31.76.69,1.21,1.1,3.07,2.83,9.47,8.71,12.44,6.18,1.29-1.1,2-3.06,1.94-5.38-.04-1.7-.43-3.38-.85-5.17-.14-.6-.27-1.19-.4-1.79-2.94-14.06,1.55-29.43,11.73-40.11,4.15-4.35,9.06-8.01,13.8-11.54,5.82-4.33,11.83-8.81,16.23-14.48,7.47-9.64,9.51-20.09,6.08-31.05-13.15-41.95-102.39-82.3-131.66-91.48-24.99-7.84-47.48-11.72-68.16-11.72-7.38,0-14.53.49-21.48,1.48Z"/>
</g>
</g>
<path class="cls-41" d="M572.37,178.32c4.12-.24,7.69.38,11.09,2.82,4.34,3.11,7.41,8.28,8.23,13.54,1.12,7.25-2.22,13.77-3.11,20.82-.63,4.97.22,10.04.08,15.04-.49,17.02-6.15,28.52-16.01,41.89,2.02,3.32,4.14,6.63,5.89,10.1s3.16,7.45,5.32,10.66c2.43.97,4.92,1.75,7.3,2.84,6.85,3.13,12.91,8.56,16.87,14.96,3.34,5.4,6.21,11.04,8.07,17.13,4.18,13.71,4.27,33.87.91,47.89-3.53,14.72-11.05,28.09-25.36,34.49-1.95.87-8.19,2.51-9.2,3.42-2.92,2.62-6.54,9.09-9.63,12.57-8.92,10.03-19.15,15.93-30.39,22.87,5.66,3.99,16.78,17.97,20.52,23.93,1.97,3.15,3.39,6.66,5.58,9.66,2.5,3.42,6.07,5.76,8.32,9.49,2.13,3.52,2.86,7.52,4.71,11.11,1.13,2.2,2.84,4.15,4.12,6.28,3.33,5.52,5.81,11.87,7.11,18.18,2.52,12.19.72,25.66-6.27,36.11-6.48,9.68-16.87,17.98-28.52,20.17-7.05,1.33-14.56.44-20.52-3.68-1.43,1.27-2.88,2.42-4.45,3.52,8.33,4.9,15.68,10.9,20.55,19.4,3.93,6.86,6.4,15.23,6.06,23.18-.12,2.83-.74,5.66-.59,8.51.29,5.2,1.63,9.68.17,14.89-1.72,6.14-6.46,11-11.94,14.02-20.11,11.12-50.93,12.2-72.74,5.93-11.47-3.29-29.49-12.05-35.41-22.74-6.21,9.96-18.7,16.78-29.46,20.8-19.62,7.32-45.09,7.74-65.1,1.67-4.63-1.4-8.98-3.47-13.37-5.48-2.9.92-5.46,2.12-8.55,2.31-2.91.18-5.93-.51-8.85-.64-2.7-.12-5.38-.03-8.08-.24-10.43-.82-20.23-4.14-28.08-11.27-8.41-7.65-10.09-15.68-12.04-26.38-.7-3.86-1.53-7.58-1.7-11.52-.09-5.63.68-13.3,4.45-17.76,2.76-3.27,7.48-5.21,11.67-5.62,4.4-.42,7.9.15,11.57,2.68,1.22.84,2.39,1.76,3.8,2.25,2.17.76,4.65.85,6.89,1.36,7.17,1.61,13.35,4.62,19.03,9.27,5.04-12.92,16.84-20.95,28.66-27.01-.67-2.5-.7-5.06-.55-7.62-8.28,1.88-6.97,3.61-13.09,7.33-6.2,3.78-14.52,4.02-21.42,2.35-13.13-3.18-22.84-12.68-29.65-23.88-5.79-9.53-6.17-23.98-3.53-34.61,2.85-11.49,12.81-28.25,19.75-38.04,2.6-3.67,5.54-7.08,8.1-10.8,5.57-8.09,13.79-21.98,22.06-26.98-7.83-3.01-20.37-12.1-26.64-17.97-3.02-2.83-5.74-5.97-8.41-9.12-2.58-3.04-4.63-6.47-7.18-9.54-5.67-1.65-11.32-3.41-16.22-6.83-7.93-5.54-14.45-14.68-16.14-24.29-.56-3.18-.3-6.35-.5-9.55-.34-5.37-1.21-10.7-.83-16.1.22-3.07,1.29-6.04,1.75-9.07,2.04-13.51,3.52-27.26,12.27-38.46,2.03-2.6,4.27-5.38,6.66-7.65,1.82-1.73,3.88-3.25,5.8-4.88,3.4-2.9,6.73-6.11,9.59-9.55,2.93-3.53,5.56-7.5,8.18-11.27,2.45-3.52,5.01-7.03,7.29-10.67,1.49-2.37,2.6-4.96,4.13-7.31,1.7-2.61,4.13-4.68,5.9-7.26l.22-.33c-2.61-2.13-5.28-4.27-7.66-6.66-7.39-7.43-9.87-15.69-9.83-26.05.04-9.37,2.82-18.13,9.6-24.79,6.74-6.61,15.32-10.68,24.86-10.58,9.89.11,19.59,4.6,26.4,11.71,6.42,6.7,10.34,15.94,10.1,25.27,6.02-3.33,17.9-5.79,24.76-7.14,8.66-1.7,17.65-3.2,26.46-3.78,3.36-.22,6.77-.15,10.14-.16,13.21-.04,26.33.92,39.31,3.49,8.42,1.67,16.65,4.19,25.03,6.05,1.98-3.43,3.45-6.64,6.03-9.73,7.79-9.36,22.27-16.61,33.8-20.09,3.7-1.12,7.54-1.72,11.24-2.84,8.25-2.5,15.86-5.28,24.58-6.04Z"/>
<path class="cls-38" d="M507.14,236.92l.1-.4c.53-2.16.61-4.42,1.17-6.59,2.51-9.71,8.01-17.59,16.58-22.9,3.36-2.08,7.01-3.56,10.76-4.77,7.12-2.29,14.66-2.98,21.86-5.05,4.47-1.28,11.63-6.17,16.01-5.12,1.35.32,2.43,1.05,3.14,2.25,1.41,2.38.79,5.08.07,7.57-1.09,3.8-2.34,7.47-2.79,11.43-.69,6.07.17,12.36-.19,18.47-.82,14.32-7.77,29.77-20.72,37.01-.14.08-.29.16-.44.24,8.99,9.72,15.45,23.78,20.22,35.99.84-.04,1.69-.08,2.52,0,1.62.16,3.01,1.59,4.49,2.22,1.65.7,3.46,1.12,5.15,1.75,3.83,1.43,7.08,4.24,9.61,7.4,10.04,12.52,11.39,32.4,9.57,47.84-1.22,10.36-4.62,22.97-13.27,29.65-3.57,2.75-7.03,3.47-11.21,4.75-1.39.42-2.87,1.09-4.3,1.27-.82.1-1.7-.04-2.51-.15-2.06,3.81-4.12,7.59-6.64,11.12-10.61,14.9-27.29,24.39-44.12,30.68-5.01,1.88-10.05,3.63-15.34,4.51,2.83.37,5.44.98,8.08,2.06,18.86,7.75,35.67,28.27,43.41,46.89,4.31.84,6.76,3.68,7.7,7.93.32,1.44.41,3.08.96,4.46.68,1.71,2.21,3.14,3.31,4.59,6.44,8.48,10.47,20.3,8.93,31-1.26,8.77-6.14,16.47-13.23,21.71-4.53,3.35-10.92,6.45-16.71,5.51-2.42-.4-4.55-1.49-5.95-3.55-2.92-4.3-1.11-10.01-.31-14.73-1.56,3.33-3.23,6.46-6.87,7.91-2.49,1-5.26.75-7.68-.33-3.71-1.65-6.4-5.01-7.85-8.73-3.79-9.67-.43-20.01,3.46-29.02-1.52-1.41-2.55-2.96-2.75-5.08-.21-2.32.7-4.23,2.1-6-1.66-4.88-3.29-10.17-5.87-14.65.35,2.84.87,5.66,1.15,8.52.53,5.7.62,11.43.26,17.14-.96,16.11-5.41,26.26-15.57,38.65.27,8.11.17,16.26.18,24.37.31,0,.62,0,.93.01,1.96.07,4.01.52,5.35,2.08,1.5,1.75,1.43,3.91,1.3,6.06,1.96.09,3.89.29,5.82.68,9.07,1.85,18.05,7.4,23.18,15.18,5.95,9.03,5.24,18.44,3.17,28.57,1.3,1.18,2.24,2.38,2.71,4.1.51,1.83.19,3.69-.82,5.29-3.67,5.84-16.55,9.52-22.92,10.79-20.74,4.14-44.4,2.11-62.28-9.92-5.02-3.38-12.6-9.64-13.67-16.01-.79-4.65,2.62-5.6,2.94-7.34.43-2.32.07-5.05.19-7.44.41-8.31,3.62-14.19,8.28-20.85-.33-.67-.65-1.39-.79-2.12-.37-1.92.06-3.91,1.2-5.5,1.33-1.86,3.2-2.82,5.42-3.17l.33-5.53c-3.67.96-7.61,1.43-11.38,1.85-13.48,1.5-26.35.82-39.71-1.26.09,1.61.09,3.23.12,4.85.86.1,1.64.26,2.44.61,1.94.86,3.73,2.36,4.51,4.38.81,2.09.43,3.96-.5,5.92.89.96,1.68,2.04,2.43,3.11,5.16,7.31,7.42,15.99,5.91,24.87.44.28.89.56,1.31.89,1.39,1.1,2.39,3.05,2.51,4.82.25,3.61-2.51,7.35-4.8,9.92-11.37,12.77-29.08,18.62-45.75,19.64-13.37.82-29.3-.96-41.31-7.1-1.82-.93-3.75-1.9-5.26-3.29-1.63-1.49-2.71-3.42-2.72-5.66-.02-2.52,1.18-4.17,2.86-5.87-.74-2.62-1.26-5.31-1.54-8.02-.85-8.54,1.43-16.62,6.91-23.25,6.63-8.02,15.71-12.16,25.94-13.18,0-2.2.17-4.68,1.78-6.37,1.51-1.58,3.65-1.78,5.7-1.85.05-7.53,0-15.07-.11-22.6-2.9-2.95-5.59-5.93-7.91-9.38-11.2-16.61-12.51-38.55-8.74-57.76-2.64,4.69-4.14,10.27-5.94,15.34,1.49,1.6,2.39,3.21,2.44,5.45.06,2.43-.97,4.29-2.64,5.97,3.68,7.25,6.23,15.31,5.01,23.54-.72,4.89-3.25,10.02-7.36,12.93-2.36,1.67-5.17,2.68-8.07,2.12-4.42-.86-6.36-4.08-8.6-7.53.28,1.19.55,2.38.81,3.58.71,3.32,1.23,7.15-.81,10.12-1.5,2.19-4.03,3.38-6.61,3.76-5.83.85-12.53-2.46-17.06-5.87-6.79-5.01-11.25-12.57-12.35-20.93-1.3-10,1.84-20.39,7.05-28.87,1.39-2.27,3.67-4.37,4.78-6.7,1.54-3.21.12-5.93,3.15-9.71,1.49-1.86,3.46-2.6,5.76-2.8,1.45-3.75,3.42-7.43,5.46-10.89,9.67-16.33,24.51-33.08,43.47-37.95-4.84-1.29-9.61-2.81-14.31-4.56-21.6-7.92-41.85-20.85-51.86-42.45-.1,0-.19.02-.29.03-.83.08-1.73.22-2.56.11-1.27-.17-2.53-.77-3.76-1.13-2.91-.86-5.78-1.43-8.51-2.81-7.31-3.69-11.28-10.58-13.71-18.14-5.2-16.18-5.53-40.29,2.4-55.49,2.94-5.63,7.15-10.65,13.18-13.05,2.01-.8,4.15-1.26,6.15-2.06,1.66-.66,2.9-1.75,4.66-2.3l2.64.61c7.68-22.61,24.8-45.34,45.34-57.7-1.96-2.89-3.86-5.95-5.46-9.06-1.07.23-2.15.41-3.24.45-5.67.18-11.18-1.93-15.29-5.85-4.13-4-6.51-9.48-6.59-15.23-.13-5.68,2.01-11.18,5.95-15.27,3.97-4.02,9.36-6.3,15.01-6.35,5.94-.04,11.24,2.24,15.44,6.4,4.11,4.07,6.27,9.59,6.26,15.37-.02,6.14-2.68,11.4-6.96,15.65,1.6,2.54,3.17,5.1,4.72,7.66,2.92-1.31,5.71-2.93,8.6-4.32,4.91-2.32,9.95-4.35,15.09-6.08,36.55-12.3,76.09-12.45,112.73-.44,5.61,1.88,11.11,3.83,16.42,6.45Z"/>
<path class="cls-44" d="M507.14,236.92l.1-.4c.53-2.16.61-4.42,1.17-6.59,2.51-9.71,8.01-17.59,16.58-22.9,3.36-2.08,7.01-3.56,10.76-4.77,7.12-2.29,14.66-2.98,21.86-5.05,4.47-1.28,11.63-6.17,16.01-5.12,1.35.32,2.43,1.05,3.14,2.25,1.41,2.38.79,5.08.07,7.57-1.09,3.8-2.34,7.47-2.79,11.43-.69,6.07.17,12.36-.19,18.47-.82,14.32-7.77,29.77-20.72,37.01-.14.08-.29.16-.44.24-1.65.59-3.23,1.4-4.81,2.14-.22.55-.21.29-.13.76,6.93,8.08,21.1,30.22,20.28,40.64-.35,4.49-.94,8.95-1.21,13.44-.79,14.1-.96,28.23-.53,42.35.28,8.82.61,17.53,2.52,26.18-2.73,5.64-5.74,11.77-9.68,16.64-8.02,9.93-26.69,20.92-38.7,25.12-5.22,1.83-10.68,3.67-16.05,5-3.6.89-7.27,1.49-10.9,2.25-38.09,8.09-77.45,8.18-115.58.28-11.94-2.52-24.37-5.9-35.39-11.23-6.53-3.16-21.29-11.01-24.6-16.99-1.46-1.45-2.83-2.93-4.15-4.51-.15-3.9-2.06-7.5-2.29-11.41-.34-5.71.08-11.55-.03-17.28-.23-12.09-1.73-28.9-4.54-40.5-1.25-9.43-1.34-18.96-2.6-28.42-.2-1.48-.64-3.42-.32-4.87.03-.11.06-.23.09-.34,1.2-4.84,4.5-12.38,7.22-16.6.03-.09.05-.18.08-.26,1.37-3.36,3.91-6.88,6-9.87,10.92-15.64,25.53-27.91,42.39-36.76,36.49-19.14,85.21-22.71,124.46-10.49,7.77,1.8,15.42,5.39,22.71,8.57l.3-.45c.17-1.63.42-3.98-.11-5.53Z"/>
<path class="cls-3" d="M383.97,280.26c.11-.06.21-.12.33-.17,2.61-1.15,9.48-2.57,12.63-3.29,26.2-5.92,53.43-5.47,79.42,1.32,2.39.62,5.22.92,7.47,1.82-.85,1.47-1.43,2.92-.99,4.64.27,1.05.97,2.01,1.95,2.49,1.79.89,10.17,1.31,13.1,1.98,7.33,1.69,13.54,5.41,20.06,8.93-.13,3,9.76,14.38,11.96,17.72,2.07,3.08,3.82,6.36,5.22,9.79,3.33,8.2,4.24,17.46,3.29,26.23-.98,9.13-4.13,17.95-7.07,26.59l-.45.12c-1.46,4.69-9.73,20.55-13.9,22.53-.1.04-.2.07-.29.1v.07c-3.24,3.02-7.64,5.28-11.51,7.39-23.95,13.04-55.27,17.84-82.33,16.89-21.35-.76-43-6.76-63.73-11.6-5.01-1.17-11.34-4.54-16.38-4.28-.98-.44-1.93-.93-2.89-1.42-3.09-1.16-6.79-2.21-9.55-4.02-1.06-.7-1.86-1.76-2.89-2.5-.08-.05-.15-.1-.23-.15-1.81-2.21-2.49-4.54-3.15-7.27l-.3-.09c-.68-3.39-2.8-6.44-4.01-9.69-5.32-14.3-2.38-41.57,2.55-56.19,1.64-4.86,4.34-9.39,6.49-14.04,1.45-2,2.61-4.23,4.07-6.25,2.43-3.37,10.19-12.19,14.2-13.44.39-.12.44.01.76.19v.83c-.89,1.04-2.27,2.32-2.59,3.65.12.39.07.58.45.8.5.29.91.29,1.47.35,4.61-3.76,12.86-8.32,18.81-9.75,4.86-2.02,10.55-2.34,15.74-2.85l.29-.12c.3-.13.31-.13.63-.34,1.08-.7,1.93-2.02,2.19-3.27.32-1.54.07-2.42-.78-3.7Z"/>
<path class="cls-48" d="M381.92,287.57c.09.04.17.08.26.12,2.14,1,4.12.31,6.22-.49,2.28-.88,6.62-3.07,9.06-1.89.34.17.37.42.53.74-.04,1.88-1.25,3.25-2.56,4.5-4.76,4.5-11.18,7.3-16.7,10.74-7.58,4.72-14.96,10.38-21.44,16.52-3.25,3.08-6.02,6.54-8.88,9.97-3.34,4-6.65,7.95-9.8,12.11-1.36,1.8-2.61,3.65-3.77,5.6-1.12,1.89-2.15,4.15-3.63,5.77-.81.89-1.85,1.57-2.85,2.24-.21-4.05-.22-8.07.58-12.07,2.14-10.71,10.15-23.52,17.47-31.63,4.99-5.54,11.5-10.33,17.71-14.45.96-1.55,3.07-2.23,3.41-4.13-.57-.66-.79-.56-1.63-.67,4.86-2.02,10.55-2.34,15.74-2.85l.29-.12Z"/>
<path class="cls-43" d="M365.9,290.54c4.86-2.02,10.55-2.34,15.74-2.85-3.13,2.4-7.26,2.3-10.8,3.71-2.41.96-4.53,2.57-6.72,3.94.96-1.55,3.07-2.23,3.41-4.13-.57-.66-.79-.56-1.63-.67Z"/>
<path class="cls-35" d="M334.09,379.71c6.06-1.4,12.23-.42,17.52,2.88,3.43,2.14,6.13,5.4,7.09,9.38.7,2.9.27,5.93-1.34,8.46-2.56,4.01-7.18,6.32-11.73,7.2-1.92.37-3.85.43-5.8.49-3.09-1.16-6.79-2.21-9.55-4.02-1.06-.7-1.86-1.76-2.89-2.5-.08-.05-.15-.1-.23-.15-1.81-2.21-2.49-4.54-3.15-7.27-.2-1.89.1-3.59.57-5.4.77-1.06,1.19-2.29,2.05-3.26.79-.15.97.11,1.65.52,1.17-2.26,2.55-3.44,4.79-4.55l1.02-1.76Z"/>
<path class="cls-41" d="M333.07,381.47c1.09.48,2.7,1.16,3.15,2.38.33.89.23,1.72-.23,2.54-.7,1.25-2.12,2.23-3.52,2.52-1.09.23-2.12.07-3.01-.62-.65-.51-1.02-1.49-1.19-2.26,1.17-2.26,2.55-3.44,4.79-4.55Z"/>
<path class="cls-33" d="M328.73,314.16c1.45-2,2.61-4.23,4.07-6.25,2.43-3.37,10.19-12.19,14.2-13.44.39-.12.44.01.76.19v.83c-.89,1.04-2.27,2.32-2.59,3.65.12.39.07.58.45.8.5.29.91.29,1.47.35-.04.07-.07.13-.11.2-1.23,2.05-3.23,3.93-4.86,5.69-3.13,3.36-6.43,6.78-9,10.6-10.76,15.96-14.36,45.05-9.9,63.82.5,2.1.94,4.32,1.7,6.34l-.34,1.84c-.47,1.82-.78,3.52-.57,5.4l-.3-.09c-.68-3.39-2.8-6.44-4.01-9.69-5.32-14.3-2.38-41.57,2.55-56.19,1.64-4.86,4.34-9.39,6.49-14.04Z"/>
<path class="cls-35" d="M516.67,401.06c-1.95-1.81-3.64-4.92-3.69-7.59-.06-3.36,1.71-7.09,4.02-9.5,3.55-3.7,8.86-5.44,13.87-5.54-1.46,4.69-9.73,20.55-13.9,22.53-.1.04-.2.07-.29.1Z"/>
<path class="cls-37" d="M324.92,386.93c2.35-3.66,5.13-5.7,9.17-7.22l-1.02,1.76c-2.24,1.11-3.62,2.29-4.79,4.55-.68-.4-.85-.67-1.65-.52-.86.98-1.28,2.2-2.05,3.26l.34-1.84Z"/>
<path class="cls-38" d="M370.79,316.56c4.51-.45,9.33,1.32,12.81,4.14,6.11,4.96,9.17,13.34,9.97,20.96,1.01,9.67-.46,19.64-6.77,27.35-3.66,4.48-8.35,7.02-14.08,7.61-4.57.27-9.09-1.14-12.7-3.96-6.1-4.72-9.24-12.22-10.17-19.7-1.18-9.53.45-20.44,6.56-28.13,3.79-4.78,8.31-7.59,14.39-8.27Z"/>
<path class="cls-22" d="M384.82,351.92c1.44.59,2.63,1.02,3.24,2.58.94,2.43.08,5.52-1.02,7.79-.65,1.35-1.5,2.74-2.65,3.71-.01,0-.02.02-.03.03-2.79,3.55-6.04,6.17-10.67,6.75-3.68.46-7.46-.51-10.34-2.87-.4-.33-.8-.67-1.16-1.04-2.12-2-4.68-4.22-5-7.31-.17-1.71.46-3.47,1.63-4.73.91-.98,2.12-1.6,3.47-1.59,2.17.01,3.72,1.66,5.19,3.04,1.63,1.24,3.47,2.07,5.53,2.19,3,.18,5.33-1.05,7.53-2.95,1.14-1.91,2.74-4.02,4.3-5.6Z"/>
<path class="cls-4" d="M362.18,368.87c-2.12-2-4.68-4.22-5-7.31-.17-1.71.46-3.47,1.63-4.73.91-.98,2.12-1.6,3.47-1.59,2.17.01,3.72,1.66,5.19,3.04-1.81.76-3.03,1.96-3.79,3.79-.91,2.2-.73,4.63-1.49,6.79Z"/>
<path class="cls-4" d="M384.82,351.92c1.44.59,2.63,1.02,3.24,2.58.94,2.43.08,5.52-1.02,7.79-.65,1.35-1.5,2.74-2.65,3.71-.01,0-.02.02-.03.03-1.71-3.15-.81-5.03-3.83-8.51,1.14-1.91,2.74-4.02,4.3-5.6Z"/>
<path class="cls-41" d="M365.81,324.76c1.34.02,2.45.31,3.64.94,1.76.94,2.96,2.55,3.49,4.46.84,2.98.09,6.66-1.45,9.31-1.41,2.43-3.36,3.99-6.07,4.74-1.33-.04-2.53-.23-3.74-.82-1.78-.87-3.04-2.41-3.6-4.31-.87-2.98-.13-6.6,1.36-9.28,1.43-2.56,3.52-4.29,6.35-5.04Z"/>
<path class="cls-38" d="M496.29,316.79c3.92-.46,7.87.43,11.22,2.52,6.41,3.94,10.42,11.68,12.11,18.8,2.19,9.19,1.62,19.8-3.43,27.98-3.33,5.4-8.08,8.89-14.25,10.36-5.03.32-9.16-.38-13.36-3.32-6.19-4.35-9.69-11.6-10.92-18.92-1.55-9.25-.41-21,5.18-28.82,3.24-4.54,7.92-7.7,13.45-8.6Z"/>
<path class="cls-22" d="M511.1,352.56c1.56.82,2.65,1.79,3.81,3.11-.45,2.99-.92,7.46-3.06,9.82-2.3,3.55-4.97,6.04-9.24,6.97-3.74.81-8.01.24-11.22-1.87-1.3-.86-2.46-1.99-3.45-3.19-1.39-1.53-2.76-3.62-3.24-5.64-.71-2.97.45-5.39,1.98-7.85,2.48,1.52,5.06,3.02,7.29,4.89,2.91,1.38,6.07,1.98,9.21.93.74-.25,1.52-.56,2.19-.95,2.17-1.92,4.04-3.88,5.74-6.22Z"/>
<path class="cls-4" d="M486.67,353.91c2.48,1.52,5.06,3.02,7.29,4.89-1.85.48-3.02,1.86-3.96,3.47-.94,1.62-1.51,3.35-2.07,5.12-1.39-1.53-2.76-3.62-3.24-5.64-.71-2.97.45-5.39,1.98-7.85Z"/>
<path class="cls-4" d="M511.1,352.56c1.56.82,2.65,1.79,3.81,3.11-.45,2.99-.92,7.46-3.06,9.82l-.59-.38c-.62-.96-.35-2.63-.34-3.74-1.78-1.28-3.49-1.94-5.56-2.6,2.17-1.92,4.04-3.88,5.74-6.22Z"/>
<path class="cls-41" d="M493,324.76c1.07-.07,2.2-.16,3.24.18,1.84.59,3.25,1.98,4.02,3.73,1.26,2.86.94,7.02-.25,9.86-1.22,2.9-3.31,4.5-6.15,5.61-1.17,0-2.21-.19-3.27-.71-2.03-.99-3.37-2.77-4.07-4.89-.97-2.94-.86-6.34.61-9.09,1.3-2.42,3.27-3.9,5.87-4.67Z"/>
<path class="cls-20" d="M468.05,373.43c1.02.44,1.82.91,2.27,1.98.02,1.62-1.06,2.41-2.1,3.49-.28,6.24-.93,12.6-2.69,18.61-2.47,8.41-7.24,16.2-15.13,20.44-6.62,3.52-14.38,4.24-21.54,2-8.13-2.54-13.49-8.01-17.39-15.37-4.09-8.37-5.43-16.74-6.65-25.83-1.09-.67-2.05-1.11-2.38-2.42.25-.84.72-1.88,1.49-2.37.64-.4,1.22-.05,1.82.26,1.96,1,3.74,2.48,5.64,3.6,3.32,1.96,8.18,3.57,11.94,4.38,11.61,2.5,25.34,1.56,36.1-3.55,3.05-1.45,5.8-3.39,8.63-5.22Z"/>
<path class="cls-35" d="M439.31,398.08c6.98-.37,10.71,1.14,16.94,3.71.8.33,1.96.49,2.62,1.02.25.19.2.18.2.52.02,2.08-2.87,5.52-4.29,7.01-4.82,5.06-10.58,7.05-17.43,7.25-1.33-.06-2.68-.1-4-.28-6.95-.94-12.49-4.79-16.63-10.31,5.73-5.78,14.65-8.47,22.58-8.91Z"/>
<path class="cls-16" d="M311.31,291.71c.03-.09.05-.18.08-.26,1.37-3.36,3.91-6.88,6-9.87,10.92-15.64,25.53-27.91,42.39-36.76,36.49-19.14,85.21-22.71,124.46-10.49-.1.04-.2.09-.31.12-1.38.48-5.74-1.91-6.86-1.61-.57.16-1.08.82-1.49,1.24-.72.11-1.69-.61-2.17-.17-.23.22-.44.7-.61.99.24.33.48.64.73.95-.04.66-.53,1.06-.95,1.52-.03.95-.04,1.9-.09,2.84-.04.63.05.92.28,1.51.8,2.03-.46,7.3-.94,9.51-.43,2-2.47,3.88-3.32,5.78-.71,1.57-1.1,5.18-2.03,6.29-.59.71-1.72,1.23-2.43,1.85-.82.73-1.41,1.9-2.01,2.83-.34-.05-.65-.11-.98-.2l-.32.31.15.57c1.88.89,4.29.92,6.32,1.31,2.43.47,4.84,1.18,7.25,1.73,3.19.72,6.29,1.13,9.37,2.31.35.14.76.22,1.12.32-.59.08-18.71-4.22-21.58-4.67-7.28-1.13-14.45-1.38-21.8-1.64-19.16-.7-32.89-.08-51.53,4.59-3.45.86-7.83,1.49-10.92,3.24,1,.17,1.64-.59,2.67-.56.13.54.09.43-.15.88-.72.27-1.41.49-2.16.67-.27.35-.44.64-.59,1.06-.37.24-.33.28-.79.27-.95-.02-1.04-.05-1.74.59,3.16-.26,4.96-.47,7.61,1.5.85,1.29,1.1,2.17.78,3.7-.26,1.25-1.11,2.57-2.19,3.27-.32.21-.33.2-.63.34l-.29.12c-5.18.51-10.87.82-15.74,2.85-5.95,1.43-14.2,5.98-18.81,9.75-.56-.05-.97-.06-1.47-.35-.38-.22-.33-.41-.45-.8.32-1.33,1.7-2.61,2.58-3.65v-.83c-.31-.18-.36-.31-.75-.19-4.01,1.25-11.76,10.08-14.2,13.44-1.46,2.02-2.62,4.25-4.07,6.25-1.58.81-2.27,4.74-3.32,5.16l-.04-.78c-.11.03-.23.05-.34.08-3.14.86-7.04,2.37-10.32,1.98-1.2-.14-2.31-.71-3.48-.95-.66-.14-.96-.09-1.53.25-.31.7-.53,1.29-1.13,1.8-.33.05-.7.24-.98,0-.87-.77-.79-2.55-1.07-3.61-.2-.76-.35-.76-1.01-1.11-.6-1.12-.67-2.73-.81-3.98-.14-1.23-.42-2.67-.33-3.89.24-3.31,3.82-10.01,5.31-13.21.52-1.12,1.39-2.54,1.56-3.75.02-.15.04-.3.05-.44Z"/>
<path class="cls-38" d="M376.35,278.77c3.16-.26,4.96-.47,7.61,1.5.85,1.29,1.1,2.17.78,3.7-.26,1.25-1.11,2.57-2.19,3.27-.32.21-.33.2-.63.34l-.29.12c-5.18.51-10.87.82-15.74,2.85-5.95,1.43-14.2,5.98-18.81,9.75-.56-.05-.97-.06-1.47-.35-.38-.22-.33-.41-.45-.8.32-1.33,1.7-2.61,2.58-3.65,7.84-8.02,18.08-13.25,28.6-16.72Z"/>
<path class="cls-48" d="M341.3,271.36c-.57-2.33-.97-4.52-.12-6.85,2.28-6.25,15.41-12.87,21.34-15.76,3.89-1.89,9.92-4.79,14.3-3.12,1.9.72,2.52,2.58,3.24,4.3.36,1.11.69,2.2.94,3.35-.61,1.56-1.22,2.97-2.51,4.11-3.03,2.65-6.9,4.38-10.33,6.46-6.09,3.69-12.05,8.02-18.57,10.9-1.76.78-3.31,1.29-5.18.49-.34-.14-.31-.14-.58-.3-.28-.12-.65-.25-.9-.43-1.13-.8-1.34-1.87-1.61-3.14Z"/>
<path class="cls-43" d="M380.06,249.94c.36,1.11.69,2.2.94,3.35-.61,1.56-1.22,2.97-2.51,4.11-3.03,2.65-6.9,4.38-10.33,6.46-6.09,3.69-12.05,8.02-18.57,10.9-1.76.78-3.31,1.29-5.18.49-.34-.14-.31-.14-.58-.3.51-.75,1.53-1.03,1.82-1.87,2.13-.19,3.56-.99,5.39-2.03,5.25-2.99,10.36-6.19,15.54-9.29,3.5-2.09,7.82-3.97,10.73-6.83,1.4-1.37,2.25-3.12,2.76-4.98Z"/>
<path class="cls-43" d="M341.3,271.36c1.28,1.08,2.74,1.35,4.34,1.71-.28.84-1.31,1.12-1.82,1.87-.28-.12-.65-.25-.9-.43-1.13-.8-1.34-1.87-1.61-3.14Z"/>
<path class="cls-24" d="M382.62,240.95c.12,0,.23.02.35.03,1.56.08,4.31-1.15,5.92-1.58,5.95-1.58,21.3-5.52,25.81-.93,1.9,1.94,2.28,4.5,2.18,7.09l-.02.37c-1.34,2.04-2.6,3.28-5.05,3.8-3.99.84-8.14,1-12.17,1.56-3.29.46-6.58,1.26-9.88,1.59-.61.06-1.18.16-1.75-.11-.8-.85-.76-1.77-.73-2.87.03-.94.31-2.28-.1-3.12l-.33-.09c-.22.65-.47,1.58-1.02,2.02-.46.36-1.01.44-1.57.3-1.03-.25-1.91-1.25-2.48-2.08-.96-1.39-1.61-2.98-1.29-4.67.44-.68,1.42-.98,2.14-1.31Z"/>
<path class="cls-43" d="M382.62,240.95c2.84,1.71,2.86,3,4.22,5.74-.22.65-.47,1.58-1.02,2.02-.46.36-1.01.44-1.57.3-1.03-.25-1.91-1.25-2.48-2.08-.96-1.39-1.61-2.98-1.29-4.67.44-.68,1.42-.98,2.14-1.31Z"/>
<path class="cls-48" d="M333.91,271.2c2.3,1.6,3.19,2.69,4.05,5.38l.17.45c.15.4.33.72.54,1.09.78,1.35.82,3.03.39,4.5-.94,3.15-4.94,6.49-7.84,7.9-1.2.58-2.74,1.06-4.06.63-1.11-.36-1.59-1.23-2.09-2.21-.42-.78-.83-1.57-1.22-2.36-.97-2.01-1.54-4.3-.71-6.46,1.71-4.46,6.68-7.12,10.77-8.92Z"/>
<path class="cls-43" d="M337.96,276.58l.17.45c.15.4.33.72.54,1.09.78,1.35.82,3.03.39,4.5-.94,3.15-4.94,6.49-7.84,7.9-1.2.58-2.74,1.06-4.06.63-1.11-.36-1.59-1.23-2.09-2.21,1.3-.06,2.63.14,3.93.26.73-.48,1.42-1.01,2.09-1.57,3.35-2.83,6.53-6.5,6.88-11.05Z"/>
<path class="cls-24" d="M321.94,289.11c.33,0,.6.16.91.28,1.51,1.8,2.09,3.68,2.8,5.87-1.94,5.09-5.08,12-9.84,15.07-.85.21-1.65.47-2.48.09-.83-.99-1-2.11-1.09-3.38-.33-4.8,1.54-12.26,4.81-15.87,1.52-1.69,2.74-1.93,4.89-2.05Z"/>
<path class="cls-43" d="M342.18,282.32c.94-.38,1.84-.88,2.84-.38.55.28.94.76,1.05,1.37.19,1.08-.32,2.22-.99,3.03-.13.05-.26.1-.4.15-.52.19-.94.18-1.48.17l-.11.31c.4.47.78.82,1.27,1.19l.08.26c-.64,2.08-3.03,4.5-4.93,5.49-.74.39-1.63.66-2.46.42-.64-.19-1.09-.68-1.36-1.28-.31-.69-.3-1.49-.34-2.23,0-.04,0-.09,0-.13.27-3.14,4.19-4.73,6.14-6.81.01-.2.02-.41.05-.61.08-.62.17-.6.67-.97Z"/>
<path class="cls-43" d="M342.18,282.32c.94-.38,1.84-.88,2.84-.38.55.28.94.76,1.05,1.37.19,1.08-.32,2.22-.99,3.03-.56-.08-1.11-.15-1.67-.21-.42-.33-.79-.65-1.02-1.14-.4-.84-.47-1.79-.2-2.67Z"/>
<path class="cls-24" d="M335.33,290.7c.27-3.14,4.19-4.73,6.14-6.81.01-.2.02-.41.05-.61.08-.62.17-.6.67-.97-.27.88-.2,1.83.2,2.67.23.49.61.81,1.02,1.14.56.07,1.11.14,1.67.21-.13.05-.26.1-.4.15-.52.19-.94.18-1.48.17l-.11.31c.4.47.78.82,1.27,1.19l.08.26c-1.73-.42-2.57-2.26-3.89-3.37-1.88,1.76-3.76,3.49-5.21,5.64Z"/>
<path class="cls-43" d="M354.37,274.39c.7.29,1.34.6,1.79,1.23.52.73.76,1.61.55,2.5-.35,1.53-1.14,2.12-2.43,2.92-.93-.7-1.74-1.57-2.57-2.38.91-1.4,1.47-3.06,2.66-4.25Z"/>
<path class="cls-4" d="M507.14,236.92l.1-.4c.53-2.16.61-4.42,1.17-6.59,2.51-9.71,8.01-17.59,16.58-22.9,3.36-2.08,7.01-3.56,10.76-4.77,7.12-2.29,14.66-2.98,21.86-5.05,4.47-1.28,11.63-6.17,16.01-5.12,1.35.32,2.43,1.05,3.14,2.25,1.41,2.38.79,5.08.07,7.57-1.09,3.8-2.34,7.47-2.79,11.43-.69,6.07.17,12.36-.19,18.47-.82,14.32-7.77,29.77-20.72,37.01-.14.08-.29.16-.44.24-1.65.59-3.23,1.4-4.81,2.14-.22.55-.21.29-.13.76-.24-.08-.31-.13-.6-.12-1.28.05-3,.88-4.32,1.15-2.95.62-12.55,1.59-15.12.04-2.81-.58-5.41-1.82-8.03-2.95-1.26,3.34-2.37,7-4.2,10.08-1.04-.46-2.69-1.04-3.15-2.2-.77-1.93,2.91-9.04,3.79-11.02-3.89-4.35-6.24-10.01-7.64-15.63-.48-1.96-.5-7.24-1.56-8.42l.3-.45c.17-1.63.42-3.98-.11-5.53Z"/>
<path class="cls-21" d="M570.18,196.79c.85-.21,1.55-.39,2.43-.31.28.23.53.29.52.69,0,.65-.39,1.23-.68,1.79-2.85,1.72-4.01,4.11-4.79,7.25-2.35,9.5-1.17,19.81-5.69,28.8-2.29,2.97-4.24,6.21-6.58,9.13-3.46,4.33-8.99,7.82-13.9,10.24-3.48,1.72-7.24,3-10.55,5.05-1.11.51-7.09,3.29-7.79,3.08l-.18-.28c-.74,1.56-1.38,3.16-2.03,4.75-.49,1.03-.96,2-1.25,3.11-1.26,3.34-2.37,7-4.2,10.08-1.04-.46-2.69-1.04-3.15-2.2-.77-1.93,2.91-9.04,3.79-11.02.23-.98,1.03-2.26,1.45-3.22-.76-1.18-1.37-2.45-1.83-3.77.78-1.31.02-4.65-.16-6.2-.05-.14-.11-.28-.15-.43-.28-1.04-.17-2.62-.18-3.71,0-7.23,1.49-15.33,5.1-21.68.03-.01.06-.03.1-.04.57-.15,1.04-.21,1.54-.58,4.55-3.44,6.82-6.9,12.35-10.07,3.89-2.24,8.36-3.28,12.6-4.65,5.01-1.61,10.1-4,14.42-7,1.07-.74,8.3-7.34,8.65-7.97.14-.25.1-.56.15-.84Z"/>
<path class="cls-13" d="M528.45,243.94l.25-.27c2.93-3.2,5.27-7.14,7.84-10.64,4.46-6.06,9.52-11.79,14.73-17.21,1.47-1.53,2.94-3.24,4.6-4.57l.52.1c.08.69-.32,1.12-.73,1.66-1.53,2.04-3.49,3.8-5.08,5.82-6.06,7.67-12.04,15.68-17.22,23.97,3.14-.99,18.77-6.47,21.05-5.44-.15.58-.22.66-.75,1.02-1.27.85-3.15,1.42-4.58,2-5.19,2.11-11.18,4.88-16.9,4.42-3.47,5.15-7.1,11.57-9.18,17.41-.74,1.56-1.38,3.16-2.03,4.75-.49,1.03-.96,2-1.25,3.11-1.26,3.34-2.37,7-4.2,10.08-1.04-.46-2.69-1.04-3.15-2.2-.77-1.93,2.91-9.04,3.79-11.02.23-.98,1.03-2.26,1.45-3.22.52-1.21,1.15-2.39,1.72-3.57,2.08-4.19,5.5-9.09,6.75-13.45,1.69-5.93,1.01-13.71,3.88-19.1.04-.07.07-.14.11-.21.33,5.4-.25,11.31-1.61,16.55Z"/>
<path class="cls-33" d="M515.6,253.76l.32-.1c1.78,1.41,1.1,5.81,2.89,6.84l.51-.35c-.57,1.18-1.2,2.37-1.72,3.57-.76-1.18-1.37-2.45-1.83-3.77.78-1.31.02-4.65-.16-6.2Z"/>
<path class="cls-12" d="M561.98,235.01c4.51-8.99,3.33-19.3,5.69-28.8.78-3.14,1.94-5.53,4.79-7.25-1.1,4.63-2.3,6.93-2.81,12.05-.71,7.03-.14,14.07-.61,21.09-.84,12.68-6.32,25.49-17.46,32.39-7.95,4.92-17.27,6.14-26.32,3.98-1.06-.25-3.64-.69-4.29-1.5.65-1.59,1.29-3.2,2.03-4.75l.18.28c.7.21,6.68-2.57,7.79-3.08,3.31-2.04,7.07-3.33,10.55-5.05,4.91-2.42,10.44-5.91,13.9-10.24,2.33-2.92,4.29-6.16,6.58-9.13Z"/>
<path class="cls-33" d="M530.95,259.43c3.31-2.04,7.07-3.33,10.55-5.05,4.91-2.42,10.44-5.91,13.9-10.24,2.33-2.92,4.29-6.16,6.58-9.13.62,3.76-2.26,9.67-4.43,12.72-4.19,5.87-12.74,10.07-19.74,11.19-2.35.37-4.7.18-6.85.51Z"/>
<path class="cls-17" d="M563.4,199.8c2.18-1.15,4.4-2.33,6.77-3.01-.05.28-.01.59-.15.84-.35.64-7.58,7.23-8.65,7.97-4.33,3-9.42,5.39-14.42,7-4.24,1.36-8.71,2.41-12.6,4.65-5.52,3.18-7.79,6.63-12.35,10.07-.49.37-.96.44-1.54.58-.03,0-.06.03-.1.04-3.61,6.35-5.11,14.45-5.1,21.68,0,1.09-.1,2.67.18,3.71.04.15.1.29.15.43.18,1.54.94,4.89.16,6.2-.43-.94-.87-1.88-1.25-2.84-3.97-10.14-3.61-22.53.79-32.48,4.58-10.38,14.23-16.37,24.94-19.1,8.17-2.08,14.98-2.51,23.15-5.72Z"/>
<path class="cls-24" d="M563.4,199.8c2.18-1.15,4.4-2.33,6.77-3.01-.05.28-.01.59-.15.84-.35.64-7.58,7.23-8.65,7.97-4.33,3-9.42,5.39-14.42,7-4.24,1.36-8.71,2.41-12.6,4.65-5.52,3.18-7.79,6.63-12.35,10.07-.49.37-.96.44-1.54.58-.03,0-.06.03-.1.04,1.03-2.67,2.83-4.67,4.68-6.81,9.4-10.95,16.44-9.91,28.57-14.41,4.19-1.55,8.23-3.8,12.07-6.06.48-.28,2.89-2.08,3-2.53-1.68.17-3.26,1.8-4.87,1.71-.14,0-.28-.03-.42-.04Z"/>
<path class="cls-34" d="M311.31,291.71c-.02.15-.03.3-.05.44-.17,1.21-1.04,2.63-1.56,3.75-1.49,3.2-5.07,9.9-5.31,13.21-.09,1.22.19,2.66.33,3.89.14,1.25.22,2.86.81,3.98.66.35.81.34,1.01,1.11.28,1.07.2,2.84,1.07,3.61.27.24.65.05.98,0,.6-.51.82-1.1,1.13-1.8.57-.34.87-.39,1.53-.25,1.17.25,2.28.81,3.48.95,3.28.39,7.18-1.12,10.32-1.98.11-.03.22-.05.34-.08l.04.78c1.04-.42,1.73-4.35,3.32-5.16-2.15,4.66-4.84,9.18-6.49,14.04-4.94,14.62-7.88,41.89-2.55,56.19,1.21,3.25,3.33,6.3,4.01,9.69l.3.09c.66,2.72,1.34,5.05,3.15,7.27l-.03.4c3.84,4.31,6.77,7.69,11.72,10.81,18.3,11.51,61.4,19.98,83.45,21.27,12.17.71,27.6.69,39.68-.78-4.69,2.37-11.14,2.91-16.3,3.85-8.44,1.53-16.68,2.16-25.22,2.78-7.91.58-15.88,1.25-23.81.65-9.17-.69-18.18-2.47-27.19-4.2-7.63-1.47-15.31-2.96-22.69-5.39-7.04-2.31-12.83-5.8-19.01-9.76-2.41-1.54-4.81-2.97-7.12-4.66-.86-.63-1.62-1.28-2.68-.76-1.46-1.45-2.83-2.93-4.15-4.51-.15-3.9-2.06-7.5-2.29-11.41-.34-5.71.08-11.55-.03-17.28-.23-12.09-1.73-28.9-4.54-40.5-1.25-9.43-1.34-18.96-2.6-28.42-.2-1.48-.64-3.42-.32-4.87.03-.11.06-.23.09-.34,1.2-4.84,4.5-12.38,7.22-16.6Z"/>
<path class="cls-33" d="M516.68,401.14c4.5,3.7,9.58,4.88,15.29,5.15-7.5,5.78-16.31,8.89-25.21,11.79-26.82,8.77-55.04,12.46-83.22,10.88-2.4-.49-5.09-.48-7.53-.67-5.38-.42-10.79-.76-16.15-1.39-9.74-1.15-20.03-3.06-29.44-5.85-4.9-1.45-9.78-3.36-14.58-5.12-4.23-1.55-9.78-3.35-13.13-6.38,5.05-.26,11.38,3.11,16.38,4.28,20.73,4.83,42.38,10.84,63.73,11.6,27.06.96,58.38-3.84,82.33-16.89,3.88-2.11,8.27-4.36,11.52-7.39Z"/>
<path class="cls-33" d="M517.92,297.99c1.4.66,2.65,1.57,3.94,2.44,2.98,2.86,6.03,5.67,8.67,8.86,9.26,11.21,13.68,25.21,16.17,39.31.63,3.58.46,7.43,1.21,10.93.04,9.32-.39,16.01-2.17,25.19-4.25-4.54-8.26-6.01-14.41-6.4,2.94-8.64,6.09-17.46,7.07-26.59.94-8.77.04-18.03-3.29-26.23-1.4-3.43-3.15-6.71-5.22-9.79-2.2-3.34-12.09-14.72-11.96-17.72Z"/>
<path class="cls-7" d="M531.32,378.32c6.16.39,10.16,1.86,14.41,6.4.7,5.96,1.68,9.17-2.09,14.49-3.34,3.96-7,5.26-11.67,7.08-5.71-.27-10.79-1.46-15.29-5.15v-.07c.09-.03.19-.06.28-.1,4.18-1.98,12.45-17.84,13.9-22.53l.45-.12Z"/>
<path class="cls-22" d="M547.9,359.53c.03-.98.07-1.94.19-2.92.68,3.37.28,15.3-.22,18.86-.26,1.85-1.26,4.35-1.08,6.17.07.77.7,1.36.72,2.16.03,1.05-1.06,1.7-1.12,2.72-.12,2.13.74,4.1.48,6.36l.21.19v-1.48s.38-.26.38-.26c.16.54.24,1.04.3,1.6.45-.59.23-1.41.83-1.66.14,1.86-2.31,5.84-3.55,7.23-.36.39-.74.69-1.18.99-1.49,2.73-3.73,4.42-6.03,6.44-3.29,2.88-6.79,5.75-10.56,7.98-7.07,4.17-16.69,7.29-24.57,9.6-10.03,2.94-20.49,4.51-30.85,5.76-3.5.42-6.97,1.01-10.48,1.36-6.51.64-13.43.88-19.96.89-5.09.01-10.21-.69-15.33-.73,3.19-1.21,11.25.26,14.91.39,4.81.17,9.8-.37,14.62-.59,1.46-.07,3.53.18,4.9-.16.66-.17,1.28-.74,1.57-1.34.05-.1.08-.21.12-.31l-.23-.43c-2.2-.46-5.05.46-7.31.66-2.4.21-4.83.26-7.24.37-8.85.4-17.57.58-26.41-.21.84-.18,1.65-.19,2.52-.21,28.17,1.58,56.4-2.11,83.22-10.88,8.9-2.9,17.71-6.01,25.21-11.79,4.68-1.82,8.34-3.12,11.67-7.08,3.77-5.32,2.79-8.53,2.09-14.49,1.78-9.18,2.21-15.87,2.17-25.19Z"/>
<path class="cls-38" d="M483.81,279.94c1.46-1.34,2.57-1.71,4.57-1.61,8.98.44,26.7,10.96,32.87,17.98.64.72,1.24,1.48,1.8,2.28-.38.61-.73,1.29-1.18,1.84-1.28-.87-2.54-1.77-3.94-2.44-6.52-3.52-12.73-7.24-20.06-8.93-2.93-.68-11.31-1.1-13.1-1.98-.98-.48-1.68-1.45-1.95-2.49-.44-1.72.14-3.17.99-4.64Z"/>
<path class="cls-10" d="M519.7,270.09c2.62,1.13,5.22,2.37,8.03,2.95-1.74-.12-8.71,2.01-9.8,3.24-.54.61-1.01,2.56-1.42,3.37-.2.39-.13.24-.21.74,1.75,1.56,4.29,1.44,6.5,1.31,3.87-.22,13.77-1.72,16.64.82.42.37.7.85.97,1.32.73,1.26,1.85,2.09,2.45,3.45.06.14.13.27.19.4.13.3.24.59.33.9l-.2.09c-1.65-2.69-2.93-5.82-6.24-6.69-6.49-1.72-13.48,1.27-20.02-.45-.5-.45-1-.86-1.42-1.39,1.84-3.08,2.94-6.74,4.2-10.08Z"/>
<path class="cls-22" d="M306.92,341.95c2.81,11.6,4.31,28.41,4.54,40.5.11,5.73-.3,11.57.03,17.28.23,3.91,2.14,7.51,2.29,11.41-2.68-1.78-5.03-5.44-6.68-8.14-1.41-2.31-3.42-5.61-3.62-8.36-.2-2.71.57-5.85.88-8.56.56-4.95.99-9.92,1.3-14.89.35-6.43.38-12.89.58-19.32.1-3.25-.08-6.74.68-9.91Z"/>
<path class="cls-22" d="M375.84,449.17c5.18,1.63,10.93,2.59,16.33,3.22,2.73.32,5.66.37,8.32,1.01,4.27,1.03,7.77,4.49,11.96,5.98,15.15,5.35,38.57,5.37,52.96-2.14,2.35-1.23,4.57-2.84,7.11-3.65,2.17-.69,4.58-.87,6.83-1.16,5.27-.69,13.21-1.33,18.09-3.3,2.26,5.27,4.68,10.53,6.61,15.93,7.76,21.81,14.39,53.31,5.43,75.46-5.5,13.6-15.95,23.21-29.37,28.83-25.06,10.49-61.57,10.1-86.61-.28-8.94-3.71-18.4-11.65-23.52-19.87-.86-1.33-1.69-2.68-2.48-4.06-.97-1.64-1.84-3.33-2.6-5.08-7.02-16.15-4.83-35.42-1.68-52.23,1.63-8.68,3.76-17.59,6.99-25.82,1.51-4.41,3.63-8.63,5.64-12.83Z"/>
<path class="cls-28" d="M424.5,473.26c5.1.02,10.19.1,15.28.24,12.08,1.49,35.24,7.67,44.69,15.14,1.9,12.01,1.8,23.01-3.15,34.33-1.2,2.74-2.54,5.51-4.31,7.94-7.76,10.65-27.58,18.79-40.4,20.71-6.5.97-13.39.76-19.95.55-2.87-.1-5.82-.49-8.68-.21-.7-.14-1.4-.29-2.1-.45-10.15-2.3-17.01-6.84-22.54-15.6-.87-1.77-1.67-3.55-2.33-5.41-4.8-13.49-3.53-29.39,2.55-42.24,2.42-4.41,5.42-5.68,9.8-7.52,9.09-4.23,21.17-6.82,31.13-7.47Z"/>
<path class="cls-48" d="M383.57,488.26c2.42-4.41,5.42-5.68,9.8-7.52.1.03.21.07.31.1,1.48.46,2.69.33,4.2.38,3.45.07,6.58,2.04,8.15,5.11,1.06,2.06,1.13,4.33.41,6.52-1.18,3.55-3.98,6.55-7.34,8.15-2.89,1.38-6.19,1.61-9.22.51-2.35-.86-4.73-2.8-5.74-5.13-1.15-2.64.18-5.48-.58-8.12Z"/>
<path class="cls-19" d="M375.84,449.17c5.18,1.63,10.93,2.59,16.33,3.22,2.73.32,5.66.37,8.32,1.01,4.27,1.03,7.77,4.49,11.96,5.98,15.15,5.35,38.57,5.37,52.96-2.14,2.35-1.23,4.57-2.84,7.11-3.65,2.17-.69,4.58-.87,6.83-1.16,5.27-.69,13.21-1.33,18.09-3.3,2.26,5.27,4.68,10.53,6.61,15.93,7.76,21.81,14.39,53.31,5.43,75.46-5.5,13.6-15.95,23.21-29.37,28.83-25.06,10.49-61.57,10.1-86.61-.28-8.94-3.71-18.4-11.65-23.52-19.87-.86-1.33-1.69-2.68-2.48-4.06l.44-.56c2.01-.64,4.73-1.75,6.83-1.35,2.48-1.64,6.68-2.17,7.57-2.78.09-.07.18-.14.28-.2l.99.44c.32.43.64.83.89,1.3,13.41,13.14,34.98,16.01,52.91,15.85,15.78-.14,34.4-2.44,47.46-12.04.46-.82,2.34-1.93,3.12-2.59,4.91-4.12,7.66-9.15,9.24-15.29,3.48-13.58,1.74-32.02-5.51-44.16-2.71-4.55-18.8-9.48-24.32-10.86-5.08-1.27-10.04-1.77-15.23-2.33-3.14-.34-6.25-.9-9.39-1.14-7.5-.6-15.46-.24-22.88.91-1.73.27-4.29.42-5.76,1.3l.15.3c-1.6.08-3.53-.36-5.13-.58-3.11-.67-6.29-1.06-9.42-1.63-9.91-1.8-20.21-3.84-29.53-7.71,1.51-4.41,3.63-8.63,5.64-12.83Z"/>
<path class="cls-8" d="M398.94,553.57c-4.39-2.76-11.93-5.31-14.37-10.23-.33-.66-.32-.71-.08-1.36,13.41,13.14,34.98,16.01,52.91,15.85,15.78-.14,34.4-2.44,47.46-12.04l.62.48c-2.49,4.59-12.69,8.14-17.3,9.5-14.99,4.4-39.17,5.14-54.52,2.05-3.18-.64-6.37-1.49-9.47-2.47-1.57-.49-3.71-1.61-5.27-1.77Z"/>
<path class="cls-33" d="M374.77,543.22c2.48-1.64,6.68-2.17,7.57-2.78.09-.07.18-.14.28-.2l.99.44c.32.43.64.83.89,1.3-.24.66-.25.7.08,1.36,2.44,4.92,9.97,7.47,14.37,10.23-2.55.01-8.13-3.77-10.16-5.32-.79-.6-3.11-3.09-3.9-3.24-3.42-.65-7.32,1.64-10.63,2.32-1.37.28-3.28-.33-4.41.43.4.58,3.3,1.84,4.49,3.06l-.02.28c-1.06-.3-1.38-1.28-2.27-1.82-.73-.45-1.26-.24-2.05-.1-.86-1.33-1.69-2.68-2.48-4.06l.44-.56c2.01-.64,4.73-1.75,6.83-1.35Z"/>
<path class="cls-29" d="M370.2,462c9.33,3.88,19.62,5.92,29.53,7.71,3.13.57,6.31.96,9.42,1.63l-.37.14c-1.27.48-2.65.74-3.95,1.17-5.95,1.95-17.32,5.54-21.8,9.8-1.13,1.07-1.98,2.44-2.64,3.85-1.03,2.2-1.68,4.56-2.35,6.88-3.48,12.01-4.29,25.5.13,37.36,1.03,2.76,2.27,5.9,4.14,8.2l1.29,1.94-.99-.44c-.09.07-.18.14-.28.2-.9.61-5.1,1.14-7.57,2.78-2.1-.4-4.82.71-6.83,1.35l-.44.56c-.97-1.64-1.84-3.33-2.6-5.08-7.02-16.15-4.83-35.42-1.68-52.23,1.63-8.68,3.76-17.59,6.99-25.82Z"/>
<path class="cls-48" d="M377.21,469.06c1.03-.15,2.02,0,3.05.09.74,3.82,1.12,7.6-.1,11.36l-2.01,1.62c-.95.99-2.63,1.54-3.87,2.12-.77-.44-1.55-.87-2.29-1.35-1.47-.95-2.59-2.38-2.94-4.12-.39-1.96.27-4.03,1.35-5.66,1.76-2.66,3.83-3.49,6.8-4.05Z"/>
<path class="cls-43" d="M377.21,469.06c1.03-.15,2.02,0,3.05.09.74,3.82,1.12,7.6-.1,11.36l-2.01,1.62c.66-.78.87-1.45,1.09-2.44l.1-.47c.96-4.43-1.13-5.16-1.41-8.51-.01-.12,0-.25,0-.38-.06-.8-.11-.78-.71-1.27Z"/>
<path class="cls-48" d="M368.92,492.73c-.49-.39-1.04-.78-1.41-1.29-.78-1.08-1.07-2.72-.88-4.02.18-1.25.75-2.53,1.83-3.24.64-.42,1.37-.55,2.11-.34.98.28,1.38.95,1.84,1.77.18.33.3.84.68.94.37.11.71.09,1.1.08.82-.02,1.21,0,1.94.37.44.64.58,1.05.41,1.82-.36,1.64-1.77,3.4-3.21,4.22-.4.23-.81.42-1.22.62-1.05-.32-2.1-.67-3.17-.93Z"/>
<path class="cls-43" d="M372.41,485.61c.18.33.3.84.68.94.37.11.71.09,1.1.08.82-.02,1.21,0,1.94.37.44.64.58,1.05.41,1.82-.36,1.64-1.77,3.4-3.21,4.22-.4.23-.81.42-1.22.62-1.05-.32-2.1-.67-3.17-.93.88-.3,1.84-1.19,2.62-1.75.76-1.79.88-3.47.86-5.38Z"/>
<path class="cls-24" d="M372.41,485.61c.18.33.3.84.68.94.37.11.71.09,1.1.08-1.48,1.46-.56,4.26-2.11,4.62l-.53-.27c.76-1.79.88-3.47.86-5.38Z"/>
<path class="cls-43" d="M385.34,469.66c.16.02.32.04.48.06,1.6.21,2.17.99,3.09,2.24.11,1.42.31,3.47-.25,4.78-.3.7-.55.8-1.24,1.08-1.1-.02-2.26.02-3.11-.79-.69-.66-1.05-1.71-1.05-2.65,0-1.66.91-3.58,2.07-4.72Z"/>
<path class="cls-33" d="M439.78,473.5c5.22.08,10.34-.18,15.54.48,6.22.8,28.82,7.07,33.15,11.52,5.85,6,8.21,23.04,7.88,31.12-.38,9.42-3.43,19.98-10.64,26.53-3.12,2.84-7.22,4.68-11.1,6.23-14.36,5.71-29.92,7.39-45.27,6.56-7.09-.39-14.91-.76-21.35-3.99,2.86-.28,5.81.12,8.68.21,6.56.21,13.44.42,19.95-.55,12.82-1.91,32.64-10.06,40.4-20.71,1.77-2.43,3.11-5.2,4.31-7.94,4.95-11.32,5.05-22.32,3.15-34.33-9.45-7.47-32.61-13.65-44.69-15.14Z"/>
<path class="cls-33" d="M409.16,471.35c1.6.22,3.53.66,5.13.58,2.23.39,4.52,1.03,6.76,1.26,1.15.12,2.31,0,3.46.08-9.96.65-22.04,3.24-31.13,7.47-4.38,1.84-7.38,3.12-9.8,7.52-6.08,12.85-7.35,28.75-2.55,42.24.66,1.86,1.46,3.64,2.33,5.41-.11-.07-.22-.13-.33-.2-2.98-2.05-4.73-13.6-5.12-16.98-.68-5.94-.12-17.38,2.03-22.88.41-1.05,2.06-4.1,1.42-4.96-.67.13-1.08.43-1.63.81-.11-.12-.22-.25-.33-.38-.08-.08-.16-.15-.24-.23-.75,1.38-.92,3.19-1.3,4.72-2.58,10.28-3.28,21.35-.28,31.64.98,3.37,4.28,8.83,4.75,11.29-1.87-2.3-3.11-5.45-4.14-8.2-4.43-11.86-3.61-25.35-.13-37.36.67-2.32,1.33-4.68,2.35-6.88.66-1.41,1.51-2.77,2.64-3.85,4.48-4.26,15.85-7.85,21.8-9.8,1.3-.43,2.68-.68,3.95-1.17l.37-.14Z"/>
<path class="cls-5" d="M479.28,606.16c2.47-1.17,4.81-2.61,7.26-3.82,5.2-2.57,11.43-4.53,17.24-4.93,7.36-.51,18.75,1.68,24.43,6.63,6.45,5.1,10.33,10.77,11.29,19.09.52,4.48-.36,13.37-3.16,16.9-.86,1.09-2.14,1.83-3.42,2.35-6.23,4.01-16.88,6.14-24.22,6.37-15.8.49-34.67-3.22-46.51-14.43-4.81-4.55-7.1-6.9-7.26-13.83-.16-6.71,1.42-14.36,6.18-19.37,6.18,4.8,10.83,4.32,18.16,5.05Z"/>
<path class="cls-10" d="M528.22,604.04c6.45,5.1,10.33,10.77,11.29,19.09.52,4.48-.36,13.37-3.16,16.9-.86,1.09-2.14,1.83-3.42,2.35-.11-.32-.15-.39-.13-.78.05-.99,3.05-9.98,3.58-12.21,2.68-11.32-2.65-15.11-7.92-23.95-.4-.68-.43-.68-.24-1.41Z"/>
<path class="cls-31" d="M513.1,605.24c3.76-.54,7.93-.54,11.11,1.93,3.3,2.56,4.64,7.61,5.02,11.59.52,5.43-.05,12.45-3.7,16.79-2.42,2.87-6.23,5.33-9.99,5.75-1.2.14-2.49.03-3.69-.03-6.98,1.98-19.27.65-26.07-1.6-6.76-2.24-13.73-6.59-16.93-13.23-1.22-2.54-1.21-5.42-.32-8.05.68-2.31,1.95-4.08,3.77-5.63,1.02-.88,2.16-1.6,3.39-2.14,3-1.33,11.15-3.11,14.36-2.83l3.81-1.27c2.41-.66,4.7-1,7.19-1.07,3.74-.76,8.21-.38,12.05-.2Z"/>
<path class="cls-24" d="M490.06,607.78l3.81-1.27c3.03,1.76,5.17,3.53,6.13,7.08.73,2.68.48,5.3-.93,7.7-1.48,2.51-4.01,4.7-6.89,5.4-1.68.41-3.41.19-4.86-.77-1.72-1.15-3-3.3-3.37-5.33-.6-3.29.86-6.71,2.77-9.33,1-1.37,2.22-2.26,3.35-3.48Z"/>
<path class="cls-48" d="M491.28,611.52c.96,0,1.88-.01,2.65.64,1.46,1.24,1.33,3.74,1.44,5.48-.33.7-.67,1.4-1.08,2.05-1.24,1.93-2.57,2.67-4.77,3.16-2.26-.65-3.15-1.7-4.4-3.59.42-1.46.99-3.06,1.72-4.4,1.06-1.95,2.37-2.72,4.43-3.34Z"/>
<path class="cls-21" d="M493.86,606.51c2.41-.66,4.7-1,7.19-1.07.93.1,1.73.04,2.51.58,1.21,2.32.7,6.87-.12,9.32-1.18,3.52-6.09,9.71-9.38,11.22-1.75.8-3.77,1.08-5.58.31-3.27-1.38-3.13-4.6-5.97-3.92-.46-.31-.95-.62-1.17-1.15.03-.61,0-1.24-.18-1.82-.28-.93-.84-1.76-1.71-2.21-1.71-.89-3.56-.51-5.3.04.21-.49.13-.45.62-.77l-.16-.48c-.98.08-1.51.52-2.5.28-.47-.68-.53-1.12-.38-1.94.05-.28.12-.55.19-.83l-.25-.08.21.27-.02.08c-.83.12-1.04.67-1.51,1.32-.64.88-1.11,1.95-1.83,2.74.68-2.31,1.95-4.08,3.77-5.63,1.02-.88,2.16-1.6,3.39-2.14,3-1.33,11.15-3.11,14.36-2.83-1.12,1.22-2.34,2.11-3.35,3.48-1.91,2.62-3.37,6.04-2.77,9.33.37,2.02,1.65,4.18,3.37,5.33,1.45.97,3.18,1.18,4.86.77,2.88-.7,5.41-2.89,6.89-5.4,1.42-2.4,1.66-5.02.93-7.7-.96-3.55-3.1-5.32-6.13-7.08Z"/>
<path class="cls-10" d="M513.1,605.24c3.76-.54,7.93-.54,11.11,1.93,3.3,2.56,4.64,7.61,5.02,11.59.52,5.43-.05,12.45-3.7,16.79-2.42,2.87-6.23,5.33-9.99,5.75-1.2.14-2.49.03-3.69-.03,1.28-.48,2.64-.97,3.83-1.65,4.46-2.51,8.08-7.73,9.4-12.61,1.16-4.3,1.37-11.43-.99-15.3-1.8-2.96-7.7-5.73-10.99-6.46Z"/>
<path class="cls-30" d="M474.16,617.8c1.74-.55,3.59-.93,5.3-.04.87.46,1.43,1.28,1.71,2.21.17.58.21,1.21.18,1.82-.08.22-.15.44-.24.67-.66,1.73-1.97,3.03-3.69,3.73-1.06.43-2.33.56-3.39.06-1.65-.79-2.23-2.26-2.8-3.87.62-2.15,1.2-3.14,2.93-4.58Z"/>
<path class="cls-6" d="M365.98,598.13c1.46-.82,11.59-.35,13.53.2,3.09.86,6.06,2.51,8.94,3.89,2.85,1.38,5.74,2.65,8.68,3.82,6.75.24,13.65-.55,18.98-5.05,5.22,6.82,7.54,13.97,6.44,22.58-.69,5.36-4.89,9.73-9.04,12.89-13.38,10.15-33.92,14.08-50.4,11.71-7.88-1.13-16.41-3.54-22.49-8.91-1.54-4.85-3.4-11.53-2.24-16.6.88-5.2,2.76-9.39,6.11-13.47,3.42-3.85,7.33-6.49,12.07-8.49l.34-.39c3.03-1.07,5.89-1.91,9.09-2.18Z"/>
<path class="cls-2" d="M365.98,598.13l4.08.1c4.51,1.09,11.98,5,14.46,8.95,2.36,3.76,2.79,9.64,1.73,13.91-1.38,5.53-5.34,9.68-10.16,12.5-7.12,4.15-16.09,5.55-24.06,3.34-5.02-1.39-9.36-4.24-11.91-8.89-.9-1.64-1.75-3.48-1.75-5.38.88-5.2,2.76-9.39,6.11-13.47,3.42-3.85,7.33-6.49,12.07-8.49l.34-.39c3.03-1.07,5.89-1.91,9.09-2.18Z"/>
<path class="cls-48" d="M344.48,609.18c3.42-3.85,7.33-6.49,12.07-8.49.66.36,1.3.67,2,.93.4.15.79.23,1,.64,1.12,2.16.41,5.63-.48,7.74-1.31,3.14-5.09,7.34-8.34,8.56-.25.09-.36.11-.63.17-1.49.1-2.95-.05-4.28-.79-3.34-1.86-.54-6.37-1.17-8.32-.05-.15-.11-.3-.17-.46Z"/>
<path class="cls-24" d="M356.55,600.69l.34-.39c2.01.5,4.34,1.53,5.49,3.33,1.24,1.94,1.28,4.69.73,6.87-.75,2.96-2.96,5.1-5.55,6.56-2.54,1.43-4.61,1.67-7.45,1.68.27-.07.39-.08.63-.17,3.24-1.22,7.03-5.43,8.34-8.56.88-2.12,1.6-5.58.48-7.74-.21-.41-.6-.49-1-.64-.7-.26-1.34-.58-2-.93Z"/>
<path class="cls-4" d="M365.98,598.13c1.46-.82,11.59-.35,13.53.2,3.09.86,6.06,2.51,8.94,3.89,2.85,1.38,5.74,2.65,8.68,3.82-2.61.29-9.34-3.18-12.02-4.16-3.69-1.35-7.75-2.92-11.64-3.57-1.1-.18-2.3-.1-3.41-.08l-4.08-.1Z"/>
<path class="cls-30" d="M400.38,617.24c.86-.08,1.63.07,2.45.37,1.31.47,2.33,1.48,2.89,2.74.54,1.21.58,2.64.04,3.85-.56,1.27-1.73,2.07-3,2.51-1.04-.04-2-.13-2.97-.53-1.38-.57-2.55-1.71-3.03-3.13-.4-1.12-.32-2.35.21-3.41.74-1.47,1.96-1.89,3.42-2.4Z"/>
<path class="cls-23" d="M556.08,512.85c1.69-1.09,3.53-1.97,5.31-2.9,7.78,7.43,12.65,17.34,12.93,28.2.2,7.51-2.49,13.66-7.63,19.08-3.89,4.1-10.01,8.04-15.86,8.05-1.07,0-1.79-.21-2.62-.87-1.14-2.06-.55-5.84,0-8.11.02-.09.06-.17.09-.26.47-4.2,1.21-10.75-.38-14.74-.43-1.08-1.15-2.1-2.27-2.51-.8-.3-1.68-.29-2.46.07-2.66,1.24-3.71,5.78-4.6,8.37-.18.62-.42,1.28-.49,1.92-.07.23-.14.46-.21.68-.63,2-1.38,3.79-3.41,4.75-1.21.57-2.64.57-3.88.1-2.48-.93-3.88-3.22-4.86-5.55-1.27-3.05-1.81-6.67-1.39-9.95.29-2.5.73-4.89,1.43-7.31.49-1.46,1.06-2.87,1.64-4.3.85-1.65,1.5-3.44,2.2-5.15.88-.19,1.8-.27,2.69-.4,1.9-.47,3.8-.93,5.67-1.52l.58-.39c2.24.05,9.61-3.17,11.9-4.23,1.92-.92,3.78-2.01,5.64-3.03Z"/>
<path class="cls-22" d="M556.08,512.85c1.69-1.09,3.53-1.97,5.31-2.9,7.78,7.43,12.65,17.34,12.93,28.2.2,7.51-2.49,13.66-7.63,19.08-3.89,4.1-10.01,8.04-15.86,8.05-1.07,0-1.79-.21-2.62-.87-1.14-2.06-.55-5.84,0-8.11.02-.09.06-.17.09-.26.28.18.28.22.62.29,2.2.48,5.48-1.29,7.33-2.46,3.17-2.01,5.76-4.97,6.5-8.74,1.48-7.48-1.73-17.77-5.77-24.05l.39-.2c.35-.77-.83-5.02-.85-6.33-.01-.73-.05-1.07-.43-1.71Z"/>
<path class="cls-48" d="M532.29,522.03c1.9-.47,3.8-.93,5.67-1.52.59,1.08-.14,3.86-.5,5.12-.36,1.27-.82,2.55-1.41,3.74-.38.76-1.12,1.74-1.34,2.53-.66,1.63-1.37,2.4-2.74,3.46l-.29.22c-.09.06-.17.12-.26.17-1.02.56-2.24.02-3.27-.28-.94-1.12-1.94-2.16-2.37-3.59.49-1.46,1.06-2.87,1.64-4.3.85-1.65,1.5-3.44,2.2-5.15.88-.19,1.8-.27,2.69-.4Z"/>
<path class="cls-21" d="M525.76,531.88c.49-1.46,1.06-2.87,1.64-4.3.3.47.67.96.91,1.46-.19,1.32.08,2.35.45,3.6-.18.74-.37,1.34-.19,2.1.69.76,1.27.75,2.27.8.28.01.55.02.83.03-.09.06-.17.12-.26.17-1.02.56-2.24.02-3.27-.28-.94-1.12-1.94-2.16-2.37-3.59Z"/>
<path class="cls-24" d="M534.7,531.89c-.66,1.63-1.37,2.4-2.74,3.46l-.29.22c-.27,0-.55-.02-.83-.03-1-.05-1.58-.04-2.27-.8-.17-.76.01-1.36.19-2.1.15.13.23.23.42.33,1.35.7,4.11-.66,5.52-1.08Z"/>
<path class="cls-43" d="M532.29,522.03c-.41.72-.83,1.41-1.31,2.09-1.07,1.54-1.72,3.08-2.51,4.73-.04.07-.11.12-.16.19-.23-.5-.61-.99-.91-1.46.85-1.65,1.5-3.44,2.2-5.15.88-.19,1.8-.27,2.69-.4Z"/>
<path class="cls-12" d="M524.33,539.18c.12.1.24.2.35.3.41.36.64.74.92,1.21,1.59,2.67,5.24,5.93,8.32,6.63,1.55.35,3.15.39,4.66-.1-.18.62-.42,1.28-.49,1.92-.07.23-.14.46-.21.68-.63,2-1.38,3.79-3.41,4.75-1.21.57-2.64.57-3.88.1-2.48-.93-3.88-3.22-4.86-5.55-1.27-3.05-1.81-6.67-1.39-9.95Z"/>
<path class="cls-22" d="M525.73,549.13c2.78-.01,5.51,1.43,8.33,1.68,1.32-.59,2.64-1.23,4.03-1.66-.07.23-.14.46-.21.68-.63,2-1.38,3.79-3.41,4.75-1.21.57-2.64.57-3.88.1-2.48-.93-3.88-3.22-4.86-5.55Z"/>
<path class="cls-21" d="M537.96,520.51l.58-.39c1.88,1.29,2.91,5.13,3.28,7.32.1.59.14,1.04,0,1.62-1.37,1.78-3.59,1.66-5.33,2.81-1.67,1.1-2.59,2.76-4.54,3.49,1.37-1.06,2.09-1.83,2.74-3.46.22-.79.96-1.76,1.34-2.53.59-1.19,1.05-2.47,1.41-3.74.36-1.26,1.09-4.04.5-5.12Z"/>
<path class="cls-10" d="M556.08,512.85c.38.63.41.97.43,1.71.02,1.31,1.2,5.56.85,6.33l-.39.2c-.93-1.34-1.73-3.02-2.96-4.1-.08-.07-.16-.13-.24-.2-.9-.75-2.21-.76-3.34-.91,1.92-.92,3.78-2.01,5.64-3.03Z"/>
<path class="cls-1" d="M311.45,511.68c.61-.4.91-.72,1.7-.64,1.74.18,4.43,2.19,6,3.08,5.49,2.39,10.88,4.71,16.59,6.54.83.14,1.63.31,2.48.23,2.16.4,4.34.76,6.48,1.29,4.42,6.13,6.57,15.5,5.41,22.96-.47,3.05-1.71,6.7-4.31,8.55-1.56,1.11-3.6,1.44-5.46,1.05-1.16-.24-2.18-1.18-2.79-2.16-.51-.82-.94-1.71-1.2-2.64-1.63-3.83-2.06-7.51-4.73-10.92-1.1-.43-2.18-.72-3.33-.29-.43.16-.75.45-1.09.74-2.86,4.96-1.38,12.16-.52,17.5.29,1.8.75,3.82.4,5.63-.18.89-.61,1.52-1.36,2.01-1.38.89-3.17.73-4.7.42-6.5-1.32-12.86-6.2-16.44-11.68-3.8-5.82-4.9-13.21-3.46-19.95.37-3.21,1.28-6.2,2.44-9.19,1.49-4.59,4.73-8.96,7.9-12.52Z"/>
<path class="cls-42" d="M335.74,520.65c.83.14,1.63.31,2.48.23,2.16.4,4.34.76,6.48,1.29,4.42,6.13,6.57,15.5,5.41,22.96-.47,3.05-1.71,6.7-4.31,8.55-1.56,1.11-3.6,1.44-5.46,1.05-1.16-.24-2.18-1.18-2.79-2.16-.51-.82-.94-1.71-1.2-2.64-1.63-3.83-2.06-7.51-4.73-10.92,1.2-.68,2.9-.41,4.19-.06.46.12.84.31,1.26.53.74.37.62.72,1.12,1.15.4.35.48.23.93.17.8-.86.85-2.11,1.48-3.14.04-.07.09-.14.13-.22.59-2.17.34-5.23.02-7.48-.59-4.08-1.64-6.82-5.01-9.33Z"/>
<path class="cls-10" d="M335.74,520.65c.83.14,1.63.31,2.48.23l-.4.53c.27.34.48.55.82.82.57.45.86,1.09,1.23,1.7.29.48.16.31.63.68l.28-.23c2.45,5.61,3.59,11.1,1.27,16.98-1.24,3.14-3.33,6.18-5.69,8.58-1.63-3.83-2.06-7.51-4.73-10.92,1.2-.68,2.9-.41,4.19-.06.46.12.84.31,1.26.53.74.37.62.72,1.12,1.15.4.35.48.23.93.17.8-.86.85-2.11,1.48-3.14.04-.07.09-.14.13-.22.59-2.17.34-5.23.02-7.48-.59-4.08-1.64-6.82-5.01-9.33Z"/>
<path class="cls-12" d="M337.07,539.49c.74.37.62.72,1.12,1.15.4.35.48.23.93.17.8-.86.85-2.11,1.48-3.14.04-.07.09-.14.13-.22-.38,2.09-1.02,3.92-1.79,5.89-.6-1.3-1.23-2.58-1.87-3.86Z"/>
<path class="cls-10" d="M327.21,539.48c-2.86,4.96-1.38,12.16-.52,17.5.29,1.8.75,3.82.4,5.63-.18.89-.61,1.52-1.36,2.01-1.38.89-3.17.73-4.7.42-6.5-1.32-12.86-6.2-16.44-11.68-3.8-5.82-4.9-13.21-3.46-19.95-.26,5.42,5.34,15.41,8.93,19.34,2.67,2.91,6.56,3.76,10.37,3.9,1.37.05,2.74-.09,4.1-.24-.7-4.61-1.96-12.84.94-16.92.49-.26.75-.48,1.32-.25.16.06.29.17.44.25Z"/>
<path class="cls-48" d="M310.32,517.55c1.25-.34,2.77-.93,4.02-.47,1.4.84,2.71,1.48,3.15,3.18.58,2.25-1.1,4.97-2.28,6.81-.05.07-.09.14-.14.21-1.05,1.15-2.27,2.43-3.59,3.26-.29-.03-.57-.07-.86-.11-1.08-.12-1.93-.4-2.94-.8-.46-.18-.9-.34-1.28-.67-.71-.63-.91-1.53-.86-2.44.17-2.9,2.68-7.01,4.78-8.96Z"/>
<path class="cls-24" d="M311.45,511.68c.61-.4.91-.72,1.7-.64,1.74.18,4.43,2.19,6,3.08l-1.18.87c-1.01-.17-2.48-.5-3.38.06-.52.92-.21,1.08-.24,2.04-1.25-.46-2.78.13-4.02.47-2.1,1.96-4.61,6.06-4.78,8.96-.05.91.15,1.81.86,2.44.38.34.82.49,1.28.67-.49.46-.58.57-1.29.58-.29,0-.67-.09-.95-.14-.57.5-.5.88-.63,1.62-.62-1.56-1.37-4.55-1.18-6.24.05-.49.03-.77-.08-1.24,1.49-4.59,4.73-8.96,7.9-12.52Z"/>
<path class="cls-21" d="M311.45,511.68c.61-.4.91-.72,1.7-.64,1.74.18,4.43,2.19,6,3.08l-1.18.87c-1.75-1.01-3.99.03-5.96-.79l-.11-.36c.48-.51,1.07-.97,1.23-1.68-.57-.45-.97-.4-1.68-.48Z"/>
<path class="cls-43" d="M307.69,529.63c1.01.41,1.86.69,2.94.8.29.03.57.07.86.11-.83.09-1.6.2-2.4.45-.14,1.04.94,1.16.38,3.05-.25.25-.54.45-.82.67-.47,0-.86-.03-1.29-.23-1.18-.56-2.1-1.56-2.54-2.8.13-.73.06-1.12.63-1.62.28.05.66.15.95.14.71,0,.79-.12,1.29-.58Z"/>
<path class="cls-24" d="M315.08,527.28c-.35,1.51-.79,3.01-.77,4.56,0,.31,0,.61,0,.92-1.36.22-2.6.44-3.9.93l-.95.35c.57-1.89-.52-2.02-.38-3.05.8-.25,1.56-.36,2.4-.45,1.32-.83,2.54-2.11,3.59-3.26Z"/>
<path class="cls-22" d="M521.77,490.68c-2.44-3.23-6.17-8.82-7.52-12.54-1.69-4.67-2.54-9.59-4.25-14.27-1.18-3.25-3.23-6.59-3.99-9.9.27-.67.76-.98,1.4-1.27.63-.29,1.32-.51,1.98-.72,17.71,5.45,32.81,23.17,41.28,39.18,1.35,2.57,2.69,5.21,3.57,7.98-3.98,1.7-7.5,4.11-11.61,5.61-4.35,1.91-8.99,3.07-13.74,3.42-2.46-5.79-4.52-11.74-7.13-17.47Z"/>
<path class="cls-21" d="M524.44,487.12c3.12-.03,5.78-.04,8.6,1.55,3.61,3.3,5.74,7.1,7.64,11.57.62,1.47,1.16,3.12,1.95,4.5-4.35,1.91-8.99,3.07-13.74,3.42-2.46-5.79-4.52-11.74-7.13-17.47.53-.33.75-.39.98-.98.47-1.21.64-1.75,1.69-2.59Z"/>
<path class="cls-10" d="M524.44,487.12c.92-1.4,2-2.83,3.73-3.23,1.35-.31,2.45.18,3.68.67.27.63.53,1.26.81,1.88.38.85.46,1.3.39,2.23-2.83-1.59-5.48-1.58-8.6-1.55Z"/>
<path class="cls-27" d="M353.16,457.87c2.47-2.05,9.12-5.91,12.47-5.33.71.12.99.34,1.43.89.28.84.21,1.39-.04,2.24-1.22,4.15-3.44,8.05-4.85,12.15-1.5,4.36-1.87,9.42-3.96,13.52-1.48,2.91-3.67,5.44-5.23,8.32-3.13,5.75-5.09,12.15-7.19,18.33-4.13-.36-7.95-1.05-11.91-2.31-3.11-1.39-6.41-2.1-9.27-4.07l-3.86-2.14c.43-2.04,1.25-3.74,2.15-5.61,1.03-2.81,2.67-5.58,4.14-8.19l1.59-2.4c.73-1.17,1.52-2.29,2.3-3.43,1.97-2.65,3.93-5.29,6.11-7.78l3.73-4.1,1.9-1.89c3.26-3,6.61-5.97,10.48-8.18Z"/>
<path class="cls-49" d="M353.16,457.87c2.47-2.05,9.12-5.91,12.47-5.33.71.12.99.34,1.43.89.28.84.21,1.39-.04,2.24-1.22,4.15-3.44,8.05-4.85,12.15-1.5,4.36-1.87,9.42-3.96,13.52-1.48,2.91-3.67,5.44-5.23,8.32-3.13,5.75-5.09,12.15-7.19,18.33-4.13-.36-7.95-1.05-11.91-2.31,3.13-7.83,7.05-15.33,11.71-22.36,1.65-2.5,3.65-4.68,5.2-7.27.96-1.6,1.58-3.33,2.48-4.96l.37.06.74,1.14.14-.28c-.11-.29-.29-.68-.35-1-.19-.99,1.03-2.46,1.58-3.26l.2.02c.06,2.74-1.25,4.73-1.56,7.3,1.71-3.11,1.53-6.45,2.81-9.64.89-2.22,2.79-4.29,3.25-6.64.16-.82.16-1.41-.31-2.12-.46-.35-.72-.46-1.27-.49-.42-.03-.79-.07-1.2-.17l-.43-.11c-1.28.8-2.57,1.76-4.08,2Z"/>
<path class="cls-48" d="M340.78,467.94l1.19.79c.76-.21,1.12-.14,1.86.05.61.56.77.94.8,1.78.07,2.74-1.9,5.98-3.88,7.82-.6.56-1.29,1.06-1.98,1.5-.79-.31-1.62-.57-2.32-1.06l-.21.55c.45.76,1.02,1.44,1.45,2.2-.9,1.74-1.2,2.99-3.06,3.88-1.35-.99-1.65-2.4-2.42-3.81l-.62.38c-.29-.73-.5-1.42-.66-2.18,1.97-2.65,3.93-5.29,6.11-7.78l3.73-4.1Z"/>
<path class="cls-8" d="M337.05,472.03l.02,2.04c-.69.88-.9,1.82-1.21,2.88-.37.43-.71.8-1.13,1.18-1,.9-1.81,2.34-2.51,3.49l-.62.38c-.29-.73-.5-1.42-.66-2.18,1.97-2.65,3.93-5.29,6.11-7.78Z"/>
<path class="cls-43" d="M340.78,467.94l1.19.79c-1.39,1.96-3.27,3.59-4.9,5.35l-.02-2.04,3.73-4.1Z"/>
<path class="cls-21" d="M328.64,483.24c.73-1.17,1.52-2.29,2.3-3.43.16.77.37,1.45.66,2.18l.62-.38c.77,1.41,1.07,2.82,2.42,3.81-.62.36-1.13.6-1.46,1.28l-.05.79c.3.73.46,1.01.15,1.76-.42,1.03-1.74,2.25-2.8,2.6-.26.09-.31.07-.54.07-1.06.78-2.33,3.27-2.52,4.55-.01.08-.01.16-.02.24-.05-.21-.06-.33-.19-.53-.92-1.42-2.79-1.85-4.29-2.35,1.03-2.81,2.67-5.58,4.14-8.19l1.59-2.4Z"/>
<path class="cls-24" d="M331.6,482l.62-.38c.77,1.41,1.07,2.82,2.42,3.81-.62.36-1.13.6-1.46,1.28l-.05.79c.3.73.46,1.01.15,1.76-.42,1.03-1.74,2.25-2.8,2.6-.26.09-.31.07-.54.07-.68-.93-1.29-1.59-1.27-2.79-.09-.48-.24-.95-.36-1.42.18-.91.57-1.68.96-2.51.4-.62.83-1.23,1.25-1.83.45-.28.78-.94,1.08-1.38Z"/>
<path class="cls-48" d="M330.52,483.37c1.06,1.16,2.29,2.51,2.51,4.14-.66.84-1.14,1.48-2.25,1.63-.71.1-1.41.06-2.12,0-.09-.48-.24-.95-.36-1.42.18-.91.57-1.68.96-2.51.4-.62.83-1.23,1.25-1.83Z"/>
<path class="cls-21" d="M342.68,466.05h.28c1.95-.01,5.06-.81,6.8-.04.05.82-.36.75-.57,1.41-.3.95.52,1.95.02,2.88-.86-.12-1.42-1.19-2.13-1.06-.07,1.18.88,1.72.62,2.69-.78.56-1.46.48-2.4.47,0,.09-.02.18-.03.27-.29,2.25-4.83,7.25-6.85,8.58-.3.2-.42.21-.73.3-.43-.76-1-1.44-1.45-2.2l.21-.55c.7.49,1.53.75,2.32,1.06.69-.45,1.37-.94,1.98-1.5,1.97-1.83,3.95-5.08,3.88-7.82-.02-.83-.19-1.22-.8-1.78-.74-.18-1.1-.26-1.86-.05l-1.19-.79,1.9-1.89Z"/>
<path class="cls-48" d="M322.91,493.84c1.5.51,3.37.94,4.29,2.35.13.2.14.32.19.53-.78,1.67-1.54,3.48-2.78,4.86l-3.86-2.14c.43-2.04,1.25-3.74,2.15-5.61Z"/>
<path class="cls-32" d="M283.59,316.64c2.12-1.89,4.47-3.12,7.14-4.06-2.1,10.86-3.23,21.88-3.39,32.94-.04,8.67-.04,17.4.92,26.03.72,2.96.75,6.3,1.12,9.34.32,2.66.97,5.52,1.04,8.18.14.97.23,1.94.33,2.92-3.07-.54-5.61-1.32-8.05-3.4-7.02-6.01-9.42-18.41-10.11-27.12-.02-2.07-.36-4.16-.45-6.24-.39-10.37.27-20.6,5.21-29.96,1.57-3.26,3.4-6.33,6.24-8.63Z"/>
<path class="cls-22" d="M272.59,361.47l.5-.27c1.28.77,1.91,2.86,2.26,4.26,1.04,2.65,2.86,4.83,5.5,6.01,1.77.79,5.04,1.57,6.84.57.22-.12.43-.28.57-.48.72,2.96.75,6.3,1.12,9.34.32,2.66.97,5.52,1.04,8.18.14.97.23,1.94.33,2.92-3.07-.54-5.61-1.32-8.05-3.4-7.02-6.01-9.42-18.41-10.11-27.12Z"/>
<path class="cls-10" d="M272.59,361.47l.5-.27c1.28.77,1.91,2.86,2.26,4.26l-.48.57c.16,1.44,4.36,13.4,5.12,14.96.72,1.46,1.84,3.49,3.17,4.46,1.89,1.38,4.68,2.5,6.91,3.17l.35.45c.14.97.23,1.94.33,2.92-3.07-.54-5.61-1.32-8.05-3.4-7.02-6.01-9.42-18.41-10.11-27.12Z"/>
<path class="cls-33" d="M272.14,355.23c.2-.5.46-.97.72-1.45l.4-.11,1.05.85c2.47.39,8.57,1.22,10.83.48.34-.11.59-.13.95-.11.81.74.72,1.64.88,2.69.73-3.41-.73-8.81.25-11.8.03-.08.07-.16.11-.25-.04,8.67-.04,17.4.92,26.03-.15.2-.36.36-.57.48-1.8,1-5.07.22-6.84-.57-2.64-1.18-4.46-3.35-5.5-6.01-.35-1.41-.97-3.49-2.26-4.26l-.5.27c-.02-2.07-.36-4.16-.45-6.24Z"/>
<path class="cls-48" d="M283.59,316.64c1.18.27,2.31.38,3.52.47-.83,5.49-1.59,10.83-3.19,16.17-.84.65-1.67,1.3-2.5,1.96-.98-.32-2.01-.59-2.96-.97-1.71-4.09-.2-5.4-1.1-9,1.57-3.26,3.4-6.33,6.24-8.63Z"/>
<path class="cls-48" d="M279.34,336.68c.89-.05,2.04-.23,2.76.42,1.27,1.16,1.08,3.58,1.17,5.16-1.02,2.32-2.28,3.15-4.49,4.19-.42.03-.79.05-1.2-.07-.53-.16-1.12-.79-1.39-1.25-.92-1.6-.81-4.02-.37-5.75.44-1.72.37-1.05,1.59-1.43.5-.15,1.43-.96,1.93-1.27Z"/>
<path class="cls-25" d="M580.92,312.86c8.12,3.91,12.26,9.3,15.22,17.75,4.92,14.01,4.63,36.69-1.82,50.04-2.12,4.38-5.17,8.88-9.97,10.54-1.03.36-2.76,1.03-3.79.59-.04-.27-.09-.48-.02-.74,3.51-18.39,4.6-37.15,3.23-55.82-.46-5.98-1.32-11.89-2.05-17.84-.29-1.5-.58-3-.8-4.51Z"/>
<path class="cls-10" d="M580.92,312.86c8.12,3.91,12.26,9.3,15.22,17.75,4.92,14.01,4.63,36.69-1.82,50.04-2.12,4.38-5.17,8.88-9.97,10.54-1.03.36-2.76,1.03-3.79.59-.04-.27-.09-.48-.02-.74,2-.92,5.96-2.6,7.32-4.28,1.68-2.07,2.76-4.61,3.85-7.02,1.66-3.68,3.12-7.44,3.98-11.4,1.7-7.87,1.3-17.83.38-25.86-.9-7.82-3.46-12.57-8.2-18.75-1.29-1.68-2.62-3.54-4.29-4.86-.98-.06-.23.44-.89.88-.44-.52-.32-.74-.28-1.4l.02-.31-.7-.66c-.29-1.5-.58-3-.8-4.51Z"/>
<path class="cls-22" d="M333.04,201.67c3.97-.65,7.84.35,11.1,2.69,1.18.85,2.32,1.88,3.19,3.05,2.35,2,3.23,5.96,3.46,8.93.32,4.23-.84,8.27-3.65,11.51-2.81,3.25-6.76,5.37-11.06,5.67-4.16.31-8.28-1.09-11.39-3.87-3.02-2.68-4.99-7.21-5.24-11.23-.03-.55-.05-1.07.09-1.61.26-1.62.44-3.07.99-4.63,1.19-3.35,2.73-5.5,5.63-7.61,1.98-1.61,4.42-2.41,6.89-2.89Z"/>
<path class="cls-21" d="M326.15,204.56c1.98-1.61,4.42-2.41,6.89-2.89,1.46.02,2.14-.03,3.2,1.05.09.09.17.18.25.26.45.46.94.86,1.44,1.27,1.54,3.99,1.96,9.39.22,13.42-1.14,2.64-3.74,4.51-6.39,5.45-2.52.89-4.68.8-7.22.14-.99-1.12-1.85-2.36-2.73-3.56-.58-1.19-1.71-1.62-2.28-2.9.26-1.62.44-3.07.99-4.63,1.19-3.35,2.73-5.5,5.63-7.61Z"/>
<path class="cls-48" d="M320.52,212.17c1.19-3.35,2.73-5.5,5.63-7.61,1.84.73,3.25,1.46,4.08,3.39.55,1.28.7,2.79.81,4.16-.98,2.1-2.49,4.02-4.78,4.78-.94.32-1.89.33-2.8-.12-2.17-1.07-1.89-2.85-2.95-4.61Z"/>
<path class="cls-36" d="M333.04,201.67c3.97-.65,7.84.35,11.1,2.69,1.18.85,2.32,1.88,3.19,3.05l-.45.14-.2-.19c-.62-.6-1.22-1.07-1.95-1.52l-.14.02,1.39,1.51c-.09.49,0,.31-.16.58-.96-1-1.93-1.84-3.04-2.67,1.62,4.49,1.72,8.8-.35,13.19-1.5,3.2-4.23,5.85-7.59,7.04-.86.31-1.74.53-2.63.7-2.61.8-5.55.26-8.21-.03l-1.7-2.09c-.28-1.46-.5-2.89-.47-4.38.89,1.2,1.74,2.45,2.73,3.56,2.53.66,4.7.75,7.22-.14,2.64-.94,5.25-2.81,6.39-5.45,1.74-4.03,1.31-9.44-.22-13.42-.49-.41-.99-.81-1.44-1.27-.08-.09-.17-.18-.25-.26-1.05-1.07-1.74-1.02-3.2-1.05Z"/>
<path class="cls-33" d="M321.82,219.71c.89,1.2,1.74,2.45,2.73,3.56.71,1.28,1.18,2.06,2.68,2.42,1.57.38,3.35.39,4.96.52-2.61.8-5.55.26-8.21-.03l-1.7-2.09c-.28-1.46-.5-2.89-.47-4.38Z"/>
<path class="cls-12" d="M345.81,207.94c.15-.26.07-.08.16-.58l-1.39-1.51.14-.02c.73.45,1.33.93,1.95,1.52l.2.19.45-.14c2.35,2,3.23,5.96,3.46,8.93.32,4.23-.84,8.27-3.65,11.51-2.81,3.25-6.76,5.37-11.06,5.67-4.16.31-8.28-1.09-11.39-3.87-3.02-2.68-4.99-7.21-5.24-11.23-.03-.55-.05-1.07.09-1.61.57,1.29,1.7,1.72,2.28,2.9-.02,1.49.19,2.92.47,4.38l1.7,2.09c1.65,2.63,4.4,4.28,7.3,5.28,3.43,1.19,6.72.8,9.92-.82,3.46-1.75,6.62-5.13,7.75-8.87,1.55-5.13-.74-9.45-3.15-13.82Z"/>
<path class="cls-18" d="M292,322.91c0-.15-.02-.3-.03-.45-.1-1.99,1.01-9.54,2.45-11.1.42-.46.96-.77,1.6-.77.66,0,1.2.36,1.6.85,3.46,4.29,3.5,40.6,3.22,48.3-.14,3.75-.56,7.48-.87,11.21-.27,3.28-.44,6.54-.93,9.79-.31,2.08-1.77,11.54-2.71,12.57-.65-.02-.71-.05-1.17-.55-2.93-3.12-4.19-12.27-4-16.37,0-.18.03-.36.06-.54-.03-2.02-.27-4.03-.29-6.06-.36-4.33-.98-9.03-.64-13.36-.61-4.28-.21-13.87.35-18.27-.11-5.05.66-10.27,1.36-15.26Z"/>
<path class="cls-14" d="M290.64,338.17l.15,1.93c.72-1.35.21-5.49.73-7.33.96,3.19-1.09,7.52.14,10.53.04,1.46.03,2.9-.02,4.36-.01.09-.03.18-.04.26-.32,2.47-.78,10.06-.32,12.34l-.43.23c-.41-1.31-.05-2.82-.57-4.06-.61-4.28-.21-13.87.35-18.27Z"/>
<path class="cls-40" d="M292,322.91c.6.6.56.94.57,1.77.04,3.11-.24,6.28-.39,9.38-.15,3.06-.17,6.2-.51,9.24-1.24-3.01.82-7.34-.14-10.53-.51,1.84,0,5.98-.73,7.33l-.15-1.93c-.11-5.05.66-10.27,1.36-15.26Z"/>
<path class="cls-26" d="M291.64,347.67c.13,7.41.1,14.83.26,22.25l-.98-.11c-.36-4.33-.98-9.03-.64-13.36.51,1.24.16,2.76.57,4.06l.43-.23c-.46-2.28,0-9.86.32-12.34.01-.09.02-.18.04-.26Z"/>
<path class="cls-45" d="M290.92,369.8l.98.11c.21,1.66.8,3.94,0,5.49l-.68.46c-.03-2.02-.27-4.03-.29-6.06Z"/>
<path class="cls-15" d="M581.14,359.63c.1.79.12,1.6.12,2.4,0,3.61-.13,7.44-.5,11.03-.3,2.96-2.78,18.3-4.56,19.83-.31.26-.25.16-.71.08-.25-.27-.26-.25-.48-.62-.85-1.45-1.12-3.96-1.47-5.62-1.81-8.57-2.11-16.9-2.28-25.63-.26-14.21.42-28.43,2.05-42.55.23-1.97.03-5.22.82-6.98.24-.54.48-.76,1.01-.99.59.09.84.26,1.22.72,2,2.4,3.82,11.25,3.55,14.37-.02.16-.04.33-.05.49-.01,5.13,1.06,10.35,1.29,15.49.27,6-.25,12.02-.02,17.99Z"/>
<path class="cls-45" d="M581.14,359.63c-.1.93-.11,1.96-.5,2.82-.7-3.93-.39-10.67-.54-14.91-.24-7-.88-14-1.06-20.99l.12.03c0,2.41.54,6.07.94,8.5.1-2.96-.9-6.03-.23-8.93-.01,5.13,1.06,10.35,1.29,15.49.27,6-.25,12.02-.02,17.99Z"/>
<path class="cls-22" d="M469.27,578.69c6.76-1.98,13.3-4.32,19.47-7.76,3.04-1.69,5.93-3.68,8.9-5.48,1.02,7.49.41,15.64.2,23.2-1.07.67-2.1,1.14-3.27,1.6-4.65,1.33-8.96,1.99-13.82,1.98-4.2.08-8.38-.65-12.3-2.17,1.13-3.64.7-7.59.81-11.36Z"/>
<path class="cls-10" d="M480.92,585.55c3.87-.17,7.48-1.55,11.14-2.71.61,2.81.29,5.23,2.52,7.41-4.65,1.33-8.96,1.99-13.82,1.98.18-2.2.12-4.46.16-6.67Z"/>
<path class="cls-22" d="M378.7,566.53c8.79,6.27,18.36,10.15,28.77,12.8-.08,3.66-.12,7.57.81,11.14-4.67,1.15-9.34,2.04-14.17,2.03-3.89-.02-10.69-.46-14.01-2.63-.77-.51-.64-1.04-.74-1.88-.95-2.59-.44-6.58-.51-9.36-.67-1.55-.14-9.85-.15-12.1Z"/>
<path class="cls-21" d="M378.85,578.62l.2-.51c1.08.08,2.59,1.37,3.51,1.95,3.6,1.7,7.69,3.22,11.04,5.36.19,2.34.24,4.73.51,7.06-3.89-.02-10.69-.46-14.01-2.63-.77-.51-.64-1.04-.74-1.88-.95-2.59-.44-6.58-.51-9.36Z"/>
<path class="cls-24" d="M378.85,578.62l.2-.51c1.08.08,2.59,1.37,3.51,1.95-1.2,2.23-.02,6.05-1.82,7.83-.47.06-.91.09-1.39.09-.95-2.59-.44-6.58-.51-9.36Z"/>
<path class="cls-15" d="M333.69,510.33c1.4.28,2.8.58,4.19.91,2.08.51,8.41,1.49,9.47,3.55.2.39.16.23,0,.69-1.56.73-5.24.02-6.91-.4-1.73-.44-3.54-.61-5.3-.96-7.32-1.46-12.45-2.61-19.12-6.15-.86-.46-2.7-1.2-3.26-1.99-.47-.67-.35-1.77-.07-2.49.31-.81.9-1.73,1.76-2.02.47-.15,1.17.1,1.58.36.07.05.14.1.21.15l5.75,3.34,5.71,2.58c1.99.8,3.98,1.71,6.01,2.42Z"/>
<path class="cls-40" d="M321.36,506.39c-1.41-.68-4.8-1.96-5.36-3.49-.14-.38.07-.58.22-.91l5.75,3.34-.61,1.06Z"/>
<path class="cls-14" d="M321.97,505.33l5.71,2.58c-.15.43-.28.87-.51,1.27-1.9-.8-4.16-1.56-5.82-2.79l.61-1.06Z"/>
<path class="cls-26" d="M327.69,507.91c1.99.8,3.98,1.71,6.01,2.42l-.56.3c-1.99.09-4.1-.8-5.95-1.45.23-.4.36-.83.51-1.27Z"/>
<path class="cls-15" d="M544.93,508.63c3.15-1.64,11.96-6.99,14.97-7.19.54.31.71.37.87,1.02.17.68-.11,1.71-.24,2.38-6.31,4.25-25.03,13.15-32.51,11.87-.71-.12-1.18-.31-1.68-.84-.15-.64-.13-.67.14-1.27.63-.52,1.37-.95,2.2-1,5.44-1.65,11.02-2.72,16.27-4.97Z"/>
<path class="cls-14" d="M544.93,508.63l.2.47c-1.44,2.09-9.54,4.21-12.12,4.68-1.34.25-3.12.52-4.34-.18,5.44-1.65,11.02-2.72,16.27-4.97Z"/>
<path class="cls-45" d="M338.38,641.86c3.65,1.98,7.47,3.98,11.38,5.39,11.13,4.02,23.43,4.01,35.02,2.56,2.61-.32,5.12-1,7.72-1.33l.08.15c-.68.17-1.33.36-1.99.6v.3c.94.27,1.75-.36,2.73-.23-1.21.93-3.82,1.39-5.36,1.62-9.04,1.38-15.01,1.79-24.26,1.21-2.62-.16-6.77-1.83-9.11-.73,1.59.38,3.43.83,5.06.87h.47s.18.21.18.21c-.31.14-.31.16-.7.21-1.01.14-2.58-.38-3.6-.59-5.63-1.18-12.05-2.7-16.87-5.99-.84-.58-1.81-1.27-2.01-2.33.18-.87.69-1.32,1.28-1.93Z"/>
<path class="cls-15" d="M503.31,589.77c.19-.02.42-.05.61-.03.6.08.76.21,1.13.64-.98,1.67-14.77,6.34-17.29,7-7.74,2.02-16.91,1.69-23.93-2.43-.41-.38-.86-.76-1.21-1.2-.38-.48-.49-.86-.44-1.46,1.07-.08,3.43,1.52,4.59,1.95,1.54.57,3.15.95,4.77,1.21,6.79,1.09,15.95.48,22.43-2.05,3-1.17,5.78-2.76,8.93-3.54l.42-.1Z"/>
<path class="cls-45" d="M390.12,597.84c-3.98-.31-14.93-1.71-17.94-4.23-.64-.53-1.08-1.25-1.01-2.11.06-.7.36-1.1.84-1.56.67-.21.75-.27,1.41-.06,3.46.81,6.56,2.83,10.01,3.46,3.01.77,6.4,1.35,9.26,2.56l-.59.95c-.66.32-1.32.65-1.98.98Z"/>
<path class="cls-26" d="M383.43,593.35c3.01.77,6.4,1.35,9.26,2.56l-.59.95c-2.86-.29-6.39-.99-9.09-1.99l.42-1.52Z"/>
<path class="cls-14" d="M373.42,589.89c3.46.81,6.56,2.83,10.01,3.46l-.42,1.52c-3.13-.91-7.15-2.4-9.66-4.5l.07-.48Z"/>
<path class="cls-15" d="M392.68,595.91c5.69.53,11.88.4,17.3-1.59.83-.3,3-1.45,3.76-1.43.2,0,.33.2.5.31.08.57.16.39-.11.79-1.73,2.56-7.67,3.74-10.55,4.11-3.46.45-10.23,1.05-13.49-.25.66-.34,1.32-.67,1.98-.98l.59-.95Z"/>
<path class="cls-40" d="M467.15,641.73l.81.24c2.83.8,5.34,2.55,8.08,3.62,5.68,2.21,11.67,3.63,17.65,4.73-.61.63-1.06.61-1.9.8-1.95-.55-4.11-.73-6.12-1.12-7.03-1.4-12.87-3.75-18.52-8.26Z"/>
<path class="cls-46" d="M493.69,650.32c5.06-.24,9.97.93,15.24.44,2.58-.24,5.53-.46,8.04-1.1,1.31-.33,2.66-1.22,4.04-1.12l.11.32c-.17,0-.34,0-.51,0-.74.04-1.12.39-1.7.8-5.68,4.01-20.39,2.66-27.12,1.45.85-.19,1.3-.16,1.9-.8Z"/>
<path class="cls-21" d="M319.27,651.45s-.09,0-.14.01c-11,.51-24.15-.08-32.54-8.16-4.99-4.81-6.93-10.86-7.49-17.59-.18-2.18-.18-4.46-.52-6.62-.44-2.8-1.94-5.54-1.92-8.4,0-1.13.33-2.28,1.17-3.07.84-.79,2.34-1.36,3.5-1.22,2.67.32,5.25,3.51,7.84,4.54,2.17.86,4.91,1.14,7.22,1.57,7.87,1.45,14.13,4.31,19.22,10.72,4.22,5.3,6.31,12.98,5.54,19.68,1.23,1.46,4.37,3.93,3.97,5.99-.3,1.52-2.02,2.66-3.21,3.47-.87-.34-1.75-.71-2.66-.92Z"/>
<path class="cls-4" d="M319.27,651.45s-.09,0-.14.01c-11,.51-24.15-.08-32.54-8.16-4.99-4.81-6.93-10.86-7.49-17.59-.18-2.18-.18-4.46-.52-6.62-.44-2.8-1.94-5.54-1.92-8.4,0-1.13.33-2.28,1.17-3.07.84-.79,2.34-1.36,3.5-1.22,2.67.32,5.25,3.51,7.84,4.54,2.17.86,4.91,1.14,7.22,1.57,7.87,1.45,14.13,4.31,19.22,10.72,4.22,5.3,6.31,12.98,5.54,19.68-.98-.42-1.67-.7-2.39-1.51-.75-.66-1.48-1.36-2.22-2.04-1.17-.86-2.37-1.69-3.43-2.68-2.04-1.39-4.15-2.69-6.23-4.03,1.03-2.68-2.88-6.39-2.18-9.04l.76-.34c-4.05-3.25-12.03-2.77-16.84-5.51-1.97-1.16-4.73-3.52-6.75-4.22-.36-.12-.75-.22-1.11-.35l.26,1.2c1.82,7.82.65,16.74,5.54,23.57,1.33,2.19,3.92,4.86,6.38,5.75,5.69,4.91,20.9,5.16,28.27,4.9-.45.47-.56.56-.7,1.18.26.48.53.77.92,1.15l.03.46c-.63-.35-.89-.6-1.63-.56l-.58.59Z"/>
<path class="cls-33" d="M304.3,618.03c5.79,2.74,10.2,7.33,12.36,13.39.82,2.29,2.48,7.6,2.12,9.98-.75-.66-1.48-1.36-2.22-2.04-1.17-.86-2.37-1.69-3.43-2.68-2.04-1.39-4.15-2.69-6.23-4.03,1.03-2.68-2.88-6.39-2.18-9.04l.76-.34c1.12.75,2.41,1.48,3.4,2.39.63-1.62-3.95-5.63-4.57-7.64Z"/>
<path class="cls-22" d="M313.12,636.69l.58-.31c.28-2.15-4.23-6.58-3.66-9.47,2.42,2.9,6.73,8.47,6.52,12.46-1.17-.86-2.37-1.69-3.43-2.68Z"/>
<path class="cls-24" d="M280.77,613.21c-.33-.96-.84-2.02-.68-3.04.55-.32.81-.28,1.39-.1,1.99.63,3.47,2.52,5.5,3.3,4.04,1.54,8.23,1.97,12.39,2.99,1.69.41,3.28,1.29,4.93,1.67.62,2.01,5.2,6.02,4.57,7.64-.99-.92-2.28-1.64-3.4-2.39-4.05-3.25-12.03-2.77-16.84-5.51-1.97-1.16-4.73-3.52-6.75-4.22-.36-.12-.75-.22-1.11-.35Z"/>
<path class="cls-12" d="M305.18,634.27c.64.31,1.31.59,1.89,1,3.11,1.83,13.12,9.97,14.14,13.36-7.37.26-22.58,0-28.27-4.9,3.56-.99,6.2-2.29,9.22-4.44l-.69-1c1.7-1.03,2.69-2.35,3.7-4.02Z"/>
<path class="cls-33" d="M305.18,634.27c.64.31,1.31.59,1.89,1-1.38,1.56-3.21,2.81-4.91,4.01l-.69-1c1.7-1.03,2.69-2.35,3.7-4.02Z"/>
<path class="cls-38" d="M290.95,620.8l.59-.14c5.15,3.75,9.63,9.21,15.35,12.01,2.08,1.33,4.18,2.64,6.23,4.03,1.07.99,2.26,1.82,3.43,2.68.74.68,1.47,1.37,2.22,2.04.72.8,1.41,1.09,2.39,1.51,1.23,1.46,4.37,3.93,3.97,5.99-.3,1.52-2.02,2.66-3.21,3.47-.87-.34-1.75-.71-2.66-.92l.58-.59c.74-.04.99.2,1.63.56l-.03-.46c-.39-.38-.66-.67-.92-1.15.14-.62.25-.71.7-1.18-1.02-3.39-11.03-11.52-14.14-13.36-.58-.41-1.25-.69-1.89-1l-.49-.44c-3.77-2.85-8.47-2.56-12.82-3.92l.46-.57c.91-.33,1.99-.03,2.96-.08l.22-.02c1.48-.08,3.14.43,4.59.73-3.39-2.71-6.51-5.71-9.14-9.17Z"/>
<path class="cls-24" d="M281.03,614.4l.51-.14c1.93,1.16,2.54,5.53,3.08,7.68,1.24,5.01,1.61,10.16,2.82,15.14-.25.62-.33.55-.86.89-4.89-6.83-3.72-15.75-5.54-23.57Z"/>
<path class="cls-30" d="M304.69,633.83l.49.44c-1.01,1.67-2,2.98-3.7,4.02-2.94.75-6.47.68-9.17-.86-.43-.25-1.34-.7-1.46-1.2l.43-.18c2.59,1.08,6.48,1.7,9.23,1.05,2.09-.49,3.07-1.48,4.17-3.26Z"/>
<path class="cls-30" d="M291.86,629.91c-.3-.05-.35-.05-.69-.15-1.03-.31-2.94-.95-3.42-1.92,1.49-.69,6.13,1.02,7.76,1.41l-.22.02c-.98.05-2.05-.24-2.96.08l-.46.57Z"/>
<g>
<path class="cls-9" d="M65.14,89.03l2.24-24.99-10.09-.91.57-6.31,27.19,2.44-.57,6.31-10.09-.91-2.24,24.99-7.01-.63Z"/>
<path class="cls-9" d="M81.09,84.44c.33-3.64,3.14-5.65,8.07-5.96l8.14-.49.07-.75c.25-2.76-1.2-3.4-3.96-3.65-2.85-.26-4.04.44-4.26,2.82l-.05.51-6.68-.6.05-.51c.5-5.61,5.18-8.91,11.81-8.31,6.91.62,10.22,4.73,9.66,10.99l-1.25,13.92-6.49-.58.29-3.18-.28-.02c-1.42,1.62-3.97,3.32-8.32,2.93-4.16-.37-7.18-2.86-6.8-7.11ZM90.71,86.43c2.85.26,5.86-.23,6.19-3.87l-6.82.42c-1.47.1-2.16.51-2.25,1.49-.11,1.26.83,1.77,2.89,1.95Z"/>
<path class="cls-9" d="M106.85,92.78l2.11-23.5,6.49.58-.37,4.11.28.02c1.5-2.55,4.19-4.24,8.31-3.87,6.12.55,8.37,4.85,7.92,9.85l-1.34,14.9-7.01-.63,1.21-13.5c.29-3.27-.68-4.53-4.23-4.85-3.36-.3-4.91.64-5.23,4.19l-1.19,13.31-6.96-.62Z"/>
<path class="cls-9" d="M132.86,102.6l.52-5.79,3.92.35c1.77.16,2.45-.02,3.28-1.45l.5-.85-7.84-23.4,7.8.7,2.95,10.15,1.27,4.68.51.05,1.85-4.4,4.2-9.51,7.8.7-12.72,24.2c-2.44,4.63-5.19,5.89-9.82,5.48-1.59-.14-3.29-.58-4.25-.9Z"/>
<path class="cls-9" d="M158.17,91.35c.33-3.64,3.14-5.65,8.07-5.96l8.14-.49.07-.75c.25-2.76-1.2-3.4-3.96-3.65-2.85-.26-4.04.44-4.26,2.82l-.05.51-6.68-.6.05-.51c.5-5.61,5.18-8.91,11.81-8.31,6.91.62,10.22,4.73,9.66,10.99l-1.25,13.92-6.49-.58.29-3.18-.28-.02c-1.42,1.62-3.97,3.32-8.32,2.93-4.16-.37-7.18-2.86-6.8-7.11ZM167.79,93.34c2.85.26,5.86-.23,6.19-3.87l-6.82.42c-1.47.1-2.16.51-2.25,1.49-.11,1.26.83,1.77,2.89,1.95Z"/>
</g>
<path class="cls-47" d="M53.13,138.81l3.46-38.57,29.42,2.64-.7,7.77-20.78-1.86-.68,7.54,19.92,1.79-.69,7.71-19.92-1.79-.7,7.77,20.78,1.86-.7,7.77-29.42-2.64Z"/>
<path class="cls-47" d="M86.84,127.33c.83-9.27,6.83-14.65,16.5-13.78,7.71.69,12.93,5.92,12.29,13.06l-.06.69-8.64-.77.04-.46c.29-3.28-1.45-4.54-5.02-4.86-4.15-.37-6.1,1.43-6.59,6.84-.48,5.35,1.13,7.47,5.27,7.84,3.57.32,5.51-.61,5.8-3.89l.04-.46,8.64.77-.06.69c-.64,7.14-6.88,11.34-14.88,10.62-9.56-.86-14.16-7.13-13.34-16.29Z"/>
<path class="cls-47" d="M118.56,130.11c.83-9.21,6.88-14.59,16.21-13.75,9.27.83,14.15,7.19,13.33,16.4-.82,9.15-6.76,14.54-16.03,13.71-9.33-.84-14.33-7.21-13.5-16.36ZM139.69,132.01c.51-5.64-.94-7.63-5.6-8.05-4.72-.42-6.5,1.27-7,6.92-.5,5.58.95,7.57,5.67,7.99,4.66.42,6.44-1.28,6.94-6.86Z"/>
<path class="cls-47" d="M150.77,147.57l3.46-38.57,8.58.77-1.22,13.64.35.03c1.54-2.3,4.85-4.21,9.22-3.82,7.94.71,11.61,7.02,10.79,16.17-.82,9.1-5.55,14.65-13.44,13.94-4.49-.4-7.79-2.44-9.06-5.69l-.29-.03-.38,4.26-8-.72ZM166.35,142.12c4.95.44,6.55-1.85,7.02-7.09.48-5.3-.63-7.83-5.64-8.28-4.09-.37-6.52.87-6.87,4.78l-.42,4.66c-.35,3.91,1.82,5.56,5.91,5.93Z"/>
<path class="cls-47" d="M185.17,136.09c.83-9.21,6.88-14.59,16.21-13.75,9.27.83,14.15,7.19,13.33,16.4-.82,9.15-6.76,14.54-16.03,13.71-9.33-.84-14.33-7.21-13.5-16.36ZM206.3,137.98c.51-5.64-.94-7.63-5.6-8.05-4.72-.42-6.5,1.27-7,6.92-.5,5.58.95,7.57,5.67,7.99,4.66.42,6.44-1.28,6.94-6.86Z"/>
<path class="cls-47" d="M220.13,144.22l1.1-12.32-4.61-.41.64-7.14,4.84.43,2.22-6.59,6.79.61-.6,6.74,8.17.73-.64,7.14-8.17-.73-1.02,11.34c-.23,2.53.61,2.9,4.35,3.23l3.57.32-.65,7.2c-1.41.16-3.68.25-5.69.07-7.54-.68-10.92-3.77-10.31-10.62Z"/>
<path class="cls-39" d="M250.99,156.37l1.59-17.75,18.62,1.67-1.59,17.75-18.62-1.67ZM254.23,132.52c.8-8.93.67-33.2,1.42-41.58l.68-7.62,21.01,1.89-.68,7.62c-.75,8.38-5.32,32.34-6.11,41.16l-16.33-1.46Z"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 79 KiB

View File

@ -8,6 +8,7 @@
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
"Courier New", monospace; "Courier New", monospace;
--color-red-50: oklch(97.1% 0.013 17.38); --color-red-50: oklch(97.1% 0.013 17.38);
--color-red-100: oklch(93.6% 0.032 17.717);
--color-red-400: oklch(70.4% 0.191 22.216); --color-red-400: oklch(70.4% 0.191 22.216);
--color-red-500: oklch(63.7% 0.237 25.331); --color-red-500: oklch(63.7% 0.237 25.331);
--color-red-600: oklch(57.7% 0.245 27.325); --color-red-600: oklch(57.7% 0.245 27.325);
@ -51,6 +52,7 @@
--color-green-800: oklch(44.8% 0.119 151.328); --color-green-800: oklch(44.8% 0.119 151.328);
--color-green-900: oklch(39.3% 0.095 152.535); --color-green-900: oklch(39.3% 0.095 152.535);
--color-emerald-50: oklch(97.9% 0.021 166.113); --color-emerald-50: oklch(97.9% 0.021 166.113);
--color-emerald-100: oklch(95% 0.052 163.051);
--color-emerald-400: oklch(76.5% 0.177 163.223); --color-emerald-400: oklch(76.5% 0.177 163.223);
--color-emerald-500: oklch(69.6% 0.17 162.48); --color-emerald-500: oklch(69.6% 0.17 162.48);
--color-emerald-600: oklch(59.6% 0.145 163.225); --color-emerald-600: oklch(59.6% 0.145 163.225);
@ -69,9 +71,8 @@
--color-cyan-200: oklch(91.7% 0.08 205.041); --color-cyan-200: oklch(91.7% 0.08 205.041);
--color-cyan-500: oklch(71.5% 0.143 215.221); --color-cyan-500: oklch(71.5% 0.143 215.221);
--color-cyan-600: oklch(60.9% 0.126 221.723); --color-cyan-600: oklch(60.9% 0.126 221.723);
--color-cyan-700: oklch(52% 0.105 223.128);
--color-cyan-800: oklch(45% 0.085 224.283); --color-cyan-800: oklch(45% 0.085 224.283);
--color-sky-500: oklch(68.5% 0.169 237.323);
--color-sky-600: oklch(58.8% 0.158 241.966);
--color-blue-50: oklch(97% 0.014 254.604); --color-blue-50: oklch(97% 0.014 254.604);
--color-blue-100: oklch(93.2% 0.032 255.585); --color-blue-100: oklch(93.2% 0.032 255.585);
--color-blue-200: oklch(88.2% 0.059 254.128); --color-blue-200: oklch(88.2% 0.059 254.128);
@ -85,7 +86,9 @@
--color-indigo-50: oklch(96.2% 0.018 272.314); --color-indigo-50: oklch(96.2% 0.018 272.314);
--color-indigo-100: oklch(93% 0.034 272.788); --color-indigo-100: oklch(93% 0.034 272.788);
--color-indigo-200: oklch(87% 0.065 274.039); --color-indigo-200: oklch(87% 0.065 274.039);
--color-indigo-500: oklch(58.5% 0.233 277.117);
--color-indigo-600: oklch(51.1% 0.262 276.966); --color-indigo-600: oklch(51.1% 0.262 276.966);
--color-indigo-700: oklch(45.7% 0.24 277.023);
--color-indigo-800: oklch(39.8% 0.195 277.366); --color-indigo-800: oklch(39.8% 0.195 277.366);
--color-purple-50: oklch(97.7% 0.014 308.299); --color-purple-50: oklch(97.7% 0.014 308.299);
--color-purple-100: oklch(94.6% 0.033 307.174); --color-purple-100: oklch(94.6% 0.033 307.174);
@ -99,16 +102,12 @@
--color-pink-200: oklch(89.9% 0.061 343.231); --color-pink-200: oklch(89.9% 0.061 343.231);
--color-pink-500: oklch(65.6% 0.241 354.308); --color-pink-500: oklch(65.6% 0.241 354.308);
--color-pink-600: oklch(59.2% 0.249 0.584); --color-pink-600: oklch(59.2% 0.249 0.584);
--color-pink-700: oklch(52.5% 0.223 3.958);
--color-pink-800: oklch(45.9% 0.187 3.815); --color-pink-800: oklch(45.9% 0.187 3.815);
--color-rose-100: oklch(94.1% 0.03 12.58); --color-rose-500: oklch(64.5% 0.246 16.439);
--color-rose-600: oklch(58.6% 0.253 17.585); --color-rose-600: oklch(58.6% 0.253 17.585);
--color-rose-700: oklch(51.4% 0.222 16.935);
--color-slate-50: oklch(98.4% 0.003 247.858); --color-slate-50: oklch(98.4% 0.003 247.858);
--color-slate-100: oklch(96.8% 0.007 247.896); --color-slate-100: oklch(96.8% 0.007 247.896);
--color-slate-300: oklch(86.9% 0.022 252.894); --color-slate-300: oklch(86.9% 0.022 252.894);
--color-slate-600: oklch(44.6% 0.043 257.281);
--color-slate-700: oklch(37.2% 0.044 257.287);
--color-gray-50: oklch(98.5% 0.002 247.839); --color-gray-50: oklch(98.5% 0.002 247.839);
--color-gray-100: oklch(96.7% 0.003 264.542); --color-gray-100: oklch(96.7% 0.003 264.542);
--color-gray-200: oklch(92.8% 0.006 264.531); --color-gray-200: oklch(92.8% 0.006 264.531);
@ -352,17 +351,6 @@
.visible\! { .visible\! {
visibility: visible !important; visibility: visible !important;
} }
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border-width: 0;
}
.absolute { .absolute {
position: absolute; position: absolute;
} }
@ -429,6 +417,12 @@
.top-10 { .top-10 {
top: calc(var(--spacing) * 10); top: calc(var(--spacing) * 10);
} }
.top-20 {
top: calc(var(--spacing) * 20);
}
.top-32 {
top: calc(var(--spacing) * 32);
}
.top-50 { .top-50 {
top: calc(var(--spacing) * 50); top: calc(var(--spacing) * 50);
} }
@ -462,9 +456,21 @@
.right-5 { .right-5 {
right: calc(var(--spacing) * 5); right: calc(var(--spacing) * 5);
} }
.right-6 {
right: calc(var(--spacing) * 6);
}
.right-8 {
right: calc(var(--spacing) * 8);
}
.right-10 { .right-10 {
right: calc(var(--spacing) * 10); right: calc(var(--spacing) * 10);
} }
.right-12 {
right: calc(var(--spacing) * 12);
}
.right-20 {
right: calc(var(--spacing) * 20);
}
.right-\[15\%\] { .right-\[15\%\] {
right: 15%; right: 15%;
} }
@ -474,18 +480,36 @@
.bottom-0 { .bottom-0 {
bottom: calc(var(--spacing) * 0); bottom: calc(var(--spacing) * 0);
} }
.bottom-1 {
bottom: calc(var(--spacing) * 1);
}
.bottom-4 { .bottom-4 {
bottom: calc(var(--spacing) * 4); bottom: calc(var(--spacing) * 4);
} }
.bottom-5 { .bottom-5 {
bottom: calc(var(--spacing) * 5); bottom: calc(var(--spacing) * 5);
} }
.bottom-6 {
bottom: calc(var(--spacing) * 6);
}
.bottom-10 { .bottom-10 {
bottom: calc(var(--spacing) * 10); bottom: calc(var(--spacing) * 10);
} }
.bottom-16 {
bottom: calc(var(--spacing) * 16);
}
.bottom-20 { .bottom-20 {
bottom: calc(var(--spacing) * 20); bottom: calc(var(--spacing) * 20);
} }
.bottom-22 {
bottom: calc(var(--spacing) * 22);
}
.bottom-24 {
bottom: calc(var(--spacing) * 24);
}
.bottom-32 {
bottom: calc(var(--spacing) * 32);
}
.bottom-50 { .bottom-50 {
bottom: calc(var(--spacing) * 50); bottom: calc(var(--spacing) * 50);
} }
@ -495,12 +519,15 @@
.bottom-\[5\%\] { .bottom-\[5\%\] {
bottom: 5%; bottom: 5%;
} }
.-left-3 { .-left-5 {
left: calc(var(--spacing) * -3); left: calc(var(--spacing) * -5);
} }
.left-0 { .left-0 {
left: calc(var(--spacing) * 0); left: calc(var(--spacing) * 0);
} }
.left-1 {
left: calc(var(--spacing) * 1);
}
.left-1\/2 { .left-1\/2 {
left: calc(1/2 * 100%); left: calc(1/2 * 100%);
} }
@ -513,6 +540,9 @@
.left-10 { .left-10 {
left: calc(var(--spacing) * 10); left: calc(var(--spacing) * 10);
} }
.left-16 {
left: calc(var(--spacing) * 16);
}
.left-\[10\%\] { .left-\[10\%\] {
left: 10%; left: 10%;
} }
@ -825,12 +855,12 @@
.mb-12 { .mb-12 {
margin-bottom: calc(var(--spacing) * 12); margin-bottom: calc(var(--spacing) * 12);
} }
.mb-20 {
margin-bottom: calc(var(--spacing) * 20);
}
.mb-auto { .mb-auto {
margin-bottom: auto; margin-bottom: auto;
} }
.ml-0 {
margin-left: calc(var(--spacing) * 0);
}
.ml-0\.5 { .ml-0\.5 {
margin-left: calc(var(--spacing) * 0.5); margin-left: calc(var(--spacing) * 0.5);
} }
@ -913,6 +943,9 @@
width: calc(var(--spacing) * 6); width: calc(var(--spacing) * 6);
height: calc(var(--spacing) * 6); height: calc(var(--spacing) * 6);
} }
.h-0 {
height: calc(var(--spacing) * 0);
}
.h-0\.5 { .h-0\.5 {
height: calc(var(--spacing) * 0.5); height: calc(var(--spacing) * 0.5);
} }
@ -1006,15 +1039,15 @@
.h-\[140px\] { .h-\[140px\] {
height: 140px; height: 140px;
} }
.h-\[300px\] {
height: 300px;
}
.h-\[350px\] { .h-\[350px\] {
height: 350px; height: 350px;
} }
.h-\[400px\] { .h-\[400px\] {
height: 400px; height: 400px;
} }
.h-\[450px\] {
height: 450px;
}
.h-auto { .h-auto {
height: auto; height: auto;
} }
@ -1024,12 +1057,24 @@
.h-px { .h-px {
height: 1px; height: 1px;
} }
.max-h-64 {
max-height: calc(var(--spacing) * 64);
}
.max-h-\[60vh\] {
max-height: 60vh;
}
.max-h-\[80vh\] {
max-height: 80vh;
}
.min-h-\[60vh\] { .min-h-\[60vh\] {
min-height: 60vh; min-height: 60vh;
} }
.min-h-screen { .min-h-screen {
min-height: 100vh; min-height: 100vh;
} }
.w-1 {
width: calc(var(--spacing) * 1);
}
.w-1\.5 { .w-1\.5 {
width: calc(var(--spacing) * 1.5); width: calc(var(--spacing) * 1.5);
} }
@ -1147,9 +1192,6 @@
.max-w-7xl { .max-w-7xl {
max-width: var(--container-7xl); max-width: var(--container-7xl);
} }
.max-w-\[85vw\] {
max-width: 85vw;
}
.max-w-\[200px\] { .max-w-\[200px\] {
max-width: 200px; max-width: 200px;
} }
@ -1204,6 +1246,10 @@
.border-collapse { .border-collapse {
border-collapse: collapse; border-collapse: collapse;
} }
.-translate-x-1 {
--tw-translate-x: calc(var(--spacing) * -1);
translate: var(--tw-translate-x) var(--tw-translate-y);
}
.-translate-x-1\/2 { .-translate-x-1\/2 {
--tw-translate-x: calc(calc(1/2 * 100%) * -1); --tw-translate-x: calc(calc(1/2 * 100%) * -1);
translate: var(--tw-translate-x) var(--tw-translate-y); translate: var(--tw-translate-x) var(--tw-translate-y);
@ -1232,8 +1278,8 @@
--tw-translate-x: -100%; --tw-translate-x: -100%;
translate: var(--tw-translate-x) var(--tw-translate-y); translate: var(--tw-translate-x) var(--tw-translate-y);
} }
.translate-x-full { .-translate-y-1 {
--tw-translate-x: 100%; --tw-translate-y: calc(var(--spacing) * -1);
translate: var(--tw-translate-x) var(--tw-translate-y); translate: var(--tw-translate-x) var(--tw-translate-y);
} }
.-translate-y-1\/2 { .-translate-y-1\/2 {
@ -1248,6 +1294,10 @@
--tw-translate-y: calc(var(--spacing) * -32); --tw-translate-y: calc(var(--spacing) * -32);
translate: var(--tw-translate-x) var(--tw-translate-y); translate: var(--tw-translate-x) var(--tw-translate-y);
} }
.translate-y-1 {
--tw-translate-y: calc(var(--spacing) * 1);
translate: var(--tw-translate-x) var(--tw-translate-y);
}
.translate-y-1\/2 { .translate-y-1\/2 {
--tw-translate-y: calc(1/2 * 100%); --tw-translate-y: calc(1/2 * 100%);
translate: var(--tw-translate-x) var(--tw-translate-y); translate: var(--tw-translate-x) var(--tw-translate-y);
@ -1260,6 +1310,10 @@
--tw-translate-y: calc(var(--spacing) * 48); --tw-translate-y: calc(var(--spacing) * 48);
translate: var(--tw-translate-x) var(--tw-translate-y); translate: var(--tw-translate-x) var(--tw-translate-y);
} }
.translate-y-full {
--tw-translate-y: 100%;
translate: var(--tw-translate-x) var(--tw-translate-y);
}
.scale-0 { .scale-0 {
--tw-scale-x: 0%; --tw-scale-x: 0%;
--tw-scale-y: 0%; --tw-scale-y: 0%;
@ -1360,6 +1414,9 @@
.items-start { .items-start {
align-items: flex-start; align-items: flex-start;
} }
.justify-around {
justify-content: space-around;
}
.justify-between { .justify-between {
justify-content: space-between; justify-content: space-between;
} }
@ -1451,6 +1508,13 @@
.gap-x-4 { .gap-x-4 {
column-gap: calc(var(--spacing) * 4); column-gap: calc(var(--spacing) * 4);
} }
.space-x-1 {
:where(& > :not(:last-child)) {
--tw-space-x-reverse: 0;
margin-inline-start: calc(calc(var(--spacing) * 1) * var(--tw-space-x-reverse));
margin-inline-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-x-reverse)));
}
}
.space-x-1\.5 { .space-x-1\.5 {
:where(& > :not(:last-child)) { :where(& > :not(:last-child)) {
--tw-space-x-reverse: 0; --tw-space-x-reverse: 0;
@ -1554,6 +1618,10 @@
.rounded-xl { .rounded-xl {
border-radius: var(--radius-xl); border-radius: var(--radius-xl);
} }
.rounded-t-3xl {
border-top-left-radius: var(--radius-3xl);
border-top-right-radius: var(--radius-3xl);
}
.rounded-t-lg { .rounded-t-lg {
border-top-left-radius: var(--radius-lg); border-top-left-radius: var(--radius-lg);
border-top-right-radius: var(--radius-lg); border-top-right-radius: var(--radius-lg);
@ -1654,6 +1722,12 @@
.border-gray-200 { .border-gray-200 {
border-color: var(--color-gray-200); border-color: var(--color-gray-200);
} }
.border-gray-200\/50 {
border-color: color-mix(in srgb, oklch(92.8% 0.006 264.531) 50%, transparent);
@supports (color: color-mix(in lab, red, red)) {
border-color: color-mix(in oklab, var(--color-gray-200) 50%, transparent);
}
}
.border-gray-300 { .border-gray-300 {
border-color: var(--color-gray-300); border-color: var(--color-gray-300);
} }
@ -1672,6 +1746,9 @@
.border-indigo-200 { .border-indigo-200 {
border-color: var(--color-indigo-200); border-color: var(--color-indigo-200);
} }
.border-orange-100 {
border-color: var(--color-orange-100);
}
.border-orange-200 { .border-orange-200 {
border-color: var(--color-orange-200); border-color: var(--color-orange-200);
} }
@ -1681,6 +1758,9 @@
.border-pink-200 { .border-pink-200 {
border-color: var(--color-pink-200); border-color: var(--color-pink-200);
} }
.border-purple-100 {
border-color: var(--color-purple-100);
}
.border-purple-200 { .border-purple-200 {
border-color: var(--color-purple-200); border-color: var(--color-purple-200);
} }
@ -1741,6 +1821,12 @@
.bg-black { .bg-black {
background-color: var(--color-black); background-color: var(--color-black);
} }
.bg-black\/50 {
background-color: color-mix(in srgb, #000 50%, transparent);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--color-black) 50%, transparent);
}
}
.bg-black\/80 { .bg-black\/80 {
background-color: color-mix(in srgb, #000 80%, transparent); background-color: color-mix(in srgb, #000 80%, transparent);
@supports (color: color-mix(in lab, red, red)) { @supports (color: color-mix(in lab, red, red)) {
@ -1837,9 +1923,6 @@
.bg-orange-100 { .bg-orange-100 {
background-color: var(--color-orange-100); background-color: var(--color-orange-100);
} }
.bg-orange-200 {
background-color: var(--color-orange-200);
}
.bg-orange-500 { .bg-orange-500 {
background-color: var(--color-orange-500); background-color: var(--color-orange-500);
} }
@ -1873,6 +1956,9 @@
.bg-purple-500 { .bg-purple-500 {
background-color: var(--color-purple-500); background-color: var(--color-purple-500);
} }
.bg-red-100 {
background-color: var(--color-red-100);
}
.bg-red-400 { .bg-red-400 {
background-color: var(--color-red-400); background-color: var(--color-red-400);
} }
@ -1912,6 +1998,12 @@
background-color: color-mix(in oklab, var(--color-white) 10%, transparent); background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
} }
} }
.bg-white\/15 {
background-color: color-mix(in srgb, #fff 15%, transparent);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--color-white) 15%, transparent);
}
}
.bg-white\/20 { .bg-white\/20 {
background-color: color-mix(in srgb, #fff 20%, transparent); background-color: color-mix(in srgb, #fff 20%, transparent);
@supports (color: color-mix(in lab, red, red)) { @supports (color: color-mix(in lab, red, red)) {
@ -1936,12 +2028,21 @@
background-color: color-mix(in oklab, var(--color-white) 90%, transparent); background-color: color-mix(in oklab, var(--color-white) 90%, transparent);
} }
} }
.bg-white\/95 {
background-color: color-mix(in srgb, #fff 95%, transparent);
@supports (color: color-mix(in lab, red, red)) {
background-color: color-mix(in oklab, var(--color-white) 95%, transparent);
}
}
.bg-yellow-50 { .bg-yellow-50 {
background-color: var(--color-yellow-50); background-color: var(--color-yellow-50);
} }
.bg-yellow-100 { .bg-yellow-100 {
background-color: var(--color-yellow-100); background-color: var(--color-yellow-100);
} }
.bg-yellow-300 {
background-color: var(--color-yellow-300);
}
.bg-yellow-300\/20 { .bg-yellow-300\/20 {
background-color: color-mix(in srgb, oklch(90.5% 0.182 98.111) 20%, transparent); background-color: color-mix(in srgb, oklch(90.5% 0.182 98.111) 20%, transparent);
@supports (color: color-mix(in lab, red, red)) { @supports (color: color-mix(in lab, red, red)) {
@ -2019,6 +2120,14 @@
--tw-gradient-from: var(--color-blue-50); --tw-gradient-from: var(--color-blue-50);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
} }
.from-blue-500 {
--tw-gradient-from: var(--color-blue-500);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.from-blue-600 {
--tw-gradient-from: var(--color-blue-600);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.from-blue-700 { .from-blue-700 {
--tw-gradient-from: var(--color-blue-700); --tw-gradient-from: var(--color-blue-700);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
@ -2081,6 +2190,10 @@
--tw-gradient-from: var(--color-orange-500); --tw-gradient-from: var(--color-orange-500);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
} }
.from-purple-50 {
--tw-gradient-from: var(--color-purple-50);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.from-purple-500 { .from-purple-500 {
--tw-gradient-from: var(--color-purple-500); --tw-gradient-from: var(--color-purple-500);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
@ -2126,6 +2239,11 @@
--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position); --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-via-stops); --tw-gradient-stops: var(--tw-gradient-via-stops);
} }
.via-black {
--tw-gradient-via: var(--color-black);
--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-via-stops);
}
.via-black\/5 { .via-black\/5 {
--tw-gradient-via: color-mix(in srgb, #000 5%, transparent); --tw-gradient-via: color-mix(in srgb, #000 5%, transparent);
@supports (color: color-mix(in lab, red, red)) { @supports (color: color-mix(in lab, red, red)) {
@ -2168,6 +2286,11 @@
--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position); --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-via-stops); --tw-gradient-stops: var(--tw-gradient-via-stops);
} }
.via-gray-900 {
--tw-gradient-via: var(--color-gray-900);
--tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
--tw-gradient-stops: var(--tw-gradient-via-stops);
}
.via-gray-900\/60 { .via-gray-900\/60 {
--tw-gradient-via: color-mix(in srgb, oklch(21% 0.034 264.665) 60%, transparent); --tw-gradient-via: color-mix(in srgb, oklch(21% 0.034 264.665) 60%, transparent);
@supports (color: color-mix(in lab, red, red)) { @supports (color: color-mix(in lab, red, red)) {
@ -2231,6 +2354,10 @@
--tw-gradient-to: var(--color-amber-800); --tw-gradient-to: var(--color-amber-800);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
} }
.to-black {
--tw-gradient-to: var(--color-black);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-black\/10 { .to-black\/10 {
--tw-gradient-to: color-mix(in srgb, #000 10%, transparent); --tw-gradient-to: color-mix(in srgb, #000 10%, transparent);
@supports (color: color-mix(in lab, red, red)) { @supports (color: color-mix(in lab, red, red)) {
@ -2238,6 +2365,14 @@
} }
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
} }
.to-blue-100 {
--tw-gradient-to: var(--color-blue-100);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-blue-600 {
--tw-gradient-to: var(--color-blue-600);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-blue-900 { .to-blue-900 {
--tw-gradient-to: var(--color-blue-900); --tw-gradient-to: var(--color-blue-900);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
@ -2266,6 +2401,10 @@
--tw-gradient-to: var(--color-emerald-600); --tw-gradient-to: var(--color-emerald-600);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
} }
.to-emerald-800 {
--tw-gradient-to: var(--color-emerald-800);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-emerald-800\/30 { .to-emerald-800\/30 {
--tw-gradient-to: color-mix(in srgb, oklch(43.2% 0.095 166.913) 30%, transparent); --tw-gradient-to: color-mix(in srgb, oklch(43.2% 0.095 166.913) 30%, transparent);
@supports (color: color-mix(in lab, red, red)) { @supports (color: color-mix(in lab, red, red)) {
@ -2285,6 +2424,10 @@
--tw-gradient-to: var(--color-green-50); --tw-gradient-to: var(--color-green-50);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
} }
.to-green-100 {
--tw-gradient-to: var(--color-green-100);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-green-600 { .to-green-600 {
--tw-gradient-to: var(--color-green-600); --tw-gradient-to: var(--color-green-600);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
@ -2301,6 +2444,10 @@
--tw-gradient-to: var(--color-indigo-50); --tw-gradient-to: var(--color-indigo-50);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
} }
.to-orange-100 {
--tw-gradient-to: var(--color-orange-100);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-orange-400 { .to-orange-400 {
--tw-gradient-to: var(--color-orange-400); --tw-gradient-to: var(--color-orange-400);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
@ -2313,6 +2460,14 @@
--tw-gradient-to: var(--color-pink-500); --tw-gradient-to: var(--color-pink-500);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
} }
.to-purple-100 {
--tw-gradient-to: var(--color-purple-100);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-purple-600 {
--tw-gradient-to: var(--color-purple-600);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-red-50 { .to-red-50 {
--tw-gradient-to: var(--color-red-50); --tw-gradient-to: var(--color-red-50);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
@ -2341,6 +2496,10 @@
--tw-gradient-to: var(--color-teal-300); --tw-gradient-to: var(--color-teal-300);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
} }
.to-teal-500 {
--tw-gradient-to: var(--color-teal-500);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
.to-teal-500\/5 { .to-teal-500\/5 {
--tw-gradient-to: color-mix(in srgb, oklch(70.4% 0.14 182.503) 5%, transparent); --tw-gradient-to: color-mix(in srgb, oklch(70.4% 0.14 182.503) 5%, transparent);
@supports (color: color-mix(in lab, red, red)) { @supports (color: color-mix(in lab, red, red)) {
@ -2378,6 +2537,9 @@
.object-cover { .object-cover {
object-fit: cover; object-fit: cover;
} }
.object-center {
object-position: center;
}
.object-right { .object-right {
object-position: right; object-position: right;
} }
@ -2585,9 +2747,6 @@
.pl-4 { .pl-4 {
padding-left: calc(var(--spacing) * 4); padding-left: calc(var(--spacing) * 4);
} }
.pl-8 {
padding-left: calc(var(--spacing) * 8);
}
.pl-12 { .pl-12 {
padding-left: calc(var(--spacing) * 12); padding-left: calc(var(--spacing) * 12);
} }
@ -2754,6 +2913,9 @@
.text-blue-300 { .text-blue-300 {
color: var(--color-blue-300); color: var(--color-blue-300);
} }
.text-blue-400 {
color: var(--color-blue-400);
}
.text-blue-500 { .text-blue-500 {
color: var(--color-blue-500); color: var(--color-blue-500);
} }
@ -2865,6 +3027,12 @@
.text-white { .text-white {
color: var(--color-white); color: var(--color-white);
} }
.text-white\/10 {
color: color-mix(in srgb, #fff 10%, transparent);
@supports (color: color-mix(in lab, red, red)) {
color: color-mix(in oklab, var(--color-white) 10%, transparent);
}
}
.text-white\/70 { .text-white\/70 {
color: color-mix(in srgb, #fff 70%, transparent); color: color-mix(in srgb, #fff 70%, transparent);
@supports (color: color-mix(in lab, red, red)) { @supports (color: color-mix(in lab, red, red)) {
@ -3005,12 +3173,21 @@
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
} }
.shadow-green-500 {
--tw-shadow-color: oklch(72.3% 0.219 149.579);
@supports (color: color-mix(in lab, red, red)) {
--tw-shadow-color: color-mix(in oklab, var(--color-green-500) var(--tw-shadow-alpha), transparent);
}
}
.shadow-green-500\/50 { .shadow-green-500\/50 {
--tw-shadow-color: color-mix(in srgb, oklch(72.3% 0.219 149.579) 50%, transparent); --tw-shadow-color: color-mix(in srgb, oklch(72.3% 0.219 149.579) 50%, transparent);
@supports (color: color-mix(in lab, red, red)) { @supports (color: color-mix(in lab, red, red)) {
--tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-green-500) 50%, transparent) var(--tw-shadow-alpha), transparent); --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-green-500) 50%, transparent) var(--tw-shadow-alpha), transparent);
} }
} }
.ring-green-600 {
--tw-ring-color: var(--color-green-600);
}
.ring-green-600\/20 { .ring-green-600\/20 {
--tw-ring-color: color-mix(in srgb, oklch(62.7% 0.194 149.214) 20%, transparent); --tw-ring-color: color-mix(in srgb, oklch(62.7% 0.194 149.214) 20%, transparent);
@supports (color: color-mix(in lab, red, red)) { @supports (color: color-mix(in lab, red, red)) {
@ -3075,6 +3252,11 @@
-webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
} }
.backdrop-blur-xl {
--tw-backdrop-blur: blur(var(--blur-xl));
-webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
}
.backdrop-filter { .backdrop-filter {
-webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
@ -3295,6 +3477,13 @@
} }
} }
} }
.group-hover\:text-gray-600 {
&:is(:where(.group):hover *) {
@media (hover: hover) {
color: var(--color-gray-600);
}
}
}
.group-hover\:text-green-600 { .group-hover\:text-green-600 {
&:is(:where(.group):hover *) { &:is(:where(.group):hover *) {
@media (hover: hover) { @media (hover: hover) {
@ -3635,6 +3824,14 @@
} }
} }
} }
.hover\:from-blue-100 {
&:hover {
@media (hover: hover) {
--tw-gradient-from: var(--color-blue-100);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
}
}
.hover\:from-green-100 { .hover\:from-green-100 {
&:hover { &:hover {
@media (hover: hover) { @media (hover: hover) {
@ -3651,6 +3848,14 @@
} }
} }
} }
.hover\:from-orange-100 {
&:hover {
@media (hover: hover) {
--tw-gradient-from: var(--color-orange-100);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
}
}
.hover\:from-orange-600 { .hover\:from-orange-600 {
&:hover { &:hover {
@media (hover: hover) { @media (hover: hover) {
@ -3659,6 +3864,14 @@
} }
} }
} }
.hover\:from-purple-100 {
&:hover {
@media (hover: hover) {
--tw-gradient-from: var(--color-purple-100);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
}
}
.hover\:via-emerald-700 { .hover\:via-emerald-700 {
&:hover { &:hover {
@media (hover: hover) { @media (hover: hover) {
@ -3676,6 +3889,14 @@
} }
} }
} }
.hover\:to-blue-200 {
&:hover {
@media (hover: hover) {
--tw-gradient-to: var(--color-blue-200);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
}
}
.hover\:to-cyan-100 { .hover\:to-cyan-100 {
&:hover { &:hover {
@media (hover: hover) { @media (hover: hover) {
@ -3684,6 +3905,14 @@
} }
} }
} }
.hover\:to-green-200 {
&:hover {
@media (hover: hover) {
--tw-gradient-to: var(--color-green-200);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
}
}
.hover\:to-green-800 { .hover\:to-green-800 {
&:hover { &:hover {
@media (hover: hover) { @media (hover: hover) {
@ -3692,6 +3921,22 @@
} }
} }
} }
.hover\:to-orange-200 {
&:hover {
@media (hover: hover) {
--tw-gradient-to: var(--color-orange-200);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
}
}
.hover\:to-purple-200 {
&:hover {
@media (hover: hover) {
--tw-gradient-to: var(--color-purple-200);
--tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
}
}
}
.hover\:to-teal-700 { .hover\:to-teal-700 {
&:hover { &:hover {
@media (hover: hover) { @media (hover: hover) {
@ -3714,13 +3959,6 @@
} }
} }
} }
.hover\:text-gray-200 {
&:hover {
@media (hover: hover) {
color: var(--color-gray-200);
}
}
}
.hover\:text-gray-700 { .hover\:text-gray-700 {
&:hover { &:hover {
@media (hover: hover) { @media (hover: hover) {
@ -3749,6 +3987,13 @@
} }
} }
} }
.hover\:text-green-800 {
&:hover {
@media (hover: hover) {
color: var(--color-green-800);
}
}
}
.hover\:text-orange-500 { .hover\:text-orange-500 {
&:hover { &:hover {
@media (hover: hover) { @media (hover: hover) {
@ -3763,13 +4008,6 @@
} }
} }
} }
.hover\:text-orange-700 {
&:hover {
@media (hover: hover) {
color: var(--color-orange-700);
}
}
}
.hover\:text-orange-800 { .hover\:text-orange-800 {
&:hover { &:hover {
@media (hover: hover) { @media (hover: hover) {
@ -3864,11 +4102,6 @@
--tw-ring-color: var(--color-green-500); --tw-ring-color: var(--color-green-500);
} }
} }
.focus\:ring-orange-400 {
&:focus {
--tw-ring-color: var(--color-orange-400);
}
}
.focus\:outline-none { .focus\:outline-none {
&:focus { &:focus {
--tw-outline-style: none; --tw-outline-style: none;
@ -3950,11 +4183,21 @@
top: calc(var(--spacing) * 24); top: calc(var(--spacing) * 24);
} }
} }
.md\:right-5 {
@media (width >= 48rem) {
right: calc(var(--spacing) * 5);
}
}
.md\:right-10 { .md\:right-10 {
@media (width >= 48rem) { @media (width >= 48rem) {
right: calc(var(--spacing) * 10); right: calc(var(--spacing) * 10);
} }
} }
.md\:bottom-5 {
@media (width >= 48rem) {
bottom: calc(var(--spacing) * 5);
}
}
.md\:left-10 { .md\:left-10 {
@media (width >= 48rem) { @media (width >= 48rem) {
left: calc(var(--spacing) * 10); left: calc(var(--spacing) * 10);
@ -4110,11 +4353,6 @@
width: calc(33.333% - 1rem); width: calc(33.333% - 1rem);
} }
} }
.md\:w-auto {
@media (width >= 48rem) {
width: auto;
}
}
.md\:max-w-6xl { .md\:max-w-6xl {
@media (width >= 48rem) { @media (width >= 48rem) {
max-width: var(--container-6xl); max-width: var(--container-6xl);
@ -4158,6 +4396,11 @@
grid-template-columns: repeat(5, minmax(0, 1fr)); grid-template-columns: repeat(5, minmax(0, 1fr));
} }
} }
.md\:grid-cols-6 {
@media (width >= 48rem) {
grid-template-columns: repeat(6, minmax(0, 1fr));
}
}
.md\:flex-row { .md\:flex-row {
@media (width >= 48rem) { @media (width >= 48rem) {
flex-direction: row; flex-direction: row;
@ -4198,6 +4441,11 @@
gap: calc(var(--spacing) * 8); gap: calc(var(--spacing) * 8);
} }
} }
.md\:gap-12 {
@media (width >= 48rem) {
gap: calc(var(--spacing) * 12);
}
}
.md\:space-y-0 { .md\:space-y-0 {
@media (width >= 48rem) { @media (width >= 48rem) {
:where(& > :not(:last-child)) { :where(& > :not(:last-child)) {
@ -4207,15 +4455,6 @@
} }
} }
} }
.md\:space-x-6 {
@media (width >= 48rem) {
:where(& > :not(:last-child)) {
--tw-space-x-reverse: 0;
margin-inline-start: calc(calc(var(--spacing) * 6) * var(--tw-space-x-reverse));
margin-inline-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-x-reverse)));
}
}
}
.md\:space-x-8 { .md\:space-x-8 {
@media (width >= 48rem) { @media (width >= 48rem) {
:where(& > :not(:last-child)) { :where(& > :not(:last-child)) {
@ -4230,6 +4469,11 @@
align-self: flex-start; align-self: flex-start;
} }
} }
.md\:rounded-2xl {
@media (width >= 48rem) {
border-radius: var(--radius-2xl);
}
}
.md\:rounded-tr-\[30px\] { .md\:rounded-tr-\[30px\] {
@media (width >= 48rem) { @media (width >= 48rem) {
border-top-right-radius: 30px; border-top-right-radius: 30px;
@ -4260,6 +4504,11 @@
padding-top: calc(var(--spacing) * 0); padding-top: calc(var(--spacing) * 0);
} }
} }
.md\:pt-8 {
@media (width >= 48rem) {
padding-top: calc(var(--spacing) * 8);
}
}
.md\:pt-12 { .md\:pt-12 {
@media (width >= 48rem) { @media (width >= 48rem) {
padding-top: calc(var(--spacing) * 12); padding-top: calc(var(--spacing) * 12);
@ -4275,6 +4524,11 @@
padding-top: calc(var(--spacing) * 28); padding-top: calc(var(--spacing) * 28);
} }
} }
.md\:pb-0 {
@media (width >= 48rem) {
padding-bottom: calc(var(--spacing) * 0);
}
}
.md\:pb-16 { .md\:pb-16 {
@media (width >= 48rem) { @media (width >= 48rem) {
padding-bottom: calc(var(--spacing) * 16); padding-bottom: calc(var(--spacing) * 16);
@ -4349,6 +4603,12 @@
line-height: var(--tw-leading, var(--text-xl--line-height)); line-height: var(--tw-leading, var(--text-xl--line-height));
} }
} }
.md\:text-xs {
@media (width >= 48rem) {
font-size: var(--text-xs);
line-height: var(--tw-leading, var(--text-xs--line-height));
}
}
.lg\:col-span-1 { .lg\:col-span-1 {
@media (width >= 64rem) { @media (width >= 64rem) {
grid-column: span 1 / span 1; grid-column: span 1 / span 1;
@ -4487,11 +4747,6 @@
padding-inline: calc(var(--spacing) * 12); padding-inline: calc(var(--spacing) * 12);
} }
} }
.lg\:py-4 {
@media (width >= 64rem) {
padding-block: calc(var(--spacing) * 4);
}
}
.lg\:text-left { .lg\:text-left {
@media (width >= 64rem) { @media (width >= 64rem) {
text-align: left; text-align: left;
@ -4534,21 +4789,6 @@
} }
} }
} }
.font-sans {
font-family: "Instrument Sans", sans-serif;
}
.bg-oren {
background-color: #f49827;
}
.bg-ijo {
background-color: #009d68;
}
.text-oren {
color: #f49827;
}
.text-ijo {
color: #009d68;
}
@property --tw-translate-x { @property --tw-translate-x {
syntax: "*"; syntax: "*";
inherits: false; inherits: false;

View File

@ -0,0 +1,46 @@
.scroll-container {
height: 100vh;
overflow-y: scroll;
scroll-snap-type: y mandatory;
scroll-behavior: smooth;
}
.section {
height: 100vh;
scroll-snap-align: start;
scroll-snap-stop: always;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
.section:nth-child(1) {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}
.section:nth-child(2) {
background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
}
.section:nth-child(3) {
background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
}
.section:nth-child(4) {
background: linear-gradient(135deg, #43e97b 0%, #38f9d7 100%);
}
.section-content {
text-align: center;
color: white;
max-width: 800px;
padding: 2rem;
}
.section h2 {
font-size: 3rem;
margin-bottom: 1rem;
}
.section p {
font-size: 1.2rem;
line-height: 1.6;
}

View File

@ -1,21 +1 @@
@import "tailwindcss"; @import "tailwindcss";
.font-sans {
font-family: "Instrument Sans", sans-serif;
}
.bg-oren {
background-color: #f49827;
}
.bg-ijo {
background-color: #009d68;
}
.text-oren {
color: #f49827;
}
.text-ijo {
color: #009d68;
}

View File

@ -0,0 +1,19 @@
.font-sans {
font-family: "Instrument Sans", sans-serif;
}
.bg-oren {
background-color: #f49827;
}
.bg-ijo {
background-color: #009d68;
}
.text-oren {
color: #f49827;
}
.text-ijo {
color: #009d68;
}

View File

@ -0,0 +1,96 @@
document.addEventListener("DOMContentLoaded", function () {
let isScrolling = false;
let currentSection = 0;
const sections = document.querySelectorAll(".section");
const container = document.querySelector(".scroll-container");
// Navigation dengan keyboard
document.addEventListener("keydown", function (e) {
if (isScrolling) return;
if (e.key === "ArrowDown" || e.key === "PageDown") {
e.preventDefault();
scrollToNextSection();
} else if (e.key === "ArrowUp" || e.key === "PageUp") {
e.preventDefault();
scrollToPrevSection();
}
});
// Touch/Wheel events untuk scroll snap yang lebih responsif
let touchStartY = 0;
let touchEndY = 0;
container.addEventListener("touchstart", function (e) {
touchStartY = e.changedTouches[0].screenY;
});
container.addEventListener("touchend", function (e) {
if (isScrolling) return;
touchEndY = e.changedTouches[0].screenY;
handleSwipe();
});
function handleSwipe() {
const swipeThreshold = 50;
const diff = touchStartY - touchEndY;
if (Math.abs(diff) > swipeThreshold) {
if (diff > 0) {
scrollToNextSection();
} else {
scrollToPrevSection();
}
}
}
function scrollToNextSection() {
if (currentSection < sections.length - 1) {
currentSection++;
scrollToSection(currentSection);
}
}
function scrollToPrevSection() {
if (currentSection > 0) {
currentSection--;
scrollToSection(currentSection);
}
}
function scrollToSection(index) {
if (index >= 0 && index < sections.length) {
isScrolling = true;
sections[index].scrollIntoView({
behavior: "smooth",
block: "start",
});
setTimeout(() => {
isScrolling = false;
}, 800);
}
}
// Update current section berdasarkan scroll position
container.addEventListener("scroll", function () {
if (isScrolling) return;
const scrollTop = container.scrollTop;
const sectionHeight = window.innerHeight;
const newCurrentSection = Math.round(scrollTop / sectionHeight);
if (
newCurrentSection !== currentSection &&
newCurrentSection >= 0 &&
newCurrentSection < sections.length
) {
currentSection = newCurrentSection;
}
});
// API untuk navigasi programmatic
window.scrollToSection = scrollToSection;
window.getCurrentSection = () => currentSection;
});