/* typographer01 - an open source xhtml/css website layout by Armin Zimmermann 
   (http://home.htp-tel.de/azimmermann/). Made for OSWD.org, free to use as-is 
   for any purpose as long as the proper credits are given for the original 
   design work. For design assistance and support, contact me through my 
   website or through http://oswd.org/email.phtml?user=Andreas 

   Version: 1.0
   (February 21, 2007) */

/* Die Bildschirmbereiche */

/* Der Bildschirm - Das braucht man fuer einen eigenen Hintergrund */

body 							{ 	margin: 			0 auto; 
									padding: 			0; 
									font: 				76% Verdana,Tahoma,Arial,sans-serif;
									background: 		#ffffff; /*#f4f4f4;*/ /* Bildschirmrand ganz aussen rechts und links */;
								}

#wrap 							{ 	color: 				#333333; /* die normale Textfarbe.   Schwarz ist  zu kontrastreich */ 
									margin: 			0 auto; 
									width: 				100%; /* Da ich keinen Rand zwischen wrap und body will, habe ich die width von 95% auf 100% gesetzt */
									background: 		#FFFFFF; 
									padding: 			0; /*0 2.5% 0 2.5%;*/
								}

/*-------------------------------------------------------------------------------------------------------------------*/
/* Seitenabschnitte */
/* Seitenueberschrift */

#top_header   					{ 	float:				left;
									background:			#000066;												        
									text-align: 		center; 					
									width:				95%; 
									padding: 			4px 2.5% 42px 2.5%;   /* eigentlich reichen 32px aber fuer den IE muss man 42px nehmen! */
									background-image:	url(Bilder/Hintergrund.jpg); /* url(Bilder/Figur.png);*/    
									background-repeat:	no-repeat;
									background-position:center bottom;
								}					

/* Menue */

#main_menu						{ 	width:				95%;
									float:				left; 
									text-align: 		center; 
									padding: 			9px 2.5% 9px 2.5%; 
									color: 				#999999; 							
									font-size: 			1.0em; 
									font-weight:		bold; 
									background-color:	#e4e6e7;  
									border-top: 		1px solid #cccccc; 
									border-bottom: 		1px solid #cccccc;
								}			
			  
#main_menu_top 					{ 	float:				left; 
									width:				100%; 
									height: 			12px; 
									background: 		url(Bilder/Menue_oben.png) top repeat-x; 
									background-color:	#e4e6e7;  /* Damit es im IE keinen weissen Zwischenraum gibt */
								}
				
#main_menu_bottom				{ 	float:				left; 
									width:				100%; 
									height: 			12px; 
									background: 		url(Bilder/Menue_unten.png) top repeat-x;
									background-color:	#ffffff;  /* Damit es im IE keinen weissen Zwischenraum gibt */ 									
								} 			  

/* Version */	

#version						{ 	float:				left; 
									text-align: 		center; 
									width:				95%; 
									padding: 			20px 2.5% 0 2.5%; 
									color:				#999999;  
									background: 		#FFFFFF; 
									font-size: 			0.8em; 
									font-weight: 		normal; 
								}			 

/* Seiteninhalt */

#page_content					{ 	width:				91%; 
									line-height: 		1.6em; 
									text-align: 		justify; 
									background-color:	#FFFFFF; 
									padding: 			0 4.5% 0 4.5%; 
								}
/* Wenn man rechts und links der Seite keinen Rand will, d.h. wrap fuellt die ganze Seite aus, dann muss page_content auf 100% gestellt werden und das padding
vom page_content entsprechend hoch. wrap muss auch auf 100% um den Rand verschwinden zu lassen. */

/* Fusszeile */

#footer         				{ 	clear: 				both; 
									width:				95%; 
									padding: 			12px 2.5% 20px 2.5%; 
									border-top: 		1px solid #990000; 
									text-align: 		center;                      
									color:				#999999; 
									font-size:  		0.9em;
									background: 		#ffffff;  
									border-top: 		1px solid #cccccc; 
								}
				
#footer a       				{ 	color: 				#336699;
									text-decoration: 	none; 
								}
				
#footer a:hover 				{ 	text-decoration: 	underline; 
								}

/* Abschnitt ganz unten */

#bottom							{ 	float:				left; 
									width:				95%; 
									padding: 			9px 2.5% 9px 2.5%; 
									background: 		#666666;
									font-size: 			0.8em; 
									border-top: 		1px solid #cccccc; 
									border-bottom: 		1px solid #cccccc;	
								}

#bottom_top 					{ 	float:				left; 
									width:				100%; 
									height: 			12px; 
									background:			url(Bilder/Bottom.png) top repeat-x;
									border-top: 		1px solid #CCCCCC; 
									background-color:	#cccccc;   /* Damit es im IE keinen weissen Zwischenraum gibt */
								} 	
																	

/*-------------------------------------------------------------------------------------------------------------------*/
                   
a              					{ 	text-decoration: 	none; 
									color: 				#336699;
								}
				
a:hover        	 				{ 	text-decoration: 	underline; 
									color: 				#336699;
								}
				
a img           				{ 	border: 			0; 
								} 

/*-------------------------------------------------------------------------------------------------------------------*/

/* diverse Formatierungen */
 
.image_left_shadow 				{ 	margin: 			10px 10px 5px 0; 
									float: 				left;  /* Die alte Definition */
									
									background-image:	url(Bilder/Bildschatten.png);
									background-position: right bottom;
									padding-top: 		4px;				
									padding-right:		5px;
									padding-bottom: 	14px;
									padding-left:  		4px;
 				
								}
				  
.image_left 					{ 	margin: 			10px 10px 5px 0; 
									float: 				left; 
								}
								
		
								
.image_right 					{ 	margin: 			10px 0 5px 10px; 
									float: 				right; 
								}

/*-------------------------------------------------------------------------------------------------------------------*/

/* Seitenueberschrift */

.box_chapter					{ 	float:				left; 
									width:				95%;
									margin-top: 		9px; 
									padding: 			30px 2.5% 30px 2.5%;  
									background-color:	#FFFFFF; 
									font-size: 			1.5em; 
									font-weight: 		bold; 
									color: 				#990000; 
									text-align: 		center; 
								}

/* Ueberschrift fuer neuen Abschnitt */
 
.box_subchapter					{ 	float:				left; 
									width:				95%; 
									margin-top: 		4px; 
									padding: 			9px 2.5% 18px 2.5%;
									background-color:	#FFFFFF; 
									border-top: 		1px solid #CCCCCC;  
								}

.box_subchapter_colored			{ 	float:				left; 
									width:				95%;
									margin-top: 		4px; 
									padding: 			9px 2.5% 18px 2.5%;
									background-color:	#FFFFFF; 
									border-top: 		1px solid #990000; 
								}
		   
/* Spaltentrenner */
                   
.box_line						{ 	float:              left; 
									width:				95%;
									height:				1px; 
									border-top: 		1px solid #CCCCCC; 
									padding: 			0 2.5% 0 2.5%;
								}						
								
.box_line_blank					{ 	float:				left; 
									width:				95%;
									height:				1px;
									padding: 			0 2.5% 0 2.5%;
								}

/* zwei gleiche Spalten */

.box_left						{ 	float:				left; 
									width:				45.5%; 
									line-height: 		1.6em; 
									text-align: 		justify; 
									background-color:	#FFFFFF; 
									padding: 			0 2% 0 2.5%;
								}
.box_left_image					{ 	float:				left; 
									width:				150px; 
									line-height: 		1.6em; 
									text-align: 		justify; 
									background-color:	#FFFFFF; 
									padding: 			0 2% 0 2.5%;
								}								
								
.box_right						{ 	float:				right; 
									width:				45.5%; 
									line-height: 		1.6em; 
									text-align: 		justify; 
									background-color:	#FFFFFF; 
									padding: 			0 2.5% 0 2%;
								}
								
.box_left p 						{ 	padding-bottom: 	0.6em;  /* Registerhaltigkeit */
								} 
.box_right p						{ 	padding-bottom: 	0.6em;  /* Registerhaltigkeit */
								} 
								
/* zwei Spalten, links schmal */

.box_left_small 					{ 	float:				left; 
									width:				34.8%;
									line-height: 		1.6em; 
									text-align: 		justify; 
									background-color:	#FFFFFF; 
									padding: 			0 2% 0 2.5%;
								}
								
.box_right_large				{ 	float:				right; 
									width:				56.2%; 
									line-height: 		1.6em; 
									text-align: 		justify; 
									background-color:	#FFFFFF; 
									padding: 			0 2.5% 0 2%; 
								}
								
.box_left_small_marg 			{ 	float:				left; 
									width:				34.8%;
									line-height: 		1.6em; 
									text-align: 		left; 
									background-color:	#FFFFFF; 
									padding: 			0 2% 0 2.5%;
									border-top: 		1px solid #CCCCCC;
								}
								
.box_left_small p 				{ 	padding-bottom: 	0.6em; /* Registerhaltigkeit */
								}
								
.box_right_large p				{ 	padding-bottom: 	0.6em; /* Registerhaltigkeit */
								}

.box_left_small_marg p			{ 	padding-bottom: 	0.6em; /* Registerhaltigkeit */
								}

/* zwei Spalten, rechts schmal */

.box_left_large 					{ 	float:				left; 
									width:				56.2%; 
									line-height: 		1.6em; 
									text-align: 		justify; 
									background-color:	#FFFFFF; 
									padding: 			0 2% 0 2.5%;
								}
								
.box_right_small				{ 	float:				right; 
									width:				34.8%;
									line-height: 		1.6em; 
									text-align: 		justify; 
									background-color:	#FFFFFF; 
									padding: 			0 2.5% 0 2%; 
								}

.box_left_large p				{ 	padding-bottom: 	0.6em; 
								}
								
.box_right_small p				{ 	padding-bottom: 	0.6em; 
								}

/* zwei Spalten mit Marginale */

.box_left_tiny					{ 	float:				left; 
									width:				17.4%; 
									line-height: 		1.6em; 
									text-align: 		justify; 
									background-color:	#FFFFFF; 
									padding: 			0 2% 0 2.5%; 
								}
								
.box_center_small   				{ 	float:				left; 
									width:				34.8%; 
									line-height: 		1.6em; 
									text-align: 		justify; 
									background-color:	#FFFFFF; 
									padding: 			0 2% 0 2%;
								}
								
/* small2 kann gelöscht werden Ist identisch mit small */
			  
.box_right_small2	{ float:right; width:34.8%;/*278px;*/ line-height: 1.6em; text-align: justify; background-color:#FFFFFF; 
			  padding: 0 2.5% 0 2%;/*0 20px 0 16px;*/ }
			  
.box_left_tiny_marg 				{ 	float:				left; 
									width:				17.4%;
									line-height: 		1.6em; 
									text-align: 		left; 
									background-color:	#FFFFFF; 
									padding: 			0 2% 0 2.5%; 
									border-top: 		1px solid #CCCCCC;
								}
								
.box_left_tiny p 				{ 	padding-bottom: 	0.6em; 
								} 
								
.box_center_small p				{ 	padding-bottom: 	0.6em; 
								} 

.box_right_small2 p				{ 	padding-bottom: 	0.6em; 
								} 

.box_left_tiny_marg p 			{	padding-bottom: 	0.6em; 
								} 

/* 3-spaltig. Braucht man doch manchmal, z.B. fuer Fotos, aber mit normalem Text und nicht wie bei den Fussnoten */
 
.box_left_3  					{ 	float:				left; 
									width:				29%;
									line-height: 		1.6em;  
									text-align: 		left; 
									background-color:	#FFFFFF; 
									padding: 			0 2% 0 2.5%; 
								}
								
.box_center_3					{ 	float:				left; 
									width:				29%; 
									line-height: 		1.6em; 
									text-align: 		left; 
									background-color:	#FFFFFF; 
									padding: 			0 2% 0 2%; 
								}
								
.box_right_3 					{ 	float:				right; 
									width:				29%;
									line-height: 		1.6em; 
									text-align: 		left; 
									background-color:	#FFFFFF; 
									padding: 			0 2.5% 0 2%; 
								}			
								
.box_foto_3 p					{ 	padding-bottom: 	0.6em; 
								} 																												

.box_left_3 p					{ 	padding-bottom: 	0.6em; 
								} 

.box_center_3 p					{ 	padding-bottom: 	0.6em; 
								} 

.box_right_3 p 					{	padding-bottom: 	0.6em; 
								}
								
/* Fussnoten */
 
.box_footer_left  				{ 	float:				left; 
									width:				29%;
									line-height: 		1.4em; /* = 1.6 em * 0.9 = 1.44em. Die Zeilenhoehe anpassen, damit das Verhaeltnis stimmt */
									text-align: 		left; 
									background-color:	#FFFFFF; 
									padding: 			0 2% 0 2.5%; 
									font-size: 			0.9em; 
									font-weight: 		normal; 
									color:				#999999; 
								}
								
.box_footer_center				{ 	float:				left; 
									width:				29%; 
									line-height: 		1.4em; 
									text-align: 		left; 
									background-color:	#FFFFFF; 
									padding: 			0 2% 0 2%; 
									font-size: 			0.9em; 
									font-weight: 		normal; 
									color:				#999999; 
								}
								
.box_footer_right 				{ 	float:				right; 
									width:				29%;
									line-height: 		1.4em; 
									text-align: 		left; 
									background-color:	#FFFFFF; 
									padding: 			0 2.5% 0 2%;
									font-size: 			0.9em; 
									font-weight: 		normal; 
									color:				#999999; 
								}
/* Die Post-its */
.box_post-it_small  			{ 	float:				left; 
									width:				42%;
									margin-right: 		2%;
									padding-right: 		4%;
									padding-left: 		4%;
									padding-top: 		2%;
									padding-bottom: 	2%;

 									border-top: 		1px solid #eeeeee;  
									border-left: 		1px solid #eeeeee;  
 
									background-image:	url(Bilder/Post-it-hell.png); 
									background-repeat:	no-repeat; 
									background-position:right bottom; 	

									line-height: 		1.4em;			
									font-size: 			0.9em; 
									font-weight: 		normal; 
									text-align: 		justify; 
								}	
.box_post-it_medium  			{ 	float:				left; 
									width:				52.7%; /* 52.7 damit das Verhaeltnis aehnlich ist zu box_left_small und box_left_large */
									margin-right: 		2%;
									padding-right: 		4%;
									padding-left: 		4%;
									padding-top: 		2%;
									padding-bottom: 	2%;

 									border-top: 		1px solid #eeeeee;  
									border-left: 		1px solid #eeeeee;  
 
									background-image:	url(Bilder/Post-it-hell.png); 
									background-repeat:	no-repeat; 
									background-position:right bottom; 	

									line-height: 		1.4em;			
									font-size: 			0.9em; 
									font-weight: 		normal; 
									text-align: 		justify; 
								}									
								
.box_post-it_large  			{ 	float:				left; 
									width:				92%;
									padding-right: 		4%;
									padding-left: 		4%;
									padding-top: 		2%;
									padding-bottom: 	2%;

 									border-top: 		1px solid #eeeeee; 
									border-left: 		1px solid #eeeeee; 
 
									background-image:	url(Bilder/Post-it-hell.png);
									background-repeat:	no-repeat; 
									background-position:right bottom; 	

									line-height: 		1.4em;			
									font-size: 			0.9em; 
									font-weight: 		normal; 
									text-align: 		justify; 
								}	
								
/* Die Hauptueberschrift */ 

.title_title 					{ 	font-size: 			1.3em; 
									font-weight: 		bold; 
									color:				#cccccc; 
									border-top: 		1px solid #cccccc;
								}			

/* Die Ueberschrift unter der Hauptueberschrift */

.title_subtitle 					{ 	color:				#999999; 
								}

/* Zaehler unten in der Fussnote */

.footer_counter 					{ 	font-size: 			0.9em; 
									font-weight: 		normal; 
									color:				#333333; 
								}  
 
/* Verweis auf die Fussnote */
 
.footer_link 					{ 	font-size: 			0.8em; 
									color:				#336699; 
									vertical-align:		bottom; 
								}

/* Der Text im Menue */

.menu_link 						{ 	font-size: 			11px; 
									font-weight:		bold; 
									color:				#336699; 
								}
								
.menu_link a						{ 	font-size: 			11px; 
									font-weight:		bold; 
									color:				#336699; 
									text-decoration:	none; 
								}
								
.menu_link a:hover				{ 	text-decoration:	underline; 
								}

/* Menuetext ausgewaehlt */

.menutext_selected 				{ 	font-size: 			11px; 
									font-weight:		bold; 
									color:				#336699;
									text-decoration:	none; 
								}
								
.menutext_selected a				{ 	font-size: 			11px; 
									font-weight:		normal; 
									color:				#336699; 
									text-decoration:	none; 
								}
								
.menutext_selected a:hover 		{ 	text-decoration:	underline; 
								}

/* Abbildungstext */

.text_image_left 				{ 	font-size: 			0.9em; 
									text-align:			left; 
									font-style:			italic; 
								}
								
.text_image_right 				{ 	font-size: 			0.9em; 
									text-align: 		right; 
									font-style:			italic; 
								}
								
.text_image_below 				{ 	font-size: 			0.9em; 
									clear:				both; 
									font-style:			italic; 
								}								
								
/* Kapitaelchen */

.text_capitals_small 			{ 	font-size: 			0.9em; 
									text-transform: 	uppercase; 
								}
								
.text_capitals_big   				{ 	font-size: 			1.0em; 
									text-transform: 	uppercase; 
								}

.text_capitals_small_colored 	{ 	font-size: 			0.9em; 
									text-transform: 	uppercase; 
									color:				#990000;
								}
								
.text_capitals_big_colored   		{ 	font-size: 			1.0em; 
									text-transform: 	uppercase; 
									color:				#990000;
								}
								
/* Unter-Ueberschriften */

.colored 						{ 	color: 				#990000; 
								}

/* Seitenanfang */

.top							{ 	float				:right; 
									width:				95%;
									background-color:	#FFFFFF; 
									padding: 			0 2.5% 0 2.5%; 
									font-size: 			1.0em; 
									font-weight: 		bold; 
									color: 				#999999; 
									text-align: 		right; 
								}

/* Ueberschriften.  h1 entspricht der Ueberschrift am Anfang der Seite (title_chapter), beispielsweise "Startseite" */

h1	 							{	font-size: 			1.5em; 
									font-weight: 		bold; 
									color: 				#990000; 
									text-align: 		center;
									clear:				both; /* Die Ueberschrift soll IMMER in einer neuen Zeile anfangen,
																 egal ob vorher ein Umfluss definiert war oder nicht */						
								}
								
h2 								{	font-size: 			1.2em; 
									font-weight: 		bold; 
									text-align: 		left;
									clear:				both;									
								}
								
h3 								{	font-size: 			1.0em; 
									font-weight: 		bold; 
									text-align: 		left;
									padding-bottom: 	0.6em;
									clear:				both;
								}

/* h4 wird verwendet, um in den Personenlisten eine rote Ueberschrift und einen Strich darueber zu erzeugen */								
h4 								{	 font-size: 			1.0em; 
									font-weight: 		bold; 
									text-align: 		left;									
									color: 				#990000; 
									border-top: 		1px solid #cccccc;
									border-bottom: 		1px solid #cccccc;												
								}								

							
/* In der Vorfahren-Liste gibt es Angaben, die aus Sekundaerquellen stammen und noch nicht geprueft worden sind.
Diese erhalten das Fromat Unter-Ueberschriften */

.unchecked 						{ 	color: 				#999999; 
								}								
	
.comment                        { 	color: 				#999999; 
                 					font-size:0.9em;
									line-height: 		1.4em;
									border-top: 		1px solid #cccccc;
									border-bottom: 		1px solid #cccccc;
									border-left: 		1px solid #cccccc;
									border-right: 		1px solid #cccccc;			
									padding: 5px 10px 5px 10px;
									/* padding: 5px 10px 5px 35px;					
									background-image:	url(Bilder/info.png);      
									background-repeat:	no-repeat;
									background-position:left top;				*/
								}	


								
