/*
Theme Name: Lewonig 2015
Author: Torsten Wagner
Author URI: http://www.wagnergraphics.de
Description: basiert auf Foundation
Version: 1.0
License: GNU General Public License
License URI: license.txt
*/

/*

font-family: font-family: "cora", sans-serif;
	Regular 400
	Medium 500
	Bold 700
	auch italic
	
	
font-family: "droid-serif",serif;
	Regular 400
	Bold 700	

Rot: rgba(227,6,19,1.00);
Grau: rgba(153,153,153,1.00);
Hintergrund: #fff;




/* roboto-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('/fonts/roboto-v30-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/roboto-v30-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url('/fonts/roboto-v30-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/roboto-v30-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



/* roboto-serif-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 300;
  src: url('/fonts/roboto-serif-v13-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-serif-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/roboto-serif-v13-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-serif-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 500;
  src: url('/fonts/roboto-serif-v13-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-serif-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 600;
  src: url('/fonts/roboto-serif-v13-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-serif-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/roboto-serif-v13-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* roboto-serif-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Roboto Serif';
  font-style: normal;
  font-weight: 800;
  src: url('/fonts/roboto-serif-v13-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}




/* Foundation - Overrides
-----------------------------------------*/
	.reveal-modal-bg { 
		background: rgba(0,0,0,0.75); 
		}
	.reveal-modal {
		background-color: rgb(253, 253, 251); 
		}
		.reveal-modal h3 {
			color: rgba(227,6,19,1.00);
			}
		.reveal-modal .block {
			margin-bottom: 4rem;
			}


	
	
	
	button, 
	.button {
		background-color: rgba(227,6,19,1.00);
		border: 1px solid rgba(255,255,255,0.10);
		color: #fff;
		font-family: inherit;
		font-size: 1.2rem;
		font-weight: 300;
		text-transform: uppercase;
		box-shadow: inset 0 0 20px rgba(0,0,0,0.05), 0 0 2px rgba(0,0,0,0.10);
		
		}
	button:hover, 
	.button:hover {
		background-color: rgba(227,6,19,1.00);
		box-shadow: inset 0 0 20px rgba(0,0,0,0.25), 5px 5px 10px rgba(0,0,0,0.25);
		border-top: 1px solid rgba(255,255,255,0.50);
		border-left: 1px solid rgba(255,255,255,0.50);
		border-right: 1px solid rgba(0,0,0,0.50);
		border-bottom: 1px solid rgba(0,0,0,0.50);
		transform: scale(1.01);
		}

	
	input.button,
	input.button:hover{
		background-color: rgba(227,6,19,1.00) !important;
		color: #fff !important;		
		}



/* Sticky-Footer Responsive (
http://t3n.de/news/sticky-footer-display-table-536687
-------------------------------------------------------*/
	body, #ip-container { display: table; border-collapse: collapse; width: 100%; margin: 0; }
	/*header, footer { display: table-row; }*/
	#inhalt-sidebar-wrapper { display: table-row; height: 100%;}



/* Allgemeine Schriftformate
-----------------------------------------*/
	html {
		overflow-y: scroll; /* Scrollbar-fix*/
		}
	
	html,
	body { 
		font-family: "Roboto", sans-serif;
		font-weight: 400;
		font-style: normal;
		background-color: #ffffff;
		color: #222;	
		font-variant-ligatures: common-ligatures;
		/*font-feature-settings: "liga", "clig";
		font-variant-numeric: proportional-nums; 
		font-feature-settings: "pnum";
		font-variant-numeric: diagonal-fractions;  
		font-feature-settings: "frac";*/
		}
	
	
	strong { font-weight: 700; }
	
	h1,
	h2,
	h3,
	h4,
	h5,
	h6 {
		font-family: "Roboto Serif", serif !important;
		padding-bottom: 0.2em;
		text-align: left;
		clear: both;
		}
	
	p {
		line-height: 1.5;
		}
	a, 
	a:visited { 
		color: rgba(227,6,19,1.00);
		border-bottom: none;
		text-decoration: none;
		}
	a:hover, 
	a:active {
		color: rgba(227,6,19,1.00);
		outline: none;
		text-shadow: 0px 0px 10px rgba(205,234,249,1.00);
		}
	a:focus {
	  -moz-outline-style: none;
	}
	
	a.tel {
		cursor: default;	
		}
	
	footer a { white-space: nowrap; }
	
	hr { 
		/*border-color: rgba(227,6,19,0.10);*/
		border-color: rgba(0,0,0,0.10);
		margin: 4rem 0;
		}
		hr.half { 
		margin: 2.5rem  0 1.5rem 0;
		}
		hr:before,
		hr:after {
			content:"";
			display:table;
			}
		hr:after { clear:both }	
	
	
	mark {
		background-color: rgba(227,6,19,0.25);
		padding: 0 0.3em;
		}

	.kolumnen,
	.text-columns {
		 column-count: 3;
		 column-width: 200px;
		 column-gap: 6em;
		 column-rule: 1px solid rgba(0,0,0,0.15);
		 margin-bottom: 2rem;	  
		}
		.kolumnen.schmal { column-width: 150px; }
		
		p + .kolumnen,
		p + .text-columns {
			 margin-top: 2rem;	  
			}
	
	.rot { color: rgba(227,6,19,1.00); }


/* Grundstruktur
---------------------------------------------------------------------------------------------------------------------------*/
	.svg .sprite    { background-image: url('img/spritesheet.svg'); }
	.no-svg .sprite { background-image: url('img/spritesheet.png'); }






/* Header
---------------------------------------------------------------------------------------------------------------------------*/
	header {
		position: relative;
		display: block;
		width: 100%;
		height: 25vh;
		min-height: 200px;
        background-image: url('/wp-content/uploads/2021/03/20210316-DSC01308-Pano-Bearbeitet.jpg');
        background-position:  center center;
		/*background-image: url('img/header/headergrafik_smartphone.jpg');
		background-position: bottom center;*/
		background-size: cover;
		background-repeat: no-repeat;
		}
		.post-450 header /* Augenoptik/Leistungen*/ {}
		
		.post-529 header,	/* Hörgeräte/Anspruch */
		.post-466 header, 	/* Hörgeräte/Ablauf */
		.post-425 header, 	/* Hörgeräte/Sortiment */
		.post-600 header	/* Hörgeräte/Brain-Hearing */
			{
				background-image: url('img/header/header_hoergeraete_1_smartphone.jpg');
				background-position:  top right;
				}
		
		.post-427 header /* Hörgeräte/Leistungen */
			{
				background-image: url('img/header/header_hoerakkustik_2_smartphone.jpg');
				background-position: right center;
				}	
		
		.post-28 header /*  Kontakt */
			{
				background-image: url('img/header/panorama_braunlage_smartphone.jpg');
				background-position: center center;
				}
		
		
		#headergrafik_overlay {		
			position: absolute;
			top: 0;
			left: 0;
			bottom: 0;
			right: 0;
			background-position: bottom center;
			background-size: cover;
			background-repeat: no-repeat;
			pointer-events: none;
			}	
		
	#header-logo {
		background-color: rgba(255, 255, 255, 0.6);
		background-image: url("img/logo_lewonig.svg");
		background-position: center center;
		background-repeat: no-repeat;
		background-size: 90% 90%;
		border: 1px solid rgba(255, 255, 255, 0.9);
		box-shadow: 0 0 80px rgba(0, 0, 0, 0.4), inset 0 0 40px rgba(255,255,255,0.75);
		display: block;
		height: 100px;
		margin-top: -1px;
		width: 100%;
         backdrop-filter: blur(5px);
		}
	
	.header-text-wrapper {
		display: table;
		text-align: center;
		}
	#header-text {
		padding: 1rem;
		width: 100%;
		display: block; 
		text-align: center; 
		}
		#header-text .blau {
			color: rgba(227,6,19,1.00);
			}
		#header-text .light {
			margin-top: 0.5em;
			font-weight: 400;
			}





/* Hauptnavigation  | Rest im Plugin selbst
---------------------------------------------------------------------------------------------------------------------------*/	


	#hauptnavigation {
		background-color: rgba(227,6,19,1.00);
		}

	#mega-menu-wrap-main_menu #mega-menu-main_menu a.mega-menu-link {
		font-family: "Roboto Serif",serif !important;
		}
		
		
		#mega-menu-wrap-main_menu .mega-menu-toggle,
		.mega-menu mega-menu-horizontal {
			z-index: 999 !important; 
			}
		.is-sticky #hauptnavigation {
			width: 100%;
			z-index: 999;
			box-shadow: 0 0 10px rgba(0,0,0,0.70);
			}
		.is-sticky .row {
			padding-left: 0.5rem;
			}
		
		
		

	#ip-container #hauptnavigation {
		position: absolute;
		display: block;
		width: 100%;
		z-index: 100 !important;
		}




/* Icon-Menü
---------------------------------------------------------------------------------------------------------------------------*/	
	.menu-icon-navigation-container  {
		position: absolute;
		top: 100px;
		right: 5vw;
		}
	.menu-icon-navigation-container ul {
		list-style: none;
		margin: 0;
		padding: 0;
		line-height: none;
		}
	.menu-icon-navigation-container ul li {
		float: left;
		background-color: rgba(255,255,255,0.5);
		border-left: 1px solid rgba(0,0,0,0.50);
        backdrop-filter: blur(5px);
		}
		.menu-icon-navigation-container ul li:hover {
		background-color: rgba(255,255,255,0.9);
		}
		.menu-icon-navigation-container ul li:last-child {
			border-right: 1px solid rgba(0,0,0,0.50);
			}
	.menu-icon-navigation-container ul li a {
		font-size: 1.3em;	
		padding: 0.5em 0.5em 0;
		}
	
	.menu-icon-navigation-container ul li:hover a i {
			display: inline-block;
		}
	.menu-icon-navigation-container ul li:hover a i {
		transform: scale(1.2);
		}
		
	
	
	.magellan { display: none; }
	
	


#inhalt-sidebar-wrapper {
	display: block;
	max-width: 100%;
	height: auto;
	overflow-x: hidden;
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
	}





/* Inhalt
---------------------------------------------------------------------------------------------------------------------------*/
	#inhalt {
		z-index: 1;
		}
		
	#inhalt .row {
		margin-top: 2rem;
		}	
	
	#inhalt p {
		font-weight: 400;
		margin-bottom: 0.9em;
		line-height: 1.5em;
		text-align: justify;
		hyphens: auto;
		}
		
	#inhalt h1  { 	
		font-size: 1.5rem;
		font-weight: 700;
		padding-bottom: 0;
		margin-bottom: 1em;
		color: rgba(227,6,19,1.00);
		}
	#inhalt h2 {
		border-bottom: 1px solid rgba(227, 6, 19, 1);
		color: rgba(227, 6, 19, 1);
		font-size: 1.3rem;
		font-weight: 400;
		margin-bottom: 1.5rem;
		margin-top: 4rem;
		text-transform: uppercase;
		}
	#inhalt h2:first-child {
		margin-top: 0;
		}
		
	#inhalt h3 {
		color: rgba(227,6,19,1.00);
		font-size: 1.2rem;
		margin-top: 1.5em;
		font-weight: 700;
		}	
		
	#inhalt h1 + h2,
	#inhalt time + h2  { margin-top: -1em; }
	
	#inhalt h2 + h3,
	#inhalt time + h3  { margin-top: -0.5em; }	
	
	ul + h3,
	p + h3 { margin-top: 2em; }	
	
	#inhalt p a,
	#inhalt li a { 
		font-weight: 400;
		/*padding-bottom: 0.05em;
		border-bottom: 3px dotted rgba(227,6,19,1.00);*/
		} 
	
	#inhalt figure a,
	#inhalt a[href$='.jpg'],
	#inhalt a[href$='.png'],
	#inhalt a[href^='mailto:'],
	#inhalt #suchseite a { 
		padding: 0; 
		background-color: transparent;
		}
	
	a[href$='.pdf']:before {
		content: "\f18E";
		font-family:"foundation-icons";
		font-size: 1.2em;
		margin-right: 0.5em;
		color: #222;
		}
	
	small,
	.small { 
		font-size: 0.8em;
		color: #777;
		}
	
	.lieferant {
		color: #0FA00D !important;
	}


	blockquote {
		/*border-top: 8px solid rgba(227,6,19,1.00);
		border-bottom: 8px solid rgba(227,6,19,1.00);
		border-radius: 20px;
		padding: 2rem;*/
		
		padding: 0;
		border-left: 0;
		margin-top: 2rem;
		margin-bottom: 4rem;
		text-align: left;
		}
		blockquote, blockquote p {
			color: #222;
			}
		blockquote i {
			color: rgba(227,6,19,1.00);
			}
		
		
	.panel {
		position: relative;
		color: #ffffff;
		padding: 1rem 1rem 2rem 1rem;
		background-color: rgba(227,6,19,1.00);
		background-image: url("img/hintergrund_panel_welle.jpg");
		background-position: bottom center;
		background-repeat: no-repeat;
		background-size: 100%;
		border-radius: 3px;
		margin: 4rem 0;
		text-align: left;
		}
		.panel.alert {
			background-image: none;
			padding: 2rem;
			box-shadow: 0 0 20px rgba(0,0,0,0.40);
			}
		h1 + .panel {
			margin-top: 2rem;
			}		
		#inhalt .panel h2 {
			position: absolute;
			top:-1rem;
			left: 1rem;
			right: 1rem;
			
			display: block;
			margin-top: 0;
			min-height: 2rem;	
			
			text-align: center;
			background: rgba(0, 0, 0, 0) linear-gradient(to bottom, #5a5a5a, #3c3c3c) repeat scroll 0 0;
			border-radius: 3px;
			
			font-size: 1.2rem ;
			color: #ffffff;
			text-transform: none;
			padding: 0.4em 0;
			}
			#inhalt .panel  h3 {
			margin-top: 0;
		}
		#inhalt .panel h4 {
			color: #ffffff;
			margin-bottom: 0;
			}
		#inhalt .panel p {
			margin-bottom: 0.5em;
			}
		#inhalt .panel a {
			color: #ffffff;
			}
		#inhalt .panel ul li {
			margin-bottom: 0.25em;
			}



		#inhalt .panel li:before {
			content: "• ";
			color: #fff;
			}
		
		






/* Bilder
-----------------------------------------*/
	figure { margin: 0 !important; }
	
	figcaption {
		text-align: center;
		font-size: 0.8em;
		}
		
	.alignleft,
	.alignright,
	.aligncenter {
		border: 4px solid rgba(255, 255, 255, 1.0);
		}
		
	.alignleft img,
	.alignright img,
	.aligncenter img { 
		width: inherit;
		height: auto;
		}
	
	.alignleft,
	.alignright { 
		margin-top: 4px;
		margin-bottom: 1em;
		max-width: 40%; 
		/*	clear: both;*/
		}
	.alignleft,
	figure.alignleft { 
		float: left; 
		margin-right: 2rem; 
		}
		
	.alignright,
	figure.alignright { 
		float: right; 
		margin-left: 2rem;
		}

	figure.alignright { 
		margin-left: 1em !important;
		}
	
	.aligncenter,
	figure.aligncenter { 
		margin: 1rem 0;
		width: 100%;
		max-width: 100%;
		height: auto; 
		}
	
	.ohne,
	.kein-schatten { 
		border: none !important;
		box-shadow: none !important;
		transform: none !important;
		}


	.alignright.foto-ohrenbank {
		margin-left: 0;
		margin-top: 1rem;
		max-width: 100% !important;
		}





/* Galerie */
	.gallery {
		margin: 2rem -2.8% 2rem 0;
		}
	 
	.gallery-item {
		float: left;	
		text-align: left;
		width: 28%;
		margin: 0 5% 5% 0;
		}
	.gallery img { 
		position: relative;
		box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.25);
	 }
	.gallery img:hover {	
		border: double 4px rgba(0,0,0,0.80);
	 }
	 
	.gallery a {
		width: 100%;
		height: 100%;
		display: block;
		position: relative;
		}
	
	.rgg_imagegrid {
		clear: both;
		margin: 1rem 0;
		}
		.rgg_imagegrid:after {
			width: 100%;
			display: block;
			content: ' ';
			height: 1px;
			clear: both;
			}






/* FlexVideo 
-----------------------------------------*/
	
	.flex-video {
	  height: 0;
	  margin-bottom: 1rem;
	  overflow: hidden;
	  padding-bottom: 67.5%;
	  padding-top: 1.5625rem;
	  position: relative; }
	  .flex-video.widescreen {
		padding-bottom: 56.34%; }
	  .flex-video.vimeo {
		padding-top: 0; }
	  .flex-video iframe,
	  .flex-video object,
	  .flex-video embed,
	  .flex-video video {
		height: 100%;
		position: absolute;
		top: 0;
		width: 100%;
		left: 0; 
		}
	
	
	.flex-video  {
		margin: 3rem 0;
		}
		#sidebar .flex-video  {
			margin: 1rem 0;
			}
			
	.flex-video iframe, .flex-video object, .flex-video embed, .flex-video video {
		border: none;
		}






/* Tabelle
-----------------------------------------*/




/* Liste
-----------------------------------------*/
	#inhalt ul {
		list-style: none outside ;
		margin: 1em 0;
		padding: 0 0 0 0;
		font-size: 1em;
		} 
		#inhalt .kolumnen ul {
			margin: 0;
			} 

	
			
	#inhalt li {
		padding-left: 0.2em; 
		text-indent: -0.8em;
		margin-bottom: 0.8em;
		position: relative;
		} 
	


#inhalt li:before {
		content: "• ";
		color: rgba(227,6,19,1.00);
		}
#inhalt ul.blocks-gallery-grid li:before {
		content: "";
		}
		
		
	#inhalt h3 + ul { margin-top: 0; } 


	#inhalt ul.anweisungen {
		list-style: none inside;
			}
	#inhalt ul.anweisungen li:before {
		content: inherit !important;
			} 
	#inhalt ul.anweisungen li {
			margin: 0 0 1rem 0;
			text-indent: 0;
			background-color: rgba(0,0,0,0.05);
			padding: 1em;
			display: block;
			border-radius: 8px;
			border-left: 2px solid rgba(227,6,19,1.00);
			border-right: 2px solid rgba(227,6,19,1.00);
			}
			#inhalt ul.anweisungen li:hover {
				transform: scale(1.05) !important;
				box-shadow: 0 0 20px rgba(0,0,0,0.30);
			} 

#inhalt ul.blocks-gallery-grid {
		list-style: none !important;
		}




/* Tabelle
-----------------------------------------*/
 table {
	 margin: 2rem 0;
	 }
	
 table tr {
	 border-bottom: 1px solid rgba(0,0,0,0.15);
	 }
 	table tr:last-child {
		 border-bottom: none;
	 	}
 table td {
	 border-right: 1px solid rgba(0,0,0,0.15);
	 padding: 1rem;
	 }
 	table td:last-child {
		 border-right: none;
	 	}

	.fi-check { 
		color:rgba(89,200,0,1.00);
		}




/* Öffnungszeiten
-----------------------------------------*/
.wochentag {
			font-weight: 700;
			width: 130px;
			float: left;
			}



/* Blogansicht
-----------------------------------------*/
	.blog .row,
	.blog-single .row { 
		margin: 0 auto; 
		}
		
	.blog .hintergrund,
	.blog-single .hintergrund {
		background-color: transparent;
		padding: 0;
		margin: 0;
		}
		
	
	#inhalt time {	
		clear: both;
		display: block;
		padding: 0.25em 0.75rem;
		margin: -1.5rem 0 2rem 0;
		font-size: 0.875em;
		text-align: right;
		}
	#inhalt a time {
		color: #777;
		}
	#inhalt.blog.single time {
		border-top: 1px solid rgba(227,6,19,1.00);
		}
	
	.blog .content,
	.blog-single .content {
		padding: 0.5rem;
		background-color: rgba(255,252,247,0.50);
		margin-bottom: 2rem;
		}
	
	.blog time,
	.blog-single time {
		margin: -3.5em 0 2em 0;
		}	
	
		
	#inhalt.blog-single h1 {
		border-bottom: none;
		font-size: 1.8rem;
		}
	#inhalt.blog h2 {
		font-family: 'Sacramento', cursive;	
		font-size: 1.8rem;
		}
		
	.post-navigation {
		border-top: 1px solid rgba(0,0,0,0.25);
		padding-top: 0.5em;
		margin-top: 4em;
		font-weight: 300;
		color: rgba(0,0,0,0.25);
		font-size: 0.875rem;
		}
	.post-navigation h2.screen-reader-text { display: none; }	
	
	
	.post-navigation .nav-previous {
		display: block;
		width: 49%;
		float: left;
		}
		.post-navigation .nav-previous:before {
			content: "\f10a";
			font-family:"foundation-icons";
			margin-right: 0.5em;
			}
	.post-navigation .nav-next {
		display: block;
		width: 49%;
		float: right;
		text-align: right;
		}	
		.post-navigation .nav-next:after {
			content: "\f10b";
			font-family:"foundation-icons";
			margin-left: 0.5em;
			}
			
.content {margin-bottom: 6em;}
	



/* Paginierung auf Archive-Seite
-----------------------------------------*/


	#inhalt ul.page-numbers {
		display: block;
		text-align: center;
	}
	#inhalt ul.page-numbers li {
		display: inline-block;
		margin: 0 0.15rem;
		padding: 0;
		text-indent: 0;
		background: rgba(153,153,153,1.00);		
		font-size: 0.875em;
		}
	#inhalt ul.page-numbers li:before { display: none;}
	
	#inhalt ul.page-numbers li a {
		display: block;
		padding: 0.5em 1em;
		color: #000;
		border-bottom: none !important;
		}
	#inhalt ul.page-numbers span.current {
		display: block;
		padding: 0.5em 1em;
		background: rgba(227,6,19,1.00);
		color: #fff;
		font-weight: 700;
		}
	
	#inhalt ul.page-numbers li:hover a,
	#inhalt ul.page-numbers li a:focus {
		background: rgba(227,6,19,1.00);
		color: #fff;
		}
		
	#inhalt ul.page-numbers li.current a:hover, 
	#inhalt ul.page-numbers li.current a:focus {
		background: rgba(227,6,19,1.00);
		}





/* Blogansicht: Einzelseite - allgemein
-----------------------------------------*/
	#blog-single .post-navigation {
		border-top: 1px solid rgba(0,0,0,0.25);
		padding-top: 0.5em;
		margin-top: 4em;
		font-weight: 400;
		color: rgba(0,0,0,0.25);
		}
	#blog-single .post-navigation h2.screen-reader-text { display: none; }	
	
	#blog-single .post-navigation a {
		border-bottom: none !important;
		}
	
	#blog-single .post-navigation .nav-previous {
		display: block;
		width: 49%;
		float: left;
		}
		#blog-single .post-navigation .nav-previous:before {
			content: "\f10a";
			font-family:"foundation-icons";
			margin-right: 0.5em;
			}
	#blog-single .post-navigation .nav-next {
		display: block;
		width: 49%;
		float: right;
		text-align: right;
		}	
		#blog-single .post-navigation .nav-next:after {
			content: "\f10b";
			font-family:"foundation-icons";
			margin-left: 0.5em;
			}
		
		
		


/* Sidebar
---------------------------------------------------------------------------------------------------------------------------*/

	#sidebar {
		position: relative;
		background-color: rgba(153,153,153,0.10);
		padding-top: 2rem;
		font-size: 1rem;
		}
		#sidebar:after {
		background-color: rgba(153,153,153,0.10); 
		display: block;
		height: 100%;
		left: 100%;
		right: -50%;
		position: absolute;
		top: 0;
		width: 1000px;	
		}
		
	
	
	
	#sidebar h2,
	#sidebar h2 a {
		font-size: 1.375rem;
		color: rgba(227,6,19,1.00);
		margin: 0 0 0.5em 0;
		}
		#sidebar h2:first-child {
			margin-top: 2.3rem;
			}
			
	#sidebar h3 {
		display: block;
		font-size: 0.875rem;
		margin: 0 0 0 0;
		}
		
	#sidebar img {
		width: 100%;
		height: auto;
		border: 4px solid rgba(255,255,255,0.80);
		margin: 0.25rem 0;
		}
		
	#sidebar ul {
		list-style: none;
		margin: 0;
		}
	
	#sidebar ul li {
		font-size: 1rem;
		display: inline-block;
		margin-bottom: 2rem;
		}
		#sidebar ul li:last-child {
			margin-bottom: 1rem;
			}
		
	#sidebar ul li a {
		display: block;
		color: #222;
		}
		
	#sidebar .weiterlesen {
		display: block;
		font-family: "Roboto Serif",serif;
		font-size: 0.875rem;
		text-align: right;
		color: rgba(227,6,19,1.00);
		font-weight: 700;
		}





/* Markenslider 
-------------------------------------------------------------------------------------------------------------------------*/

	#markenslider-wrapper {
		display: block; 
		margin-bottom: 0.5rem;
		height: 120px;		
		background-color: rgba(0,0,0,0.10);
		max-width: calc( 100vw - 20px );
		}
		
		
		#markenlogos .slick-slide {	
			height: 120px;
			display: inline-block;
			position: relative;
			margin-left: auto;
  			margin-right: auto;
			}	
			#markenlogos .slick-slide img {
				position: absolute;
				border: none;
				bottom: 0;
				left: 0;
				right: 0;
				top: 0;
				margin: auto;
				padding: 0 2rem;
				max-height: 90%;
				}


/* Footer 
-------------------------------------------------------------------------------------------------------------------------*/
	footer {
		background-color: rgba(227,6,19,1.00);
		color: #fff;
		font-size: 1rem;
		}
		
	footer .columns {
		margin-bottom: 2rem;
		}	
			
	footer h2 {
		font-size: 1.4rem;
		margin: 1em 0 0 0;
		color: #fff;
		font-weight: 700;
		}
		
	footer h4 {
		font-size: 1.1rem;
		font-weight: 700;
		margin-bottom: 0;
		color: #fff;
		}
	
	footer p {
		font-size: 1em;
		font-weight: 400;
		margin-bottom: 0.75em;
		line-height: 1.4em;
		overflow: hidden; /* this is what keep the <p> from wrapping */
		}	
	
	footer ul { 
		margin: -4px 0 1em 0;
		padding: 0 0 0 0;
		list-style: none;
		display:  inline-block;
		}
	footer li { 
		display: compact;
		border-bottom: 1px solid rgba(255,255,255,0.40); 
		padding: 6px 3px;
		}
		footer li:first-child { margin-top: -6px; }
		footer li:last-child { border-bottom: none !important; }
		footer li:hover { background-color: rgba(120,53,99,0.1);  }
		footer li a { }
	
				
	footer a,
	footer a:visited {  
		color: #fff;
		}
	footer a:hover { 
		color: rgba(255,255,255,0.80);
		}
	
	footer i {
		font-size: 1.5em;
		font-style: normal;
		color: rgba(255,255,255,1.00);
		display: inline-block;
		margin-right: 0.25rem;
		}
	
	footer img {
		border: 4px solid white;
		margin-bottom: 2rem;
		}
	
	footer .wrapper {
		overflow: hidden;
		}
	
	footer #nach-oben {
		position: absolute;
		bottom: 0.5rem;
		right: 5vw;
		display: inline-block;
		}
		footer #nach-oben:before {
			display: block;
			float: left;
			width: 15px;
			height: 13px;
			margin-right: 0.5rem;
			margin-top: 0.25rem;
			content: '';
			background-image: url('img/spritesheet.svg'); 
			background-position: 0px -50px;			
			}
		footer #nach-oben:hover:before {
			transform: translate(0,-0.5em) scale(1.2);
			}
		









/* PlugIns
---------------------------------------------------------------------------------------------------------------------------*/
  
   
   
   /* Sidebar links   | Submenü
---------------------------------------------------------------------------------------------------------------------------*/

	#sidebar ul.subpages {
		display: inline-block;
		list-style: none;
		margin: 0 0 4rem 0;
		}
	
	#sidebar ul.subpages li {
		display: block; 
		margin-bottom: 0;
		border-bottom: 1px solid rgba(227,6,19,1.00);	
		}
	
	#sidebar ul.subpages li:last-child {
		border-bottom: none;	
		}
		
	#sidebar ul.subpages li a,
	#sidebar ul.subpages li a:visited {
		display: block;
		font-size: 0.875em;
		font-weight: 400;
		color: #555;
		padding: 1em 0;	
		}
	#sidebar ul.subpages li:first-child a {
		padding: 0 0 1em 0;	
		}
				
	#sidebar ul.subpages li.current_page_item a,
	#sidebar ul.subpages li.current_page_parent > a,
	#sidebar ul.subpages li:hover a {
		color: rgba(227,6,19,1.00);
		}

   
   
   
   


		/* Contact-Form 7
	-----------------------------------------*/
	.wpcf7-form h3 { margin-top: 1.5em;	}
	
	fieldset:hover { background-color: rgba(255,255,255,0.8); }
	
	form .row { margin-top: 0 !important; }
	
	fieldset {
		margin-bottom: 1rem;
		}	
		
	fieldset legend {
		background-color: fff;
		padding: 1rem;
		font-weight: 400;
		}
	
	.kontakt a.button,
	.kontakt a.button:visited  { color: #fff; }	
	
	.wpcf7-form input,
	.wpcf7-form textarea,
	.wpcf7-form select {
		border: 1px solid rgba(0,0,0,0.10);
		font-size: 1em;
		width: 100%;
		margin-bottom: 1rem;
		padding: 0.25em;
		}
	
	.wpcf7-form input.wpcf7-validates-as-required,
	.wpcf7-form textarea.wpcf7-validates-as-required {
		border: 1px solid rgba(227,6,19,1.00);
		background-color: #fff;	
		}	
	
	.wpcf7-form input.error,
	.wpcf7-form textarea.error {
		border: 1px solid #C60F13;
		}	
	
	.wpcf7-submit {
		font-size: 1.2em !important;
		}	
	
	.error small, 
	small.error,
	label.error {
		background: none repeat scroll 0 0 #C60F13;
		color: #FFFFFF;
		display: block;
		font-size: 0.75em;
		margin-bottom: 1em;
		margin-top: -1.3125em;
		padding: 0.375em 0.25em;
		}
	
	.wpcf7-not-valid {
		box-shadow: 0 0 10px rgba(0,0,0,0.30) !important;
		border-color: rgba(227,6,19,1.00) !important;
		}
	span.wpcf7-not-valid-tip {
		background-color: rgba(227,6,19,0.20);
		color: #000 !important;
		display: block;
		font-weight: 400;
		font-size: 0.875em !important;
		margin: -1em 0 1em;
		padding: 0.25em 0.5em;
		}
	
	div.wpcf7-response-output,
	div.wpcf7-validation-errors {
		padding: 2em !important;
		background-color: #bccf01;
		color: #fff !important;
		border: none !important;
		margin: 2em 0 !important;		
		box-shadow: inset 0 0 40px rgba(0,0,0,0.25);
		}
		
	div.wpcf7-validation-errors,
	.wpcf7-form.failed .wpcf7-response-output {
		background-color: #D11313;
		}
	
	
	:-webkit-input-placeholder { color:#555; }
	::-moz-placeholder { color:#555; } /* firefox 19+ */
	:-ms-input-placeholder { color:#555; } /* ie */
	input:-moz-placeholder { color:#555; }




/* Leaflet Marker
-----------------------------------------*/
	.leaflet-popup-content-wrapper {
		border-radius: 0px !important;
		}
	
	#lmm_map_8b1d4c5c,
	.leaflet-container {
		height: 25vh !important;
		}


/* Suchergebnisse
-----------------------------------------*/
	.relevanssi-query-term  {
		color: rgba(227,6,19,1.00);
		font-weight: 700;
		}
	#suchseite a.more-link  {
		text-align: right;
		display: block;
		font-weight: 700;
		}
		
	#s {
		font-size: 1.25rem;
		height: auto;
		padding: 1em;
		width: 100%;
		margin-bottom: 1rem;
		}


/* Foundation-Magellan Navigation
-----------------------------------------*/
	
	[data-magellan-expedition] {
		background-color: rgb(60,60,60);		
		}	
		.sub-nav {
			display: table;
			width: 100%;
			max-width: 1100px;	
			margin: 0 auto;
			text-align: center;
			}			
			[data-magellan-expedition] .sub-nav dt, 
			[data-magellan-expedition] .sub-nav dd, 
			[data-magellan-expedition] .sub-nav li {
				color: #ffffff;
				display: table-cell;
				}
				.sub-nav dt a, 
				.sub-nav dd a, 
				.sub-nav li a {
					color: #fff;
					padding: 0.75em;
					display: block;
					}
	
	
		
	[data-magellan-expedition].fixed {
		z-index: 99999;
		box-shadow: 0 2px 2px rgba(0,0,0,0.20);
		width: 100%;
		top: 40px !important;
		}	
		[data-magellan-expedition].fixed .sub-nav {
			}	
			[data-magellan-expedition].fixed .sub-nav dt, 
			[data-magellan-expedition].fixed .sub-nav dd, 
			[data-magellan-expedition].fixed .sub-nav li {
				color: #ffffff !important;
				margin-left: 1em;
				}
				[data-magellan-expedition].sub-nav dt.active a, 
				[data-magellan-expedition].sub-nav dd.active a, 
				[data-magellan-expedition].sub-nav li.active a {
					background: none !important;
					color: rgba(227,6,19,1.00) !important;
					}	
					[data-magellan-expedition].fixed .sub-nav a:link,
					[data-magellan-expedition].fixed .sub-nav a:hover,
					[data-magellan-expedition].fixed .sub-nav a:visited {
						color: #ffffff !important;
						border-bottom: none !important;
						}	
						[data-magellan-expedition].fixed .sub-nav dt.active a, 
						[data-magellan-expedition].fixed .sub-nav dd.active a, 
						[data-magellan-expedition].fixed .sub-nav li.active a {
							background: none repeat scroll 0 0 #ffffff !important;
							border-radius: 1px;
							color: rgba(227,6,19,1.00) !important;
							}











/* Card-Flip
-----------------------------------------*/
	.flipcard {
		float: left;
		margin-bottom: 3rem;
		width: 100%;
		position: relative;
		perspective: 1000px;
		cursor: pointer
		}
		/* letzes der Reihe jeweils nur in den Queries von/bis um */
		
	.flipcard .front,
	.flipcard .back {
		position: absolute;	
		top: 0;
		left: 0;	
		transform-style: preserve-3d;
		backface-visibility: hidden;
		transition: all .4s ease-in-out;
		background-color: rgba(227,6,19,1.00);
		border-radius: 3px;
		}
		.flipcard.elternzeit .front,
		.flipcard.elternzeit .back {
			background-color: rgba(155,155,155,1.00);
			}		
	.flipcard .front {
		float: none;
		z-index: 900;		
		width: 100%;	
		text-align: center;
		box-shadow: 0 1px 5px rgba(0,0,0,0.9);
		transform:  rotateY(0deg);
		}	
	/*.flipcard .back {
		padding: 4%;
		float: none;
		top: 0;
		left: 0;
		z-index: 800;
		width: 100%;
		border: 1px solid #ccc;
		transform: rotateY(-179deg);
		-ms-transform: rotateY(0deg);
		}
		.flipcard.flip .front,
		.flipcard:hover .front {
			z-index: 900;
			border-color: #eee;
			background: #fff;
			box-shadow: 0 15px 50px rgba(0,0,0,0.2);	
			transform: rotateY(180deg);		
			-ms-transform: rotateX(0) rotateY(-180deg);
			}
		.flipcard.flip .back,
		.flipcard:hover .back {
			z-index: 1000;
			transform: rotateX(0deg) rotateY(0deg) scale(1.15);
			box-shadow: 0 15px 50px rgba(0,0,0,0.2), inset 0 0 40px rgba(0,0,0,0.25);		
			transform: rotateY(0deg);			
			}	*/	
		
	.flipcard .funktion {
		position: relative; /* benötigt für Scrollbar */
		display: block;
		width: 100%;
		max-height: 100%;
		overflow: hidden;
		padding: 20px;
		background-color: #fff;
		border-radius: 3px;
		
		}
	
	.flipcard img {
		margin: 0;
		border-radius: 3px;
		box-shadow: none;
		}
	
	.flipcard h4 {
		font-size: 1.2rem;
		color: #fff;
		text-align: center;
		padding: 0.25em 0;
		margin: 0;
		border-radius: 0 0 3px 3px ;
		}
	.flipcard h5 {		
		font-size: 1rem;
		margin: 0 0 0.5em 0;
		}
	.flipcard p {		
		font-size: 0.875rem;
		line-height: 1.3em !important;
		text-align: left !important;
		}
	

/*  perfect-scrollbar.js
	http://noraesae.github.io/perfect-scrollbar/
-----------------------------------------*/
	#inhalt .ps-scrollbar-y-rail,
	#sidebar-scroll-content .ps-scrollbar-y-rail {
		opacity: 1.0 !important;
		}
	#inhalt:hover .ps-scrollbar-y-rail,
	#sidebar-inhalt:hover .ps-scrollbar-y-rail,
	#sidebar-scroll-content:hover .ps-scrollbar-y-rail {
		opacity: 1 !important;
		background-color: rgba(227,6,19,1.00);
		width: 4px;
		padding: 0.5em 0;
		}
	#inhalt .ps-scrollbar-y,
	#sidebar-inhalt .ps-scrollbar-y,
	#sidebar-scroll-content .ps-scrollbar-y  {
		background-color: rgba(153,153,153,1.00) !important;
		width: 4px;	  
		}			
	.ps-scrollbar-x-rail {
		display: none !important;		
		}  
		
			

/* Shariff
-----------------------------------------*/	
#inhalt .shariff li,
footer .shariff li {
	margin: 0 1px 0 0 !important;
	margin-right: 1px !important;
	margin-left: 0 !important;
	border: 0px;
}

#inhalt .shariff-main {
		float: right;
		text-align: right;
		margin-top: 1rem;
		}
	#inhalt .shariff-main:after {
		clear: both;
		display: block;
		content: '';
		height: 1px;
		margin-bottom: 4rem;
}

	


/* Schatteneffekte + helle Kante + Radius
---------------------------------------------------------------------------------------------------------------------------*/
	.alignleft,
	.alignright,
	.aligncenter,
	fieldset:hover,
	#sidebar img,
	.menu-icon-navigation-container {
		box-shadow: 0 0 4px rgba(0,0,0,0.30);	
		}
	
	xxx {	
		border-top: 1px solid rgba(255,255,255,1.00);
		}
		
	xxx {	
		border-radius: 3px;
		}



/* Animationen
---------------------------------------------------------------------------------------------------------------------------*/
	body,
	a, 
	textarea,
	tr,
	td,
	img,
	ul,
	li,
	.open,
	.closed,
	.panel,
	button, 
	.button,
	fieldset,
	i,
	#nach-oben:before {
		transition: all 0.3s ease;
	}


	

/* Animationen aufheben
---------------------------------------------------------------------------------------------------------------------------*/
	
	.already-visible {
		transform: translateY(0) !important;
		animation: none !important;
		}
	
	.rgg_imagegrid img,
	a.rgg-a,
	.rgg-a img  {
		transition: none;
		}


/* wagnergraphics
-----------------------------------------*/
	.wagnergraphics {
		margin-left: -10px;
		max-width: 380px;
		}









/* Media Queries
---------------------------------------------------------------------------------------------------------------------------*/

/* Small screens 
Define mobile styles */
@media only screen { } 

/* max-width 640px, mobile-only styles, use when QAing mobile issues */  
@media only screen and (max-width: 40em) {	
	

} 


/* min 30 em and max-width 640px, mobile-only styles, use when QAing mobile issues */  
@media only screen and (min-width: 25em) and (max-width: 40.062em) {  

	.flipcard {
			margin-right: 10%;
			width: 45%;
			}
			.flipcard:nth-child(odd) {
				margin-right: 0;
				}

}


/* Medium screens 
min-width 641px, medium screens */ 
@media only screen and (min-width: 40.063em) { 

	
	
	/* Header
	---------------------------------------------------------------------------------------------------------------------------*/
		
		header {
		height: 45vh;
		min-height: 320px;
		}
		
		header {          
            background-image: url('/wp-content/uploads/2021/03/20210316-DSC01308-Pano-Bearbeitet.jpg');
            background-position:  center center;
			/*background-image: url('img/header/headergrafik.jpg');*/
			}
		
		.post-529 header,	/* Hörgeräte/Anspruch */
		.post-466 header, 	/* Hörgeräte/Ablauf */
		.post-425 header, 	/* Hörgeräte/Sortiment */
		.post-600 header	/* Hörgeräte/Brain-Hearing */
			{
				background-image: url('img/header/header_hoergeraete_1.jpg');
				background-position:  top right;
				}
		
		.post-427 header /* Hörgeräte/Leistungen */
			{
				background-image: url('img/header/header_hoerakkustik_2.jpg');
				background-position: right center;
				}	
		
		.post-28 header /*  Kontakt */
			{
				background-image: url('img/header/panorama_braunlage.jpg');
				background-position: center center;
				}
		
		
        /*#headergrafik_overlay {
            background-image: url('img/header/headergrafik.png');
            }*/
			#page.post-529 #headergrafik_overlay,
			#page.post-466 #headergrafik_overlay,
			#page.post-425 #headergrafik_overlay,
			#page.post-600 #headergrafik_overlay,
			#page.post-427 #headergrafik_overlay,
			#page.post-28  #headergrafik_overlay 
				{
					background-image: none;
					}	
				
		#header-logo {
			height: 150px;
            backdrop-filter: blur(5px);
			}	
		
		.menu-icon-navigation-container  {
			top: 0;
			}	
	
		.magellan { display: block; }
		
		
		#mega-menu-wrap-main_menu .mega-menu-toggle,
		.mega-menu mega-menu-horizontal {
			z-index: 1 !important; 
			}
		
		
	
	
	/* Inhalt
	---------------------------------------------------------------------------------------------------------------------------*/
		#inhalt {
			padding-top: 4rem;
			padding-bottom: 4rem;
			}		
		
		#inhalt .alignleft,
		#inhalt .alignright { 
			max-width: 50%; 
			}		
		
		.flipcard h4 {
			font-size: 1.2rem;
			}		
		
		.panel {
			padding: 2rem 2rem 4rem 2rem;
			}
			.panel h3 {
				color: #fff !important;
				}

	
	
	/* Sidebar
	---------------------------------------------------------------------------------------------------------------------------*/
		#sidebar {
			margin-top: 0;
			padding-left: 2rem;
			}
		
		
	/* Footer
	---------------------------------------------------------------------------------------------------------------------------*/	
	
		.footer-1,
		.footer-2 {
			margin-bottom: 0;
			}
		
	

} 

/* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
@media only screen and (min-width: 40.063em) and (max-width: 64em) { 

	.flipcard {
		margin-right: 5%;
		width: 30%;
		}			
		.flipcard:nth-child(3n+1) {
			margin-right: 0;
			}

} 
 

/* Large screens 
min-width 1025px, large screens */
@media only screen and (min-width: 64.063em) {
	
	
	/* Foundation - Overrides
	-----------------------------------------*/
	.row { max-width: 1200px !important; }
	
	.reveal-modal-bg { 
		position: fixed;
	}
	.reveal-modal {
		position: fixed;
		max-height: 95%;
		overflow-y: auto;
		}
		
			
	/* Inhalt
	---------------------------------------------------------------------------------------------------------------------------*/	
	#inhalt { }
	
	.flipcard {
			margin-right: 4%;
			width: 22%;
			}			
			.flipcard:nth-child(4n+1) {
				margin-right: 0;
				}
	
	
	/* Footer
	---------------------------------------------------------------------------------------------------------------------------*/	
	
			
	footer .logo {
		float: left;
		height: 200px;
		}

	
} 
 
/* min-width 1024px and max-width 1440px, use when QAing large screen-only issues */
@media only screen and (min-width: 64.063em) and (max-width: 90em) { } 
 

/* XLarge screens 
min-width 1441px, xlarge screens */
@media only screen and (min-width: 90.063em) {} 
 
/* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */ 
@media only screen and (min-width: 90.063em) and (max-width: 120em) { 

	header {
		min-height: 400px;
		}

} 

/* XXLarge screens 
min-width 1921px, xlarge screens */
@media only screen and (min-width: 120.063em) {
	
	header {
		min-height: 550px;
		}
		
} 

/* Apply styles to screens in landscape orientation */
@media only screen and (orientation: landscape) {}

/* Apply styles to screens in portrait orientation */
@media only screen and (orientation: portrait) {

  }



/* We also use Modernizr to add a .touch class to the body when applicable */
/* You can prepend this class to anything and it will style only for touch devices */
.touch .your-element {}



@media print {
 
  .large-1 { width: 8.33333%; }
  .large-2 { width: 16.66667%; }
  .large-3 { width: 25%; }
  .large-4 { width: 33.33333%; }
  .large-5 { width: 41.66667%; }
  .large-6 { width: 50%; }
  .large-7 { width: 58.33333%; }
  .large-8 { width: 66.66667%; }
  .large-9 { width: 75%; }
  .large-10 { width: 83.33333%; }
  .large-11 { width: 91.66667%; }
  .large-12 { width: 100%; }
  
  
  header,
  #top-menu,
  #hauptmenue,
  #nach-oben
   { display: none; }
  
  .print {
	   display:inherit !important; 
	}
	
}