/*  =========================================================
Stylesheet fuer "gestaltvoll.de", Kassel 
Datei:  gestaltvoll_screen.css
Media:  screen 
Datum:  22. November 2007
Autor:  Nina Eisenlohr, gestaltvoll.de 
Aufbau  1. Kalibrierung und allgemeine Styles 
        2. Styles fuer Layoutbereiche    
        3. Sonstige Styles 
========================================================== */

/* ====================================== 
   1. Kalibrierung und allgemeine Styles 
   ====================================== */

/* Kalibrierung der wichtigsten Abstaende */
*  { padding: 0; margin: 0;}
h2, p, ul, ol { margin-bottom: 1em; }  
ul ul { margin-bottom: 0; } 
li { margin-left: 1em; } 

/* Allgemeine Selektoren */

html { height: 101%; } /* erzwingt Scrollbar im Firefox */
body { 
   	color: #000000; 
   	background-color: #c0c0c0;
   	font-size: 14px;
  	font-family: Arial, Geneva, Helvetica, sans-serif;
  	line-height: 1.5em;
	}
h1 { font-size: 150%; } 
h2 { font-size: 130%; }
h3 { font-size: 110%; }

p {
	font-size: 9.5pt; 
  	font-weight: lighter;
  	color: #575757;
  	}

address {
   	text-align: center;  
   	font-size: 80%;      
   	font-style: normal;  
   	letter-spacing: 2px; 
   	line-height: 1.5em;  
}
/* Hyperlinks */
a { text-decoration: none; outline: none;} 
a:link { color: #666600; outline: none; } 
a:visited { color: #666666;  outline: none;}
a:hover, a:focus { color: #d8d8d8; outline: none; }
a:active { color: #d8d8d8; outline: none; }
.active { color: #d8d8d8; outline: none; }


/* Allgemeine Klassen und IDs */
.skiplink { 
   	position: absolute; 
   	left: -3000px; 
   	top: -2000px; 
   	width: 0px; 
   	height: 0px; 
   	overflow: hidden; 
   	display: inline; } 
   	
.green { color: #666600} 	
span {color: #575757;
	font-size: 10pt;
	line-height: 130%;}

.portrait img { 
	width: 11em;
	margin-left: 8em;
	}
	
.musik {
	margin-top: 1.5em;
	border-top: #666666 1px solid;
	padding-top: 1em;	
	}	
	.musik img { 
		float: left;
		width: 7.5em;
		margin-right: 1em;
		margin-top: 0.5em; }
		
	.icons img { 
		float: left;
		width: 2.5em;
		height: auto;
		padding: 0.2em;
		margin-right: 1em;
		margin-top: 1em;
		}
		
	.zip  { 
		margin-top: 1.5em;
		border-top: #666666 1px solid;
		padding-top: 1em;
		}	
		
	.zip img {
		float: left;
		width: 2.5em;
		height: auto;
		padding: 0.2em;
		margin-right: 1em;
		}
	
	.bspfenster { 
		clear: both;
		overflow: hidden;
		background-color: white;
		width: 100%;
		height: 40em;
		margin-left: -2px;
		margin-top: 2.5em;
		margin-bottom: 1em;
		}
	
	.gross { 
		background-color: white;
		width: 100%;
		overflow: hidden;
		}
		
	.gross img { 
		width: 29.5em;
		height: 24em;
		padding: 0.2em;
		border: #575757 1px solid;
		margin-bottom: 0.3em; }	
		
	.comment  {
		font-size: 9.5pt; 
  		font-weight: lighter;
  		color: #575757;
  		letter-spacing: 0.5em;
  		margin-bottom: 0.5em;
  		}	
  			
	.festgesetzt { position: fixed; }
		
	
.rechts {
	float: left;
	text-align: right;
	width: 6em;
	margin-right: 1em;
	}
.kleiner { font-size: 70%;
	letter-spacing: 1px; }
	
/* ==================================== 
   2. Styles fuer die  Layoutbereiche 
   ==================================== */

#wrapper { 
	color: black; 
   	background-color: white;
   	width: 60em; /* Breite des Inhaltsbereiches */ 
    min-height: 65em;
    padding-bottom: 5em;
    margin: 0 auto; }
   	  	   
#logo {
	color: #000000;
   	background-color: white; }
   	
   	#logo img{
   		width: 100%;
   		height:auto;
   		}
   
#titel { 
	background-color: white; 
	text-align: center;
	margin-bottom: 1.5em;
	}
	
	#titel img {
		width: 100%;
		height: auto;
		}

#navi { 
	float: left;
	width: 12em;
	margin-left: 3em;
	text-align: right;
	color: #666600;
	letter-spacing: 2px;
	font-size: 95%;
	font-variant: small-caps; 
	line-height: 130%;
	} 
	
	#navi li {
		list-style-type: none;
		display: block;
		border: #cccccc 1px dashed;
		padding-top: 0.2em;
		padding-right: 0.5em;
		margin-bottom: 0.7em;
		}
	/*#navi li.start {color: white; border: white 1px dashed;}*/
	
	
	
		
#text { 
   	text-align: left;
   	width: 32em; 
   	margin-left: 20em;
  	} 
  	
#text_breit { 
   	text-align: left;
   	width: 32em; 
   	margin-left: 20em;
  	} 
  		
#counter { 
	float: left;
	background-color: #7a7a7a; 
	text-align: right; 
	width: 10.3em; 
	padding-top: 0.4em; 
	padding-bottom: 0.2em;
	padding-right: 0.5em; 
	margin-left: 3em; 
	margin-bottom: 0.7em; 
	border: 1px dashed #a3a3a3; 
	border-top: 0; } 
  		
#fuss {
	clear: both;
   	position: relative;
	background-color: #7a7a7a;
	width: 60em;
	height: 2em;
	margin: 0 auto;
	}

/* ==================================== 
   3. Sonstige Styles 
   ==================================== */

/* Das Kontaktformular */
form {
   	background-color: #fff;
   	width: 90%; /* Breite des Formulars */ 
   	padding: 1.5em; 
   	margin-top: 1.5em;
   	margin-bottom: 0.7em;
   	border: 1px dashed #D8D8D8;
   	 }
   	
/* Beschriftung auf eigener Zeile */
label { 
   	color: #575757;
   	display: block; 
   	cursor: pointer;
   	letter-spacing: 1px;
   	font-size: 9.5pt;
   	font-variant: small-caps; } 
   	
input#vorname,
input#name,
input#email,
input#betreff{ 
	border: 1px solid #D8D8D8;
   	margin-bottom: 1em;
   	padding: 0.2em;
   	width: 95%;
   	height: 1.5em;
   	font-family: Courier, monospace;
   	font-size: 8.5pt;
   	}
   	
textarea { 
   	width: 95%;
   	height: 6em; 
   	font-family: Courier, monospace;
   	font-size: 8.5pt;
   	line-height: 120%;
   	padding: 0.2em;
   	}
   	
textarea#nachricht:focus { 
   	background-color: #D8D8D8; 
   	color: black; }
   	
input#vorname:focus,
input#name:focus,
input#email:focus,
input#betreff:focus {
   	background-color: #D8D8D8; 
   	color: black;}

/* ======================================= 
   E N D E   D E S   S T Y L E S H E E T S 
   ======================================= */