morri/hotel-am-see
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
hotel-am-see/services.html
Jontil88 2b462bc0e6 Initial commit: Hotel am See website with bilingual i18n (DE/EN) 
- Static HTML hotel website with Bootstrap 5
- i18next-based client-side internationalization
- Language switcher (DE/EN) in navbar
- German and English translation JSON files
- Translated: navigation, content, forms, FAQ, legal pages (AGB)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-13 22:49:57 +01:00

356 lines
12 KiB
HTML
Raw Blame History

<!doctype html>
<html lang="de">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Roboto&family=Work+Sans:wght@400;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="fonts/icomoon/style.css">
<link rel="stylesheet" href="fonts/flaticon/font/flaticon.css">
<link rel="stylesheet" href="css/tiny-slider.css">
<link rel="stylesheet" href="css/aos.css">
<link rel="stylesheet" href="css/flatpickr.min.css">
<link rel="stylesheet" href="css/glightbox.min.css">
<link rel="stylesheet" href="css/style.css">
<title>Hotel am See &mdash;Ihre Unterkunft in Obermaubach</title>
</head>
<body>
<div class="site-mobile-menu site-navbar-target">
<div class="site-mobile-menu-header">
<div class="site-mobile-menu-close">
<span class="icofont-close js-menu-toggle"></span>
</div>
</div>
<div class="site-mobile-menu-body"></div>
</div>
<nav class="site-nav">
<div class="container">
<div class="menu-bg-wrap">
<div class="site-navigation">
<div class="row g-0 align-items-center">
<div class="col-2">
<a href="index.html" class="logo m-0 float-start text-white" data-i18n="common.logo">Hotel am See</a>
</div>
<div class="col-8 text-center">
<ul class="js-clone-nav d-none d-lg-inline-block text-start site-menu mx-auto">
<li><a href="index.html" data-i18n="common.nav.home">Home</a></li>
<li><a href="rooms.html" data-i18n="common.nav.rooms">Unsere Zimmer</a></li>
<li class="active"><a href="services.html" data-i18n="common.nav.services">Services</a></li>
<li><a href="about.html" data-i18n="common.nav.about">Über uns</a></li>
<li><a href="contact.html" data-i18n="common.nav.contact">Kontakt</a></li>
<li><a href="impressum.html" data-i18n="common.nav.impressum">Impressum</a></li>
</ul>
</div>
<div class="col-2 text-end">
<a href="#" class="burger ms-auto float-end site-menu-toggle js-menu-toggle d-inline-block d-lg-none light">
<span></span>
</a>
<div class="lang-switcher float-end" role="navigation" aria-label="Sprachwahl / Language selection">
<a href="#" class="lang-option active" data-lang="de" aria-label="Deutsch" aria-current="true">DE</a>
<span class="lang-divider" aria-hidden="true">|</span>
<a href="#" class="lang-option" data-lang="en" aria-label="English">EN</a>
</div>
<a href="#" class="call-us d-flex align-items-center">
<span class="icon-phone"></span>
<span data-i18n="[html]common.phone">+49 2422 / 504 48 66<br>+49 0176 / 847 34 595</span>
</a>
</div>
</div>
</div>
</div>
</div>
</nav>
<div class="hero overlay" style="background-image: url('images/img_3.jpg')">
<div class="container">
<div class="row align-items-center justify-content-center">
<div class="col-lg-8 text-center">
<h1 class="heading text-white" data-aos="fade-up" data-i18n="services.hero_heading">Unser Service</h1>
<p class="text-white-50 w-75 mx-auto" data-aos="fade-up" data-aos-delay="100" data-i18n="services.hero_subtitle">Unser ausgezeichneter Service sorgt dafür, dass Ihr Aufenthalt bei uns unvergesslich wird.</p>
</div>
</div>
</div>
</div>
<div class="section sec-features bg-light">
<div class="container">
<div class="row mb-5">
<div class="col-lg-6" data-aos="fade-up">
<h2 class="heading" data-i18n="services.service_heading">Unser Service</h2>
</div>
<div class="col-lg-6 text-end">
</div>
</div>
</div>
<div class="features-slider-wrap" data-aos="fade-up" data-aos-delay="100">
<div class="features-slider" id="features-slider">
<div class="item">
<div class="feature bg-color-1">
<span class="flaticon-trekking"></span>
<h3 data-i18n="services.breakfast_title">Frühstück</h3>
<p class="text-black-50" data-i18n="services.breakfast_text">Beginnen Sie den Tag mit einem köstlichen Frühstück in unserem Hotel in Obermaubach. Unser umfassendes Frühstücksbuffet
bietet für jeden Geschmack das Richtige: Frisches Brot und Brötchen, eine große Auswahl an Wurst und Käse, frisches Obst
und Gemüse, Eier in verschiedenen Varianten und viele weitere Leckereien. Dazu servieren wir Ihnen frisch gebrühten
Kaffee und verschiedene Teesorten.</p>
<!--<a href="#" class="more d-block">Learn More</a>-->
</div>
</div>
<div class="item">
<div class="feature bg-color-2">
<span class="flaticon-map"></span>
<h3 data-i18n="services.events_title">Veranstaltungen</h3>
<p class="text-black-50" data-i18n="services.events_text">Planen Sie Ihre nächste Veranstaltung bei uns und erleben Sie den perfekten Rahmen für ein erfolgreiches Event mit bis zu 40 Gästen</p>
<!--<a href="#" class="more d-block">Learn More</a>-->
</div>
</div>
<div class="item">
<div class="feature bg-color-3">
<span class="flaticon-suitcase"></span>
<h3 data-i18n="services.luggage_title">Gepäck</h3>
<p class="text-black-50" data-i18n="services.luggage_text">Sie wollen noch nach Ihrem Check Out in der Umgebung was unternehmen? Wir passen auf Ihr Gepäck auf.</p>
<!--<a href="#" class="more d-block">Learn More</a>-->
</div>
</div>
</div>
</div>
</div>
<div class="section ">
<div class="container">
<div class="row">
<div class="col-lg-7" data-aos="fade-up" data-aos-delay="100">
<div id="features-slider-nav">
<button class="btn btn-primary prev" data-controls="prev" data-i18n="common.prev">Zurück</button>
<button class="btn btn-primary next" data-controls="next" data-i18n="common.next">Weiter</button>
</div>
</div>
</div>
</div>
</div>
<div class="section sec-about">
<div class="container">
<div class="row g-5 justify-content-between">
<div class="col-lg-6 has-bg" data-aos="fade-right">
<img src="images/about_1.jpg" alt="Image" class="img-fluid img-box-shadow rounded">
</div>
<div class="col-lg-4 align-self-center" data-aos="fade-left" data-aos-delay="100">
<h2 class="heading mb-4" data-i18n="services.why_heading"><br><br><br><br>Warum zu uns?</h2>
<p data-i18n="services.why_text">Unser Hotel in Obermaubach bietet Ihnen alles, was Sie für einen unvergesslichen Aufenthalt brauchen: Eine idyllische
Lage in der wunderschönen Voreifel, komfortable Zimmer und einen ausgezeichneten Service. Wir
möchten, dass Sie sich bei uns wie Zuhause fühlen und unvergessliche Erinnerungen mit nach Hause nehmen.</p>
</div>
</div>
</div>
</div>
<div class="section sec-instagram">
<div class="container mb-5">
<div class="row">
<div class="col-lg-3" data-aos="fade-up">
<h2 class="heading" data-i18n="services.impressions_heading">Impressionen</h2>
</div>
<div class="col-lg-7" data-aos="fade-up" data-aos-delay="100">
</div>
</div>
</div>
<div class="instagram-slider-wrap" data-aos="fade-up" data-aos-delay="200">
<div class="instagram-slider" id="instagram-slider">
<div class="item">
<a class="instagram-item">
<span class="icon-instagram"></span>
<img src="images/img_1.jpg" alt="Image" class="img-fluid">
</a>
</div>
<div class="item">
<a class="instagram-item">
<span class="icon-instagram"></span>
<img src="images/img_2.jpg" alt="Image" class="img-fluid">
</a>
</div>
<div class="item">
<a class="instagram-item">
<span class="icon-instagram"></span>
<img src="images/img_3.jpg" alt="Image" class="img-fluid">
</a>
</div>
<div class="item">
<a class="instagram-item">
<span class="icon-instagram"></span>
<img src="images/img_4.jpg" alt="Image" class="img-fluid">
</a>
</div>
<div class="item">
<a class="instagram-item">
<span class="icon-instagram"></span>
<img src="images/img_2.jpg" alt="Image" class="img-fluid">
</a>
</div>
<div class="item">
<a class="instagram-item">
<span class="icon-instagram"></span>
<img src="images/img_3.jpg" alt="Image" class="img-fluid">
</a>
</div>
<div class="item">
<a class="instagram-item">
<span class="icon-instagram"></span>
<img src="images/img_4.jpg" alt="Image" class="img-fluid">
</a>
</div>
</div>
</div>
</div>
<div class="site-footer bg-light">
<div class="container">
<div class="row">
<div class="col-6 col-sm-6 col-md-6 col-lg-3">
<div class="widget">
<h3></h3>
<ul class="list-unstyled float-left links">
<!--<li><a href="#">About us</a></li>
<li><a href="#">Places</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Destination</a></li>
<li><a href="#">Terms</a></li>
<li><a href="#">Privacy</a></li>-->
</ul>
</div> <!-- /.widget -->
</div> <!-- /.col-lg-3 -->
<div class="col-6 col-sm-6 col-md-6 col-lg-3">
<div class="widget">
<h3> </h3>
<ul class="list-unstyled float-left links">
<!--<li><a href="#">Travel</a></li>
<li><a href="#">Popular places</a></li>
<li><a href="#">Destination</a></li>
<li><a href="#">Tour</a></li>
<li><a href="#">Family Vacation</a></li>-->
</ul>
</div> <!-- /.widget -->
</div> <!-- /.col-lg-3 -->
<div class="col-6 col-sm-6 col-md-6 col-lg-3">
<div class="widget">
<h3></h3>
<ul class="list-unstyled float-left links">
<!--<li><a href="#">Tour</a></li>
<li><a href="#">Swimming</a></li>
<li><a href="#">Kayak</a></li>
<li><a href="#">Surfing</a></li>-->
</ul>
</div> <!-- /.widget -->
</div> <!-- /.col-lg-3 -->
<div class="col-6 col-sm-6 col-md-6 col-lg-3">
<div class="widget">
<h3 data-i18n="common.footer.contact_heading">Kontakt</h3>
<address data-i18n="[html]common.footer.address">Seestraße 2D,<br> 52372 Kreuzau-Obermaubach</address>
<ul class="list-unstyled links mb-4">
<li><a href="tel://+4924225044866">+49(2422) 504 48 66</a></li>
<li><a href="tel://+4916084734595">+49(160) 84734 595</a></li>
<li><a href="mailto:info@hotel-obermaubach.de">info@hotel-obermaubach.de</a></li>
</ul>
<h3 data-i18n="common.footer.connect_heading">Connect</h3>
<ul class="list-unstyled social">
<li><a href="#"><span class="icon-instagram"></span></a></li>
<!--<li><a href="#"><span class="icon-twitter"></span></a></li>
<li><a href="#"><span class="icon-facebook"></span></a></li>
<li><a href="#"><span class="icon-linkedin"></span></a></li>
<li><a href="#"><span class="icon-pinterest"></span></a></li>
<li><a href="#"><span class="icon-dribbble"></span></a></li>-->
</ul>
</div> <!-- /.widget -->
</div> <!-- /.col-lg-3 -->
</div> <!-- /.row -->
<div class="row mt-5">
<div class="col-12 text-center">
<p data-i18n="[html]common.footer.copyright">Copyright &copy;
<script>document.write(new Date().getFullYear());</script> All rights reserved | <i class="icon-heart text-danger"
aria-hidden="true"></i>
</p>
</div>
</div>
</div> <!-- /.container -->
</div> <!-- /.site-footer -->
<!-- Preloader -->
<div id="overlayer"></div>
<div class="loader">
<div class="spinner-border text-primary" role="status">
<span class="visually-hidden" data-i18n="common.loading">Loading...</span>
</div>
</div>
<script src="js/bootstrap.bundle.min.js"></script>
<script src="js/tiny-slider.js"></script>
<script src="js/flatpickr.min.js"></script>
<script src="js/glightbox.min.js"></script>
<script src="https://unpkg.com/i18next@23.16.8/i18next.min.js"></script>
<script src="https://unpkg.com/i18next-http-backend@3.0.2/i18nextHttpBackend.min.js"></script>
<script src="js/i18n.js"></script>
<script src="js/aos.js"></script>
<script src="js/navbar.js"></script>
<script src="js/counter.js"></script>
<script src="js/custom.js"></script>
</body>
</html>
Reference in a new issue View git blame Copy permalink