@charset "utf-8";
/* CSS Document */
div.sp1 {
	float:left;
	padding:24px 0px 0px 0px;
	width:469px;
}
div.sp1a, div.sp1b, div.sp2a, div.sp2b {
	box-sizing: border-box;
}

div.sp1a, div.sp1b {
	width:100%;
}

div.sp2a, div.sp2b {
	width:304px;
	float:left;
}

div.sp2a {
	padding:24px 0px 0px 0px;
	margin:0px 0px 0px 20px;
	background:url(../grafik/punktelinie_960px.png) bottom left repeat-x;
}

div.sp2b {
	padding:19px 0px 0px 0px;
	margin:0px 0px 0px 20px;
}

div.sp1 ul {
	padding: 1px 0px 20px 14px;	
}

div.sp1 li {
	padding:0px 0px 3px 0px;
	list-style-image:url(../grafik/icon_pfeili_rot.svg);
	line-height:1.15em;
}

div.sp1a ul {
		padding-bottom:0px;
	}

/*ende allgemeine styles ***/

/* scroll stuff */
div.scrollableAuto {
	float:left;
	height:383px;
	width:100%;
	border:none;
	margin:0px;
	padding:0px 0px 10px 0px;
}

div.oc_scrollable {
	float:left;
	height:344px;
	width:100%;
	border:none;
	margin:0px;
	padding:0px 0px 10px 0px;
}
/*end scroll stuff */

/*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_index {
	background:url(../grafik/punktelinie_960px.png) bottom left repeat-x;
	padding:0px 0px 11px 0px;
	margin:0px 0px 19px 0px;
}
div.oc_sp1, div.oc_sp2 {
	box-sizing:border-box;
	width:50%;
	float:left;
}

div.oc_index ul li {
	padding:0px 0px 4px 0px;
	margin:0px 0px 4px 0px;
}
div.oc_angehoeriger {
	background:url(../grafik/punktelinie_960px.png) bottom left repeat-x;
	margin:0px 0px 19px 0px;
	padding:0px 0px 19px 0px;
}
div.oc_angehoeriger:last-of-type {
	background:none;
	margin:0px;
	padding:0px;
}
div.oc_angehoeriger h3 {
	padding:0px 0px 14px 0px;
}
div.oc_angehoeriger p {
	margin:0px;
}
div.oc_angehoeriger .bild {
	float:left;
	width:316px;
	height:316px;
	padding:0px 19px 14px 0px;
}
div.oc_angehoeriger .bild img {
	width:316px;
	height:316px;
}
div.oc_angehoeriger .text {
	
}
span.resp01, span.resp03 {
		display:none;
}


/*end overlay content*/


/* responsiveness */
/* 5 spalten */
@media screen and (max-width:1023px) { 
	div.oc_scrollable {
		height:269px;
	}
	div.oc_angehoeriger .bild {
		width:204px;
		height:204px;
	}
	div.oc_angehoeriger .bild img {
		width:204px;
		height:204px;
	}
}
/* 4 spalten */
@media screen and (max-width:859px) { 
	div.sp1 {
		padding:24px 0px 0px 0px;
		width:100%;
		float:none;
		
	}
	div.sp1a, div.sp1b {
		float:left;
		width:306px;
		padding: 0px 20px 0px 0px;
	}
	
	div.sp1a {
		
	}
	div.sp1b {
		padding: 35px 0px 0px 20px;
	}	
	div.sp2a {
		width:306px;
		padding:24px 20px 0px 0px;
		margin:0px;
		background:none;
	}
	div.sp2b {
		padding:33px 0px 0px 0px;
	}
	div.scrollableAuto {
		height:auto;
		background:url(../grafik/punktelinie_960px.png) bottom left repeat-x;
	}
	div.oc_sp1, div.oc_sp2 {
		float: none;
		width:100%;
	}
	div.oc_scrollable{
		height:380px;
	}
	div.oc_angehoeriger .bild {
		width:163px;
		height:163px;
	}
	div.oc_angehoeriger .bild img {
		width:163px;
		height:163px;
	}
}


/* 3 spalten */
@media screen and (max-width:696px) { 
	div.sp1 {
		background: none;
	}
	div.sp1a, div.sp1b, div.sp2a, div.sp2b {
		width:100%;
		padding:19px 0px 0px 0px;
	}
	div.sp1a, div.sp1b {
		padding:0px;
	}
	div.sp2a, div.sp2b {
		background: none;
	}
	div.sp2b {
		padding:0;
		margin:0;
	}
	div.oc_scrollable{
		height:480px;
	}
	div.oc_angehoeriger .bild {
		width:112px;
		height:112px;
	}
	div.oc_angehoeriger .bild img {
		width:112px;
		height:112px;
	}
	span.resp02 {
		display:none;
	}
	span.resp03 {
		display:inline;
	}
	
}

/* 1 spalte */
@media screen and (max-width:533px) { 
	div.oc_scrollable{
		height:480px;
	}
	div.oc_angehoeriger .bild {
		width:163px;
		height:163px;
	}
	div.oc_angehoeriger .bild img {
		width:163px;
		height:163px;
	}
	span.resp01 {
		display:inline;
	}
	
}