/*	-------------------------------------------------------------
	Farben
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
	#262318 = dunkel braun
	#846749 = hell braun
	#5d7b2c = dunkel grün 
	#93b02a = hell grün
	-------------------------------------------------------------	*/

/* 
          Inhalt: 
     
          	1. Global Reset
          	2. Struktur
          	3. ALLGEMEINE ATTRIBUTE
          	4. Links
          	5. Rechtes Navigationsmenü (#content-related)
          	6. Typografie
          	7. Header (#header)
          	8. Horizontales Navigationsmenü (#topnav)
          	9. Banner (#imageintro)
          	10. Footer (#footer)
          	11. Clearfix
*/

/*	-------------------------------------------------------------
	1. GLOBAL RESET
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
               /* Margin und Padding werden auf 0 gesetzt*/
               *
               {
               	margin: 0;
               	padding: 0;
               }

/*	-------------------------------------------------------------------
	2. STRUKTURAUFBAU Lage der Seitenbereiche 
	- - - - - - - - - - - - - - - - - - - - - - - - - - - ------- - - -	*/

                    body {
                              /* Layout fester Breite wird zentriert */
                              width: 940px;
                              margin: 0 auto;
                              padding: 0;
                              background: #ffffff;
                              color: white;
                              font: 0.75em/1.55em Verdana,sans-serif;
                   			 }
                    
                    
                   #begin {
                             /*Unsichtbarer Bereich-> Layoutabstand zum oberen Rand des Browsers*/ 
                    		 margin-right: auto;
                    		 margin-left: auto;
                    		 width: 940px;
                    		 background-repeat: no-repeat;
                    		 height: 10px;
                    		 border: 0px solid red;
                    			}
                    
                    
                    #container {
								/* Hauptcontainer des gesamten Layouts
                    			Vertikale Wiederholung des Hintergrundbildes zur Abschließung des Layouts */
                    				
                    			width: 940px;
                    			border: 0px solid red;
                    			background-repeat: repeat-y;
                    			margin-right: auto;
                    			margin-left: auto;

                            	/* Horizontaler Abstand links und rechts soll ein einheitliches Seitenbild erzeugen */
                    			padding: 5px;
                     			background-color: #262318;
                     			
                     			}
                     
                    #end {
                     /*Unsichtbarer Bereich -> Layoutabstand zum unteren Rand des Browsers*/
                    	margin-right: auto;
                    	margin-left: auto;
                    	width: 760px;
                    	height: 20px;
                    	/*border: 2px solid red;*/
                    }
                    
                    #columnwrap
                    {
                         /* Allgemeiner Container für sämtliche Seiteninhalte Content und Navi links */
                         
                         padding-bottom: 7px;
                         display: block;
                         /*border: 2px solid yellow;*/                         
                    }
                                   
                    #subwrap
                    {
                         /* Ein Subcontainer innerhalb des allgemeinen Containers 
                          Background-color genau so wie Navileiste -> dadurch wächst scheinbar Navileiste mit 
                          Fließtext-contailer mit nach unten! */
                       	
                         background-color: #5d7b2c; /*dunkel grün */
                         width: 100%;
                         float: left;
                         padding-bottom: 4px;
                         padding-top: 4px;
                         display: block;
                         
                         /*border: 1px solid yellow;*/
                    }
                    
                    
                    #content-main {
						/* Inhaltsbereich der Seite -> Fleißtext */
                         float: left;
                         width: 80%;
                         height: 650px;
                         background: #ffffff;
                         color: #262318;
                         padding-bottom: 10px; 
                         overflow:auto;
                         
                    }
                    
                     #content-related
                    {
                         /* Rechtes Navigationsmenü der Seite */
                         font-size: 92%;
                         float: right;
                         width: 20%;
                         
                    }
 
 /*	-------------------------------------------------------------------------------------------------------
 Ende STRUKTURAUFBAU
*/
 
 
 
 
                    /*Formatierungen: Hauptbereich (Fleißtext)  --------------------------------------------
                     -------------------------------------------------------------------------------------- */
                    
                    #content-main img.link {
						display: inline;
						border: 0px solid #ffffff;
						border-radius: 2px;
						margin-left: 0px;
                        margin-right: 0px;
                        margin-top: 0px;
                        margin-bottom: 0px;
						padding-left: 0px;
						padding-right: 0px;
						padding-bottom: 0px;
						padding-top: 0px;
						transition: 0.3s;
						}			
                    
                    #content-main img.link:hover {
						box-shadow: 2px -2px 2px 0px rgba(38,35,24,1);
						}
                    
                    
                    
                    
                    /*Linkcenter---------------------------------------------- */
					#content-main a.linkcenter {
                         
                        border: 0;
                        margin-left: 20px;
                        margin-right: 20px;
                        display: block;
               			color: #262318;
               			font-size: 1em;
               			font-weight: 600;
               			text-decoration: none;
               			text-align: left;
						}        
						            
					#content-main a.linkcenter:hover {
						border: 0;
						margin-left: 21px;
                        margin-right: 21px;
                        display: block;
               			color: #5d7b2c;
               			font-size: 1.2em;
               			font-weight: 700;
               			text-decoration: none;
               			text-align: left;
							}                    
                    
                   /* Bildgalerie----------------------------------------------*/
					#content-main a.small {
							text-decoration: none;
							font-size:1.0em;
							line-height: 1.3em;
							/*font-family: "Trebuchet MS",sans-serif;*/
							font-weight: 400;
							margin-top: 2px;
							margin-bottom: 0px;
							margin-left: 0px;
                            margin-right: 0px;
							color: #846749;
							display: inline;
								
							}                   
                   
                    #content-main a.normal {
							text-decoration: none;
							line-height: 1.3em;
							/*font-family: "Trebuchet MS",sans-serif;*/
							font-weight: 400;
							font-size: 218%;
							/*margin-top: 1em;
							margin-bottom: 0.5em; */
							margin-left: 10px;
							color: #846749;
							display: block;
								
							}                   
                    
                    
                    
                    #content-main * {
                         /* Alle Kinderelemente des Inhaltsbereichs sollen über einen äußeren Abstand verfügen */
                         margin-left: 20px;
                         margin-right: 20px;   
                           }
                    



/*	-------------------------------------------------------------
	3. ALLGEMEINE ATTRIBUTE
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
				
				img
					{
					/* Entferne Rahmen von verlinkten Bildern */
					border: 0px solid #ddd;
					padding-top: 2px;
					padding-bottom: 2px;
					padding-left: 0px;
					padding-right: 0px;
					}
               a
               {
               	border: 0px;
               }
                   
                
               strong,p.bold
               {
               	font-weight: 700;
               }
               
               em {
                    font-style: italic;
               }
               
               p,ul,dl
               {
               	margin-top: .6em;
               	margin-bottom: .8em;
               	text-align: justify;
               }
               
               ul
               {
               	padding-left: 3.3em;
               }
                   
               ol
               {
               	padding-left: 30px;
               }
               
               ul li
               {
               	list-style-type: square;
               	margin-bottom: .4em;
               }

               dt
               {
               	font-weight: 400;
               	margin-top: .5em;
               	color: #999;
               	font-size: 1.1em;
               }
               
               dd
               {
               	margin-bottom: .8em;
               }
               			    				
      
/*	-------------------------------------------------------------
	5. Formatierung RECHTES NAVIGATIONSMENÜ (#CONTENT-RELATED)
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/     

               #content-related h3
               {
               	color: red;
               }

               #content-related h2    /*Überschriften Rubriken */
               {
               	font-size: 1.4em;
               	margin-top: .8em;
               	/*background-color: #262318;  /*dunkel braun */*/
               	font-weight: normal;
               	color: #262318;    /*dunkel braun */
               	border-bottom: 1px solid #262318;
               	border-width: 2px 0;
               	margin-left: 10px;
               }
               
               .homelist
               {
                /* Abstände für die ungeordnete Liste ul.homelist */
               	padding-bottom: .6em;
               	padding-right: 12px;
               	padding-left: 12px;
               }
               
               #content-related .homelist li
               {
               	list-style-type: none;
               }
               
               #content-related ul.homelist li
               {
               	padding-bottom: 1px;
               }
               
               #content-related a
               {
                  /*Verweis wird zum Block deklariert und mit einer festen Breite versehen.
                    Dadurch wird es dem Nutzer leichter fallen, einen Verweis anzuklicken. */
               	display: block;
               	color: #ffffff;
               	font-size: 1em;
               	font-weight: normal;
               	text-decoration: none;
               	text-align: left;
               	width: 180px;
               	padding: 0 5px 4px 32px;
               	/*font-weight: normal;*/
               }
               
               #content-related a:hover, #content-related a:visited:hover, #content-related a:focus, #content-related a:visited:focus
               {
                /* Hover und Focus: in diesem Fall werden beide Zustände identlisch gestaltet */
               	font-weight:normal;
               	font-size: 1.25em;

				display: block;
               	position: relative;
               	left: -25px;
               	color: #5d7b2c;
               	text-decoration: none;
               	text-align: left;
               	width: 160px;
               	background-color: #93b02a; /*hell grün */
               	color: #ffffff;
				}																					
																									
															
																								   
/* Anmeldeformular--------------------------------------------------------------------*/   

			form{
				width:132px;
				margin-left:25px;
				margin-top:40px;
				padding:0px;
				}

			fieldset{
				margin:10;
				padding:10px;
				border:1px solid #93b02a;
				}
 
			legend{
				/*display:none;*/
				color:#FFFFFF;
				}
 
			label{
				display:block; 
				color:#FFFFFF;
				}
 
			input{	
				font-family:Arial, Helvetica, sans-serif;
				font-size:12px;
				color:#93b02a;
				}
 
			input.text{
				width:100px;
				color: #262318;
				border:1px solid #93b02a;
				border-color:#a1a1a1 #ededed #ededed #a1a1a1;
				margin:2px 0 5px 0;
				padding:2px;
				height:15px;
				}
 
			input.submit{
				cursor:pointer;
				width:106px;
				font-size:12px;
				border:1px solid #ededed;
				/*border-color:#ededed #a1a1a1 #a1a1a1 #ededed; */
				height:21px;
				background:#f7f7f7;
				}
				
				
/*	-------------------------------------------------------------
	6. TYPOGRAFIE
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
               h1
               {
               	line-height: 1.3em;
               	font-family: "Trebuchet MS",sans-serif;
               	font-weight: 400;
               	font-size: 218%;
               	margin-top: 1em;
               	margin-bottom: 0.5em;
               	color: #846749;
               }
               
               
               h1.galerie {
               display: inline; 
               line-height: 1.3em;
               	font-family: "Trebuchet MS",sans-serif;
               	font-weight: 400;
               	font-size: 218%;
               	margin-top: 1em;
               	margin-bottom: 0.5em;
               	color: #846749;
               } 
               
               h2
               {
               	font-family: "Trebuchet MS", Verdana,"Trebuchet MS",sans-serif;
               	font-size: 1.5em;
               	margin-bottom: .6em;
               	line-height: 1.22em;
               	color: #092e20;
               }
               
               h3
               {
               	font-family: Verdana, sans-serif;
               	font-size: 1.0em;
               	font-weight: 700;
               	margin-bottom: .2em;
               	color: #262318;
               	text-transform: uppercase;
               	letter-spacing: 1px;
               	/*background-color: #262318;*/
               	/*background-color: #846749;*/
               	padding: 2px 3px 2px 10px;
                    /*border: 1px solid #93b02a;*/
                    border-bottom: 3px solid #93b02a;
               }    

				h4
               {
               	font-family: Verdana, sans-serif;
               	font-size: 1.0em;
               	font-weight: 700;
               	margin-bottom: .2em;
               	color: #262318;
               	/*text-transform: uppercase*/
               	letter-spacing: 1px;
               	/*background-color: #262318;*/
               	/*background-color: #846749;*/
               	padding: 2px 3px 2px 10px;
                    /*border: 1px solid #93b02a;*/
                    border-bottom: 1px solid #93b02a;
               }    



				h5
               {
               	font-family: Verdana, sans-serif;
               	font-size: 1.2em;
               	font-weight: 700;
               	margin-bottom: .2em;
               	color: #262318;
               	letter-spacing: 1px;
               	/*padding: 2px 3px 2px 10px;*/
                /*border-bottom: 1px solid #93b02a;*/
               }    


				h6
               {
               	font-family: Verdana, sans-serif;
               	font-size: 1.0em;
               	font-weight: 700;
               	margin-bottom: .2em;
               	color: #262318;
               	/*letter-spacing: 1px;*/
               	/*padding: 2px 3px 2px 10px;*/
                /*border-bottom: 1px solid #93b02a;*/
               }    

               #content-main h2,#content-main h3
               {
               	margin-top: 1.2em;
               }
               
               
/* Tabellenformatierung*/

					table 
							{
							background:#ffffff;				 
							/*border: 1px solid #93b02a;*/
							border: 0px;
							}

						tr	
							{
								background:#ffffff;				 
								border-bottom: 1px solid #93b02a;
								}

						th
							{
							text-align: left;
       					 /*background:#93b02a;*/

							 padding: 5px;
							 border-bottom: 1px solid #93b02a;
							}


						td
							{
      					/*background:#f7f7f7;*/
							margin-bottom: 0px;
							padding-top: 7px;
							padding-bottom: 7px
							/*border-top: 1px solid #93b02a;*/
										
							}               
               
               
						tr.impress	
							{
							background:#ffffff;				 
							border-bottom: 1px solid #93b02a;
							}

						th.impress 
							{
							text-align: left;
							background:#ffffff;
							padding: 2px;
							border-bottom: 1px solid #93b02a;
							}


						td.impress
							{
							/*background:#f7f7f7;*/
							margin-bottom: 0px;
							padding: 2px;
							/*border: 1px solid #93b02a;*/
										
							}               
                            
/*	-------------------------------------------------------------
	7. HEADER (#header)
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/
               #header
               {
               	height: 64px;
               	background: #262318 url(../banner/sf_banner.jpg);
               	/*background-color: #262318;*/
               }
                   
/*	-------------------------------------------------------------
	8. HORIZONTALES NAVIGATIONSMENÜ (#TOPNAV)
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/     
     
               #topnav ul
               {
               	display: inline;
               	margin: 0;
               	padding: 0;
               }
               
               #topnav ul li
               {
                    /* Listenelemente werden in eine Reihe gelegt. */
               	display: inline;
               }

               #topnav
               {
               	width: 940px;
               	height: 35px;
               	line-height: 15px;
               	text-align: center;
               	background-color: #5d7b2c;      /* dunkel grün*/
               	border-top: 2px solid #93b02a;   /*hell grün*/
               }
               
               #topnav a
               {
                /* Das Navigationsmenü soll Verweise als Kästchen präsentieren, demzufolge werden sie
                    zu Block-Level-Elementen deklariert und als Blöcke gestaltet. */
               	font-size: 1em;
               	font-weight: normal;
               	color: #ffffff;
               	text-decoration: none;

                /* Gefloatete Elemente sind automatisch Block-Level-Elemente;
                display: block; ist nicht notwendig */
               	float: left;
               	height: 1.6em;
               	width: 82px;
               	/*background-color: #262318; /*dunkel braun*/
               	background-color: #5d7b2c;
               	border: 1px solid #93b02a; /*hell grün*/
               	border-width: 1px 1px 1px;
               	margin: 3px 1px;
               	padding: 4px 6px;
               }
               
               #topnav a:hover
               {
               	height: 19px;
               	font-size: 1em;
               	font-weight: bold;846749
               	background-color: #93b02a;
               	color: #ffffff;
               	text-decoration: none;
               }
               

																							
/*	-------------------------------------------------------------
	9. BANNER (#IMAGEINTRO)
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/     
               #imageintro
               {
                    /* Eine horizontale Abgrenzung zwischen dem Banner und dem übrigen Inhalt */
               	/*border-bottom: 6px solid #5d7b2c; hell grün*/
               	            	
               	border-top: 2px solid #93b02a;     /*  hell grün*/
               	border-bottom: 2px solid #93b02a;
               	height: 134px;
               	width: 940px;
               	margin: 0;
               	/*background: #262318 url(../pictures/pic1_2.png) no-repeat;*/
               	backgrount-color: #262318;
               }
               
 
/*	-------------------------------------------------------------
	10. FOOTER (#FOOTER)
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/     
               #footer
               {
                    /* Footerbereich: damit auch Footer nicht gefloatet wird, wird es mit clear: left aus dem Fluß herausgerissen
                    und erscheint wie gewohnt unter dem übrigen Inhalt. */
               	clear: left;
               	/*padding: 10px 20px;*/
               	min-height: 61px;
               	background: #262318 url(../banner/song_banner.png) no-repeat;  /*hell braun*/
               }
                   
           
/*	-------------------------------------------------------------
	11. CLEARFIX
	- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -	*/     

               /* Notwendig für die Umschließung des gesamten Seitenbereichs. */
               #columnwrap:after,#subwrap:after
               {
               	content: ".";
               	display: block;
               	height: 0;
               	clear: both;
               	visibility: hidden;
               }