209 lines
6.7 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!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>