@charset "utf-8";
/* CSS Document */
/* Copyright 2021 Hoppe Websolutions */

/* alegreya-sans-300 - latin */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/alegreya-sans-v8-latin-300.eot'); /* IE9 Compat Modes */
  src: local('Alegreya Sans Light'), local('AlegreyaSans-Light'),
       url('../fonts/alegreya-sans-v8-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/alegreya-sans-v8-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/alegreya-sans-v8-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/alegreya-sans-v8-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/alegreya-sans-v8-latin-300.svg#AlegreyaSans') format('svg'); /* Legacy iOS */
}
/* alegreya-sans-regular - latin */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/alegreya-sans-v8-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Alegreya Sans Regular'), local('AlegreyaSans-Regular'),
       url('../fonts/alegreya-sans-v8-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/alegreya-sans-v8-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/alegreya-sans-v8-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/alegreya-sans-v8-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/alegreya-sans-v8-latin-regular.svg#AlegreyaSans') format('svg'); /* Legacy iOS */
}
/* alegreya-sans-500 - latin */
@font-face {
  font-family: 'Alegreya Sans';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/alegreya-sans-v8-latin-500.eot'); /* IE9 Compat Modes */
  src: local('Alegreya Sans Medium'), local('AlegreyaSans-Medium'),
       url('../fonts/alegreya-sans-v8-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/alegreya-sans-v8-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/alegreya-sans-v8-latin-500.woff') format('woff'), /* Modern Browsers */
       url('../fonts/alegreya-sans-v8-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/alegreya-sans-v8-latin-500.svg#AlegreyaSans') format('svg'); /* Legacy iOS */
}

.clearfix { zoom:1; }
.clearfix:before, .clearfix:after {
	content:"\0020";
	display:block;
	height:0;
	overflow:hidden;
}
.clearfix:after { clear:both; }
* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.preload * {
	transition: none !important;
}
html {
	height: 100vh !important;
	min-height: 100%;
	overflow-y: scroll;
	font-size: 115%;
}
body {
	position: relative;
	font-family: 'Alegreya Sans', sans-serif;
	line-height: 1.6;
	color: #676767;
	font-weight: 400;
	background-color: #ecf7d8;
}
span.not-mobile, .not-mobile {
	display: none;
}
span.mark {
	background-color: #a2d53a;
	color: #FFF;
	font-weight: 500;
	margin-left: 0.5em;
	padding: 0.1em 0.25em;
	/*padding: 0.1em 0.25em;*/
}
a, img {
	outline: none;
}
p, ul, ol ,dl, h1, h2, h3, h4, h5, h6 {
	margin: 0;
}
p, ul, ol ,dl {
	font-size: 1em;
	padding: 0 0 1em 0;
}
dl {
	display: flex;
	flex-flow: row;
	flex-wrap: wrap;
	width: 100%;
	overflow: visible;
}
dt {
	flex: 0 0 25%;
	text-overflow: ellipsis;
	overflow: hidden;
}		
dd {
	flex: 0 0 75%;
	margin-left: auto;
	text-align: left;
	text-overflow: ellipsis;
	overflow: hidden;	
}
.quelle {
	font-size: 0.9em;
	font-weight: 300;
}
ul {
	list-style-type: square;
	margin-left: 0.6em;
	padding-left: 0.6em;
}
ul li {
	padding-bottom: 0.5em;
}
h1, h2, h3, h4 {
	color: #a2d53a;
	line-height: 1.2;
	padding: 0 0 0.5em 0;
	text-transform: uppercase;
	font-weight: 500;
}
h1 {
	font-size: 1.5em;
	padding: 0 0 0.5em 0;
}
h2 {
	font-size: 1em;
	color: #676767;
}
h3 {
	font-size: 1.1em;
	color: #FFF;
	background-color: #a2d53a;
	display: inline-block;
	padding: 0.125em 0.5em;
	margin: 0.5em 0 0.75em 0;
	text-transform: none;
}
span.marker {
	color: #FFF;
	background-color: #a2d53a;
	display: inline-block;
	/*padding: 0.02em 0.125em;*/
	/*margin: 0.25em 0 0.75em 0;*/	
}
h3 span {
	color: #676767;
	text-transform: uppercase;
	padding-left: 0.5em;
	padding-right: 0.5em;
}
h4 {
	font-size: 1.1em;
	color: #676767;
	text-transform: none;
}

/* Links im Content */
a:link {
	color: #676767;
	text-decoration: underline;
}
a:visited {
	color: #676767;
	text-decoration: underline;	
}  
a:hover, a:focus {
	color: #676767;
	text-decoration: none;	
}  
a:active {
	color: #676767;
	text-decoration: underline;	
}

#head {
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 3;
}

.nav-wrapper {
	width: 100%;
	background: rgba(255,255,255,1);
	transition: all 1s ease-in-out;	
}

.menu-trigger {
	position: relative;
	width: 100%;
	padding: 0;
}
#logo {
	float: left;
	width: 130px;
	margin-left: 0.8em;
	margin-top: -0.5em;
}
#logo img {
	width: 100%;
	padding: 0;
	height: auto;
}
#hamburger {
	position: absolute;
	top: 0;
	right: 0.8em;
	width: 15%;
	height: auto;
}
#hamburger p {
	margin: 0;
	padding: 0.25em 15% 0 0;
	text-align: right;
	font-size: 40px;
	font-weight: 400;
	cursor: pointer;
	color: #a2d53a;
	transition: color 0.5s;
}
#hamburger p:hover {
	color: #676767;
}
section {
	height: 100%;
	min-height: 100vh;
	width: 100%;
	padding: 0;
	margin: 1em 0;
	background-color: #ecf7d8;
}
.wrapper-top, .wrapper, .wrapper-map {
	position: relative;
	margin: 0 auto;
	width: 90%;
	max-width: 1100px;
	padding-top: 130px;
}
.wrapper {
	padding-top: 2em;
}
.wrapper.routeplanner {
	padding-top: 0.5em;
	padding-bottom: 1em;
}
.wrapper-map {
	padding: 0;
}
.slogan-container {
	position: absolute;
	width: 100%;
	top: 73vh;
	text-align: center;
}
#start {
	background: #FFF url(../img/yoga-dr-sedl-luebeck-s.jpg) center center no-repeat;
	background-size:  cover;
	background-attachment: fixed;
	margin: 0;
}

#yoga .bgd-picture {
	background: #ecf7d8 url(../img/hatha-yoga-mobile.jpg) center bottom no-repeat;
	background-size: cover;
}
#yoga-raum .bgd-picture {
	background: #ecf7d8 url(../img/yoga-raum-mobile.jpg) center center no-repeat;
	background-size: cover;
}
#yoga-stunde .bgd-picture {
	background: #ecf7d8 url(../img/yogastunde-mobile.jpg) center bottom no-repeat;
	background-size: cover;
}
.bgd-picture {
	height: 10em;
}

.wrapper-parallax {
	background-color: #ecf7d8;
}

#start h1 {
	font-weight: 500;
	display: block;
	color: #676767;
	font-size: 2.5vw;
	line-height: 4vw;
	border: none;
	margin: 0;
}
#start h1 span {
	background-color: rgba(255,255,255,0.7);
	padding: 0.125em 1vw;
}

#start h1.portrait {
	display: none;
}

/* Navigation */
#navi {
	z-index: 5;
	opacity: 1;
	height: 80px;
}	
.nav-list {
	clear: both;
	display: none;
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: 1px solid #a2d53a;
	position: absolute;
	width: 100%;
	top: 80px;
}
.nav-list li {
	display: block;
	padding-bottom: 0;
}
.nav-list a {
	background-color: #FFF;
	color: #676767;
	display: block;
	font-size: 1em;
	font-weight: 400;
	-webkit-font-smoothing: antialiased;
	-moz-font-smoothing: antialiased;
	font-smoothing: antialiased;
	line-height: 20px;
	overflow: visible;
	padding: 0.60em 0 0.60em 1em;
	border-bottom: 1px solid #a2d53a;
	text-decoration: none;
}
.nav-list a:hover {
	background-color: #eaeaea;
}
.nav-list a.aktiv {
	background-color: #a2d53a !important;
	color: #FFF;
}
	
/* Scroll Icon */
.arrow {
	display: block;
	text-align: center;
	padding-top: calc(95vh - 50px);
}
.arrow img {
	width: 50px;
	height: auto;
}	

/* Google Maps */
#map_canvas {
	display: block;
	padding: 0;
	margin: 0;
	height: 21em;
	height: 0;
}
div.label p {
	font-family: 'Alegreya Sans', sans-serif;
	font-weight: 400;
	font-size: 1.25em;
	padding: 0;
	margin: 0;
	text-align: left;
	line-height: 1.25;
	color: #676767 !important;
}
div.label p span {
	color: #a2d53a;
	font-size: 120%;
	font-weight: 500;
	text-transform: uppercase;
}
div.label p strong {
	text-transform: uppercase;
	font-weight: 500;
}

#kontakt {
	min-height: 92vh;
}
#foot {
	min-height: 8vh;
}
#copyright {
	background-color: #a2d53a;
	padding: 1.5em 0;
}
#copyright p {
	text-align: center;
	color: #666;
	font-weight: 400;
	font-size: 0.9em;
	padding: 0;
}

/* contact buttons | mobile view*/
p.phone, p.mail, p.handy, p.route {
	padding: 0;
	font-size: 1em;
}
p.phone a, p.mail a, p.handy a, p.route a {
	display: block;
	border-radius: 1em;
	background: #a2d53a url(../img/phone.png) 0.75em 50% no-repeat;
	background-size: 30px;
	background-color: #FFF;
	border: 1px solid #a2d53a;
	padding: 0.6rem 0.5rem;
	font-weight: 500;
	font-size: 1.1em;
	text-align: center;
	text-decoration: none;
	transition: all 0.3s cubic-bezier(.25,.8,.25,1);
	margin: 1em 0 0 0;
}
p.phone a:hover, p.mail a:hover, p.handy a:hover, p.route a:hover {
	box-shadow: 0 6px 12px rgba(0,0,0,0.25), 0 4px 4px rgba(0,0,0,0.22);
}
p.mail a {
	background-image: url(../img/mail.png);
	padding-left: 2em;
}
p.handy a {
	background-image: url(../img/handy.png);
	background-size: 35px;
}
p.route a {
	background-image: url(../img/route.png);
	margin-bottom: 1em;
	padding: 0.6rem 0.5rem 0.6rem 1rem;;
}
/* Tabelle Termine */
.table-scrollable {
	width: 100%;
	overflow-y: auto;
	margin: 0 0 1em;
}
.table-scrollable::-webkit-scrollbar {
	-webkit-appearance: none;
	width: 15px;
	height: 15px;
}

.table-scrollable::-webkit-scrollbar-thumb {
	border-radius: 8px;
	border: 3px solid #fff;
	background-color: #676767;
}
table.termine {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 1em 0;
}
.termine td {
	padding: 0.5em 0.125em;
	margin: 0.5em;
	background-color: #a2d53a;
	color: #676767;
	min-width: 3.0em;
	text-align: center;
	font-weight: 500;
}
.termine td {
	border-right: 0.2em solid #ecf7d8;
	border-bottom: 0.2em solid #ecf7d8;
}
.termine tr:last-of-type td {
	border-bottom: none;
}
.termine td:last-of-type {
	border-right: none;
}
.termine tr td:first-of-type {
	background-color: #676767;
	color: #FFF;
	font-weight: 400;
}
/* Portrait-Foto */
#portrait_foto {
	max-width: 250px;
	text-align: center;
	margin: 0.5em 0 1em 0;
	padding: 0;
	border-radius: 1em;
	box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
}
#portrait_foto img {
	width: 100%;
	height: auto;
	max-width: 250px;
	background-color: #FFF;
	border-top-right-radius: 1em;
	border-top-left-radius: 1em;
}
#portrait_foto figcaption {
	max-width: 250px;
	margin: 0 auto;
	text-align: center;
	font-size: 80%;
	line-height: normal;
	padding: 0.5em;
	margin-top: -0.6em;
	background-color: #FFF;
	border-bottom-right-radius: 1em;
	border-bottom-left-radius: 1em;	
}
/* Bildergalerie */
.img_list figure {
	padding: 1em 1em 0 0;
	padding: 0;
	margin: 0;
	float: left;
	width: 50%;
	line-height: 0;
}
.img_list figure:nth-of-type(2n) {
	padding-right: 0;
}
.img_list figure img {
	width: 100%;
	width: 94%;
	height: auto;
	margin: 0;
	padding: 0;
	margin: 6% 6% 0 0;
	border-radius: 0.5em;
	box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
	transition: all 0.3s cubic-bezier(.25,.8,.25,1);	
}
.img_list figure img:hover {
	transform: scale(1.01);
	box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);	
}
#datenschutz {
	overflow-wrap: break-word;
}
/* Cookie Hinweis */
#cookie-notice {
	box-sizing: border-box;
	position: fixed;
	bottom: 0;
	right: 0;
	left: 0;
	margin: 0 auto;
	overflow: hidden;
	color: #FFF;
	max-width: 100%;
	background-color: rgba(0162,213,58,0.95);
	border-top: 1px solid #FFF;
	padding: 0.5em;
	z-index: 9999;
	transition: all .3s linear;
	opacity: 0;
}
#cookie-notice p {
	font-size: 0.9em;
	text-align: center;
	color: #333;
	padding: 0;
	margin: 0;
	line-height: 1.5;
}
#cookie-notice a {
	color: #333;
}
.cookie-buttons {
	margin: 1em 0 0.5em 0;
	text-align: center;
	font-weight: 400;
}
#cookie-notice .cookie-buttons a {
	color: #FFF;
	font-size: 0.9em;
}
.cookie-buttons [role="button"] {
	background-color: #333;
	border-radius: 5px;
	padding: 0.4em 0.8em;
	cursor: pointer;
	margin: 0 0.5em;
	transition: all .3s linear;
}
.cookie-buttons [role="button"]:hover {
	background-color: #666;
}
/* External Links */
a[rel="noopener"]:after, span.ext_link {
	content: "\00a0\00a0\00a0\00a0\00a0";
	background-image: url(../img/external_link.png);
	background-position: center right;
	background-repeat: no-repeat;
	background-size: contain;
	display: inline-block;
}
p.route a[target="_blank"]:after {
	background-image: url(../img/external_link.png);
}
/* NEU 2024 */
._box {
	padding: 1em 1em 0 1em;
	margin-bottom: 1em;
	background-color: #a2d53a;
	border-radius: 5px;
	border: 2px solid #FFF;
}
._box p, ._box h2, ._box a, ._box li {
	color: #333 !important;
}
._box ul {
	margin-top: -1em;
}
._box ul li {
	padding-bottom: 0;
}
figure {
	margin: 1em 0;
}
._box figure img {
	width: 100%;
	max-width: 300px;
	height: auto;
/*	border-radius: 5px;
	box-shadow: 0px 3px 11px 0px rgba(0,0,0,0.3);*/
}
@media only screen and (max-height: 35em) and (orientation: landscape) {
	#navi {
		height: 10vw;
	}	
	.nav-list {
		top: 10vw;
	}	
	#logo {
		width: 15vw;
		margin-top: 0;
	}	
	#hamburger {
		width: 20%;
	}	
	#hamburger p {
		padding: 0 15% 0 0;
		font-size: 8vw;
	}	
	.menu-trigger {
		padding-bottom: 0;
	}	
	.wrapper-top {
		padding-top: 17vw;
	}	
	.slogan-container {
		text-align: center;
		top: 40vh;
	}		
	#start h1.landscape {
		display: inline-block;
		text-align: center;
		font-size: 6vh;
		line-height: 8.5vh;
	}
	#start h1.portrait {
		display: none;
	}
	
	.bgd-picture {
		height: 7em;
	}	
}

@media only screen and (min-width: 35em) {
	#portrait_foto {
		float: right;
		width: 35%;
		margin: 0.5em 0 1em 1em;
	}	
	/* Bildergalerie */
	.img_list figure {
		width: 33.333333333333333%;
	}
	.img_list figure:nth-of-type(3n) {
		padding-right: 0;
	}	
	/** NEU ***/
	._box figure.foto-rechts {
		float: right;
		width: 40%;
		margin: 0 0 1em 1em;
	}	
	._box figure img {
		width: 100%;
		max-width: none;
		height: auto;
/*		border-radius: 5px;
		box-shadow: 0px 3px 11px 0px rgba(0,0,0,0.3);*/
	}	
}

@media only screen and (min-width: 40em) and (orientation: portrait) {
	#logo {
		width: 200px;
	}
	#hamburger p {
		padding: 0.5em 15% 0 0;
		font-size: 50px;
	}
	#navi {
		height: 128px;
	}
	.nav-list {
		top: 128px;
	}	
	.wrapper-top {
		padding-top: 210px;
	}	
	.bgd-picture {
		height: 15em;
	}	
	dt {
		flex: 0 0 15%;
	}		
	dd {
		flex: 0 0 85%;
	}	
}
	
@media only screen and (max-width: 49.9999em) and (orientation: portrait) {	
	.slogan-container {
		text-align: center;
		top: 55vh;
		top: 58vh;
		top: 62vh;
	}	
	#start h1.portrait {
		display: inline-block;
		text-align: center;
		font-size: 6.5vw;
		line-height: 10vw;
	}
	#start h1.landscape {
		display: none;
	}	
}

/* Smartphone Navigation für Queransicht, halbe Breite der Navigationsfelder */
@media only screen and (max-width: 49.999em) and (orientation: landscape) {
	.nav-list li {
		float: left;
		width: 50%;
	}
	.nav-list li:nth-child(2n+1) {
		border-right: 1px solid #a2d53a;
	}
	#start {
		background: #FFF url(../img/yoga-dr-sedl-luebeck-sl.jpg) center center no-repeat;
		background-size:  cover;
		background-attachment: fixed;
		margin: 0;
	}	
	.slogan-container {
		text-align: center;
		top: 55vh;
	}	
}
	
@media only screen and (min-width: 50em) {
	body {
		color: #676767;
	}
	html {
		font-size: 100%;		
	}
	.only-mobile {
		display: none !important;
	}
	.bgd-picture {
		display: none;
	}
	span.not-mobile, .not-mobile {
		display: inline-block;
	}	
	/* nur für iOS !! */
	.bgd-picture {
		height: 20em;
	}	
/* Links im Content */
	a:link, a:visited, a:hover, a:focus, a:active {
		color: #676767;
	}
	
	#start {
		background: #FFF url(../img/yoga-dr-sedl-luebeck.jpg) center right no-repeat;
		background-attachment: fixed;
		background-size: cover;
		margin: 0em;
	}	
	#yoga {
		background: #ecf7d8 url(../img/hatha-yoga.jpg) center center no-repeat;
		background-size: cover;
		background-attachment: fixed;
	}
	#yoga-raum {
		background: #ecf7d8 url(../img/yoga-raum.jpg) center center no-repeat;
		background-size: cover;
		background-attachment: fixed;
	}	
	#yoga-stunde {
		background: #ecf7d8 url(../img/yogastunde.jpg) center bottom no-repeat;
		background-size: cover;
		background-attachment: fixed;
	}	
	/* Sektion Kontakt */
	#kontakt {
		margin-bottom: 0;
	}
	.wrapper-parallax {
		background-color: #ecf7d8;
	}
	.wrapper-map {
		width: 100%;
		max-width: none;
	}
	.img_height {
		margin-bottom: 45vh;
	}
	
	.nav-wrapper {
		background: rgba(255,255,255,0);
	}	
	#navi {
		z-index: 5;
		top: 0;
		opacity: 1;
		width: 90%;
	}
	
	h1 {
		font-size: 2em;
	}
	h2, h3 {
		font-size: 1.25em;
	}	
	.nav-wrapper.sticky {
		background-color: rgba(255,255,255,1);
	}	
	#navi {
		position: relative;
		margin: 0 auto;
		height: 18vw;
		max-height: 350px;
		transition: all 0.5s ease-in-out;
	}	
	#navi.sticky {
		height: 10vw;
		max-height: 203px;
	}
	#logo {
		height: 26.6vw;
		max-width: 517px;		
		width: 26.6vw;
		max-height: 517px;
		transition: all 0.5s ease-in-out;
		margin-left: 0;
		margin-top: 0;
	}
	#logo.sticky {
		height: 14.8vw;
		max-height: 300px;
		width: 14.8vw;
		max-width: 300px;
	}
	#logo img {
		padding: 0;
		margin: 0;
		height: 100%;
		width: 100%;
	}
	
	.wrapper-top, .wrapper {
		padding-top: 13vw;
		width: 60%;
	}	
	.wrapper {
		padding-top: 2em;
	}

	.menu-trigger {
		height: 0;
		padding-bottom: 0;
	}
	.nav-list {
		clear: none;
		display: block;
		float: none;
		margin: 0;
		text-align: center;
		width: 100%;
		padding: 0;
		padding-top: 3.5vw;
		border: none;
		text-align: right;
		position: relative;
		top: 0;
	}
	.nav-list li {
	  display: inline-block;
	}
	
	.nav-list a {
	  background-color: #FFF;
	  color: #676767;
	  position: relative;
	  display: inline-block;
	  margin: 0;
	  font-size: 0.9em;
	  font-weight: 400;
	  padding: 0.6em 0.6em;
	  border-bottom: none;
	  text-decoration: none;
	  transition: all 0.3s ease-in-out;	  
	}
	.nav-list a:hover {
		background-color: #676767;
		color: #FFF;
	}	
	.nav-list a:first-child {
	  margin-left: 0;
	}
	.nav-list a:last-child {
	  margin-right: 0;
	}
	#hamburger {
		display: none;
	}
	
	/* Spalten Kontaktdaten */
	.col1, .col2, .col3 {
		float: left;
		width: 30%;
	}
	.col1 {
		width: 30%;
		padding-right: 0.5em;
	}
	.col2 {
		width: 40%;
		padding-right: 0.5em;
	}
	
	/* Links im Footer */
	#copyright a:link {
		color: #676767;
		text-decoration: none;
	}
	#copyright a:visited {
		color: #676767;
		text-decoration: none;	
	}  
	#copyright a:hover, #copyright a:focus {
		color: #676767;
		text-decoration: underline;	
	}  
	#copyright a:active {
		color: #676767;
		text-decoration: none;	
	}	
	
	#contact-data {
		top: 50vh;
	}
	
	#map_canvas {
		/*height: 20em;*/
	}
	
	#portrait_foto {
		width: 30%;
		max-width: none;
	}
	#portrait_foto img {
		max-width: none;
	}
	#portrait_foto figcaption {
		max-width: none;
	}
	dt {
		flex: 0 0 15%;
	}		
	dd {
		flex: 0 0 85%;
	}	
	p.route a {
		max-width: 18em;
		padding: 0.6rem 0.5rem 0.6rem 2rem;
	}
}	
@media only screen and (min-width: 80em) {
	html {
		font-size: 110%;		
	}		
	.wrapper-top, .wrapper {
		width: 60%;
	}	
	#navi {
		width: 90%;
	}	
}
@media only screen and (min-width: 90em) {
	html {
		font-size: 120%;		
	}	
}

@media only screen and (min-width: 100em) {
	html {
		font-size: 130%;		
	}	
	/* Cookie */
	#cookie-notice {
		right: auto;
		left: 0.5em;
		margin: 0;
		max-width: 14.5em;
		bottom: 0.5em;
		border-radius: 5px;
		border: 2px solid #FFF;
	}	 
	#cookie-notice p {
		text-align: left;
		font-size: 0.70em;
	}	
	#cookie-notice .cookie-buttons a {
		font-size: 0.75em;
	}	
}
@media only screen and (min-width: 110em) {
	html {
		font-size: 135%;		
	}
}
@media only screen and (min-width: 120em) {
	html {
		font-size: 150%;		
	}	
	.wrapper-top {
		padding-top: 9.5em;
	}	
	dt {
		flex: 0 0 10%;
	}		
	dd {
		flex: 0 0 90%;
	}	
}
@media only print {
	body, section, .bgd-picture, .wrapper-parallax {
		background-color: #FFF !important;
	}	
	#hamburger, #navigation, .arrow, .only-mobile {
		display: none;
	}
	#start {
		height: auto;
		min-height: 0;
	}
	.not-mobile, .bgd-picture {
		display: block;
	}
	.bgd-picture {
		height: 20em;
		margin-bottom: 1em
	}
	#head {
		position: relative;
	}
	#logo {
		float: none;
		width: 100%;
		margin: 0 auto;
		text-align: center;
	}
	#logo img {
		width: 80%;
		height: auto;
	}
	#start h1 {
		font-size: 20pt;
		line-height: 25pt;
	}
	h3 {
		color: #a2d53a;
		background-color: transparent;
		display: block;
		padding: 0 0 0.5em 0;
		margin: 0;
	}	
	section {
		page-break-after: always;
	}
	.wrapper-top, .wrapper {
		padding-top: 0;
	}	
	#portrait_foto {
		float: right;
		width: 35%;
		max-width: none;
		margin: 0 0 1em 1em;
	}	
	#impressum #head, #datenschutz #head {
		display: none;
	}
}