
body {
	background:#ffffff;
	font-family: Arial, sans-serif;
	font-size:14px;
	font-weight: normal;
	margin: 0px;
}

div#wrapper {
	position: relative;
	float:left;		/* rechts kann noch was sein	*/
	left: 140px;		/* selbst rechts von Menue	*/		
	margin-left: 0px;	
	width:85%;
	max-width: 1000px;
	background-color:#ffffff;		
	border: 0px solid #00f000; 
	overflow:hidden;	
}

/***************** header **************************************/

header {
	background:#ffffff;
	width:100%;
	text-align:right;
	height: 110px;
	border:1px solid #000000;
 	padding: 10px; 
	margin-right: 20px; 
	background-image: url(header.jpg);
	background-repeat:no-repeat;
    	background-position:-100px 0px;
	background-size: auto 100%;
}

h1 {
	FONT-WEIGHT: bold;
        text-shadow: 3px 2px 3px #000000;
	FONT-SIZE: 22px;
	padding-right: 80px;
}

header span {
	padding-right: 80px;
	font-size: 13px;
	font-weight: bold;
}

header a {
	TEXT-DECORATION: none;
	color: #ee2222; 
}
header a:hover {
	color: #ff4444; 
}

/***************** footer + AMZ**********************************/

footer { 
	position: relative;
	width: 96%;
	background-color:#ffffff;	
  	border: 0px solid black;
 	padding: 10px; 
	overflow:hidden;
	font-size:13px;
} 

p.tipps {
	font-weight: bolder;
	color: #000000; 
}

div#buchtipp {
	margin-left:0px;
	padding:10px;
	width: 30%;
	background-color:#ffffff;
	border: 0px solid #000000;
	position:relative;
	overflow:hidden;
	min-width: 260px;
	float:left;
}

div#buchtipp a {					
	color: #990000; 
	text-decoration: underline;
	font-weight: bold; 
}


div#buchtipp img {	
	border:1px solid #990000;
	height: 120px;		
	width: auto; 		
}

p.beschr {
   margin:0px;
   padding:0px;
   color:#000000;
}

p.autor {
	margin:0px;
	padding:0px;
	font-weight: bold; 

}

a.tipp {
	color: #000000; 
	text-decoration: underline;
	font-weight: bold; 
}


div#content a {					
	color: #bb0000; 
	text-decoration: underline;
}

footer h4 {
	padding-left:80px;
	font-size: 11pt;
	color: #000000; 
}

div#rechts {
	position: fixed;
	/* float:left; */
	/* left: 142px;		 +Verschiebung von Wrapper	*/
	right: 0;		
	width: 300px;
	background-color:#ffffff;
	border: 0px solid #000000;
}


/***************** content *****************************************/

div#content {
	position:relative; 			/* unter Header */
	float: none;
	padding-left: 40px;		
	padding-top: 0px; 
	width:96%;
	background-color:#ffffff;		
	border:0px solid #0000f0; 
	overflow:hidden;
	text-align:left;
}

div#content h3 {
	color: #000000; 
	font-size: 18px;
}

div#content h4 {
	color: #000000; 
	font-size: 14px;
}

.txtsm {				/* class="txtsm" */	
	font-size: 11px;
}

.img_des {				/* class="img_des" */	
	FONT-SIZE: 11px;
}

.img_des_ro {				/* "img_des" rechts über Bild */	
	FONT-SIZE: 11px;
	float: right;
}


.img_vcves_ro {				
	padding: 10px; 
	margin-right: 20px; 
	padding-right: 80px;
}


div#content a {					
	color: #bb0000; 
	text-decoration: underline;
}

div#content p {
	FONT-SIZE: 14px;
	text-align: justify;
	padding-right: 20px;		
}


/*  Bilder in Artikeln */

img.art_ct {
	float: none;
	max-width: 100%;
	height: auto; 	
	margin-top: 10px;	
	border:1px solid #000000;
	vertical-align:top;
}

img.art_lt {
	float: left;	
	max-width: 50%;
	height: auto; 	
	margin-top: 0px;	
	margin-right: 10px;
	border:1px solid #000000;
}

img.art_rt {
	float: right;	
	max-width: 50%;
	height: auto; 	
	margin-top: 0px;	
	margin-left: 10px;	
	border:1px solid #000000;
}



span#dist {
	font-size:1px;
	line-height:1px;
}

h4.period {
	line-height:22px;
	padding-left:12px;
	width:90%;
	color: #f00000; 
	background-color: #ff2222;
}

div#spalte {
	margin-left:0px;
	padding:0px;
	width: 47%;
	color:#000040;
	background-color:#ffffff;
	border: 0px solid #f00000;
	position:relative;
	overflow:hidden;
	min-width: 300px;
	float:left;
}

section {
	margin:0px;	
	margin-top: 20px;
	padding: 0px;		
	width:90%;
	background-color:#ffffff;	
	position:relative;
	border: 0px solid #000000;
	text-align:left;
	border-bottom-width: 1pt;
}


section img {	
	float: left;	
	margin-right: 10px;
	margin-top: 0px;	
 	margin-bottom: 20px;	
	border:1px solid #000000;
}

img#bios_th {	
	float: left;	
	margin-right: 10px;
	margin-top: 0px;	
 	margin-bottom: 120px;	
	border:1px solid #000000;
}

section a {					
	color: #000000; 
	FONT-WEIGHT: bold;
	text-decoration: underline;
}

section a:hover {
	COLOR: #ff4444;
}

span#epoch {				/* index bios section		*/
	font-size:12px;
	font-weight: bold;

}

div#dspalte {
	margin-top: 0px;
	margin-bottom: 0px;
	width: 94%;
	background-color:#ffffff;
	border: 0px solid #f00000
	position:relative;
	overflow:hidden;
}

div#dspalte a {					
	color: #bb0000; 
	text-decoration: underline;
}

span#subt {				/* biographien		*/
	font-size:12px;
	Font-weight: bold;

}


/***************** Soc Med **************************************/

div#socmed {
	margin-top: 4px;	
	text-align:right;
	padding:0px;
	width: 100%;
	background-color:#ffffff;
	border: 0px solid #ff0000;
	position:relative;
	overflow:hidden;
	float:right;
}

img.soc_med {
	float: none;
	height: 20px;
	width: auto; 	
	margin-right: 10px;
	border:0px solid #000000;
}


/***************** menues **************************************/

div#men_v {
	float:left;
	padding:0px;				
	background-color:#333333;		
	width:130px;
	height:100%; 
	line-height:8px;
	position:fixed; left:0px; top:0px;
	overflow:hidden;
	border:0px solid #ee2222;
	border-right-width: 10px;
}

/*	Hauptmenüpunkte		*/
a.hmact {		
	TEXT-DECORATION: none;
	margin-left:10px;
	line-height:20px;
	color: #ff2222; 
	FONT-SIZE: 12px;
	FONT-WEIGHT: bolder;
	border-bottom: 3px solid #ff2222;
}

a.hmpass {
	TEXT-DECORATION: none;
	margin-left:10px;
	line-height:20px;
	color: #ffffff; 
	FONT-SIZE: 11px;
	FONT-WEIGHT: bolder;
}


/*	Submenüpunkte		*/
a.mact {
	TEXT-DECORATION: none;
	margin-left:10px;
	line-height:20px;
	color: #ff2222; 
	FONT-SIZE: 11px;
	FONT-WEIGHT: bolder;
	border-bottom: 2px solid #ff2222;
}

a.mpass {
	TEXT-DECORATION: none;
	margin-left:10px;
	line-height:20px;
	color: #ffffff; 
	FONT-SIZE: 10px;
	FONT-WEIGHT: bolder;
}

a.mpass:hover {
	COLOR: #ff2222;
	TEXT-DECORATION: none;
}

a.hmpass:hover {
	COLOR: #ff2222;
	TEXT-DECORATION: none;
}

div#men_h1 {
	position: absolute;			
	left: 0px; 				
	top: 120px;	/* alt 100 */
	padding:0px;				
	width:100%;
	line-height:8px;
	background-color:#333333;		
	border:0px solid #ee2222;
}


ul {
	list-style: none;
  	margin: 0;
	padding: 2px 0px;		/* oben/unten  	re/li		*/
}

ul li { 
	display:inline;			/* nebeneinander		*/
	padding-right: 4%;
  	/* border: 0px solid #eeeeee;	*/
} 

div#men_h2 {
	position: absolute;			
	left: 0px; 				
	top: 142px;	/* alt 122 */	
	padding:0px;				
	width:100%;
	line-height:8px;
	background-color:#555555;		
	border:3px solid #ff2222;
}



/***************** medien **************************************/


div#men_med {
	position: relative;			
	left: 0px; 				
	padding:10px;				
	width:90%;
	background-color:#ffffff;		
	border:0px solid #ee2222;
}

div#men_med a {					
	color: #bb0000; 
	FONT-WEIGHT: bold;
	text-decoration: underline;
	padding-left: 16%;
}

div#med_bk {
	padding:20px;				/* Abstand des Inhalts vom Rand	*/
	width: 80%;
	font-size: 12px;
	position:relative; 
	border:0px solid #000000;
	border-bottom-width: 1pt;
	overflow:hidden;			/* div-Größe an Inhalt anpassen  */
}

div#med_bk img {			
	border:1px solid #000000;
	margin-right:10px;
	float:left;
}

div#med_bk h4 {
	FONT-SIZE: 12px;
	FONT-WEIGHT: bold;
	margin-top:0px;
}

/*************** adapt Screen!! **************************/

/* am kleinsten: screen <= 600		*/

@media screen and ( max-width: 600px ) {
	#men_v { 
		display:none; 	
	}
	div#wrapper { 
		left: 0px; 				/* ganz am Rand */
		width:100%;
	}
	div#content { 
		width:95%;
		padding-top: 60px; 			/* wegen Submenue	*/
		padding-left: 10px;		
		/*	background-color:#30ffff;	TEST Anzeige hellgrün!!  */	
	}
	div#spalte { 
		width:100%;
	}
	div#dspalte {
		margin-top: 20px;
	}
	span#dist {
		font-size:40px;
		line-height:40px;
	}
	div#men_h { 
		display:inline;
	}

	img.art_rt {
		float: none;	
		max-width: 97%;
		margin-bottom: 10px;
	}
	img.art_lt {
		float: none;	
		max-width: 97%;
		margin-bottom: 10px;
	}
	/* Text im Header n links */
	header {
		text-align:left;
 		padding-left: 10px; 
	}
	header span {
		color: #ffffff; 
	}

}


/* am allerkleinsten: screen <= 380  just in case	*/

@media screen and ( max-width: 380px ) {
	div#content {				/* wegen men_h nach unten */
		padding-top: 74px;		
	}
}


/*  screen > 600  immer Menüs ändern			*/

@media screen and ( min-width: 601px )  {
	#men_h1 { 				
		display:none; 	
	} 
	#men_h2 { 				
		display:none; 	
	} 
	#men_v { 
		display:inline;
	}
}



/* mittel: screen 601 - 700			*/

@media screen and ( min-width: 601px ) and ( max-width: 700px ) {

	div#content { 
		width:85%;
		padding-left: 10px;
	}
	div#spalte { 
		width: 80%;	
	}
}

/* mittel-gross: screen 701 - 1000			*/

@media screen and ( min-width: 701px ) and ( max-width: 1000px )  {

	div#content { 
		width:90%;
		padding-left: 15px;		
	}

}

/* grosser: screen > 1000			*/

@media screen and ( min-width: 1001px ) {
	h1 { FONT-SIZE: 24pt;  }

}


@media screen and ( max-width: 1450px ) {
	#rechts { 
		display:none; 	
	}

}





