@charset "utf-8";
/* CSS Document */

/*   ====================================================================
CSS Document for screendesign by Annuschka Lochner
Last Update: 03.03.2017
Author: Annuschka Lochner
Media: Screen
 ======================================================================== */

/* Textbereich */
#content div{
	background-color: #fdeff3;
	box-sizing: border-box;
	display: block;
	width: 95%;
	padding:1.3rem;
	margin:1.2rem auto;
	border-radius:0 1.3rem 0 1.3rem;
	box-shadow: 0px 1px 2px #d35d92;
}
/* 2 Spalten */
#col1{
	position: relative;
	-webkit-column-fill:balance;
	column-fill:balance;
	-moz-column-count:2;
	-webkit-column-count:2;
	column-count:2;
	-moz-column-width:20rem;
	-webkit-column-width:20rem;
	column-width:20rem;
	-moz-column-gap:2rem;
	-webkit-column-gap:2rem;
	column-gap:2rem;
	-moz-column-rule: 1px solid #CC005C;
	-webkit-column-rule: 1px solid #CC005C;
	column-rule: 1px solid #CC005C;
}

/* Titel  */
#col1 h2{
	-moz-column-span:all;
	-webkit-column-span:all;
	column-span:all;
}
#col1 h2{
	text-align: left;
}

/* Liste */
#content ul{
	text-indent: none;
	list-style: none;
	margin:1rem 0;
}

#col1 ul:first-child{
	margin-top: 0;
}

/************ Smartphone- und Tablet-Ansicht  max-width:768px  ************************/
/*** Es wir nur eine column angezeigt mit der Breite 95% ***/

@media screen and (max-width:768px){

	#content div {	
		width:95%;	
	}
	/* Listenelement nimmt die ganze Breite ein */
	#col1 li{
		display:block;
		color:#333;
		font-size: 1.2rem;
		width: 100%;
	}
}