aside/*Farben




*/

/***	RESET	***/html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,cite,code,del,dfn,em,img,ins,q,small,strong,sub,sup,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td, #wrapper, #content{border:0;margin:0;padding:0}
article,aside,figure,figure img,figcaption,hgroup,footer,header,nav,section,video,object{margin:0;padding:0;display:block}

html, body {
  height:100%;
  margin: 0; 
  padding: 0; 
  background-color:#dfdfdf;

}
html { font-size: 100%; } 

body {  
  font-size: 1em;
  text-align:center;
  /**/font-family: 'Source Sans Pro', sans-serif;
  font-weight:400;
background:#DFDFDF;
}

#wrapper {
	min-height: 101%; 
    height: auto; 
    /* height: 100%;*//*nur für IE einstellen*/
	margin: 0 auto;
	position:relative;
	text-align:left;
	padding-bottom:30px;
	
}

#kopf{position:relative; height:200px; 
/*border-top-left-radius:25px;
border-top-right-radius:25px;*/
border-left:25px solid #FFC497;
border-right: 3px solid #666;
background-color:#E15F00;}

#content {
	font-size:1.1em;
	line-height:1.5em;
	/**/padding:40px 25px;
	background:#ccc;
	color:#333;
	border-left:25px solid #ccc;
	border-right: 3px solid #aaa;
	}

#logo {width:230px; height:107px;
position:absolute; top:60px; left:20px;}

.slogan {padding-left:4px;opacity:0.8}

#content a {color:#333;text-decoration:none;border-bottom:2px dotted #900; }

#branding {background-color:#E15F00;}
#eyecatcher {width:230px;height:200px;
position:absolute; top:0px; right:0;overflow:hidden;
opacity:0.5;
}

h1   { font-size: 1.5em;
	padding: 20px 0px;
	font-weight:400;
	color:#990000;
	} 
h2   { font-size: 1.3em;
	margin:1em 0 ;
	font-weight:400;
	color:#900;
	} 
ul, ol {margin-left:1em;margin-bottom:1.4em;}
p {margin-bottom:1.4em;}
	

/* spezifisches
--------------------------------------------- 
	
.bildRightKontur{float:right; margin-left:15px; padding:4px;border:1px solid #999;}
.floatL, .floatL-kl {float:left;}*/

.kleiner {font-size:smaller;line-height:1.4em;}

.floatR {float:right;}
.clearLe {clear:left;}
.clearing {clear:both; height:1px;padding-top:10px;}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.clearfix{display:block;}
.keinU {white-space:nowrap;}


/* ########### foto bxen ############ */

.fotoText {
margin-right:10px;
margin-bottom:0.5em;
border:1px solid #9C9EA5;
width:96%;
min-height:100px;
/*width:47%;
float:left;
min-width:235px;
min-height:auto;*/
padding:0;
 }
 .fotoText img {
 width:85px;
 height:99px;
 float:left;
 padding-left:5px;
 padding-right:1em;
 
 } 
 .fotoText p {
font-size:0.9em;
padding:-1em;
line-height:1.4em;
 }

footer {margin:30px 0 0 0; padding:30px 10px 40px 10px; border-top:1px dotted #333;background:#ccc;}

/**/
@media only screen and (min-width: 450px){
#branding {background-color:#E15F00;}
#eyecatcher {opacity:1;
}
}


@media only screen and (min-width: 800px){
	#kopf{position:relative; height:230px; }
	#eyecatcher {height:207px;width:38%;
position:absolute; top:10px; left:61%;
}
#logo {top:110px;}

#content {padding:0;}
	#main {
	width:54%;
	float:left;	
	padding-bottom:50px;
	padding-top:42px;
	padding-left:25px;
	padding-right:25px;
	background:#fff;
}

#aside {
	width:32%;
	padding:40px 25px 20px;
	float:right;
}
}

@media only screen and (min-width: 960px){
	#wrapper {	
		width:90%;
max-width:1100px;
	}

	#main {
	width:59%;
	float:left;	
}

#aside {
	width:28%;
}

#eyecatcher {left:65%;width:34%}

}
@media only screen and (min-width: 1024px){

	#main {width:59%;}
#aside {width:29%;}
}


@media only screen and (min-width: 1100px){
#eyecatcher {width:34%;}
		#main {width:60%;}
#aside {width:29%;}
}
