@charset "utf-8";
/* CSS Document */
div.sp1, div.sp2a, div.sp2b {
	width:467px;
	float:left;
	box-sizing: border-box;
}

div.sp1 {
	background:url(../grafik/punktelinie_960px_vert.png) top right repeat-y;
	width: 491px;
	padding:24px 20px 0px 0px;
}

div.sp1 img {
	float:left;
	padding:0px 20px 28px 0px;
}

div.sp1 p:last-of-type {
	width:143px;
	float:left;
}
div.sp2a, div.sp2b {
	padding:24px 0px 0px 20px;
}

div.sp2a {
	background:url(../grafik/punktelinie_960px.png) bottom left repeat-x;
}

ul {
	padding: 1px 0px 20px 14px;	
}

li{
	padding:0px 0px 3px 0px;
	list-style-image:url(../grafik/icon_pfeili_rot.svg);
}
li.black {
	padding:0px 0px 3px 0px;
	list-style-image:url(../grafik/icon_pfeili_schwarz.svg);
}

li a:hover {
	color:#bf2b23;
	text-decoration: none;
}

li a, li.black a:hover {
	color:#000;
	font-weight: bold;
}



/*overlay content */
div.oc_header {
	width:100%;
	margin:0px 0px 35px 0px;
}

div.oc_header div.text {
	float:left;
	width:90%;
}

div.oc_header div.close {
	float:right;
	width:10%;
	text-align:right;
}

div.oc_header div.close img {
	width:23px;
	height:23px;
}

div.oc_header h1, div.oc_header h2 {
	margin:0;
	padding:0:
}

div.oc_sp1 {
	width:390px;
	margin:0px 0px 0px 0px;
	float:left;
}


div.oc_sp2 {
	width:370px;
	float:left;
}

div.oc_sp2 h3 {
	margin:0px 0px 19px 0px;
}

/*end overlay content*/

/* responsiveness */
/* 5 spalten */
@media screen and (max-width:1023px) { 
	div.sp1 {
		width: 328px;
	}
	div.oc_sp1 {
		width:330px;
	}
	div.oc_sp1 img {
		width:310px;
	}

	div.oc_sp2, div.oc_sp2 img {
		width:310px;
	}
}
/* 4 spalten */
@media screen and (max-width:859px) { 
	div.sp2a, div.sp2b {
		width: 304px;
	}
	div.oc_sp1 {
		width:420px;
		margin: 0px 0px 20px 0px;
	}
	div.oc_sp1 img {
		width:420px;
	}

	div.oc_sp2, div.oc_sp2 img {
		width:420px;
	}
}

/* 3 spalten */
@media screen and (max-width:696px) { 
	div.sp1 {
		width:100%;
		background:url(../grafik/punktelinie_960px.png) bottom left repeat-x;
	}
	div.sp2a, div.sp2b {
		width:100%;
		background:url(../grafik/punktelinie_960px.png) bottom left repeat-x;
		padding:19px 0px 0px 0px;
	}
	div.sp2b {
		background:none;
	}
	div.oc_sp1, div.oc_sp1 img, div.oc_sp2, div.oc_sp2 img {
		width:316px;
	}
}

/* 1 spalte */
@media screen and (max-width:533px) { 
	div.sp1 img {
			float:none;
		padding:0px 20px 14px 0px;
	}
	div.sp1 p:last-of-type {
		width:auto;
	}
	div.oc_sp1, div.oc_sp1 img, div.oc_sp2, div.oc_sp2 img {
		width:204px;
	}
}