Initial commit
This commit is contained in:
+508
@@ -0,0 +1,508 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Hofmann Wintergarten</title>
|
||||
<link rel="stylesheet" href="styles.css">
|
||||
</head>
|
||||
<body>
|
||||
<!-- Cookie Banner -->
|
||||
<div id="cookie-banner" class="cookie-banner hidden">
|
||||
<div class="cookie-content">
|
||||
<p>Diese Website verwendet Cookies, um Ihnen die bestmögliche Erfahrung zu bieten. Dazu gehört auch das Laden von externen Inhalten wie dem 3D-Viewer.</p>
|
||||
<div class="cookie-buttons">
|
||||
<button id="accept-cookies" class="btn btn-primary">Akzeptieren</button>
|
||||
<button id="decline-cookies" class="btn btn-secondary">Ablehnen</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Floating Navigation -->
|
||||
<nav class="navbar" id="navbar">
|
||||
<div class="nav-container">
|
||||
<a href="#home" class="logo-link">
|
||||
<img src="assets/Hofmann logo.png" alt="Hofmann Wintergarten" class="logo-img">
|
||||
</a>
|
||||
<div class="nav-highlight" id="nav-highlight"></div>
|
||||
<ul class="nav-links">
|
||||
<li data-section="ueber-uns"><a href="#ueber-uns">Über uns</a></li>
|
||||
<li data-section="leistungen"><a href="#leistungen">Leistungen</a></li>
|
||||
<li data-section="referenzen"><a href="#referenzen">Referenzen</a></li>
|
||||
<li data-section="showroom"><a href="#showroom">Showroom</a></li>
|
||||
<li data-section="partner"><a href="#partner">Partner</a></li>
|
||||
<li data-section="aktuelles"><a href="#aktuelles">Aktuelles</a></li>
|
||||
<li data-section="kontakt"><a href="#kontakt">Kontakt</a></li>
|
||||
</ul>
|
||||
<button class="mobile-menu-toggle" id="mobile-menu-toggle">
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
</button>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Mobile Menu -->
|
||||
<div class="mobile-menu" id="mobile-menu">
|
||||
<ul>
|
||||
<li><a href="#ueber-uns">Über uns</a></li>
|
||||
<li><a href="#leistungen">Leistungen</a></li>
|
||||
<li><a href="#referenzen">Referenzen</a></li>
|
||||
<li><a href="#showroom">Showroom</a></li>
|
||||
<li><a href="#partner">Partner</a></li>
|
||||
<li><a href="#aktuelles">Aktuelles</a></li>
|
||||
<li><a href="#kontakt">Kontakt</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Segment 1: Home / Image Carousel -->
|
||||
<section id="home" class="segment segment-hero" style="scroll-snap-align: start;">
|
||||
<div class="carousel" id="hero-carousel">
|
||||
<div class="carousel-slide active">
|
||||
<img src="assets/1 Kopf/Kopfbild - Kontakt-clean.png" alt="Kontakt">
|
||||
<div class="carousel-text">
|
||||
<h2 class="carousel-title">KONTAKT</h2>
|
||||
<p class="carousel-content">Rufen Sie uns an unter<br>09221 / 701855</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-slide">
|
||||
<img src="assets/1 Kopf/Kopfbild - Partner-clean.png" alt="Partner">
|
||||
<div class="carousel-text">
|
||||
<h2 class="carousel-title">PARTNER</h2>
|
||||
<p class="carousel-content">für Wintergärten,<br>Terrassenüberdachungen<br>und Markisen</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-slide">
|
||||
<img src="assets/1 Kopf/Kopfbild - Wohlfühloase-clean.png" alt="Wohlfühloase">
|
||||
<div class="carousel-text">
|
||||
<h2 class="carousel-title">WOHLFÜHLOASE</h2>
|
||||
<p class="carousel-content">Ihr FACHMANN für die sonnigen Momente</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-indicators">
|
||||
<span class="indicator active" data-slide="0"></span>
|
||||
<span class="indicator" data-slide="1"></span>
|
||||
<span class="indicator" data-slide="2"></span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="segment-separator"></div>
|
||||
|
||||
<!-- Segment 2: Über uns -->
|
||||
<section id="ueber-uns" class="segment segment-text">
|
||||
<div class="container">
|
||||
<h2 class="section-header">Über uns</h2>
|
||||
<div class="text-content">
|
||||
<p>Die Firma Hofmann ist Ihr kompetenter Partner für Wintergärten, Terrassenüberdachungen und Sonnenschutzsysteme. Seit über 30 Jahren stehen wir für Qualität, Innovation und Kundenzufriedenheit.</p>
|
||||
<p>Unser erfahrenes Team berät Sie umfassend und realisiert Ihre Wünsche mit höchster Präzision. Wir verwenden ausschließlich hochwertige Materialien und modernste Technologien, um Ihnen ein Produkt zu bieten, das überzeugt.</p>
|
||||
<p>Von der ersten Beratung bis zur finalen Montage begleiten wir Sie auf dem Weg zu Ihrem Traum-Wintergarten. Vertrauen Sie auf unsere Expertise und lassen Sie sich von unseren Referenzprojekten inspirieren.</p>
|
||||
<p>Wir freuen uns darauf, auch Ihr Projekt erfolgreich umzusetzen!</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="segment-separator"></div>
|
||||
|
||||
<!-- Segment 3: Leistungen - Carousel with arrows -->
|
||||
<section id="leistungen" class="segment segment-leistungen">
|
||||
<div class="container">
|
||||
<h2 class="section-header">Leistungen</h2>
|
||||
|
||||
<div class="leistungen-carousel-wrapper">
|
||||
<button class="carousel-arrow carousel-prev" id="leistungen-prev">❮</button>
|
||||
|
||||
<div class="leistungen-carousel">
|
||||
<div class="leistungen-track" id="leistungen-track">
|
||||
<!-- Markisen first with markilux logo -->
|
||||
<div class="leistung-slide active">
|
||||
<div class="leistung-image">
|
||||
<img src="assets/2 Leistungen/Markisen.jpg" alt="Markisen">
|
||||
</div>
|
||||
<div class="leistung-content">
|
||||
<div class="leistung-logo">
|
||||
<img src="assets/4 Partner/Partner Logos/Markilux.png" alt="Markilux">
|
||||
</div>
|
||||
<h3>Markisen</h3>
|
||||
<p>Flexible Beschattung für Terrasse und Balkon. Unsere Markisen bieten optimalen Sonnenschutz bei Bedarf.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="leistung-slide">
|
||||
<div class="leistung-image">
|
||||
<img src="assets/2 Leistungen/Balkonverglasungen.JPG" alt="Balkonverglasungen">
|
||||
</div>
|
||||
<div class="leistung-content">
|
||||
<h3>Balkonverglasungen</h3>
|
||||
<p>Genießen Sie Ihren Balkon das ganze Jahr über. Unsere Balkonverglasungen schützen vor Wind, Wetter und Lärm.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="leistung-slide">
|
||||
<div class="leistung-image">
|
||||
<img src="assets/2 Leistungen/Faltanlagen.jpg" alt="Faltanlagen">
|
||||
</div>
|
||||
<div class="leistung-content">
|
||||
<h3>Faltanlagen</h3>
|
||||
<p>Flexible Glaslösungen für Terrasse und Balkon. Unsere Faltanlagen verbinden Indoor-Komfort mit Outdoor-Feeling.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="leistung-slide">
|
||||
<div class="leistung-image">
|
||||
<img src="assets/2 Leistungen/Haustüren.jpg" alt="Haustüren">
|
||||
</div>
|
||||
<div class="leistung-content">
|
||||
<h3>Haustüren</h3>
|
||||
<p>Der erste Eindruck zählt. Unsere hochwertigen Haustüren kombinieren Sicherheit, Wärmedämmung und ansprechendes Design.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="leistung-slide">
|
||||
<div class="leistung-image">
|
||||
<img src="assets/2 Leistungen/Haustürüberdachungen.jpg" alt="Haustürüberdachungen">
|
||||
</div>
|
||||
<div class="leistung-content">
|
||||
<h3>Haustürüberdachungen</h3>
|
||||
<p>Schutz vor Regen und Schnee beim Eingang. Unsere Überdachungen bieten praktischen Wetterschutz mit ästhetischem Wert.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="leistung-slide">
|
||||
<div class="leistung-image">
|
||||
<img src="assets/2 Leistungen/Insektenschutz.jpg" alt="Insektenschutz">
|
||||
</div>
|
||||
<div class="leistung-content">
|
||||
<h3>Insektenschutz</h3>
|
||||
<p>Genießen Sie frische Luft ohne ungebetene Gäste. Unsere Insektenschutzsysteme sind unauffällig und effektiv.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="leistung-slide">
|
||||
<div class="leistung-image">
|
||||
<img src="assets/2 Leistungen/Terassenüberdachungen.jpg" alt="Terassenüberdachungen">
|
||||
</div>
|
||||
<div class="leistung-content">
|
||||
<h3>Terassenüberdachungen</h3>
|
||||
<p>Ihre Terrasse als Wohnraum im Freien. Unsere Überdachungen schaffen geschützte Außenbereiche für jedes Wetter.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="leistung-slide">
|
||||
<div class="leistung-image">
|
||||
<img src="assets/2 Leistungen/Wintergärten.jpg" alt="Wintergärten">
|
||||
</div>
|
||||
<div class="leistung-content">
|
||||
<h3>Wintergärten</h3>
|
||||
<p>Maßgeschneiderte Wintergärten für Ihr Zuhause. Lichtdurchflutete Räume zum Wohlfühlen – das ganze Jahr über.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="carousel-arrow carousel-next" id="leistungen-next">❯</button>
|
||||
</div>
|
||||
|
||||
<div class="leistungen-indicators" id="leistungen-indicators">
|
||||
<span class="indicator active" data-slide="0"></span>
|
||||
<span class="indicator" data-slide="1"></span>
|
||||
<span class="indicator" data-slide="2"></span>
|
||||
<span class="indicator" data-slide="3"></span>
|
||||
<span class="indicator" data-slide="4"></span>
|
||||
<span class="indicator" data-slide="5"></span>
|
||||
<span class="indicator" data-slide="6"></span>
|
||||
<span class="indicator" data-slide="7"></span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="segment-separator"></div>
|
||||
|
||||
<!-- Segment 4: Referenzen -->
|
||||
segment-3d
|
||||
<section id="referenzen" class="segment segment-slideshow">
|
||||
<div class="container">
|
||||
<h2 class="section-header">Referenzen</h2>
|
||||
</div>
|
||||
<div class="slideshow-wrapper">
|
||||
<div class="fullscreen-slideshow" id="referenzen-slideshow">
|
||||
<div class="slideshow-slide active">
|
||||
<img src="assets/3 Referenzen/Faltanlage.jpg" alt="Faltanlage">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Glashaus in Döhlau.jpg" alt="Glashaus in Döhlau">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Glashaus in Fassoldshof.jpg" alt="Glashaus in Fassoldshof">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Glashaus in Mainroth.jpg" alt="Glashaus in Mainroth">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Glashaus in Marktschorgast.jpg" alt="Glashaus in Marktschorgast">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Glashaus in Neustadt.jpg" alt="Glashaus in Neustadt">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Glashaus in Tröstau.JPG" alt="Glashaus in Tröstau">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Haustür in Schmeilsdorf.jpg" alt="Haustür in Schmeilsdorf">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Haustürüberdachung Neuenmarkt.jpg" alt="Haustürüberdachung Neuenmarkt">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Markise 1.jpg" alt="Markise">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Markise in Kulmbach.jpg" alt="Markise in Kulmbach">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Pergola Markise (2).jpg" alt="Pergola Markise">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Pergola Markise.jpg" alt="Pergola Markise">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Terassenüberdachung in Harsdorf.jpg" alt="Terassenüberdachung in Harsdorf">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Terassenüberdachungen in Heinersreuth.jpg" alt="Terassenüberdachungen in Heinersreuth">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Wintergarten in Eckersdorf.jpg" alt="Wintergarten in Eckersdorf">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Wintergarten in Kulmbach (1).jpg" alt="Wintergarten in Kulmbach">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Wintergarten in Kulmbach.jpg" alt="Wintergarten in Kulmbach">
|
||||
</div>
|
||||
<div class="slideshow-slide">
|
||||
<img src="assets/3 Referenzen/Wintergarten in Neudrossenfeld.jpg" alt="Wintergarten in Neudrossenfeld">
|
||||
</div>
|
||||
<div class="slideshow-indicators">
|
||||
<span class="indicator active" data-slide="0"></span>
|
||||
<span class="indicator" data-slide="1"></span>
|
||||
<span class="indicator" data-slide="2"></span>
|
||||
<span class="indicator" data-slide="3"></span>
|
||||
<span class="indicator" data-slide="4"></span>
|
||||
<span class="indicator" data-slide="5"></span>
|
||||
<span class="indicator" data-slide="6"></span>
|
||||
<span class="indicator" data-slide="7"></span>
|
||||
<span class="indicator" data-slide="8"></span>
|
||||
<span class="indicator" data-slide="9"></span>
|
||||
<span class="indicator" data-slide="10"></span>
|
||||
<span class="indicator" data-slide="11"></span>
|
||||
<span class="indicator" data-slide="12"></span>
|
||||
<span class="indicator" data-slide="13"></span>
|
||||
<span class="indicator" data-slide="14"></span>
|
||||
<span class="indicator" data-slide="15"></span>
|
||||
<span class="indicator" data-slide="16"></span>
|
||||
<span class="indicator" data-slide="17"></span>
|
||||
<span class="indicator" data-slide="18"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="segment-separator"></div>
|
||||
|
||||
<!-- Segment 5: Showroom (3D Viewer) -->
|
||||
<section id="showroom" class="segment segment-3d">
|
||||
<div class="container">
|
||||
<h2 class="section-header">Showroom</h2>
|
||||
</div>
|
||||
<div class="slideshow-wrapper">
|
||||
<div class="viewer-container" id="viewer-container">
|
||||
<div id="cookie-notice" class="cookie-notice hidden">
|
||||
<p>Um den 3D-Viewer zu nutzen, müssen Sie Cookies akzeptieren.</p>
|
||||
<button id="reopen-cookie-banner" class="btn btn-primary">Cookie-Einstellungen öffnen</button>
|
||||
</div>
|
||||
<iframe id="viewer-iframe" src="" border="0"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="segment-separator"></div>
|
||||
|
||||
<!-- Segment 6: Partner -->
|
||||
<section id="partner" class="segment segment-partner">
|
||||
<div class="container">
|
||||
<h2 class="section-header">Partner</h2>
|
||||
<div class="partner-grid">
|
||||
<div class="partner-item">
|
||||
<a href="https://solarlux.com" target="_blank" rel="noopener">
|
||||
<img src="assets/4 Partner/Partner Logos/Solarlux.jpg" alt="Solarlux">
|
||||
<span>Solarlux</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="partner-item">
|
||||
<a href="https://markilux.com" target="_blank" rel="noopener">
|
||||
<img src="assets/4 Partner/Partner Logos/Markilux.png" alt="Markilux">
|
||||
<span>Markilux</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="partner-item">
|
||||
<a href="https://elsner-elektronik.de" target="_blank" rel="noopener">
|
||||
<img src="assets/4 Partner/Partner Logos/Elsner.png" alt="Elsner">
|
||||
<span>Elsner</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="partner-item">
|
||||
<a href="https://albohn.de" target="_blank" rel="noopener">
|
||||
<img src="assets/4 Partner/Partner Logos/albohn tebau links.jpg" alt="Albohn">
|
||||
<span>Albohn</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="partner-item">
|
||||
<a href="https://reflexa.de" target="_blank" rel="noopener">
|
||||
<img src="assets/4 Partner/Partner Logos/Reflexa.jpg" alt="Reflexa">
|
||||
<span>Reflexa</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="partner-item">
|
||||
<a href="https://alulux.de" target="_blank" rel="noopener">
|
||||
<img src="assets/4 Partner/Partner Logos/Alulux.png" alt="Alulux">
|
||||
<span>Alulux</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="partner-item">
|
||||
<a href="https://ts-alu.de" target="_blank" rel="noopener">
|
||||
<img src="assets/4 Partner/Partner Logos/TS Alumium (1).jpg" alt="TS Alu">
|
||||
<span>TS Alu</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="partner-item">
|
||||
<a href="https://rmf-vordach.de" target="_blank" rel="noopener">
|
||||
<img src="assets/4 Partner/Partner Logos/RMF.png" alt="RMF">
|
||||
<span>RMF</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="partner-item">
|
||||
<a href="https://rudolph-insektenschutz.de" target="_blank" rel="noopener">
|
||||
<img src="assets/4 Partner/Partner Logos/Rudolph.jpg" alt="Rudolph">
|
||||
<span>Rudolph</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="partner-item">
|
||||
<a href="https://therma.de" target="_blank" rel="noopener">
|
||||
<img src="assets/4 Partner/Partner Logos/Therma.jpg" alt="Therma">
|
||||
<span>Therma</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="partner-item">
|
||||
<a href="https://schoeninger-glas.de" target="_blank" rel="noopener">
|
||||
<img src="assets/4 Partner/Partner Logos/Schoeninger.png" alt="Schöninger Glas">
|
||||
<span>Schöninger Glas</span>
|
||||
</a>
|
||||
</div>
|
||||
<div class="partner-item">
|
||||
<div class="partner-no-link">
|
||||
<img src="assets/4 Partner/Partner Logos/Solan.jpg" alt="Solan">
|
||||
<span>Solan</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="segment-separator"></div>
|
||||
|
||||
<!-- Segment 7: Aktuelles -->
|
||||
<section id="aktuelles" class="segment segment-news">
|
||||
<div class="container">
|
||||
<h2 class="section-header">Aktuelles</h2>
|
||||
<div class="news-content">
|
||||
<article class="news-item">
|
||||
<h3>Tag der offenen Tür</h3>
|
||||
<p class="news-date">15. März 2024</p>
|
||||
<p>Wir laden Sie herzlich ein zu unserem Tag der offenen Tür am Samstag, den 15. März 2024 von 10:00 bis 16:00 Uhr. Lassen Sie sich von unseren neuesten Projekten inspirieren und nutzen Sie die Gelegenheit für ein persönliches Gespräch mit unserem Team.</p>
|
||||
<p>Erleben Sie hautnah die Qualität unserer Wintergärten und lassen Sie sich unverbindlich beraten. Für das leibliche Wohl ist selbstverständlich gesorgt.</p>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="segment-separator"></div>
|
||||
|
||||
<!-- Segment 8: Kontakt -->
|
||||
<section id="kontakt" class="segment segment-contact">
|
||||
<div class="container">
|
||||
<h2 class="section-header">Kontakt</h2>
|
||||
<div class="contact-wrapper">
|
||||
<div class="contact-info">
|
||||
<h3>Hofmann Wintergartentechnik</h3>
|
||||
<h3>Inhaber: Harry Hofmann</h3>
|
||||
<address>
|
||||
<p>Maingasse 10</p>
|
||||
<p>95326 Kulmbach - Melkendorf</p>
|
||||
<p>Tel: <a href="tel:00499221701855">+49 (0)9221 / 70 18 55</a></p>
|
||||
<p>Fax: +49 (0)9221 / 70 18 57</p>
|
||||
<p>E-Mail: <a href="mailto:info@wintergarten-hofmann.de">info@wintergarten-hofmann.de</a></p>
|
||||
</address>
|
||||
</div>
|
||||
<div class="contact-form-wrapper">
|
||||
<h3>Schreiben Sie uns</h3>
|
||||
<form id="contact-form" class="contact-form">
|
||||
<div class="form-group">
|
||||
<label for="name">Name *</label>
|
||||
<input type="text" id="name" name="name" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="email">E-Mail *</label>
|
||||
<input type="email" id="email" name="email" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="phone">Telefon</label>
|
||||
<input type="tel" id="phone" name="phone">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="subject">Betreff *</label>
|
||||
<input type="text" id="subject" name="subject" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="message">Nachricht *</label>
|
||||
<textarea id="message" name="message" rows="5" required></textarea>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="checkbox-label">
|
||||
<input type="checkbox" name="privacy" required>
|
||||
<span>Ich habe die <a href="datenschutz.html">Datenschutzerklärung</a> gelesen und stimme der Verarbeitung meiner Daten zu. *</span>
|
||||
</label>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary">Nachricht senden</button>
|
||||
</form>
|
||||
<div id="form-success" class="form-message success hidden">
|
||||
<p>Vielen Dank für Ihre Nachricht! Wir werden uns umgehend bei Ihnen melden.</p>
|
||||
</div>
|
||||
<div id="form-error" class="form-message error hidden">
|
||||
<p>Es ist ein Fehler aufgetreten. Bitte versuchen Sie es später erneut.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Footer integrated into Kontakt segment -->
|
||||
<div class="footer-content">
|
||||
<div class="footer-nav">
|
||||
<a href="#ueber-uns">Über uns</a>
|
||||
<a href="#leistungen">Leistungen</a>
|
||||
<a href="#referenzen">Referenzen</a>
|
||||
<a href="#showroom">Showroom</a>
|
||||
<a href="#partner">Partner</a>
|
||||
<a href="#aktuelles">Aktuelles</a>
|
||||
<a href="#kontakt">Kontakt</a>
|
||||
<a href="datenschutz.html">Datenschutz</a>
|
||||
<a href="impressum.html">Impressum</a>
|
||||
</div>
|
||||
<div class="footer-bottom">
|
||||
<p>© 2026 Hofmann Wintergartentechnik. Alle Rechte vorbehalten.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<script src="script.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user