Better UI

This commit is contained in:
2026-03-06 15:33:05 +01:00 Unverified
parent e98a537882
commit 683368a354
14 changed files with 1060 additions and 309 deletions
+115 -1
View File
@@ -3,12 +3,50 @@
'use client'; 'use client';
import { useActionState, useEffect, useState } from 'react'; import { useActionState, useEffect, useState } from 'react';
import { FaPlus, FaTrash, FaArrowUp, FaArrowDown } from 'react-icons/fa'; // Importera pilarna
import { saveConfigAction } from './actions'; import { saveConfigAction } from './actions';
export default function AdminForm({ initialConfig }: { initialConfig: any }) { export default function AdminForm({ initialConfig }: { initialConfig: any }) {
const [state, formAction, isPending] = useActionState(saveConfigAction, null); const [state, formAction, isPending] = useActionState(saveConfigAction, null);
const [showToast, setShowToast] = useState(false); const [showToast, setShowToast] = useState(false);
const [classes, setClasses] = useState<Array<{ name: string, color: string, desc: string }>>(
Array.isArray(initialConfig.beachPage.classes)
? initialConfig.beachPage.classes
: [
{ name: 'Grön', color: '#16a34a', desc: 'Nybörjare' },
{ name: 'Blå', color: '#2563eb', desc: 'Spelat lite' },
{ name: 'Svart', color: '#111827', desc: 'Spelat mycket' }
]
);
const addClass = () => setClasses([...classes, { name: '', color: '#406185', desc: '' }]);
const removeClass = (index: number) => {
setClasses(classes.filter((_, i) => i !== index));
};
const updateClass = (index: number, field: keyof typeof classes[0], value: string) => {
const newClasses = [...classes];
newClasses[index][field] = value;
setClasses(newClasses);
};
// Funktioner för att byta plats på klasserna
const moveUp = (index: number) => {
if (index === 0) return;
const newClasses = [...classes];
[newClasses[index - 1], newClasses[index]] = [newClasses[index], newClasses[index - 1]];
setClasses(newClasses);
};
const moveDown = (index: number) => {
if (index === classes.length - 1) return;
const newClasses = [...classes];
[newClasses[index + 1], newClasses[index]] = [newClasses[index], newClasses[index + 1]];
setClasses(newClasses);
};
useEffect(() => { useEffect(() => {
if (state?.success) { if (state?.success) {
setShowToast(true); setShowToast(true);
@@ -70,7 +108,83 @@ export default function AdminForm({ initialConfig }: { initialConfig: any }) {
</label> </label>
</section> </section>
<button type="submit" disabled={isPending} className="bg-[#406185] text-white py-4 rounded-lg font-bold text-lg hover:bg-black transition-all active:scale-95 disabled:bg-gray-400"> {/* SPELKLASSER - Moderniserad för att matcha */}
<section className="flex flex-col gap-4">
<div className="flex justify-between items-center mb-2">
<h2 className="text-xl font-bold border-l-4 border-[#fdb84b] pl-2 text-[#406185]">Spelklasser</h2>
<button
type="button"
onClick={addClass}
className="flex items-center gap-2 text-sm font-bold text-white bg-[#406185] px-4 py-2 rounded hover:brightness-110 transition-all active:scale-95"
>
<FaPlus size={12} /> Lägg till
</button>
</div>
<div className="space-y-3">
{classes.map((c, index) => (
<div key={index} className="flex flex-col md:flex-row gap-3 items-center w-full">
{/* Sorteringspilar */}
<div className="flex md:flex-col gap-1 text-gray-400">
<button type="button" onClick={() => moveUp(index)} disabled={index === 0} className="hover:text-[#406185] disabled:opacity-30 disabled:hover:text-gray-400 p-1">
<FaArrowUp size={14} />
</button>
<button type="button" onClick={() => moveDown(index)} disabled={index === classes.length - 1} className="hover:text-[#406185] disabled:opacity-30 disabled:hover:text-gray-400 p-1">
<FaArrowDown size={14} />
</button>
</div>
<div className="flex-1 flex gap-2 w-full">
{/* Färgplockare som ser ut som ett vanligt inputfält */}
<div className="w-12 h-10 border rounded overflow-hidden shrink-0 focus-within:ring-2 focus-within:ring-[#406185]">
<input
type="color"
value={c.color}
onChange={(e) => updateClass(index, 'color', e.target.value)}
className="w-16 h-16 -m-2 cursor-pointer outline-none"
title="Välj färg"
/>
</div>
<input
type="text"
value={c.name}
onChange={(e) => updateClass(index, 'name', e.target.value)}
placeholder="Lagnamn (t.ex. Grön)"
required
className="w-1/3 border p-2 rounded focus:ring-2 focus:ring-[#406185] outline-none min-w-25"
/>
<input
type="text"
value={c.desc}
onChange={(e) => updateClass(index, 'desc', e.target.value)}
placeholder="Beskrivning (t.ex. Nybörjare)"
className="flex-1 border p-2 rounded focus:ring-2 focus:ring-[#406185] outline-none min-w-30"
/>
</div>
<button
type="button"
onClick={() => removeClass(index)}
className="text-gray-400 hover:text-red-500 p-2 rounded transition-colors self-end md:self-auto shrink-0"
title="Ta bort klass"
>
<FaTrash />
</button>
</div>
))}
{classes.length === 0 && (
<p className="text-gray-500 italic text-sm">Inga klasser inlagda. Besökarna kommer inte kunna välja nivå.</p>
)}
</div>
{/* Dold JSON-sträng för Server Action */}
<input type="hidden" name="classesJSON" value={JSON.stringify(classes)} />
</section>
<button type="submit" disabled={isPending} className="bg-[#406185] text-white py-4 mt-4 rounded-lg font-bold text-lg hover:bg-black transition-all active:scale-95 disabled:bg-gray-400 shadow-lg">
{isPending ? 'Sparar...' : 'Spara inställningar'} {isPending ? 'Sparar...' : 'Spara inställningar'}
</button> </button>
</form> </form>
+9
View File
@@ -8,6 +8,14 @@ import { revalidatePath } from 'next/cache';
export async function saveConfigAction(prevState: any, formData: FormData) { export async function saveConfigAction(prevState: any, formData: FormData) {
const config = await getConfig(); const config = await getConfig();
let parsedClasses = [];
try {
const classesJSON = formData.get('classesJSON') as string;
if (classesJSON) parsedClasses = JSON.parse(classesJSON);
} catch (e) {
console.error("Kunde inte parsa klasser", e);
}
const newConfig = { const newConfig = {
...config, ...config,
showBeachPromo: formData.get('showBeachPromo') === 'on', showBeachPromo: formData.get('showBeachPromo') === 'on',
@@ -19,6 +27,7 @@ export async function saveConfigAction(prevState: any, formData: FormData) {
otherInfo: formData.get('otherInfo') as string, otherInfo: formData.get('otherInfo') as string,
prizesText: formData.get('prizesText') as string, prizesText: formData.get('prizesText') as string,
isClosedOverride: formData.get('isClosedOverride') === 'on', isClosedOverride: formData.get('isClosedOverride') === 'on',
classes: parsedClasses,
} }
}; };
-127
View File
@@ -1,127 +0,0 @@
// app/api/submit/route.js
import nodemailer from 'nodemailer';
export async function POST(request) {
try {
const formData = await request.formData();
// 1. Extract form data (Matching your PHP POST variables)
const turnstileToken = formData.get('cf-turnstile-response');
const email = formData.get('email');
const name = formData.get('name');
const team = formData.get('team');
const tel = formData.get('tel');
const count = formData.get('count');
const level = formData.get('level');
const message = formData.get('message');
const honeypot = formData.get('website');
// 2. Security Checks (Honeypot & Turnstile)
if (honeypot) {
return Response.json({ success: false, message: 'Spam detekterat.' }, { status: 400 });
}
// Verify Turnstile
const turnstileRes = await fetch('https://challenges.cloudflare.com/turnstile/v0/siteverify', {
method: 'POST',
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
body: new URLSearchParams({
secret: process.env.TURNSTILE_SECRET || '', // Pulls from .env.local
response: turnstileToken?.toString() || '',
}),
});
const turnstileData = await turnstileRes.json();
if (!turnstileData.success) {
return Response.json({ success: false, message: 'Säkerhetsverifiering misslyckades (Turnstile).' }, { status: 400 });
}
let formattedTel = tel.replace(/\D/g, '');
if (formattedTel.startsWith('46')) formattedTel = formattedTel.substring(2);
else if (formattedTel.startsWith('0')) formattedTel = formattedTel.substring(1);
if (formattedTel.length === 9) {
formattedTel = `+46 (0)${formattedTel.substring(0, 2)}-${formattedTel.substring(2, 5)} ${formattedTel.substring(5, 7)} ${formattedTel.substring(7, 9)}`;
} else {
formattedTel = tel;
}
// 4. Send Email via Nodemailer (Replicating PHPMailer)
const transporter = nodemailer.createTransport({
host: '10.10.0.113', // Your internal SMTP Host
port: 25,
secure: false,
tls: {
rejectUnauthorized: false
}
});
const cleanMessage = message ? message.replace(/[\r\n;]/g, " ") : "";
const dateStr = new Date().toISOString().replace('T', ' ').substring(0, 19);
const emailHtml = `
<html>
<body style='font-family: Arial, sans-serif; line-height: 1.6; color: #333;'>
<h2 style='color: #cc8124;'>Beach-anmälan</h2>
<table style='width: 100%; max-width: 600px; border-collapse: collapse;'>
<tr><td style='padding: 5px; font-weight: bold; width: 150px;'>Lagnamn:</td><td>${team}</td></tr>
<tr><td style='padding: 5px; font-weight: bold;'>Kontakt:</td><td>${name}</td></tr>
<tr><td style='padding: 5px; font-weight: bold;'>E-post:</td><td>${email}</td></tr>
<tr><td style='padding: 5px; font-weight: bold;'>Telefon:</td><td>${formattedTel}</td></tr>
<tr><td style='padding: 5px; font-weight: bold;'>Spelare:</td><td>${count}</td></tr>
<tr><td style='padding: 5px; font-weight: bold;'>Nivå:</td><td>${level}</td></tr>
</table>
<p><strong>Meddelande:</strong><br>${message ? message.replace(/\n/g, '<br>') : ''}</p>
<hr style='border: none; border-top: 1px solid #ddd; margin: 30px 0;'>
<table border='1' style='border-collapse: collapse; font-family: Calibri, sans-serif; font-size: 11pt; width: 100%;'>
<tr>
<td style='padding: 8px; border: 1px solid #ccc;'>${team}</td>
<td style='padding: 8px; border: 1px solid #ccc;'>${count}</td>
<td style='padding: 8px; border: 1px solid #ccc;'>${level}</td>
<td style='padding: 8px; border: 1px solid #ccc;'>${name}</td>
<td style='padding: 8px; border: 1px solid #ccc;'>${formattedTel}</td>
<td style='padding: 8px; border: 1px solid #ccc;'>${email}</td>
<td style='padding: 8px; border: 1px solid #ccc;'>${dateStr}</td>
<td style='padding: 8px; border: 1px solid #ccc;'>${cleanMessage}</td>
</tr>
</table>
</body>
</html>
`;
// 1. Send the data to the Club
await transporter.sendMail({
from: `"Anmälan: ${name}" <no-reply@lerbergetsvolleyboll.se>`,
to: 'beach@lerbergetsvolleyboll.se',
replyTo: email?.toString(),
subject: `Beach turnering: ${team}`,
html: emailHtml,
});
// 2. Send the friendly auto-reply to the Applicant
await transporter.sendMail({
from: `"Lerbergets Volleybollsällskap" <no-reply@lerbergetsvolleyboll.se>`,
to: email?.toString(),
subject: `Bekräftelse på anmälan: ${team}`,
html: `
<div style="font-family: Arial, sans-serif; color: #333; padding: 20px;">
<h2 style="color: #406185;">Hej ${name}!</h2>
<p style="font-size: 16px;">Tack för din anmälan vi återkommer så fort vi kan.</p>
<br>
<p style="font-size: 14px; color: #666;">
Med vänliga hälsningar,<br>
Lerbergets Volleybollsällskap
</p>
</div>
`,
});
return Response.json({ success: true, message: 'Tack så mycket för anmälan! Vi svarar med en bekräftelse så fort vi kan.' });
} catch (error) {
console.error(error);
return Response.json({ success: false, message: 'Ett tekniskt fel uppstod. Försök igen senare.' }, { status: 500 });
}
}
+170 -50
View File
@@ -3,6 +3,7 @@
'use client'; 'use client';
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { FaClipboardList, FaClock, FaInfoCircle, FaLock, FaMapMarkerAlt, FaTicketAlt, FaTrophy, FaUsers } from "react-icons/fa";
import { IoIosMail } from "react-icons/io"; import { IoIosMail } from "react-icons/io";
import Footer from '../components/Footer'; import Footer from '../components/Footer';
import Header from '../components/Header'; import Header from '../components/Header';
@@ -16,6 +17,14 @@ export default function BeachClientPage({ config }: { config: any }) {
isClosed: false, isClosed: false,
}); });
const classesData = Array.isArray(config.beachPage?.classes)
? config.beachPage.classes
: [
{ name: 'Grön', color: '#16a34a', desc: 'Nybörjare' },
{ name: 'Blå', color: '#2563eb', desc: 'Spelat lite' },
{ name: 'Svart', color: '#111827', desc: 'Spelat mycket' }
];
useEffect(() => { useEffect(() => {
const updateTournamentInfo = () => { const updateTournamentInfo = () => {
const matchStart = new Date(config.beachPage.matchStart); const matchStart = new Date(config.beachPage.matchStart);
@@ -39,73 +48,184 @@ export default function BeachClientPage({ config }: { config: any }) {
<div className="min-h-screen flex flex-col font-sans bg-white text-black"> <div className="min-h-screen flex flex-col font-sans bg-white text-black">
<Header /> <Header />
<main className="grow flex flex-col items-center bg-[#c8e9f2] bg-[url('/images/volleyball-net.webp')] bg-cover bg-center bg-no-repeat w-full pb-20"> <main className="grow flex flex-col items-center bg-[#c8e9f2] bg-[url('/images/volleyball-net.svg')] bg-cover bg-center bg-no-repeat w-full pb-20">
<section className="flex flex-col items-center text-center w-full px-1.25">
<h2 className="mt-12.5"><img className="max-w-62.5" src="/images/hk-mosf.webp" alt="Mat- & Sommarfesten" /></h2>
<h1 className="font-beachday text-[clamp(45px,9vw,80px)] text-[#fdb84b] uppercase leading-none m-[20px_0_10px_0]">Beachturnering</h1>
<p className="font-bold italic text-[25px] mb-5 text-black">Samla ihop ett kompisgäng och anmäl er!</p>
<section className="flex flex-col items-center text-center w-full px-4 pt-16">
{/* Logotyp med subtil hover-effekt */}
<div className="relative group cursor-default">
<div className="absolute -inset-4 bg-white/20 blur-2xl rounded-full opacity-0 group-hover:opacity-100 transition-opacity duration-700" />
<img
className="w-full max-w-62.5 md:max-w-75 relative drop-shadow-2xl transform hover:scale-105 transition-transform duration-500"
src="/images/hk-mosf.webp"
alt="Mat- & Sommarfesten"
/>
</div>
{/* Huvudrubrik med 3D-känsla */}
<h1 className="font-beachday text-[clamp(45px,9vw,80px)] text-[#fdb84b] uppercase leading-[0.9] mt-8 mb-4 drop-shadow-[0_4px_4px_rgba(64,97,133,0.3)] tracking-wide wrap-break-word w-full max-w-full">
Beach&shy;turnering
</h1>
<p className="text-xl md:text-2xl font-bold text-[#39979f] bg-white/60 px-6 py-2 rounded-full backdrop-blur-sm shadow-sm">
Samla ihop ett kompisgäng och anmäl er!
</p>
{/* Moderniserad "Stängd"-box */}
{timeInfo.isClosed && ( {timeInfo.isClosed && (
<div className="bg-black p-5 rounded-[20px] my-5 mx-1.25 w-full max-w-150 shadow-xl border-l-8 border-red-600"> <div className="bg-white/95 backdrop-blur-md p-8 md:p-10 rounded-[30px] w-full max-w-2xl my-10 shadow-2xl border border-red-100 relative overflow-hidden flex flex-col items-center animate-fade-in">
<h3 className="text-red-500 text-[clamp(1.5rem,6.5vw,2rem)] font-bold pb-2.5 text-center">Anmälan är stängd!</h3> {/* Röd dekorationslist i toppen */}
<p className="text-white text-center whitespace-pre-wrap">{config.beachPage.closeReason}</p> <div className="absolute top-0 left-0 w-full h-2 bg-linear-to-r from-red-500 to-orange-400" />
<div className="bg-red-50 p-4 rounded-full mb-4 shadow-inner">
<FaLock className="text-red-500" size={32} />
</div>
<h3 className="text-red-600 text-[clamp(1.5rem,5vw,2.2rem)] font-black uppercase tracking-widest mb-3">
Anmälan är stängd
</h3>
<p className="text-gray-700 text-lg font-medium leading-relaxed max-w-md">
{config.beachPage.closeReason}
</p>
</div> </div>
)} )}
</section>
<div className="bg-[#b1e0e8] p-[0_20px_20px_20px] rounded-[20px] my-7.5 mx-1.25 flex flex-col items-center text-center w-full max-w-200 shadow-lg"> <section className="flex flex-col items-center text-center w-full px-1.25">
{/* INFORMATION TEXT (Var, När, Regler, etc.) */} <div className="bg-white/90 backdrop-blur-sm p-8 md:p-12 rounded-[30px] my-10 mx-2 flex flex-col items-center w-full max-w-4xl shadow-2xl border border-white/50">
<h4 className="text-black font-bold text-[1.25rem] mt-5 mb-0 italic">Var:</h4>
<p className="text-black text-[18px] m-[4px_10px]"><a target="_blank" rel="noreferrer" className="font-medium text-[#cc8124] hover:underline" href="https://maps.app.goo.gl/vJcdSDCbvdGYXPNY6">Kvickbadet</a> i Höganäs</p>
<h4 className="text-black font-bold text-[1.25rem] mt-5 mb-0 italic">När:</h4> {/* Större och tydligare badge för Turneringsinfo */}
<p className="text-black text-[18px] m-[4px_10px]">{timeInfo.dateStr}</p> <div className="bg-[#39979f] text-white px-8 py-2.5 rounded-full font-beachday tracking-widest text-3xl font-bold uppercase mb-10 shadow-lg">
<p className="text-black text-[18px] m-[4px_10px]">{timeInfo.matchStr}</p> Turneringsinfo
<p className="text-black text-[18px] m-[4px_10px]"> </div>
Samtidigt som <a target="_blank" rel="noreferrer" className="font-medium text-[#cc8124] hover:underline" href={config.beachPage.festivalLink}>Höganäs Mat- & Sommarfest</a>
</p>
<h4 className="text-black font-bold text-[1.25rem] mt-5 mb-0 italic">Regler:</h4> <div className="grid grid-cols-1 md:grid-cols-2 gap-x-12 gap-y-12 w-full text-left">
<p className="text-black text-[18px] m-[4px_10px] max-w-150">Matcherna spelas 4v4 med <a target="_blank" rel="noreferrer" className="font-medium text-[#cc8124] hover:underline" href="https://www.volleyboll.se/forbundet/valkommen-till-volleyboll/grenar-och-spelformer/volleyboll">inomhusregler</a>, förutom poängräkningen som följer reglerna för <a target="_blank" rel="noreferrer" className="font-medium text-[#cc8124] hover:underline" href="https://www.volleyboll.se/forbundet/valkommen-till-volleyboll/grenar-och-spelformer/beachvolley">beachvolleyboll</a>.</p>
<h4 className="text-black font-bold text-[1.25rem] mt-5 mb-0 italic">Klasser:</h4> {/* VAR & NÄR - Logistik */}
<p className="text-black text-[18px] m-[4px_10px] max-w-150"> <div className="space-y-4">
Turneringen kan komma att delas upp i tre olika klasser beroende antal anmälda lag och baserat nivå:<br /> <div className="flex items-center gap-3 text-[#cc8124]">
<strong className="text-green-700">Grön</strong> (Nybörjare),{' '} <FaMapMarkerAlt size={24} />
<strong className="text-[#0f65bf]">Blå</strong> (Amatör),{' '} <h4 className="font-beachday text-2xl uppercase tracking-[0.05em] text-black">Var</h4>
<strong className="text-black">Svart</strong> (Proffs) </div>
</p> <p className="text-gray-700 text-lg leading-relaxed">
<p className="text-black text-[18px] m-[4px_10px] max-w-150 italic">Gör en gissning i vilken nivå ni tror att ert lag skulle passa och skriv gärna något i anmälan om ni är osäkra.</p> <a target="_blank" rel="noreferrer" className="font-bold text-[#39979f] hover:underline decoration-2" href="https://maps.app.goo.gl/vJcdSDCbvdGYXPNY6">
Kvickbadet
</a> i Höganäs
</p>
<h4 className="text-black font-bold text-[1.25rem] mt-5 mb-0 italic">Kostnad:</h4> <div className="flex items-center gap-3 text-[#cc8124] mt-6">
<p className="text-black text-[18px] m-[4px_10px]">Gratis!!!</p> <FaClock size={24} />
<h4 className="font-beachday text-2xl uppercase tracking-[0.05em] text-black">När</h4>
</div>
<div className="text-gray-700 text-lg space-y-1">
<p className="font-bold">{timeInfo.dateStr}</p>
<p>{timeInfo.matchStr}</p>
<p className="text-sm italic pt-3 border-t border-blue-100 mt-2">
Samtidigt som <a target="_blank" rel="noreferrer" className="text-[#39979f] hover:underline" href={config.beachPage.festivalLink}>Höganäs Mat- & Sommarfest</a>
</p>
</div>
</div>
<h4 className="text-black font-bold text-[1.25rem] mt-5 mb-0 italic">Anmälan:</h4> {/* REGLER & KLASSER - Spelet */}
<p className="text-black text-[18px] m-[4px_10px] max-w-150">Anmälan görs genom anmälningsformuläret nedan. Du får ett bekräftelsemejl när vi kollat igenom er anmälan.</p> <div className="space-y-4">
<p className="text-black text-[18px] m-[4px_10px] italic">{timeInfo.deadlineText}</p> <div className="flex items-center gap-3 text-[#cc8124]">
<FaClipboardList size={24} />
<h4 className="font-beachday text-2xl uppercase tracking-[0.05em] text-black">Regler</h4>
</div>
<p className="text-gray-700 text-base leading-relaxed">
Matcherna spelas 4v4 med <a target="_blank" rel="noreferrer" className="text-[#39979f] font-bold hover:underline" href="https://www.volleyboll.se/forbundet/valkommen-till-volleyboll/grenar-och-spelformer/volleyboll">inomhusregler</a>,
förutom poängräkningen som följer reglerna för <a target="_blank" rel="noreferrer" className="text-[#39979f] font-bold hover:underline" href="https://www.volleyboll.se/forbundet/valkommen-till-volleyboll/grenar-och-spelformer/beachvolley">beachvolley</a>.
</p>
{/* Övrig info sektionen */} <div className="flex items-center gap-3 text-[#cc8124] mt-6">
<h4 className="text-black font-bold text-[1.25rem] mt-5 mb-0 italic">Övrig info:</h4> <FaUsers size={24} />
{(config.beachPage?.otherInfo || "").split('\n').map((line: string, i: number) => ( <h4 className="font-beachday text-2xl uppercase tracking-[0.05em] text-black">Klasser</h4>
line.trim() && <p key={i} className="text-black text-[18px] m-[4px_10px]">{line}</p> </div>
))} <div className="text-gray-700 text-sm space-y-3">
<p className="leading-snug">Turneringen kan delas upp i tre klasser beroende antal anmälda lag och nivå:</p>
<div className="flex gap-2 flex-wrap">
{classesData.map((c: any, i: number) => (
<span
key={i}
className="px-2.5 py-1 rounded-md font-bold border text-xs tracking-wider"
style={{ backgroundColor: `${c.color}15`, color: c.color, borderColor: `${c.color}40` }}
>
{c.name.toUpperCase()} {c.desc && <span className="font-normal opacity-80">({c.desc})</span>}
</span>
))}
</div>
<p className="italic text-xs text-gray-500">Gör en gissning er nivå i anmälan skriv gärna om ni är osäkra.</p>
</div>
</div>
{/* Pris sektionen */} {/* KOSTNAD & ANMÄLAN */}
<h4 className="font-beachday uppercase text-[30px] font-medium p-2.5 mt-5 text-black"> <div className="space-y-4 md:col-span-2 bg-[#fdb84b]/10 p-6 md:p-8 rounded-2xl border border-[#fdb84b]/20">
{config.beachPage?.prizesText || "Fina priser till alla pallplatser! 🏆"} <div className="flex flex-col md:flex-row gap-8">
</h4> <div className="flex-1 space-y-3">
<div className="flex items-center gap-3 text-[#cc8124]">
<FaTicketAlt size={24} />
<h4 className="font-beachday text-2xl uppercase tracking-[0.05em] text-black">Anmälan & Kostnad</h4>
</div>
<p className="text-2xl font-black text-green-700 uppercase tracking-wider">Kostnad: Gratis!</p>
<div className="text-gray-700 text-sm space-y-2">
<p>Anmälan görs via formuläret nedan. Du får ett bekräftelsemejl när vi granskat er anmälan.</p>
<p className="font-bold italic text-[#39979f]">{timeInfo.deadlineText}</p>
</div>
</div>
<div className="flex items-start gap-4 bg-white/60 p-5 rounded-xl shadow-inner border border-white flex-1">
<FaInfoCircle className="text-[#39979f] shrink-0 mt-1" size={20} />
<div className="text-sm text-gray-700">
<p className="font-bold text-black mb-2 uppercase tracking-wide text-xs">Övrig info:</p>
<div className="space-y-1.5">
{(config.beachPage?.otherInfo || "").split('\n').map((line: string, i: number) => (
line.trim() && <p key={i} className="leading-tight flex gap-2"><span></span> {line}</p>
))}
</div>
</div>
</div>
</div>
</div>
</div>
{/* Kompaktare PRIS-BANNER */}
<div className="mt-10 w-full max-w-2xl bg-linear-to-r from-[#39979f] to-[#62b8bc] py-4 px-8 rounded-2xl shadow-xl border-b-4 border-black/20">
<div className="flex items-center justify-center gap-4">
<FaTrophy className="text-[#fdb84b] shrink-0" size={28} />
<h4 className="font-beachday uppercase text-[clamp(1.1rem,4vw,1.8rem)] tracking-[0.05em] font-medium text-white text-center leading-none">
{config.beachPage?.prizesText || "Fina priser till alla pallplatser! 🏆"}
</h4>
</div>
</div>
</div> </div>
</section> </section>
{/* Rendera formuläret endast om anmälan är öppen */} {/* Rendera formuläret endast om anmälan är öppen */}
{!timeInfo.isClosed && <BeachRegistrationForm />} {!timeInfo.isClosed && <BeachRegistrationForm config={config} />}
<section className="w-full flex justify-center px-1.25 mt-5"> <section className="w-full flex justify-center px-4 mt-10 mb-20">
<div className="bg-[#FAAC4F] flex flex-col justify-center items-center py-2.5 rounded-[20px] m-[10px_5px] w-full max-w-100 shadow-md"> <div className="bg-linear-to-br from-[#39979f] to-[#62b8bc] p-10 md:p-12 rounded-[40px] shadow-2xl w-full max-w-2xl text-center transform transition-transform duration-500 border border-blue-400/20 relative overflow-hidden group">
<h3 className="text-white text-[clamp(1.5rem,6.5vw,2rem)] text-center font-bold">Kontakta oss</h3>
<a href="mailto:beach@lerbergetsvolleyboll.se?subject=Beach%20turnering" className="group flex justify-center items-center text-black font-bold text-[1.1rem] mt-2 relative pb-1"> {/* Dekorativ bakgrundscirkel */}
<IoIosMail className="h-7 w-7 mr-2" size={24} /> <div className="absolute -right-10 -top-10 w-40 h-40 bg-white/5 rounded-full blur-2xl group-hover:bg-white/10 transition-colors duration-700" />
<span>beach@lerbergetsvolleyboll.se</span>
<span className="absolute bottom-0 left-0 w-full h-0.5 bg-black transform scale-x-0 transition-transform duration-300 origin-left group-hover:scale-x-100" /> {/* Ikon-badge */}
<div className="bg-linear-to-br from-[#fdb84b] to-[#e69c24] w-20 h-20 rounded-full flex items-center justify-center mx-auto mb-6 shadow-lg border-4 border-[#62b8bc] relative z-10">
<IoIosMail className="text-white" size={40} />
</div>
<h3 className="font-beachday text-white text-[clamp(2rem,5vw,3rem)] uppercase tracking-widest mb-3 relative z-10">
Kontakta oss
</h3>
<p className="text-white mb-8 font-medium max-w-md mx-auto relative z-10">
Har du frågor om turneringen, regler eller vill ändra något i er anmälan? Tveka inte att höra av dig!
</p>
<a
href="mailto:beach@lerbergetsvolleyboll.se?subject=Beach%20turnering"
className="inline-flex items-center gap-3 bg-white text-[#39979f] font-black text-lg px-8 py-4 rounded-2xl hover:bg-[#fdf5e6] hover:scale-105 transition-all shadow-[0_10px_20px_rgba(0,0,0,0.2)] relative z-10"
>
<IoIosMail className="text-[#fdb84b]" size={28} />
<span>Skicka ett mejl</span>
</a> </a>
</div> </div>
</section> </section>
+163 -128
View File
@@ -3,157 +3,192 @@
'use client'; 'use client';
import { Turnstile, TurnstileInstance } from '@marsidev/react-turnstile'; import { Turnstile, TurnstileInstance } from '@marsidev/react-turnstile';
import React, { useRef, useState } from 'react'; import React, { useRef, useActionState, useEffect } from 'react';
import { PiCheckCircle, PiWarningCircle } from "react-icons/pi"; import { FaUser, FaEnvelope, FaPhone, FaUsers, FaTrophy, FaCheckCircle, FaExclamationTriangle } from "react-icons/fa";
import { submitRegistration } from './actions';
interface AlertState {
show: boolean;
type: 'success' | 'danger' | '';
message: string;
}
interface SubmitResponse {
success: boolean;
message: string;
detail?: string;
}
export default function BeachRegistrationForm() {
const [isSubmitting, setIsSubmitting] = useState<boolean>(false);
const [wasValidated, setWasValidated] = useState<boolean>(false);
const [alert, setAlert] = useState<AlertState>({ show: false, type: '', message: '' });
export default function BeachRegistrationForm({ config }: { config: any }) {
const [state, formAction, isPending] = useActionState(submitRegistration, null);
const formRef = useRef<HTMLFormElement>(null); const formRef = useRef<HTMLFormElement>(null);
const turnstileRef = useRef<TurnstileInstance>(null); const turnstileRef = useRef<TurnstileInstance>(null);
const handleSubmit: React.FormEventHandler<HTMLFormElement> = async (e) => { const classesData = Array.isArray(config.beachPage?.classes)
e.preventDefault(); ? config.beachPage.classes
const form = formRef.current; : [
if (!form) return; { name: 'Grön', color: '#16a34a', desc: 'Nybörjare' },
{ name: 'Blå', color: '#2563eb', desc: 'Spelat lite' },
{ name: 'Svart', color: '#111827', desc: 'Spelat mycket' }
];
setWasValidated(true); useEffect(() => {
if (!form.checkValidity()) return; // Rensa endast vid lyckad inskickning
if (state?.success) {
setIsSubmitting(true); formRef.current?.reset();
setAlert({ show: false, type: '', message: '' }); turnstileRef.current?.reset();
const formData = new FormData(form); } else if (state?.success === false) {
// Återställ Turnstile så de kan försöka igen vid fel
try { turnstileRef.current?.reset();
const response = await fetch('/api/submit', {
method: 'POST',
body: formData,
});
if (!response.ok) throw new Error(`Network error: ${response.status}`);
const result = (await response.json()) as SubmitResponse;
const message = result.detail ? `${result.message} ${result.detail}` : result.message;
setAlert({
show: true,
type: result.success ? 'success' : 'danger',
message: message,
});
if (result.success) {
form.reset();
setWasValidated(false);
if (turnstileRef.current) turnstileRef.current.reset();
}
} catch (error) {
setAlert({
show: true,
type: 'danger',
message: 'Ett tekniskt fel uppstod. Försök igen senare.',
});
} finally {
setIsSubmitting(false);
} }
}; }, [state]);
return ( return (
<section className="w-full flex justify-center px-1.25"> <section className="w-full flex justify-center px-4 mb-20">
<div className="bg-black p-5 rounded-[20px] my-7.5 mx-1.25 w-full max-w-180 shadow-2xl"> <div className="bg-[#fdf5e6] p-8 md:p-12 rounded-[40px] w-full max-w-3xl shadow-2xl border-b-8 border-[#e6be8a]">
<h2 className="font-beachday text-[clamp(1.875rem,5.2vw,50px)] text-white text-center m-[5px_0] uppercase tracking-wide">
Anmälningsformulär
</h2>
<form <div className="text-center mb-10 px-2">
ref={formRef} <h2 className="font-beachday text-[clamp(35px,8vw,60px)] text-[#39979f] uppercase tracking-wide leading-[0.9] wrap-break-word w-full max-w-full">
onSubmit={handleSubmit} Anmälnings&shy;formulär
className={`group/form flex flex-col items-center w-full mt-5 ${wasValidated ? 'was-validated' : ''}`} </h2>
noValidate <div className="h-1.5 w-24 bg-[#fdb84b] mx-auto mt-4 rounded-full" />
autoComplete="off" </div>
>
{/* INPUT FÄLT (Namn, Email, Tel, Lagnamn, Antal) */} <form action={formAction} ref={formRef} className="space-y-6">
{[
{ name: 'name', type: 'text', placeholder: 'Ditt namn', auto: 'name', error: 'Glöm inte ditt namn!' }, <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
{ name: 'email', type: 'email', placeholder: 'Email', auto: 'email', error: 'Emailadressen är inte giltig.' }, <InputGroup
{ name: 'tel', type: 'tel', placeholder: 'Telefonnummer', auto: 'tel', error: 'Glöm inte ett telefonnummer!' }, icon={<FaUser />}
{ name: 'team', type: 'text', placeholder: 'Lagnamn', auto: 'organization', error: 'Glöm inte ert lagnamn!' }, name="name"
].map((f) => ( placeholder="Ditt namn"
<div key={f.name} className="relative w-full mb-3.75"> required
minLength={2}
defaultValue={state?.values?.name || ''}
/>
<InputGroup
icon={<FaEnvelope />}
name="email"
type="email"
placeholder="namn@domän.com"
required
defaultValue={state?.values?.email || ''}
/>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
<InputGroup
icon={<FaPhone />}
name="tel"
type="tel"
placeholder="Telefonnummer"
required
pattern="[0-9+ \-]{8,}"
defaultValue={state?.values?.tel || ''}
/>
<InputGroup
icon={<FaTrophy />}
name="team"
placeholder="Lagnamn"
required
minLength={2}
defaultValue={state?.values?.team || ''}
/>
</div>
<div className="flex flex-col md:flex-row gap-8 bg-white/50 p-6 rounded-3xl border border-[#e6be8a]/30 shadow-inner">
<div className="flex-1">
<label className="flex items-center gap-2 font-bold text-[#39979f] mb-3 text-sm uppercase">
<FaUsers /> Antal spelare
</label>
<input <input
type={f.type} name={f.name} placeholder={f.placeholder} required autoComplete={f.auto} type="text"
className="peer bg-transparent text-white border-0 border-b-[5px] border-white w-full h-12.5 outline-none text-[20px] pl-2.5 rounded-none focus:ring-0 group-[.was-validated]/form:invalid:border-[#e60b20] group-[.was-validated]/form:valid:border-[#07ba4c] transition-colors" inputMode="numeric"
name="count"
required
pattern="^([2-9]|10)$"
title="Ange ett antal mellan 2 och 10"
onInput={(e) => {
e.currentTarget.value = e.currentTarget.value.replace(/\D/g, '');
}}
className="w-full p-4 rounded-xl border-2 border-transparent bg-white focus:border-[#39979f] outline-none transition-all shadow-inner"
placeholder="Minst 2"
defaultValue={state?.values?.count || ''}
/> />
<div className="hidden group-[.was-validated]/form:peer-invalid:block absolute right-2.5 top-2.25"><PiWarningCircle color='#dc3545' size={28} /></div>
<div className="hidden group-[.was-validated]/form:peer-valid:block absolute right-2.5 top-2.25"><PiCheckCircle color='#198754' size={28} /></div>
<div className="hidden group-[.was-validated]/form:peer-invalid:block text-[#e60b20] text-[14px] pl-2.5 mt-1 text-left w-full">{f.error}</div>
</div> </div>
))}
<div className="relative w-full mb-3.75"> <div className="flex-2">
<input type="number" name="count" placeholder="Antal spelare" min="2" required <label className="font-bold text-[#39979f] mb-3 block text-sm uppercase">Välj klass</label>
className="peer bg-transparent text-white border-0 border-b-[5px] border-white w-full h-12.5 outline-none text-[20px] pl-2.5 rounded-none focus:ring-0 group-[.was-validated]/form:invalid:border-[#e60b20] group-[.was-validated]/form:valid:border-[#07ba4c] transition-colors" /> <div className={`grid grid-cols-2 md:grid-cols-${Math.min(classesData.length, 3)} gap-3`}>
<div className="hidden group-[.was-validated]/form:peer-invalid:block text-[#e60b20] text-[14px] pl-2.5 mt-1 text-left w-full">Glöm inte ange antal lagmedlemmar!</div> {classesData.map((c: any) => (
<LevelButton
key={c.name}
value={c.name}
label={c.name}
desc={c.desc}
color={c.color}
defaultChecked={state?.values?.level === c.name}
/>
))}
</div>
</div>
</div> </div>
{/* RADIOS */} <textarea
<div className="w-full mt-2.5 text-left group/radios"> name="message"
{[ placeholder="Övrig info till oss..."
{ id: 'level-gron', val: 'Grön', label: 'Grön', color: 'text-green-700', accent: 'accent-green-600', desc: '(Nybörjare)' }, className="w-full h-32 p-4 rounded-2xl border-2 border-transparent bg-white focus:border-[#39979f] outline-none resize-none shadow-inner"
{ id: 'level-bla', val: 'Blå', label: 'Blå', color: 'text-[#0f65bf]', accent: 'accent-[#0f65bf]', desc: '(Spelat lite)' }, defaultValue={state?.values?.message || ''}
{ id: 'level-svart', val: 'Svart', label: 'Svart', color: 'text-black', accent: 'accent-black', desc: '(Spelat mycket)' }, />
].map((l) => (
<React.Fragment key={l.id}> <input type="text" name="website" className="hidden" tabIndex={-1} />
<input type="radio" id={l.id} name="level" value={l.val} required className={`inline-block align-middle m-[6px_5px] w-4 h-4 ${l.accent} cursor-pointer`} />
<label htmlFor={l.id} className="text-white inline-block align-middle cursor-pointer select-none"> <div className="flex justify-center py-2">
<strong className={`${l.color} bg-white px-0.75 rounded-sm font-bold`}>{l.label}</strong> {l.desc} <Turnstile
</label> ref={turnstileRef}
<br /> siteKey={process.env.NEXT_PUBLIC_TURNSTILE_SITE_KEY || ''}
</React.Fragment> options={{ theme: 'light' }}
))} />
<div className="hidden group-[.was-validated]/form:group-has-invalid/radios:block text-[#e60b20] text-[14px] pl-2.5 mt-2">Glöm inte ange spelarnivå!</div>
</div> </div>
<textarea name="message" autoComplete="off" placeholder="Övrig info..." className="w-full min-h-37.5 p-[12px_16px] border-[5px] border-white rounded-[10px] bg-transparent text-white text-[15px] resize-y outline-none mt-5" /> {state && (
<div className={`flex items-center gap-3 p-5 rounded-2xl font-bold transition-all ${state.success ? 'bg-green-100 text-green-700' : 'bg-red-100 text-red-700'}`}>
<div className="hidden"> {state.success ? <FaCheckCircle size={24} className="shrink-0" /> : <FaExclamationTriangle size={24} className="shrink-0" />}
<input type="text" name="website" tabIndex={-1} autoComplete="off" /> {state.message}
</div>
{alert.show && (
<div className={`w-full p-4 rounded-md text-center font-bold my-4 ${alert.type === 'success' ? 'bg-[#d1e7dd] text-[#0a3622] border-[#a3cfbb]' : 'bg-[#f8d7da] text-[#58151c] border-[#f1aeb5]'}`}>
{alert.message}
</div> </div>
)} )}
<div className="w-full flex justify-center mt-2.5"> <button
<Turnstile ref={turnstileRef} siteKey={process.env.NEXT_PUBLIC_TURNSTILE_SITE_KEY || ''} options={{ theme: 'dark' }} /> type="submit"
</div> disabled={isPending}
className="w-full py-5 bg-[#39979f] text-white rounded-2xl font-bold text-xl uppercase tracking-wide shadow-xl hover:bg-[#fdb84b] hover:text-[#39979f] transition-all active:scale-[0.98] disabled:bg-gray-300 disabled:text-gray-500"
<button type="submit" disabled={isSubmitting} className="bg-white text-black uppercase w-full max-w-75 h-12.5 text-[20px] font-bold rounded-[10px] my-5 flex justify-center items-center cursor-pointer hover:bg-gray-200 transition-all active:scale-95 disabled:opacity-70"> >
{isSubmitting && ( {isPending ? 'Skickar...' : 'Skicka anmälan'}
<svg className="animate-spin h-5 w-5 text-black mr-3" viewBox="0 0 24 24">
<circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" fill="none" />
<path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" />
</svg>
)}
<span>Skicka anmälan</span>
</button> </button>
</form> </form>
</div> </div>
</section> </section>
); );
} }
// Uppdaterad med defaultChecked support
function LevelButton({ value, label, desc, color, defaultChecked }: any) {
return (
<label className="cursor-pointer flex-1 relative" style={{ '--class-color': color } as React.CSSProperties}>
<input
type="radio"
name="level"
value={value}
required
className="peer sr-only"
defaultChecked={defaultChecked}
/>
<div className="text-center p-3 rounded-xl border-2 border-white bg-white text-gray-400 font-black transition-all peer-checked:text-white peer-checked:bg-(--class-color) peer-checked:border-(--class-color) peer-checked:scale-[1.03] shadow-sm h-full flex flex-col justify-center items-center">
<span className="uppercase tracking-tighter">{label}</span>
{desc && <span className="text-[10px] font-medium opacity-80 mt-1 uppercase tracking-widest">{desc.replace(/[()]/g, '')}</span>}
</div>
</label>
);
}
function InputGroup({ icon, ...props }: any) {
return (
<div className="relative group">
<div className="absolute left-4 top-1/2 -translate-y-1/2 text-[#e6be8a] group-focus-within:text-[#39979f] transition-colors">
{icon}
</div>
<input
{...props}
className="w-full pl-12 pr-4 py-4 rounded-xl border-2 border-transparent bg-white focus:border-[#39979f] outline-none transition-all shadow-inner placeholder:text-gray-400"
/>
</div>
);
}
+130
View File
@@ -0,0 +1,130 @@
// app/beach/actions.ts
'use server';
import nodemailer from 'nodemailer';
export async function submitRegistration(prevState: any, formData: FormData) {
// 1. Spara all rådata direkt för att kunna skicka tillbaka den vid fel
const rawData = {
name: formData.get('name') as string,
email: formData.get('email') as string,
tel: formData.get('tel') as string,
team: formData.get('team') as string,
count: formData.get('count') as string,
level: formData.get('level') as string,
message: formData.get('message') as string,
};
const honeypot = formData.get('website');
if (honeypot) {
return { success: false, message: 'Spam detekterat.', values: rawData };
}
// 2. Hämta Turnstile Token och Secret (MATCHING .env NAME)
const turnstileToken = formData.get('cf-turnstile-response');
const secretKey = process.env.TURNSTILE_SECRET; // Matchar din .env exakt
if (!secretKey) {
console.error("Saknar TURNSTILE_SECRET i miljön.");
return {
success: false,
message: 'Serverkonfiguration saknas. Kontakta administratör.',
values: rawData
};
}
// 3. Verifiera mot Cloudflare
try {
const turnstileRes = await fetch('https://challenges.cloudflare.com/turnstile/v0/siteverify', {
method: 'POST',
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
body: new URLSearchParams({
secret: secretKey,
response: turnstileToken?.toString() || '',
}),
});
const turnstileData = await turnstileRes.json();
if (!turnstileData.success) {
console.error("Turnstile failed:", turnstileData);
return {
success: false,
message: 'Säkerhetsverifieringen misslyckades. Ladda om sidan och försök igen.',
values: rawData // Returnerar värdena så användaren slipper skriva om dem
};
}
} catch (error) {
console.error("Turnstile fetch error:", error);
return {
success: false,
message: 'Kunde inte nå verifieringsservern.',
values: rawData
};
}
// 4. Formatera telefonnummer
let cleanTel = rawData.tel.replace(/\D/g, '');
if (cleanTel.startsWith('46')) cleanTel = cleanTel.substring(2);
else if (cleanTel.startsWith('0')) cleanTel = cleanTel.substring(1);
const formattedTel = cleanTel.length === 9
? `+46 (0)${cleanTel.substring(0, 2)}-${cleanTel.substring(2, 5)} ${cleanTel.substring(5, 7)} ${cleanTel.substring(7, 9)}`
: rawData.tel;
// 5. Nodemailer setup
const transporter = nodemailer.createTransport({
host: process.env.SMTP_HOST || '10.10.0.113', // Använder .env med fallback
port: 25,
secure: false,
tls: { rejectUnauthorized: false }
});
try {
const dateStr = new Date().toLocaleString('sv-SE');
// Mail till klubben
await transporter.sendMail({
from: `"Beach-anmälan: ${rawData.name}" <no-reply@lerbergetsvolleyboll.se>`,
to: 'beach@lerbergetsvolleyboll.se',
replyTo: rawData.email,
subject: `Anmälan: ${rawData.team}`,
html: `
<div style="font-family: sans-serif; max-width: 600px; border: 1px solid #eee; padding: 20px;">
<h2 style="color: #406185;">Ny anmälan: ${rawData.team}</h2>
<p><strong>Kontaktperson:</strong> ${rawData.name}</p>
<p><strong>E-post:</strong> ${rawData.email}</p>
<p><strong>Telefon:</strong> ${formattedTel}</p>
<p><strong>Antal spelare:</strong> ${rawData.count}</p>
<p><strong>Nivå:</strong> ${rawData.level}</p>
<p><strong>Meddelande:</strong><br>${rawData.message || 'Inget meddelande'}</p>
<hr>
<p style="font-size: 10px; color: #999;">Skickat: ${dateStr}</p>
</div>
`
});
// Bekräftelse till användaren
await transporter.sendMail({
from: `"LVS" <no-reply@lerbergetsvolleyboll.se>`,
to: rawData.email,
subject: `Vi har tagit emot din anmälan för ${rawData.team}`,
html: `<div style="font-family: sans-serif; padding: 20px;">
<h2>Hej ${rawData.name}!</h2>
<p>Tack för din anmälan till beachturneringen. Vi återkommer så snart vi har granskat era uppgifter.</p>
<p>Ses på stranden!<br><strong>Lerbergets Volleybollsällskap</strong></p>
</div>`
});
// Returnerar INGA värden här, vilket gör att formuläret kan rensas rent
return { success: true, message: 'Tack! Din anmälan har skickats. Håll utkik i din inkorg efter bekräftelse.' };
} catch (e) {
console.error("Nodemailer error:", e);
return {
success: false,
message: 'Kunde inte skicka mail. Kontakta oss manuellt istället.',
values: rawData
};
}
}
+3 -3
View File
@@ -27,7 +27,7 @@ export default function HomeClientContent() {
</div> </div>
<h4 className="italic text-xl my-2.5 font-bold">Lerbergets Volleybollsällskap</h4> <h4 className="italic text-xl my-2.5 font-bold">Lerbergets Volleybollsällskap</h4>
<p className="max-w-200 leading-[1.1]"> <p className="max-w-200 leading-[1.1]">
Klubben startade den 1 mars 2018 och har i snabb takt utvecklats... Klubben startade den 1 mars 2018 och har i snabb takt utvecklats med både kidsvolley, 4-mannavolley och ett gott gäng killar och tjejer som tränar tillsammans minst två gånger i veckan och sommaren spelas det beachvolley
</p> </p>
<div className="flex flex-col gap-2.5 mt-10"> <div className="flex flex-col gap-2.5 mt-10">
<HeroButton onClick={() => setActiveModal('member')}>Bli Medlem</HeroButton> <HeroButton onClick={() => setActiveModal('member')}>Bli Medlem</HeroButton>
@@ -35,8 +35,8 @@ export default function HomeClientContent() {
<HeroButton href="https://www.basesport.se/category/lerbergets-vbk">Klubbkollektion</HeroButton> <HeroButton href="https://www.basesport.se/category/lerbergets-vbk">Klubbkollektion</HeroButton>
</div> </div>
</div> </div>
<div className="hidden md:flex items-center p-2.5 justify-end"> <div className="relative w-64 md:w-75 player-animation">
<img src="/images/player.webp" alt="Spelare" className="max-h-112.5 player-animation" /> <img src="/images/player.svg" alt="Spelare" className="w-full h-auto" />
</div> </div>
</div> </div>
</section> </section>
+28
View File
@@ -0,0 +1,28 @@
{
"showBeachPromo": true,
"beachPage": {
"matchStart": "2026-06-13T10:00",
"isClosedOverride": false,
"closeReason": "Det är hela 26 lag anmälda och vi kan tyvärr inte ta emot fler anmälningar. Vi är glada över förväntan och bjuder in alla andra till att komma och kolla men vi har tyvärr inte kapaciteten till att ha med fler lag.",
"festivalLink": "https://www.kullahalvon.com/upptacka--uppleva/kultur--noje/evenemang-pa-kullahalvon/mat---sommarfesten.html",
"otherInfo": "Turneringen uppskattas hålla på till ca 17-18 tiden\r\nDet kommer finnas duschmöjligheter i anslutning till stranden.",
"prizesText": "Det kommer att finnas fina priser till alla pallplatser!",
"classes": [
{
"name": "Grön",
"color": "#07be15",
"desc": "Nybörjare"
},
{
"name": "Blå",
"color": "#2563eb",
"desc": "Spelat lite"
},
{
"name": "Svart",
"color": "#111827",
"desc": "Spelat mycket"
}
]
}
}
+11
View File
@@ -19,6 +19,7 @@
"devDependencies": { "devDependencies": {
"@tailwindcss/postcss": "^4.2.1", "@tailwindcss/postcss": "^4.2.1",
"@types/node": "^20", "@types/node": "^20",
"@types/nodemailer": "^7.0.11",
"@types/react": "^19", "@types/react": "^19",
"@types/react-dom": "^19", "@types/react-dom": "^19",
"eslint": "^9", "eslint": "^9",
@@ -1569,6 +1570,16 @@
"undici-types": "~6.21.0" "undici-types": "~6.21.0"
} }
}, },
"node_modules/@types/nodemailer": {
"version": "7.0.11",
"resolved": "https://registry.npmjs.org/@types/nodemailer/-/nodemailer-7.0.11.tgz",
"integrity": "sha512-E+U4RzR2dKrx+u3N4DlsmLaDC6mMZOM/TPROxA0UAPiTgI0y4CEFBmZE+coGWTjakDriRsXG368lNk1u9Q0a2g==",
"dev": true,
"license": "MIT",
"dependencies": {
"@types/node": "*"
}
},
"node_modules/@types/react": { "node_modules/@types/react": {
"version": "19.2.14", "version": "19.2.14",
"resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.14.tgz", "resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.14.tgz",
+1
View File
@@ -20,6 +20,7 @@
"devDependencies": { "devDependencies": {
"@tailwindcss/postcss": "^4.2.1", "@tailwindcss/postcss": "^4.2.1",
"@types/node": "^20", "@types/node": "^20",
"@types/nodemailer": "^7.0.11",
"@types/react": "^19", "@types/react": "^19",
"@types/react-dom": "^19", "@types/react-dom": "^19",
"eslint": "^9", "eslint": "^9",
+226
View File
@@ -0,0 +1,226 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Artboard" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 1400.1 2000">
<!-- Generator: Adobe Illustrator 30.1.0, SVG Export Plug-In . SVG Version: 2.1.1 Build 136) -->
<defs>
<style>
.st0, .st1, .st2, .st3, .st4, .st5, .st6 {
stroke-linecap: round;
}
.st0, .st1, .st2, .st4, .st5, .st6, .st7, .st8 {
stroke-miterlimit: 10;
}
.st0, .st1, .st2, .st6, .st7, .st8 {
stroke: #000;
}
.st0, .st2, .st3, .st4, .st5, .st7, .st8 {
fill: none;
}
.st0, .st3, .st4, .st6 {
stroke-width: 2px;
}
.st2, .st7 {
stroke-width: 4px;
}
.st9 {
fill: #fff;
}
.st3 {
stroke-linejoin: round;
}
.st3, .st4, .st5 {
stroke: #fff;
}
.st10 {
fill: #333;
}
.st11 {
fill: #999;
}
.st12 {
fill: #ffb48a;
}
.st8 {
stroke-width: 5px;
}
.st13 {
fill: #e6e6e6;
}
</style>
</defs>
<g id="Oikawa">
<g id="Nyanser">
<path class="st10" d="M1398.5,1173.5c-1.7-4.3-14-14.8-23.8-27.9-2.1-2.9,2.1-8.1,0-10.9-13.3-17.8,2.1-32.7,16.3-43.6,3.2-.2,1.5-25-1.8-27.5-3.2-2.4-55.7-9.3-58.3-13.2-2.6-3.9-1.1-35.7,2.2-49.8-1.2-10.3-2.8-34.3-5.2-36.3s-61.4,1.6-63,0-2.4-22.6-5.7-25c-3.2-2.4-38.6-5.7-44.4-8.9s-27.2-23.4-29.1-25c-1.9-1.6-3.2-27.1-6.5-29.9-3.2-2.8-38.4-.5-39.6-3-1.2-2.4,2.3-62.4.4-74.6-5.2-5.7-77.5-14.5-75.5-22.6,2-8.1,23.4-25.8,22.1-29.8s-34.2-33.2-34.2-33.2c22.9-9.3,38.6-.4,52.4,17.9,2.7-7.6,1.9-17.7-6.3-26.8,19.4,3.6,36.8,11.2,50.9,25,0,0-.9-39.7,0-43.8,3.4,2.6,11.7,15.5,17.8,17.1s14.5,2.4,23.4,0,14.5-11.3,14.5-11.3c0,0-19.8,0-22.6-7.3-2.8-7.3-4-21-2.4-22.6s19.1,10.9,21.8,12.1c-2.5-3.5-22.6-24.6-21.8-27.5.8-2.8,34.7-1.5,34.7-1.5-41.6-19.4-24.6-35.3-50.1-52,0,0,23.4-1,39.7-8.6,0,0-30.4-9-38.6-20.6-8.2-11.6-36-30.7-44.7-36.9,4,0,21,3.6,37.7,2.3-18.6-28.2-13-27-77.3-29.8-1.6-3.2-3.2-14.1,5.7-35.5,0,0-24.2,11.3-25,17.8s0,16.1,0,16.1c-29.1-4.9-27.1,9.3-31.2,11.3-4.2,2-36.6-.7-41.5,2.6s-4,23.3-12.9,25.7-49.9-.3-52.4,2.6,7.1,20.9,4.7,23.3c-2.4,2.4-13.3,6.5-13.7,9s8.1,13.6,5.7,15.2c-2.4,1.6-3.6-4-6.5-3.2s-22.7,23.4-24.2,28.3c1.2,7.3,27.8,20.5,30.7,22.6,2.9,2.2,2,10.1,0,11.3s-14.9,1.6-17.8,0c-2.8-1.6-6.5-10.5-6.5-10.5,0,0-32.3-47.7-40.4-50.9-42-4.4-88.4-29.9-91.3-33.9-2.8-4,.8-48.5-3.2-51.7s-9.7-4.4-31.5-16.1c-1.6-77.5-74.3-95.3-74.3-95.3,0,0-22.6-49.8-27.3-51.3-4.7-1.5-58.7,3.6-69.2-1.8-20.6-30.1-99.3-84.7-105.8-100.4s-3.9-27.5-9.6-38.8c-3-13.1-83.3-119.1-87-120.3-4.8-1.6-17.4,0-28.3-5.7-10.9-5.7-38.8-22.6-55.7-25-17.8,7.7-37,38.8-37,38.8,0,0-31.9-24.4-57.9-37.6C152.1,31.7,62.5,5.7,12.9,0c-2.4,10.9,17,27.1,37.1,29.9C23,40,.7,53.8,5.7,61.1c5,7.3,50.3-10.8,59-11.8-5.7,4.5-42.4,18.6-59,30.7-8.1,6.1-6.7,13.9,7,10.5,0,0,56-18.8,64.9-20.2-5.2,5.4-39.6,29.1-39.6,29.1-11.3,11.5-4.8,12.2,8.1,8.9,17.8-4.8,34.4-19.9,51.7-22.6,13.4,4.1,21.8,9.7,27.5,16.2,29.5,24.7,56.7,35.1,90.5,32.3,5.7,1.6,10.5,4,10.5,4,0,0,0,9.1,4,15.6s60.4,47.1,64.9,53.6,5.5,22.6,6.6,28.4c1.1,5.8,42.8,61.9,54,71.1,2,6.5,6.7,21.8,12,28.3s23.3,24.4,45.1,26c8.5,2.4,29.5,14.9,29.9,38,9.7,22.6,152.2,176.9,193,194.6,3.2,46,40.7,88.6,46,100.2,5.3,11.5.8,10.1-4.8,21-5.7,10.9-125.2,76-131.6,80-6.5,3.9-65.8,36.3-80.6,60.4-15.1,1.3-62.3,21.5-68.8,23.6-6.5,2.1-56.8,21.2-60.6,22.6s-66.9,25.8-66.9,25.8c-2.8,1-.4,22.7-.1,26.7s-15.5,5.5-16.7,10.8,26.1,63.7,31,68.9c4.8,5.2,19,18.6,21,23.8s1.5,8.8,3.5,15.2,23,45.6,93.7,122.6c.4,4-24.6,25.8-8.9,38.1s71.9,42,71.9,42c0,0-11.8,50.4-23.8,74.5-2.9,5.8-4.4,12.3-4.5,18.8-.3,26.3-1.4,48-1.6,55.2-.2,8.1-11.9,37.2-13.7,42.8-1.8,5.6-29.1,60.4-32.3,67-3.2,6.7-11.8,47.1-12.9,51.7-1.1,4.6-4,56.4,0,59.6s26.2-.7,29.1,1.8c-12.5,100.6,3,188.4,5.4,203.4,2.4,14.9,8.2,29.6,10,39.7,1.7,10.1,2.5,42.4,3.2,55.7.8,13.3,20.2,39.2,51.7,40.4s36.5,1.9,49-1.8,29.4-20.1,34.2-24.1,12.1-13.7,22.6-17c137.3-46.4,202.3-84.8,206-84,3.6.8,60.8,88.4,67.2,96,5.5,5.8,14.1,7.9,19.2,10.5,5.2,2.6,47.2,3.5,58.2-1.8s32.1-28.6,34.7-31.2c2.6-2.6,2.4-14.1,4.8-16.2,2.4-2,7.7-1.6,9.7,0,2,1.6-.3,25.6.8,31.5,0,13.4,67.6,112.4,99.3-4,3.6-31.1-3.7-98.5-5.2-106.7-1.1-6-1.7-8.7-2.8-15.2,25-38.4,73.9-69.9,80.8-73.1s16.7-1.6,21.1.4,11.2,14.1,15.6,16.2,17.5-1.2,19.9.8-.8,25.4,2.4,27.5,9.7-1.8,12.4-2.4,5.2,8.9,5.2,8.9c0,0,15.1,1.4,17,1.6s-1.6-6.1,1.6-8.1c3.2-2,10.5-.8,13.7,4-.4,12.9,16.6,61.4,40.4,85.6,8.9,8.5,52.1,63,74.3,0,25-56.1-39.6-159.9-39.6-159.9,0,0-32.3-47.7-35.5-83.2.8-11.2-25.6-88.2-44.2-94.2-18.6-6.1-26.2-6.8-40.7-4.3-12.1,5.2-46,46-48.5,51.7-2.4,5.7-6.9,32.3-21.8,36.3-1.6,8.1,0,17.5-2.4,22.8s-40.4,32.4-53.7,36.1-52.8,7.7-56,5.2-18.7-52.8-50.8-55.7c-17-.8-75.8,51.8-87.5,48.2-2.8-29.1-28.3-53.7-29.1-79.2,3.6-8.5,5.9-4,5.5-8.9-1.2-38.8-37-81.6-37-87.2s11.2-15.6,9.2-23.3c-2-7.7-25.4-26.9-26.2-31s15.1-77.4-20.1-128.3c1.2-4,6.9-6.1,6.5-9.7s-15.3-25-17-39.6c-1.6-14.5,13.7-68.5,14.5-72.7.8-4.2,1.6-18.6,1.6-18.6,0,0,11.3-2,12.9,0,1.6,2,3.9,10.8,10.4,12.8s40.7,0,49.5-4.8c8.9-4.8,63.8-66.8,75.1-74,11.3-7.3,59.2-17.1,100.8-75.2,28.3,4,76.3-41.6,82.4-42.8,40.4,26.6,88.4,19.8,76.7,38,1.2,14.1-21,30.3-21,35.5s34.7,19.4,34.7,19.4c0,0,26.2,6.7,35.9,17.6,1.2,6.5,14.5,9.4,11.3,15.5-4.3,8.2-10,20.9-10,24.6,0,6.5.3,14.2,2.6,19,2.2,4.8,11.9,20.4,13.7,23.4s.1,21.5,2.6,23.6,15.8,1.1,18.2-.9c2.4-2,2.8-22.2,5.7-22.6s17.6,23,21,27.5c5.3,2.1,20.8.7,22.9.8,2.1,0-.3,16.6,2.7,22.6,4,3.2,15.3-2.6,16.4-1.6,1.1,1-.4,3.8.8,4.8,1.2,1,14.3.7,15.9-1.8,1.6-2.4,1.8-21.7,1.8-24.9s9.4,3.2,11.8,0c2.4-3.2,2-45.6,0-50.9h0ZM738.9,1771.4c-2,2.4-55.6-2.7-66.9-3.5-46.4-10.5-107.4,14.5-109,12.5-.8-5.6-.6-21.8,1.8-26.9s23.2-44.8,25.6-54.7c2.4-9.8,3.8-27.9,3.8-27.9,0,0,9.3,1.2,19,.4,14.1.4,15.7-6.4,16.6-17s1.2-33.9,2.8-56.9c22.6,19.3,38,74.7,40.4,75.9,2.4,1.2,21.1-10.1,24-8.5,11.3,56.1,40.1,85.6,42.1,90.5s2,13.6,0,16h0Z"/>
<path class="st9" d="M401.8,1196s36.7,22.3,37.4,22.7,49.6,23.5,49.6,23.5c0,0,52.4,8.4,53.3,8.5s59.7,3.9,59.7,3.9c0,0,47.9,7.7,49.1,8,1.2.3,40.8,11.1,40.8,11.1l76.4,4.6,20.3,9,14.2,27.3-3.6,12.1-12.2,6-55.5,3.1-55.8-4.7s-35.7-10.7-39-11.5c-3.3-.8-60.9-12.8-62.4-13.1-1.5-.3-57.7-12.6-57.7-12.6l-57.9-21.4s-49.6-27.9-51.8-29.3-19.8-17.3-19.8-17.3l2.6-12.9,12.4-17h0Z"/>
<path class="st9" d="M504.8,1629.5l3.6-25.9,1.3-41.6v-18.6l-8.3-4.1-2.7-12.8,2-4.7,13.5-16.4,7.6-21.1,5.1-40.4v-20.4l-3.5-13-9.2-12-3.6-10.3-.8-20.6,2-26.1,4.5-15.5,9.9-15.2,7.7-12-26-5-36.7-13.5-7.6-4.7-9.2,47.7-1.4,24.4,2.4,38.5,6.5,26.2,8.8,16.8.6,9.5-5.6,11.8-11.6,12.7-14.1,10.6-5.6,6.4-4.5,8.5-4.1,14.7-9.8,12.3-10.5,12.6-4.2,7.1-2,27.7-2.7,66.2,13.3-2.5,14.7-34.7,5.5-5.9s1.2,18.8,1.7,19.7,7.4,19.2,7.4,19.2l9.7,6.1,56-1.9h0Z"/>
<path class="st9" d="M491.6,1239.6l.5-29.4-.3-14.5,14.3-1.4-28-31.6,5.6-43.9,15-20.7,7.4-22,5.3-18.2,5.8-8.1,14-6.1,2.6-8.5,48.6-17.8,10.5-7.9,3.1-8.5,2.9-4.8,2-1.1,26.5-12.2,11.2-14.8,9.4-27,5.3-29.5,1.3-7.7,2.3-2.4,5.1,6.5,8.4,6.8,3.8-2.5,1-13.4,1.2-18.7,2.4-5.7,10.9-7.8,15.4-10.8,9.4-9.2,1.6-11.5,3.1-6.5,5.7-2.1,7.1,2.1,1.2,6.6,3.8,2,39.7-4.3,57.6-14.3,33.8-14.2,30.9-18.2,26.4-20.9,9.6-7,6.2.2,2.6,1.6,4.1-3,2.2-32,4.3-1,7.2,15,15.2,28.8,4.8,2.1,26.8.7,12.1-.5,18.2,20.3,15.6,20.8,1.5,33.3-1.3,29.2-3.7,36.6-6.4,40.1-8.1,41.8-12.6,43-19.6,37-18.1,27.8-4.4,11.1,39.7-28.8,29.6-32.6,19.5-4.8,12.2-5.2,2.1-29.2,5-45.6,1-32.4-3.3-41.3-4-46.6-3.6-35.3-3.9-12.8-8.4-7.3-11.7-6-4.3-13.8-8.3-13.8-2.8-6.6,6.1,1.9,6-.8-7.2-10.5-17.4-17.2-27-19.2-29.8-14.1-24.8-6.9-17.8-2.5-3.6-.3-.8,9.3,1.2,12.1,1.8,27.2-.9,13.9-9.1,4.6-25.3,8.7-33.9,9.1-41.7,6.4-27,1.6-20.3-1.6-23.6-12.4-33.9-1.1-16-4.8-8.1,10.1-11,8.2-1.9,8.7-10.4,17.4-14.7,13.7-10.3,10.5s-7.7,16.3-8.1,17.3-10.2,25.5-10.2,25.5l-9.4,15.7-13.1,16.2-12.1,20.8-13.8,23.3-16.7,13.7-17.2,10.1-13.7,5.8-13.2,12.5-14.9,30.5-15.6,6.8-22.8,20.1-13.7,9.5-1.5,16.4s-6.4,24.3-6.6,26.4-2.4,44.5-2.4,44.5l-5.3,28.4-9,20.5-12.6,14.5,32.1,19.5,52.4,20.4h0Z"/>
<polygon class="st12" points="1024.5 691.2 1004.2 675.8 970 652.1 936.1 647.6 922.5 645.5 920.7 634 890.1 611.5 909.7 585.5 921.2 585.5 915.1 571.1 928.8 562.1 924.8 538.4 978.2 535.5 989.4 510.6 1068.8 505.5 1128.1 574.8 1122.4 661.8 1024.5 691.2"/>
<path class="st12" d="M1273.6,1121.1l-6.6,20s-3.7,26.8-3.5,27.7,15.2,28.1,15.2,28.1l3.2,21.2,14.4,2.6,6.2-6.7,2.6-17.2,20.3,26.5,23.6,1.8,2.7,22.6,16.4-1.6,4.1,5.4,14.3-1.9v-25.2l12.5-1.9,1.1-43.4-16.6-22.7-8.9-19.7-17.5,9.1-23.9,9.1-15.3-1.6-44.2-32.2h0Z"/>
<path class="st12" d="M12.9,0l93.1,20.1,64.5,21.3,57.1,34.9,7.7,7.3-10.3,24,1.1,31.8-13.4-5.1-36.9-1.6-31.8-14.2-22.4-20-27-14.2-56,26-4.9-6.1,22.6-17.8,15-14.9-29,9.2-33.6,10.5-9.7-4.8,18.8-14.9s50-26.9,48.8-25.7S11.8,62.8,11.8,62.8l-5.9-7,41.5-25-22.3-11.3L12.9,0h0Z"/>
<path class="st12" d="M403.6,1648.9l-5.4,50.8v70l5.6,58.3s9.5,33.2,9.8,34.1,8.2,38.5,8.2,38.5c0,0,1.2,47.1,1.5,47.9s16.2,24.3,16.2,24.3l41,13.5h42.4l26.1-18.5,18.8-17.6,36.3-15.3,72.5-27.3,107.4-50.3,69-26.8,31.8-13.2s-2.7-23-3.9-24.8-10.9-58.4-10.9-58.4l-4.8-6.5s-36,22.9-36.9,23.2c-.9.3-56.3,17.9-56.3,17.9,0,0-33.3,3.6-34.5,3.6s-37-.7-37-.7l-37.5-5.1-36-.3-33.9,7.3-30.4,6.4s-.7-16.5,0-18.2,8.6-28.2,8.6-28.2c0,0,16.3-26.9,16.7-27.6s4.2-32.3,4.2-32.3l6.1-32.5-.9-7.1-15.9-10.4s-23-3.7-24-3.4-26.6,3.7-26.6,3.7c0,0-16.2,4.8-16.5,5.2s-26.6,1.1-26.6,1.1c0,0-29.7,1.6-32.9.8-3.2-.8-14.1-4.4-15.6-5.5s-7.4-19.2-7.4-19.2l-1.8-14.7-.5-6.5s-7.8,12.2-8,12.6-5.3,14.9-6.2,16.5-11.6,34.9-11.6,34.9h0Z"/>
<path class="st12" d="M692.1,1660.9l9.7,23.9,15,36.5,18.2,28.4,5.4,14.5,56.6,109.2,47.2,69.2,24.9,21.9s37.6,7,40,4.9,30.4-12.5,32.1-13.9,20.8-18,20.8-18l8.1-21,8.9-4.8,97.5-96.3,29.7-34.8,21.5-15,17.9-16.2,23.9-1.9,18.2,6.3-18.2-38.8s-.5-26.3-1.6-28.7-4-22.6-4.4-25.4-13.3-15.6-13.3-15.6l-10.5,8.8-19.6,17.7-20.4,12.5-21.8,6.9s-22.8,3.8-24.9,2.7-19,.9-19,.9l-138.2-7.4s-5.3-21.2-5.4-21.7-12.6-25.5-13.6-27.6-8.4-20.5-8.8-22.2c-.4-1.6-.4-10.4-.4-10.4l6.5-8.1-11.8-3.6s-21.7-2.7-22.9-2.5-24.3.7-24.7,2.5-21.9,9.4-23.9,10.3c-2,.9-21.9,5-22.9,8.3s-27,19.1-28.8,19.1c-1.9,0-19.2,12-20.4,12.4-1.2.4-26.4,16.9-26.4,16.9h0Z"/>
</g>
<g id="Shoes_and_Knees">
<path class="st11" d="M1240.8,1541.6l25.6,12.2s14.2,24.2,15,26.1,18.2,42.2,18.5,43.4,4.1,32.2,4.6,33.9,12.3,31.4,12.9,32.6,12.9,23.7,13.7,24.9,13.9,23.4,15,25.3,22.5,47,22.7,48.7,8.1,27.2,8.5,28.8,4.7,38.4,4.7,38.4c0,0-6.6,30-7.1,31.1-.5,1.2-10.4,17.9-10.4,17.9s-32.2-2.1-34-2.7-21.2-17-23-18.2c-1.8-1.2-17.3-29.7-18.2-32.1-.9-2.4-10.6-50.3-10.6-50.3,0,0,1.5-26.3,1.5-28.2s-9.7-24.1-10.6-26.1-14.5-17.1-14.8-17.9-2.1-19.3-2.7-23.2-2.1-27.9-3.6-31.2c-1.5-3.3-19.1-21.8-19.1-21.8,0,0-23-26.1-23.6-28.2s-11.5-30.6-11.8-32.1,1.9-28.2,3.5-29.4c1.6-1.2,17.5-22.9,19-21.9s24.4-.2,24.4-.2h0Z"/>
<path class="st11" d="M990.7,1639.8l28,25.4,13.2,25.2s7,35.8,7.3,36.7c.3.9,0,25.5,0,25.5,0,0,4.3,23,4.8,24.2s15.8,20.2,15.8,20.2l11.3,19.4,8.8,74.7v40.4s-3.9,25.5-4.3,26.7-12.2,25.1-13.1,26.3-20.9,15.4-20.9,15.4c0,0-29-12.5-28.7-13.6.4-1.1-16.2-32.9-16.6-34.6s-2.4-54.1-2.4-54.1c0,0-6-67.6-6.2-68.8s-11.7-53.7-12.1-54.9-12.4-43.2-13.6-44.9-6.3-50.6-5.4-51.8c1-1.2,11.3-31.8,11.3-31.8l15.3-7.1,7.5,1.6h0Z"/>
<path class="st1" d="M409.1,1854.7c13.7-10.9,32.3-63.9,123.8-62.6,4.7,0,24-9.3,24-9.3l-23,15.5s-27.9,21.6-32.3,44.3c-3.5,17.8-6.6,76.3-4.2,88.6,2.3,12.3,17.7,27.2,22,28.5,6.9,2.8,30.5,3.3,38,.4-10,10.1-21.4,18.2-34.2,24.1-16.3,3-32.6,3.5-49,1.8-29.2-3-44.7-17.9-51.7-40.4-1.2-20.9-2.3-39.4-3.2-55.7l-10.1-35.1h0Z"/>
<path class="st1" d="M993.8,1897.6c1.4,28.1,2.6,102.3,59,96.7-27.3,20.4-62.5-20-72.3-46.3,1.5-12.6-.4-18.5-3.3-32-1.1-5.3-1-1.2-1.1-2.1-.5-7.2-7.4-34.8-11.5-41.9-9.4-8.8-18.4-16.1-26.7-20.6-5.7-4.1-10.5-6.9-11.5-3.6l-3.5,21.7c-3.4,2.8-6.8,3-10.1.7-1.6-7.2,0-22.8,0-34.8-9.6-9.9-19.6-15.2-30.1-16.4-8.2-3.9-15.3-13.9-16.2-19.5-.8-5.7,0-35.1,0-35.1,0,0-4,1.2-5.7-12.1-.7-6.1-.8-10.5-.7-13.5,0-.2-.3-4.6.7-5.2,2.5-1.8,10.6-13.1,12.6-20,2.9-9.7,11.7-18.1,22.1-27,19.3-6.4,40.6-19.8,63-37.2,9.1-6,17.6-10.4,24.5-10.9-40.1,19.7-16.3,106.7-12.8,118.2,9.4,29.1,22.7,82,23.5,141.1h0Z"/>
<path class="st0" d="M1028.9,1749c-6.4-3.5-10.6-.6-13.9,2.7s-2.1,37.6,0,43.3,10,28.8,23.3,28.8,14.3-5.4,14.6-8.8c.3-3.9-3-4.5-7-11.2-3.2-5.5-2.9-7.3-7.7-12.8s-6.8-8.8-7.3-13.3c-.4-3.6,4-25.4-2.1-28.7h0Z"/>
<path class="st0" d="M1010.2,1834.4c7.9-2.7,13,8.8,14.8,20.3,2.5,15.7,2.8,54.4,5.8,64.2,4.2,13.9,13.6,21,20.8,34.6s-3.5,26.9-10.8,28.1-14.1-3.8-21.3-13.8c-7.3-10-13.4-36.8-13.7-43.5-.3-6.7-7.6-57.5-6.4-64.8s1.2-21.8,10.9-25.1h0Z"/>
<path class="st1" d="M967.9,1923s0,9.1-41.7,10.9c-30.5.9-39.1-7.3-53.7-27.6-7.5-10.6-11.9-21.3-12.3-34.2,0-17.3-2.4-37.1,7.2-46.9,9.7-9.9-81.3,33.4-81.3,33.4l66.9,96.7c7.1,5.4,13.4,8.8,19.2,10.5,21.9,3.4,41.1,2.5,58.2-1.8,28.8-21.7,36.7-33.1,37.5-40.9"/>
<path class="st0" d="M1327.4,1745.6c-8.1,7.1-6.4,15.2-3.2,26.4,4.3,15.2,16.7,40.1,18.1,50.2,2,14.4-7.1,31.7-7.9,47.1-.8,15.4,9,27.9,16.3,28,11.5.2,19.9-19.8,22.4-31.9,2.4-12.1-1.5-35.5-4-41.7-2.5-6.2-17.1-55.5-21.2-61.6-4.1-6.1-12.7-23.3-20.4-16.5h0Z"/>
<path class="st0" d="M1258.1,1646.1c5.8-.7,14.8-2.7,17.3,4.5s36,44.8,24.2,71.5c-11.8,26.7-18.5-26.1-22.7-34.8-4.2-8.8-15.1-19.4-20.6-23.3s-6.7-16.9,1.8-17.9h0Z"/>
<path class="st6" d="M1233,1540.6s-30.3.4-32.7,40.7c-2.4,40.3,36.7,71.8,36.7,71.8,0,0,27.9,17,20.6,74.5,31.8,36.3,24.2,58.1,25.7,81.5-.6,11.7,13.4,110.2,85.5,90.4-12.2,18.1-21.1,14-21.1,14-19.1-2.3-35.9-16.7-51.6-36.5-.2,5.4-31.8-52-31.8-63.7,0-1.2-2.8-15.4-2.8-15.4-3.9-4.9-8.6-5.6-13.7-4l-1.6,8.1c-6.4,0-12.4-.9-17.5-3.3l-4.7-7.2c-5.1,2.6-9.1,3-12.4,2.4-3.5-5.7-.4-20.8-2.4-27.5-6.4,1-13.1,1-19.9-.8,0,1.9-8.1-5.6-13.9-16.2-1.5-6.7-16.8-16.3-16.7-35.7,0-19.4,3.4-47-1.8-54.3s-12.5-9.3-12.5-9.3l1.6-20.3c11.7-5.2,18.1-18.8,21.8-36.3,15.1-21.7,31.3-38.9,48.5-51.7,5.8-1.4,11.3-1.6,16.7-1.2"/>
</g>
<g id="Base_Lines">
<path class="st8" d="M1398.5,1173.5c-1.7-4.3-14-14.8-23.8-27.9-2.1-2.9,2.1-8.1,0-10.9-13.3-17.8,2.1-32.7,16.3-43.6,3.2-.2,1.5-25-1.8-27.5-3.2-2.4-55.7-9.3-58.3-13.2-2.6-3.9-1.1-35.7,2.2-49.8-1.2-10.3-2.8-34.3-5.2-36.3s-61.4,1.6-63,0-2.4-22.6-5.7-25c-3.2-2.4-38.6-5.7-44.4-8.9s-27.2-23.4-29.1-25c-1.9-1.6-3.2-27.1-6.5-29.9-3.2-2.8-38.4-.5-39.6-3-1.2-2.4,2.3-62.4.4-74.6-5.2-5.7-77.5-14.5-75.5-22.6,2-8.1,23.4-25.8,22.1-29.8s-34.2-33.2-34.2-33.2c22.9-9.3,38.6-.4,52.4,17.9,2.7-7.6,1.9-17.7-6.3-26.8,19.4,3.6,36.8,11.2,50.9,25,0,0-.9-39.7,0-43.8,3.4,2.6,11.7,15.5,17.8,17.1s14.5,2.4,23.4,0,14.5-11.3,14.5-11.3c0,0-19.8,0-22.6-7.3-2.8-7.3-4-21-2.4-22.6s19.1,10.9,21.8,12.1c-2.5-3.5-22.6-24.6-21.8-27.5.8-2.8,34.7-1.5,34.7-1.5-41.6-19.4-24.6-35.3-50.1-52,0,0,23.4-1,39.7-8.6,0,0-30.4-9-38.6-20.6-8.2-11.6-36-30.7-44.7-36.9,4,0,21,3.6,37.7,2.3-18.6-28.2-13-27-77.3-29.8-1.6-3.2-3.2-14.1,5.7-35.5,0,0-24.2,11.3-25,17.8s0,16.1,0,16.1c-29.1-4.9-27.1,9.3-31.2,11.3-4.2,2-36.6-.7-41.5,2.6s-4,23.3-12.9,25.7-49.9-.3-52.4,2.6,7.1,20.9,4.7,23.3c-2.4,2.4-13.3,6.5-13.7,9s8.1,13.6,5.7,15.2c-2.4,1.6-3.6-4-6.5-3.2s-22.7,23.4-24.2,28.3c1.2,7.3,27.8,20.5,30.7,22.6,2.9,2.2,2,10.1,0,11.3s-14.9,1.6-17.8,0c-2.8-1.6-6.5-10.5-6.5-10.5,0,0-32.3-47.7-40.4-50.9-42-4.4-88.4-29.9-91.3-33.9-2.8-4,.8-48.5-3.2-51.7s-9.7-4.4-31.5-16.1c-1.6-77.5-74.3-95.3-74.3-95.3,0,0-22.6-49.8-27.3-51.3-4.7-1.5-58.7,3.6-69.2-1.8-20.6-30.1-99.3-84.7-105.8-100.4s-3.9-27.5-9.6-38.8c-3-13.1-83.3-119.1-87-120.3-4.8-1.6-17.4,0-28.3-5.7-10.9-5.7-38.8-22.6-55.7-25-17.8,7.7-37,38.8-37,38.8,0,0-31.9-24.4-57.9-37.6C152.1,31.7,62.5,5.7,12.9,0c-2.4,10.9,17,27.1,37.1,29.9C23,40,.7,53.8,5.7,61.1c5,7.3,50.3-10.8,59-11.8-5.7,4.5-42.4,18.6-59,30.7-8.1,6.1-6.7,13.9,7,10.5,0,0,56-18.8,64.9-20.2-5.2,5.4-39.6,29.1-39.6,29.1-11.3,11.5-4.8,12.2,8.1,8.9,17.8-4.8,34.4-19.9,51.7-22.6,13.4,4.1,21.8,9.7,27.5,16.2,29.5,24.7,56.7,35.1,90.5,32.3,5.7,1.6,10.5,4,10.5,4,0,0,0,9.1,4,15.6s60.4,47.1,64.9,53.6,5.5,22.6,6.6,28.4c1.1,5.8,42.8,61.9,54,71.1,2,6.5,6.7,21.8,12,28.3s23.3,24.4,45.1,26c8.5,2.4,29.5,14.9,29.9,38,9.7,22.6,152.2,176.9,193,194.6,3.2,46,40.7,88.6,46,100.2,5.3,11.5.8,10.1-4.8,21-5.7,10.9-125.2,76-131.6,80-6.5,3.9-65.8,36.3-80.6,60.4-15.1,1.3-62.3,21.5-68.8,23.6-6.5,2.1-56.8,21.2-60.6,22.6s-66.9,25.8-66.9,25.8c-2.8,1-.4,22.7-.1,26.7s-15.5,5.5-16.7,10.8,26.1,63.7,31,68.9c4.8,5.2,19,18.6,21,23.8s1.5,8.8,3.5,15.2,23,45.6,93.7,122.6c.4,4-24.6,25.8-8.9,38.1s71.9,42,71.9,42c0,0-11.8,50.4-23.8,74.5-2.9,5.8-4.4,12.3-4.5,18.8-.3,26.3-1.4,48-1.6,55.2-.2,8.1-11.9,37.2-13.7,42.8-1.8,5.6-29.1,60.4-32.3,67-3.2,6.7-11.8,47.1-12.9,51.7-1.1,4.6-4,56.4,0,59.6s26.2-.7,29.1,1.8c-12.5,100.6,3,188.4,5.4,203.4,2.4,14.9,8.2,29.6,10,39.7,1.7,10.1,2.5,42.4,3.2,55.7.8,13.3,20.2,39.2,51.7,40.4s36.5,1.9,49-1.8,29.4-20.1,34.2-24.1,12.1-13.7,22.6-17c137.3-46.4,202.3-84.8,206-84,3.6.8,60.8,88.4,67.2,96,5.5,5.8,14.1,7.9,19.2,10.5,5.2,2.6,47.2,3.5,58.2-1.8s32.1-28.6,34.7-31.2c2.6-2.6,2.4-14.1,4.8-16.2,2.4-2,7.7-1.6,9.7,0,2,1.6-.3,25.6.8,31.5,0,13.4,67.6,112.4,99.3-4,3.6-31.1-3.7-98.5-5.2-106.7-1.1-6-1.7-8.7-2.8-15.2,25-38.4,73.9-69.9,80.8-73.1s16.7-1.6,21.1.4,11.2,14.1,15.6,16.2,17.5-1.2,19.9.8-.8,25.4,2.4,27.5,9.7-1.8,12.4-2.4,5.2,8.9,5.2,8.9c0,0,15.1,1.4,17,1.6s-1.6-6.1,1.6-8.1c3.2-2,10.5-.8,13.7,4-.4,12.9,16.6,61.4,40.4,85.6,8.9,8.5,52.1,63,74.3,0,25-56.1-39.6-159.9-39.6-159.9,0,0-32.3-47.7-35.5-83.2.8-11.2-25.6-88.2-44.2-94.2-18.6-6.1-26.2-6.8-40.7-4.3-12.1,5.2-46,46-48.5,51.7-2.4,5.7-6.9,32.3-21.8,36.3-1.6,8.1,0,17.5-2.4,22.8s-40.4,32.4-53.7,36.1-52.8,7.7-56,5.2-18.7-52.8-50.8-55.7c-17-.8-75.8,51.8-87.5,48.2-2.8-29.1-28.3-53.7-29.1-79.2,3.6-8.5,5.9-4,5.5-8.9-1.2-38.8-37-81.6-37-87.2s11.2-15.6,9.2-23.3c-2-7.7-25.4-26.9-26.2-31s15.1-77.4-20.1-128.3c1.2-4,6.9-6.1,6.5-9.7s-15.3-25-17-39.6c-1.6-14.5,13.7-68.5,14.5-72.7.8-4.2,1.6-18.6,1.6-18.6,0,0,11.3-2,12.9,0,1.6,2,3.9,10.8,10.4,12.8s40.7,0,49.5-4.8c8.9-4.8,63.8-66.8,75.1-74,11.3-7.3,59.2-17.1,100.8-75.2,28.3,4,76.3-41.6,82.4-42.8,40.4,26.6,88.4,19.8,76.7,38,1.2,14.1-21,30.3-21,35.5s34.7,19.4,34.7,19.4c0,0,26.2,6.7,35.9,17.6,1.2,6.5,14.5,9.4,11.3,15.5-4.3,8.2-10,20.9-10,24.6,0,6.5.3,14.2,2.6,19,2.2,4.8,11.9,20.4,13.7,23.4s.1,21.5,2.6,23.6,15.8,1.1,18.2-.9c2.4-2,2.8-22.2,5.7-22.6s17.6,23,21,27.5c5.3,2.1,20.8.7,22.9.8,2.1,0-.3,16.6,2.7,22.6,4,3.2,15.3-2.6,16.4-1.6,1.1,1-.4,3.8.8,4.8,1.2,1,14.3.7,15.9-1.8,1.6-2.4,1.8-21.7,1.8-24.9s9.4,3.2,11.8,0c2.4-3.2,2-45.6,0-50.9h0ZM738.9,1771.4c-2,2.4-55.6-2.7-66.9-3.5-46.4-10.5-107.4,14.5-109,12.5-.8-5.6-.6-21.8,1.8-26.9s23.2-44.8,25.6-54.7c2.4-9.8,3.8-27.9,3.8-27.9,0,0,9.3,1.2,19,.4,14.1.4,15.7-6.4,16.6-17s1.2-33.9,2.8-56.9c22.6,19.3,38,74.7,40.4,75.9,2.4,1.2,21.1-10.1,24-8.5,11.3,56.1,40.1,85.6,42.1,90.5s2,13.6,0,16h0Z"/>
<path class="st7" d="M403.8,1646.8c3.6-19.2,20-57.9,25.4-62.6,2.8,41.2,11.5,45.4,19.8,46.4,6.7.8,62.1-1,68.8-2s3.9-9.3,61.2-6.1c16,5.1,49.8,39.4,45,45s-28.8,4.5-30,3.5,2.2-28.7,3.2-38"/>
<path class="st7" d="M672.8,1673.4c91.9-59.8,152.2-98.5,201.1-75.1"/>
<path class="st7" d="M895.7,1686.3c-3.2,2.1-20.4,20.2-21.8,25.6-1.4,6.7-2.4,12.1-12.9,21.4-27.7,19.4-75.9,36.6-122.1,38"/>
<path class="st7" d="M976.2,1914.8c-1.4-17.9-7-36.4-15-46.3-7.9-9.6-19-13.9-23.2-17.1s-10.6-7.3-11.5-3.6c-.9,3.6-1.7,18.7-3.5,21.7s-8.3,2.8-10.1.7,2.1-29.7,0-34.8c-2.1-5.2-21.8-18.2-32.7-14.8-33.9,11.9-65.9,24.6-94.3,38.7"/>
<path class="st7" d="M1071.8,1822c-2.6-12.7-7.6-20-28.3-47.2-2.1-2.9-6.3-23.7-3.5-30.6,1.5-10.6-6.1-50.3-6.1-50.3"/>
<path class="st7" d="M789.7,1288.4c-16.4-14.4-55.6-15.9-92.9-14.5-3.7.1-7.4-.3-10.9-1.3-24.5-7-49.8-15.6-82.2-17.8-55.3-2.2-96.9-6.8-112.7-12.5-29.1-10.6-59.2-25.8-90.5-47"/>
<path class="st7" d="M798,1328.6c-8.2,9.7-105.8,8.5-121.5,2.8-51.7-19.4-154.3-32.3-174-39.6-19.8-7.3-38.8-16.6-38.8-16.6"/>
<path class="st7" d="M920.7,645.3s44.5,3.6,46.7,5.1,47.7,31.5,47.7,34.7.1,4,1.8,6.9c1.6,2.8,32.9,18,35.5,20.3"/>
<path class="st7" d="M236,82.4c-8.9,16.1-13.1,34.3-9.8,55.7"/>
<path class="st7" d="M1374.6,1134.7c-25.4,19.5-37.2,20.9-54.1,19.9-11.4-5-44.2-35-59.4-40.2"/>
<path class="st2" d="M374.8,1645s-.8-12.4,34.3-17"/>
</g>
<path id="hair" class="st1" d="M1030.8,508s-9.8,39,0,54.4,5.9,3.3,3.8,17.1c-2.1,13.8-14.8,36.5-14.8,36.5,0,0,21-18.8,32.6-16s25.2,17,26.4,27.9c1.2,10.9-29.6,29.7-49.8,30.9s8.6,7.9,5.9,17c-2.7,9.1-11.8,8.6-19.8,9.5-1,12,37.3,27.2,37.3,27.2,0,0,25.9-16.9,52.4,17.9,6.8-10-7.6-28.2-6.3-26.8s45.6,11.8,50.9,25,0-43.8,0-43.8l17.8,17.1c21.8,3.7,32.8-1.4,38-11.3-8.1.7-15.8-1.2-22.6-7.3-2.6-6.6-3.4-14.2-2.4-22.6l21.8,12.1-21.8-27.5c10.3-1.8,21.8-2.4,34.7-1.5-42.9-24.8-22.9-34.5-50.1-52,16.7-1.2,30-4.1,39.7-8.6-50.4-19.9-27.1-21.7-83.3-57.5l37.7,2.3c-17.3-29.8-22.9-28.9-77.3-29.8-2.4-11.3,0-23.2,5.7-35.5-10.5,4.4-19.2,10-25,17.8v16.1c-14.9-3.9-25.2,0-31.2,11.3h0Z"/>
<g id="Details">
<path class="st0" d="M319,86.4c12.9,34.7,1.6,74.3,6.5,105.8,4.8,31.5,48.5,110.6,48.5,110.6"/>
<line class="st0" x1="378.8" y1="208.4" x2="437" y2="358.6"/>
<path class="st0" d="M443.4,228.6c-5.7,14.5-8.9,38,0,60.6,8.9,22.6,12.9,41.2,40.4,42.8"/>
<path class="st0" d="M596.1,382c0,25,0,34.7,4,46.8s17.8,54.1,19.4,71.9c1.6,17.8,16.2,92.9,16.2,92.9"/>
<path class="st0" d="M683.9,700.2c3.4,12.9,10.7,37.1,11.5,50s89.7,5.7,89.7,5.7"/>
<path class="st0" d="M695.4,750.3c-7.3,17-31.5,29.1-42.8,39.6s-36.3,38.8-46.8,42.8c-10.5,4-8.9-1.6-17.8,0-8.9,1.6-1.6,13.7-12.9,21-11.3,7.3-41.2,26.7-52.5,27.5"/>
<path class="st0" d="M434.5,920.7c-21,6.5-150.2,64.6-150.2,64.6-5.7-4-12.9-22.6-16.2-31.5"/>
<path class="st0" d="M903,645.3c3.2,7.3,21,25.8,21.8,33.5.8,7.7-2.4,10.9,0,14.1s19.4,13.7,23.4,19.4,24.2,51.7,29.1,55.7c4.8,4,50.1,1.6,59.8,0"/>
<path class="st0" d="M1052.4,770.3s-10.5-15.9-11.3-20,8.9,3.2,11.3,0c2.4-3.2-46.8-66.2-127.6-71.5"/>
<path class="st0" d="M1172.7,904.6c-5.7,8.1-50.1,62.2-55.7,80.8"/>
<path class="st0" d="M1205.8,967.5c-18.6,8.9-64.6,26.9-101.8,32.5"/>
<path class="st0" d="M1022.5,782.6c15.3,3.2,26.8,16.2,30,21s11,75.2-21.1,208.4c-9.7,40-53.2,98-53.2,98"/>
<path class="st0" d="M1055.7,782.6c8,4.8,21,7.3,23.4,21.8s12.9,131.6,11.3,148.6c-1.6,17-2.4,63.8-10.5,63.8"/>
<path class="st0" d="M924.8,693s4,48.5,0,50.1c-4,1.6-88.8,36.7-155.9,27.2"/>
<path class="st0" d="M949.8,724.5s-1.6,29-4,33.4-4.8-2-12.1,0-58.2,69.8-195.4,78.7c-11.2.7.8-8.9-11.3-10.5-12.1-1.6-11.3,11.3-12.1,18.6-.8,7.3-32.9,25-37.8,30.7s2.3,42.8-6.6,38.8c-8.9-4-14.5-17.8-16.2-9.7s-6.5,68.7-31.5,80.8-25.2,6.5-27.5,19.4c-2.3,12.9-47.6,26.6-61.3,29.9"/>
<path class="st0" d="M676.3,771.9s-5.1,23.6-26.9,38.2-17,46-43.6,75.9c-26.7,29.9-17.8,46.8-50.1,67-32.3,20.2-32.3,14.7-46,30.8"/>
<path class="st0" d="M496.7,904.6c-4.8,17.8-13.7,28.3-12.9,45.2s4.8,46.8,12.9,62.2"/>
<path class="st0" d="M446.6,1057.2c-12.1,22.6-12.1,54.1-12.1,67.8s36.3,78.9,70.3,70.1"/>
<path class="st0" d="M434.5,1125s.8,53-27.9,74.2"/>
<path class="st0" d="M789.7,1130.7c-26.5,0-91.1,9.6-116.9,24.2"/>
<path class="st0" d="M695.4,1173.5c-46,10.5-99.3,12.9-99.3,12.9"/>
<path class="st0" d="M463.6,1142.8c23.4,32.3,48.5,62.2,70.3,68.7"/>
<path class="st0" d="M630.8,1591.4s-7.7-22.2-6.2-31c1.4-8.9,32.1-15.3,36.1-21"/>
<path class="st0" d="M562.5,1431.1c23,28.3,64.2,68.7,80,68.7s43.2-3.2,48.8-8.1.8-8.1,4-8.9c3.2-.8,36.3-12.1,55.7-13.7"/>
<path class="st0" d="M642.5,1499.8s18.2,8.9,18.2,24.2"/>
<path class="st0" d="M756,1431.1c-29.1,9.7-53.3,22.6-60.6,31.5"/>
<path class="st0" d="M540.3,1388.3c38.8,0,64.6-1.6,96.1,48.5"/>
<path class="st0" d="M808.5,1484.4c2.4,25.8,2.4,37.2,12.1,48.5"/>
<path class="st0" d="M533.9,1299c-16.2,28.8-23.4,20.7-24.2,74-.8,53.3,29.9,4,12.1,111.4-7.6,27.5-12.1,27.5-23,39.6-.4,25.8,10.9,12.9,10.9,23.4s1.2,57.7-4.8,80.6"/>
<path class="st0" d="M457.5,1299s-6.8,49.8-3.5,74c3.2,24.2,4.8,38.8,15.8,53.3,10.9,14.5-16.6,39.6-24.6,44.4s-13.7,10.5-17,25.8c-3.2,15.3-25,28.3-27.5,42.8s-4,88.6-4,88.6"/>
<path class="st0" d="M808.5,1094.3c23.4-.8,38.1,23.3,39.3,32.2"/>
<path class="st0" d="M1011.2,1004.7c-19.4,24.2-36.3,39.6-41.2,55.7-4.8,16.2-16.4,48.5-22.4,64.6"/>
<path class="st0" d="M1255.9,1069.3c21.8.8,63.9-17.1,70.5-25.2,6.6-8.1-28.8,42.1-68.8,39.7,9.3,21.9,26.8,23.4,66.2,21.8"/>
<path class="st0" d="M700.4,964.3c40.2-6.5,104.8-19.2,136.3-18"/>
<path class="st0" d="M428.9,1656.5c-.8,25,.4,67.4,2.4,80"/>
<path class="st0" d="M440.2,1679.1c-.4,20.6-1.2,42.3,0,49.8"/>
<path class="st0" d="M594.9,1854.7c27.1-4,75.9-28.3,90.5-37.6"/>
<path class="st0" d="M506,1939.5c9.3-1.2,43.2-10.9,53.7-16.6"/>
<path class="st0" d="M657.8,406.2c.8,13.3,10.5,45.2,32.7,55.3"/>
<path class="st0" d="M697.8,483.8c6.1,20.6,15.3,68.3,13.3,135.3"/>
<path class="st0" d="M516.1,446.7c20,.3,43,16.4,51.2,26.4"/>
<path class="st0" d="M106,43.6c-15.8,0-32.5-.1-41.4,2.2"/>
<path class="st0" d="M101.8,63.6c-12.1,1.8-16.4.2-24.2,6.7"/>
<path class="st0" d="M126,58.2c18.2,1.8,23,5.5,23,5.5"/>
<path class="st0" d="M57.6,29.1c32.9-.6,34.5-1.3,55.7,1.8"/>
<path class="st0" d="M1337.5,1203c2.4,4.8,10.6,17.8,11.6,22.2"/>
<path class="st0" d="M1360.5,1206.6c5.4,6.7,5.1,2.2,7.7,39.6"/>
<path class="st0" d="M1380.5,1194.2c4.5.6,5,5.2,6.1,30.2"/>
<path class="st0" d="M992.6,536.7c11.3,4.4,18.6,15.3,17.8,21.8"/>
<path class="st0" d="M982.5,553.2c4.4-6.5,19-11.2,19-11.2"/>
<path class="st0" d="M1016.9,544c1.2-18.6-10.1-25.8-28.3-31.5"/>
<path class="st0" d="M1040.3,611.8c11.3-3.2,31.1-.5,28.3,16"/>
<path class="st0" d="M999.9,636.5c8.5,15.3,14.3,22,29.1,22.3"/>
<path class="st0" d="M1043.5,619.2c-3.2,7.5-1.2,9.9-10.5,10.3s-12.9-2-13.7,0,.8,10.1,3.6,11.7c2.8,1.6,26.2,2,29.4,0s4.9-8.6,3.3-10.3-.9-6.2-3.3-5.8"/>
<path class="st0" d="M1140.6,1665.8c-.6,10.9-4.8,36.9,10.9,44.8"/>
<path class="st0" d="M965,815.7c-17.6,26.2-81.1,111.7-136.8,145.6"/>
<path class="st0" d="M954.6,724.5c1.9,30.8,4.3,70.8,3.1,82.9"/>
<path class="st0" d="M720.2,1004.7c32.7-4,100.4-18,116.5-24"/>
<path class="st0" d="M862,967.5c35.1-28.1,71.2-89,94.2-123.6"/>
<path class="st0" d="M491.8,1195.2c.7,13.9.3,38.9-.7,47"/>
<path class="st0" d="M531.2,1043.1c-15.8,4.8-17.8,7.9-21.6,18.8-3.8,10.9-6.2,38.8-25.9,56.3"/>
<path class="st0" d="M472.2,1087.3c-.9,21.8-.3,40.2,0,43.4"/>
<path class="st0" d="M483.7,1016.8c-17.3,12.9-22.8,22.6-40.3,32.3"/>
<path class="st0" d="M289,996.4c0,15.1,1.3,38.8,2.8,46.6"/>
<path class="st0" d="M420.6,951c-4.4,23-9.3,48.7-9.9,61"/>
<path class="st0" d="M1305.5,1195.6c-10.6-1.8-35.3-16.3-37.1-19.3"/>
</g>
<g id="Invers_Details">
<path class="st4" d="M445,1848.3c6.5-3.6,50.9-38,74.4-40.7"/>
<path class="st4" d="M454.7,1857.2c14.5-1.6,17.8-4,20.6-5.7,2.8-1.6,28-21.1,28-21.1"/>
<path class="st4" d="M467.2,1865.2c2.8-4,10.8-15.5,16-19.3"/>
<path class="st4" d="M877.4,1750.2c7-13.3,11.2-18.5,17-21.4s19.4-1.3,21.2,2c1.8,3.3,16.3,24.8,16.7,27.1"/>
<path class="st4" d="M961.9,1750.9c-6.7,6.7-31.5,53.9-33,58.4-1.5,4.5-14.2-25.6,12.1-61.9"/>
<path class="st4" d="M856.2,1837.2c-5.2,6.1-7.3,10.7-7.6,28.1-.3,17.4-2.4,24.3,7.6,33.7"/>
<path class="st4" d="M1215.5,1651.2c-4,61,10.1,92.8,8.1,96.2-10.2,0-27.1-21.9-17.8-91"/>
<path class="st4" d="M1167.9,1651.2c6.1,1.6,23.7,11.7,29.5,27.9"/>
<path class="st5" d="M1036.2,556.1c-1.5-29.7,11-35.7,24.3-45.4"/>
<path class="st5" d="M1132.2,616.9c-21.2-7.9-37.2-11.2-48.8-44.2-.7,18.8-2.5,43.9,10.2,55.1-43.3-30.9-42.7-88.4-35.5-96.6"/>
<path class="st5" d="M1177,636.4c-34.5.3-67.7.8-82.2-28.8"/>
<path class="st5" d="M1156.4,674.2c8.5,12.7,13.9,18.8,24.8,21.2"/>
</g>
<g id="Text">
<g id="V.2">
<g id="Fill">
<path class="st13" d="M888.9,812l-3.2,6.3-17.8,19.6-21.5,27-7.6,7.6,11.2,4.8,29,13.8,10.6,6.8,2.5,2.5,7.8,2,7.6-9.2v-4.8c-.1,0-13.2-7.5-13.2-7.5,0,0-16.7-6.1-17.3-6.7s-14.4-6.6-14.4-6.6l-1.7-2.8,10.5-14.4,12.3-15.5,11.5-12.7,6.3-7.3-12.4-3h0Z"/>
<path class="st13" d="M938.1,832.3l5.3,2.2,8.3,6.3-2.3,6.3-8.8,25-6.6,24.5-4.9,22.8s9.9-3.9,10.2-4.6,33.1-20.6,33.1-20.6l23.3-13,5.5,5.7,3.1,4.1-77.4,41-12.3-9.3,8.6-42.2,14.8-48.2h0Z"/>
<path class="st13" d="M1039.2,922.8s-3.1-10.7-3.1-11.3-7.3-15.7-7.7-16.3c-.4-.6-10.2-2.2-10.7-2.4s-10.7,5.7-11.6,6-9.6,11.7-9.9,13.1-1.3,13.5-1.2,14.5,4.6,16,4.7,16.6-1.7,9.4-2.1,10-6.2,2.7-6.2,2.7l-10-6.9-10.6-13.3-8.8,3.2,2.4,8.6,7.9,15.3,9.9,5.3,15.7,3.2,9.2-3.7,4.1-8.2s-1.5-15.7-1.6-16.2-1.8-17-1.8-17l1.1-11.9,5.9-8.2,8.1,1.6,6.2,9.3,1.4,10,1.6,5.5,7.2-9.8h0Z"/>
<path class="st13" d="M832.6,886.8l-6.1,1.9.8,8.7,12.3-1.2,12,3.9s4.3,2.1,5.3,3.6-1.4,9.7-1.4,9.7l-13.7,5.4-13.7,1.3-21.6,3.1-13.3,5.5-5.9,5.8.3,3.3,11.3,5.5,21.8,13.3,12.1,7.4,4.1-.4,4.5-9-6.5-6-13.8-8.3-9.3-5.8s8.2-1.2,9.2-1.7,17.9-4.8,17.9-4.8l18.2-6.4s8-9.9,8.1-10.5.4-10-.3-11.2-9.2-9.1-9.2-9.1l-15.8-3.5-7.2-.6h0Z"/>
<path class="st13" d="M904.1,925.7l-5.1-3.4-10.6-2.2-12.5,6.9-10.6,11.5s-10.2,16.5-10.7,16.8c-.5.2-6.2,16.8-6.2,16.8l7.2,10.1,13.4,3.9s13.9-3.6,15.2-4.6c1.2-1,14.6-12.2,14.6-12.2l9.9-15.6,2.2-17.8-6.7-10.3h0ZM899.2,951.1l-6.9,9.6-10.8,8.1s-10.3,4.3-11.1,4.1c-.8-.1-7.4-2.7-7.3-3.6s1.9-10.5,1.8-11.4,7-12.8,7-12.8l10.3-8.3,8.7-4.4,8.6,5.5-.5,13.2h0Z"/>
<polygon class="st13" points="926.3 953.5 922.1 964.5 936.7 959.7 920.6 978 896.9 1008.2 907.2 1015.3 916.9 1006.3 953.6 961.9 953.3 958.8 939.5 949.8 926.3 953.5"/>
<path class="st13" d="M992.6,980.2l-9.1-7.2-7.7-1.9h-6.3c0,0-11,7.8-11,7.8l-6.4,12.6,3.3,11-14.5,1.4s-12.2,4.8-13.4,5.1-7,8.6-6.7,8.8c.3.2,1.6,11,1.6,11l9.4,7.8,9.9,3.7,11.4-1.5,8-9.8s3-11.3,3.5-12.2-1.1-8.6-1.1-8.6l3.9-3,12.3-1.2,10.4-5.4,4.2-10.2-1.8-8.2h0ZM952.2,1022.3l-3.4,7-5.3,1.6-6.2-3.1-4.6-7.3s3.6-4,5.7-5,8.9-4,8.9-4l3.9,1,.9,9.8h0ZM978.1,989l-6.4,4s-5.4,0-5.4-.8c0-.7-.7-7.6-.7-7.6l3.4-6.1,4.8-.5,5.1,4.5-.7,6.4h0Z"/>
</g>
<g id="Lines">
<path class="st3" d="M886.3,817.7c-17.2,16.9-30.4,37.7-47.7,54.5-.3.3-.2.7.2.8,19,6.1,37,15.2,53.2,26.7"/>
<path class="st3" d="M899,817.8c-14.3,14.9-27.3,31.2-38.7,48.4-.2.3,0,.7.3.9l27,11.2c7.3,3,14.8,6.2,20.9,11.3"/>
<path class="st3" d="M907.4,893.4c-2.5,3.1-5,6.1-7.6,9.2"/>
<path class="st3" d="M888.7,811.9c4.2.8,8.4,1.9,12.5,3.1"/>
<path class="st3" d="M938.1,832.3c-9.1,29.4-18.3,58.9-23.4,89.2-.2,1.1.3,2.1,1.3,2.7,3.3,1.9,6.5,4.2,9.3,6.9.4.4.9.8,1.5.8.3,0,.7-.2,1-.3,26.4-14,50.3-26.7,76.7-40.7"/>
<path class="st3" d="M941.1,833.7c3.2,2.4,6.4,4.8,9.6,7.2.7.5,1.3,1,1.6,1.8"/>
<path class="st3" d="M949,846.2c-8.4,23.7-15,48-19.9,72.7,1.2.7,2.7,0,3.8-.7,21.1-12.5,42.2-24.9,63.2-37.4"/>
<path class="st3" d="M997.5,882.9c1.8,1.9,3.7,3.7,5.5,5.6"/>
<path class="st3" d="M1037.5,918.3c-1.1-6.8-3.6-13.3-7.3-19-1.5-2.3-3.3-4.6-5.8-5.8-3.2-1.5-7-.9-10.3.3-12.8,4.7-21.2,19.2-19,32.6.8,4.9,2.8,9.5,3.9,14.4.7,3,1,6.3,0,9.3-1,3-3.6,5.6-6.7,5.8-3.6.2-6.6-2.6-9-5.3-4.4-4.8-8.7-9.8-12.8-15"/>
<path class="st3" d="M1029.7,928.7c1.2-6.7-1-13.9-5.6-18.9-2.3-2.5-5.8-4.6-9.1-3.5-2.6.8-4.3,3.4-5.3,6-1.8,4.6-2,9.7-2,14.6,0,6.3.6,12.6,1.6,18.9.7,4.2,1.5,8.4,1.2,12.6s-2,8.6-5.5,11c-4.6,3.2-10.9,2.3-16.3.8-4.4-1.2-9-2.4-12.5-5.3-6.4-5.4-10.3-12.2-13.1-20.6-.8-2.4-1.3-2.5-2-5.5"/>
<path class="st3" d="M1039,921.7c-2.8,4.2-5.6,5.3-8.3,9.4"/>
<path class="st3" d="M831.9,886.8c8.2-.5,16.6,1.2,24,4.9,2.9,1.5,5.8,3.3,7.7,6,4,5.6,2.8,13.7-1.3,19.1-4.1,5.5-10.6,8.7-17.1,10.8-5.9,1.9-12.1,3-18.2,4.1-5.6,1-11.2,2-16.8,3,8.2,7,20.5,8.2,27.4,16.5"/>
<path class="st3" d="M826.9,888.6c.3,2.9.5,5.9.8,8.8,9-2.4,18.9-.8,26.7,4.2,1.4.9,2.8,2,3.5,3.5.6,1.4.5,3,0,4.4-1.6,4.6-6.7,6.9-11.3,8.1-16.3,4.3-34.2,1.8-49.8,8.5-1.9.8-3.7,1.7-5.3,3.1-2.5,2.1-4.2,5.1-4.7,8.3,2.9,1.1,5.6,2.7,8.3,4.2,12.7,7.3,25.3,14.5,37.6,22.3"/>
<path class="st3" d="M841.1,954.8c-1.1,3.5-2.7,6.8-4.7,9.9"/>
<path class="st3" d="M883.5,922.5c-14.8,8.3-24.8,23.1-31.8,38.5-1.2,2.7-2.4,5.5-2.6,8.5-.4,7.8,6.4,14.6,14,16.1s15.5-1.2,22.2-5.2c9.3-5.6,17-13.9,21.8-23.7,3.1-6.2,5.1-13.3,3.8-20.2-1.3-6.8-5.5-10.1-10.9-13.7-5.8-3.9-10.2-4-16.6-.4h0Z"/>
<path class="st3" d="M891.1,932.4c-13.4,4.9-24,16.7-27.6,30.5-.5,1.8-.8,3.8,0,5.6.7,1.8,2.4,3,4.3,3.6,6.6,2.3,13.6-1.7,19-6.1,4.3-3.5,8.3-7.5,10.8-12.4s3.6-10.8,1.6-16"/>
<path class="st3" d="M926.3,953.5c3.9-1.4,7.9-2.6,12-3.5.3,0,.7-.2,1,0,.4,0,.8.4,1.1.8,3.7,3.6,8,6.3,12.8,8.2"/>
<path class="st3" d="M952.7,962c-13.4,18.1-27.7,35.6-42.9,52.2"/>
<path class="st3" d="M924.9,956.9c-.9,2.5-1.8,5-2.8,7.5,5.3-1.7,10.6-3.4,15.9-5.1-13.8,13.9-26.5,28.7-38.2,44.3"/>
<path class="st3" d="M898,1007.5c3.2,2.6,6.3,5.2,9.5,7.8"/>
<path class="st3" d="M968.2,979.5c2.2-1.9,5.7-1.2,8.1.4,2,1.4,3.7,3.6,3.4,6-.5,4.1-9,9.2-12.8,6.9-3.7-2.2-1.5-10.9,1.2-13.3h0Z"/>
<path class="st3" d="M937.8,1016.8c-1.9.8-4,1.9-4.3,4,0,.7,0,1.4.3,2.1,1.5,4.3,5.6,7.6,10.2,8.1,1.3.1,2.7,0,3.8-.6,1-.6,1.7-1.6,2.3-2.6,1.8-3.4,4-11.7.9-15s-10,2.6-13.2,4h0Z"/>
<path class="st3" d="M981.5,974.4c-3.1-3.4-8.4-4.3-12.8-2.9-4.4,1.3-8,4.6-10.9,8.2-2.5,3.3-4.6,7-5.2,11.1s.2,8.5,2.8,11.7"/>
<path class="st3" d="M963.3,1006.7c2.5,9.2.6,19.6-5.1,27.3-1.5,2-3.2,3.8-5.4,5-5.4,2.9-12.1,1-17.7-1.3-6.5-2.7-13.5-6.9-14.7-13.8-.7-3.8.7-7.8,3-10.8s5.7-5.2,9.2-6.8c5.8-2.7,12.3-3.8,18.7-3.1"/>
<path class="st3" d="M967.5,1006c2.9.6,5.9,0,8.7-.8,5.5-1.6,10.9-4.3,14.4-8.8,3.5-4.5,4.8-11.1,2.1-16.1-2.3-4.2-6.8-6.6-11.3-8.2"/>
<path class="st9" d="M963,938.4c1.8-.5,3.5-1,5.2-1.5.6-.2,1-.8.8-1.4s-.8-1-1.4-.8c-1.8.5-3.5,1-5.2,1.5-.6.2-1,.8-.8,1.4s.8,1,1.4.8h0Z"/>
</g>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 48 KiB

+204
View File
@@ -0,0 +1,204 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 3840 2160">
<defs>
<style>
.cls-1 {
fill: #fcb74a;
}
.cls-2 {
fill: #fff;
}
.cls-3 {
fill: #b1e0e8;
}
.cls-4, .cls-5, .cls-6 {
fill: none;
}
.cls-7 {
fill: #8cd3da;
}
.cls-8 {
fill: #37969d;
}
.cls-9 {
fill: #707173;
}
.cls-5 {
stroke: #005b8a;
}
.cls-5, .cls-6, .cls-10 {
stroke-linecap: round;
stroke-miterlimit: 10;
stroke-width: .46px;
}
.cls-6 {
stroke: #fff;
}
.cls-11 {
fill: #915423;
}
.cls-12 {
fill: #62b7bb;
}
.cls-13 {
fill: #f26d21;
}
.cls-14 {
fill: #fdc458;
}
.cls-15 {
fill: #56aeb5;
}
.cls-16 {
fill: #008c4e;
}
.cls-17 {
fill: #faac4f;
}
.cls-18 {
clip-path: url(#clippath);
}
.cls-10 {
fill: #f05d2b;
stroke: #f05d2b;
}
</style>
<clipPath id="clippath">
<rect class="cls-4" width="3840" height="2160"/>
</clipPath>
</defs>
<g class="cls-18">
<g>
<g>
<path id="_Path_" data-name="&amp;lt;Path&amp;gt;" class="cls-3" d="M3577.55,652.97c-42.27,0-81.47,13.08-113.83,35.38,0-.47.04-.94.04-1.41,0-124.97-101.31-226.28-226.28-226.28-48.57,0-93.53,15.35-130.39,41.4-35.21-58.1-99.04-96.93-171.94-96.93-28.5,0-55.6,5.97-80.16,16.68-18.63-116.88-119.85-206.22-241.98-206.22-127.48,0-232.2,97.35-243.94,221.76-21.64-6.25-44.47-9.67-68.12-9.67-135.35,0-245.08,109.72-245.08,245.08,0,5.74.27,11.41.66,17.06-32.75-23.17-72.71-36.83-115.88-36.84-110.96,0-200.91,89.95-200.91,200.91s89.95,200.91,200.91,200.91h1636.9c110.96,0,200.91-89.95,200.91-200.91s-89.95-200.91-200.91-200.91Z"/>
<path id="_Path_-2" data-name="&amp;lt;Path&amp;gt;" class="cls-3" d="M227.6,688.78c42.27,0,81.47,13.08,113.83,35.38,0-.47-.04-.94-.04-1.41,0-124.97,101.31-226.28,226.28-226.28,48.57,0,93.53,15.35,130.39,41.4,35.21-58.1,99.04-96.93,171.94-96.93,28.5,0,55.6,5.97,80.16,16.68,18.63-116.88,119.85-206.22,241.98-206.22,127.48,0,232.2,97.35,243.94,221.76,21.64-6.25,44.47-9.67,68.12-9.67,135.35,0,245.08,109.72,245.08,245.08,0,5.74-.27,11.41-.66,17.06,32.75-23.17,72.71-36.83,115.88-36.84,110.96,0,200.91,89.95,200.91,200.91s-89.95,200.91-200.91,200.91H227.6c-110.96,0-200.91-89.95-200.91-200.91s89.95-200.91,200.91-200.91Z"/>
<path id="_Path_-3" data-name="&amp;lt;Path&amp;gt;" class="cls-7" d="M3641.3,819.59c-37.77,0-72.8,11.69-101.71,31.61,0-.42.03-.84.03-1.26,0-111.67-90.53-202.2-202.2-202.2-43.4,0-83.57,13.72-116.52,37-31.46-51.92-88.5-86.62-153.64-86.62-25.47,0-49.69,5.34-71.63,14.9-16.64-104.44-107.1-184.28-216.23-184.28-113.92,0-207.49,86.99-217.99,198.16-19.33-5.59-39.74-8.64-60.87-8.64-120.95,0-219,98.05-219,219,0,5.13.24,10.2.59,15.24-29.26-20.71-64.97-32.92-103.55-32.92-99.15,0-179.53,80.38-179.53,179.53s80.38,179.53,179.53,179.53h1462.73c99.15,0,179.53-80.38,179.53-179.53s-80.38-179.53-179.53-179.53Z"/>
<path id="_Path_-4" data-name="&amp;lt;Path&amp;gt;" class="cls-7" d="M1967.55,949.49c-37.77,0-72.8,11.69-101.71,31.61,0-.42.03-.84.03-1.26,0-111.67-90.53-202.2-202.2-202.2-43.4,0-83.57,13.72-116.51,37-31.47-51.92-88.5-86.62-153.64-86.62-25.47,0-49.69,5.34-71.63,14.9-16.64-104.44-107.1-184.28-216.23-184.28-113.92,0-207.49,86.99-217.99,198.16-19.33-5.59-39.74-8.64-60.87-8.64-120.95,0-219,98.05-219,219,0,5.13.24,10.2.59,15.24-29.26-20.71-64.97-32.92-103.55-32.92-99.15,0-179.53,80.38-179.53,179.53s80.38,179.53,179.53,179.53h1462.73c99.15,0,179.53-80.38,179.53-179.53s-80.38-179.53-179.53-179.53Z"/>
</g>
<g>
<circle class="cls-1" cx="2073.97" cy="1000.7" r="290.82" transform="translate(-100.15 1759.62) rotate(-45)"/>
<path class="cls-2" d="M3336.28,512.41c6.61-48.04-61.18-87.55-112.13-91.66-24.29-1.96-49.53,1.76-72.54-6.27-49.86-17.38-69.78-81.8-118.44-102.32-36.37-15.34-78.25-1.68-113.52,16.06-35.26,17.75-70.11,40.08-109.51,42.61-34.27,2.19-71.48-10.52-101.47,6.22-22.34,12.48-34.05,38.22-54.64,53.41-20.15,14.86-46.43,18.01-71.42,19.37-25,1.36-50.88,1.61-73.64,12.03-22.76,10.42-41.59,34.49-36.87,59.07l864.17-8.53Z"/>
<path class="cls-2" d="M1297.82,860.79c6.61-48.04-61.18-87.55-112.12-91.66-24.29-1.96-49.53,1.76-72.54-6.27-49.86-17.38-69.78-81.8-118.44-102.32-36.37-15.34-78.25-1.68-113.52,16.06-35.26,17.75-70.11,40.08-109.51,42.6-34.27,2.19-71.48-10.52-101.47,6.23-22.34,12.48-34.05,38.22-54.64,53.41-20.15,14.86-46.43,18.01-71.42,19.37-25,1.36-50.88,1.61-73.64,12.03-22.76,10.42-41.59,34.49-36.87,59.07l864.17-8.53Z"/>
</g>
<g>
<path class="cls-9" d="M1254.7,301.74s6.56,13.47,22.53,22.31c15.97,8.84,36.45,16.93,38.26,32.17,1.81,15.24,10.77,15.55,18.56,11.62,7.79-3.94,19.72-11.59,43.62-2.68,23.9,8.91,41.38,2.21,41.38,2.21,0,0-20.32-2.64-43.53-17.53-23.21-14.88-46.62,1.61-46.62,1.61,0,0,.85-20.39-31.94-31.4-32.79-11.01-42.26-18.31-42.26-18.31Z"/>
<path class="cls-9" d="M2291.9,850.51s11.57,9.53,29.77,10.93c18.2,1.4,40.19.26,48.17,13.37,7.98,13.11,16.26,9.67,21.71,2.85,5.45-6.82,13.12-18.73,38.56-20.56,25.44-1.83,38.55-15.19,38.55-15.19,0,0-19.59,6.04-46.88,2.15-27.29-3.89-41.73,20.83-41.73,20.83,0,0-7.7-18.9-42.1-15.29-34.4,3.61-46.05.91-46.05.91Z"/>
<path class="cls-9" d="M1599.35,707.41s13.47,6.56,31.5,3.67c18.02-2.89,39.14-9.14,49.96,1.74,10.82,10.88,18.07,5.61,21.78-2.3,3.71-7.9,8.38-21.28,32.69-29,24.31-7.72,33.94-23.77,33.94-23.77,0,0-17.63,10.45-45.08,13.04s-35.71,30.01-35.71,30.01c0,0-11.9-16.58-44.51-5.03-32.61,11.55-44.56,11.64-44.56,11.64Z"/>
<path class="cls-9" d="M2358.54,281.24s11.57,9.53,29.77,10.93c18.2,1.4,40.19.26,48.17,13.37,7.98,13.11,16.26,9.67,21.71,2.85,5.45-6.82,13.12-18.73,38.56-20.56,25.44-1.83,38.55-15.19,38.55-15.19,0,0-19.58,6.04-46.88,2.15s-41.73,20.83-41.73,20.83c0,0-7.7-18.9-42.1-15.29-34.4,3.61-46.05.91-46.05.91Z"/>
</g>
<g>
<rect class="cls-8" x="-109.46" y="1084.19" width="3975.44" height="665.26"/>
<path class="cls-15" d="M455.1,1362.2s291.86-135.62,658.3-41.14c349.17,90.02,722.3-109.72,1129.16,27.43,406.86,137.15,1533.43-99.07,1597.44-39.64,64,59.43,0,776.89,0,776.89l-3407.75-110.95,22.86-612.58Z"/>
<path class="cls-12" d="M505.83,1543.39s765.5,12.06,1175.66-76.5c625.65-135.08,1030.85,271.63,2068.67,78.73,348.44-64.76-102.41,560.65-102.41,560.65l-3123.63,40.56-18.29-603.44Z"/>
</g>
<path class="cls-14" d="M-110.85,1799s396.61-227.66,917.01-103.76c520.41,123.91,1024.29-140.43,1503.39-8.26,479.1,132.17,1406.54-65.79,1530.44,74.63,123.91,140.43-60.78,918.59-60.78,918.59l-3980.82-59.8,90.76-821.41Z"/>
<g>
<path class="cls-16" d="M3840,1015.31c-6.73-1.92-313.28-8.9-362.08-18.48-48.8-9.58-100.97-10.54-134.63-6.71-33.66,3.83-85.83,19.16-99.29,19.16s-205.31,2.87-215.41,8.62c-10.1,5.75-122.85,21.07-205.31,36.4-82.46,15.33-109.39,34.48-109.39,34.48h1126.12v-73.48Z"/>
<path class="cls-16" d="M0,1000.7c21.98-38.95,366.16-42.05,379.31-4.99,4.49,12.66,204.08,5.77,215.09,13.06,8.42,5.57,20.41,12.36,30.1,17.65,10.47,5.72,22.3,8.76,34.39,8.86,42.44.34,145.81,1.23,176.17,1.23,37.4,0,163.98,36.75,204.26,40.83,40.28,4.08,90.62,13.61,90.62,13.61H0s-3.53-83.99,0-90.25Z"/>
</g>
<circle class="cls-17" cx="2117.73" cy="1685" r="5.89"/>
<g>
<path class="cls-17" d="M946.69,1949.91s372.6,69.86,710.27-5.82c337.67-75.68,523.91,28.43,523.91,28.43,0,0-465.69,23.96-582.13,76.36-116.44,52.4-652.05-98.97-652.05-98.97Z"/>
<path class="cls-17" d="M3638.17,1894.92s-242.81-60.7-492.37,40.47c-249.56,101.17-540.24-4.93-665.28-103.17,0,0,245.61,116.11,500.15,44.66,254.54-71.45,479.92-84.48,657.5,18.05Z"/>
<g>
<path class="cls-2" d="M2126.41,2107c-8.16-30.1-24.27-88.19-24.27-88.19l-74.47-41.92-58.96-2.46c-3.33,10.58-5.13,21.84-5.13,33.52,0,61.6,49.94,111.54,111.54,111.54,18.5,0,35.93-4.53,51.29-12.5Z"/>
<path class="cls-13" d="M2080.16,2119.34c16.62-.74,32.3-5.1,46.25-12.34-5.35-19.72-14.11-51.46-19.51-71l-121.56-39.17s8.01,92.21,94.82,122.51Z"/>
<path class="cls-2" d="M2132.46,1912.27c-16.76-10.06-36.36-15.85-57.33-15.85-61.6,0-111.54,49.94-111.54,111.54,0,2.49.11,4.95.27,7.4,11.16-7.42,35.14-16.3,73.18,4.27,42.92,23.21,80.88-66.85,95.43-107.36Z"/>
<path class="cls-13" d="M2106.62,1949.22s-3.26-26.05-52.9-32.15c-23.17-2.85-44.74,5.82-61.16,15.88-18,19.81-28.98,46.12-28.98,75,0,2.49.11,4.95.27,7.4,11.16-7.42,35.14-16.3,73.18,4.27,1.96,1.06,3.9,1.8,5.83,2.41l31.08-7.85c3.74-2.96,7.39-6.52,10.91-10.55l21.76-54.4Z"/>
<path class="cls-2" d="M1966.83,1981.22c-2.11,8.57-3.25,17.52-3.25,26.73,0,2.49.11,4.95.27,7.4,11.16-7.42,35.14-16.3,73.18,4.27,4.77,2.58,9.47,3.69,14.1,3.7l41.25-48.46c-57.64-36.42-106.64-8.02-125.55,6.36Z"/>
<path class="cls-2" d="M2186.67,2007.95c0-51.65-35.11-95.08-82.76-107.77,3.05,21.26,1.84,73-66.88,119.44,0,0,20.75,77.76,85.58,89.27,37.86-17.84,64.06-56.32,64.06-100.94Z"/>
<path class="cls-13" d="M2095.61,2099.33c72.06-31.37,83.58-99.97,85.26-126.81-11.82-35.27-40.74-62.69-76.95-72.34,3.05,21.26,1.84,73-66.88,119.44,0,0,14.84,55.56,58.58,79.7Z"/>
<path class="cls-2" d="M2149.74,1925.13c-12.91-11.64-28.52-20.34-45.82-24.95,3.05,21.26,1.84,73-66.88,119.44,0,0,7.64,28.51,28.04,53.57l.45.15c79.38-33.36,83.96-136.44,84.22-148.21Z"/>
<path class="cls-5" d="M2046.98,2028.87c2.66,6.91,7.48,17.89,14.92,29.56"/>
<path class="cls-5" d="M2082.16,1986.91c-6.97,8.56-15.62,17.25-26.3,25.9"/>
<path class="cls-5" d="M2109.63,1919.06c-.61,15.7-5.24,36.5-20.66,58.8"/>
<path class="cls-5" d="M1975.32,2019.36c-1.35-9.84-.55-15.13,1-24.43"/>
<path class="cls-5" d="M2010.11,2084.87c-9.24-7.57-17.08-16.87-23-27.5-3.03-5.44-5.56-11.23-7.5-17.31"/>
<path class="cls-5" d="M2038.93,2101.14c-6.42-2.28-12.54-5.22-18.29-8.77"/>
</g>
<path class="cls-14" d="M2169.26,2099.59s-18.34-39.72-67.53-8.35c-48.94,31.21-95.34,13.44-96.62,33.8-1.27,20.36,147.61,0,164.15-25.45Z"/>
<path class="cls-17" d="M1445.93,1771.92c0,10.58-17.81,19.15-39.78,19.15s-39.78-8.57-39.78-19.15,17.81-19.15,39.78-19.15,39.78,8.57,39.78,19.15Z"/>
<ellipse class="cls-17" cx="1497.49" cy="1792.54" rx="16.21" ry="10.31"/>
<path class="cls-17" d="M1649.24,1732.14c0,6.51-12.53,11.79-27.99,11.79s-27.99-5.28-27.99-11.79,12.53-11.79,27.99-11.79,27.99,5.28,27.99,11.79Z"/>
<path class="cls-17" d="M1758.26,1752.76c0,4.88-5.28,8.84-11.79,8.84s-11.79-3.96-11.79-8.84,5.28-8.84,11.79-8.84,11.79,3.96,11.79,8.84Z"/>
<path class="cls-17" d="M1926.2,1739.5c0,8.95-13.85,16.21-30.94,16.21s-30.94-7.26-30.94-16.21,13.85-16.21,30.94-16.21,30.94,7.26,30.94,16.21Z"/>
<path class="cls-17" d="M1976.29,1705.62c0,4.88-5.94,8.84-13.26,8.84s-13.26-3.96-13.26-8.84,5.94-8.84,13.26-8.84,13.26,3.96,13.26,8.84Z"/>
<path class="cls-17" d="M1846.65,1699.73c0,4.88-3.96,8.84-8.84,8.84s-8.84-3.96-8.84-8.84,3.96-8.84,8.84-8.84,8.84,3.96,8.84,8.84Z"/>
<path class="cls-17" d="M2188.44,1746.87c0,9.76-12.53,17.68-27.99,17.68s-27.99-7.92-27.99-17.68,12.53-17.68,27.99-17.68,27.99,7.92,27.99,17.68Z"/>
<ellipse class="cls-17" cx="2301.88" cy="1738.03" rx="10.31" ry="8.84"/>
<path class="cls-17" d="M2435.94,1782.23c0,8.14-8.57,14.73-19.15,14.73s-19.15-6.6-19.15-14.73,8.57-14.73,19.15-14.73,19.15,6.6,19.15,14.73Z"/>
<path class="cls-17" d="M2577.37,1773.39c0,3.25-3.3,5.89-7.37,5.89s-7.37-2.64-7.37-5.89,3.3-5.89,7.37-5.89,7.37,2.64,7.37,5.89Z"/>
<path class="cls-17" d="M1127.71,1786.65c0,10.58-10.55,19.15-23.57,19.15s-23.57-8.57-23.57-19.15,10.55-19.15,23.57-19.15,23.57,8.57,23.57,19.15Z"/>
<path class="cls-17" d="M2804.25,1805.8c0,9.76-10.55,17.68-23.57,17.68s-23.57-7.92-23.57-17.68,10.55-17.68,23.57-17.68,23.57,7.92,23.57,17.68Z"/>
<path class="cls-17" d="M2085.31,1788.12c0,4.88-5.28,8.84-11.79,8.84s-11.79-3.96-11.79-8.84,5.28-8.84,11.79-8.84,11.79,3.96,11.79,8.84Z"/>
<path class="cls-17" d="M1805.4,1826.43c0,4.88-5.28,8.84-11.79,8.84s-11.79-3.96-11.79-8.84,5.28-8.84,11.79-8.84,11.79,3.96,11.79,8.84Z"/>
<path class="cls-17" d="M1619.77,1817.59c0,4.88-5.94,8.84-13.26,8.84s-13.26-3.96-13.26-8.84,5.94-8.84,13.26-8.84,13.26,3.96,13.26,8.84Z"/>
<path class="cls-17" d="M1264.66,1846.39c0,11.85-35.97,21.46-80.34,21.46s-80.34-9.61-80.34-21.46,35.97-21.46,80.34-21.46,80.34,9.61,80.34,21.46Z"/>
<ellipse class="cls-17" cx="2658.37" cy="2139.87" rx="94.1" ry="27.18"/>
<path class="cls-17" d="M2176.88,2096.65s-25.22-28.9-62.54-13.66c-37.31,15.24-48.87,34.68-104.58,29.43,0,0,27.85,11.04,64.11-5.26,36.26-16.29,73.05-32.58,103-10.51Z"/>
<path class="cls-17" d="M1914.78,2124.26c0,4.29-8.7,7.78-19.44,7.78s-19.44-3.48-19.44-7.78,8.7-7.78,19.44-7.78,19.44,3.48,19.44,7.78Z"/>
<path class="cls-17" d="M1950.33,2158.7c0,3.07-2.73,5.55-6.11,5.55s-6.11-2.49-6.11-5.55,2.74-5.55,6.11-5.55,6.11,2.49,6.11,5.55Z"/>
<ellipse class="cls-17" cx="2008.64" cy="2155.37" rx="11.66" ry="7.78"/>
<path class="cls-17" d="M2168.03,2142.59c0,5.21-4.48,9.44-10,9.44s-10-4.23-10-9.44,4.48-9.44,10-9.44,10,4.23,10,9.44Z"/>
</g>
<g>
<path class="cls-11" d="M1183.93,1852.07h0c-10.09,0-18.26-8.18-18.26-18.26v-747.7c0-10.09,8.18-18.26,18.26-18.26h0c10.09,0,18.26,8.18,18.26,18.26v747.7c0,10.09-8.18,18.26-18.26,18.26Z"/>
<path class="cls-11" d="M2660.5,2147.05h0c-10.09,0-18.26-8.18-18.26-18.26V952.74c0-10.09,8.18-18.26,18.26-18.26h0c10.09,0,18.26,8.18,18.26,18.26v1176.04c0,10.09-8.18,18.26-18.26,18.26Z"/>
<polyline class="cls-6" points="2594.46 1108.24 1241.84 1195.98 1241.84 1231.21 2593.7 1178.28 2591.86 1251.73 1237.44 1270.85 1241.84 1308.28 2593.7 1312.33 2593.83 1387.55 1239.64 1347.91 1245.9 1398.63 2599.21 1455.55"/>
<line class="cls-6" x1="1299.7" y1="1140.15" x2="1299.7" y2="1471.88"/>
<line class="cls-6" x1="1346.78" y1="1140.15" x2="1346.78" y2="1471.88"/>
<line class="cls-6" x1="1393.86" y1="1140.15" x2="1393.86" y2="1471.88"/>
<line class="cls-6" x1="1440.93" y1="1140.15" x2="1440.93" y2="1471.88"/>
<line class="cls-6" x1="1491.15" y1="1115.96" x2="1491.15" y2="1476.84"/>
<line class="cls-6" x1="1538.23" y1="1115.96" x2="1538.23" y2="1476.84"/>
<line class="cls-6" x1="1585.3" y1="1115.96" x2="1585.3" y2="1476.84"/>
<line class="cls-6" x1="1632.38" y1="1115.96" x2="1632.38" y2="1476.84"/>
<line class="cls-6" x1="1682.59" y1="1094.26" x2="1682.59" y2="1488.66"/>
<line class="cls-6" x1="1729.67" y1="1094.26" x2="1729.67" y2="1488.66"/>
<line class="cls-6" x1="1776.75" y1="1094.26" x2="1776.75" y2="1488.66"/>
<line class="cls-6" x1="1823.83" y1="1094.26" x2="1823.83" y2="1488.66"/>
<line class="cls-6" x1="1873.26" y1="1077.31" x2="1873.26" y2="1496.01"/>
<line class="cls-6" x1="1920.33" y1="1077.31" x2="1920.33" y2="1496.01"/>
<line class="cls-6" x1="1967.41" y1="1077.31" x2="1967.41" y2="1496.01"/>
<line class="cls-6" x1="2019.46" y1="1077.31" x2="2019.46" y2="1496.01"/>
<line class="cls-6" x1="2076.05" y1="1066.25" x2="2076.05" y2="1503.72"/>
<line class="cls-6" x1="2128.09" y1="1066.25" x2="2128.09" y2="1503.72"/>
<line class="cls-6" x1="2185.1" y1="1066.25" x2="2185.1" y2="1503.72"/>
<line class="cls-6" x1="2242.12" y1="1066.25" x2="2242.12" y2="1503.72"/>
<line class="cls-6" x1="2306.06" y1="1044.12" x2="2306.06" y2="1516.77"/>
<line class="cls-6" x1="2367.07" y1="1031.65" x2="2367.07" y2="1525.47"/>
<line class="cls-6" x1="2428.5" y1="1038.69" x2="2428.5" y2="1532.51"/>
<line class="cls-6" x1="2501.94" y1="1031.65" x2="2501.94" y2="1525.47"/>
<path class="cls-2" d="M2586.11,1556.55c-.53,0-1.05-.01-1.58-.04l-1334.4-70.65c-17.63-.93-31.44-16.77-31.44-36.05v-297.89c0-18.64,13.32-34.44,30.32-35.97l1334.4-120.11c9.19-.84,18.32,2.61,25.09,9.42,6.77,6.81,10.66,16.49,10.66,26.55v488.65c0,9.83-3.74,19.35-10.25,26.13-6.13,6.38-14.37,9.96-22.81,9.96ZM1256.17,1445.19l1325.53,70.18v-478.32l-1325.53,119.32v288.82Z"/>
<polyline class="cls-6" points="2594.75 1024.96 2642.6 995 2678.39 995"/>
<line class="cls-6" x1="2597.9" y1="1527.4" x2="2642.23" y2="1562.23"/>
<polyline class="cls-6" points="1243.3 1142.68 1202.88 1116.08 1165.54 1116.08"/>
<line class="cls-6" x1="1235.28" y1="1460.67" x2="1200.37" y2="1511.91"/>
<line class="cls-10" x1="2036.84" y1="1506.06" x2="2344.63" y2="1522.1"/>
<line class="cls-10" x1="1585.01" y1="1482.51" x2="1952.64" y2="1501.67"/>
<line class="cls-10" x1="1272.68" y1="1466.23" x2="1526.77" y2="1479.48"/>
<line class="cls-10" x1="2098.67" y1="1061.47" x2="2536.46" y2="1022.49"/>
<line class="cls-10" x1="1920.34" y1="1077.35" x2="2075.8" y2="1063.51"/>
<line class="cls-10" x1="1766.06" y1="1091.09" x2="1843.62" y2="1084.19"/>
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 95 KiB