Compare commits
2 Commits
7147bcbe25
...
5774b22f11
| Author | SHA1 | Date | |
|---|---|---|---|
|
5774b22f11 | ||
|
|
3c32404ad3 |
75
README.md
75
README.md
@ -0,0 +1,75 @@
|
||||
# Feuerwehr Stadt Wehlen – Webseite
|
||||
|
||||
Modernes Redesign im hellen „Modern Light"-Design: hellgrauer Hintergrund,
|
||||
weiße abgerundete Karten, roter Header mit Logo-Muster. Vollständig
|
||||
mobile-optimiert (responsives Grid, Hamburger-Menü, Karten statt Tabellen
|
||||
auf dem Smartphone).
|
||||
|
||||
## Seiten
|
||||
|
||||
| Datei | Inhalt |
|
||||
|---|---|
|
||||
| `index.html` | Start: Hero, Gerätehaus, Termine, Schnellzugriff |
|
||||
| `geschichte.html` | Wehrgeschichte seit 1865 als Accordion (inkl. Zeitungsartikel 1921) |
|
||||
| `technik.html` | Fahrzeug-Übersicht mit Kategorie-Filter |
|
||||
| `fahrzeug.html` | Detailseite, datengetrieben via `?id=lf10` usw. |
|
||||
| `mitglieder.html` | Organigramm & Mitgliederlisten |
|
||||
| `dienstplan.html` | Nächste Termine + komplette Termintabelle |
|
||||
| `veranstaltungen.html` | Feste & Veranstaltungen (aus der CSV gefiltert) |
|
||||
| `kontakt.html` | Kontakt & Impressum |
|
||||
|
||||
## Struktur
|
||||
|
||||
```
|
||||
assets/
|
||||
style.css Komplettes Design (Farben in :root-Variablen)
|
||||
components.js Navbar, Footer, Hero + alle Renderer
|
||||
data/ ZENTRALE DATENQUELLEN – Inhalte nur HIER pflegen
|
||||
fahrzeuge.js Fahrzeuge/Boote/Anhänger inkl. Technikdaten & Bilder
|
||||
geschichte.js Geschichts-Epochen
|
||||
mitglieder.js Organigramm & Mitgliederlisten
|
||||
dienste.js Liest dienstplan/dienstplan.csv, befüllt alle Terminbereiche
|
||||
dienstplan/
|
||||
dienstplan.csv Termine (einzige Quelle für Dienstplan & Veranstaltungen)
|
||||
bilder/, technik/, geschichte/ Bildmaterial
|
||||
```
|
||||
|
||||
## Prinzip
|
||||
|
||||
- Inhalte liegen zentral in `data/` bzw. `dienstplan/dienstplan.csv` –
|
||||
die Seiten rendern daraus automatisch ihr Markup.
|
||||
- Navbar, Footer und Hero liegen in `assets/components.js` und werden in
|
||||
die Platzhalter `#site-header` / `#site-footer` / `#site-hero` eingefügt.
|
||||
- `window.FFW_BASE` (im `<head>` jeder Seite) ist der Pfad zum
|
||||
Projekt-Root – bei Seiten im Root einfach `""`.
|
||||
- Der aktive Menüpunkt wird über `<body data-page="...">` gesteuert.
|
||||
|
||||
## Inhalte ändern
|
||||
|
||||
| Was | Wo |
|
||||
|---|---|
|
||||
| Termine / Dienstplan / Veranstaltungen | `dienstplan/dienstplan.csv` |
|
||||
| Fahrzeugdaten, Bilder, Beladung | `data/fahrzeuge.js` |
|
||||
| Geschichtstexte | `data/geschichte.js` |
|
||||
| Mitglieder / Organigramm | `data/mitglieder.js` |
|
||||
| Menü / Footer / Hero | `assets/components.js` |
|
||||
| Farben | `assets/style.css` (`:root`-Variablen oben) |
|
||||
|
||||
## Offene TODOs
|
||||
|
||||
- Kontaktdaten (Adresse, E-Mail) in `kontakt.html` ergänzen
|
||||
(mit `TODO`-Kommentaren markiert)
|
||||
- ELW 1: Detailseite fehlt noch – Karte ist als „Demnächst" markiert
|
||||
(`inArbeit: true` in `data/fahrzeuge.js`)
|
||||
|
||||
## Lokal ansehen
|
||||
|
||||
```sh
|
||||
python3 -m http.server 8000
|
||||
# dann http://localhost:8000/ öffnen
|
||||
```
|
||||
|
||||
## Hinweis
|
||||
|
||||
Die vorherigen Design-Entwürfe (rote Dark-Variante, alter Stand) sind in
|
||||
der Git-Historie erhalten.
|
||||
304
assets/components.js
Normal file
304
assets/components.js
Normal file
@ -0,0 +1,304 @@
|
||||
/* ======================================================
|
||||
components.js – Feuerwehr Stadt Wehlen (Modern Light)
|
||||
------------------------------------------------------
|
||||
Rendert alle wiederkehrenden Elemente und die Inhalte
|
||||
aus den zentralen Daten-Dateien (data/).
|
||||
|
||||
Erwartet window.FFW_BASE (Pfad zum Projekt-Root).
|
||||
Aktiver Navigationspunkt über <body data-page="...">.
|
||||
====================================================== */
|
||||
|
||||
(function () {
|
||||
const base = window.FFW_BASE || "";
|
||||
const page = document.body.dataset.page || "";
|
||||
|
||||
/* ======================================================
|
||||
NAVIGATION & FOOTER
|
||||
====================================================== */
|
||||
const NAV = `
|
||||
<nav class="navbar navbar-expand-lg gl-navbar sticky-top">
|
||||
<div class="container">
|
||||
<a class="navbar-brand" href="index.html">
|
||||
<img src="${base}bilder/ffw_transp_72.gif" alt="Logo Feuerwehr Stadt Wehlen">
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#glNav"
|
||||
aria-controls="glNav" aria-expanded="false" aria-label="Menü öffnen">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="glNav">
|
||||
<ul class="navbar-nav ms-auto">
|
||||
<li class="nav-item"><a class="nav-link" data-page="start" href="index.html">Startseite</a></li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" data-page="ueber" role="button" data-bs-toggle="dropdown" aria-expanded="false">Über uns</a>
|
||||
<ul class="dropdown-menu dropdown-menu-end">
|
||||
<li><a class="dropdown-item" data-page="geschichte" href="geschichte.html">Geschichte</a></li>
|
||||
<li><a class="dropdown-item" data-page="technik" href="technik.html">Technik</a></li>
|
||||
<li><hr class="dropdown-divider"></li>
|
||||
<li><a class="dropdown-item" data-page="mitglieder" href="mitglieder.html">Organigramm</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class="nav-link" data-page="dienstplan" href="dienstplan.html">Dienstplan</a></li>
|
||||
<li class="nav-item"><a class="nav-link" data-page="veranstaltungen" href="veranstaltungen.html">Veranstaltungen</a></li>
|
||||
<li class="nav-item"><a class="nav-link" data-page="kontakt" href="kontakt.html">Kontakt / Impressum</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>`;
|
||||
|
||||
const FOOTER = `
|
||||
<footer class="gl-footer">
|
||||
<div class="container">
|
||||
<div class="row g-4 text-center text-md-start align-items-start">
|
||||
<div class="col-md-3">
|
||||
<div class="footer-brand">
|
||||
<img src="${base}bilder/ffw_transp_72.gif" alt="Logo Feuerwehr Stadt Wehlen">
|
||||
<span>Feuerwehr<br>Stadt Wehlen</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<h6>Letzte Aktualisierung</h6>
|
||||
<p>17. März 2026</p>
|
||||
<small>(Version 1.2)</small>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<h6>Kleine Statistik der FFw Stadt Wehlen</h6>
|
||||
<p><strong>Aktive:</strong> 27 | <strong>Jugend:</strong> 23 | <strong>Passive:</strong> 9 | <strong>Förderverein:</strong> 172</p>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<h6>Navigation</h6>
|
||||
<ul class="footer-nav justify-content-center justify-content-md-start">
|
||||
<li><a href="geschichte.html">Geschichte</a></li>
|
||||
<li><a href="technik.html">Technik</a></li>
|
||||
<li><a href="mitglieder.html">Organigramm</a></li>
|
||||
<li><a href="dienstplan.html">Dienstplan</a></li>
|
||||
<li><a href="veranstaltungen.html">Veranstaltungen</a></li>
|
||||
<li><a href="kontakt.html">Kontakt / Impressum</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>`;
|
||||
|
||||
const headerMount = document.getElementById("site-header");
|
||||
if (headerMount) headerMount.innerHTML = NAV;
|
||||
|
||||
const footerMount = document.getElementById("site-footer");
|
||||
if (footerMount) footerMount.innerHTML = FOOTER;
|
||||
|
||||
/* Aktiven Menüpunkt markieren */
|
||||
document.querySelectorAll(`[data-page="${page}"]`).forEach(el => el.classList.add("active"));
|
||||
|
||||
/* ======================================================
|
||||
HERO (Startseite) – helle Split-Karte + Statistik
|
||||
====================================================== */
|
||||
const heroMount = document.getElementById("site-hero");
|
||||
if (heroMount) {
|
||||
heroMount.innerHTML = `
|
||||
<section class="gl-hero container">
|
||||
<div class="gl-hero-karte">
|
||||
<div class="row g-0">
|
||||
<div class="col-lg-6 d-flex align-items-center">
|
||||
<div class="gl-hero-text">
|
||||
<span class="gl-hero-badge">Freiwillige Feuerwehr seit 1901</span>
|
||||
<h1>Feuerwehr <span class="highlight">Stadt Wehlen</span></h1>
|
||||
<p>Ehrenamtlich im Einsatz für Stadt Wehlen und Pötzscha – bei Brand, Hilfeleistung und Wasserrettung auf der Elbe.</p>
|
||||
<div class="gl-hero-cta">
|
||||
<a class="btn-pill" href="technik.html">Unsere Technik</a>
|
||||
<a class="btn-pill btn-pill-ghost" href="dienstplan.html">Dienstplan & Termine</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<div class="gl-hero-bild" style="--hero-bild: url('${base}bilder/geraetehaus.png')" role="img" aria-label="Gerätehaus der Feuerwehr Stadt Wehlen"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row g-3 mt-2">
|
||||
<div class="col-6 col-md-3"><div class="stat-kachel"><div class="zahl">27</div><div class="label">Aktive</div></div></div>
|
||||
<div class="col-6 col-md-3"><div class="stat-kachel"><div class="zahl">23</div><div class="label">Jugendfeuerwehr</div></div></div>
|
||||
<div class="col-6 col-md-3"><div class="stat-kachel"><div class="zahl">9</div><div class="label">Passive</div></div></div>
|
||||
<div class="col-6 col-md-3"><div class="stat-kachel"><div class="zahl">172</div><div class="label">Förderverein</div></div></div>
|
||||
</div>
|
||||
</section>`;
|
||||
}
|
||||
|
||||
/* ======================================================
|
||||
GESCHICHTE – Accordion
|
||||
====================================================== */
|
||||
const geschichteMount = document.getElementById("geschichte-inhalt");
|
||||
if (geschichteMount && window.FFW_GESCHICHTE) {
|
||||
const items = window.FFW_GESCHICHTE.map((epoche, i) => {
|
||||
const inhalt = epoche.eintraege.map(e => {
|
||||
const bildBtn = e.bild
|
||||
? `<button type="button" class="btn-pill mt-3" data-bs-toggle="modal" data-bs-target="#modal1921">${window.FFW_GESCHICHTE_BILD.button}</button>`
|
||||
: "";
|
||||
return `${e.titel ? `<h2>${e.titel}</h2>` : ""}${e.html}${bildBtn}`;
|
||||
}).join("");
|
||||
|
||||
return `
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header">
|
||||
<button class="accordion-button${i === 0 ? "" : " collapsed"}" type="button"
|
||||
data-bs-toggle="collapse" data-bs-target="#epoche${i}"
|
||||
aria-expanded="${i === 0}" aria-controls="epoche${i}">
|
||||
${epoche.zeitraum}
|
||||
</button>
|
||||
</h2>
|
||||
<div id="epoche${i}" class="accordion-collapse collapse${i === 0 ? " show" : ""}" data-bs-parent="#geschichteAccordion">
|
||||
<div class="accordion-body">${inhalt}</div>
|
||||
</div>
|
||||
</div>`;
|
||||
}).join("");
|
||||
|
||||
geschichteMount.innerHTML = `
|
||||
<div class="accordion gl-accordion" id="geschichteAccordion">${items}</div>`;
|
||||
|
||||
/* Modal für den Zeitungsartikel von 1921 */
|
||||
document.body.insertAdjacentHTML("beforeend", `
|
||||
<div class="modal fade" id="modal1921" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-lg modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title">${window.FFW_GESCHICHTE_BILD.titel}</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Schließen"></button>
|
||||
</div>
|
||||
<div class="modal-body text-center">
|
||||
<img src="${base}${window.FFW_GESCHICHTE_BILD.src}" alt="${window.FFW_GESCHICHTE_BILD.titel}" class="img-fluid rounded">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>`);
|
||||
}
|
||||
|
||||
/* ======================================================
|
||||
TECHNIK – Kartenraster mit Kategorie-Filter
|
||||
====================================================== */
|
||||
const technikMount = document.getElementById("technik-grid");
|
||||
if (technikMount && window.FFW_FAHRZEUGE) {
|
||||
const kategorien = [...new Set(window.FFW_FAHRZEUGE.map(f => f.kategorie))];
|
||||
|
||||
const filterBtns = [`<button class="filter-btn active" data-filter="alle">Alle</button>`]
|
||||
.concat(kategorien.map(k => `<button class="filter-btn" data-filter="${k}">${k}</button>`))
|
||||
.join("");
|
||||
|
||||
const karten = window.FFW_FAHRZEUGE.map(f => {
|
||||
const inner = `
|
||||
<div class="bild-wrap">
|
||||
<img src="${base}${f.karte}" alt="${f.name}" loading="lazy">
|
||||
<span class="kat-chip">${f.kategorie}</span>
|
||||
${f.inArbeit ? `<span class="bald-chip">Demnächst</span>` : ""}
|
||||
</div>
|
||||
<div class="body"><h5>${f.name}</h5><span class="pfeil">→</span></div>`;
|
||||
|
||||
return `<div class="col-md-4 col-sm-6 tech-item" data-kategorie="${f.kategorie}">
|
||||
${f.inArbeit
|
||||
? `<div class="tech-card">${inner}</div>`
|
||||
: `<a class="tech-card" href="fahrzeug.html?id=${f.id}">${inner}</a>`}
|
||||
</div>`;
|
||||
}).join("");
|
||||
|
||||
technikMount.innerHTML = `
|
||||
<div class="filter-leiste">${filterBtns}</div>
|
||||
<div class="row g-4">${karten}</div>`;
|
||||
|
||||
technikMount.querySelectorAll(".filter-btn").forEach(btn => {
|
||||
btn.addEventListener("click", () => {
|
||||
technikMount.querySelectorAll(".filter-btn").forEach(b => b.classList.remove("active"));
|
||||
btn.classList.add("active");
|
||||
const filter = btn.dataset.filter;
|
||||
technikMount.querySelectorAll(".tech-item").forEach(item => {
|
||||
item.classList.toggle("d-none", filter !== "alle" && item.dataset.kategorie !== filter);
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/* ======================================================
|
||||
FAHRZEUG – Detailseite (datengetrieben via ?id=)
|
||||
====================================================== */
|
||||
const fzMount = document.getElementById("fahrzeug-detail");
|
||||
if (fzMount && window.FFW_FAHRZEUGE) {
|
||||
const id = new URLSearchParams(location.search).get("id");
|
||||
const f = window.FFW_FAHRZEUGE.find(x => x.id === id);
|
||||
|
||||
if (!f || f.inArbeit) {
|
||||
fzMount.innerHTML = `
|
||||
<div class="fz-karte text-center">
|
||||
<h3>Fahrzeug nicht gefunden</h3>
|
||||
<p class="termin-beschr">Dieses Fahrzeug existiert nicht (mehr) oder die Seite befindet sich im Aufbau.</p>
|
||||
<a class="btn-pill mt-3" href="technik.html">← Zurück zur Technik-Übersicht</a>
|
||||
</div>`;
|
||||
} else {
|
||||
document.title = `${f.titel} | Feuerwehr Stadt Wehlen`;
|
||||
|
||||
const specs = f.daten.map(([label, wert]) =>
|
||||
`<li><span class="spec-label">${label}</span><span>${wert}</span></li>`).join("");
|
||||
|
||||
const bereiche = (f.bereiche || []).map(b => `
|
||||
<h3 class="fz-sektion">${b.titel}</h3>
|
||||
<ul class="fz-punkte">${b.punkte.map(p => `<li>${p}</li>`).join("")}</ul>`).join("");
|
||||
|
||||
const galerie = f.bilder.length > 1
|
||||
? `<div id="fahrzeugCarousel" class="carousel slide">
|
||||
<div class="carousel-inner">
|
||||
${f.bilder.map((b, i) => `<div class="carousel-item${i === 0 ? " active" : ""}"><img src="${base}${b.src}" class="d-block w-100" alt="${b.alt}" loading="lazy"></div>`).join("")}
|
||||
</div>
|
||||
<button class="carousel-control-prev" type="button" data-bs-target="#fahrzeugCarousel" data-bs-slide="prev"><span class="carousel-control-prev-icon"></span><span class="visually-hidden">Zurück</span></button>
|
||||
<button class="carousel-control-next" type="button" data-bs-target="#fahrzeugCarousel" data-bs-slide="next"><span class="carousel-control-next-icon"></span><span class="visually-hidden">Weiter</span></button>
|
||||
</div>`
|
||||
: `<img src="${base}${f.bilder[0].src}" class="img-fluid w-100 fz-einzelbild" alt="${f.bilder[0].alt}" loading="lazy">`;
|
||||
|
||||
fzMount.innerHTML = `
|
||||
<div class="row g-4">
|
||||
<div class="col-lg-7">
|
||||
<div class="fz-karte">
|
||||
${f.standort ? `<span class="standort-chip">Standort: ${f.standort}</span>` : ""}
|
||||
<h3>Fahrzeugdaten</h3>
|
||||
<ul class="spec-list">${specs}</ul>
|
||||
${bereiche}
|
||||
${f.text ? `<p class="mt-4 mb-0">${f.text}</p>` : ""}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-5">
|
||||
${galerie}
|
||||
${f.hinweis ? `<div class="fz-hinweis">${f.hinweis}</div>` : ""}
|
||||
</div>
|
||||
</div>`;
|
||||
|
||||
const carouselEl = fzMount.querySelector("#fahrzeugCarousel");
|
||||
if (carouselEl && window.bootstrap) new bootstrap.Carousel(carouselEl, { interval: 5000 });
|
||||
}
|
||||
}
|
||||
|
||||
/* ======================================================
|
||||
MITGLIEDER – Organigramm
|
||||
====================================================== */
|
||||
const orgMount = document.getElementById("mitglieder-inhalt");
|
||||
if (orgMount && window.FFW_MITGLIEDER) {
|
||||
const M = window.FFW_MITGLIEDER;
|
||||
const box = (eintrag, klasse = "") => `
|
||||
<div class="org-box ${klasse}">
|
||||
<span class="rolle">${eintrag.rolle}</span>
|
||||
<span class="name">${eintrag.namen.join("<br>")}</span>
|
||||
</div>`;
|
||||
|
||||
const ebene = (eintraege, klasse = "") =>
|
||||
`<div class="org-ebene">${eintraege.map(e => box(e, klasse)).join("")}</div>`;
|
||||
|
||||
const gruppen = M.gruppen.map(g => {
|
||||
const inhalt = g.abschnitte
|
||||
? g.abschnitte.map(a => `<span class="label">${a.label}</span><ul>${a.namen.map(n => `<li>${n}</li>`).join("")}</ul>`).join("")
|
||||
: `<ul>${g.namen.map(n => `<li>${n}</li>`).join("")}</ul>`;
|
||||
return `<div class="org-gruppe"><h3>${g.titel}</h3>${inhalt}</div>`;
|
||||
}).join("");
|
||||
|
||||
orgMount.innerHTML = `
|
||||
${ebene([M.fuehrung[0]], "fuehrung")}
|
||||
${ebene([M.fuehrung[1]], "fuehrung")}
|
||||
${ebene(M.stab)}
|
||||
${ebene(M.fachwarte)}
|
||||
<div class="org-gruppen">${gruppen}</div>`;
|
||||
}
|
||||
})();
|
||||
714
assets/style.css
Normal file
714
assets/style.css
Normal file
@ -0,0 +1,714 @@
|
||||
/* ======================================================
|
||||
style.css – Feuerwehr Stadt Wehlen ("Modern Light")
|
||||
------------------------------------------------------
|
||||
Helles, modernes Design: hellgrauer Hintergrund, weiße
|
||||
abgerundete Karten mit weichen Schatten, viel Weißraum.
|
||||
Rot nur als Akzent – der Header trägt das rote
|
||||
Logo-Muster. Mobile-first.
|
||||
====================================================== */
|
||||
|
||||
:root {
|
||||
--rot: #b30000;
|
||||
--rot-dunkel: #8a0000;
|
||||
--bg: #eef0f4;
|
||||
--karte: #ffffff;
|
||||
--text: #2b2f36;
|
||||
--muted: #6b7280;
|
||||
--border: #e3e6ea;
|
||||
--schatten: 0 6px 24px rgba(30, 34, 45, 0.08);
|
||||
--schatten-hover: 0 14px 34px rgba(30, 34, 45, 0.14);
|
||||
--radius: 16px;
|
||||
--pattern: url('../bilder/logo2.jpeg');
|
||||
}
|
||||
|
||||
* { box-sizing: border-box; }
|
||||
|
||||
html { scroll-behavior: smooth; }
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
background: var(--bg);
|
||||
color: var(--text);
|
||||
font-family: "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
|
||||
line-height: 1.65;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
main { flex: 1 0 auto; }
|
||||
|
||||
::selection { background: var(--rot); color: #fff; }
|
||||
|
||||
::-webkit-scrollbar { width: 10px; }
|
||||
::-webkit-scrollbar-track { background: var(--bg); }
|
||||
::-webkit-scrollbar-thumb { background: #b9bec7; border-radius: 6px; }
|
||||
::-webkit-scrollbar-thumb:hover { background: var(--rot); }
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Typografie
|
||||
------------------------------------------------------ */
|
||||
h1, h2, h3, h4, h5 { font-weight: 700; color: var(--text); }
|
||||
|
||||
a { color: var(--rot); }
|
||||
a:hover { color: var(--rot-dunkel); }
|
||||
|
||||
.abschnitt-titel {
|
||||
font-size: 1.6rem;
|
||||
margin-bottom: 0.4rem;
|
||||
}
|
||||
|
||||
.abschnitt-sub {
|
||||
color: var(--muted);
|
||||
margin-bottom: 1.8rem;
|
||||
}
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Buttons (abgerundet, Pill-Form)
|
||||
------------------------------------------------------ */
|
||||
.btn-pill {
|
||||
display: inline-block;
|
||||
background: var(--rot);
|
||||
color: #fff !important;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
padding: 0.75rem 1.7rem;
|
||||
border: none;
|
||||
border-radius: 999px;
|
||||
box-shadow: 0 6px 16px rgba(179, 0, 0, 0.28);
|
||||
transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
|
||||
}
|
||||
|
||||
.btn-pill:hover {
|
||||
background: var(--rot-dunkel);
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 10px 22px rgba(179, 0, 0, 0.34);
|
||||
}
|
||||
|
||||
.btn-pill-ghost {
|
||||
background: #fff;
|
||||
color: var(--rot) !important;
|
||||
box-shadow: inset 0 0 0 2px var(--rot);
|
||||
}
|
||||
|
||||
.btn-pill-ghost:hover { background: var(--rot); color: #fff !important; }
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Navbar (rot mit Logo-Muster, weiße Schrift)
|
||||
------------------------------------------------------ */
|
||||
.gl-navbar {
|
||||
background-color: var(--rot);
|
||||
background-image: var(--pattern);
|
||||
background-size: 9em;
|
||||
background-repeat: repeat;
|
||||
background-blend-mode: multiply;
|
||||
box-shadow: 0 4px 18px rgba(0, 0, 0, 0.22);
|
||||
padding: 0.9rem 0;
|
||||
}
|
||||
|
||||
.gl-navbar .navbar-brand {
|
||||
color: #fff !important;
|
||||
font-weight: 700;
|
||||
font-size: 1.25rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.6rem;
|
||||
text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.55);
|
||||
}
|
||||
|
||||
.gl-navbar .navbar-brand img { height: 2.6em; width: auto; }
|
||||
|
||||
.gl-navbar .nav-link {
|
||||
color: rgba(255, 255, 255, 0.92) !important;
|
||||
font-weight: 600;
|
||||
border-radius: 999px;
|
||||
padding: 0.45rem 1rem !important;
|
||||
margin: 0 0.1rem;
|
||||
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.45);
|
||||
transition: background 0.2s ease, color 0.2s ease;
|
||||
}
|
||||
|
||||
.gl-navbar .nav-link:hover { background: rgba(255, 255, 255, 0.18); color: #fff !important; }
|
||||
|
||||
.gl-navbar .nav-link.active {
|
||||
background: #fff;
|
||||
color: var(--rot) !important;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.gl-navbar .dropdown-menu {
|
||||
border: none;
|
||||
border-radius: 14px;
|
||||
box-shadow: var(--schatten-hover);
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.gl-navbar .dropdown-item { border-radius: 10px; font-weight: 500; color: var(--text); }
|
||||
|
||||
.gl-navbar .dropdown-item:hover,
|
||||
.gl-navbar .dropdown-item.active { background: rgba(179, 0, 0, 0.08); color: var(--rot); }
|
||||
|
||||
.gl-navbar .navbar-toggler { border-color: rgba(255, 255, 255, 0.7); }
|
||||
.gl-navbar .navbar-toggler-icon {
|
||||
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23ffffff' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
|
||||
}
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Hero (Startseite) – helle Split-Karte
|
||||
------------------------------------------------------ */
|
||||
.gl-hero { padding: 3rem 0 1rem; }
|
||||
|
||||
.gl-hero-karte {
|
||||
background: var(--karte);
|
||||
border-radius: 24px;
|
||||
box-shadow: var(--schatten);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.gl-hero-text { padding: 2.5rem; }
|
||||
|
||||
.gl-hero-badge {
|
||||
display: inline-block;
|
||||
background: rgba(179, 0, 0, 0.09);
|
||||
color: var(--rot);
|
||||
font-weight: 700;
|
||||
font-size: 0.8rem;
|
||||
letter-spacing: 0.06em;
|
||||
text-transform: uppercase;
|
||||
border-radius: 999px;
|
||||
padding: 0.35rem 1rem;
|
||||
margin-bottom: 1.1rem;
|
||||
}
|
||||
|
||||
.gl-hero h1 { font-size: clamp(1.9rem, 4.5vw, 3rem); line-height: 1.15; margin-bottom: 1rem; }
|
||||
.gl-hero h1 .highlight { color: var(--rot); }
|
||||
.gl-hero p { color: var(--muted); font-size: 1.08rem; }
|
||||
|
||||
.gl-hero-cta { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: 1.6rem; }
|
||||
|
||||
.gl-hero-bild {
|
||||
min-height: 260px;
|
||||
height: 100%;
|
||||
background: var(--hero-bild) center/cover no-repeat;
|
||||
}
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Statistik-Kacheln (Startseite)
|
||||
------------------------------------------------------ */
|
||||
.stat-kachel {
|
||||
background: var(--karte);
|
||||
border-radius: var(--radius);
|
||||
box-shadow: var(--schatten);
|
||||
text-align: center;
|
||||
padding: 1.4rem 1rem;
|
||||
height: 100%;
|
||||
transition: transform 0.2s ease, box-shadow 0.2s ease;
|
||||
}
|
||||
|
||||
.stat-kachel:hover { transform: translateY(-4px); box-shadow: var(--schatten-hover); }
|
||||
|
||||
.stat-kachel .zahl { font-size: 2rem; font-weight: 800; color: var(--rot); line-height: 1.1; }
|
||||
.stat-kachel .label { color: var(--muted); font-size: 0.9rem; font-weight: 600; }
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Karten (Termine, Quicklinks)
|
||||
------------------------------------------------------ */
|
||||
.gl-card {
|
||||
background: var(--karte);
|
||||
border-radius: var(--radius);
|
||||
box-shadow: var(--schatten);
|
||||
padding: 1.6rem;
|
||||
height: 100%;
|
||||
transition: transform 0.2s ease, box-shadow 0.2s ease;
|
||||
}
|
||||
|
||||
a.gl-card { display: block; text-decoration: none; color: inherit; }
|
||||
.gl-card:hover { transform: translateY(-4px); box-shadow: var(--schatten-hover); }
|
||||
|
||||
.gl-card h3 { font-size: 1.15rem; margin-bottom: 0.9rem; }
|
||||
.gl-card h3 .icon {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 2.2rem;
|
||||
height: 2.2rem;
|
||||
border-radius: 12px;
|
||||
background: rgba(179, 0, 0, 0.09);
|
||||
margin-right: 0.6rem;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.gl-card .termin-datum { font-weight: 700; font-size: 1.08rem; margin-bottom: 0.25rem; }
|
||||
.gl-card .termin-art { color: var(--rot); font-weight: 600; margin-bottom: 0.25rem; }
|
||||
.gl-card .termin-beschr { color: var(--muted); margin-bottom: 0; }
|
||||
|
||||
.gl-card .mehr { color: var(--rot); font-weight: 600; margin-top: 0.8rem; display: inline-block; }
|
||||
.gl-card p.beschreibung { color: var(--muted); margin-bottom: 0; }
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Seitenkopf (Unterseiten) – rotes Musterband
|
||||
------------------------------------------------------ */
|
||||
.gl-seitenkopf {
|
||||
background-color: var(--rot);
|
||||
background-image: var(--pattern);
|
||||
background-size: 11em;
|
||||
background-repeat: repeat;
|
||||
background-blend-mode: multiply;
|
||||
color: #fff;
|
||||
padding: 3.2rem 0;
|
||||
text-align: center;
|
||||
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);
|
||||
}
|
||||
|
||||
.gl-seitenkopf h1 { color: #fff; font-size: clamp(1.7rem, 4.5vw, 2.6rem); margin: 0; text-shadow: 1px 2px 4px rgba(0, 0, 0, 0.45); }
|
||||
.gl-seitenkopf .untertitel { color: rgba(255, 255, 255, 0.88); margin: 0.5rem 0 0; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4); }
|
||||
.gl-seitenkopf a { color: #fff; }
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Geschichte – Accordion
|
||||
------------------------------------------------------ */
|
||||
.gl-accordion .accordion-item {
|
||||
background: var(--karte);
|
||||
border: none;
|
||||
border-radius: var(--radius) !important;
|
||||
box-shadow: var(--schatten);
|
||||
margin-bottom: 1rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.gl-accordion .accordion-button {
|
||||
font-weight: 700;
|
||||
font-size: 1.15rem;
|
||||
color: var(--text);
|
||||
background: var(--karte);
|
||||
padding: 1.2rem 1.5rem;
|
||||
}
|
||||
|
||||
.gl-accordion .accordion-button:not(.collapsed) {
|
||||
background: var(--rot);
|
||||
color: #fff;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.gl-accordion .accordion-button:not(.collapsed)::after {
|
||||
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
|
||||
}
|
||||
|
||||
.gl-accordion .accordion-button:focus { box-shadow: none; border: none; }
|
||||
|
||||
.gl-accordion .accordion-body { padding: 1.6rem 1.8rem; }
|
||||
|
||||
.gl-accordion .accordion-body h2,
|
||||
.gl-accordion .accordion-body h3 {
|
||||
color: var(--rot);
|
||||
font-size: 1.15rem;
|
||||
margin-top: 1.4rem;
|
||||
padding-bottom: 0.35rem;
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
|
||||
.gl-accordion .accordion-body h2:first-child,
|
||||
.gl-accordion .accordion-body h3:first-child { margin-top: 0; }
|
||||
|
||||
.gl-accordion blockquote {
|
||||
border-left: 4px solid var(--rot);
|
||||
background: #faf5f5;
|
||||
border-radius: 0 12px 12px 0;
|
||||
padding: 1rem 1.4rem;
|
||||
margin: 1.4rem 0;
|
||||
font-style: italic;
|
||||
color: #5a3a3a;
|
||||
}
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Technik – Kartenraster mit Kategorie-Filter
|
||||
------------------------------------------------------ */
|
||||
.filter-leiste {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.6rem;
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.filter-btn {
|
||||
background: var(--karte);
|
||||
border: 2px solid var(--border);
|
||||
color: var(--text);
|
||||
font-weight: 600;
|
||||
border-radius: 999px;
|
||||
padding: 0.45rem 1.2rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.filter-btn:hover { border-color: var(--rot); color: var(--rot); }
|
||||
|
||||
.filter-btn.active {
|
||||
background: var(--rot);
|
||||
border-color: var(--rot);
|
||||
color: #fff;
|
||||
box-shadow: 0 6px 14px rgba(179, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.tech-card {
|
||||
display: block;
|
||||
background: var(--karte);
|
||||
border-radius: var(--radius);
|
||||
box-shadow: var(--schatten);
|
||||
overflow: hidden;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
height: 100%;
|
||||
transition: transform 0.25s ease, box-shadow 0.25s ease;
|
||||
}
|
||||
|
||||
.tech-card:hover { transform: translateY(-6px); box-shadow: var(--schatten-hover); }
|
||||
|
||||
.tech-card .bild-wrap { position: relative; height: 200px; overflow: hidden; }
|
||||
|
||||
.tech-card .bild-wrap img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
transition: transform 0.35s ease;
|
||||
}
|
||||
|
||||
.tech-card:hover .bild-wrap img { transform: scale(1.07); }
|
||||
|
||||
.tech-card .kat-chip {
|
||||
position: absolute;
|
||||
top: 12px;
|
||||
left: 12px;
|
||||
background: rgba(255, 255, 255, 0.94);
|
||||
color: var(--rot);
|
||||
font-size: 0.72rem;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.06em;
|
||||
border-radius: 999px;
|
||||
padding: 0.25rem 0.8rem;
|
||||
}
|
||||
|
||||
.tech-card .bald-chip {
|
||||
position: absolute;
|
||||
top: 12px;
|
||||
right: 12px;
|
||||
background: var(--rot);
|
||||
color: #fff;
|
||||
font-size: 0.72rem;
|
||||
font-weight: 700;
|
||||
border-radius: 999px;
|
||||
padding: 0.25rem 0.8rem;
|
||||
}
|
||||
|
||||
.tech-card .body { padding: 1.2rem 1.4rem; display: flex; justify-content: space-between; align-items: center; gap: 0.6rem; }
|
||||
.tech-card .body h5 { margin: 0; font-weight: 700; }
|
||||
.tech-card .body .pfeil { color: var(--rot); font-weight: 700; transition: transform 0.25s ease; }
|
||||
.tech-card:hover .body .pfeil { transform: translateX(5px); }
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Fahrzeug-Detail
|
||||
------------------------------------------------------ */
|
||||
.fz-karte {
|
||||
background: var(--karte);
|
||||
border-radius: var(--radius);
|
||||
box-shadow: var(--schatten);
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.standort-chip {
|
||||
display: inline-block;
|
||||
background: rgba(179, 0, 0, 0.09);
|
||||
color: var(--rot);
|
||||
font-weight: 700;
|
||||
font-size: 0.8rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.06em;
|
||||
border-radius: 999px;
|
||||
padding: 0.3rem 1rem;
|
||||
margin-bottom: 1.2rem;
|
||||
}
|
||||
|
||||
.spec-list { list-style: none; padding: 0; margin: 0; }
|
||||
|
||||
.spec-list li {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.2rem 1rem;
|
||||
padding: 0.65rem 0;
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
|
||||
.spec-list li:last-child { border-bottom: none; }
|
||||
|
||||
.spec-list .spec-label { min-width: 160px; color: var(--muted); font-weight: 600; }
|
||||
|
||||
.fz-sektion {
|
||||
color: var(--rot);
|
||||
font-size: 1.05rem;
|
||||
margin: 1.8rem 0 0.7rem;
|
||||
padding-bottom: 0.3rem;
|
||||
border-bottom: 2px solid rgba(179, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
.fz-punkte { margin: 0; padding-left: 1.2rem; }
|
||||
.fz-punkte li { padding: 0.2rem 0; }
|
||||
.fz-punkte li::marker { color: var(--rot); }
|
||||
|
||||
.fz-hinweis {
|
||||
margin-top: 1.2rem;
|
||||
padding: 1rem 1.3rem;
|
||||
background: #fff8f6;
|
||||
border-left: 4px solid var(--rot);
|
||||
border-radius: 0 12px 12px 0;
|
||||
color: #6b4a4a;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
#fahrzeugCarousel { border-radius: var(--radius); overflow: hidden; box-shadow: var(--schatten); }
|
||||
#fahrzeugCarousel .carousel-item img { max-height: 480px; object-fit: cover; }
|
||||
|
||||
#fahrzeugCarousel .carousel-control-prev-icon,
|
||||
#fahrzeugCarousel .carousel-control-next-icon {
|
||||
background-color: rgba(179, 0, 0, 0.85);
|
||||
background-size: 55%;
|
||||
border-radius: 50%;
|
||||
padding: 1.2rem;
|
||||
}
|
||||
|
||||
.fz-einzelbild { border-radius: var(--radius); box-shadow: var(--schatten); }
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Mitglieder / Organigramm
|
||||
------------------------------------------------------ */
|
||||
.org-ebene {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
gap: 1rem;
|
||||
position: relative;
|
||||
padding-top: 1.6rem;
|
||||
}
|
||||
|
||||
.org-ebene + .org-ebene::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
width: 2px;
|
||||
height: 1.6rem;
|
||||
background: #c9ccd2;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
|
||||
.org-box {
|
||||
background: var(--karte);
|
||||
border-radius: 14px;
|
||||
box-shadow: var(--schatten);
|
||||
padding: 1rem 1.5rem;
|
||||
min-width: 210px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.org-box.fuehrung { box-shadow: var(--schatten), inset 0 4px 0 var(--rot); }
|
||||
|
||||
.org-box .rolle {
|
||||
display: inline-block;
|
||||
background: rgba(179, 0, 0, 0.09);
|
||||
color: var(--rot);
|
||||
border-radius: 999px;
|
||||
font-size: 0.72rem;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.07em;
|
||||
padding: 0.2rem 0.8rem;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.org-box .name { display: block; font-weight: 700; line-height: 1.55; }
|
||||
|
||||
.org-gruppen { display: grid; gap: 1.2rem; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); margin-top: 2.8rem; }
|
||||
|
||||
.org-gruppe {
|
||||
background: var(--karte);
|
||||
border-radius: var(--radius);
|
||||
box-shadow: var(--schatten);
|
||||
padding: 1.4rem 1.6rem;
|
||||
}
|
||||
|
||||
.org-gruppe h3 { font-size: 1.05rem; color: var(--rot); margin-bottom: 0.9rem; }
|
||||
.org-gruppe .label { color: var(--muted); font-weight: 700; font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.07em; display: block; margin-top: 0.8rem; }
|
||||
.org-gruppe ul { list-style: none; margin: 0; padding: 0; }
|
||||
.org-gruppe li { padding: 0.18rem 0; font-size: 0.95rem; }
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Dienstplan-Tabelle
|
||||
------------------------------------------------------ */
|
||||
.termin-tabelle-wrap {
|
||||
background: var(--karte);
|
||||
border-radius: var(--radius);
|
||||
box-shadow: var(--schatten);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.termin-tabelle { width: 100%; border-collapse: collapse; }
|
||||
|
||||
.termin-tabelle th {
|
||||
background: var(--rot);
|
||||
color: #fff;
|
||||
font-size: 0.82rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.06em;
|
||||
padding: 1rem 1.2rem;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.termin-tabelle td { padding: 0.9rem 1.2rem; border-top: 1px solid var(--border); vertical-align: top; }
|
||||
|
||||
.termin-tabelle tbody tr { transition: background 0.15s ease; }
|
||||
.termin-tabelle tbody tr:hover { background: #faf5f5; }
|
||||
|
||||
.termin-tabelle tr.termin-is-next td { background: rgba(179, 0, 0, 0.05); box-shadow: inset 4px 0 0 var(--rot); font-weight: 600; }
|
||||
|
||||
.termin-badge {
|
||||
display: inline-block;
|
||||
background: #eef0f4;
|
||||
color: var(--text);
|
||||
font-size: 0.75rem;
|
||||
font-weight: 700;
|
||||
border-radius: 999px;
|
||||
padding: 0.25rem 0.8rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.termin-badge-fest, .termin-badge-feier { background: var(--rot); color: #fff; }
|
||||
.termin-badge-praxis, .termin-badge-ausbildung { background: #e7ecf5; color: #31517f; }
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.termin-tabelle-wrap { background: transparent; box-shadow: none; overflow: visible; }
|
||||
.termin-tabelle thead { display: none; }
|
||||
.termin-tabelle tr {
|
||||
display: block;
|
||||
background: var(--karte);
|
||||
border-radius: var(--radius);
|
||||
box-shadow: var(--schatten);
|
||||
margin-bottom: 1rem;
|
||||
padding: 0.8rem 0.4rem;
|
||||
}
|
||||
.termin-tabelle tr.termin-is-next { box-shadow: var(--schatten), inset 4px 0 0 var(--rot); }
|
||||
.termin-tabelle td { display: flex; gap: 0.8rem; border: none; padding: 0.3rem 1.2rem; }
|
||||
.termin-tabelle td::before {
|
||||
content: attr(data-label);
|
||||
min-width: 105px;
|
||||
color: var(--muted);
|
||||
font-size: 0.75rem;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
}
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Footer (dunkelgrau)
|
||||
------------------------------------------------------ */
|
||||
.gl-footer {
|
||||
background: #23272e;
|
||||
color: #aab0ba;
|
||||
padding: 2.8rem 0;
|
||||
margin-top: 4.5rem;
|
||||
border-top: 5px solid var(--rot);
|
||||
}
|
||||
|
||||
.gl-footer h6 {
|
||||
color: #fff;
|
||||
font-size: 0.9rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.07em;
|
||||
margin-bottom: 0.7rem;
|
||||
}
|
||||
|
||||
.gl-footer p, .gl-footer small { margin-bottom: 0.2rem; }
|
||||
|
||||
.gl-footer .footer-nav { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 0.4rem 1.3rem; justify-content: center; }
|
||||
.gl-footer .footer-nav a { color: #d7dbe1; text-decoration: none; font-size: 0.92rem; }
|
||||
.gl-footer .footer-nav a:hover { color: #fff; text-decoration: underline; }
|
||||
|
||||
.gl-footer .footer-brand {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.8rem;
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.gl-footer .footer-brand { justify-content: flex-start; }
|
||||
}
|
||||
|
||||
.gl-footer .footer-brand img { height: 3.2em; width: auto; }
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Bild-Karte (z.B. Gerätehaus auf der Startseite)
|
||||
------------------------------------------------------ */
|
||||
.bild-karte {
|
||||
border-radius: var(--radius);
|
||||
box-shadow: var(--schatten);
|
||||
overflow: hidden;
|
||||
height: 100%;
|
||||
min-height: 260px;
|
||||
}
|
||||
|
||||
.bild-karte img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Veranstaltungs-Karten
|
||||
------------------------------------------------------ */
|
||||
.va-card {
|
||||
background: var(--karte);
|
||||
border-radius: var(--radius);
|
||||
box-shadow: var(--schatten);
|
||||
padding: 1.6rem;
|
||||
height: 100%;
|
||||
transition: transform 0.2s ease, box-shadow 0.2s ease;
|
||||
}
|
||||
|
||||
.va-card:hover { transform: translateY(-4px); box-shadow: var(--schatten-hover); }
|
||||
|
||||
.va-card .va-datum { font-weight: 800; font-size: 1.15rem; margin-bottom: 0.2rem; }
|
||||
.va-card .va-titel { color: var(--rot); font-weight: 700; margin-bottom: 0.4rem; }
|
||||
.va-card .va-details { color: var(--muted); margin-bottom: 0; }
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Kontakt-Seite
|
||||
------------------------------------------------------ */
|
||||
.notruf-card {
|
||||
background: var(--rot);
|
||||
color: #fff;
|
||||
border-radius: var(--radius);
|
||||
box-shadow: 0 10px 26px rgba(179, 0, 0, 0.35);
|
||||
padding: 2rem;
|
||||
text-align: center;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.notruf-card .nummer { font-size: 3rem; font-weight: 800; line-height: 1; }
|
||||
.notruf-card p { color: rgba(255, 255, 255, 0.9); margin-bottom: 0; }
|
||||
|
||||
.kontakt-dl { display: grid; grid-template-columns: auto 1fr; gap: 0.4rem 1.2rem; margin: 0; }
|
||||
.kontakt-dl dt { color: var(--muted); font-weight: 600; }
|
||||
.kontakt-dl dd { margin: 0; font-weight: 600; }
|
||||
|
||||
/* ------------------------------------------------------
|
||||
Modal (Zeitungsartikel etc.)
|
||||
------------------------------------------------------ */
|
||||
.modal-content { border: none; border-radius: var(--radius); box-shadow: var(--schatten-hover); }
|
||||
.modal-header { border-bottom: 1px solid var(--border); }
|
||||
.modal-title { color: var(--rot); font-weight: 700; }
|
||||
20
css/acc.css
20
css/acc.css
@ -1,20 +0,0 @@
|
||||
.history-container{
|
||||
max-width: 45em;
|
||||
margin: auto;
|
||||
|
||||
}
|
||||
|
||||
/* Custom style for the close button */
|
||||
.custom-close {
|
||||
background-color: red; /* Red background */
|
||||
border: none; /* Remove border */
|
||||
width: 30px; /* Adjust width if needed */
|
||||
height: 30px; /* Adjust height if needed */
|
||||
color: white; /* White X color */
|
||||
border-radius: 50%; /* Make the button round */
|
||||
}
|
||||
|
||||
.custom-close:focus {
|
||||
outline: none; /* Remove the outline when focused */
|
||||
}
|
||||
|
||||
@ -1,35 +0,0 @@
|
||||
.carousel-container {
|
||||
max-height: 12em; /* Adjust the max-width to a smaller size */
|
||||
max-width: 25em;
|
||||
background-color: #ffffff;
|
||||
margin: auto; /* Center the carousel */
|
||||
}
|
||||
|
||||
.carousel-container img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
max-height: 12em;
|
||||
object-fit: contain; /* Prevents cropping while keeping aspect ratio */
|
||||
}
|
||||
|
||||
.carousel-control-next-icon {
|
||||
background-color: #616161; /* Change the background color to black */
|
||||
background-image: none; /* Remove the default icon */
|
||||
}
|
||||
|
||||
.carousel-control-next-icon::after {
|
||||
|
||||
color: white; /* Set the arrow color to white for contrast */
|
||||
font-size: 2em; /* Adjust the size of the arrow */
|
||||
}
|
||||
|
||||
.carousel-control-prev-icon {
|
||||
background-color: #616161; /* Change the background color to black */
|
||||
background-image: none; /* Remove the default icon */
|
||||
}
|
||||
|
||||
.carousel-control-prev-icon::after {
|
||||
|
||||
color: white; /* Set the arrow color to white for contrast */
|
||||
font-size: 2em; /* Adjust the size of the arrow */
|
||||
}
|
||||
@ -1,10 +0,0 @@
|
||||
footer {
|
||||
background-repeat: repeat;
|
||||
background-size: contain;
|
||||
background-blend-mode: multiply;
|
||||
}
|
||||
|
||||
footer table td {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
128
css/nav.css
128
css/nav.css
@ -1,128 +0,0 @@
|
||||
/* ======================================================
|
||||
1. Grundlegende Einstellungen
|
||||
====================================================== */
|
||||
html, body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
overflow-x: hidden;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* ======================================================
|
||||
2. NAVBAR-DESIGN (Mit ffw_transp_72.gif Pattern)
|
||||
====================================================== */
|
||||
.navbar-custom {
|
||||
background-color: #b30000;
|
||||
/* Der Pfad geht eine Ebene hoch aus /css/ raus und dann in /bilder/ */
|
||||
background-image: url('../bilder/ffw_transp_72.gif');
|
||||
background-size: 7em;
|
||||
background-repeat: repeat;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.navbar-custom .navbar-brand,
|
||||
.navbar-custom .nav-link {
|
||||
color: #ffffff !important;
|
||||
font-weight: 600;
|
||||
/* Kleiner Schatten für bessere Lesbarkeit auf dem Pattern */
|
||||
text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
|
||||
}
|
||||
|
||||
.navbar-custom .nav-link:hover {
|
||||
color: #000000 !important;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.navbar-custom .dropdown-menu {
|
||||
background-color: #900000;
|
||||
/* Auch hier das Pattern für das Dropdown */
|
||||
background-image: url('../bilder/ffw_transp_72.gif');
|
||||
background-size: 9em;
|
||||
border: 1px solid rgba(255,255,255,0.2);
|
||||
}
|
||||
|
||||
.navbar-custom .dropdown-item {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.navbar-custom .dropdown-item:hover {
|
||||
background-color: rgba(0,0,0,0.2);
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
/* Brand/Logo Zentrierung & Styling */
|
||||
.navbar-brand {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.75rem;
|
||||
margin-right: 1rem;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.navbar-brand img {
|
||||
height: 3rem;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.navbar-brand span {
|
||||
font-size: 1.2rem;
|
||||
line-height: 1.2;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* Responsive Anpassungen */
|
||||
@media (max-width: 370px) {
|
||||
.navbar-brand {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
}
|
||||
.navbar-brand img {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 520px) {
|
||||
.navbar-brand span {
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* ======================================================
|
||||
3. FACEBOOK-PLUGIN (ADAPTIVE BREITE)
|
||||
====================================================== */
|
||||
.fb-super-wrapper {
|
||||
width: 100%;
|
||||
padding: 2rem 0;
|
||||
background-color: #f8f9fa;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.fb-align-center {
|
||||
display: inline-block;
|
||||
text-align: left;
|
||||
max-width: 700px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.fb-outer-container {
|
||||
width: 100%;
|
||||
max-width: 700px;
|
||||
padding: 0 1rem;
|
||||
}
|
||||
|
||||
.fb-inner-container {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.fb-page,
|
||||
.fb-page > span,
|
||||
.fb-page > span > iframe {
|
||||
width: 100% !important;
|
||||
display: block !important;
|
||||
margin: 0 auto !important;
|
||||
max-width: 100% !important;
|
||||
}
|
||||
103
data/dienste.js
Normal file
103
data/dienste.js
Normal file
@ -0,0 +1,103 @@
|
||||
/* ======================================================
|
||||
dienste.js – ZENTRALE Logik für Dienstplan & Termine
|
||||
------------------------------------------------------
|
||||
Liest dienstplan/dienstplan.csv (einzige Datenquelle) und
|
||||
befüllt – je nachdem, was auf der Seite vorhanden ist:
|
||||
|
||||
#nextDienst nächster Dienst (Kurzform, Startseite)
|
||||
#nextEvent nächste Veranstaltung (Kurzform)
|
||||
#dienstplan-liste komplette Terminliste (Dienstplan-Seite)
|
||||
|
||||
Das Markup nutzt design-neutrale Klassen (termin-*),
|
||||
die von der jeweiligen Varianten-CSS gestylt werden.
|
||||
====================================================== */
|
||||
|
||||
(function () {
|
||||
const csvPfad = (window.FFW_BASE || "") + "dienstplan/dienstplan.csv";
|
||||
|
||||
fetch(csvPfad)
|
||||
.then(res => res.text())
|
||||
.then(text => {
|
||||
const today = new Date().setHours(0, 0, 0, 0);
|
||||
|
||||
const termine = text.trim().split(/\r?\n/).slice(1).map(line => {
|
||||
const [d, tag, zeit, ort, art, beschr] = line.split(line.includes(";") ? ";" : ",");
|
||||
const [y, m, day] = d.trim().split("-");
|
||||
return {
|
||||
datum: new Date(y, m - 1, day),
|
||||
tag: tag.trim(),
|
||||
zeit: zeit.trim(),
|
||||
ort: ort.trim(),
|
||||
art: art.trim(),
|
||||
beschr: beschr.trim()
|
||||
};
|
||||
})
|
||||
.filter(t => t.datum >= today)
|
||||
.sort((a, b) => a.datum - b.datum);
|
||||
|
||||
const istFest = t => /fest|feier/i.test(t.art);
|
||||
const datumFormatiert = t => t.datum.toLocaleDateString("de-DE");
|
||||
|
||||
/* ---------- Kurzform: nächster Dienst / Veranstaltung ---------- */
|
||||
const renderKurz = (id, filterFn) => {
|
||||
const el = document.getElementById(id);
|
||||
if (!el) return;
|
||||
const t = termine.find(filterFn);
|
||||
|
||||
el.innerHTML = t
|
||||
? `<p class="termin-datum">${t.tag}., ${datumFormatiert(t)} | ${t.zeit} Uhr</p>
|
||||
<p class="termin-art">${t.art}</p>
|
||||
<p class="termin-beschr">${t.beschr} (${t.ort})</p>`
|
||||
: `<p class="termin-beschr">Keine weiteren Termine geplant</p>`;
|
||||
};
|
||||
|
||||
renderKurz("nextDienst", t => !istFest(t));
|
||||
renderKurz("nextEvent", istFest);
|
||||
|
||||
/* ---------- Komplette Terminliste (Dienstplan-Seite) ---------- */
|
||||
const liste = document.getElementById("dienstplan-liste");
|
||||
if (liste) {
|
||||
if (!termine.length) {
|
||||
liste.innerHTML = `<p class="termin-beschr">Aktuell sind keine Termine geplant.</p>`;
|
||||
return;
|
||||
}
|
||||
|
||||
const naechster = termine[0];
|
||||
const zeilen = termine.map(t => `
|
||||
<tr class="${t === naechster ? "termin-is-next" : ""}">
|
||||
<td data-label="Datum">${t.tag}., ${datumFormatiert(t)}</td>
|
||||
<td data-label="Uhrzeit">${t.zeit} Uhr</td>
|
||||
<td data-label="Art"><span class="termin-badge termin-badge-${t.art.toLowerCase()}">${t.art}</span></td>
|
||||
<td data-label="Beschreibung">${t.beschr}</td>
|
||||
<td data-label="Ort">${t.ort}</td>
|
||||
</tr>`).join("");
|
||||
|
||||
liste.innerHTML = `
|
||||
<table class="termin-tabelle">
|
||||
<thead>
|
||||
<tr><th>Datum</th><th>Uhrzeit</th><th>Art</th><th>Beschreibung</th><th>Ort</th></tr>
|
||||
</thead>
|
||||
<tbody>${zeilen}</tbody>
|
||||
</table>`;
|
||||
}
|
||||
|
||||
/* ---------- Veranstaltungen-Seite (nur Feste & Feiern) ---------- */
|
||||
const vaMount = document.getElementById("veranstaltungen-liste");
|
||||
if (vaMount) {
|
||||
const events = termine.filter(istFest);
|
||||
|
||||
vaMount.innerHTML = events.length
|
||||
? `<div class="row g-4">${events.map(t => `
|
||||
<div class="col-md-6">
|
||||
<div class="va-card">
|
||||
<p class="va-datum">${t.tag}., ${datumFormatiert(t)}</p>
|
||||
<p class="va-titel">${t.beschr}</p>
|
||||
<p class="va-details">${t.art} · Beginn: ${t.zeit} Uhr · Ort: ${t.ort}</p>
|
||||
</div>
|
||||
</div>`).join("")}
|
||||
</div>`
|
||||
: `<div class="gl-card"><p class="termin-beschr mb-0">Aktuell sind keine Veranstaltungen geplant. Neue Termine werden hier bekannt gegeben.</p></div>`;
|
||||
}
|
||||
})
|
||||
.catch(err => console.error("Fehler beim Laden des Dienstplans:", err));
|
||||
})();
|
||||
441
data/fahrzeuge.js
Normal file
441
data/fahrzeuge.js
Normal file
@ -0,0 +1,441 @@
|
||||
/* ======================================================
|
||||
fahrzeuge.js – ZENTRALE DATENQUELLE für Technik/Fahrzeuge
|
||||
------------------------------------------------------
|
||||
Wird von BEIDEN Design-Varianten (rot & grau) genutzt.
|
||||
Pfade sind relativ zum Projekt-Root und werden beim
|
||||
Rendern mit window.FFW_BASE präfixiert.
|
||||
|
||||
Struktur pro Eintrag:
|
||||
id – eindeutige Kennung (für fahrzeug.html?id=...)
|
||||
kategorie – Gruppierung (Fahrzeuge / Boote / Anhänger / Tradition)
|
||||
karte – Bild für die Technik-Übersicht
|
||||
name – Kurzname für Karten
|
||||
titel – voller Titel der Detailseite
|
||||
standort – optional, wird als Badge angezeigt
|
||||
bilder – Galerie der Detailseite [{src, alt}]
|
||||
hinweis – optionaler Untertitel unter der Galerie
|
||||
text – optionaler Fließtext
|
||||
daten – Stammdaten [[Label, Wert], ...]
|
||||
bereiche – weitere Sektionen [{titel, punkte: [...]}]
|
||||
inArbeit – true = Karte ohne Detailseite (z.B. ELW 1)
|
||||
====================================================== */
|
||||
|
||||
window.FFW_FAHRZEUGE = [
|
||||
{
|
||||
id: "lf10",
|
||||
kategorie: "Fahrzeuge",
|
||||
karte: "technik/technikpage/t_lf10_6_1.jpg",
|
||||
name: "LF 10/6",
|
||||
titel: "Löschgruppenfahrzeug LF 10/6",
|
||||
bilder: [
|
||||
{ src: "technik/lf10/t_lf10_6_1.jpg", alt: "LF 10 Bild 1" },
|
||||
{ src: "technik/lf10/t_lf10_6_2.jpg", alt: "LF 10 Bild 2" },
|
||||
{ src: "technik/lf10/t_lf10_6_3.jpg", alt: "LF 10 Bild 3" },
|
||||
{ src: "technik/lf10/t_lf10_6_4.jpg", alt: "LF 10 Bild 4" },
|
||||
{ src: "technik/lf10/t_lf10_6_5.jpg", alt: "LF 10 Bild 5" },
|
||||
{ src: "technik/lf10/t_lf10_6_6.jpg", alt: "LF 10 Bild 6" }
|
||||
],
|
||||
hinweis: "Erstangriffsfahrzeug für Brand & Hilfeleistung",
|
||||
daten: [
|
||||
["Bezeichnung", "LF 10/6"],
|
||||
["Funkrufname", "Florian Stadt Wehlen 42-1"],
|
||||
["Fahrgestell", "MB Atego 818 F"],
|
||||
["Baujahr", "Juli 2007"],
|
||||
["Motorleistung", "180 PS"],
|
||||
["Gesamtgewicht", "8.600 kg"]
|
||||
],
|
||||
bereiche: [
|
||||
{
|
||||
titel: "Technische Daten & Ausstattung",
|
||||
punkte: [
|
||||
"Maße: L 6,39m | B 2,32m | H 3,00m",
|
||||
"Sicherheit: ABS, Differentialsperre hinten",
|
||||
"Licht/Warn: Martin-Horn (4 Becher), Pneumatik-Lichtmast (2x 1000W)"
|
||||
]
|
||||
},
|
||||
{
|
||||
titel: "Feuerwehrtechnische Beladung",
|
||||
punkte: [
|
||||
"FPN 10-1000-1H Einbaupumpe",
|
||||
"600 Liter Wassertank",
|
||||
"Tragkraftspritze TS 8/8",
|
||||
"Stromerzeuger 6,5 kW (Eisemann)",
|
||||
"3-teilige Schiebeleiter",
|
||||
"Lukas Schere/Spreizer Kombi SC 350",
|
||||
"Wärmebildkamera Bullard Eclipse",
|
||||
"Defibrillator (AED) \"Zoll\"",
|
||||
"Sanitätsrucksack & Watthosen",
|
||||
"Ölbindemittel & Kettensäge"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: "tsf",
|
||||
kategorie: "Fahrzeuge",
|
||||
karte: "technik/technikpage/t_tsf_01.jpg",
|
||||
name: "TSF-W",
|
||||
titel: "Tragkraftspritzenfahrzeug (TSF)",
|
||||
standort: "Pötzscha",
|
||||
bilder: [
|
||||
{ src: "technik/tsf/t_tsf_01.jpg", alt: "TSF Frontansicht" },
|
||||
{ src: "technik/tsf/t_tsf_02.jpg", alt: "TSF Seitenansicht" },
|
||||
{ src: "technik/tsf/t_tsf_06.jpg", alt: "TSF Heckansicht" }
|
||||
],
|
||||
hinweis: "Vielseitiges Ersteinsatzfahrzeug der Ortswehr Pötzscha",
|
||||
daten: [
|
||||
["Funkrufname", "Florian Pötzscha 47-1"],
|
||||
["Fahrgestell", "FIAT Ducato MAXI 2.3"],
|
||||
["Baujahr", "August 2002"],
|
||||
["Besatzung", "1/5 (Staffelbesatzung)"]
|
||||
],
|
||||
bereiche: [
|
||||
{
|
||||
titel: "Technische Details",
|
||||
punkte: [
|
||||
"Leistung: 81 kW (110 PS)",
|
||||
"Gesamtgewicht: 3.500 kg (B-Führerschein fähig)",
|
||||
"Maße: L 5,20m | B 2,07m | H 2,39m",
|
||||
"Sondersignalanlage: Hella RTK 6"
|
||||
]
|
||||
},
|
||||
{
|
||||
titel: "Feuerwehrtechnische Beladung",
|
||||
punkte: [
|
||||
"Tragkraftspritze TS 8/8",
|
||||
"4 Pressluftatmer (PA)",
|
||||
"4-teilige Steckleiter",
|
||||
"Stromerzeuger 3,5 kW",
|
||||
"Motorsäge & Zubehör",
|
||||
"Lichtmast (2x 80W LED)",
|
||||
"Sanitätsrucksack",
|
||||
"Absicherungsmaterial"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: "vrw",
|
||||
kategorie: "Fahrzeuge",
|
||||
karte: "technik/technikpage/t_vrw_1.jpg",
|
||||
name: "VRW Quad",
|
||||
titel: "Vorausrüstwagen (VRW)",
|
||||
bilder: [
|
||||
{ src: "technik/VRW-Quad/t_vrw_1.jpg", alt: "VRW Suzuki KingQuad" }
|
||||
],
|
||||
hinweis: "Extrem geländegängig für schnelle Hilfe in unwegsamem Gelände",
|
||||
text: "Einsatztaktik: Das Fahrzeug ermöglicht durch seine kompakten Maße einen schnellen Erstzugriff bei Verkehrsunfällen oder im Waldgelände, noch bevor die Großfahrzeuge eintreffen.",
|
||||
daten: [
|
||||
["Bezeichnung", "VRW (Quad)"],
|
||||
["Funkrufname", "Florian Stadt Wehlen 53-1"],
|
||||
["Fahrgestell", "Suzuki KingQuad"],
|
||||
["Baujahr", "Mai 2006"],
|
||||
["Einsatzgewicht", "470 kg"]
|
||||
],
|
||||
bereiche: [
|
||||
{
|
||||
titel: "Technische Daten",
|
||||
punkte: [
|
||||
"Antrieb: 4x4 Allrad / Differentialsperre",
|
||||
"Sondersignal: Blitzkennleuchte & Martins-Horn",
|
||||
"Zusatzausstattung: Arbeitsscheinwerfer LED",
|
||||
"Maße: L 2,20m | B 1,25m | H 2,00m"
|
||||
]
|
||||
},
|
||||
{
|
||||
titel: "Spezialausrüstung: TH-Rettung",
|
||||
punkte: [
|
||||
"Hydraulik: Lukas SC 350 Kombigerät",
|
||||
"Lukas Kompaktaggregat P 610 OG",
|
||||
"Lukas Rettungszylinder",
|
||||
"Medizin: Defibrillator (AED)",
|
||||
"Sanitätsrucksack & Sauerstoff",
|
||||
"Löschtechnik: 10L MicroCAFS"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: "elw1",
|
||||
kategorie: "Fahrzeuge",
|
||||
karte: "technik/technikpage/t_elw1_1.jpg",
|
||||
name: "ELW 1",
|
||||
titel: "Einsatzleitwagen ELW 1",
|
||||
inArbeit: true,
|
||||
bilder: [],
|
||||
daten: [],
|
||||
bereiche: []
|
||||
},
|
||||
{
|
||||
id: "rtb1",
|
||||
kategorie: "Boote",
|
||||
karte: "technik/technikpage/t_aluboot_rtb1_1.jpg",
|
||||
name: "Aluboot RTB 1",
|
||||
titel: "Feuerwehrboot (RTB 1)",
|
||||
standort: "Pötzscha",
|
||||
bilder: [
|
||||
{ src: "technik/rtb1/t_aluboot_rtb1_1.jpg", alt: "RTB 1 auf der Elbe" },
|
||||
{ src: "technik/rtb1/t_aluboot_rtb1_2.jpg", alt: "RTB 1 Details" }
|
||||
],
|
||||
hinweis: "Speziell optimiert für Elbe-Einsätze und Hochwasserlagen",
|
||||
text: "Das RTB 1 ist ein extrem vielseitiges Arbeitsmittel. Durch die absenkbare Bugklappe können Personen im Wasser ohne Kraftaufwand direkt aufgenommen werden. Zudem dient es bei Hochwasser als wichtiges Transportmittel für Sandsäcke oder zur Evakuierung in engen Gassen.",
|
||||
daten: [
|
||||
["Bezeichnung", "Rettungsboot RTB 1"],
|
||||
["Norm", "DIN 14961"],
|
||||
["Typ", "Barru LGL 400-BKL"],
|
||||
["Baujahr", "März 2014"],
|
||||
["Zuladung", "550 kg (max. 5 Personen)"]
|
||||
],
|
||||
bereiche: [
|
||||
{
|
||||
titel: "Technische Details",
|
||||
punkte: [
|
||||
"Maße: L 4,13m | B 1,80m | T 0,18m",
|
||||
"Motorisierung: Suzuki 25 PS (4-Takt)",
|
||||
"Besonderheit: Absenkbare Bugklappe",
|
||||
"Zubehör: Hochwasserräder für Landtransport"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: "rtb2",
|
||||
kategorie: "Boote",
|
||||
karte: "technik/technikpage/t_rtb2_1.jpg",
|
||||
name: "Rettungsboot RTB 2",
|
||||
titel: "Feuerwehrboot RTB 2",
|
||||
bilder: [
|
||||
{ src: "technik/rtb2/t_rtb2_1.jpg", alt: "RTB 2 Bild 1" },
|
||||
{ src: "technik/rtb2/t_rtb2_2.jpg", alt: "RTB 2 Bild 2" },
|
||||
{ src: "technik/rtb2/t_rtb2_3.jpg", alt: "RTB 2 Bild 3" }
|
||||
],
|
||||
hinweis: "Das schnelle \"Buster\" für Einsätze auf der Elbe",
|
||||
daten: [
|
||||
["Bezeichnung", "Rettungsboot RTB 2"],
|
||||
["Funkrufname", "Florian Stadt Wehlen 79-1"],
|
||||
["Typ", "Fiskas Buster \"L\" Aluminium"],
|
||||
["Zuladung", "590 kg (max. 6 Personen)"]
|
||||
],
|
||||
bereiche: [
|
||||
{
|
||||
titel: "Technische Daten",
|
||||
punkte: [
|
||||
"Maße: L 4,90m | B 1,97m | T 0,29m",
|
||||
"Motorisierung: Suzuki 40 PS (3-Zyl. 4-Takt)",
|
||||
"Speed: max. 33 Knoten (~ 61 km/h)"
|
||||
]
|
||||
},
|
||||
{
|
||||
titel: "Ausstattung & Beladung",
|
||||
punkte: [
|
||||
"Sondersignal: Blitzkennleuchte & Martinshorn auf Gerätebügel",
|
||||
"Beleuchtung: 1x Fest-Suchscheinwerfer, 2x Hand-Suchscheinwerfer",
|
||||
"Navigation: Echolot zur Tiefen- & Hindernismessung",
|
||||
"Rettungsmittel: Rettungsbrett & Notfall-Set nach DIN"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: "schlauchboot",
|
||||
kategorie: "Boote",
|
||||
karte: "technik/technikpage/t_schlauchboot.jpg",
|
||||
name: "RTB 1 Schlauchboot",
|
||||
titel: "Schlauchboot RTB 1",
|
||||
bilder: [
|
||||
{ src: "technik/rtb1schlauchboot/t_schlauchboot.jpg", alt: "Schlauchboot RTB 1" }
|
||||
],
|
||||
hinweis: "Flexibel für die Wasserrettung",
|
||||
text: "Das RTB 1 (Schlauchboot) ist unser \"Flitzer\" für kleine Gewässer oder schwer zugängliche Elbufer. Es ist in Sekundenschnelle einsatzbereit und kann aufgrund des geringen Gewichts von einer kleinen Truppe direkt zum Wasser getragen werden, ohne dass eine Slipstelle benötigt wird.",
|
||||
daten: [
|
||||
["Bezeichnung", "Rettungsschlauchboot RTB 1"],
|
||||
["Standort", "Stadt Wehlen"],
|
||||
["Baujahr", "Mai 2003"],
|
||||
["Gewicht", "33 kg (leicht & mobil)"]
|
||||
],
|
||||
bereiche: [
|
||||
{
|
||||
titel: "Leistungsdaten",
|
||||
punkte: [
|
||||
"Maße: L 3,00m | B 1,20m",
|
||||
"Sicherheit: 4 separate Luftkammern",
|
||||
"Zuladung: 570 kg (max. 3 Personen)"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: "sta",
|
||||
kategorie: "Anhänger",
|
||||
karte: "technik/technikpage/t_sta_1.jpg",
|
||||
name: "STA Anhänger",
|
||||
titel: "Schlauchtransportanhänger (STA)",
|
||||
bilder: [
|
||||
{ src: "technik/sta/t_sta_1.jpg", alt: "STA Bild 1" },
|
||||
{ src: "technik/sta/t_sta_2.jpg", alt: "STA Bild 2" }
|
||||
],
|
||||
hinweis: "Einsatzvorteil: Verlegen von ca. 760m B-Leitung direkt während der Fahrt",
|
||||
daten: [
|
||||
["Bezeichnung", "Schlauchtransportanhänger (STA)"],
|
||||
["Standort", "Stadt Wehlen"],
|
||||
["Typ", "Humbauer HA75/100"],
|
||||
["Baujahr", "Dezember 2004"],
|
||||
["Gesamtgewicht", "750 kg"]
|
||||
],
|
||||
bereiche: [
|
||||
{
|
||||
titel: "Technische Details",
|
||||
punkte: [
|
||||
"Maße: L 3,56m | B 1,79m | H 2,35m",
|
||||
"Ausstattung: Hochplane, Heck-Arbeitsbeleuchtung",
|
||||
"Besonderheit: Schnellverlege-Vorrichtung"
|
||||
]
|
||||
},
|
||||
{
|
||||
titel: "Feuerwehrtechnische Beladung",
|
||||
punkte: [
|
||||
"38 B-Schläuche (insgesamt 760m), in Buchten gekoppelt",
|
||||
"2 Tragekörbe mit je 3 x 20m C-Schläuchen",
|
||||
"Armaturen: Standrohr, Hydrantenschlüssel, 2 C-Strahlrohre, Verteiler, Schlauchbrücken und Kupplungsschlüssel"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: "tsa",
|
||||
kategorie: "Anhänger",
|
||||
karte: "technik/technikpage/t_tsa_1.jpg",
|
||||
name: "TSA Anhänger",
|
||||
titel: "Tragkraftspritzenanhänger (TSA)",
|
||||
bilder: [
|
||||
{ src: "technik/TSA-Anhaenger/t_tsa_1.jpg", alt: "TSA Bild 1" },
|
||||
{ src: "technik/TSA-Anhaenger/t_tsa_2.jpg", alt: "TSA Bild 2" }
|
||||
],
|
||||
hinweis: "Die mobile Pumpeneinheit für die Wasserversorgung",
|
||||
text: "Der TSA bildet eine eigenständige taktische Einheit für eine Löschgruppe (1/8). Er führt alles mit, was für einen klassischen Löschangriff benötigt wird. Herzstück ist die Tragkraftspritze Magirus (4-Takt-Motor) – zuverlässige Wasserförderung auch bei langen Einsatzstellen.",
|
||||
daten: [
|
||||
["Bezeichnung", "Tragkraftspritzenanhänger (TSA)"],
|
||||
["Standort", "Stadt Wehlen"],
|
||||
["Typ", "Ziegler TSA SDAH"],
|
||||
["Baujahr", "Februar 2004"]
|
||||
],
|
||||
bereiche: [
|
||||
{
|
||||
titel: "Technische Daten",
|
||||
punkte: [
|
||||
"Maße: L 4,00m | B 1,80m | H 2,00m",
|
||||
"Gesamtgewicht: 1.200 kg",
|
||||
"Details: Verstellbare Zugdeichsel, Heckstützen"
|
||||
]
|
||||
},
|
||||
{
|
||||
titel: "Feuerwehrtechnische Beladung",
|
||||
punkte: [
|
||||
"Tragkraftspritze Magirus (4-Takt-Motor)",
|
||||
"4 Saugschläuche (A), Saugkorb",
|
||||
"B- und C-Schläuche nach DIN",
|
||||
"Armaturen: Strahlrohre, Verteiler, Standrohr"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: "transportanhaenger",
|
||||
kategorie: "Anhänger",
|
||||
karte: "technik/technikpage/t_transportanhaenger.jpg",
|
||||
name: "Transportanhänger",
|
||||
titel: "Transportanhänger",
|
||||
bilder: [
|
||||
{ src: "technik/Transporthaenger/t_transportanhaenger.jpg", alt: "Transportanhänger FFw Wehlen" }
|
||||
],
|
||||
hinweis: "Vielseitiges Logistikfahrzeug für Ausbildung und Einsatz",
|
||||
text: "Dieser Anhänger ist unser flexibler Allrounder für Logistikaufgaben. Ob Ausbildung oder Einsatz – der Anhänger passt sich an.",
|
||||
daten: [
|
||||
["Bezeichnung", "Transportanhänger"],
|
||||
["Standort", "Stadt Wehlen"],
|
||||
["Typ", "Humbauer H12"],
|
||||
["Baujahr", "April 2004"],
|
||||
["Gesamtgewicht", "1.200 kg"]
|
||||
],
|
||||
bereiche: [
|
||||
{
|
||||
titel: "Technische Daten",
|
||||
punkte: [
|
||||
"Maße: L 3,75m | B 1,77m | H 2,35m",
|
||||
"Sicherheit: Feststellbremse",
|
||||
"Aufbau: Hochplane, Stützrad & Heckstützen"
|
||||
]
|
||||
},
|
||||
{
|
||||
titel: "Nutzung & Beladung",
|
||||
punkte: [
|
||||
"Jugendfeuerwehr: Transport der Übungsausstattung",
|
||||
"Löschwasser: Mitführung eines TSA-Einschubs mit Tragkraftspritze TS 3",
|
||||
"Logistik: Transport von Sandsäcken, Ölbindemittel oder verschmutztem Material"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: "hydrantenwagen",
|
||||
kategorie: "Tradition",
|
||||
karte: "technik/technikpage/t_hydrantenwagen_1.jpg",
|
||||
name: "Hydrantenwagen (1905)",
|
||||
titel: "Hydrantenwagen Modell H.I.",
|
||||
bilder: [
|
||||
{ src: "technik/Hydrantenwagen/t_hydrantenwagen_1.jpg", alt: "Hydrantenwagen Bild 1" },
|
||||
{ src: "technik/Hydrantenwagen/t_hydrantenwagen_2.jpg", alt: "Hydrantenwagen Bild 2" }
|
||||
],
|
||||
hinweis: "Historisches Handzug-Gerät aus dem Jahr 1905",
|
||||
daten: [
|
||||
["Bezeichnung", "Hydrantenwagen Modell H.I."],
|
||||
["Stationierung", "Stadt Wehlen"],
|
||||
["Hersteller", "C.A. Schöne Fabrik Dresden"],
|
||||
["Baujahr", "1905"],
|
||||
["Typ", "Historisches Handzug-Gerät"]
|
||||
],
|
||||
bereiche: [
|
||||
{
|
||||
titel: "Feuerwehrtechnische Beladung",
|
||||
punkte: [
|
||||
"Kupferner Hydrantenaufsatz (2 Auslässe)",
|
||||
"Sächsisches Normalgewinde, Spindelventile",
|
||||
"Kupferne Normalstrahlrohre (in Leine geflochten)",
|
||||
"255 m Flachsschlauch (17 Satz à 15 m)",
|
||||
"17 Paar Patent-Honigkupplungen",
|
||||
"4 Übersetzungsstücke (Sächs. Normalgewinde)"
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: "lf1",
|
||||
kategorie: "Tradition",
|
||||
karte: "technik/technikpage/t_lf1_1.jpg",
|
||||
name: "Postfahrrad LF 1",
|
||||
titel: "Löschfahrzeug LF 1",
|
||||
bilder: [
|
||||
{ src: "technik/lf1/t_lf1_2.jpg", alt: "LF 1 Fahrrad" }
|
||||
],
|
||||
hinweis: "Traditionsfahrzeug der Feuerwehr Stadt Wehlen",
|
||||
text: "Das LF 1 ist unser ganzer Stolz bei Festumzügen. Das ehemalige Postrad wurde in liebevoller Kleinarbeit zum \"kleinsten Löschfahrzeug der Welt\" umgebaut. Es dient primär der Traditionspflege und der Spendensammlung bei Veranstaltungen.",
|
||||
daten: [
|
||||
["Bezeichnung", "Löschfahrzeug LF 1"],
|
||||
["Stationierung", "Stadt Wehlen"],
|
||||
["Typ", "Umgebautes Postfahrrad"],
|
||||
["Baujahr", "Mai 2003"],
|
||||
["Fahrzeugdaten", "26er Herrenfahrrad"]
|
||||
],
|
||||
bereiche: [
|
||||
{
|
||||
titel: "Feuerwehrtechnische Beladung",
|
||||
punkte: [
|
||||
"Sirene mit Handkurbel (akustisches Signal)",
|
||||
"Blitzleuchte (optisches Signal)",
|
||||
"Kübelspritze (als Spendenkübel umfunktioniert)",
|
||||
"C-Schlauch + Strahlrohr (Schnellangriff-Attrappe)"
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
138
data/geschichte.js
Normal file
138
data/geschichte.js
Normal file
@ -0,0 +1,138 @@
|
||||
/* ======================================================
|
||||
geschichte.js – ZENTRALE DATENQUELLE für die Geschichte
|
||||
------------------------------------------------------
|
||||
Wird von BEIDEN Design-Varianten genutzt.
|
||||
Rot rendert daraus eine Zeitleiste mit Tabs,
|
||||
Grau ein Accordion – Inhalt bleibt identisch.
|
||||
|
||||
zeitraum – Beschriftung (z.B. "1901 – 1945")
|
||||
eintraege – Blöcke [{titel?, html}] pro Epoche
|
||||
bild – true: Button für den Zeitungsartikel 1921
|
||||
====================================================== */
|
||||
|
||||
window.FFW_GESCHICHTE_BILD = {
|
||||
src: "geschichte/ffw_wehlen_1921.jpeg",
|
||||
titel: "Zeitungsartikel von 1921",
|
||||
button: "Zeitungsartikel von 1921 ansehen"
|
||||
};
|
||||
|
||||
window.FFW_GESCHICHTE = [
|
||||
{
|
||||
zeitraum: "1865 – 1900",
|
||||
eintraege: [
|
||||
{
|
||||
titel: "Die Anfänge der Feuerwehr in Stadt Wehlen",
|
||||
html: `
|
||||
<p>Die Feuerwehr unseres Wehlstädtchens wird in den Berichten, die heute noch im Archiv lagern, um <strong>1865</strong> zum ersten Mal erwähnt. Damals war es eine <strong>Pflichtfeuerwehr</strong>, d. h. alle Männer von <strong>18 bis 50 Jahren</strong> wurden erfasst und nach einem strengen Gesetz verpflichtet.</p>
|
||||
<p>Im Jahr <strong>1899</strong> versuchte man erstmals, die Männer der Pflichtfeuerwehr zu überzeugen, eine <strong>Freiwillige Feuerwehr</strong> aufzubauen. Der Vorschlag kam von der <strong>Feuerwehr Pirna</strong>. Doch der damalige Stadtgemeinderat von Stadt Wehlen lehnte ab:</p>
|
||||
<blockquote>„... es wäre nicht nötig und außerdem zu kostspielig.“</blockquote>`
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
zeitraum: "1901 – 1945",
|
||||
eintraege: [
|
||||
{
|
||||
titel: "Die Gründung der Freiwilligen Feuerwehr Stadt Wehlen",
|
||||
html: `
|
||||
<p>Am <strong>27. Januar 1901</strong> wurde der Wehlener Gemeinderat durch Herrn Branddirektor Jäger angeschrieben und darauf hingewiesen, dass Stadt Wehlen im Bezirk die letzte Stadt sei, die keine freiwillige Feuerwehr besitze. Er bat um Unterstützung und um die Gründung einer Freiwilligen Feuerwehr.</p>
|
||||
<p>Am <strong>8. Februar 1901</strong> wurde die noch bestehende Pflichtfeuerwehr in die <strong>"Elbterrasse"</strong> gerufen und zur Generalversammlung geladen. Bei unentschuldigtem Fehlen wurde Strafe angedroht. Der Abend wurde durch Herrn Branddirektor Jäger genutzt, um über die Vorteile einer Freiwilligen Feuerwehr zu sprechen. Zu diesem Vortrag waren alle Stadträte und Stadtverordneten anwesend, und Herr Bürgermeister Schaale unterstrich die Worte von Herrn Jäger und setzte sich stark für die Gründung einer Freiwilligen Feuerwehr ein.</p>
|
||||
<p>Von den 44 anwesenden Herren der Pflichtfeuerwehr erklärten sich 30 bereit, in die Freiwillige Feuerwehr einzutreten. So meldete der Bürgermeister die Mitgliedschaft zum Bezirksverband Sächsischer Feuerwehren an.</p>
|
||||
<p>Im Februar 1901 konnte Bürgermeister Schaale den Gemeinden <strong>Hohnstein, Gottleuba, Berggießhübel, Neundorf, Rabenau</strong> und <strong>Siebenlehn</strong> vom Entschluss zur Gründung einer Freiwilligen Feuerwehr Mitteilung machen. Er rief die Gemeinden und Städte zur Unterstützung auf.</p>`
|
||||
},
|
||||
{
|
||||
titel: "Die offizielle Gründung",
|
||||
html: `
|
||||
<p>Am <strong>9. März 1901</strong> fand im Hotel <strong>"Elbterrasse"</strong> die Konstituierung der Freiwilligen Feuerwehr Stadt Wehlen statt. Am <strong>12. März 1901</strong> wurde die Freiwillige Feuerwehr Stadt Wehlen offiziell gegründet.</p>
|
||||
<p>Das Grundgesetz der Feuerwehr wurde bekannt gegeben, welches in 14 Paragraphen die Pflichten und Rechte des Feuerwehrmannes beinhaltete. So hieß es in §1:</p>
|
||||
<blockquote>"Zweck der Freiwilligen Feuerwehr ist, bei ausbrechenden Bränden im Gemeindebezirk in geordneter Weise rettend und schützend Beistand zu leisten. Bei entstehenden Bränden in den benachbarten Orten und zwar bis 2 Stunden entfernt, leistet die Feuerwehr mit einem Teil der Mannschaft gleichfalls Hilfe."</blockquote>`
|
||||
},
|
||||
{
|
||||
titel: "Ausrüstung der Feuerwehr",
|
||||
html: `
|
||||
<ul>
|
||||
<li>1 vierrädrige Abprotzspritze</li>
|
||||
<li>430 Meter Hanf-Schlauch</li>
|
||||
<li>18 Schöpeimer</li>
|
||||
<li>1 Steigleiter (8,80 m)</li>
|
||||
<li>1 Leiterwagen</li>
|
||||
<li>3 Hakenleitern</li>
|
||||
<li>2 Anlegeleitern</li>
|
||||
<li>5 Feuerhaken</li>
|
||||
</ul>`
|
||||
},
|
||||
{
|
||||
titel: "Technische Entwicklung",
|
||||
html: `
|
||||
<p>In den Jahren <strong>1903 bis 1904</strong> ließ Herr Ingenieur Mennicke als Geschenk für Stadt Wehlen eine zentrale Wasserleitung errichten. Dies war ein großer Vorteil für die Feuerwehr, denn nun konnten alle Punkte der Stadt mit Löschwasser aus dem zentralen Rohrnetz über <strong>31 Unterflurhydranten</strong> und <strong>1 Oberflurhydrant</strong> erreicht werden.</p>
|
||||
<p>Am <strong>23. Oktober 1921</strong> fand in Stadt Wehlen der <strong>20. Bezirkstag der Feuerwehren</strong> statt. Um 10 Uhr trafen 57 Feuerwehren ein, und in der "Elbterrasse" wurde eine Festsitzung abgehalten. Anschließend wurde eine Großübung am Hotel <strong>"Sächsische Schweiz"</strong> vor über 500 Gästen und Einwohnern durchgeführt. Am Nachmittag folgte ein großer Umzug mit <strong>vier Blaskapellen</strong> und <strong>zwei Spielmannszügen</strong>.</p>`
|
||||
},
|
||||
{
|
||||
titel: "Weitere Meilensteine",
|
||||
html: `
|
||||
<p>Am <strong>24. Mai 1925</strong> wurde das Feuerwehrdepot auf der Pirnaer Straße festlich eingeweiht. Hier stand die Feuerwehr unter der Leitung von Dachdeckermeister Otto Israel.</p>
|
||||
<p>1934 begann der Kampf um eine Motorspritze. Am <strong>12. Februar 1935</strong> wurde schließlich angeordnet, dass Stadt Wehlen eine Motorspritze beschaffen muss. Im gleichen Jahr erhielt die Feuerwehr eine Motorspritze sowie einen Mannschaftswagen vom Typ <strong>Mercedes</strong>.</p>`
|
||||
},
|
||||
{
|
||||
titel: "Die Feuerwehr im Zweiten Weltkrieg",
|
||||
html: `
|
||||
<p>Während des <strong>Zweiten Weltkriegs (1939–1945)</strong> übernahm die Wehr gemeinsam mit einer verpflichteten Frauengruppe den Schutz der Stadt. Unter dem Kommando von Hauptmann Fröde wurde ein straffer Dienst verlangt. Jede Woche wurden ein Dienstappell mit Überprüfung der Uniformen und Gerätschaften sowie zweistündige Übungen durchgeführt.</p>`,
|
||||
bild: true
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
zeitraum: "1946 – 1989",
|
||||
eintraege: [
|
||||
{
|
||||
titel: "Wiederaufbau der Freiwilligen Feuerwehr nach 1949",
|
||||
html: `
|
||||
<p>Große Anstrengungen unternahmen die Kameraden nach <strong>1949</strong>. Kamerad Weber war damals der Jüngste, der die Wehr als Leiter übernahm. Wir wurden zum Beispiel zur Abholzung von Wäldern aufgerufen, damit die Bürger Feuerholz bekamen. Zur Erneuerung des Sportplatzes leisteten die Kameraden freiwillige Stunden.</p>
|
||||
<p>So wurden zur Gründung eines <strong>Fanfarenzuges</strong> von Bürgern der Stadt Gelder gespendet. Nach einem Jahr konnten wir das erste Mal öffentlich auftreten und marschierten bei Veranstaltungen wie dem 1. Mai an der Spitze mit.</p>`
|
||||
},
|
||||
{
|
||||
titel: "Der LKW und die Gründung der Löschgruppe Stadt Wehlen II",
|
||||
html: `
|
||||
<p>1956 kaufte der Rat der Stadt einen LKW, den die Kameraden als Zugkraftwagen ausbauten. Am <strong>1. April 1956</strong> wurde in Stadt Wehlen II (Pötzscha), unter Führung des Kameraden Böhme, eine Löschgruppe gegründet, da die Brände an der Bahnlinie zunahmen.</p>`
|
||||
},
|
||||
{
|
||||
titel: "Unwetterkatastrophen und die \"Reinigungswasser-Suppe\"",
|
||||
html: `
|
||||
<p>1957 wurden die Kameraden zur Unwetterkatastrophe nach Pirna alarmiert. Dort pumpten wir Wasser aus Kellern und retteten Margarinewürfel. Da wir hungrig waren, schöpften wir aus unbewachten Feldküchen vermeintliche Suppe. Am Morgen stellte sich heraus: Es war <strong>heißes Reinigungswasser</strong>! Eine Geschichte, die heute noch erzählt wird.</p>`
|
||||
},
|
||||
{
|
||||
titel: "Der Sparkassenbrand 1963",
|
||||
html: `
|
||||
<p>Am <strong>24. Dezember 1963</strong> brannte die Sparkasse am Markt. Bei <strong>-20°C</strong> und Orkanböen waren die Kameraden auf der Leiter teilweise angefroren. Trotzdem gelang es, die Kirche und die Nachbarhäuser zu retten. 1967 erhielten wir dafür unser erstes typenmäßiges Fahrzeug – das Kleinlöschfahrzeug <strong>B 1000</strong>.</p>`
|
||||
},
|
||||
{
|
||||
titel: "Entwicklungen der 70er und 80er",
|
||||
html: `
|
||||
<p>1971 bekamen wir das Löschfahrzeug <strong>LO 1800</strong>. In 20 Abenden wurde dafür eine Fahrzeughalle errichtet. <strong>1980</strong> wurde der erste Bauabschnitt des Gerätehauses an der Kirchstraße abgeschlossen.</p>`
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
zeitraum: "1990 – 1994",
|
||||
eintraege: [
|
||||
{
|
||||
titel: "Nach der Wiedervereinigung 1990",
|
||||
html: `
|
||||
<p>Wir konnten preisgünstig Technik erwerben, darunter ein B 1000 für Pötzscha. 1991 feierte die Feuerwehr ihr <strong>90-jähriges Jubiläum</strong> mit einem großen Feuerwehrball im Cafe Richter.</p>
|
||||
<p>Vom <strong>22. – 23. November 1991</strong> erhielten wir von den Kameraden aus Deuschelried/Wangen ein Löschfahrzeug vom Typ <strong>Opel</strong> als Geschenk. Die Freundschaft wurde mit einer Dampferfahrt gefestigt. 1993/94 wurde das Gerätehaus in Pötzscha vergrößert.</p>`
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
zeitraum: "1995 – heute",
|
||||
eintraege: [
|
||||
{
|
||||
titel: "Hochwasser 2002",
|
||||
html: `
|
||||
<p>Am <strong>13.08.2002</strong> wurden wir nach Pirna gerufen, um Bürger mit dem Schlauchboot zu evakuieren. Zurück in Wehlen begannen die Vorbereitungen gegen das Elbehochwasser. Bürger wie Eckhard, Mike Hofmann, Ronny Roll und Herr Pfeiler unterstützten mit ihren Booten.</p>
|
||||
<p>Am 15.08. kam die Schocknachricht: Es sollten noch 2–3 Meter dazu kommen. Die Leitstelle wurde in die Grundschule verlegt. Etwa 70 % der Bürger waren ohne Gas und Strom. In der Nacht zum 17.08. erreichte die Elbe den Höchststand von <strong>12,04 m</strong>.</p>
|
||||
<p>Hilfe kam von den Feuerwehren aus Trochtelfingen, Wangen und Forst sowie später durch 12 Fahrzeuge aus dem Wartburgkreis. Die Kameraden leisteten tägliche Dienste von 16–18 Stunden, um die Stadt vom Schlamm zu befreien.</p>`
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
53
data/mitglieder.js
Normal file
53
data/mitglieder.js
Normal file
@ -0,0 +1,53 @@
|
||||
/* ======================================================
|
||||
mitglieder.js – ZENTRALE DATENQUELLE für das Organigramm
|
||||
------------------------------------------------------
|
||||
Wird von BEIDEN Design-Varianten genutzt.
|
||||
====================================================== */
|
||||
|
||||
window.FFW_MITGLIEDER = {
|
||||
fuehrung: [
|
||||
{ rolle: "Wehrleiter", namen: ["Herzog, André"] },
|
||||
{ rolle: "Stellvertreter", namen: ["Flössel, Markus", "Drechsel, Manuel"] }
|
||||
],
|
||||
stab: [
|
||||
{ rolle: "Schriftführer", namen: ["Flössel, Markus"] },
|
||||
{ rolle: "Kassenwart", namen: ["Marder, Uwe"] }
|
||||
],
|
||||
fachwarte: [
|
||||
{ rolle: "Atemschutz-Gerätewart", namen: ["Reißig, Kersten"] },
|
||||
{ rolle: "Gerätewart", namen: ["Blümel, Dirk"] },
|
||||
{ rolle: "Jugendwart", namen: ["Hübsch, Sebastian"] },
|
||||
{ rolle: "Altersabteilung", namen: ["Dittmann, Frank"] }
|
||||
],
|
||||
gruppen: [
|
||||
{
|
||||
titel: "Atemschutzträger",
|
||||
namen: [
|
||||
"Blümel, Dirk", "Flössel, Markus", "Gottlöber, Heiko", "Herzog, Nico",
|
||||
"Hübsch, Alexander", "Hübsch, Sebastian", "John, Marko", "Kurze, Steffen"
|
||||
]
|
||||
},
|
||||
{
|
||||
titel: "Maschinisten",
|
||||
namen: [
|
||||
"Blümel, Dirk", "Drechsel, Manuel", "Flössel, Markus", "Herzog, André",
|
||||
"Hübsch, Alexander", "Hübsch, Sebastian", "John, Marko", "Marder, Uwe"
|
||||
]
|
||||
},
|
||||
{
|
||||
titel: "Führung",
|
||||
abschnitte: [
|
||||
{ label: "Zugführer", namen: ["Kurze, Steffen"] },
|
||||
{ label: "Verbandsführer", namen: ["Mathe, Thomas"] },
|
||||
{ label: "Gruppenführer", namen: ["Blümel, Dirk", "Drechsel, Manuel", "Flössel, Markus", "Herzog, André"] }
|
||||
]
|
||||
},
|
||||
{
|
||||
titel: "Mannschaft",
|
||||
abschnitte: [
|
||||
{ label: "Truppführer", namen: ["Gottlöber, Heiko", "Hübsch, Alexander", "Hübsch, Sebastian", "John, Marko", "Marder, Uwe"] },
|
||||
{ label: "Truppmann", namen: ["Caspari, Patrick", "Herzog, Nico", "Marder, Lukas", "Mathe, Albert", "Pohl, Michael", "Riedel, Pascal"] }
|
||||
]
|
||||
}
|
||||
]
|
||||
};
|
||||
66
dienstplan.html
Normal file
66
dienstplan.html
Normal file
@ -0,0 +1,66 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Dienstplan & Termine | Feuerwehr Stadt Wehlen</title>
|
||||
<meta name="description" content="Dienstplan, Übungen und Veranstaltungen der Feuerwehr Stadt Wehlen." />
|
||||
|
||||
<script>window.FFW_BASE = "";</script>
|
||||
|
||||
<link
|
||||
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
|
||||
rel="stylesheet"
|
||||
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
<link rel="stylesheet" href="assets/style.css" />
|
||||
<link rel="icon" type="image/gif" href="bilder/ffw_transp_72.gif" />
|
||||
</head>
|
||||
|
||||
<body data-page="dienstplan">
|
||||
|
||||
<div id="site-header"></div>
|
||||
|
||||
<main>
|
||||
<header class="gl-seitenkopf">
|
||||
<div class="container">
|
||||
<h1>Dienstplan & Termine</h1>
|
||||
<p class="untertitel">Übungen, Dienste und Veranstaltungen der Feuerwehr Stadt Wehlen</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="container py-5">
|
||||
<div class="row g-4 mb-5">
|
||||
<div class="col-md-6">
|
||||
<div class="gl-card">
|
||||
<h3>Nächster Dienst</h3>
|
||||
<div id="nextDienst"><p class="termin-beschr">Wird geladen …</p></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="gl-card">
|
||||
<h3>Nächste Veranstaltung</h3>
|
||||
<div id="nextEvent"><p class="termin-beschr">Wird geladen …</p></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<h2 class="abschnitt-titel">Alle Termine</h2>
|
||||
<p class="abschnitt-sub">Der nächste Termin ist rot markiert.</p>
|
||||
<div class="termin-tabelle-wrap">
|
||||
<div id="dienstplan-liste"><p class="termin-beschr p-3">Wird geladen …</p></div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<div id="site-footer"></div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
||||
crossorigin="anonymous"></script>
|
||||
<script src="data/dienste.js"></script>
|
||||
<script src="assets/components.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,24 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Nächster Feuerwehr-Dienst</title>
|
||||
<style>
|
||||
.dienst {
|
||||
border: 2px solid #c00;
|
||||
padding: 1rem;
|
||||
max-width: 400px;
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<h2>Nächster Dienst</h2>
|
||||
<div id="nextDienst" class="dienst">
|
||||
Wird geladen…
|
||||
</div>
|
||||
|
||||
<script src="dienstplan.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,46 +0,0 @@
|
||||
const csvPfad = "dienstplan/dienstplan.csv";
|
||||
|
||||
fetch(csvPfad)
|
||||
.then(res => res.text())
|
||||
.then(text => {
|
||||
const today = new Date().setHours(0, 0, 0, 0);
|
||||
|
||||
const termine = text.trim().split(/\r?\n/).slice(1).map(line => {
|
||||
const [d, tag, zeit, ort, art, beschr] = line.split(line.includes(";") ? ";" : ",");
|
||||
const [y, m, day] = d.trim().split("-");
|
||||
return {
|
||||
datum: new Date(y, m - 1, day),
|
||||
tag: tag.trim(),
|
||||
zeit: zeit.trim(),
|
||||
ort: ort.trim(),
|
||||
art: art.trim(),
|
||||
beschr: beschr.trim()
|
||||
};
|
||||
})
|
||||
.filter(t => t.datum >= today)
|
||||
.sort((a, b) => a.datum - b.datum);
|
||||
|
||||
const render = (id, filterFn) => {
|
||||
const el = document.getElementById(id);
|
||||
if (!el) return;
|
||||
const t = termine.find(filterFn);
|
||||
|
||||
if (t) {
|
||||
// Formatiert das Datum zu "23.03.2026"
|
||||
const dFormat = t.datum.toLocaleDateString("de-DE");
|
||||
|
||||
el.innerHTML = `
|
||||
<p class="mb-3"><strong>${dFormat} | ${t.zeit} Uhr</strong></p>
|
||||
<p class="mb-1"><strong>${t.art}</strong></p>
|
||||
<p class="small text-secondary mb-0">${t.beschr} (${t.ort})</p>
|
||||
`;
|
||||
} else {
|
||||
el.innerHTML = "<p class='small text-muted'>Keine weiteren Termine geplant</p>";
|
||||
}
|
||||
};
|
||||
|
||||
render("nextDienst", t => !/fest|feier/i.test(t.art));
|
||||
render("nextEvent", t => /fest|feier/i.test(t.art));
|
||||
|
||||
})
|
||||
.catch(err => console.error("Fehler beim Laden:", err));
|
||||
47
fahrzeug.html
Normal file
47
fahrzeug.html
Normal file
@ -0,0 +1,47 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Fahrzeug | Feuerwehr Stadt Wehlen</title>
|
||||
<meta name="description" content="Fahrzeugdetails der Feuerwehr Stadt Wehlen." />
|
||||
|
||||
<script>window.FFW_BASE = "";</script>
|
||||
|
||||
<link
|
||||
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
|
||||
rel="stylesheet"
|
||||
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
<link rel="stylesheet" href="assets/style.css" />
|
||||
<link rel="icon" type="image/gif" href="bilder/ffw_transp_72.gif" />
|
||||
</head>
|
||||
|
||||
<body data-page="technik">
|
||||
|
||||
<div id="site-header"></div>
|
||||
|
||||
<main>
|
||||
<header class="gl-seitenkopf">
|
||||
<div class="container">
|
||||
<h1>Technik im Detail</h1>
|
||||
<p class="untertitel"><a href="technik.html">← Zurück zur Technik-Übersicht</a></p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="container py-5">
|
||||
<div id="fahrzeug-detail"></div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<div id="site-footer"></div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
||||
crossorigin="anonymous"></script>
|
||||
<script src="data/fahrzeuge.js"></script>
|
||||
<script src="assets/components.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
47
geschichte.html
Normal file
47
geschichte.html
Normal file
@ -0,0 +1,47 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Geschichte | Feuerwehr Stadt Wehlen</title>
|
||||
<meta name="description" content="Die Geschichte der Freiwilligen Feuerwehr Stadt Wehlen seit 1865." />
|
||||
|
||||
<script>window.FFW_BASE = "";</script>
|
||||
|
||||
<link
|
||||
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
|
||||
rel="stylesheet"
|
||||
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
<link rel="stylesheet" href="assets/style.css" />
|
||||
<link rel="icon" type="image/gif" href="bilder/ffw_transp_72.gif" />
|
||||
</head>
|
||||
|
||||
<body data-page="geschichte">
|
||||
|
||||
<div id="site-header"></div>
|
||||
|
||||
<main>
|
||||
<header class="gl-seitenkopf">
|
||||
<div class="container">
|
||||
<h1>Unsere Geschichte</h1>
|
||||
<p class="untertitel">Von der Pflichtfeuerwehr 1865 bis zur modernen Freiwilligen Feuerwehr</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="container py-5" style="max-width: 900px;">
|
||||
<div id="geschichte-inhalt"></div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<div id="site-footer"></div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
||||
crossorigin="anonymous"></script>
|
||||
<script src="data/geschichte.js"></script>
|
||||
<script src="assets/components.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,333 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Geschichte - Feuerwehr Stadt Wehlen</title>
|
||||
|
||||
<link
|
||||
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
|
||||
rel="stylesheet"
|
||||
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
|
||||
<link rel="stylesheet" href="../css/nav.css" />
|
||||
<link rel="stylesheet" href="../css/footer.css" />
|
||||
|
||||
<style>
|
||||
/* Exaktes Startseiten-Styling für Nav & Footer */
|
||||
.navbar-custom {
|
||||
background-color: #b30000 !important;
|
||||
background-image: url('../bilder/logo2.jpeg') !important;
|
||||
background-size: 7em !important;
|
||||
background-repeat: repeat !important;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.navbar-custom .navbar-brand,
|
||||
.navbar-custom .nav-link {
|
||||
color: #ffffff !important;
|
||||
text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.navbar-custom .dropdown-menu {
|
||||
background-color: #900000 !important;
|
||||
background-image: url('../bilder/logo2.jpeg') !important;
|
||||
background-size: 9em !important;
|
||||
}
|
||||
|
||||
.dropdown-item { color: white !important; }
|
||||
.dropdown-item:hover { background-color: rgba(255,255,255,0.2) !important; }
|
||||
|
||||
/* Page-Header mit Logo-Wasserzeichen */
|
||||
.page-header {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 70px 0;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.header-bg-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
height: 140%;
|
||||
opacity: 0.08;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: #900000;
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Accordion & Content Styling */
|
||||
.history-container {
|
||||
max-width: 950px;
|
||||
margin: 40px auto;
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
.accordion-item {
|
||||
border-left: 6px solid #b30000 !important;
|
||||
margin-bottom: 15px;
|
||||
border-radius: 0 !important;
|
||||
box-shadow: 0 2px 5px rgba(0,0,0,0.05);
|
||||
}
|
||||
|
||||
.accordion-button {
|
||||
font-weight: 700;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.accordion-button:not(.collapsed) {
|
||||
background-color: #fdfdfd !important;
|
||||
color: #b30000 !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.accordion-body {
|
||||
line-height: 1.8;
|
||||
text-align: justify;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.accordion-body h2, .accordion-body h3 {
|
||||
color: #900000;
|
||||
font-weight: bold;
|
||||
margin-top: 20px;
|
||||
border-bottom: 1px solid #eee;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
font-style: italic;
|
||||
border-left: 4px solid #b30000;
|
||||
padding: 10px 20px;
|
||||
margin: 25px 0;
|
||||
background: #f9f9f9;
|
||||
}
|
||||
|
||||
.btn-custom-gray {
|
||||
background-color: #616161;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 10px 20px;
|
||||
border-radius: 4px;
|
||||
transition: 0.3s;
|
||||
}
|
||||
|
||||
.btn-custom-gray:hover {
|
||||
background-color: #b30000;
|
||||
color: white;
|
||||
}
|
||||
|
||||
ul li { margin-bottom: 5px; }
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-custom shadow-sm">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="../index.html">
|
||||
<img src="../bilder/ffw_transp_72.gif" alt="Logo" style="height: 3em; width: auto; margin-right: 0.5rem;">
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto">
|
||||
<li class="nav-item"><a class="nav-link" href="#">Aktuelles</a></li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown">Über uns</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a class="dropdown-item" href="Geschichte.html">Geschichte</a></li>
|
||||
<li><a class="dropdown-item" href="../technik/technik.html">Technik</a></li>
|
||||
<li><hr class="dropdown-divider"></li>
|
||||
<li><a class="dropdown-item" href="../mitglieder/Organigramm.html">Organigramm</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class="nav-link" href="#">Veranstaltungen</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="#">Kontakt / Impressum</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="page-header">
|
||||
<img src="../bilder/ffw_transp_72.gif" class="header-bg-icon" alt="">
|
||||
<h1>Unsere Geschichte</h1>
|
||||
</div>
|
||||
|
||||
<div class="history-container">
|
||||
<div class="accordion accordion-flush" id="fireHistoryAccordion">
|
||||
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="headingOne">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne">
|
||||
1865 - 1900
|
||||
</button>
|
||||
</h2>
|
||||
<div id="collapseOne" class="accordion-collapse collapse" data-bs-parent="#fireHistoryAccordion">
|
||||
<div class="accordion-body">
|
||||
<h2>Die Anfänge der Feuerwehr in Stadt Wehlen</h2>
|
||||
<p>Die Feuerwehr unseres Wehlstädtchens wird in den Berichten, die heute noch im Archiv lagern, um <strong>1865</strong> zum ersten Mal erwähnt. Damals war es eine <strong>Pflichtfeuerwehr</strong>, d. h. alle Männer von <strong>18 bis 50 Jahren</strong> wurden erfasst und nach einem strengen Gesetz verpflichtet.</p>
|
||||
<p>Im Jahr <strong>1899</strong> versuchte man erstmals, die Männer der Pflichtfeuerwehr zu überzeugen, eine <strong>Freiwillige Feuerwehr</strong> aufzubauen. Der Vorschlag kam von der <strong>Feuerwehr Pirna</strong>. Doch der damalige Stadtgemeinderat von Stadt Wehlen lehnte ab:</p>
|
||||
<blockquote>„... es wäre nicht nötig und außerdem zu kostspielig.“</blockquote>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="headingTwo">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo">
|
||||
1901 - 1945
|
||||
</button>
|
||||
</h2>
|
||||
<div id="collapseTwo" class="accordion-collapse collapse" data-bs-parent="#fireHistoryAccordion">
|
||||
<div class="accordion-body">
|
||||
<h2>Die Gründung der Freiwilligen Feuerwehr Stadt Wehlen</h2>
|
||||
<p>Am <strong>27. Januar 1901</strong> wurde der Wehlener Gemeinderat durch Herrn Branddirektor Jäger angeschrieben und darauf hingewiesen, dass Stadt Wehlen im Bezirk die letzte Stadt sei, die keine freiwillige Feuerwehr besitze. Er bat um Unterstützung und um die Gründung einer Freiwilligen Feuerwehr.</p>
|
||||
<p>Am <strong>8. Februar 1901</strong> wurde die noch bestehende Pflichtfeuerwehr in die <strong>"Elbterrasse"</strong> gerufen und zur Generalversammlung geladen. Bei unentschuldigtem Fehlen wurde Strafe angedroht. Der Abend wurde durch Herrn Branddirektor Jäger genutzt, um über die Vorteile einer Freiwilligen Feuerwehr zu sprechen. Zu diesem Vortrag waren alle Stadträte und Stadtverordneten anwesend, und Herr Bürgermeister Schaale unterstrich die Worte von Herrn Jäger und setzte sich stark für die Gründung einer Freiwilligen Feuerwehr ein.</p>
|
||||
<p>Von den 44 anwesenden Herren der Pflichtfeuerwehr erklärten sich 30 bereit, in die Freiwillige Feuerwehr einzutreten. So meldete der Bürgermeister die Mitgliedschaft zum Bezirksverband Sächsischer Feuerwehren an.</p>
|
||||
<p>Im Februar 1901 konnte Bürgermeister Schaale den Gemeinden <strong>Hohnstein, Gottleuba, Berggießhübel, Neundorf, Rabenau</strong> und <strong>Siebenlehn</strong> vom Entschluss zur Gründung einer Freiwilligen Feuerwehr Mitteilung machen. Er rief die Gemeinden und Städte zur Unterstützung auf.</p>
|
||||
|
||||
<h3>Die offizielle Gründung</h3>
|
||||
<p>Am <strong>9. März 1901</strong> fand im Hotel <strong>"Elbterrasse"</strong> die Konstituierung der Freiwilligen Feuerwehr Stadt Wehlen statt. Am <strong>12. März 1901</strong> wurde die Freiwillige Feuerwehr Stadt Wehlen offiziell gegründet.</p>
|
||||
<p>Das Grundgesetz der Feuerwehr wurde bekannt gegeben, welches in 14 Paragraphen die Pflichten und Rechte des Feuerwehrmannes beinhaltete. So hieß es in §1:</p>
|
||||
<blockquote>"Zweck der Freiwilligen Feuerwehr ist, bei ausbrechenden Bränden im Gemeindebezirk in geordneter Weise rettend und schützend Beistand zu leisten. Bei entstehenden Bränden in den benachbarten Orten und zwar bis 2 Stunden entfernt, leistet die Feuerwehr mit einem Teil der Mannschaft gleichfalls Hilfe."</blockquote>
|
||||
|
||||
<h3>Ausrüstung der Feuerwehr</h3>
|
||||
<ul>
|
||||
<li>1 vierrädrige Abprotzspritze</li>
|
||||
<li>430 Meter Hanf-Schlauch</li>
|
||||
<li>18 Schöpeimer</li>
|
||||
<li>1 Steigleiter (8,80 m)</li>
|
||||
<li>1 Leiterwagen</li>
|
||||
<li>3 Hakenleitern</li>
|
||||
<li>2 Anlegeleitern</li>
|
||||
<li>5 Feuerhaken</li>
|
||||
</ul>
|
||||
|
||||
<h3>Technische Entwicklung</h3>
|
||||
<p>In den Jahren <strong>1903 bis 1904</strong> ließ Herr Ingenieur Mennicke als Geschenk für Stadt Wehlen eine zentrale Wasserleitung errichten. Dies war ein großer Vorteil für die Feuerwehr, denn nun konnten alle Punkte der Stadt mit Löschwasser aus dem zentralen Rohrnetz über <strong>31 Unterflurhydranten</strong> und <strong>1 Oberflurhydrant</strong> erreicht werden.</p>
|
||||
<p>Am <strong>23. Oktober 1921</strong> fand in Stadt Wehlen der <strong>20. Bezirkstag der Feuerwehren</strong> statt. Um 10 Uhr trafen 57 Feuerwehren ein, und in der "Elbterrasse" wurde eine Festsitzung abgehalten. Anschließend wurde eine Großübung am Hotel <strong>"Sächsische Schweiz"</strong> vor über 500 Gästen und Einwohnern durchgeführt. Am Nachmittag folgte ein großer Umzug mit <strong>vier Blaskapellen</strong> und <strong>zwei Spielmannszügen</strong>.</p>
|
||||
|
||||
<h3>Weitere Meilensteine</h3>
|
||||
<p>Am <strong>24. Mai 1925</strong> wurde das Feuerwehrdepot auf der Pirnaer Straße festlich eingeweiht. Hier stand die Feuerwehr unter der Leitung von Dachdeckermeister Otto Israel.</p>
|
||||
<p>1934 begann der Kampf um eine Motorspritze. Am <strong>12. Februar 1935</strong> wurde schließlich angeordnet, dass Stadt Wehlen eine Motorspritze beschaffen muss. Im gleichen Jahr erhielt die Feuerwehr eine Motorspritze sowie einen Mannschaftswagen vom Typ <strong>Mercedes</strong>.</p>
|
||||
|
||||
<h3>Die Feuerwehr im Zweiten Weltkrieg</h3>
|
||||
<p>Während des <strong>Zweiten Weltkriegs (1939–1945)</strong> übernahm die Wehr gemeinsam mit einer verpflichteten Frauengruppe den Schutz der Stadt. Unter dem Kommando von Hauptmann Fröde wurde ein straffer Dienst verlangt. Jede Woche wurden ein Dienstappell mit Überprüfung der Uniformen und Gerätschaften sowie zweistündige Übungen durchgeführt.</p>
|
||||
|
||||
<button type="button" class="btn btn-custom-gray mt-3" data-bs-toggle="modal" data-bs-target="#imageModal">
|
||||
Öffne Zeitungsartikel von 1921
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="headingThree">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree">
|
||||
1946 - 1989
|
||||
</button>
|
||||
</h2>
|
||||
<div id="collapseThree" class="accordion-collapse collapse" data-bs-parent="#fireHistoryAccordion">
|
||||
<div class="accordion-body">
|
||||
<h2>Wiederaufbau der Freiwilligen Feuerwehr nach 1949</h2>
|
||||
<p>Große Anstrengungen unternahmen die Kameraden nach <strong>1949</strong>. Kamerad Weber war damals der Jüngste, der die Wehr als Leiter übernahm. Wir wurden zum Beispiel zur Abholzung von Wäldern aufgerufen, damit die Bürger Feuerholz bekamen. Zur Erneuerung des Sportplatzes leisteten die Kameraden freiwillige Stunden.</p>
|
||||
<p>So wurden zur Gründung eines <strong>Fanfarenzuges</strong> von Bürgern der Stadt Gelder gespendet. Nach einem Jahr konnten wir das erste Mal öffentlich auftreten und marschierten bei Veranstaltungen wie dem 1. Mai an der Spitze mit.</p>
|
||||
|
||||
<h3>Der LKW und die Gründung der Löschgruppe Stadt Wehlen II</h3>
|
||||
<p>1956 kaufte der Rat der Stadt einen LKW, den die Kameraden als Zugkraftwagen ausbauten. Am <strong>1. April 1956</strong> wurde in Stadt Wehlen II (Pötzscha), unter Führung des Kameraden Böhme, eine Löschgruppe gegründet, da die Brände an der Bahnlinie zunahmen.</p>
|
||||
|
||||
<h3>Unwetterkatastrophen und die "Reinigungswasser-Suppe"</h3>
|
||||
<p>1957 wurden die Kameraden zur Unwetterkatastrophe nach Pirna alarmiert. Dort pumpten wir Wasser aus Kellern und retteten Margarinewürfel. Da wir hungrig waren, schöpften wir aus unbewachten Feldküchen vermeintliche Suppe. Am Morgen stellte sich heraus: Es war <strong>heißes Reinigungswasser</strong>! Eine Geschichte, die heute noch erzählt wird.</p>
|
||||
|
||||
<h3>Der Sparkassenbrand 1963</h3>
|
||||
<p>Am <strong>24. Dezember 1963</strong> brannte die Sparkasse am Markt. Bei <strong>-20°C</strong> und Orkanböen waren die Kameraden auf der Leiter teilweise angefroren. Trotzdem gelang es, die Kirche und die Nachbarhäuser zu retten. 1967 erhielten wir dafür unser erstes typenmäßiges Fahrzeug - das Kleinlöschfahrzeug <strong>B 1000</strong>.</p>
|
||||
|
||||
<h3>Entwicklungen der 70er und 80er</h3>
|
||||
<p>1971 bekamen wir das Löschfahrzeug <strong>LO 1800</strong>. In 20 Abenden wurde dafür eine Fahrzeughalle errichtet. <strong>1980</strong> wurde der erste Bauabschnitt des Gerätehauses an der Kirchstraße abgeschlossen.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="headingFour">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFour">
|
||||
1990 - 1994
|
||||
</button>
|
||||
</h2>
|
||||
<div id="collapseFour" class="accordion-collapse collapse" data-bs-parent="#fireHistoryAccordion">
|
||||
<div class="accordion-body">
|
||||
<h2>Nach der Wiedervereinigung 1990</h2>
|
||||
<p>Wir konnten preisgünstig Technik erwerben, darunter ein B 1000 für Pötzscha. 1991 feierte die Feuerwehr ihr <strong>90-jähriges Jubiläum</strong> mit einem großen Feuerwehrball im Cafe Richter.</p>
|
||||
<p>Vom <strong>22. - 23. November 1991</strong> erhielten wir von den Kameraden aus Deuschelried/Wangen ein Löschfahrzeug vom Typ <strong>Opel</strong> als Geschenk. Die Freundschaft wurde mit einer Dampferfahrt gefestigt. 1993/94 wurde das Gerätehaus in Pötzscha vergrößert.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="headingFive">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFive">
|
||||
1995 - heute
|
||||
</button>
|
||||
</h2>
|
||||
<div id="collapseFive" class="accordion-collapse collapse" data-bs-parent="#fireHistoryAccordion">
|
||||
<div class="accordion-body">
|
||||
<h2>Hochwasser 2002</h2>
|
||||
<p>Am <strong>13.08.2002</strong> wurden wir nach Pirna gerufen, um Bürger mit dem Schlauchboot zu evakuieren. Zurück in Wehlen begannen die Vorbereitungen gegen das Elbehochwasser. Bürger wie Eckhard, Mike Hofmann, Ronny Roll und Herr Pfeiler unterstützten mit ihren Booten.</p>
|
||||
<p>Am 15.08. kam die Schocknachricht: Es sollten noch 2-3 Meter dazu kommen. Die Leitstelle wurde in die Grundschule verlegt. Etwa 70 % der Bürger waren ohne Gas und Strom. In der Nacht zum 17.08. erreichte die Elbe den Höchststand von <strong>12,04 m</strong>.</p>
|
||||
<p>Hilfe kam von den Feuerwehren aus Trochtelfingen, Wangen und Forst sowie später durch 12 Fahrzeuge aus dem Wartburgkreis. Die Kameraden leisteten tägliche Dienste von 16-18 Stunden, um die Stadt vom Schlamm zu befreien.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal fade" id="imageModal" tabindex="-1" aria-hidden="true">
|
||||
<div class="modal-dialog modal-lg">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title">Zeitungsartikel von 1921</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body text-center">
|
||||
<img src="ffw_wehlen_1921.jpeg" alt="Zeitungsartikel 1921" class="img-fluid rounded shadow">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="container-fluid py-4 mt-auto border-top">
|
||||
<div class="row justify-content-center align-items-center text-center">
|
||||
<div class="col-lg-4 mb-3 mb-lg-0">
|
||||
<h6 class="fw-bold text-decoration-underline">Letzte Aktualisierung</h6>
|
||||
<p class="mb-0">17. März 2026</p>
|
||||
</div>
|
||||
<div class="col-lg-1 d-none d-lg-block"></div>
|
||||
<div class="col-lg-4">
|
||||
<h6 class="fw-bold text-decoration-underline">Statistik</h6>
|
||||
<p class="mb-0 small">Aktive: 27 | Jugend: 23 | Passive: 9 | Förderverein: 172</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
350
index.html
350
index.html
@ -3,7 +3,10 @@
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Feuerwehr Stadt Wehlen</title>
|
||||
<title>Feuerwehr Stadt Wehlen – Startseite</title>
|
||||
<meta name="description" content="Freiwillige Feuerwehr Stadt Wehlen – Einsätze, Technik, Geschichte und Dienstplan." />
|
||||
|
||||
<script>window.FFW_BASE = "";</script>
|
||||
|
||||
<link
|
||||
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
|
||||
@ -11,275 +14,100 @@
|
||||
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
|
||||
<link rel="stylesheet" href="css/nav.css" />
|
||||
<link rel="stylesheet" href="css/footer.css" />
|
||||
|
||||
<style>
|
||||
/* ===== FARBVARIABLEN ===== */
|
||||
:root {
|
||||
--rot-dunkel: #900000;
|
||||
--rot-accent: #b30000;
|
||||
--gelb: #FFCC00;
|
||||
--gelb-hell: #fff3cc;
|
||||
--glow-dunkel: rgba(190, 140, 0, 0.45);
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* ===== GLOBALER HINTERGRUND & TEXT ===== */
|
||||
body {
|
||||
background-color: var(--rot-dunkel) !important;
|
||||
background-image: url('bilder/logo2.jpeg') !important;
|
||||
background-size: 12em !important;
|
||||
background-repeat: repeat !important;
|
||||
color: var(--gelb) !important;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
/* ===== NAVBAR ===== */
|
||||
.navbar-custom {
|
||||
background-color: var(--rot-accent) !important;
|
||||
background-image: url('bilder/logo2.jpeg') !important;
|
||||
background-size: 8em !important;
|
||||
background-repeat: repeat !important;
|
||||
border-bottom: 3px solid var(--gelb) !important;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.navbar-custom .navbar-brand {
|
||||
font-size: 1.5rem; /* 👈 GRÖSSE HIER ANPASSEN */
|
||||
color: var(--gelb) !important;
|
||||
text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.9);
|
||||
font-weight: 600;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.navbar-custom .nav-link {
|
||||
color: var(--gelb) !important;
|
||||
text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.9);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.navbar-custom .nav-link:hover,
|
||||
.navbar-custom .nav-link:focus {
|
||||
color: var(--gelb-hell) !important;
|
||||
text-shadow: 0 0 8px var(--gelb);
|
||||
}
|
||||
|
||||
.navbar-custom .dropdown-menu {
|
||||
background-color: var(--rot-dunkel) !important;
|
||||
background-image: url('bilder/logo2.jpeg') !important;
|
||||
background-size: 10em !important;
|
||||
background-repeat: repeat !important;
|
||||
border: 2px solid var(--gelb) !important;
|
||||
border-radius: 0.5rem;
|
||||
}
|
||||
|
||||
.navbar-custom .dropdown-item {
|
||||
color: var(--gelb) !important;
|
||||
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
|
||||
}
|
||||
|
||||
/* 🟡 DROPDOWN HOVER: Nur dunkler Glow, kein roter Hintergrund */
|
||||
.navbar-custom .dropdown-item:hover,
|
||||
.navbar-custom .dropdown-item:focus {
|
||||
background: transparent !important;
|
||||
color: var(--gelb-hell) !important;
|
||||
box-shadow: 0 0 10px var(--glow-dunkel) !important;
|
||||
transition: box-shadow 0.2s ease, color 0.2s ease;
|
||||
}
|
||||
|
||||
.navbar-custom .dropdown-divider {
|
||||
border-top-color: var(--gelb) !important;
|
||||
opacity: 0.4;
|
||||
}
|
||||
|
||||
.navbar-toggler {
|
||||
border-color: var(--gelb) !important;
|
||||
}
|
||||
|
||||
.navbar-toggler-icon {
|
||||
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23FFCC00' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
|
||||
}
|
||||
|
||||
/* 🟡 DESKTOP: Brand exakt zentrieren */
|
||||
@media (min-width: 992px) {
|
||||
.navbar-custom .container-fluid {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.navbar-brand {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.navbar-nav {
|
||||
margin-left: auto;
|
||||
margin-right: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* ===== INFO-BOXEN ===== */
|
||||
.info-box {
|
||||
background-color: rgba(144, 0, 0, 0.85) !important;
|
||||
border: 2px solid var(--gelb) !important;
|
||||
border-left: 5px solid var(--gelb) !important;
|
||||
border-radius: 0.5rem;
|
||||
padding: 1.5rem;
|
||||
color: var(--gelb) !important;
|
||||
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4) !important;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.info-box h3 { color: var(--gelb) !important; }
|
||||
.info-box p { color: var(--gelb-hell) !important; }
|
||||
.info-box .text-muted { color: var(--gelb-hell) !important; opacity: 0.7; }
|
||||
|
||||
/* ===== TYPOGRAFIE ===== */
|
||||
h3, h6, .fw-bold, .text-danger { color: var(--gelb) !important; }
|
||||
|
||||
/* ===== HAUPTBILD ===== */
|
||||
.main-image {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
border-radius: 0.5rem;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
|
||||
border: 3px solid var(--gelb);
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.sticky-sidebar { position: sticky; top: 20px; z-index: 10; }
|
||||
.main-image { width: 60%; }
|
||||
}
|
||||
|
||||
/* ===== FOOTER ===== */
|
||||
footer {
|
||||
background-color: var(--rot-dunkel) !important;
|
||||
background-image: url('bilder/logo2.jpeg') !important;
|
||||
background-size: 12em !important;
|
||||
background-repeat: repeat !important;
|
||||
border-top: 3px solid var(--gelb) !important;
|
||||
color: var(--gelb) !important;
|
||||
}
|
||||
|
||||
footer h6 { color: var(--gelb) !important; text-decoration-color: var(--gelb) !important; }
|
||||
footer p, footer .small, footer .fw-bold { color: var(--gelb-hell) !important; }
|
||||
footer .text-muted { color: var(--gelb-hell) !important; opacity: 0.7; }
|
||||
|
||||
/* ===== CUSTOM SCROLLBAR ===== */
|
||||
::-webkit-scrollbar { width: 10px; }
|
||||
::-webkit-scrollbar-track { background: var(--rot-dunkel); }
|
||||
::-webkit-scrollbar-thumb { background: var(--gelb); border-radius: 5px; }
|
||||
::-webkit-scrollbar-thumb:hover { background: var(--rot-accent); }
|
||||
</style>
|
||||
<link rel="stylesheet" href="assets/style.css" />
|
||||
<link rel="icon" type="image/gif" href="bilder/ffw_transp_72.gif" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<body data-page="start">
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-custom shadow-sm">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="index.html">
|
||||
<img
|
||||
src="bilder/ffw_transp_72.gif"
|
||||
alt="Feuerwehr Stadt Wehlen"
|
||||
style="height: 3em; width: auto; margin-right: 0.5rem;"
|
||||
/>
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
<div id="site-header"></div>
|
||||
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<main>
|
||||
<div id="site-hero"></div>
|
||||
|
||||
<div class="collapse navbar-collapse" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto">
|
||||
<li class="nav-item"><a class="nav-link" href="#">Aktuelles</a></li>
|
||||
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
|
||||
Über uns
|
||||
</a>
|
||||
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
|
||||
<li><a class="dropdown-item" href="geschichte/Geschichte.html">Geschichte</a></li>
|
||||
<li><a class="dropdown-item" href="technik/technik.html">Technik</a></li>
|
||||
<li><hr class="dropdown-divider"></li>
|
||||
<li><a class="dropdown-item" href="mitglieder/Organigramm.html">Organigramm</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li class="nav-item"><a class="nav-link" href="#">Veranstaltungen</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="#">Kontakt / Impressum</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="container-fluid px-lg-5 py-4">
|
||||
<div class="row g-4 align-items-start">
|
||||
|
||||
<div class="col-lg-3 col-md-4 order-2 order-lg-1">
|
||||
<div class="sticky-sidebar">
|
||||
<div class="info-box">
|
||||
<h3 class="h5 fw-bold">Nächster Dienst</h3>
|
||||
<div id="nextDienst">
|
||||
<p class="small text-muted">Lade nächsten Dienst...</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="info-box">
|
||||
<h3 class="h5 fw-bold">Veranstaltung</h3>
|
||||
<div id="nextEvent">
|
||||
<p class="small text-muted">Lade nächste Veranstaltung...</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-6 col-md-8 order-1 order-lg-2 text-center">
|
||||
<picture>
|
||||
<source srcset="bilder/geraetehaus.webp" type="image/webp">
|
||||
<img
|
||||
src="bilder/geraetehaus.png"
|
||||
alt="Gerätehaus der Feuerwehr Stadt Wehlen"
|
||||
class="main-image mx-auto d-block"
|
||||
loading="lazy"
|
||||
>
|
||||
</picture>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-3 d-none d-lg-block order-lg-3"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="container-fluid py-4 mt-auto border-top">
|
||||
<div class="row justify-content-center align-items-center">
|
||||
<div class="col-lg-4 col-md-5 text-lg-end text-center mb-3 mb-lg-0">
|
||||
<h6 class="fw-bold">Letzte Aktualisierung</h6>
|
||||
<p class="mb-0">17. März 2026</p>
|
||||
<small class="text-muted">(Version 1.2)</small>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-1 d-none d-lg-block"></div>
|
||||
|
||||
<div class="col-lg-4 col-md-5 text-lg-start text-center">
|
||||
<h6 class="fw-bold">Kleine Statistik der FFw Stadt Wehlen</h6>
|
||||
<p class="mb-0 small">
|
||||
<strong>Aktive:</strong> 27 | <strong>Jugend:</strong> 23 | <strong>Passive:</strong> 9 | <strong>Förderverein:</strong> 172
|
||||
<section class="container py-5">
|
||||
<div class="row g-4 align-items-center">
|
||||
<div class="col-lg-6">
|
||||
<h2 class="abschnitt-titel">Unser Gerätehaus</h2>
|
||||
<p class="abschnitt-sub">Das Zuhause der Feuerwehr Stadt Wehlen</p>
|
||||
<p>
|
||||
Das Gerätehaus ist das Zentrum unserer Wehr: Hier stehen unsere Fahrzeuge
|
||||
einsatzbereit, hier treffen sich die Kameradinnen und Kameraden zu Dienst
|
||||
und Ausbildung – und hier starten wir zu den Einsätzen in Stadt Wehlen,
|
||||
Pötzscha und auf der Elbe.
|
||||
</p>
|
||||
<p class="mb-0">
|
||||
Neben der Einsatzabteilung gehören auch unsere Jugendfeuerwehr und der
|
||||
Förderverein zur Wehr – gemeinsam sorgen wir seit 1901 für Sicherheit
|
||||
in unserer Stadt.
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<div class="bild-karte">
|
||||
<picture>
|
||||
<source srcset="bilder/geraetehaus.webp" type="image/webp" />
|
||||
<img src="bilder/geraetehaus.png" alt="Gerätehaus der Feuerwehr Stadt Wehlen" loading="lazy" />
|
||||
</picture>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<script src="dienstplan/dienstplan.js"></script>
|
||||
<section class="container py-5 pt-0">
|
||||
<h2 class="abschnitt-titel">Termine</h2>
|
||||
<p class="abschnitt-sub">Die nächsten Dienste und Veranstaltungen der Feuerwehr Stadt Wehlen</p>
|
||||
<div class="row g-4">
|
||||
<div class="col-md-6">
|
||||
<div class="gl-card">
|
||||
<h3>Nächster Dienst</h3>
|
||||
<div id="nextDienst"><p class="termin-beschr">Wird geladen …</p></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="gl-card">
|
||||
<h3>Nächste Veranstaltung</h3>
|
||||
<div id="nextEvent"><p class="termin-beschr">Wird geladen …</p></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="container pb-5">
|
||||
<h2 class="abschnitt-titel">Über uns</h2>
|
||||
<p class="abschnitt-sub">Lernen Sie die Feuerwehr Stadt Wehlen kennen</p>
|
||||
<div class="row g-4">
|
||||
<div class="col-md-4">
|
||||
<a class="gl-card" href="geschichte.html">
|
||||
<h3>Geschichte</h3>
|
||||
<p class="beschreibung">Über 120 Jahre Feuerwehr in Stadt Wehlen – von der Pflichtfeuerwehr bis heute.</p>
|
||||
<span class="mehr">Mehr erfahren →</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<a class="gl-card" href="technik.html">
|
||||
<h3>Technik</h3>
|
||||
<p class="beschreibung">Fahrzeuge, Boote und Anhänger der Wehlen- und Pötzschaer Kameraden.</p>
|
||||
<span class="mehr">Mehr erfahren →</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<a class="gl-card" href="mitglieder.html">
|
||||
<h3>Organigramm</h3>
|
||||
<p class="beschreibung">Struktur und Einsatzabteilung der Feuerwehr Stadt Wehlen.</p>
|
||||
<span class="mehr">Mehr erfahren →</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<div id="site-footer"></div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
||||
crossorigin="anonymous"></script>
|
||||
<script src="data/dienste.js"></script>
|
||||
<script src="assets/components.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
177
index_old.html
177
index_old.html
@ -1,177 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Feuerwehr Stadt Wehlen</title>
|
||||
|
||||
<!-- Bootstrap-CSS -->
|
||||
<link
|
||||
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
|
||||
rel="stylesheet"
|
||||
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
|
||||
<!-- Navigation -->
|
||||
<link rel="stylesheet" href="nav.css" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<!-- NAVBAR -->
|
||||
<nav class="navbar navbar-expand-lg navbar-custom">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="#">
|
||||
<img
|
||||
src="ffw_transp_72.gif"
|
||||
alt="Feuerwehr Stadt Wehlen"
|
||||
style="height: 3em; width: auto; margin-right: 0.5rem;"
|
||||
/>
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
|
||||
<button
|
||||
class="navbar-toggler"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#navbarNav"
|
||||
aria-controls="navbarNav"
|
||||
aria-expanded="false"
|
||||
aria-label="Toggle navigation"
|
||||
>
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<div class="collapse navbar-collapse" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto">
|
||||
<li class="nav-item"><a class="nav-link" href="#">Aktuelles</a></li>
|
||||
|
||||
<li class="nav-item dropdown">
|
||||
<a
|
||||
class="nav-link dropdown-toggle"
|
||||
href="#"
|
||||
id="navbarDropdown"
|
||||
role="button"
|
||||
data-bs-toggle="dropdown"
|
||||
aria-expanded="false"
|
||||
>
|
||||
Über uns
|
||||
</a>
|
||||
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
|
||||
<li><a class="dropdown-item" href="Geschichte.html">Geschichte</a></li>
|
||||
<li><a class="dropdown-item" href="technik.html">Technik</a></li>
|
||||
<li><a class="dropdown-item" href="#">Mitglieder</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<li class="nav-item"><a class="nav-link" href="#">Veranstaltungen</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="#">Kontakt / Impressum</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- ====== CONTENT ====== -->
|
||||
<div class="container py-4">
|
||||
|
||||
<div class="row g-4">
|
||||
|
||||
<!-- NÄCHSTER DIENST -->
|
||||
<div class="col-lg-6 col-md-6 col-sm-12">
|
||||
<div class="info-box h-100">
|
||||
<h3>Nächster Dienst</h3>
|
||||
<div id="nextDienst">
|
||||
<small class="text-muted">Wird geladen…</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- VERANSTALTUNG -->
|
||||
<div class="col-lg-6 col-md-6 col-sm-12">
|
||||
<div class="info-box h-100">
|
||||
<h3>Veranstaltung</h3>
|
||||
<p>
|
||||
<strong>Sonnenwendfeier</strong><br>
|
||||
Datum: Sa, 21.06.<br>
|
||||
Beginn: ab 11:00 Uhr<br>
|
||||
Wo: Elbwiesen
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!--
|
||||
==================================================
|
||||
FACEBOOK WURDE BEWUSST AUSKOMMENTIERT
|
||||
(kommt später auf eigene Unterseite)
|
||||
==================================================
|
||||
|
||||
<div class="row justify-content-center mt-5">
|
||||
<div class="col-lg-8 col-md-10">
|
||||
<div class="fb-page"
|
||||
data-href="https://www.facebook.com/ffw.stadtwehlen/?locale=de_DE"
|
||||
data-tabs="timeline"
|
||||
data-height="700">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
==================================================
|
||||
-->
|
||||
|
||||
</div>
|
||||
<!-- ====== ENDE CONTENT ====== -->
|
||||
|
||||
<!-- FOOTER -->
|
||||
<footer class="container-fluid py-4">
|
||||
<div class="row text-center text-md-start">
|
||||
|
||||
<div class="col-md-6 mb-3">
|
||||
<h6><strong><u>Datum der letzten Aktualisierung</u></strong></h6>
|
||||
<p class="mb-0">13. Juni 2025</p>
|
||||
<small>(Version 1.0)</small>
|
||||
</div>
|
||||
|
||||
<div class="col-md-6">
|
||||
<h6><strong><u>Kleine Statistik der FFw Stadt Wehlen</u></strong></h6>
|
||||
<table class="table table-borderless text-warning mb-0">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td><strong>Aktive Kameraden/innen:</strong></td>
|
||||
<td>27</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Jugendfeuerwehr:</strong></td>
|
||||
<td>23</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Passive Kameraden:</strong></td>
|
||||
<td>9</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><strong>Mitglieder Förderverein:</strong></td>
|
||||
<td>172</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<link rel="stylesheet" href="footer.css" />
|
||||
</footer>
|
||||
|
||||
<!-- Bootstrap-JS -->
|
||||
<script
|
||||
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
||||
crossorigin="anonymous"
|
||||
></script>
|
||||
|
||||
<!-- Dienstplan -->
|
||||
<script src="dienstplan/dienstplan.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
93
kontakt.html
Normal file
93
kontakt.html
Normal file
@ -0,0 +1,93 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Kontakt & Impressum | Feuerwehr Stadt Wehlen</title>
|
||||
<meta name="description" content="Kontakt und Impressum der Feuerwehr Stadt Wehlen." />
|
||||
|
||||
<script>window.FFW_BASE = "";</script>
|
||||
|
||||
<link
|
||||
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
|
||||
rel="stylesheet"
|
||||
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
<link rel="stylesheet" href="assets/style.css" />
|
||||
<link rel="icon" type="image/gif" href="bilder/ffw_transp_72.gif" />
|
||||
</head>
|
||||
|
||||
<body data-page="kontakt">
|
||||
|
||||
<div id="site-header"></div>
|
||||
|
||||
<main>
|
||||
<header class="gl-seitenkopf">
|
||||
<div class="container">
|
||||
<h1>Kontakt & Impressum</h1>
|
||||
<p class="untertitel">So erreichen Sie die Feuerwehr Stadt Wehlen</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="container py-5">
|
||||
<div class="row g-4">
|
||||
<div class="col-md-5">
|
||||
<div class="notruf-card">
|
||||
<p class="mb-2 text-uppercase fw-bold">Im Notfall</p>
|
||||
<div class="nummer">112</div>
|
||||
<p class="mt-2">Feuerwehr & Rettungsdienst – rund um die Uhr, kostenfrei.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-7">
|
||||
<div class="gl-card">
|
||||
<h3>Freiwillige Feuerwehr Stadt Wehlen</h3>
|
||||
<dl class="kontakt-dl">
|
||||
<dt>Wehrleiter</dt>
|
||||
<dd>André Herzog</dd>
|
||||
<dt>Standorte</dt>
|
||||
<dd>Stadt Wehlen & Pötzscha</dd>
|
||||
<!-- TODO: Postadresse, E-Mail und Telefonnummer ergänzen -->
|
||||
<dt>Adresse</dt>
|
||||
<dd>(wird ergänzt)</dd>
|
||||
<dt>E-Mail</dt>
|
||||
<dd>(wird ergänzt)</dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="container pb-5">
|
||||
<div class="gl-card">
|
||||
<h3>Impressum</h3>
|
||||
<p>
|
||||
<strong>Angaben gemäß § 5 TMG / DDG:</strong><br>
|
||||
Freiwillige Feuerwehr Stadt Wehlen<br>
|
||||
<!-- TODO: vollständige Anschrift ergänzen -->
|
||||
Stadt Wehlen
|
||||
</p>
|
||||
<p>
|
||||
<strong>Verantwortlich für den Inhalt:</strong><br>
|
||||
André Herzog (Wehrleiter)
|
||||
</p>
|
||||
<p class="termin-beschr mb-0">
|
||||
<small>
|
||||
Die Inhalte dieser Seite werden mit größter Sorgfalt erstellt.
|
||||
Für die Richtigkeit, Vollständigkeit und Aktualität der Inhalte
|
||||
wird dennoch keine Gewähr übernommen.
|
||||
</small>
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<div id="site-footer"></div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
||||
crossorigin="anonymous"></script>
|
||||
<script src="assets/components.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
47
mitglieder.html
Normal file
47
mitglieder.html
Normal file
@ -0,0 +1,47 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Mitglieder & Organigramm | Feuerwehr Stadt Wehlen</title>
|
||||
<meta name="description" content="Struktur und Einsatzabteilung der Feuerwehr Stadt Wehlen." />
|
||||
|
||||
<script>window.FFW_BASE = "";</script>
|
||||
|
||||
<link
|
||||
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
|
||||
rel="stylesheet"
|
||||
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
<link rel="stylesheet" href="assets/style.css" />
|
||||
<link rel="icon" type="image/gif" href="bilder/ffw_transp_72.gif" />
|
||||
</head>
|
||||
|
||||
<body data-page="mitglieder">
|
||||
|
||||
<div id="site-header"></div>
|
||||
|
||||
<main>
|
||||
<header class="gl-seitenkopf">
|
||||
<div class="container">
|
||||
<h1>Unsere Mitglieder</h1>
|
||||
<p class="untertitel">Struktur und Einsatzabteilung der Stadt Wehlen</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="container py-5">
|
||||
<div id="mitglieder-inhalt"></div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<div id="site-footer"></div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
||||
crossorigin="anonymous"></script>
|
||||
<script src="data/mitglieder.js"></script>
|
||||
<script src="assets/components.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,239 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Mitglieder & Struktur | FFw Stadt Wehlen</title>
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="../css/nav.css">
|
||||
|
||||
<style>
|
||||
:root {
|
||||
--fw-rot: #900000;
|
||||
--fw-rot-hell: #b30000;
|
||||
--text-dunkelrot: #3d0000;
|
||||
--bg-light: #f8f9fa;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--bg-light);
|
||||
font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
|
||||
margin: 0;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
/* NAVBAR (mit logo2 Pattern) */
|
||||
.navbar-custom {
|
||||
background-color: var(--fw-rot-hell) !important;
|
||||
background-image: url('../bilder/logo2.jpeg') !important;
|
||||
background-size: 7em !important;
|
||||
background-repeat: repeat !important;
|
||||
padding: 1rem 0;
|
||||
border-bottom: 2px solid var(--text-dunkelrot);
|
||||
}
|
||||
|
||||
.navbar-custom .navbar-brand,
|
||||
.navbar-custom .nav-link {
|
||||
color: #ffffff !important;
|
||||
text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.navbar-custom .nav-link:hover,
|
||||
.navbar-custom .dropdown-item:hover,
|
||||
.navbar-custom .nav-link.active,
|
||||
.navbar-custom .dropdown-item.active {
|
||||
color: #ffffff !important;
|
||||
background-color: var(--text-dunkelrot) !important;
|
||||
}
|
||||
|
||||
.navbar-custom .dropdown-menu {
|
||||
background-color: var(--fw-rot) !important;
|
||||
background-image: url('../bilder/logo2.jpeg') !important;
|
||||
background-size: 9em !important;
|
||||
border: 1px solid var(--text-dunkelrot);
|
||||
}
|
||||
|
||||
.navbar-custom .dropdown-item { color: #ffffff !important; }
|
||||
|
||||
/* PAGE-HEADER */
|
||||
.page-header {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 60px 0;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.header-bg-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
height: 120%;
|
||||
opacity: 0.07;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 0.5rem;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
.page-header p {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
font-size: 1.1rem;
|
||||
color: #6c757d;
|
||||
}
|
||||
|
||||
/* Organigramm Styling */
|
||||
.detail-card {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
|
||||
border-left: 5px solid var(--fw-rot);
|
||||
padding: 40px 20px;
|
||||
margin: 40px auto 60px auto;
|
||||
max-width: 1100px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.box {
|
||||
border: 2px solid var(--fw-rot);
|
||||
background: #fff;
|
||||
padding: 12px;
|
||||
width: 220px;
|
||||
display: inline-block;
|
||||
border-radius: 4px;
|
||||
z-index: 5;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.role { display: block; font-size: 0.75rem; color: var(--text-dunkelrot); font-weight: bold; text-transform: uppercase; margin-bottom: 3px; }
|
||||
.name { font-weight: bold; font-size: 1.05rem; color: #111; }
|
||||
.vline { width: 2px; background-color: var(--fw-rot); height: 30px; margin: 0 auto; }
|
||||
|
||||
.stab-wrapper { position: relative; width: 540px; margin: 0 auto; display: flex; justify-content: space-between; }
|
||||
.line-h-stab { position: absolute; top: 50%; left: 110px; right: 110px; height: 2px; background: var(--fw-rot); z-index: 1; }
|
||||
.line-v-stab { position: absolute; top: 0; bottom: 0; left: 50%; width: 2px; background: var(--fw-rot); margin-left: -1px; }
|
||||
|
||||
.fachwart-wrapper { position: relative; width: 100%; max-width: 930px; margin: 0 auto; }
|
||||
.line-h-fach { position: absolute; top: 0; left: 110px; right: 110px; height: 2px; background: var(--fw-rot); }
|
||||
.fachwart-grid { display: flex; justify-content: space-between; flex-wrap: wrap; }
|
||||
.fach-col { display: flex; flex-direction: column; align-items: center; }
|
||||
.stich { width: 2px; height: 20px; background-color: var(--fw-rot); }
|
||||
|
||||
.footer-lists { margin-top: 60px; border-top: 2px solid var(--fw-rot); padding-top: 40px; text-align: center; }
|
||||
.l-head { color: var(--text-dunkelrot); font-weight: bold; margin-bottom: 15px; display: block; font-size: 1.1rem; border-bottom: 1px solid #eee; padding-bottom: 5px; }
|
||||
.name-list { text-align: left; display: inline-block; font-size: 0.9rem; line-height: 1.7; color: #444; }
|
||||
strong { color: var(--fw-rot); }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-custom">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="../index.html">
|
||||
<img src="../bilder/ffw_transp_72.gif" alt="Logo" style="height: 3em; margin-right: 10px;">
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto">
|
||||
<li class="nav-item"><a class="nav-link" href="#">Aktuelles</a></li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown">Über uns</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a class="dropdown-item" href="../geschichte/Geschichte.html">Geschichte</a></li>
|
||||
<li><a class="dropdown-item" href="../technik/technik.html">Technik</a></li>
|
||||
<li><hr class="dropdown-divider"></li>
|
||||
<li><a class="dropdown-item active" href="Organigramm.html">Organigramm</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class="nav-link" href="#">Veranstaltungen</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="#">Kontakt/Impressum</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="page-header">
|
||||
<img src="../bilder/ffw_transp_72.gif" class="header-bg-icon" alt="BG-Icon">
|
||||
<h1>Unsere Mitglieder</h1>
|
||||
<p class="lead">Struktur und Einsatzabteilung der Stadt Wehlen</p>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="detail-card shadow-lg">
|
||||
|
||||
<div class="box"><span class="role">Wehrleiter</span><span class="name">Herzog, André</span></div>
|
||||
<div class="vline"></div>
|
||||
<div class="box"><span class="role">Stellvertreter</span><span class="name">Flössel, Markus<br>Drechsel, Manuel</span></div>
|
||||
<div class="vline"></div>
|
||||
|
||||
<div class="stab-wrapper">
|
||||
<div class="line-h-stab"></div><div class="line-v-stab"></div>
|
||||
<div class="box"><span class="role">Schriftführer</span><span class="name">Flössel, Markus</span></div>
|
||||
<div class="box"><span class="role">Kassenwart</span><span class="name">Marder, Uwe</span></div>
|
||||
</div>
|
||||
|
||||
<div class="vline"></div>
|
||||
|
||||
<div class="fachwart-wrapper">
|
||||
<div class="line-h-fach"></div>
|
||||
<div class="fachwart-grid">
|
||||
<div class="fach-col"><div class="stich"></div><div class="box"><span class="role">Atemschutz-Gerätewart</span><span class="name">Reißig, Kersten</span></div></div>
|
||||
<div class="fach-col"><div class="stich"></div><div class="box"><span class="role">Gerätewart</span><span class="name">Blümel, Dirk</span></div></div>
|
||||
<div class="fach-col"><div class="stich"></div><div class="box"><span class="role">Jugendwart</span><span class="name">Hübsch, Sebastian</span></div></div>
|
||||
<div class="fach-col"><div class="stich"></div><div class="box"><span class="role">Altersabteilung</span><span class="name">Dittmann, Frank</span></div></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer-lists">
|
||||
<div class="row">
|
||||
<div class="col-md-3 mb-4">
|
||||
<span class="l-head">Atemschutzträger</span>
|
||||
<div class="name-list">
|
||||
Blümel, Dirk<br>Flössel, Markus<br>Gottlöber, Heiko<br>Herzog, Nico<br>Hübsch, Alexander<br>Hübsch, Sebastian<br>John, Marko<br>Kurze, Steffen
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 mb-4">
|
||||
<span class="l-head">Maschinisten</span>
|
||||
<div class="name-list">
|
||||
Blümel, Dirk<br>Drechsel, Manuel<br>Flössel, Markus<br>Herzog, André<br>Hübsch, Alexander<br>Hübsch, Sebastian<br>John, Marko<br>Marder, Uwe
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 mb-4">
|
||||
<span class="l-head">Führung</span>
|
||||
<div class="name-list">
|
||||
<strong>Zugführer:</strong><br>Kurze, Steffen<br><br>
|
||||
<strong>Verbandsführer:</strong><br>Mathe, Thomas<br><br>
|
||||
<strong>Gruppenführer:</strong><br>Blümel, Dirk<br>Drechsel, Manuel<br>Flössel, Markus<br>Herzog, André
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 mb-4">
|
||||
<span class="l-head">Mannschaft</span>
|
||||
<div class="name-list">
|
||||
<strong>Truppführer:</strong><br>Gottlöber, Heiko<br>Hübsch, Alexander<br>Hübsch, Sebastian<br>John, Marko<br>Marder, Uwe<br><br>
|
||||
<strong>Truppmann:</strong><br>Caspari, Patrick<br>Herzog, Nico<br>Marder, Lukas<br>Mathe, Albert<br>Pohl, Michael<br>Riedel, Pascal
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
47
technik.html
Normal file
47
technik.html
Normal file
@ -0,0 +1,47 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Technik | Feuerwehr Stadt Wehlen</title>
|
||||
<meta name="description" content="Einsatzfahrzeuge, Boote und Ausrüstung der Feuerwehr Stadt Wehlen." />
|
||||
|
||||
<script>window.FFW_BASE = "";</script>
|
||||
|
||||
<link
|
||||
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
|
||||
rel="stylesheet"
|
||||
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
<link rel="stylesheet" href="assets/style.css" />
|
||||
<link rel="icon" type="image/gif" href="bilder/ffw_transp_72.gif" />
|
||||
</head>
|
||||
|
||||
<body data-page="technik">
|
||||
|
||||
<div id="site-header"></div>
|
||||
|
||||
<main>
|
||||
<header class="gl-seitenkopf">
|
||||
<div class="container">
|
||||
<h1>Unsere Technik</h1>
|
||||
<p class="untertitel">Einsatzfahrzeuge, Boote und Ausrüstung der Stadt Wehlen</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="container py-5">
|
||||
<div id="technik-grid"></div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<div id="site-footer"></div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
||||
crossorigin="anonymous"></script>
|
||||
<script src="data/fahrzeuge.js"></script>
|
||||
<script src="assets/components.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,222 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Hydrantenwagen Modell H.I. | FFw Stadt Wehlen</title>
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="/nav.css">
|
||||
|
||||
<style>
|
||||
:root {
|
||||
--fw-rot: #900000;
|
||||
--fw-grau: #616161;
|
||||
--bg-light: #f8f9fa;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--bg-light);
|
||||
font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
.navbar-custom {
|
||||
background-color: #b30000 !important;
|
||||
/* Pfad vom Hauptverzeichnis aus */
|
||||
background-image: url('/bilder/logo2.jpeg') !important;
|
||||
background-size: 7em !important;
|
||||
background-repeat: repeat !important;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.navbar-custom .navbar-brand,
|
||||
.navbar-custom .nav-link {
|
||||
color: #ffffff !important;
|
||||
text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 60px 0;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.header-bg-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
height: 140%;
|
||||
opacity: 0.08;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
background: #fff;
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.custom-btn {
|
||||
background-color: var(--fw-grau);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 8px 20px;
|
||||
transition: all 0.3s ease;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.custom-btn:hover {
|
||||
background-color: var(--fw-rot) !important;
|
||||
color: white;
|
||||
transform: translateX(-5px);
|
||||
}
|
||||
|
||||
.detail-card {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
|
||||
border-left: 5px solid var(--fw-rot);
|
||||
padding: 30px;
|
||||
margin-top: 30px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-weight: 700;
|
||||
color: var(--fw-grau);
|
||||
width: 180px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.spec-list {
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.spec-list li {
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px solid #f1f1f1;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin-top: 30px;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.carousel-item img {
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 10px rgba(0,0,0,0.15);
|
||||
max-height: 450px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.carousel-control-prev-icon, .carousel-control-next-icon {
|
||||
background-color: var(--fw-rot);
|
||||
border-radius: 50%;
|
||||
background-size: 50%;
|
||||
}
|
||||
|
||||
/* Fix für Mobile: Spaltenbreite anpassen */
|
||||
@media (max-width: 768px) {
|
||||
.info-label { width: 100%; margin-bottom: 5px; }
|
||||
.page-header h1 { font-size: 1.5rem; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-custom shadow-sm">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="/index.html">
|
||||
<img src="/ffw_transp_72.gif" alt="Logo" style="height: 3em; margin-right: 10px;">
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
<div class="collapse navbar-collapse">
|
||||
<ul class="navbar-nav ms-auto">
|
||||
<li class="nav-item"><a class="nav-link" href="/technik/technik.html">Technik</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="page-header">
|
||||
<img src="/ffw_transp_72.gif" class="header-bg-icon" alt="">
|
||||
<h1>Hydrantenwagen Modell H.I.</h1>
|
||||
</div>
|
||||
|
||||
<div class="top-bar">
|
||||
<div class="container">
|
||||
<a href="/technik/technik.html" class="custom-btn">← Zurück zur Technik-Übersicht</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="detail-card">
|
||||
<div class="row">
|
||||
<div class="col-lg-7">
|
||||
<h2 class="mb-4" style="color: var(--fw-rot); font-weight: 700;">Fahrzeugdaten</h2>
|
||||
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Bezeichnung:</span> Hydrantenwagen Modell H.I.</li>
|
||||
<li><span class="info-label">Stationierung:</span> Stadt Wehlen</li>
|
||||
<li><span class="info-label">Hersteller:</span> C.A. Schöne Fabrik Dresden</li>
|
||||
<li><span class="info-label">Baujahr:</span> 1905</li>
|
||||
<li><span class="info-label">Typ:</span> Historisches Handzug-Gerät</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Feuerwehrtechnische Beladung</h4>
|
||||
<ul class="spec-list">
|
||||
<li>Kupferner Hydrantenaufsatz (2 Auslässe)</li>
|
||||
<li>Sächsisches Normalgewinde, Spindelventile</li>
|
||||
<li>Kupferne Normalstrahlrohre (in Leine geflochten)</li>
|
||||
<li>255 m Flachsschlauch (17 Satz à 15 m)</li>
|
||||
<li>17 Paar Patent-Honigkupplungen</li>
|
||||
<li>4 Übersetzungsstücke (Sächs. Normalgewinde)</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-5 mt-4 mt-lg-0">
|
||||
<div id="hydrantenCarousel" class="carousel slide" data-bs-ride="carousel">
|
||||
<div class="carousel-inner">
|
||||
<div class="carousel-item active">
|
||||
<img src="t_hydrantenwagen_1.jpg" class="d-block w-100" alt="Hydrantenwagen Bild 1">
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="t_hydrantenwagen_2.jpg" class="d-block w-100" alt="Hydrantenwagen Bild 2">
|
||||
</div>
|
||||
</div>
|
||||
<button class="carousel-control-prev" type="button" data-bs-target="#hydrantenCarousel" data-bs-slide="prev">
|
||||
<span class="carousel-control-prev-icon"></span>
|
||||
</button>
|
||||
<button class="carousel-control-next" type="button" data-bs-target="#hydrantenCarousel" data-bs-slide="next">
|
||||
<span class="carousel-control-next-icon"></span>
|
||||
</button>
|
||||
</div>
|
||||
<p class="text-center text-muted mt-3 small"><em>Klicken zum Blättern</em></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,240 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Tragkraftspritzenanhänger TSA | FFw Stadt Wehlen</title>
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="/nav.css">
|
||||
|
||||
<style>
|
||||
:root {
|
||||
--fw-rot: #900000;
|
||||
--fw-grau: #616161;
|
||||
--bg-light: #f8f9fa;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--bg-light);
|
||||
font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
/* Branding Navbar */
|
||||
.navbar-custom {
|
||||
background-color: #b30000 !important;
|
||||
background-image: url('/bilder/logo2.jpeg') !important;
|
||||
background-size: 7em !important;
|
||||
background-repeat: repeat !important;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.navbar-custom .navbar-brand {
|
||||
color: #ffffff !important;
|
||||
text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Page-Header mit Wasserzeichen */
|
||||
.page-header {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 40px 0;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.header-bg-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
height: 140%;
|
||||
opacity: 0.08;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
background: #fff;
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.custom-btn {
|
||||
background-color: var(--fw-grau);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 8px 20px;
|
||||
transition: all 0.3s ease;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.custom-btn:hover {
|
||||
background-color: var(--fw-rot) !important;
|
||||
color: white;
|
||||
transform: translateX(-5px);
|
||||
}
|
||||
|
||||
.detail-card {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
|
||||
border-left: 5px solid var(--fw-rot);
|
||||
padding: 30px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-weight: 700;
|
||||
color: var(--fw-grau);
|
||||
width: 160px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.spec-list {
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.spec-list li {
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px solid #f1f1f1;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin-top: 30px;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 700;
|
||||
border-left: 3px solid var(--fw-rot);
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.carousel-item img {
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 10px rgba(0,0,0,0.15);
|
||||
max-height: 450px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.pump-highlight {
|
||||
background-color: #fdf2f2;
|
||||
border: 1px dashed var(--fw-rot);
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.pump-highlight i {
|
||||
font-size: 1.5rem;
|
||||
margin-right: 15px;
|
||||
color: var(--fw-rot);
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.info-label { width: 100%; margin-bottom: 5px; }
|
||||
.page-header h1 { font-size: 1.5rem; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-custom shadow-sm">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="/index.html">
|
||||
<img src="/ffw_transp_72.gif" alt="Logo" style="height: 3em; margin-right: 10px;">
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="page-header">
|
||||
<img src="/ffw_transp_72.gif" class="header-bg-icon" alt="">
|
||||
<h1>Tragkraftspritzenanhänger (TSA)</h1>
|
||||
</div>
|
||||
|
||||
<div class="top-bar">
|
||||
<div class="container">
|
||||
<a href="/technik/technik.html" class="custom-btn">← Zurück zur Technik-Übersicht</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="detail-card">
|
||||
<div class="row">
|
||||
<div class="col-lg-7">
|
||||
<h2 style="color: var(--fw-rot); font-weight: 700;">Anhängerdaten</h2>
|
||||
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Bezeichnung:</span> Tragkraftspritzenanhänger (TSA)</li>
|
||||
<li><span class="info-label">Standort:</span> Stadt Wehlen</li>
|
||||
<li><span class="info-label">Typ:</span> Ziegler TSA SDAH</li>
|
||||
<li><span class="info-label">Baujahr:</span> Februar 2004</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Technische Daten</h4>
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Maße:</span> L 4,00m | B 1,80m | H 2,00m</li>
|
||||
<li><span class="info-label">Gesamtgewicht:</span> 1.200 kg</li>
|
||||
<li><span class="info-label">Details:</span> Verstellbare Zugdeichsel, Heckstützen</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Feuerwehrtechnische Beladung</h4>
|
||||
<p>Der TSA bildet eine eigenständige taktische Einheit für eine Löschgruppe (1/8). Er führt alles mit, was für einen klassischen Löschangriff benötigt wird.</p>
|
||||
|
||||
<div class="pump-highlight">
|
||||
<div>
|
||||
<strong>Herzstück:</strong> Tragkraftspritze Magirus (4-Takt-Motor)<br>
|
||||
<small class="text-muted">Zuverlässige Wasserförderung auch bei langen Einsatzstellen.</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ul class="spec-list mt-3">
|
||||
<li><span class="info-label">Ausrüstung:</span> 4 Saugschläuche (A), Saugkorb</li>
|
||||
<li><span class="info-label">Löschmittel:</span> B- und C-Schläuche nach DIN</li>
|
||||
<li><span class="info-label">Armaturen:</span> Strahlrohre, Verteiler, Standrohr</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-5 mt-4 mt-lg-0">
|
||||
<div id="tsaCarousel" class="carousel slide" data-bs-ride="carousel">
|
||||
<div class="carousel-inner">
|
||||
<div class="carousel-item active">
|
||||
<img src="t_tsa_1.jpg" class="d-block w-100" alt="TSA Bild 1">
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="t_tsa_2.jpg" class="d-block w-100" alt="TSA Bild 2">
|
||||
</div>
|
||||
</div>
|
||||
<button class="carousel-control-prev" type="button" data-bs-target="#tsaCarousel" data-bs-slide="prev">
|
||||
<span class="carousel-control-prev-icon"></span>
|
||||
</button>
|
||||
<button class="carousel-control-next" type="button" data-bs-target="#tsaCarousel" data-bs-slide="next">
|
||||
<span class="carousel-control-next-icon"></span>
|
||||
</button>
|
||||
</div>
|
||||
<p class="text-center text-muted mt-3 small"><em>Die mobile Pumpeneinheit für die Wasserversorgung</em></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,209 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Transportanhänger | FFw Stadt Wehlen</title>
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="/nav.css">
|
||||
|
||||
<style>
|
||||
:root {
|
||||
--fw-rot: #900000;
|
||||
--fw-grau: #616161;
|
||||
--bg-light: #f8f9fa;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--bg-light);
|
||||
font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
/* Branding Navbar */
|
||||
.navbar-custom {
|
||||
background-color: #b30000 !important;
|
||||
background-image: url('/bilder/logo2.jpeg') !important;
|
||||
background-size: 7em !important;
|
||||
background-repeat: repeat !important;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.navbar-custom .navbar-brand {
|
||||
color: #ffffff !important;
|
||||
text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Einheitlicher Page-Header */
|
||||
.page-header {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 40px 0;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.header-bg-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
height: 140%;
|
||||
opacity: 0.08;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
background: #fff;
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.custom-btn {
|
||||
background-color: var(--fw-grau);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 8px 20px;
|
||||
transition: all 0.3s ease;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.custom-btn:hover {
|
||||
background-color: var(--fw-rot) !important;
|
||||
color: white;
|
||||
transform: translateX(-5px);
|
||||
}
|
||||
|
||||
.detail-card {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
|
||||
border-left: 5px solid var(--fw-rot);
|
||||
padding: 30px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-weight: 700;
|
||||
color: var(--fw-grau);
|
||||
width: 160px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.spec-list {
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.spec-list li {
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px solid #f1f1f1;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin-top: 30px;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 700;
|
||||
border-left: 3px solid var(--fw-rot);
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.vehicle-img {
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 10px rgba(0,0,0,0.15);
|
||||
width: 100%;
|
||||
height: auto;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.vehicle-img:hover {
|
||||
transform: scale(1.02);
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.info-label { width: 100%; margin-bottom: 5px; }
|
||||
.page-header h1 { font-size: 1.5rem; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-custom shadow-sm">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="/index.html">
|
||||
<img src="/ffw_transp_72.gif" alt="Logo" style="height: 3em; margin-right: 10px;">
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="page-header">
|
||||
<img src="/ffw_transp_72.gif" class="header-bg-icon" alt="">
|
||||
<h1>Transportanhänger</h1>
|
||||
</div>
|
||||
|
||||
<div class="top-bar">
|
||||
<div class="container">
|
||||
<a href="/technik/technik.html" class="custom-btn">← Zurück zur Technik-Übersicht</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="detail-card">
|
||||
<div class="row">
|
||||
<div class="col-lg-7">
|
||||
<h2 style="color: var(--fw-rot); font-weight: 700;">Fahrzeugdaten</h2>
|
||||
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Bezeichnung:</span> Transportanhänger</li>
|
||||
<li><span class="info-label">Standort:</span> Stadt Wehlen</li>
|
||||
<li><span class="info-label">Typ:</span> Humbauer H12</li>
|
||||
<li><span class="info-label">Baujahr:</span> April 2004</li>
|
||||
<li><span class="info-label">Gesamtgewicht:</span> 1.200 kg</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Technische Daten</h4>
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Maße:</span> L 3,75m | B 1,77m | H 2,35m</li>
|
||||
<li><span class="info-label">Sicherheit:</span> Feststellbremse</li>
|
||||
<li><span class="info-label">Aufbau:</span> Hochplane, Stützrad & Heckstützen</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Nutzung & Beladung</h4>
|
||||
<p>Dieser Anhänger ist unser flexibler Allrounder für Logistikaufgaben. Ob Ausbildung oder Einsatz – der Anhänger passt sich an:</p>
|
||||
<div class="bg-light p-3 border-start border-3 border-danger rounded">
|
||||
<ul class="mb-0">
|
||||
<li><strong>Jugendfeuerwehr:</strong> Transport der Übungsausstattung</li>
|
||||
<li><strong>Löschwasser:</strong> Mitführung eines TSA-Einschubs mit <strong>Tragkraftspritze TS 3</strong></li>
|
||||
<li><strong>Logistik:</strong> Transport von Sandsäcken, Ölbindemittel oder verschmutztem Material</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-5 mt-4 mt-lg-0 text-center">
|
||||
<img src="t_transportanhaenger.jpg" class="vehicle-img" alt="Transportanhänger FFw Wehlen">
|
||||
<p class="text-center text-muted mt-3 small"><em>Vielseitiges Logistikfahrzeug für Ausbildung und Einsatz</em></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,228 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>VRW Vorausrüstwagen | FFw Stadt Wehlen</title>
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="/nav.css">
|
||||
|
||||
<style>
|
||||
:root {
|
||||
--fw-rot: #900000;
|
||||
--fw-grau: #616161;
|
||||
--bg-light: #f8f9fa;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--bg-light);
|
||||
font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
/* Branding Navbar */
|
||||
.navbar-custom {
|
||||
background-color: #b30000 !important;
|
||||
background-image: url('/bilder/logo2.jpeg') !important;
|
||||
background-size: 7em !important;
|
||||
background-repeat: repeat !important;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.navbar-custom .navbar-brand {
|
||||
color: #ffffff !important;
|
||||
text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Einheitlicher Page-Header mit Wasserzeichen */
|
||||
.page-header {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 40px 0;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.header-bg-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
height: 140%;
|
||||
opacity: 0.08;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
background: #fff;
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.custom-btn {
|
||||
background-color: var(--fw-grau);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 8px 20px;
|
||||
transition: all 0.3s ease;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.custom-btn:hover {
|
||||
background-color: var(--fw-rot) !important;
|
||||
color: white;
|
||||
transform: translateX(-5px);
|
||||
}
|
||||
|
||||
.detail-card {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
|
||||
border-left: 5px solid var(--fw-rot);
|
||||
padding: 30px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-weight: 700;
|
||||
color: var(--fw-grau);
|
||||
width: 160px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.spec-list {
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.spec-list li {
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px solid #f1f1f1;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin-top: 30px;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 700;
|
||||
border-left: 3px solid var(--fw-rot);
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.vehicle-img {
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 10px rgba(0,0,0,0.15);
|
||||
width: 100%;
|
||||
height: auto;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.tech-box {
|
||||
background: #fdf2f2;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
border: 1px dashed var(--fw-rot);
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.info-label { width: 100%; margin-bottom: 5px; }
|
||||
.page-header h1 { font-size: 1.5rem; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-custom shadow-sm">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="/index.html">
|
||||
<img src="/ffw_transp_72.gif" alt="Logo" style="height: 3em; margin-right: 10px;">
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="page-header">
|
||||
<img src="/ffw_transp_72.gif" class="header-bg-icon" alt="">
|
||||
<h1>Vorausrüstwagen (VRW)</h1>
|
||||
</div>
|
||||
|
||||
<div class="top-bar">
|
||||
<div class="container">
|
||||
<a href="/technik/technik.html" class="custom-btn">← Zurück zur Technik-Übersicht</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="detail-card">
|
||||
<div class="row">
|
||||
<div class="col-lg-7">
|
||||
<h2 style="color: var(--fw-rot); font-weight: 700;">Stammdaten</h2>
|
||||
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Bezeichnung:</span> VRW (Quad)</li>
|
||||
<li><span class="info-label">Funkrufname:</span> Florian Stadt Wehlen 53-1</li>
|
||||
<li><span class="info-label">Fahrgestell:</span> Suzuki KingQuad</li>
|
||||
<li><span class="info-label">Baujahr:</span> Mai 2006</li>
|
||||
<li><span class="info-label">Einsatzgewicht:</span> 470 kg</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Technische Daten</h4>
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Antrieb:</span> 4x4 Allrad / Differentialsperre</li>
|
||||
<li><span class="info-label">Sondersignal:</span> Blitzkennleuchte & Martins-Horn</li>
|
||||
<li><span class="info-label">Zusatzausstattung:</span> Arbeitsscheinwerfer LED</li>
|
||||
<li><span class="info-label">Maße:</span> L 2,20m | B 1,25m | H 2,00m</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Spezialausrüstung: TH-Rettung</h4>
|
||||
<div class="tech-box">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<ul class="spec-list small mb-0">
|
||||
<li class="border-0"><strong>Hydraulik:</strong> Lukas SC 350 Kombigerät</li>
|
||||
<li class="border-0">Lukas Kompaktaggregat P 610 OG</li>
|
||||
<li class="border-0">Lukas Rettungszylinder</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<ul class="spec-list small mb-0">
|
||||
<li class="border-0"><strong>Medizin:</strong> Defibrillator (AED)</li>
|
||||
<li class="border-0">Sanitätsrucksack & Sauerstoff</li>
|
||||
<li class="border-0">Löschtechnik: 10L MicroCAFS</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-5 mt-4 mt-lg-0 text-center">
|
||||
<img src="t_vrw_1.jpg" class="vehicle-img" alt="VRW Suzuki KingQuad">
|
||||
<p class="text-center text-muted mt-3 small"><em>Extrem geländegängig für schnelle Hilfe in unwegsamem Gelände</em></p>
|
||||
|
||||
<div class="alert alert-warning mt-4 small border-0 shadow-sm" style="background-color: #fff3cd; color: #856404;">
|
||||
<strong>Einsatztaktik:</strong> Das Fahrzeug ermöglicht durch seine kompakten Maße einen schnellen Erstzugriff bei Verkehrsunfällen oder im Waldgelände, noch bevor die Großfahrzeuge eintreffen.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,4 +0,0 @@
|
||||
.bildertechnik{
|
||||
max-width: 15em; /* Ensures the carousel doesn't overflow the column */
|
||||
margin: 0 auto
|
||||
}
|
||||
@ -1,202 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Löschfahrzeug LF 1 | FFw Stadt Wehlen</title>
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="/nav.css">
|
||||
|
||||
<style>
|
||||
:root {
|
||||
--fw-rot: #900000;
|
||||
--fw-grau: #616161;
|
||||
--bg-light: #f8f9fa;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--bg-light);
|
||||
font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
/* Falls nav.css blockiert wird, hier das Backup-Styling */
|
||||
.navbar-custom {
|
||||
background-color: #b30000 !important;
|
||||
background-image: url('/bilder/logo2.jpeg') !important;
|
||||
background-size: 7em !important;
|
||||
background-repeat: repeat !important;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.navbar-custom .navbar-brand {
|
||||
color: #ffffff !important;
|
||||
text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 40px 0;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.header-bg-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
height: 140%;
|
||||
opacity: 0.08;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 800;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
background: #fff;
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.custom-btn {
|
||||
background-color: var(--fw-grau);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 8px 20px;
|
||||
transition: all 0.3s ease;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.custom-btn:hover {
|
||||
background-color: var(--fw-rot) !important;
|
||||
color: white;
|
||||
transform: translateX(-5px);
|
||||
}
|
||||
|
||||
.detail-card {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
|
||||
border-left: 5px solid var(--fw-rot);
|
||||
padding: 30px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-weight: 700;
|
||||
color: var(--fw-grau);
|
||||
width: 160px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.spec-list {
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.spec-list li {
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px solid #f1f1f1;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin-top: 30px;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 700;
|
||||
border-left: 3px solid var(--fw-rot);
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.carousel-item img {
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 10px rgba(0,0,0,0.15);
|
||||
max-height: 450px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.info-label { width: 100%; margin-bottom: 5px; }
|
||||
.page-header h1 { font-size: 1.5rem; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-custom">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="/index.html">
|
||||
<img src="/ffw_transp_72.gif" alt="Logo" style="height: 3em; margin-right: 10px;">
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="page-header">
|
||||
<img src="/ffw_transp_72.gif" class="header-bg-icon" alt="">
|
||||
<h1>Löschfahrzeug LF 1</h1>
|
||||
</div>
|
||||
|
||||
<div class="top-bar">
|
||||
<div class="container">
|
||||
<a href="/technik/technik.html" class="custom-btn">← Zurück zur Technik-Übersicht</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="detail-card">
|
||||
<div class="row">
|
||||
<div class="col-lg-7">
|
||||
<h2 style="color: var(--fw-rot); font-weight: 700;">Fahrzeugdaten</h2>
|
||||
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Bezeichnung:</span> Löschfahrzeug LF 1</li>
|
||||
<li><span class="info-label">Stationierung:</span> Stadt Wehlen</li>
|
||||
<li><span class="info-label">Typ:</span> Umgebautes Postfahrrad</li>
|
||||
<li><span class="info-label">Baujahr:</span> Mai 2003</li>
|
||||
<li><span class="info-label">Fahrzeugdaten:</span> 26er Herrenfahrrad</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Feuerwehrtechnische Beladung</h4>
|
||||
<ul class="spec-list">
|
||||
<li>Sirene mit Handkurbel (akustisches Signal)</li>
|
||||
<li>Blitzleuchte (optisches Signal)</li>
|
||||
<li>Kübelspritze (als Spendenkübel umfunktioniert)</li>
|
||||
<li>C-Schlauch + Strahlrohr (Schnellangriff-Attrappe)</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Besonderheiten</h4>
|
||||
<p>Das LF 1 ist unser ganzer Stolz bei Festumzügen. Das ehemalige Postrad wurde in liebevoller Kleinarbeit zum "kleinsten Löschfahrzeug der Welt" umgebaut. Es dient primär der Traditionspflege und der Spendensammlung bei Veranstaltungen.</p>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-5 mt-4 mt-lg-0">
|
||||
<div id="lf1Carousel" class="carousel slide" data-bs-ride="carousel">
|
||||
<div class="carousel-inner">
|
||||
<div class="carousel-item active">
|
||||
<img src="t_lf1_2.jpg" class="d-block w-100" alt="LF 1 Fahrrad">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-center text-muted mt-3 small"><em>Traditionsfahrzeug der Feuerwehr Stadt Wehlen</em></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,239 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>LF 10/6 | FFw Stadt Wehlen</title>
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="/nav.css">
|
||||
|
||||
<style>
|
||||
:root {
|
||||
--fw-rot: #900000;
|
||||
--fw-grau: #616161;
|
||||
--bg-light: #f8f9fa;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--bg-light);
|
||||
font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
/* Branding für die Navbar (falls nav.css extern geladen wird) */
|
||||
.navbar-custom {
|
||||
background-color: #b30000 !important;
|
||||
background-image: url('/bilder/logo2.jpeg') !important;
|
||||
background-size: 7em !important;
|
||||
background-repeat: repeat !important;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.navbar-custom .navbar-brand {
|
||||
color: #ffffff !important;
|
||||
text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Schicker Header wie bei den anderen Seiten */
|
||||
.page-header {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 40px 0;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.header-bg-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
height: 140%;
|
||||
opacity: 0.08;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
background: #fff;
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.custom-btn {
|
||||
background-color: var(--fw-grau);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 8px 20px;
|
||||
transition: all 0.3s ease;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.custom-btn:hover {
|
||||
background-color: var(--fw-rot) !important;
|
||||
color: white;
|
||||
transform: translateX(-5px);
|
||||
}
|
||||
|
||||
.detail-card {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
|
||||
border-left: 5px solid var(--fw-rot);
|
||||
padding: 30px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-weight: 700;
|
||||
color: var(--fw-grau);
|
||||
width: 160px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.spec-list {
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.spec-list li {
|
||||
padding: 6px 0;
|
||||
border-bottom: 1px solid #f1f1f1;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin-top: 30px;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 700;
|
||||
border-left: 3px solid var(--fw-rot);
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.beladung-grid {
|
||||
column-count: 2;
|
||||
column-gap: 30px;
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.carousel-item img {
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 10px rgba(0,0,0,0.15);
|
||||
max-height: 550px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.carousel-control-prev-icon, .carousel-control-next-icon {
|
||||
background-color: var(--fw-rot);
|
||||
border-radius: 50%;
|
||||
background-size: 50%;
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
.beladung-grid { column-count: 1; }
|
||||
.info-label { width: 100%; margin-bottom: 5px; }
|
||||
.page-header h1 { font-size: 1.5rem; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-custom">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="/index.html">
|
||||
<img src="/ffw_transp_72.gif" alt="Logo" style="height: 3em; margin-right: 10px;">
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="page-header">
|
||||
<img src="/ffw_transp_72.gif" class="header-bg-icon" alt="">
|
||||
<h1>Löschgruppenfahrzeug LF 10/6</h1>
|
||||
</div>
|
||||
|
||||
<div class="top-bar">
|
||||
<div class="container">
|
||||
<a href="/technik/technik.html" class="custom-btn">← Zurück zur Technik-Übersicht</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="detail-card">
|
||||
<div class="row">
|
||||
<div class="col-lg-7">
|
||||
<h2 style="color: var(--fw-rot); font-weight: 700;">Fahrzeugdaten</h2>
|
||||
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Bezeichnung:</span> LF 10/6</li>
|
||||
<li><span class="info-label">Funkrufname:</span> Florian Stadt Wehlen 42-1</li>
|
||||
<li><span class="info-label">Fahrgestell:</span> MB Atego 818 F</li>
|
||||
<li><span class="info-label">Baujahr:</span> Juli 2007</li>
|
||||
<li><span class="info-label">Motorleistung:</span> 180 PS</li>
|
||||
<li><span class="info-label">Gesamtgewicht:</span> 8.600 kg</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Technische Daten & Ausstattung</h4>
|
||||
<ul class="spec-list small">
|
||||
<li><strong>Maße:</strong> L 6,39m | B 2,32m | H 3,00m</li>
|
||||
<li><strong>Sicherheit:</strong> ABS, Differentialsperre hinten</li>
|
||||
<li><strong>Licht/Warn:</strong> Martin-Horn (4 Becher), Pneumatik-Lichtmast (2x 1000W)</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Feuerwehrtechnische Beladung</h4>
|
||||
<div class="beladung-grid small">
|
||||
<ul class="mb-0">
|
||||
<li>FPN 10-1000-1H Einbaupumpe</li>
|
||||
<li>600 Liter Wassertank</li>
|
||||
<li>Tragkraftspritze TS 8/8</li>
|
||||
<li>Stromerzeuger 6,5 kW (Eisemann)</li>
|
||||
<li>3-teilige Schiebeleiter</li>
|
||||
<li>Lukas Schere/Spreizer Kombi SC 350</li>
|
||||
<li>Wärmebildkamera Bullard Eclipse</li>
|
||||
<li>Defibrillator (AED) "Zoll"</li>
|
||||
<li>Sanitätsrucksack & Watthosen</li>
|
||||
<li>Ölbindemittel & Kettensäge</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-5 mt-4 mt-lg-0">
|
||||
<div id="lf10Carousel" class="carousel slide" data-bs-ride="carousel">
|
||||
<div class="carousel-inner">
|
||||
<div class="carousel-item active"><img src="t_lf10_6_1.jpg" class="d-block w-100" alt="LF 10 Bild 1"></div>
|
||||
<div class="carousel-item"><img src="t_lf10_6_2.jpg" class="d-block w-100" alt="LF 10 Bild 2"></div>
|
||||
<div class="carousel-item"><img src="t_lf10_6_3.jpg" class="d-block w-100" alt="LF 10 Bild 3"></div>
|
||||
<div class="carousel-item"><img src="t_lf10_6_4.jpg" class="d-block w-100" alt="LF 10 Bild 4"></div>
|
||||
<div class="carousel-item"><img src="t_lf10_6_5.jpg" class="d-block w-100" alt="LF 10 Bild 5"></div>
|
||||
<div class="carousel-item"><img src="t_lf10_6_6.jpg" class="d-block w-100" alt="LF 10 Bild 6"></div>
|
||||
</div>
|
||||
<button class="carousel-control-prev" type="button" data-bs-target="#lf10Carousel" data-bs-slide="prev">
|
||||
<span class="carousel-control-prev-icon"></span>
|
||||
</button>
|
||||
<button class="carousel-control-next" type="button" data-bs-target="#lf10Carousel" data-bs-slide="next">
|
||||
<span class="carousel-control-next-icon"></span>
|
||||
</button>
|
||||
</div>
|
||||
<p class="text-center text-muted mt-3 small"><em>Erstangriffsfahrzeug für Brand & Hilfeleistung</em></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,237 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Feuerwehrboot RTB 1 | FFw Stadt Wehlen</title>
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="/nav.css">
|
||||
|
||||
<style>
|
||||
:root {
|
||||
--fw-rot: #900000;
|
||||
--fw-grau: #616161;
|
||||
--bg-light: #f8f9fa;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--bg-light);
|
||||
font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
/* Branding Navbar */
|
||||
.navbar-custom {
|
||||
background-color: #b30000 !important;
|
||||
background-image: url('/bilder/logo2.jpeg') !important;
|
||||
background-size: 7em !important;
|
||||
background-repeat: repeat !important;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.navbar-custom .navbar-brand {
|
||||
color: #ffffff !important;
|
||||
text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Page-Header mit Wasserzeichen */
|
||||
.page-header {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 40px 0;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.header-bg-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
height: 140%;
|
||||
opacity: 0.08;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
background: #fff;
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.custom-btn {
|
||||
background-color: var(--fw-grau);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 8px 20px;
|
||||
transition: all 0.3s ease;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.custom-btn:hover {
|
||||
background-color: var(--fw-rot) !important;
|
||||
color: white;
|
||||
transform: translateX(-5px);
|
||||
}
|
||||
|
||||
.detail-card {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
|
||||
border-left: 5px solid var(--fw-rot);
|
||||
padding: 30px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-weight: 700;
|
||||
color: var(--fw-grau);
|
||||
width: 160px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.spec-list {
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.spec-list li {
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px solid #f1f1f1;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin-top: 30px;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 700;
|
||||
border-left: 3px solid var(--fw-rot);
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.carousel-item img {
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 10px rgba(0,0,0,0.15);
|
||||
max-height: 450px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.highlight-badge {
|
||||
background-color: var(--fw-rot);
|
||||
color: white;
|
||||
padding: 4px 12px;
|
||||
border-radius: 20px;
|
||||
font-size: 0.9rem;
|
||||
margin-bottom: 15px;
|
||||
display: inline-block;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.info-box {
|
||||
background: #fdf2f2;
|
||||
border-radius: 8px;
|
||||
padding: 20px;
|
||||
border: 1px dashed var(--fw-rot);
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.info-label { width: 100%; margin-bottom: 5px; }
|
||||
.page-header h1 { font-size: 1.5rem; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-custom shadow-sm">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="/index.html">
|
||||
<img src="/ffw_transp_72.gif" alt="Logo" style="height: 3em; margin-right: 10px;">
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="page-header">
|
||||
<img src="/ffw_transp_72.gif" class="header-bg-icon" alt="">
|
||||
<h1>Feuerwehrboot (RTB 1)</h1>
|
||||
</div>
|
||||
|
||||
<div class="top-bar">
|
||||
<div class="container">
|
||||
<a href="/technik/technik.html" class="custom-btn">← Zurück zur Technik-Übersicht</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="detail-card">
|
||||
<div class="row">
|
||||
<div class="col-lg-7">
|
||||
<span class="highlight-badge">Standort: Pötzscha</span>
|
||||
<h2 style="color: var(--fw-rot); font-weight: 700;">Bootsdaten</h2>
|
||||
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Bezeichnung:</span> Rettungsboot RTB 1</li>
|
||||
<li><span class="info-label">Norm:</span> DIN 14961</li>
|
||||
<li><span class="info-label">Typ:</span> Barru LGL 400-BKL</li>
|
||||
<li><span class="info-label">Baujahr:</span> März 2014</li>
|
||||
<li><span class="info-label">Zuladung:</span> 550 kg (max. 5 Personen)</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Technische Details</h4>
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Maße:</span> L 4,13m | B 1,80m | T 0,18m</li>
|
||||
<li><span class="info-label">Motorisierung:</span> Suzuki 25 PS (4-Takt)</li>
|
||||
<li><span class="info-label">Besonderheit:</span> Absenkbare Bugklappe</li>
|
||||
<li><span class="info-label">Zubehör:</span> Hochwasserräder für Landtransport</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Einsatzprofil</h4>
|
||||
<div class="info-box">
|
||||
<p class="mb-0">Das RTB 1 ist ein extrem vielseitiges Arbeitsmittel. Durch die <strong>Bugklappe</strong> können Personen im Wasser ohne Kraftaufwand direkt aufgenommen werden. Zudem dient es bei Hochwasser als wichtiges Transportmittel für Sandsäcke oder zur Evakuierung in engen Gassen.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-5 mt-4 mt-lg-0">
|
||||
<div id="rtbCarousel" class="carousel slide shadow-sm" data-bs-ride="carousel">
|
||||
<div class="carousel-inner">
|
||||
<div class="carousel-item active">
|
||||
<img src="t_aluboot_rtb1_1.jpg" class="d-block w-100" alt="RTB 1 Elbe">
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="t_aluboot_rtb1_2.jpg" class="d-block w-100" alt="RTB 1 Details">
|
||||
</div>
|
||||
</div>
|
||||
<button class="carousel-control-prev" type="button" data-bs-target="#rtbCarousel" data-bs-slide="prev">
|
||||
<span class="carousel-control-prev-icon"></span>
|
||||
</button>
|
||||
<button class="carousel-control-next" type="button" data-bs-target="#rtbCarousel" data-bs-slide="next">
|
||||
<span class="carousel-control-next-icon"></span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="alert alert-info mt-3 py-2 small border-0 text-center" style="background-color: #e7f1ff; color: #084298;">
|
||||
<em>Speziell optimiert für Elbe-Einsätze und Hochwasserlagen</em>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,202 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Schlauchboot RTB 1 | FFw Stadt Wehlen</title>
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="/nav.css">
|
||||
|
||||
<style>
|
||||
:root {
|
||||
--fw-rot: #900000;
|
||||
--fw-grau: #616161;
|
||||
--bg-light: #f8f9fa;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--bg-light);
|
||||
font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
/* Navbar Styling */
|
||||
.navbar-custom {
|
||||
background-color: #b30000 !important;
|
||||
background-image: url('/bilder/logo2.jpeg') !important;
|
||||
background-size: 7em !important;
|
||||
background-repeat: repeat !important;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.navbar-custom .navbar-brand {
|
||||
color: #ffffff !important;
|
||||
text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Einheitlicher Page-Header */
|
||||
.page-header {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 40px 0;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.header-bg-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
height: 140%;
|
||||
opacity: 0.08;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
background: #fff;
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.custom-btn {
|
||||
background-color: var(--fw-grau);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 8px 20px;
|
||||
transition: all 0.3s ease;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.custom-btn:hover {
|
||||
background-color: var(--fw-rot) !important;
|
||||
color: white;
|
||||
transform: translateX(-5px);
|
||||
}
|
||||
|
||||
.detail-card {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
|
||||
border-left: 5px solid var(--fw-rot);
|
||||
padding: 30px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-weight: 700;
|
||||
color: var(--fw-grau);
|
||||
width: 160px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.spec-list {
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.spec-list li {
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px solid #f1f1f1;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin-top: 30px;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 700;
|
||||
border-left: 3px solid var(--fw-rot);
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.carousel-item img {
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 10px rgba(0,0,0,0.15);
|
||||
max-height: 450px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.info-label { width: 100%; margin-bottom: 5px; }
|
||||
.page-header h1 { font-size: 1.5rem; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-custom shadow-sm">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="/index.html">
|
||||
<img src="/ffw_transp_72.gif" alt="Logo" style="height: 3em; margin-right: 10px;">
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="page-header">
|
||||
<img src="/ffw_transp_72.gif" class="header-bg-icon" alt="">
|
||||
<h1>Schlauchboot RTB 1</h1>
|
||||
</div>
|
||||
|
||||
<div class="top-bar">
|
||||
<div class="container">
|
||||
<a href="/technik/technik.html" class="custom-btn">← Zurück zur Technik-Übersicht</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="detail-card">
|
||||
<div class="row">
|
||||
<div class="col-lg-7">
|
||||
<h2 style="color: var(--fw-rot); font-weight: 700;">Technische Daten</h2>
|
||||
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Bezeichnung:</span> Rettungsschlauchboot RTB 1</li>
|
||||
<li><span class="info-label">Standort:</span> Stadt Wehlen</li>
|
||||
<li><span class="info-label">Baujahr:</span> Mai 2003</li>
|
||||
<li><span class="info-label">Gewicht:</span> 33 kg (leicht & mobil)</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Leistungsdaten</h4>
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Maße:</span> L 3,00m | B 1,20m</li>
|
||||
<li><span class="info-label">Sicherheit:</span> 4 separate Luftkammern</li>
|
||||
<li><span class="info-label">Zuladung:</span> 570 kg (max. 3 Personen)</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Einsatzzweck</h4>
|
||||
<p>Das RTB 1 (Schlauchboot) ist unser "Flitzer" für kleine Gewässer oder schwer zugängliche Elbufer. Es ist in Sekundenschnelle einsatzbereit und kann aufgrund des geringen Gewichts von einer kleinen Truppe direkt zum Wasser getragen werden, ohne dass eine Slipstelle benötigt wird.</p>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-5 mt-4 mt-lg-0">
|
||||
<div id="rtbSchlauchCarousel" class="carousel slide" data-bs-ride="carousel">
|
||||
<div class="carousel-inner">
|
||||
<div class="carousel-item active">
|
||||
<img src="t_schlauchboot.jpg" class="d-block w-100" alt="Schlauchboot RTB 1">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-center text-muted mt-3 small"><em>Flexibel für die Wasserrettung</em></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,225 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Feuerwehrboot RTB 2 | FFw Stadt Wehlen</title>
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="/nav.css">
|
||||
|
||||
<style>
|
||||
:root {
|
||||
--fw-rot: #900000;
|
||||
--fw-grau: #616161;
|
||||
--bg-light: #f8f9fa;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--bg-light);
|
||||
font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
/* Branding Navbar */
|
||||
.navbar-custom {
|
||||
background-color: #b30000 !important;
|
||||
background-image: url('/bilder/logo2.jpeg') !important;
|
||||
background-size: 7em !important;
|
||||
background-repeat: repeat !important;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.navbar-custom .navbar-brand {
|
||||
color: #ffffff !important;
|
||||
text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Page-Header mit Wasserzeichen */
|
||||
.page-header {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 40px 0;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.header-bg-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
height: 140%;
|
||||
opacity: 0.08;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
background: #fff;
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.custom-btn {
|
||||
background-color: var(--fw-grau);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 8px 20px;
|
||||
transition: all 0.3s ease;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.custom-btn:hover {
|
||||
background-color: var(--fw-rot) !important;
|
||||
color: white;
|
||||
transform: translateX(-5px);
|
||||
}
|
||||
|
||||
.detail-card {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
|
||||
border-left: 5px solid var(--fw-rot);
|
||||
padding: 30px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-weight: 700;
|
||||
color: var(--fw-grau);
|
||||
width: 160px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.spec-list {
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.spec-list li {
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px solid #f1f1f1;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin-top: 30px;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 700;
|
||||
border-left: 3px solid var(--fw-rot);
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.carousel-item img {
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 10px rgba(0,0,0,0.15);
|
||||
max-height: 450px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.carousel-control-prev-icon, .carousel-control-next-icon {
|
||||
background-color: var(--fw-rot);
|
||||
border-radius: 50%;
|
||||
background-size: 50%;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.info-label { width: 100%; margin-bottom: 5px; }
|
||||
.page-header h1 { font-size: 1.5rem; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-custom shadow-sm">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="/index.html">
|
||||
<img src="/ffw_transp_72.gif" alt="Logo" style="height: 3em; margin-right: 10px;">
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="page-header">
|
||||
<img src="/ffw_transp_72.gif" class="header-bg-icon" alt="">
|
||||
<h1>Feuerwehrboot RTB 2</h1>
|
||||
</div>
|
||||
|
||||
<div class="top-bar">
|
||||
<div class="container">
|
||||
<a href="/technik/technik.html" class="custom-btn">← Zurück zur Technik-Übersicht</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="detail-card">
|
||||
<div class="row">
|
||||
<div class="col-lg-7">
|
||||
<h2 style="color: var(--fw-rot); font-weight: 700;">Bootsdaten</h2>
|
||||
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Bezeichnung:</span> Rettungsboot RTB 2</li>
|
||||
<li><span class="info-label">Funkrufname:</span> Florian Stadt Wehlen 79-1</li>
|
||||
<li><span class="info-label">Typ:</span> Fiskas Buster "L" Aluminium</li>
|
||||
<li><span class="info-label">Zuladung:</span> 590 kg (max. 6 Personen)</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Technische Daten</h4>
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Maße:</span> L 4,90m | B 1,97m | T 0,29m</li>
|
||||
<li><span class="info-label">Motorisierung:</span> Suzuki 40 PS (3-Zyl. 4-Takt)</li>
|
||||
<li><span class="info-label">Speed:</span> max. 33 Knoten (~ 61 km/h)</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Ausstattung & Beladung</h4>
|
||||
<ul class="spec-list small">
|
||||
<li><strong>Sondersignal:</strong> Blitzkennleuchte & Martinshorn auf Gerätebügel</li>
|
||||
<li><strong>Beleuchtung:</strong> 1x Fest-Suchscheinwerfer, 2x Hand-Suchscheinwerfer</li>
|
||||
<li><strong>Navigation:</strong> Echolot zur Tiefen- & Hindernismessung</li>
|
||||
<li><strong>Rettungsmittel:</strong> Rettungsbrett & Notfall-Set nach DIN</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-5 mt-4 mt-lg-0">
|
||||
<div id="rtb2Carousel" class="carousel slide" data-bs-ride="carousel">
|
||||
<div class="carousel-inner">
|
||||
<div class="carousel-item active">
|
||||
<img src="t_rtb2_1.jpg" class="d-block w-100" alt="RTB 2 Bild 1">
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="t_rtb2_2.jpg" class="d-block w-100" alt="RTB 2 Bild 2">
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="t_rtb2_3.jpg" class="d-block w-100" alt="RTB 2 Bild 3">
|
||||
</div>
|
||||
</div>
|
||||
<button class="carousel-control-prev" type="button" data-bs-target="#rtb2Carousel" data-bs-slide="prev">
|
||||
<span class="carousel-control-prev-icon"></span>
|
||||
</button>
|
||||
<button class="carousel-control-next" type="button" data-bs-target="#rtb2Carousel" data-bs-slide="next">
|
||||
<span class="carousel-control-next-icon"></span>
|
||||
</button>
|
||||
</div>
|
||||
<p class="text-center text-muted mt-3 small"><em>Das schnelle "Buster" für Einsätze auf der Elbe</em></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,229 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Schlauchtransportanhänger STA | FFw Stadt Wehlen</title>
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="/nav.css">
|
||||
|
||||
<style>
|
||||
:root {
|
||||
--fw-rot: #900000;
|
||||
--fw-grau: #616161;
|
||||
--bg-light: #f8f9fa;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--bg-light);
|
||||
font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
/* Branding Navbar */
|
||||
.navbar-custom {
|
||||
background-color: #b30000 !important;
|
||||
background-image: url('/bilder/logo2.jpeg') !important;
|
||||
background-size: 7em !important;
|
||||
background-repeat: repeat !important;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.navbar-custom .navbar-brand {
|
||||
color: #ffffff !important;
|
||||
text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Page-Header mit Wasserzeichen */
|
||||
.page-header {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 40px 0;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.header-bg-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
height: 140%;
|
||||
opacity: 0.08;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
background: #fff;
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.custom-btn {
|
||||
background-color: var(--fw-grau);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 8px 20px;
|
||||
transition: all 0.3s ease;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.custom-btn:hover {
|
||||
background-color: var(--fw-rot) !important;
|
||||
color: white;
|
||||
transform: translateX(-5px);
|
||||
}
|
||||
|
||||
.detail-card {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
|
||||
border-left: 5px solid var(--fw-rot);
|
||||
padding: 30px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-weight: 700;
|
||||
color: var(--fw-grau);
|
||||
width: 160px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.spec-list {
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.spec-list li {
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px solid #f1f1f1;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin-top: 30px;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 700;
|
||||
border-left: 3px solid var(--fw-rot);
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.carousel-item img {
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 10px rgba(0,0,0,0.15);
|
||||
max-height: 450px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.highlight-box {
|
||||
background: #fdf2f2;
|
||||
border: 1px dashed var(--fw-rot);
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.info-label { width: 100%; margin-bottom: 5px; }
|
||||
.page-header h1 { font-size: 1.5rem; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-custom shadow-sm">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="/index.html">
|
||||
<img src="/ffw_transp_72.gif" alt="Logo" style="height: 3em; margin-right: 10px;">
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="page-header">
|
||||
<img src="/ffw_transp_72.gif" class="header-bg-icon" alt="">
|
||||
<h1>Schlauchtransportanhänger (STA)</h1>
|
||||
</div>
|
||||
|
||||
<div class="top-bar">
|
||||
<div class="container">
|
||||
<a href="/technik/technik.html" class="custom-btn">← Zurück zur Technik-Übersicht</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="detail-card">
|
||||
<div class="row">
|
||||
<div class="col-lg-7">
|
||||
<h2 style="color: var(--fw-rot); font-weight: 700;">Fahrzeugdaten</h2>
|
||||
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Bezeichnung:</span> Schlauchtransportanhänger (STA)</li>
|
||||
<li><span class="info-label">Standort:</span> Stadt Wehlen</li>
|
||||
<li><span class="info-label">Typ:</span> Humbauer HA75/100</li>
|
||||
<li><span class="info-label">Baujahr:</span> Dezember 2004</li>
|
||||
<li><span class="info-label">Gesamtgewicht:</span> 750 kg</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Technische Details</h4>
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Maße:</span> L 3,56m | B 1,79m | H 2,35m</li>
|
||||
<li><span class="info-label">Ausstattung:</span> Hochplane, Heck-Arbeitsbeleuchtung</li>
|
||||
<li><span class="info-label">Besonderheit:</span> Schnellverlege-Vorrichtung</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Feuerwehrtechnische Beladung</h4>
|
||||
<div class="highlight-box">
|
||||
<p class="mb-2"><strong>Schlauchmaterial:</strong></p>
|
||||
<ul class="mb-3">
|
||||
<li><strong>38 B-Schläuche</strong> (insgesamt 760m), in Buchten gekoppelt</li>
|
||||
<li>2 Tragekörbe mit je 3 x 20m C-Schläuchen</li>
|
||||
</ul>
|
||||
<p class="mb-0 small text-muted"><strong>Armaturen:</strong> Standrohr, Hydrantenschlüssel, 2 C-Strahlrohre, Verteiler, Schlauchbrücken und Kupplungsschlüssel.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-5 mt-4 mt-lg-0">
|
||||
<div id="staCarousel" class="carousel slide" data-bs-ride="carousel">
|
||||
<div class="carousel-inner">
|
||||
<div class="carousel-item active">
|
||||
<img src="t_sta_1.jpg" class="d-block w-100" alt="STA Bild 1">
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="t_sta_2.jpg" class="d-block w-100" alt="STA Bild 2">
|
||||
</div>
|
||||
</div>
|
||||
<button class="carousel-control-prev" type="button" data-bs-target="#staCarousel" data-bs-slide="prev">
|
||||
<span class="carousel-control-prev-icon"></span>
|
||||
</button>
|
||||
<button class="carousel-control-next" type="button" data-bs-target="#staCarousel" data-bs-slide="next">
|
||||
<span class="carousel-control-next-icon"></span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="alert alert-danger mt-3 py-2 small shadow-sm">
|
||||
<strong>Einsatzvorteil:</strong> Verlegen von ca. 760m B-Leitung direkt während der Fahrt.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,351 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Technik | Feuerwehr Stadt Wehlen</title>
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="../css/nav.css">
|
||||
<link rel="stylesheet" href="../css/footer.css">
|
||||
|
||||
<style>
|
||||
:root {
|
||||
/* Grundfarben */
|
||||
--fw-rot: #900000; /* Dunkles Rot für Titel/Akzente */
|
||||
--fw-rot-hell: #b30000; /* Helleres Rot für Kachel-Hintergrund */
|
||||
--fw-grau: #616161; /* Standard-Grau */
|
||||
--bg-light: #f8f9fa; /* Seiten-Hintergrund */
|
||||
|
||||
/* NEU: Das dunkle Weinrot für Kontraste (statt Schwarz/Blau) */
|
||||
--text-dunkelrot: #3d0000;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--bg-light);
|
||||
font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
|
||||
color: #333; /* Standard-Text etwas weicher als tiefschwarz */
|
||||
}
|
||||
|
||||
/* NAVBAR-DESIGN (Mit logo2.jpeg Pattern) */
|
||||
.navbar-custom {
|
||||
background-color: var(--fw-rot-hell) !important;
|
||||
background-image: url('../bilder/logo2.jpeg') !important;
|
||||
background-size: 7em !important;
|
||||
background-repeat: repeat !important;
|
||||
padding: 1rem 0;
|
||||
border-bottom: 2px solid var(--text-dunkelrot);
|
||||
}
|
||||
|
||||
.navbar-custom .navbar-brand,
|
||||
.navbar-custom .nav-link {
|
||||
color: #ffffff !important;
|
||||
text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Hover & Aktiv: Dunkles Weinrot statt Schwarz/Blau */
|
||||
.navbar-custom .nav-link:hover,
|
||||
.navbar-custom .dropdown-item:hover,
|
||||
.navbar-custom .nav-link.active,
|
||||
.navbar-custom .dropdown-item.active {
|
||||
color: #ffffff !important;
|
||||
background-color: var(--text-dunkelrot) !important;
|
||||
}
|
||||
|
||||
.navbar-custom .dropdown-menu {
|
||||
background-color: var(--fw-rot) !important;
|
||||
background-image: url('../bilder/logo2.jpeg') !important;
|
||||
background-size: 9em !important;
|
||||
border: 1px solid var(--text-dunkelrot);
|
||||
}
|
||||
|
||||
.navbar-custom .dropdown-item {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
/* PAGE HEADER */
|
||||
.page-header {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 60px 0;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.header-bg-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
height: 120%;
|
||||
opacity: 0.07;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
/* TECHNIK CONTAINER & CARDS */
|
||||
.technik-container {
|
||||
max-width: 1100px;
|
||||
margin: 40px auto;
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
.technik-card {
|
||||
background: #fff;
|
||||
border: none;
|
||||
border-left: 5px solid var(--fw-rot);
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
|
||||
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
||||
margin-bottom: 30px;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.technik-card:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 8px 20px rgba(0,0,0,0.15);
|
||||
/* Hover-Akzent: Dunkles Weinrot */
|
||||
border-left-color: var(--text-dunkelrot);
|
||||
}
|
||||
|
||||
.card-img-wrapper {
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
background-color: #eee;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.card-img-wrapper img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.card-body-custom {
|
||||
padding: 1.25rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.card-body-custom h5 {
|
||||
margin: 0;
|
||||
font-weight: 700;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
/* FOOTER */
|
||||
footer {
|
||||
background-color: #fff;
|
||||
border-top: 1px solid #dee2e6;
|
||||
color: #555;
|
||||
}
|
||||
footer h6 { color: var(--text-dunkelrot); }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-custom shadow-sm">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="../index.html">
|
||||
<img src="../bilder/ffw_transp_72.gif" alt="Logo" style="height: 3em; margin-right: 10px;">
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="navbarNav">
|
||||
<ul class="navbar-nav ms-auto">
|
||||
<li class="nav-item"><a class="nav-link" href="#">Aktuelles</a></li>
|
||||
<li class="nav-item dropdown">
|
||||
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" data-bs-toggle="dropdown">Über uns</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a class="dropdown-item" href="../geschichte/Geschichte.html">Geschichte</a></li>
|
||||
<li><a class="dropdown-item active" href="technik.html">Technik</a></li>
|
||||
<li><a class="dropdown-item" href="../mitglieder/Organigramm.html">Mitglieder/Organigramm</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="nav-item"><a class="nav-link" href="#">Veranstaltungen</a></li>
|
||||
<li class="nav-item"><a class="nav-link" href="#">Kontakt/Impressum</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="page-header">
|
||||
<img src="../bilder/ffw_transp_72.gif" class="header-bg-icon" alt="BG-Icon">
|
||||
<h1>Unsere Technik</h1>
|
||||
<p class="lead text-muted">Einsatzfahrzeuge und Ausrüstung der Stadt Wehlen</p>
|
||||
</div>
|
||||
|
||||
<div class="technik-container">
|
||||
<div class="row g-4">
|
||||
|
||||
<div class="col-md-4 col-sm-6">
|
||||
<a href="lf10/lf10.html" class="technik-card">
|
||||
<div class="card-img-wrapper">
|
||||
<img src="technikpage/t_lf10_6_1.jpg" alt="LF 10/6">
|
||||
</div>
|
||||
<div class="card-body-custom">
|
||||
<h5>LF 10/6</h5>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4 col-sm-6">
|
||||
<a href="tsf/tsf.html" class="technik-card">
|
||||
<div class="card-img-wrapper">
|
||||
<img src="technikpage/t_tsf_01.jpg" alt="TSF-W">
|
||||
</div>
|
||||
<div class="card-body-custom">
|
||||
<h5>TSF-W</h5>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4 col-sm-6">
|
||||
<a href="VRW-Quad/VRW.html" class="technik-card">
|
||||
<div class="card-img-wrapper">
|
||||
<img src="technikpage/t_vrw_1.jpg" alt="VRW Quad">
|
||||
</div>
|
||||
<div class="card-body-custom">
|
||||
<h5>VRW Quad</h5>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4 col-sm-6">
|
||||
<a href="elw1/elw1.html" class="technik-card">
|
||||
<div class="card-img-wrapper">
|
||||
<img src="technikpage/t_elw1_1.jpg" alt="ELW 1">
|
||||
</div>
|
||||
<div class="card-body-custom">
|
||||
<h5>ELW 1</h5>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4 col-sm-6">
|
||||
<a href="rtb1/rtb1.html" class="technik-card">
|
||||
<div class="card-img-wrapper">
|
||||
<img src="technikpage/t_aluboot_rtb1_1.jpg" alt="Aluboot RTB 1">
|
||||
</div>
|
||||
<div class="card-body-custom">
|
||||
<h5>Aluboot RTB 1</h5>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4 col-sm-6">
|
||||
<a href="rtb2/rtb2.html" class="technik-card">
|
||||
<div class="card-img-wrapper">
|
||||
<img src="technikpage/t_rtb2_1.jpg" alt="RTB 2">
|
||||
</div>
|
||||
<div class="card-body-custom">
|
||||
<h5>Rettungsboot RTB 2</h5>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4 col-sm-6">
|
||||
<a href="rtb1schlauchboot/rtb1_Schlauchboot.html" class="technik-card">
|
||||
<div class="card-img-wrapper">
|
||||
<img src="technikpage/t_schlauchboot.jpg" alt="Schlauchboot">
|
||||
</div>
|
||||
<div class="card-body-custom">
|
||||
<h5>RTB 1 Schlauchboot</h5>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4 col-sm-6">
|
||||
<a href="sta/sta.html" class="technik-card">
|
||||
<div class="card-img-wrapper">
|
||||
<img src="technikpage/t_sta_1.jpg" alt="STA">
|
||||
</div>
|
||||
<div class="card-body-custom">
|
||||
<h5>STA Anhänger</h5>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4 col-sm-6">
|
||||
<a href="TSA-Anhaenger/TSA.html" class="technik-card">
|
||||
<div class="card-img-wrapper">
|
||||
<img src="technikpage/t_tsa_1.jpg" alt="TSA">
|
||||
</div>
|
||||
<div class="card-body-custom">
|
||||
<h5>TSA Anhänger</h5>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4 col-sm-6">
|
||||
<a href="Hydrantenwagen/Hydrantenwagen.html" class="technik-card">
|
||||
<div class="card-img-wrapper">
|
||||
<img src="technikpage/t_hydrantenwagen_1.jpg" alt="Hydrantenwagen">
|
||||
</div>
|
||||
<div class="card-body-custom">
|
||||
<h5>Hydrantenwagen (1905)</h5>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4 col-sm-6">
|
||||
<a href="lf1/lf1.html" class="technik-card">
|
||||
<div class="card-img-wrapper">
|
||||
<img src="technikpage/t_lf1_1.jpg" alt="LF 1">
|
||||
</div>
|
||||
<div class="card-body-custom">
|
||||
<h5>Postfahrrad LF 1</h5>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="col-md-4 col-sm-6">
|
||||
<a href="Transporthaenger/Transporthaenger.html" class="technik-card">
|
||||
<div class="card-img-wrapper">
|
||||
<img src="technikpage/t_transportanhaenger.jpg" alt="Transportanhänger">
|
||||
</div>
|
||||
<div class="card-body-custom">
|
||||
<h5>Transportanhänger</h5>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="container-fluid py-4 mt-5">
|
||||
<div class="row justify-content-center align-items-center">
|
||||
<div class="col-lg-4 col-md-5 text-lg-end text-center mb-3 mb-lg-0">
|
||||
<h6 class="fw-bold text-decoration-underline">Letzte Aktualisierung</h6>
|
||||
<p class="mb-0">17. März 2026</p>
|
||||
</div>
|
||||
<div class="col-lg-1 d-none d-lg-block"></div>
|
||||
<div class="col-lg-4 col-md-5 text-lg-start text-center">
|
||||
<h6 class="fw-bold text-decoration-underline">Statistik</h6>
|
||||
<p class="mb-0 small">Aktive: 27 | Jugend: 23 | Förderverein: 172</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,255 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>TSF Pötzscha | FFw Stadt Wehlen</title>
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="/nav.css">
|
||||
|
||||
<style>
|
||||
:root {
|
||||
--fw-rot: #900000;
|
||||
--fw-grau: #616161;
|
||||
--bg-light: #f8f9fa;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--bg-light);
|
||||
font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
/* Branding Navbar */
|
||||
.navbar-custom {
|
||||
background-color: #b30000 !important;
|
||||
background-image: url('/bilder/logo2.jpeg') !important;
|
||||
background-size: 7em !important;
|
||||
background-repeat: repeat !important;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.navbar-custom .navbar-brand {
|
||||
color: #ffffff !important;
|
||||
text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* Page-Header mit Wasserzeichen */
|
||||
.page-header {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
padding: 40px 0;
|
||||
background-color: #fff;
|
||||
overflow: hidden;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.header-bg-icon {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
height: 140%;
|
||||
opacity: 0.08;
|
||||
z-index: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.page-header h1 {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.top-bar {
|
||||
background: #fff;
|
||||
padding: 15px 0;
|
||||
border-bottom: 1px solid #dee2e6;
|
||||
}
|
||||
|
||||
.custom-btn {
|
||||
background-color: var(--fw-grau);
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
padding: 8px 20px;
|
||||
transition: all 0.3s ease;
|
||||
font-weight: 600;
|
||||
text-decoration: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.custom-btn:hover {
|
||||
background-color: var(--fw-rot) !important;
|
||||
color: white;
|
||||
transform: translateX(-5px);
|
||||
}
|
||||
|
||||
.detail-card {
|
||||
background: #fff;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.08);
|
||||
border-left: 5px solid var(--fw-rot);
|
||||
padding: 30px;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.info-label {
|
||||
font-weight: 700;
|
||||
color: var(--fw-grau);
|
||||
width: 160px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.spec-list {
|
||||
list-style: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.spec-list li {
|
||||
padding: 8px 0;
|
||||
border-bottom: 1px solid #f1f1f1;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin-top: 30px;
|
||||
color: var(--fw-rot);
|
||||
font-weight: 700;
|
||||
border-left: 3px solid var(--fw-rot);
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.carousel-item img {
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 10px rgba(0,0,0,0.15);
|
||||
max-height: 450px;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.highlight-badge {
|
||||
background-color: var(--fw-rot);
|
||||
color: white;
|
||||
padding: 4px 12px;
|
||||
border-radius: 20px;
|
||||
font-size: 0.9rem;
|
||||
margin-bottom: 15px;
|
||||
display: inline-block;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.beladung-box {
|
||||
background: #fdf2f2;
|
||||
border-radius: 8px;
|
||||
padding: 20px;
|
||||
border: 1px dashed var(--fw-rot);
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.info-label { width: 100%; margin-bottom: 5px; }
|
||||
.page-header h1 { font-size: 1.5rem; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-expand-lg navbar-custom shadow-sm">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand d-flex align-items-center" href="/index.html">
|
||||
<img src="/ffw_transp_72.gif" alt="Logo" style="height: 3em; margin-right: 10px;">
|
||||
<span>Feuerwehr Stadt Wehlen</span>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="page-header">
|
||||
<img src="/ffw_transp_72.gif" class="header-bg-icon" alt="">
|
||||
<h1>Tragkraftspritzenfahrzeug (TSF)</h1>
|
||||
</div>
|
||||
|
||||
<div class="top-bar">
|
||||
<div class="container">
|
||||
<a href="/technik/technik.html" class="custom-btn">← Zurück zur Technik-Übersicht</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="detail-card">
|
||||
<div class="row">
|
||||
<div class="col-lg-7">
|
||||
<span class="highlight-badge">Standort: Pötzscha</span>
|
||||
<h2 style="color: var(--fw-rot); font-weight: 700;">Stammdaten</h2>
|
||||
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Funkrufname:</span> Florian Pötzscha 47-1</li>
|
||||
<li><span class="info-label">Fahrgestell:</span> FIAT Ducato MAXI 2.3</li>
|
||||
<li><span class="info-label">Baujahr:</span> August 2002</li>
|
||||
<li><span class="info-label">Besatzung:</span> 1/5 (Staffelbesatzung)</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Technische Details</h4>
|
||||
<ul class="spec-list">
|
||||
<li><span class="info-label">Leistung:</span> 81 kW (110 PS)</li>
|
||||
<li><span class="info-label">Gesamtgewicht:</span> 3.500 kg (B-Führerschein fähig)</li>
|
||||
<li><span class="info-label">Maße:</span> L 5,20m | B 2,07m | H 2,39m</li>
|
||||
<li><span class="info-label">Sondersignalanlage:</span> Hella RTK 6</li>
|
||||
</ul>
|
||||
|
||||
<h4 class="section-title">Feuerwehrtechnische Beladung</h4>
|
||||
<div class="beladung-box mt-3">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<ul class="spec-list small mb-0">
|
||||
<li><i class="text-danger">●</i> Tragkraftspritze TS 8/8</li>
|
||||
<li><i class="text-danger">●</i> 4 Pressluftatmer (PA)</li>
|
||||
<li><i class="text-danger">●</i> 4-teilige Steckleiter</li>
|
||||
<li><i class="text-danger">●</i> Stromerzeuger 3,5 kW</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<ul class="spec-list small mb-0">
|
||||
<li><i class="text-danger">●</i> Motorsäge & Zubehör</li>
|
||||
<li><i class="text-danger">●</i> Lichtmast (2x 80W LED)</li>
|
||||
<li><i class="text-danger">●</i> Sanitätsrucksack</li>
|
||||
<li><i class="text-danger">●</i> Absicherungsmaterial</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-lg-5 mt-4 mt-lg-0">
|
||||
<div id="tsfCarousel" class="carousel slide shadow-sm" data-bs-ride="carousel">
|
||||
<div class="carousel-inner">
|
||||
<div class="carousel-item active">
|
||||
<img src="t_tsf_01.jpg" class="d-block w-100" alt="TSF Frontansicht">
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="t_tsf_02.jpg" class="d-block w-100" alt="TSF Seitenansicht">
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<img src="t_tsf_06.jpg" class="d-block w-100" alt="TSF Heckansicht">
|
||||
</div>
|
||||
</div>
|
||||
<button class="carousel-control-prev" type="button" data-bs-target="#tsfCarousel" data-bs-slide="prev">
|
||||
<span class="carousel-control-prev-icon"></span>
|
||||
</button>
|
||||
<button class="carousel-control-next" type="button" data-bs-target="#tsfCarousel" data-bs-slide="next">
|
||||
<span class="carousel-control-next-icon"></span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="alert alert-secondary mt-3 py-2 small border-0 text-center">
|
||||
<em>Vielseitiges Ersteinsatzfahrzeug der Ortswehr Pötzscha</em>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
49
veranstaltungen.html
Normal file
49
veranstaltungen.html
Normal file
@ -0,0 +1,49 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>Veranstaltungen | Feuerwehr Stadt Wehlen</title>
|
||||
<meta name="description" content="Feste und Veranstaltungen der Feuerwehr Stadt Wehlen." />
|
||||
|
||||
<script>window.FFW_BASE = "";</script>
|
||||
|
||||
<link
|
||||
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
|
||||
rel="stylesheet"
|
||||
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
<link rel="stylesheet" href="assets/style.css" />
|
||||
<link rel="icon" type="image/gif" href="bilder/ffw_transp_72.gif" />
|
||||
</head>
|
||||
|
||||
<body data-page="veranstaltungen">
|
||||
|
||||
<div id="site-header"></div>
|
||||
|
||||
<main>
|
||||
<header class="gl-seitenkopf">
|
||||
<div class="container">
|
||||
<h1>Veranstaltungen</h1>
|
||||
<p class="untertitel">Feste und Termine der Feuerwehr Stadt Wehlen – herzlich willkommen!</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="container py-5">
|
||||
<h2 class="abschnitt-titel">Kommende Veranstaltungen</h2>
|
||||
<p class="abschnitt-sub">Wir freuen uns auf Ihren Besuch</p>
|
||||
<div id="veranstaltungen-liste"><p class="termin-beschr">Wird geladen …</p></div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<div id="site-footer"></div>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
||||
crossorigin="anonymous"></script>
|
||||
<script src="data/dienste.js"></script>
|
||||
<script src="assets/components.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Loading…
x
Reference in New Issue
Block a user