﻿/*CSS-Datei für alle Sites*/
*{
	font-family: Cambria, Cochin, Georgia, Times, "Times New Roman", serif ;
 	font-size: 1em; /*Schriftgröße in relativer Angabe*/
	text-align: left; /*alle Texte linksbündig ausrichten*/
	line-height: 1em; /*vertikale Zeilenhöhe*/
	padding: 0px; margin: 0px; /*Ränder*/
 }
/*-------------------------------
         gesamter BODY 
---------------------------------*/
body {
	background-color: #fffff0; /*Hintergrundfarbe mit HEX-Code*/
	text-align: left; /*Ausrichtung links*/
	color: #000000; /*Schirftfarbe weiß*/
	
	}
/*-------------------------------
              SCHRIFT 
---------------------------------*/
h1	{
	font-size: 1.3em; /*Schriftgröße in relativer Angabe*/
	color: #8c0000;	/*Schriftfarbe*/
	/*Außenränder zum Nachbarelement in relativer Angabe*/
	margin: 1em 0.5em 1em 0.5em; 
	/*unterer Rahmenstil und -farbe*/	
	border-bottom-style: solid; border-color:#8c0000; 
	/*linker Rahmenstil und -farbe*/	
	border-left-style: solid; border-color:#8c0000; border-left-width: 2em; 
	}
h2	{
	font-size: 1.1em;
	color: #8c0000;		
	margin: 0.8em 0.5em 0.6em 0.5em ;

	}
h3	{
	font-size: 1.0em;
	font-style: italic;	font-weight: bold; 	/*Kursivschrift und fett*/
	color: #8c0000;	
	margin: 0.5em 0.5em 0.1em 0.5em;

	}
p{
	font-size: 1.0em;
	margin: 0.1em 0.5em 0.1em 0.5em;	
	}
	p.textblocksatz
		{
		text-align:justify;	/*Blocksatz*/
		}
	p.textklein
		{
		font-size: 0.8em;
		}
	p.titel 
		{
		font-weight:bold;
		font-size: 1.4em;
		color: #0036d9;
		}
/*-------------------------------
              SONSTIGES 
---------------------------------*/
/*Bildformatierung mit Randanstand 0.2em und vertikal-zentrieter Ausrichtung*/
img	{
	max-width: 100%;	height: auto;
	margin:0.2em;
	vertical-align:middle;
	}
hr	{
	/*Trennlinienformat Frabe und fest 1px*/
	color: #4f7dc8; height: 1px; text-align: center;
	}
	hr.linielinks{
		text-align: left;
	}
td{	/*Tabellenzellen td */
	}
	td.zelle{
		margin-left: 5px; margin-bottom: 7pt; margin-top: 0pt; 
		font-size:  1em; margin-top: 0pt; text-align: center;
		}
th{/*Tabellenzellen th*/
}
	th.kopf{
		margin-left: 5px; margin-bottom: 7pt; margin-top: 0pt; 
		font-size:  1.1em; margin-top: 0pt; text-align: center;
		}
/*-------------------------------
              FORMULARE 
---------------------------------*/
/*Eingabetextfelder*/
input{	background-color:  #cbfed8;
	}	
	input:focus{ /*wenn der Cursor in Eingabefeld kommt...*/
		background-color:  #ffffbf;
		}
		input:required + label::before {
		position: absolute;
		left: 300%;
		content: "â˜…";
		color: red;
		}
	   input:required:valid + label::before {
		 content: "âœ”";
		 color: green;
		 }
/*Massentextfelder*/
textarea:focus{
	background-color:  #ffffbf;
	}	
/*Auswahlfelder, die sich gegenseitig auslösen*/
fieldset{
	font-size: 0.8em; 
	margin-top: 1em; margin-left: 2em;
	}
	fieldset:focus{
		background-color:  #ffffbf;
		}
/*-------------------------------
              LAYOUT 
---------------------------------*/
#kopf{
}

#meinlogo {
	display: block;
	padding: 0.1em;
	float: right;
	}
#inhaltscontainer {
	margin: 0 ;
	max-width: 1600px;
	padding:1em 1em 5em 1em;
	}
#inhalt{
	margin: 0 ;
	padding:1em 1em 5em 1em ;
	float:left;
	width: 100%;
	}
	
#seiterechts{
	background-color: #E6E6E6;
	display: none;
	}

/*-------------------------------
        LINKS, SCHALTFLÄCHEN 
---------------------------------*/
	
/*	LINK-STILE (Buttons)
------------------------*/
/*Normaler Link*/
a	{
	font-size: 1.5em;   
	text-align:  left; 
	text-decoration:none;
	color: blue;
	line-height: 1.5em;
	}
	a.mbtn2 {
 text-decoration: none;
 color:#2D7D9A;
	
}
a.mbtn2:link {
 text-decoration: none;
 color:#2D7D9A;
}

a.mbtn2:hover {
 text-decoration: none;
 color:#2D7D9A;
 font-weight:bold;
}
a.mbtn2:vistited {
 text-decoration: none;
 color:#2D7D9A;
}

	
/*3D-Effekt-Button grün*/
a.button{
	color: black;
	font-family:  verdana, arial, helvetica, sans-serif; font-size: 1em;
	text-decoration: none; text-align:  center;
    border-width: thin; border-style:  solid;	
	padding:  4px 8px 4px 8px;
    width:  400 px; 
	display: block;
	}
	a.button:link{
		background-color:  #339933;
		border-color:  #7FC27F #555555 #555555 #7FC27F;
		} 
	a.button:visited{
		background-color:  #339933;
		border-color:  #7FC27F #555555 #555555 #7FC27F;
		}
	a.button:hover{
		background-color:  #7FC27F;
		border-color:  #555555 #7FC27F #7FC27F #555555 ;
		}
/*Kleiner Button grau*/	
	a.buttonklein{
		font-family: "Franklin Gothic Medium", "Arial Narrow", Arial, sans-serif;	    
		font-size:  8pt;
		text-align:  center;
		text-decoration:  none;
		width:  100px;
		margin-left:  0px;
		display:  block;
		}
		a.buttonklein:link	{
		background-color:  #A0A0A4; color:  #993333;
		padding:  4px 8px 4px 8px;
		border-width:  thin; border-style:  solid;
		border-color:  #808080 #2A0000 #2A0000 #808080;
		}
		a.buttonklein:visited{
		background-color:  #A0A0A4; color:  #993333;
		text-decoration:  none;
		padding:  4px 8px 4px 8px;
		border-width:  thin; border-style:  solid;
		border-color:  #808080 #2A0000 #2A0000 #808080;
		}
		a.buttonklein:hover{
		background-color:  #D1D1D6; color:  #993333;
		text-decoration:  none;
		padding:  4px 8px 4px 8px;
		border-width:  thin; border-style:  solid;
		border-color:  #2A0000 #808080 #808080 #2A0000;
		}
/*Buttons mit Einblend-Effekt nicht nur für a-Tags
----------------------------------------------------*/
.meinbutton {
	background-color: #4CAF50; /* grün */
	font-size: 1.2em; /* Schriftgröße relativ */	  
	text-align: center; /* Ausrichtung im Button */
	text-decoration: none; /* keine Unterstreichung */
	margin: 10px; /* Abstand außen zum nächsten Element */
	padding: 16px 32px;  /* Innen"rand" */
	width: 200px; /* 50% Breite vom Fenster oder Bereich */
	display: inline-block; /* Buttons als Blockelemente */
	/*--- Animation: */
	transition-duration: 1s;	  
	-webkit-transition-duration: 1s; /* Safari-Browser */
	cursor: pointer;
}
	.meinbutton :hover {
	  background-color: #4CAF50; /* Green */
	  color: white;
	}
	/*Zusätzliche Variante1*/
	.meinbutton1 {
	  background-color: white; 
	  color: black; 
	  border: 2px solid #4CAF50;
	}
	.meinbutton1:hover {
	  background-color: #4CAF50;
	  color: white;
	}
	/*Zusätzliche Variante2*/
	.meinbutton2 {
	  background-color: white; 
	  color: black; 
	  border: 2px solid #008CBA;
	}
	.meinbutton2:hover {
	  background-color: #008CBA;
	  color: white;
	}
	/*Zusätzliche Variante3*/
	.meinbutton3 {
	  background-color: white; 
	  color: black; 
	  border: 2px solid #c51a4a;
	}

	.meinbutton3:hover {
	  background-color: #c51a4a;
	  color: white;
	}
	/*Zusätzliche Variante4*/
	.meinbutton4 {
	  background-color: white; 
	  color: black; 
	  border: 5px solid  teal;
	}
	.meinbutton4:hover{
	  background-color: teal;
	  color: white;
	}
	
	.meinbutton5 {
	  background-color: white; 
	  color: black; 
	  border: 10px solid  teal;
	}

	.meinbutton5:hover{
	  background-color: teal;
	  color: white;
	}

/*================================================ 
	MENÜSTEUERUNG
==================================================*/ 
	 ul.cssmenu {
		 position: relative;
		 display: block;
		 margin: 0px; padding:  0px;
		}
		ul.cssmenu ul 	{
			position:  relative;
			display:  none;
			}
		ul.cssmenu li {
			position:  relative;
			display:  inline;
			float:  left;
			}
			/* Menupunkt stylen */
			ul.cssmenu li a {
				font-family:  arial, sans-serif;
				font-size:  12px;
				line-height:  20px;
				text-decoration:  none;
				text-align:  left;
				padding-left:  20px;
				display:  block;
				width:  130px;
				height:  20px;
				background-color:  #339999;  
				}
			ul.cssmenu li: hover > a {
				background-color:  #666666;
				color:  #ffffff;
				}
			/* Untermenüpunkt einblenden */
			ul.cssmenu li: hover > ul {
				position:  absolute;
				top:  20px;
				left:  -5px;
				display:  inline;
				}
				/* ab zweite Ebene */
				ul.cssmenu li li: hover > ul {
					top:  0px;
					left:  110px;
					}
				ul.cssmenu li li a {
					width:  160px;
					}
		/* Farben der einzelnen Ebenen (werden vererbt)*/
		ul.cssmenu a {
			color:  #000000;
			background-color:  #ffffff;
			}
		ul.cssmenu ul a {
			background-color:  #d4d4d4;
			}
		ul.cssmenu ul ul a{
			background-color:  #c4c4c4;
			}
		ul.cssmenu ul ul ul a{
			background-color:  #b4b4b4;
			}
