﻿
html {	padding: 0px; margin: 0px;
  background-color: white; }
  
body {  width: 800px;
 	background-color:#FFF68F;  /*  #F5A333; 	/* #FF9900  ;   #FFFFCC;  */
 	border: 2px solid white;
  	border-top: none;
 	border-bottom: none;
  	margin: 10px auto;
  	font-family: "Trebuchet MS", Verdana, Arial, sans-serif; }
  	
p {	margin: 0px; }

h1 {font-size: 2.2em; 
	color: white; 
	margin: 10px 10px 10px 10px;
	padding: 0px;
	letter-spacing: 8px;   }

h2 {font-size: 1.4em; 
	padding: 0px; 
	margin-top: 5px; }
		
h3 {font-size: 1.2em; 
	margin-top: 5px; 
	margin-left: 5px; 
	margin-bottom: 10px; }

h4  {font-size: 1.0em; 
	 padding-left: 5px; margin: 0px;}

h5  {font-size: 0.9em; 
	 padding-left: 5px; margin: 0px;}



/* div Klassen - mehrfach zu verwenden   */ 
.weiss {color: white; }

.schwarz {color: black; }

.orange { color:   #F5A333; }

.absatz0 {font-size: 0.8em;
	margin-left: 5px; }

.absatz1 {	font-size: 1.1em; 
		margin-bottom: 15px; 
		margin-top:10px; 
		margin-left: 5px; }
		
.ohne-rahmen {text-decoration: none;    /* keine Rahmen beim Startbild  */
		border: none; }
		
/***   kopf ******************************** */ 		
#kopf-links {background-color: transparent;   
        width: 15%;  
        height:100px; 
        float: left; 
        }
        
#kopf-mitte {background-color: #FCF768;   
        width: 60%; 
        height:100px; 
        float: 	left;          }
        
#kopf1 {background-color:    #5D2422; /* dunkel-rot */ /* #FFFF99;  */
	border-top: 2px white solid;
	height: 50px; 
	text-align:	 center; 	 }

#kopf2 {background-color: #F5A333;	/* #A1660F;  mein rot */
	border-top: 2px white  solid;
	border-bottom: 2px white solid;
	text-align:	 center;
	height: 37px; }

/* *** bereich unterm start-logo bzw text ******** */
#titel-unten {background-color: #5D2422;;
	border-top: 2px white solid;
	border-bottom: 2px white solid; 
	text-align:	 center;
	clear: both; }

#bild {	padding: 0px; margin: 0px;	/* für Bild auf Startseite */ 
	text-align: center;}

#bilder { background-color: #F5A333 ;   /* für kleine Bilder unten */ 
		border: 2px white solid;
		clear: both; 
		text-align: center; }


/* ************************************************************** */
/* ********* haupt navi  unten *********************************************************** */ 
/* ************************************************************** */
#haupt-navi { font-weight: normal; 
	background-color:  #5D2422; /* #A1660F; */
	border-top: 1px solid white;	
	padding-top: 12px ;
	padding-bottom: 12px ;
	margin: 0em;
 	text-align:center;  }

#haupt-navi li { display: inline;		/* Listenelemente nebeneinander stellen */
   	font-size: 0.9em; 
    list-style-type: none;
     margin: 0;
     padding-left: 5px; 
   ;     }

#haupt-navi a {color: white;; 
	text-decoration: none;
       padding-left: 5px; 
            }

#haupt-navi li a.aktuell{ color:#F5A333;
	text-decoration: none;
         padding-left: 5px; 
          }

#haupt-navi a:hover  { 	color: #FFF68F ; 
	font-weight: normal;   }
	
	
	
	
/* ** neben-navi 2 für impressum *** */ 

#haupt-navi2 { 	background-color:  #5D2422; /* #A1660F; */
	border-bottom: 1px solid white;	
	padding: 4px 30px 0 0 ;
	margin: 0em;
 	text-align: right;  }

#haupt-navi2 li { display: inline;		/* Listenelemente nebeneinander stellen */
   list-style-type: none;
   margin: 0;    }

#haupt-navi2 a {color: white;; 
	text-decoration: none;
    padding: 0px 0px;     }

#haupt-navi2 a:hover  { 
	color: #5D2422; 
	font-weight:bold; 
  }

/* ***********inhalt mit text und evtl navi  *******************  */ 
#inhalt {	background-color: #FFF68F   ; /* #F5A333;   */
	border: 0px white solid; 
	clear: both; 
	/* text-align: center; */
	 }
	
#inhalt-text {	border-top: 0px white  solid; 
		float: left; 
		background-color:#FFF68F  ; /*  #F5A333;     */
		margin-top: 0px; 
		margin-bottom: 0px; 
		padding: 10px; 
		text-align:left; }

#inhalt-text-rechts {	border-top: 0px white  solid; 
		float: right; 
		background-color: #F5A333;   /* #FFFFCC;  */ 
		height: 300px; 
		margin-top: 0px; 
		margin-bottom: 0px; 
		padding: 10px; 
		text-align:left; }

#inhalt-text-unten {background-color: #F5A333;
	border-top: 0px white solid;
	border-bottom: 0px white solid; 
	text-align:	 center;
	clear: both; }

/* ******** navi inhalt zweites menü bei einigen seiten  *** */ 
#navi-inhalt {border: 0px white solid; 
	background-color: #FFF68F ;   /* #FFFFCC;  hellgelb */
	margin-top: 30px; 
	margin-bottom: 35px; 
	width: 20%;
	float: left; 
	text-align: left;
	font-weight: bold; 
}
		
#navi-inhalt li { list-style-type: none;
	margin-top: 20px; 
 }
  
#navi-inhalt li a{	 color: #F5A333 ; 
	 font-weight: bold; }

#navi-inhalt li a:hover{ color:   #5D2422; }

li .a1 {border-left:5px solid #3366FF; 
	padding-left: 5px;} 

#navi-inhalt li a.a1:hover{border-left:5px solid navy; 
	padding-left: 5px;} 


li .a2 {border-left:5px solid #33CC33; 
	padding-left: 5px;} 

#navi-inhalt li a.a2:hover{border-left:5px solid  #006600; 
	padding-left: 5px;} 

li .a3 {border-left: 5px solid #CC3300; 
	padding-left: 5px;} 

#navi-inhalt li a.a3:hover{border-left:5px solid #990000; 
	padding-left: 5px;} 

li .a4 {border-left: 5px solid #FFFF99; 
	padding-left: 5px;} 

#navi-inhalt li a.a4:hover{border-left:5px solid #FFCC00 ; 
	padding-left: 5px;} 
	
li .a5 {border-left: 5px solid  #FFCC99; 
	padding-left: 5px;} 

#navi-inhalt li a.a5:hover{border-left:5px solid #990000 ; 
	padding-left: 5px;} 

li .a6 {border-left: 8px solid  #5D2422; 
	padding-left: 5px;} 

#navi-inhalt li a.a6:hover{border-left: 8px solid #F5A333 ; 
	padding-left: 5px;
	color:  #5D2422; } 


/* ************************************************************** */
/* ********* Fotogalerie  *************************************** */ 
/* ************************************************************** */

#container {position: relative;
	width: 90%;
	height: 550px;
	padding-top: 50px; 
	margin: 15px auto;
	border: 0px solid fuchsia;
}

#container a.galerie span {
	/* position:absolute;  */ 
	float: right; 
	width: 1px;
	height: 1px;
	top: 3px;
	left: 3px;
	overflow: hidden;
}

#container a.galerie:visited {
	display: block;
	color:	#000;
	text-decoration: none;
	border: 0px solid #000;
	margin: 3px 3px;
	text-align: left;
	cursor: default;
}

#container a.galerie {
	display: block;
	color:	#000;
	text-decoration: none;
	border: 0px solid #000;
	margin: 3px 3px;
	text-align: left;
	cursor: default;
}

#container ul {	height: 600px;
	padding: 5px 0 0 0;
	margin: 0;
	list-style-type:none;
}

#container li {	float:left;
	border: 0px solid #111;
}
#container a.galerie:hover {
	border: 0px solid #111;
}

#container a.galerie:active img  {
	border: 1px solid #000;
	padding: 3px;
	margin-bottom: 0px;
	background: #ccc;
}

#container a.galerie:focus img  {
	border: 1px solid #000;
	padding: 3px;
	margin-bottom: 0px;
	background: #ccc;
}

#container a.galerie:hover img  {
	border: 1px solid #000;
	padding: 3px;
	margin-bottom: 0px;
	background: #ccc;
}

#container a.galerie:active span {
	position: absolute;    	
	width: 800px;
	height: 600px;
	top: 50px;
	left: 220px;   /* Position vergrößertes Bild   */ 
 	border: 0px solid black;
}

#container a.galerie:focus span {
	position: absolute;    	
	width: 800px;
	height: 600px;
	top: 50px;
	left: 220px;   /* Position vergrößertes Bild   */ 
 	border: 0px solid black;
}

#container a.galerie:hover span {
	position: absolute;    	
	width: 800px;
	height: 600px;
	top: 50px;
	left: 220px;   /* Position vergrößertes Bild   */ 
 	border: 0px solid black;
}

.left {	float: left;
	width: 200px;
	border: 0px solid orange;}




