/* Standard-CSS für www.projektname.de */

/* Wichtige Farben
Name Farbe 1 		= #
Name Farbe 2		= #
*/

/* Hier werden alle html-Tags auf "Null" gesetzt und eine Standard-Schriftart vergeben */
* {
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	/* border: none bewirkt, dass ein Bild welches verlinkt ist, keinen blauen Rahmen bekommt */
	border: none;
}
/* Hier allgemein gueltige Formatierungen */
a:link {
	text-decoration: none;
	color: #858585;
}

a:visited {
    text-decoration: none;
	color: #858585;
}
/* Hier wird der Link definiert beim Mausover */
a:hover {
    text-decoration: none;
	color: #5b5b5b;  
}
a:active {
    text-decoration: none;
	color: #5b5b5b;   
}
/* Die Formatierungen in body, html bewirken, dass die Seite in die Mitte des Browsers rutschen, 
sie können während der Bearbeitung inaktiv geschaltet werden, müssen aber wieder aktiviert werden */
body, html {
	width:100%; 
	height:100%;
}

body {
	font-size: 11px;
	background-color: #c9c9c9;
	/* Die min-width und height Formatierungen beziehen sich auch auf das Zentrieren des Wrappers, so werden die Mindestgrößen festgelegt  */
	min-width:960px; 
	min-height:576px; 
	/*position:relative;*/
	line-height: 15px;
	letter-spacing: 0.07em;
}
#impressum {
	height: 15px;
	width: 50px;
	position: absolute;
	top: 5px;
	right: 15px;
	font-size: 11px;
	color: #858585;
	/*Der z-Index bestimmt die Lage, über und unter*/
	z-index: 100;
}

/* Sektionsweite Formatierungen */

#wrapper {
	height: 576px;
	width: 960px;
	background-color: #FFF;
	/*Margin auto legt den Wrapper in der Horizontalen in die Mitte*/
	margin: auto;
	/*position:relative;*/
	/*Hier wird die zentrierte Lage des Wrappers festgelegt*/
	position:absolute;
	top:50%; 
	left:50%; 
	margin-left:-480px; 
	margin-top:-288px; 
	/*In diesem Bereich wird der Schlagschatten festgelegt.*/
	-webkit-box-shadow: 0px 0px 0px #000;
	-moz-box-shadow: 0px 0px 0px #000;
	box-shadow: 0px 0px 6px #000;
}
/*In dem Wrapper Content sollen nur Graphiken erscheinen*/
#wrapper #content {
	left: 30px;
	top: 15px;
	position: absolute;
	height: 486px;
	width: 660px;
}
/*Im Wrapper Colright sollen ergänzende Texte erscheinen*/
#wrapper #colright {
	height: 486px;
	width: 210px;
	float: right;
	background-color: #FFF;
	top: 15px;
	right: 30px;
	position: absolute;
}
/*Hier wird die Überschrift im Colright definiert*/
#wrapper #colright h1 {
	font-size: 12px;
	color: #000;

/*Mit dem Letter Spacing kann man den Zeichenabstand definieren, findet man unter Block.
Habe ich nachträglich in den body geschrieben*/	
	letter-spacing: ;	font-weight: lighter;
}
/*Hier werden die unterschiedlichen Schriftklassen definiert*/
.textgrau {
	color: #aaaaaa;
	letter-spacing: 0.05em;
}

.textschwarz {
	color: #000;
	letter-spacing: 0.05em;
}

/*Hier werden die Abstände von Zeilen geregelt*/
#wrapper #colright p {
	padding-top: 8px;
}
/*Im Footer stehen die Bezeichnungen der Projekte in statischer Form*/
#wrapper #footer {
	height: 15px;
	width: 900px;
	position: absolute;
	top: 516px;
	left: 30px;
	font-size: 12px;
	color: #aaaaaa;
}
/*In diesem Div wird die Navigation geregelt*/
#wrapper #navimain {
	background-color: #FFF;
	height: 15px;
	width: 660px;
	position: absolute;
	left: 30px;
	top: 546px;
	color: #b9b9b9;
}
#wrapper #navimain ul {

}
/*Navigationen müssen immer Listenelemente sein*/
#wrapper #navimain ul li {
	list-style-type: none;
	float: left;
}
/*In diesem Bereich bekommt der Link durch Display: block eine Größe zugewiesen, dieser Größe kann nun ein Hintergrundbild gegeben werden*/
#wrapper #navimain ul li a:link {
	display: block;
	height: 15px;
	width: 9px;
	background-image: url(../naviimg/naviimg.jpg);
}
#wrapper #navimain ul li a:visited {
	display: block;
	height: 15px;
	width: 9px;
	background-image: url(../naviimg/naviimg.jpg);
}
/*Hier wird der Effekt beim Hover beschrieben, ein anderes Hintergrundbild wird eingeblendet*/
#wrapper #navimain ul li a:hover {
	display: block;
	height: 15px;
	width: 9px;
	background-image: url(../naviimg/naviimghover.jpg);
}
#wrapper #navimain ul li a:active {
	display: block;
	height: 15px;
	width: 9px;
	background-image: url(../naviimg/naviimghover.jpg);
}

/*Hier wird zugewiesen, dass die Schrift der Navigation ausgeblendet ist*/
#wrapper #navimain ul li a span {
	display: none;
		
}
/*Hier werden die Beschriftungen von den Navielementen eingeblendet, mit dem negativen Top-Angaben steuert man die Lage der Schrift*/
#wrapper #navimain ul li a:hover span {
	display: inline-block;
	position:absolute;
	width: 300px;
	top: -16px;
	font-size: 12px;
	color: position:absolute;;
	color: #aaaaaa;
	
}	
/*In diesem Div steckt ein Bild mit Verlinkung zur Startseite*/
#wrapper #footerright {
	height: 15px;
	width: 210px;
	position: absolute;
	float: right;
	right: 30px;
	bottom: 15px;
	clear: both;
}