| <!DOCTYPE html> |
| <html lang="de"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>Kochkunstführer - Hommage an Escoffé</title> |
| <link rel="icon" type="image/x-icon" href="/static/favicon.ico"> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700&family=Raleway:wght@300;400;600&display=swap" rel="stylesheet"> |
| <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet"> |
| <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script> |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> |
| <script src="https://unpkg.com/feather-icons"></script> |
| <style> |
| body { |
| font-family: 'Raleway', sans-serif; |
| background-color: #f9f5f0; |
| color: #4a3c2d; |
| } |
| h1, h2, h3, h4 { |
| font-family: 'Playfair Display', serif; |
| } |
| .wood-bg { |
| background-color: #8B4513; |
| } |
| .brass-text { |
| color: #CD7F32; |
| } |
| .brass-border { |
| border-color: #CD7F32; |
| } |
| .ornament-divider { |
| height: 3px; |
| background: linear-gradient(to right, transparent, #CD7F32, transparent); |
| margin: 2rem 0; |
| } |
| .video-container { |
| position: relative; |
| padding-bottom: 56.25%; |
| height: 0; |
| overflow: hidden; |
| border: 3px solid #CD7F32; |
| border-radius: 8px; |
| } |
| .video-container iframe { |
| position: absolute; |
| top: 0; |
| left: 0; |
| width: 100%; |
| height: 100%; |
| } |
| .book-cover { |
| box-shadow: 0 10px 25px rgba(139, 69, 19, 0.3); |
| transform: rotate(-2deg); |
| transition: all 0.3s ease; |
| } |
| .book-cover:hover { |
| transform: rotate(0deg) scale(1.03); |
| } |
| .decorative-element { |
| position: absolute; |
| opacity: 0.1; |
| z-index: -1; |
| } |
| </style> |
| </head> |
| <body class="relative"> |
| |
| <div class="decorative-element top-10 left-10 w-24 h-24 border-t-2 border-l-2 border-brass-text"></div> |
| <div class="decorative-element bottom-20 right-10 w-16 h-16 border-b-2 border-r-2 border-brass-text"></div> |
| |
| |
| <header class="wood-bg text-white py-6 px-4 md:px-8"> |
| <div class="container mx-auto flex flex-col md:flex-row justify-between items-center"> |
| <div class="text-center md:text-left mb-4 md:mb-0"> |
| <h1 class="text-3xl md:text-4xl font-bold">Kochkunstführer</h1> |
| <p class="text-brass-text mt-1">Hommage an Auguste Escoffé</p> |
| </div> |
| <nav class="flex space-x-6"> |
| <a href="#" class="hover:text-brass-text transition">Über das Werk</a> |
| <a href="#" class="hover:text-brass-text transition">Galerie</a> |
| <a href="#" class="hover:text-brass-text transition">Kontakt</a> |
| </nav> |
| </div> |
| </header> |
|
|
| |
| <section class="py-12 md:py-20 px-4 md:px-8 relative"> |
| <div class="container mx-auto flex flex-col md:flex-row items-center"> |
| <div class="md:w-1/2 mb-10 md:mb-0" data-aos="fade-right"> |
| <div class="relative"> |
| <div class="book-cover bg-white p-6 rounded shadow-lg border-2 border-brass-text"> |
| <h2 class="text-2xl font-bold mb-4">Kochkunstführer</h2> |
| <p class="italic mb-2">von Auguste Escoffé</p> |
| <p class="text-sm mb-4">Die Kunst des Kochens im 19. Jahrhundert - Digitalisiert und neu interpretiert</p> |
| <div class="flex items-center mt-6"> |
| <div class="w-10 h-10 rounded-full bg-brass-text flex items-center justify-center mr-3"> |
| <i data-feather="book" class="text-white"></i> |
| </div> |
| <p class="text-sm">Originalausgabe 1885</p> |
| </div> |
| </div> |
| </div> |
| </div> |
| <div class="md:w-1/2 md:pl-12" data-aos="fade-left"> |
| <h2 class="text-4xl md:text-5xl font-bold mb-6"> |
| Die <span class="brass-text">Kunst</span> der Kochkultur |
| </h2> |
| <p class="text-lg mb-6 leading-relaxed"> |
| Entdecken Sie die digitalisierte Ausgabe des legendären "Kochkunstführer" von Auguste Escoffé. |
| Eine Hommage an die kulinarische Meisterschaft des 19. Jahrhunderts. |
| </p> |
| <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:space-x-4"> |
| <a href="#video" class="bg-brass-text hover:bg-wood-bg text-white font-bold py-3 px-6 rounded transition duration-300 text-center"> |
| Dokumentarfilm ansehen |
| </a> |
| <a href="https://kochkunstführer.de" class="border-2 border-brass-text text-brass-text hover:bg-brass-text hover:text-white font-bold py-3 px-6 rounded transition duration-300 text-center"> |
| Zur digitalen Ausgabe |
| </a> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <div class="ornament-divider"></div> |
|
|
| |
| <section id="video" class="py-16 px-4 md:px-8 bg-amber-50"> |
| <div class="container mx-auto"> |
| <div class="text-center mb-12" data-aos="fade-up"> |
| <h2 class="text-3xl md:text-4xl font-bold mb-4">Dokumentarfilm</h2> |
| <p class="max-w-2xl mx-auto">Tauchen Sie ein in die Welt von Auguste Escoffé und seiner kulinarischen Revolution</p> |
| </div> |
| <div class="max-w-4xl mx-auto" data-aos="zoom-in"> |
| <div class="video-container"> |
| <iframe src="https://www.youtube.com/embed/LnRwotux8vc" frameborder="0" allowfullscreen></iframe> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 px-4 md:px-8"> |
| <div class="container mx-auto"> |
| <div class="text-center mb-16" data-aos="fade-up"> |
| <h2 class="text-3xl md:text-4xl font-bold mb-4">Besonderheiten der digitalen Ausgabe</h2> |
| <div class="w-24 h-1 bg-brass-text mx-auto"></div> |
| </div> |
| |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8"> |
| <div class="bg-white p-8 rounded-lg shadow-md border border-brass-text/30" data-aos="fade-up" data-aos-delay="100"> |
| <div class="w-16 h-16 rounded-full bg-brass-text/10 flex items-center justify-center mb-6"> |
| <i data-feather="search" class="text-brass-text text-2xl"></i> |
| </div> |
| <h3 class="text-xl font-bold mb-3">Volltextsuche</h3> |
| <p>Finden Sie Rezepte und Techniken mit unserer fortschrittlichen Suchfunktion in der digitalen Ausgabe.</p> |
| </div> |
| |
| <div class="bg-white p-8 rounded-lg shadow-md border border-brass-text/30" data-aos="fade-up" data-aos-delay="200"> |
| <div class="w-16 h-16 rounded-full bg-brass-text/10 flex items-center justify-center mb-6"> |
| <i data-feather="book-open" class="text-brass-text text-2xl"></i> |
| </div> |
| <h3 class="text-xl font-bold mb-3">Originalgetreu</h3> |
| <p>Jede Seite wurde sorgfältig digitalisiert, um das authentische Aussehen der Originalausgabe zu bewahren.</p> |
| </div> |
| |
| <div class="bg-white p-8 rounded-lg shadow-md border border-brass-text/30" data-aos="fade-up" data-aos-delay="300"> |
| <div class="w-16 h-16 rounded-full bg-brass-text/10 flex items-center justify-center mb-6"> |
| <i data-feather="smartphone" class="text-brass-text text-2xl"></i> |
| </div> |
| <h3 class="text-xl font-bold mb-3">Responsive Ansicht</h3> |
| <p>Greifen Sie auf das Werk von jedem Gerät aus zu - perfekt optimiert für Desktop, Tablet und Smartphone.</p> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 px-4 md:px-8 bg-wood-bg text-white"> |
| <div class="container mx-auto text-center max-w-3xl" data-aos="fade-up"> |
| <div class="text-5xl brass-text mb-6">❝</div> |
| <blockquote class="text-xl md:text-2xl italic mb-8"> |
| "Die Kochkunst ist eine Wissenschaft, die wir mit Sorgfalt studieren und mit Geschmack ausüben müssen." |
| </blockquote> |
| <cite class="text-brass-text text-lg">— Auguste Escoffé, Kochkunstführer (1885)</cite> |
| </div> |
| </section> |
|
|
| |
| <section class="py-20 px-4 md:px-8"> |
| <div class="container mx-auto text-center max-w-3xl"> |
| <h2 class="text-3xl md:text-4xl font-bold mb-6" data-aos="fade-up">Entdecken Sie das kulinarische Erbe</h2> |
| <p class="text-xl mb-10 max-w-2xl mx-auto" data-aos="fade-up" data-aos-delay="100"> |
| Tauchen Sie ein in die Welt der klassischen Kochkunst und lassen Sie sich von den Rezepten und Techniken des 19. Jahrhunderts inspirieren. |
| </p> |
| <div data-aos="fade-up" data-aos-delay="200"> |
| <a href="https://kochkunstführer.de" class="inline-block bg-brass-text hover:bg-wood-bg text-white font-bold py-4 px-10 rounded-full text-lg transition duration-300 transform hover:scale-105"> |
| Zur digitalen Ausgabe |
| </a> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <footer class="wood-bg text-white py-12 px-4 md:px-8"> |
| <div class="container mx-auto"> |
| <div class="flex flex-col md:flex-row justify-between items-center"> |
| <div class="mb-6 md:mb-0"> |
| <h3 class="text-2xl font-bold mb-2">Kochkunstführer</h3> |
| <p class="text-brass-text">Hommage an Auguste Escoffé</p> |
| </div> |
| <div class="flex space-x-6"> |
| <a href="#" class="hover:text-brass-text transition"> |
| <i data-feather="twitter"></i> |
| </a> |
| <a href="#" class="hover:text-brass-text transition"> |
| <i data-feather="facebook"></i> |
| </a> |
| <a href="#" class="hover:text-brass-text transition"> |
| <i data-feather="instagram"></i> |
| </a> |
| </div> |
| </div> |
| <div class="border-t border-brass-text/30 mt-8 pt-8 text-center text-sm"> |
| <p>© 2023 Kochkunstführer. Eine Hommage an Auguste Escoffé. Alle Rechte vorbehalten.</p> |
| <p class="mt-2">Besuchen Sie: <a href="https://kochkunstführer.de" class="text-brass-text hover:underline">kochkunstführer.de</a></p> |
| </div> |
| </div> |
| </footer> |
|
|
| <script> |
| AOS.init({ |
| duration: 800, |
| easing: 'ease-in-out' |
| }); |
| </script> |
| <script> |
| feather.replace(); |
| </script> |
| </body> |
| </html> |
|
|
