1064 lines
55 KiB
HTML
1064 lines
55 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>EAGLE's IMAX | Deluxe Experience</title>
|
|
<link rel="stylesheet" href="style.css">
|
|
</head>
|
|
<body> <nav class="navbar">
|
|
<div class="logo" id="logo-home" style="cursor:pointer">EAGLE's IMAX</div>
|
|
<ul class="nav-links">
|
|
<li><a href="#" id="link-filme">Aktuelle Filme</a></li>
|
|
<li><a href="#" id="link-snacks">Snacks & Getränke</a></li>
|
|
<li><a href="#" id="link-about">Über uns</a></li>
|
|
<li><a href="#" id="link-account">Mein Konto</a></li>
|
|
<li>
|
|
<a href="#" id="link-cart" style="position: relative; display: flex; align-items: center; gap: 5px;">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="21" r="1"></circle><circle cx="20" cy="21" r="1"></circle><path d="M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6"></path></svg>
|
|
Warenkorb
|
|
<span id="cart-badge" class="badge">0</span>
|
|
</a>
|
|
</li>
|
|
<li class="theme-toggle-item">
|
|
<button id="theme-toggle" class="theme-toggle-btn" type="button" aria-label="Theme wechseln">
|
|
<span class="theme-icon theme-icon-sun">☀</span>
|
|
<span class="theme-icon theme-icon-moon">☾</span>
|
|
</button>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
|
|
<header class="hero">
|
|
<div id="hero-slider" class="hero-slider"></div>
|
|
<div class="hero-overlay">
|
|
<span class="badge">Neu im Kino</span>
|
|
<h1 id="hero-title">Jetzt im Kino</h1>
|
|
<p id="hero-text">Erlebe die neuesten Highlights auf der großen Leinwand.</p>
|
|
<button class="btn-primary" id="hero-booking-btn">Jetzt Tickets kaufen</button>
|
|
<div id="hero-dots" class="hero-dots"></div>
|
|
</div>
|
|
</header>
|
|
|
|
<section id="movies-grid-section" class="movie-section cinema-home">
|
|
<div class="section-header reveal-on-scroll">
|
|
<h2>Dein Kinoabend beginnt hier</h2>
|
|
<p>Premieren, Lieblingsfilme und flexible Spielzeiten in allen Sälen.</p>
|
|
</div>
|
|
|
|
<div class="home-poster-band reveal-on-scroll">
|
|
<div class="home-band-header">
|
|
<h3>Jetzt läuft</h3>
|
|
<span>Heute im Fokus</span>
|
|
</div>
|
|
<div id="now-running-row" class="now-running-row"></div>
|
|
</div>
|
|
|
|
<div class="home-inline-showcase reveal-on-scroll">
|
|
<article class="inline-section inline-halls">
|
|
<div class="inline-media"></div>
|
|
<div class="inline-content">
|
|
<h3>Unsere Säle im Überblick</h3>
|
|
<p>Jeder Saal hat ein eigenes Profil: von klassischem Kinofeeling bis High-End-Erlebnis mit Premiumtechnik und mehr Komfort.</p>
|
|
<div class="inline-tags">
|
|
<span>IMAX</span>
|
|
<span>Deluxe 1</span>
|
|
<span>Kino 1</span>
|
|
<span>Kino 2</span>
|
|
</div>
|
|
<button type="button" class="story-more-btn" data-home-view-open="halls-view">Mehr erfahren</button>
|
|
</div>
|
|
</article>
|
|
|
|
<article class="inline-section inline-dbox">
|
|
<div class="inline-media"></div>
|
|
<div class="inline-content">
|
|
<h3>D-BOX & Technik</h3>
|
|
<p>Spüre Bewegungen synchron zum Film und kombiniere das Erlebnis mit modernem Raumklang und Premium-Bestuhlung.</p>
|
|
<div class="dbox-now-highlight">
|
|
<h4>Aktuell in D-BOX</h4>
|
|
<div class="dbox-mini-cards">
|
|
<div>Zoomania 2</div>
|
|
<div>Shelter</div>
|
|
<div>Hoppers</div>
|
|
<div>Spider Man</div>
|
|
</div>
|
|
</div>
|
|
<button type="button" class="story-more-btn" data-home-view-open="dbox-view">Mehr erfahren</button>
|
|
</div>
|
|
</article>
|
|
|
|
<article class="inline-section inline-collectors">
|
|
<div class="inline-media"></div>
|
|
<div class="inline-content">
|
|
<h3>Collectors Popcorn Specials</h3>
|
|
<p>Präsentiere Sonderbecher und Eimer filmbezogen mit Bild, Logo und kurzem Text in einer lebendigen Timeline.</p>
|
|
<button type="button" class="story-more-btn" data-home-view-open="collectors-view">Mehr erfahren</button>
|
|
</div>
|
|
</article>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="movie-list-view" class="hidden">
|
|
<div class="container movie-list-shell">
|
|
<h1 class="list-title">Aktuelle Filme & Spielzeiten</h1>
|
|
<p class="list-subtitle">Alle Filme mit 7 Tagen Spielplan. Erste Vorstellung taeglich ab 13:00 Uhr.</p>
|
|
<div id="movie-program-list" class="movie-program-list"></div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="halls-view" class="hidden info-view">
|
|
<div class="container info-view-shell">
|
|
<button class="subpage-back-btn" data-go-home type="button">← Zur Startseite</button>
|
|
<h1>Unsere Säle</h1>
|
|
<p class="info-view-subtitle">Pflegbare Infoseite zu allen Sälen inkl. Bild- und Textbereichen.</p>
|
|
<div class="hall-modal-grid full-page-grid">
|
|
<article class="hall-modal-item">
|
|
<h4>Kino 1</h4>
|
|
<textarea placeholder="Infos zu Kino 1 eintragen..."></textarea>
|
|
<input type="text" placeholder="Bildpfad fuer den Hintergrund (z.B. img/saal1.jpg)">
|
|
</article>
|
|
<article class="hall-modal-item">
|
|
<h4>Kino 2</h4>
|
|
<textarea placeholder="Infos zu Kino 2 eintragen..."></textarea>
|
|
<input type="text" placeholder="Bildpfad fuer den Hintergrund (z.B. img/saal2.jpg)">
|
|
</article>
|
|
<article class="hall-modal-item">
|
|
<h4>Deluxe 1</h4>
|
|
<textarea placeholder="Infos zu Deluxe 1 eintragen..."></textarea>
|
|
<input type="text" placeholder="Bildpfad fuer den Hintergrund (z.B. img/deluxe.jpg)">
|
|
</article>
|
|
<article class="hall-modal-item">
|
|
<h4>IMAX</h4>
|
|
<textarea placeholder="Infos zu IMAX eintragen..."></textarea>
|
|
<input type="text" placeholder="Bildpfad fuer den Hintergrund (z.B. img/imax.jpg)">
|
|
</article>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="dbox-view" class="hidden info-view">
|
|
<div class="container info-view-shell">
|
|
<button class="subpage-back-btn" data-go-home type="button">← Zur Startseite</button>
|
|
<h1>D-BOX & Technik</h1>
|
|
<p class="info-view-subtitle">Inspiriert von Technikseiten moderner Kinos, aber in deinem Design.</p>
|
|
<section class="dbox-modal-section">
|
|
<h3>Wie D-BOX funktioniert</h3>
|
|
<p>D-BOX Sitze reagieren synchron zum Film. Die Bewegungsintensität ist individuell steuerbar und kann bei Bedarf reduziert oder deaktiviert werden.</p>
|
|
</section>
|
|
<section class="dbox-modal-section">
|
|
<h3>Technik im Saal</h3>
|
|
<p>Ergänze hier deine Informationen zu Projektion, Soundsystem, Sitzkomfort und den Sälen mit D-BOX-Unterstützung.</p>
|
|
<div class="dbox-image-grid">
|
|
<div class="dbox-image-slot">Bildplatz Technik 1</div>
|
|
<div class="dbox-image-slot">Bildplatz Technik 2</div>
|
|
<div class="dbox-image-slot">Bildplatz Technik 3</div>
|
|
<div class="dbox-image-slot">Bildplatz Technik 4</div>
|
|
</div>
|
|
</section>
|
|
<section class="dbox-now-highlight modal-highlight">
|
|
<h4>Filme in D-BOX</h4>
|
|
<div class="dbox-mini-cards">
|
|
<div>Zoomania 2</div>
|
|
<div>Der Austronaut</div>
|
|
<div>Spider Man</div>
|
|
<div>Scream VII</div>
|
|
<div>Gangster Gang 2</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="collectors-view" class="hidden info-view">
|
|
<div class="container info-view-shell">
|
|
<button class="subpage-back-btn" data-go-home type="button">← Zur Startseite</button>
|
|
<h1>Collectors Popcorn Specials</h1>
|
|
<p class="info-view-subtitle">Filmbezogene Specials in einer links/rechts versetzten Darstellung.</p>
|
|
<div class="collector-zigzag">
|
|
<article class="collector-entry left">
|
|
<div class="collector-film-logo">Filmlogo</div>
|
|
<div class="collector-entry-content">
|
|
<h4>Special Becher 01</h4>
|
|
<p>Kurzbeschreibung des Artikels und Bezug zum Film.</p>
|
|
<input type="text" placeholder="Bildpfad (z.B. img/becher1.jpg)">
|
|
</div>
|
|
</article>
|
|
<article class="collector-entry right">
|
|
<div class="collector-film-logo">Filmlogo</div>
|
|
<div class="collector-entry-content">
|
|
<h4>Special Eimer 02</h4>
|
|
<p>Weitere Edition mit eigenem Motiv und Text.</p>
|
|
<input type="text" placeholder="Bildpfad (z.B. img/eimer2.jpg)">
|
|
</div>
|
|
</article>
|
|
<article class="collector-entry left">
|
|
<div class="collector-film-logo">Filmlogo</div>
|
|
<div class="collector-entry-content">
|
|
<h4>Special Box 03</h4>
|
|
<p>Noch ein Eintrag fuer limitierte Collectors.</p>
|
|
<input type="text" placeholder="Bildpfad (z.B. img/collector3.jpg)">
|
|
</div>
|
|
</article>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="about-view" class="hidden info-view">
|
|
<div class="container info-view-shell">
|
|
<div class="about-hero-block">
|
|
<div class="about-hero-content">
|
|
<h1>Über uns</h1>
|
|
<p class="about-intro">
|
|
EAGLE's IMAX vereint modernes Design, starke Technik und echtes Kinofeeling.
|
|
Unser Anspruch: Jeder Besuch soll wie ein kleines Event wirken. Von entspannten Abenden
|
|
bis zu großen Blockbuster-Premieren liefern wir Bild, Sound und Atmosphäre auf Top-Niveau.
|
|
</p>
|
|
<div class="about-pill-row">
|
|
<span>4 Säle</span>
|
|
<span>IMAX Experience</span>
|
|
<span>D-BOX Motion Seats</span>
|
|
<span>Premium Snacks</span>
|
|
</div>
|
|
</div>
|
|
<div class="about-hero-media" aria-hidden="true"></div>
|
|
</div>
|
|
|
|
<div class="about-stats-grid">
|
|
<article>
|
|
<h3>600+</h3>
|
|
<p>Sitzplätze insgesamt</p>
|
|
</article>
|
|
<article>
|
|
<h3>4K / Laser</h3>
|
|
<p>Hochauflösende Projektion</p>
|
|
</article>
|
|
<article>
|
|
<h3>Dolby Atmos</h3>
|
|
<p>Raumklang in ausgewählten Sälen</p>
|
|
</article>
|
|
<article>
|
|
<h3>D-BOX</h3>
|
|
<p>Bewegung synchron zum Film</p>
|
|
</article>
|
|
</div>
|
|
|
|
<div class="about-cards">
|
|
<article class="about-card about-card-halls">
|
|
<h3>Säle</h3>
|
|
<p>Vom klassischen Kinoraum bis zum IMAX-Erlebnis: Jeder Saal ist individuell abgestimmt auf Genre, Publikum und Stimmung.</p>
|
|
<button type="button" class="story-more-btn" data-home-view-open="halls-view">Mehr erfahren</button>
|
|
</article>
|
|
<article class="about-card about-card-dbox">
|
|
<h3>D-BOX Plätze</h3>
|
|
<p>Synchronisierte Sitzbewegungen machen Action und Effekte physisch spürbar und verstärken die Immersion im Film.</p>
|
|
<button type="button" class="story-more-btn" data-home-view-open="dbox-view">Mehr erfahren</button>
|
|
</article>
|
|
<article class="about-card about-card-tech">
|
|
<h3>Technik</h3>
|
|
<p>Leinwandgrößen, Projektoren, Soundsysteme und Kapazitäten in einem separaten Technikfenster zusammengefasst.</p>
|
|
<button id="btn-open-tech-modal" type="button" class="story-more-btn" data-about-modal-open="about-tech-modal">Mehr erfahren</button>
|
|
</article>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="snacks-view" class="hidden">
|
|
<div class="container" style="padding: 120px 8% 50px 8%;">
|
|
<h1 class="list-title">Snacks & Getränke</h1>
|
|
|
|
<div class="category-tabs">
|
|
<button class="tab-btn active" data-target="cat-limited">Limitierte Specials</button>
|
|
<button class="tab-btn" data-target="cat-getraenke">Getränke</button>
|
|
<button class="tab-btn" data-target="cat-popcorn">Popcorn</button>
|
|
<button class="tab-btn" data-target="cat-nachos">Nachos</button>
|
|
<button class="tab-btn" data-target="cat-snacks">Snacks</button>
|
|
<button class="tab-btn" data-target="cat-eis">Eis</button>
|
|
</div>
|
|
|
|
<div id="cat-limited" class="snack-category active limited-specials-category">
|
|
<div class="limited-specials-hero">
|
|
<div>
|
|
<span class="limited-kicker">Nur für kurze Zeit</span>
|
|
<h2>Limitierte Specials</h2>
|
|
<p>Filmbecher, Sammler-Eimer und Kids-Menüs als kleine Vitrine für besondere Aktionen.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="limited-special-block">
|
|
<div class="special-film-heading">
|
|
<img src="img/Zoomania-2.jpg" alt="Zoomania 2 Logo">
|
|
<div>
|
|
<span>Zoomania 2</span>
|
|
<h2>City Edition</h2>
|
|
</div>
|
|
</div>
|
|
<div class="limited-special-grid">
|
|
<div class="snack-card limited-special-card">
|
|
<div class="snack-img"><img src="img/zoomania-popcorn.jpg" alt="Zoomania 2 Metallbecher"></div>
|
|
<div class="snack-info">
|
|
<span class="badge">Metallbecher</span>
|
|
<h3>Limitierter Metallbecher - Zoomania 2</h3>
|
|
<p class="snack-card-note">Sammlerbecher mit Popcornfüllung, wahlweise süß oder salzig.</p>
|
|
<div class="option-group">
|
|
<button class="opt-btn active">Süß</button>
|
|
<button class="opt-btn">Salzig</button>
|
|
</div>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Special <span>12,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card limited-special-card wide-special">
|
|
<div class="snack-img"><img src="img/zoomaniakidsmenu.jpg" alt="Zoomania Kids Menu"></div>
|
|
<div class="snack-info">
|
|
<span class="badge">Kids Special</span>
|
|
<h3>Zoomania Kids Menü</h3>
|
|
<p class="snack-card-note">0,5L Getränk im Zoomania Becher + Zoomania Popcorn Schale + Figur zum Aussuchen.</p>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Menü-Preis <span>10,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="limited-special-block">
|
|
<div class="special-film-heading">
|
|
<img src="img/screamvii.jpg" alt="Scream VII Logo">
|
|
<div>
|
|
<span>Scream VII</span>
|
|
<h2>Horror Collectors</h2>
|
|
</div>
|
|
</div>
|
|
<div class="limited-special-grid compact-specials">
|
|
<div class="snack-card limited-special-card">
|
|
<div class="snack-img"><img src="img/screamdoorpopcorn.jpg" alt="Scream VII Sammelbecher"></div>
|
|
<div class="snack-info">
|
|
<span class="badge">Collector</span>
|
|
<h3>Limitierter Sammelbecher - Scream VII</h3>
|
|
<p class="snack-card-note">Dunkler Sammlerbecher passend zum Horrorabend.</p>
|
|
<div class="option-group">
|
|
<button class="opt-btn active">Süß</button>
|
|
<button class="opt-btn">Salzig</button>
|
|
</div>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Special <span>29,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="limited-special-block">
|
|
<div class="special-film-heading">
|
|
<img src="img/derAustronaut.jpg" alt="Der Austronaut Logo">
|
|
<div>
|
|
<span>Project Hail Mary</span>
|
|
<h2>Space Collection</h2>
|
|
</div>
|
|
</div>
|
|
<div class="limited-special-grid compact-specials">
|
|
<div class="snack-card limited-special-card">
|
|
<div class="snack-img"><img src="img/astronautpopcorn.jpg" alt="Der Austronaut Sammelbecher"></div>
|
|
<div class="snack-info">
|
|
<span class="badge">Space Cup</span>
|
|
<h3>Limitierter Sammelbecher - Der Austronaut</h3>
|
|
<p class="snack-card-note">Großer Sammlerbecher im Sci-Fi-Look für deine Mission ins Kino.</p>
|
|
<div class="option-group">
|
|
<button class="opt-btn active">Süß</button>
|
|
<button class="opt-btn">Salzig</button>
|
|
</div>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Special <span>34,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="limited-special-block">
|
|
<div class="special-film-heading">
|
|
<img src="img/hoppers.jpg" alt="Hoppers Logo">
|
|
<div>
|
|
<span>Hoppers</span>
|
|
<h2>Family Specials</h2>
|
|
</div>
|
|
</div>
|
|
<div class="limited-special-grid">
|
|
<div class="snack-card limited-special-card">
|
|
<div class="snack-img"><img src="img/hopperspopcornmetall.jpg" alt="Hoppers Metallbecher"></div>
|
|
<div class="snack-info">
|
|
<span class="badge">Metallbecher</span>
|
|
<h3>Limitierter Metallbecher - Hoppers</h3>
|
|
<p class="snack-card-note">Stabiler Becher mit Popcornfüllung.</p>
|
|
<div class="option-group">
|
|
<button class="opt-btn active">Süß</button>
|
|
<button class="opt-btn">Salzig</button>
|
|
</div>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Special <span>12,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card limited-special-card">
|
|
<div class="snack-img"><img src="img/hopperspopcornwood.png" alt="Hoppers Sammelbecher"></div>
|
|
<div class="snack-info">
|
|
<span class="badge">Collector</span>
|
|
<h3>Limitierter Sammelbecher - Hoppers</h3>
|
|
<p class="snack-card-note">Sammlerbecher mit warmem Popcornmoment.</p>
|
|
<div class="option-group">
|
|
<button class="opt-btn active">Süß</button>
|
|
<button class="opt-btn">Salzig</button>
|
|
</div>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Special <span>21,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card limited-special-card wide-special">
|
|
<div class="snack-img"><img src="img/hopperskidsmenu.jpg" alt="Hoppers Kids Menu"></div>
|
|
<div class="snack-info">
|
|
<span class="badge">Kids Special</span>
|
|
<h3>Hoppers Kids Menü</h3>
|
|
<p class="snack-card-note">0,5L Getränk im Hoppers Becher + Hoppers Popcorn Schale + Hoppers Figur.</p>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Menü-Preis <span>10,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="limited-special-block">
|
|
<div class="special-film-heading">
|
|
<img src="img/mariogalaxy.jpg" alt="Mario Galaxy Logo">
|
|
<div>
|
|
<span>Super Mario Galaxy</span>
|
|
<h2>Galaxy Specials</h2>
|
|
</div>
|
|
</div>
|
|
<div class="limited-special-grid">
|
|
<div class="snack-card limited-special-card">
|
|
<div class="snack-img"><img src="img/marioyoshipopcorn.png" alt="Yoshi Sammelbecher"></div>
|
|
<div class="snack-info">
|
|
<span class="badge">Yoshi Cup</span>
|
|
<h3>Limitierter Sammelbecher - Yoshi Becher</h3>
|
|
<p class="snack-card-note">Verspielter Sammlerbecher für Mario-Fans.</p>
|
|
<div class="option-group">
|
|
<button class="opt-btn active">Süß</button>
|
|
<button class="opt-btn">Salzig</button>
|
|
</div>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Special <span>35,90€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card limited-special-card wide-special">
|
|
<div class="snack-img"><img src="img/mariokidsmenu.png" alt="Mario Kids Menu"></div>
|
|
<div class="snack-info">
|
|
<span class="badge">Kids Special</span>
|
|
<h3>Mario Galaxy Kids Menü</h3>
|
|
<p class="snack-card-note">0,5L Getränk im Mario Galaxy Becher + Mario Galaxy Popcorn Schale.</p>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Menü-Preis <span>10,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="cat-getraenke" class="snack-category hidden">
|
|
<div class="snack-grid">
|
|
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/cola.png" alt="Cola"></div>
|
|
<div class="snack-info">
|
|
<h3>Coca Cola</h3>
|
|
<div class="size-selector">
|
|
<button class="size-chip">0,33L <span>2,50€</span></button>
|
|
<button class="size-chip">0,50L <span>3,50€</span></button>
|
|
<button class="size-chip">0,75L <span>4,50€</span></button>
|
|
<button class="size-chip">1L <span>5,50€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/cola-zero.png" alt="Cola Zero"></div>
|
|
<div class="snack-info">
|
|
<h3>Coca Cola Zero</h3>
|
|
<div class="size-selector">
|
|
<button class="size-chip">0,33L <span>2,50€</span></button>
|
|
<button class="size-chip">0,50L <span>3,50€</span></button>
|
|
<button class="size-chip">0,75L <span>4,50€</span></button>
|
|
<button class="size-chip">1L <span>5,50€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/cola-light.png" alt="Cola Light"></div>
|
|
<div class="snack-info">
|
|
<h3>Coca Cola Light</h3>
|
|
<div class="size-selector">
|
|
<button class="size-chip">0,33L <span>2,50€</span></button>
|
|
<button class="size-chip">0,50L <span>3,50€</span></button>
|
|
<button class="size-chip">0,75L <span>4,50€</span></button>
|
|
<button class="size-chip">1L <span>5,50€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/sprite.png" alt="Sprite"></div>
|
|
<div class="snack-info">
|
|
<h3>Sprite</h3>
|
|
<div class="size-selector">
|
|
<button class="size-chip">0,33L <span>2,50€</span></button>
|
|
<button class="size-chip">0,50L <span>3,50€</span></button>
|
|
<button class="size-chip">0,75L <span>4,50€</span></button>
|
|
<button class="size-chip">1L <span>5,50€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/fanta.png" alt="Fanta"></div>
|
|
<div class="snack-info">
|
|
<h3>Fanta</h3>
|
|
<div class="size-selector">
|
|
<button class="size-chip">0,33L <span>2,50€</span></button>
|
|
<button class="size-chip">0,50L <span>3,50€</span></button>
|
|
<button class="size-chip">0,75L <span>4,50€</span></button>
|
|
<button class="size-chip">1L <span>5,50€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/spezi.png" alt="Spezi"></div>
|
|
<div class="snack-info">
|
|
<h3>Mezzo Mix</h3>
|
|
<div class="size-selector">
|
|
<button class="size-chip">0,33L <span>2,50€</span></button>
|
|
<button class="size-chip">0,50L <span>3,50€</span></button>
|
|
<button class="size-chip">0,75L <span>4,50€</span></button>
|
|
<button class="size-chip">1L <span>5,50€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/wasser.png" alt="Wasser"></div>
|
|
<div class="snack-info">
|
|
<h3>Wasser</h3>
|
|
<div class="size-selector">
|
|
<button class="size-chip">0,33L <span>2,00€</span></button>
|
|
<button class="size-chip">0,50L <span>3,00€</span></button>
|
|
<button class="size-chip">0,75L <span>3,50€</span></button>
|
|
<button class="size-chip">1L <span>4,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/Apfelschorle.png" alt="Apfelschorle"></div>
|
|
<div class="snack-info">
|
|
<h3>Apfelschorle</h3>
|
|
<div class="size-selector">
|
|
<button class="size-chip">0,33L <span>2,00€</span></button>
|
|
<button class="size-chip">0,50L <span>3,00€</span></button>
|
|
<button class="size-chip">0,75L <span>3,50€</span></button>
|
|
<button class="size-chip">1L <span>4,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/fuze-tea.png" alt="Fuze Tea"></div>
|
|
<div class="snack-info">
|
|
<h3>Fuze Tea</h3>
|
|
<div class="size-selector">
|
|
<button class="size-chip">0,33L <span>2,50€</span></button>
|
|
<button class="size-chip">0,50L <span>3,50€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div> </div>
|
|
|
|
<div id="cat-popcorn" class="snack-category hidden">
|
|
<div class="snack-subsection">
|
|
<div class="snack-section-heading">
|
|
<span>Frisch gepoppt</span>
|
|
<h2>Einzelprodukte</h2>
|
|
</div>
|
|
<div class="snack-grid">
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/popcorn-klein.png" alt="Popcorn klein"></div>
|
|
<div class="snack-info">
|
|
<h3>Popcorn klein</h3>
|
|
<div class="option-group">
|
|
<button class="opt-btn active">Süß</button>
|
|
<button class="opt-btn">Salzig</button>
|
|
</div>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Klein <span>3,50€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/popcorn-mittel.png" alt="Popcorn mittel"></div>
|
|
<div class="snack-info">
|
|
<h3>Popcorn Mittel</h3>
|
|
<div class="option-group">
|
|
<button class="opt-btn active">Süß</button>
|
|
<button class="opt-btn">Salzig</button>
|
|
</div>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Mittel <span>4,50€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/popcorn-big.png" alt="Popcorn groß"></div>
|
|
<div class="snack-info">
|
|
<h3>Popcorn Groß</h3>
|
|
<div class="option-group">
|
|
<button class="opt-btn active">Süß</button>
|
|
<button class="opt-btn">Salzig</button>
|
|
</div>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Groß <span>6,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="snack-subsection">
|
|
<div class="snack-section-heading popcorn-combo-heading">
|
|
<span>Für Filmabende</span>
|
|
<h2>Kombi Menü</h2>
|
|
</div>
|
|
<div class="snack-grid">
|
|
<div class="snack-card highlight">
|
|
<div class="snack-info">
|
|
<h3>Kleines Menü</h3>
|
|
<p class="snack-card-note">0,33L Getränk + Popcorn klein</p>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Menü-Preis <span>5,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card highlight">
|
|
<div class="snack-info">
|
|
<h3>Mittleres Menü</h3>
|
|
<p class="snack-card-note">0,5L Getränk + Popcorn mittel</p>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Menü-Preis <span>6,50€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card highlight">
|
|
<div class="snack-info">
|
|
<span class="badge">Bestseller</span>
|
|
<h3>Großes Menü</h3>
|
|
<p class="snack-card-note">1L Getränk + Popcorn groß</p>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Menü-Preis <span>8,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="cat-nachos" class="snack-category hidden">
|
|
<div class="snack-subsection">
|
|
<div class="snack-section-heading">
|
|
<span>Nachos</span>
|
|
<h2>Einzelprodukte</h2>
|
|
</div>
|
|
<div class="snack-grid">
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/nachosnormal.png" alt="Nachos"></div>
|
|
<div class="snack-info">
|
|
<h3>Nachos Klein</h3>
|
|
<div class="option-group">
|
|
<button class="opt-btn active">Käse-Dip</button>
|
|
<button class="opt-btn">Salsa-Dip</button>
|
|
</div>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Klein <span>5,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/nachosnormal.png" alt="Nachos"></div>
|
|
<div class="snack-info">
|
|
<h3>Nachos Normal</h3>
|
|
<div class="option-group">
|
|
<button class="opt-btn active">Käse-Dip</button>
|
|
<button class="opt-btn">Salsa-Dip</button>
|
|
</div>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Mittel <span>6,50€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/nachos.jpg" alt="Nachos"></div>
|
|
<div class="snack-info">
|
|
<h3>Nachos Groß</h3>
|
|
<div class="option-group">
|
|
<button class="opt-btn active">Käse-Dip</button>
|
|
<button class="opt-btn">Sourcreme-Dip</button>
|
|
<button class="opt-btn">Salsa-Dip</button>
|
|
</div>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Groß <span>8,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="snack-subsection">
|
|
<div class="snack-section-heading">
|
|
<span>Extra dazu</span>
|
|
<h2>Dips</h2>
|
|
</div>
|
|
<div class="snack-grid">
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/käsedip.png" alt="Käse-Dip"></div>
|
|
<div class="snack-info">
|
|
<h3>Käse-Dip<br>(warm)</h3>
|
|
<div class="option-group">
|
|
<button class="opt-btn active">Normal</button>
|
|
<button class="opt-btn">Scharf</button>
|
|
</div>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Schale <span>2,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/sourdip.png" alt="Sourcreme-Dip"></div>
|
|
<div class="snack-info">
|
|
<h3>Sourcreme-Dip</h3>
|
|
<div class="option-group">
|
|
<button class="opt-btn active">Normal</button>
|
|
</div>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Schale <span>2,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/salsadip.png" alt="Salsa-Dip"></div>
|
|
<div class="snack-info">
|
|
<h3>Salsa-Dip</h3>
|
|
<div class="option-group">
|
|
<button class="opt-btn active">Normal</button>
|
|
</div>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Schale <span>2,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="snack-subsection">
|
|
<div class="snack-section-heading">
|
|
<span>Alles drin</span>
|
|
<h2>Kombi Menü</h2>
|
|
</div>
|
|
<div class="snack-grid">
|
|
<div class="snack-card highlight">
|
|
<div class="snack-img"><img src="img/nachokombiklein.png" alt="Nacho Kombi Klein"></div>
|
|
<div class="snack-info">
|
|
<h3>Nacho Menü Klein</h3>
|
|
<p class="snack-card-note">Nachos klein + 1 Dip + 1x 0,33L Getränk</p>
|
|
<div class="option-group">
|
|
<button class="opt-btn active">Klein</button>
|
|
</div>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Kombi <span>6,90€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="cat-snacks" class="snack-category hidden">
|
|
<div class="snack-grid">
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/mms.png" alt="M&Ms"></div>
|
|
<div class="snack-info">
|
|
<h3>M&M's (verschiedene Sorten)</h3>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Packung <span>4,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/haribo.png" alt="Haribo"></div>
|
|
<div class="snack-info">
|
|
<h3>Haribo Goldbären (verschiedene Sorten)</h3>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Tüte <span>3,00€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="snack-card">
|
|
<div class="snack-img"><img src="img/riegel.png" alt="Riegel"></div>
|
|
<div class="snack-info">
|
|
<h3>Schokoriegel (verschiedene Sorten)</h3>
|
|
<div class="size-selector">
|
|
<button class="size-chip">Tüte <span>2,50€</span></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="cat-eis" class="snack-category hidden">
|
|
<div class="coming-soon-banner">
|
|
<h2>Eiscreme & Shakes</h2>
|
|
<p>Coming Soon...</p>
|
|
<span>Wir bereiten etwas ganz Besonderes für dich vor! Coming this summer!</span>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</section>
|
|
|
|
<div id="booking-modal" class="modal hidden">
|
|
<div class="modal-content modal-large">
|
|
<div class="modal-header">
|
|
<div class="header-text-container">
|
|
<h2 id="modal-movie-title">Film Titel</h2>
|
|
<div class="header-sub-info">
|
|
<p id="modal-info-text">Saal • Zeit</p>
|
|
<div id="tech-badges" class="tech-badges-container hidden">
|
|
<img src="img/dolby.png" alt="Dolby" class="tech-badge">
|
|
<img src="img/dbox.png" alt="D-Box" class="tech-badge">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<span class="close-btn">×</span>
|
|
</div>
|
|
|
|
<div class="screen-container">
|
|
<div class="screen"></div>
|
|
<p class="screen-text">LEINWAND</p>
|
|
</div>
|
|
|
|
<div class="booking-layout">
|
|
<div class="seat-map-container">
|
|
<div id="seat-grid" class="seat-grid-custom"></div>
|
|
</div>
|
|
|
|
<div id="booking-summary" class="summary-panel hidden">
|
|
<h3>Deine Auswahl</h3>
|
|
<div id="summary-items"></div>
|
|
<div class="summary-total">
|
|
<div class="divider"></div>
|
|
<div class="total-row">
|
|
<span>Gesamtbetrag:</span>
|
|
<span id="total-price">0,00€</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="legend" id="dynamic-legend"></div>
|
|
|
|
<button id="btn-confirm-seats" class="btn-primary" style="margin-top:20px">Plätze bestätigen</button>
|
|
</div>
|
|
</div>
|
|
|
|
<section id="cart-view" class="cart-section hidden">
|
|
<div class="container" style="padding: 120px 8% 50px 8%;">
|
|
<h1 class="list-title">Dein Warenkorb</h1>
|
|
|
|
<div class="cart-container">
|
|
<div class="cart-left">
|
|
<div id="cart-items-list">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="cart-right">
|
|
<div class="summary-box-black">
|
|
<h2>Zusammenfassung</h2>
|
|
<div class="summary-row-large">
|
|
<span>Gesamtsumme:</span>
|
|
<span id="cart-total-right">0,00€</span>
|
|
</div>
|
|
<p id="cart-vat-right" style="text-align:right; color:#86868b; font-size:0.8rem; margin-top:5px;">
|
|
inkl. 19% MwSt: 0,00€
|
|
</p>
|
|
|
|
<button id="btn-checkout-final" class="blue-button">Jetzt kostenpflichtig bestellen</button>
|
|
|
|
<div class="payment-methods" style="margin-top: 25px; text-align: center;">
|
|
<p style="font-size: 0.75rem; color: #86868b; margin-bottom: 12px;">Sicher bezahlen mit</p>
|
|
<div style="display: flex; justify-content: center; gap: 15px; opacity: 0.6;">
|
|
<img src="img/paypal.png" alt="PayPal" style="height: 20px;">
|
|
<img src="img/visa.png" alt="Visa" style="height: 20px;">
|
|
<img src="img/mastercard.png" alt="Mastercard" style="height: 20px;">
|
|
<img src="img/applepay.png" alt="Apple Pay" style="height: 20px;">
|
|
<img src="img/googlepay.png" alt="Google Pay" style="height: 20px;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<div id="account-view" class="hidden">
|
|
<div class="account-login-box">
|
|
<h2>Mein Konto</h2>
|
|
|
|
<input type="email" id="login-email" placeholder="E-Mail">
|
|
<input type="password" id="login-password" placeholder="Passwort">
|
|
<button id="btn-forgot-password" type="button">Passwort vergessen?</button>
|
|
|
|
<div id="login-error" class="hidden">
|
|
Falsche E-Mail oder Passwort
|
|
</div>
|
|
|
|
<button id="btn-login-account" type="button">Anmelden</button>
|
|
<p id="account-register-hint">Noch kein Konto?</p>
|
|
<button id="btn-open-register" type="button">Registrieren</button>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div id="register-modal" class="modal hidden">
|
|
<div class="modal-content account-auth-modal">
|
|
<button id="btn-close-register" class="modal-close-btn" type="button" aria-label="Registrierung schliessen">×</button>
|
|
<h2>Registrieren</h2>
|
|
<p class="auth-modal-subtitle">Erstelle dein Konto für schnellere Buchungen.</p>
|
|
<input type="text" id="reg-firstname" placeholder="Vorname">
|
|
<input type="text" id="reg-lastname" placeholder="Nachname">
|
|
<input type="email" id="reg-email" placeholder="E-Mail">
|
|
<input type="password" id="reg-password" placeholder="Passwort">
|
|
<button id="btn-register-save" class="auth-submit-btn" type="button">Konto erstellen</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="forgot-modal" class="modal hidden">
|
|
<div class="modal-content account-auth-modal">
|
|
<button id="btn-close-forgot" class="modal-close-btn" type="button" aria-label="Passwort-Dialog schliessen">×</button>
|
|
<h2>Passwort vergessen</h2>
|
|
<p class="auth-modal-subtitle">Gib deine E-Mail ein und wir senden dir einen Reset-Code.</p>
|
|
|
|
<input type="email" id="forgot-email" placeholder="E-Mail">
|
|
<button id="btn-send-reset" class="auth-submit-btn" type="button">Code senden</button>
|
|
|
|
<div id="reset-message" class="hidden">
|
|
Ein Code wurde simuliert versendet.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<section id="checkout-view" class="hidden" style="padding: 40px 20px;">
|
|
<div class="checkout-container">
|
|
<div class="progress-bar">
|
|
<div class="step active" id="step-1-indicator">1</div>
|
|
<div class="line" id="line-1"></div>
|
|
<div class="step" id="step-2-indicator">2</div>
|
|
<div class="line" id="line-2"></div>
|
|
<div class="step" id="step-3-indicator">3</div>
|
|
</div>
|
|
|
|
<div id="checkout-step-1" class="checkout-step">
|
|
<h2 style="text-align: center; margin-bottom: 20px;">Zahlungsmethode wählen</h2>
|
|
<div class="payment-grid">
|
|
<div class="payment-method" data-method="Apple Pay">
|
|
<img src="img/applepay.png" alt="Apple Pay" style="height: 20px;">
|
|
<span>Apple Pay</span>
|
|
</div>
|
|
<div class="payment-method" data-method="PayPal">
|
|
<img src="img/paypal.png" alt="PayPal" style="height: 20px;">
|
|
<span>PayPal</span>
|
|
</div>
|
|
<div class="payment-method" data-method="Google Pay">
|
|
<img src="img/googlepay.png" alt="Google Pay" style="height: 20px;">
|
|
<span>Google Pay</span>
|
|
</div>
|
|
<div class="payment-method" data-method="Visa">
|
|
<img src="img/visa.png" alt="Visa" style="height: 20px;">
|
|
<span>Visa</span>
|
|
</div>
|
|
</div>
|
|
<button id="btn-next-step-2" class="hidden" style="margin-top: 25px; width: 100%; padding: 15px; background: #0071e3; color: white; border: none; border-radius: 8px; font-weight: bold; cursor: pointer;">Weiter zur Übersicht</button>
|
|
</div>
|
|
|
|
<div id="checkout-step-2" class="checkout-step hidden">
|
|
<div style="position: relative;">
|
|
<button id="btn-back-to-step1" style="position: absolute; top: -15px; left: 0; background: none; border: none; color: white; font-size: 1.5rem; cursor: pointer; opacity: 0.6; transition: 0.3s;">←</button>
|
|
<h2 style="text-align: center; margin-bottom: 25px;">Persönliche Daten</h2>
|
|
</div>
|
|
<h2 style="text-align: center; margin-bottom: 20px;">Bestellübersicht</h2>
|
|
<div id="checkout-summary-list" style="background: #222; padding: 15px; border-radius: 8px;"></div>
|
|
<h3 id="checkout-total-display" style="text-align: right; margin-top: 15px;"></h3>
|
|
<div id="checkout-vat-display" style="text-align: right; color: #86868b; font-size: 0.8rem;"></div>
|
|
<button id="btn-pay-now" style="margin-top: 25px; width: 100%; padding: 15px; background: #4caf50; color: white; border: none; border-radius: 8px; font-weight: bold; cursor: pointer;">Jetzt Bezahlen</button>
|
|
</div>
|
|
|
|
<div id="checkout-step-3" class="checkout-step hidden">
|
|
<h2 style="color: #4caf50; text-align: center;">Kauf erfolgreich!</h2>
|
|
<div id="ticket-container" style="margin-top: 30px;"></div>
|
|
<button id="btn-back-home" style="margin-top: 30px; width: 100%; padding: 15px; background: #333; color: white; border: none; border-radius: 8px; cursor: pointer;">Zurück zur Startseite</button>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<div id="snack-prompt-overlay" class="snack-overlay hidden">
|
|
<div class="snack-prompt-box">
|
|
<h2>Popcorn gefällig? 🍿</h2>
|
|
<p>Möchtest du noch Snacks oder Getränke hinzufügen?</p>
|
|
<div class="prompt-buttons">
|
|
<button id="btn-yes-snacks" class="btn-primary">Ja, Snacks wählen</button>
|
|
<button id="btn-no-cart" class="btn-secondary">Weiter zum Warenkorb</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="about-tech-modal" class="home-modal-overlay hidden">
|
|
<div class="home-modal-panel home-modal-wide">
|
|
<button type="button" class="home-modal-close" data-about-modal-close="about-tech-modal">×</button>
|
|
<h2>Technik</h2>
|
|
<p class="home-modal-sub">Daten und Eckwerte zu Bild, Projektoren, Leinwandgrößen und Sitzkapazitäten.</p>
|
|
<div class="hall-modal-grid full-page-grid">
|
|
<article class="hall-modal-item">
|
|
<h4>Projektoren</h4>
|
|
<textarea placeholder="z.B. 4K Laserprojektion, Modellinfos, Lichtleistung..."></textarea>
|
|
</article>
|
|
<article class="hall-modal-item">
|
|
<h4>Leinwandgrößen</h4>
|
|
<textarea placeholder="z.B. IMAX: 22m x 12m, Deluxe: 14m x 7m ..."></textarea>
|
|
</article>
|
|
<article class="hall-modal-item">
|
|
<h4>Sitzplätze pro Saal</h4>
|
|
<textarea placeholder="z.B. Kino 1: 180, Kino 2: 150, Deluxe 1: 120, IMAX: 300"></textarea>
|
|
</article>
|
|
<article class="hall-modal-item">
|
|
<h4>Bild & Audio</h4>
|
|
<textarea placeholder="z.B. Dolby Atmos, 7.1, Frame Rates, HDR-Profile..."></textarea>
|
|
</article>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="account.js"></script>
|
|
<script src="cart.js"></script>
|
|
<script src="booking.js"></script>
|
|
<script src="checkout.js"></script>
|
|
<script src="main.js"></script>
|
|
</body>
|
|
</html>
|
|
|
|
|