*{
	box-sizing:border-box;
	font-family:verdana,sans-serif;
}
body{
	-webkit-user-select: none;
	-webkit-tap-highlight-color: transparent;
}
html,body{
	width:100vw;
	height:100vh;
	margin:0;
	padding:0;
	background: #000;
}
p{
	margin:0;
}


#home{
	height: 100vh;
	display: flex;
	flex-wrap: wrap;
	align-content: center;
}
#home div{
	display: block;
	width:100%;
	text-align: center;
	font-size:10vw;
	margin:1em;
	padding: 0.5em;
	color:#fff;
	background:#b94b78;
	border:1px solid #fff;
	border-radius: 0.5em;
}
#content{
	position:fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	padding: 1em;
	overflow-y:auto;
	background:#f8f5f2;
	background:#e9e6e3;
	-ms-touch-action: pan-y;
	touch-action: pan-y;
}


@media(orientation:landscape){
	#home div{
		font-size:5vw;
	}
}
@media(orientation:portrait){
	
}
#home div span{
	font-size:60%;
}



#content.whatsapp{
	background: url("media/hg.jpg") no-repeat center / cover;
	padding: 8vw 1em 15vh;
}

#wa_header{
	position:fixed;
	z-index:10;
	top:0;
	left:0;
	right:0;
	padding:0.5vw 1em;
	background-image:linear-gradient(90deg,#fff,#eaffe2);
	font-size:3.5vw;
	box-shadow:0 1px 2px rgba(0,0,0,0.3);
}
#profil_lory{
	float:left;
	width:30vw;
}
#profil_marie{
	float:right;
	width:40vw;
}
.profilbild{
	display:block;
	float:left;
	height:8vw;
	width:8vw;
	border-radius:4vw;
	overflow:hidden;
	background:#ddd;
	vertical-align:middle;
	margin-right:0.5em;
	border:1px solid #aaa;
	text-align:center;
}
#wa_header img{
	height:100%;
}
#wa_header p{
	margin:0;
	padding:0;
	float: left;
}
#wa_header span{
}
#wa_header .profilaktion{
	font-size:2vw;
	float:left;
	color:#777;
}

.beitrag{
	position: relative;
	left:-100%;
	border-radius:0.5em;
	max-width:80%;
	font-size: 4vw;
	float: left;
	clear: both;
	margin:1em 0.3em;
	transition: 0.5s;
	color:#000;
	box-shadow:1px 1px 3px rgba(0,0,0,0.5);
}
.beitrag div{
	padding:0.5em;
	border-radius:0.5em;
	background:#fff;
	position:relative;
}
.beitrag_1{
	float: right;
	left:100%;
}
.beitrag_1 div{
	background: #eaffe2;
}
.beitrag:before{
	content:'';
	width:30px;
	aspect-ratio:4/5;
	background-size:contain;
	display: block;
	position: absolute;
	bottom: 0;
}
.beitrag_0:before{
	left:-19px;
	background-image: url('data:image/svg+xml;utf8,<?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="40" height="50" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 40 50"><defs><filter id="b"><feGaussianBlur stdDeviation="1"/></filter></defs><g style="filter:url(%23b); opacity:.5;"><path d="m26.17,9c0,30.4-6.96,30.38-19.53,40.81,15.77,0,27.69-7.56,33.35-13.19V9s-13.83,0-13.83,0Z"/></g><path d="m26.17,8c0,30.4-7.32,30.88-19.53,40.81,15.77,0,27.69-7.56,33.35-13.19V8s-13.83,0-13.83,0Z" style="fill:%23fff;"/></svg>');
}
.beitrag_1:before{
	right: -20px;
	background-image: url('data:image/svg+xml;utf8,<?xml version="1.0" encoding="UTF-8"?><svg id="a" xmlns="http://www.w3.org/2000/svg" width="40" height="50" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 40 50"><defs><filter id="b"><feGaussianBlur stdDeviation="1"/></filter></defs><g style="filter:url(%23b); opacity:.5;"><path d="m13.83,9c0,30.4,6.96,30.38,19.53,40.81-15.77,0-27.69-7.56-33.35-13.19V9h13.83Z"/></g><path d="m13.83,8c0,30.4,7.32,30.88,19.53,40.81-15.77,0-27.69-7.56-33.35-13.19V8h13.83Z" style="fill:%23eaffe2;"/></svg>');
}
.beitrag_zeigen{
	left:0;
}
.beitrag img{
	max-width:100%;
	max-height:50vw;
}


.wa_steuerung{
	clear:both;
	padding:2em;
	font-size:6vw;
	text-align:center;
	transition: 1s;
}
#wa_ende{
	opacity:0;
}
#wa_ende.ende_zeigen{
	opacity:1;
}
.wa_button{
	display:inline-block;
	margin-top:1.5em;
	padding:0.5em 2em;
	background:rgba(0,0,0,0.6);
	color:#fff;
	font-size:4vw;
	border-radius:2em;
	transition: 1s;
}

#wa_neustart{
	opacity:0;
}
#wa_neustart.neustart_zeigen{
	opacity:1;
}
