@media only screen and (min-width: 769px) {
@font-face {
font-family:myFont;
src:url(u-WUoqrET9fUeobQW7jkRT8E0i7KZn-EPnyo3HZu7kw.woff);
}
body {
	font-family:myFont;
	margin:0 auto;
}
#flex-main {
	background-image:url("background.jpg");
	background-size:cover;
	background-position:center;
	background-repeat:no-repeat;
	background-attachment:fixed;
	display:flex;
	flex-direction:row;
}
#mobile-menu-btn {
  display: none;
}
#flex-main div{
	min-width:300px;
	overflow-x:hidden;
}
#flex-list {
	display:flex;
	flex-direction:column;
	background-color:white;
	height:100vh;
	box-shadow: 0px 0px 5px 1px #000000;
	overflow-y:auto;
}
#flex-list div {
	background-color:white;
	width:300px;
	margin-top:2px;
	margin-bottom:2px;
	text-align:center;
	line-height:50px;
	font-size:20px;
}
#content {
	display:flex;
	flex-direction:column;
	width:1000px;
	overflow-y:auto;
	max-height:100vh;
}
#comp {
	background-color:white;
	margin-top:10vh;
	margin-bottom:10vh;
	margin-left:10px;
	margin-right:10px;
	padding:5%;
	box-shadow:0px 0px 10px 1px #000000;
}
.info {
	float:left;
}
#headline {
	display:flex;
	flex-direction:column;
	background:white;
}
#headline a {
	padding-top:5vh;
	padding-bottom:5vh;
	color:#000000;
	text-decoration:none;
	line-height:normal;
	color:black;
	font-size:28px;
}
#fn {
	color:#00a6a6;
}
#pr {
	font-size:16px;
}
#adresse div{
	font-size:14px;
	line-height:normal;
}
#adresse div a{
	font-size:20px;
}
#impdat a{
	font-family:Tahoma;
	font-size:14px;
	text-decoration:none;
	color:#A0A0A0;
}
#picture {
	min-width:100px;
	width:40%;
	max-width:300px;
	float:left;
	padding-right:5%;
}
.separator {
	flex-grow:1;
}
.menu {
	color:black;
	text-decoration:none;
}
.menu div:hover {
	cursor:pointer;
	color:#00a6a6;
	box-shadow: 0px 0px 5px 0px #999999;
}
#impdat a.menu2:hover {
	cursor:pointer;
	color:#7C7C7C;
}
#back-btn {
	display:none;
}

}
@media only screen and (max-width: 768px) {
@font-face {
	font-family:myFont;
	src:url(u-WUoqrET9fUeobQW7jkRT8E0i7KZn-EPnyo3HZu7kw.woff);
	}
body {
	font-family:myFont;
	margin:0;
	}
#flex-main {
		background-image:url("backgroundm.jpg");
		background-size:cover;
		background-position:center;
		background-repeat:no-repeat;
		background-attachment:fixed;
		min-height:100vh;
		display:flex;
		flex-direction:column;
		gap:2px;
	}

#flex-list {
		display:contents;
	}

	/* Reihenfolge */
	#headline        { order:1; }
	#mobile-menu-btn { order:2; }
	a.menu-item      { order:2; }
	#content         { order:3; }
	.separator       { order:4; }
	#adresse         { order:5; }
	#impdat          { order:6; }

	/* Textbereich */
	#content {
		box-sizing:border-box;
		width:100%;
		background:white;
		padding:16px;
		text-align:center;
		font-size:16px;
		line-height:1.5;
		overflow-wrap:break-word;
	}
	#comp {
		max-width:600px;
		margin:0 auto;
	}
	#content h1 {
		color:#00a6a6;
		font-size:24px;
		line-height:1.3;
	}
	#content h2,
	#content h3 {
		color:#00a6a6;
		line-height:1.3;
	}
	#picture {
		display:block;
		float:none;
		width:60%;
		min-width:100px;
		max-width:300px;
		padding:0;
		margin:0 auto 16px auto;
	}
	.info {
		float:none;
	}

	/* Normale Menüpunkte ausblenden */
	.menu {
		display:none;
	}

	/* Die vier weißen, flachen Balken */
	#headline,
	#mobile-menu-btn,
	#adresse,
	#impdat {
		display:block;
		box-sizing:border-box;
		width:100%;
		background:white;
		text-align:center;
	}

	/* Überschrift oben */
	#headline a {
		display:block;
		padding:12px 0;
		color:black;
		text-decoration:none;
		line-height:1.2;
		font-size:24px;
	}
	#fn {
		color:#00a6a6;
	}
	#pr {
		font-size:15px;
	}

	/* Menü-Button */
	#mobile-menu-btn {
		padding:12px 0;
		color:#00a6a6;
		text-decoration:none;
		font-size:18px;
	}

	/* Leerer Platzhalter: schiebt Adresse und Impressum nach unten */
	.separator {
		flex-grow:1;
	}

	/* Adresse */
	#adresse {
		padding:8px 0;
		font-size:14px;
		line-height:1.4;
	}
	#adresse a {
		display:none;
	}

	/* Impressum / Datenschutz */
	#impdat {
		padding:8px 0;
	}
	#impdat a {
		font-family:Tahoma, sans-serif;
		font-size:14px;
		color:#7C7C7C;
		text-decoration:none;
	}

	/* Falls auf anderen Seiten genutzt */
	#picture {
		min-width:100px;
		width:40%;
		max-width:300px;
		float:left;
		padding-right:5%;
	}
	.info {
		float:left;
	}
	a.menu-item {
		display:block;
		box-sizing:border-box;
		width:100%;
		background:white;
		padding:14px 0;
		text-align:center;
		color:#00a6a6;
		text-decoration:none;
		font-size:18px;
	}
	#menu-close {
		color:black;
		font-size:16px;
	}
	#back-btn {
		color:black;
		text-decoration:none;
		font-size:16px;
	}
}