ihk24/templates/source/includes/header.html

<header class="page-header">
	<a href="#" class="logo">
		<!--object data="img/logos/svg/schleswig-holstein.svg" type="image/svg+xml" tabindex="-1"></object-->
		<img src="img/logos/svg/schleswig-holstein.svg" alt="IHK Logo">
	</a>
	<ul class="contact-nav">
		<li><a href="tel:123456789" class="phone">+49 12 345678-90</a></li>
		<!--li><a href="#" class="contact">Kontakt</a></li-->
	</ul>
	<div class="search">
		<button class="open-search">Suche</button>
		<form action="#">
			<div class="container small">
				<div class="outer">
					<label for="headersearch" class="visually-hidden">Suchbegriff</label>
					<input type="text" id="headersearch" class="search-field" name="#" placeholder="Hier Ihr Thema finden">
					<button type="submit" class="search-submit" aria-label="Suche starten"></button>
				</div>
			</div>
		</form>
		<button class="close-search">Suche verlassen</button>
	</div>
	<button class="toggle-nav">
		<span>Menü</span>
	</button>
	<nav>
		<div class="overlay-holder"></div>
		<div class="primary" data-root-url="12191410.json" data-base-url="services/nav/" data-page-content-id="12189248.json"></div>
		<div class="secondary">
			<ul>
				<li><a href="#">Über uns</a></li>
				<li><a href="#">Presse</a></li>
				<li><a href="#">Newsletter</a></li>
			</ul>
		</div>
		<div class="meta">
			<ul>
				<li class="contact"><a href="#">Kontakt</a></li>
				<li class="language">
					<ul>
						<li><a href="#">CZ</a></li>
						<li><a href="#">EN</a></li>
					</ul>
				</li>
				<li class="icons">
					<ul>
						<li class="sign-language"><a href="#">Zeichensprache</a></li>
						<li class="simple-language"><a href="#">Einfache Sprache</a></li>
						<li class="login"><a href="#">Einloggen</a></li>
					</ul>
				</li>
			</ul>
		</div>
	</nav>
	<div class="ihk-switch">
		<div class="step" data-step="geolocation">
			<p>Ihr geschätzter Standort ist <strong class="my-location"></strong>, sollen wir uns die <strong class="my-ihk"></strong> für Ihre nächsten Besuche merken?</p>
			<p class="small"><a href="#location-info" class="toggle-location-info">Warum wird mein Standort benötigt?</a></p>
			<p class="hidden" id="location-info">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Anostrum officiis quas qui quidem recusandae repellat repudiandae soluta ullam!</p>
			<div class="buttons">
				<button class="btn change-location icon-ihk-wechseln has-icon">Standort ändern</button>
				<button class="btn secondary accept-location green icon-check has-icon">Ja</button>
			</div>
		</div>
		<div class="step" data-step="form">
			<p>Geben Sie Ihre Postleitzahl ein, damit wir Ihre IHK für Sie finden können:</p>
			<form action="#" class="ihk-finder">
				<input type="text" placeholder="z.B. 44263 Dortmund">
				<button type="submit"></button>
			</form>
		</div>
		<div class="step" data-step="switch">
			<p>Sie befinden sich auf der Startseite der <strong class="current-ihk" data-ihknr="150">IHK Schleswig-Holstein</strong>. Möchten Sie stattdessen zur Startseite <strong>Ihrer <span class="my-ihk"></span></strong> wechseln?</p>
			<div class="buttons">
				<button class="btn stay-here">Hierbleiben</button>
				<button class="btn change-ihk">Wechseln</button>
			</div>
		</div>
		<div class="step" data-step="success">
			<p>Sie werden zum Angebot der <strong class="large my-ihk"></strong> weitergeleitet.</p>
		</div>
		<button class="closer"></button>
	</div>
</header>