@charset "utf-8";
/* 
Kandidaten-Nr.: 19018808
Vorname, Name: 	Maurice Marzolf
Strasse, Nr.: 	Winkelweg 6
PLZ, Ort:		4105 Biel-Benken

Datum:			02.01.2010

Autor: 		Maurice Marzolf
Projekt: 	Diplomarbeit SIZ - d art lounge
Daten:		screen_dartlounge.css
*/

/* Allgemeine Formatierungen 
============================*/
* { /* Genereller Reset = setzt für alle Elemente die Aussen- wie Innenabstände auf den Wert 0 */
margin:0;
padding:0;
}
html {height: 101%;} /* erzwingt Scrollbar im Firefox */
body {
font:80%/1.4em Verdana, Arial, Helvetica, sans-serif; /*80%=Schriftgrösse derzeit für alle Formatvorlagen, 1.4em=Zeilenhöhe und im Anschluss die Schriften-Familie*/
color:#FFF;
background:#333 url(../images/background/bg_body.gif);
}
h1, h2, h3 {
color:#BFD010;
padding-bottom:8px;
margin:10px 0;
border-bottom: 1px dotted #BFD010;
}
.ueb_make-up {
color: #287c86;
border-bottom: 1px dotted #287c86;
}
h1 {
font-size:1.5em;
border-bottom: none;
}
h2 {
font-size:1.3em;
}
h3 {
font-size:1.1em;
padding: 5px 0px;
margin: 5px 0px;
border-bottom: none;
}
p {
line-height:1.2em;
margin-bottom:1em;
}
ul, ol, dl {
margin:0 0 1em 1em;
}
li {
margin-left:1.5em;
line-height:1.5em;
}
a {
color:#FFF;
text-decoration:none;
outline:none;
border-bottom:1px dotted #FFF;
}
a:hover, 
a:focus {
color:#FC0;
border-bottom:1px dotted #FC0;
}
strong {
	font-weight: bold;
}
/* Allgemeine Klassen und ID's 
================================ */

.versteckt {
	position:absolute;
	top: -2000px;
	left: -3000px;
	width: 0px;
	height: 0px;
	overflow: hidden;
}
.image-right {
	float:right; 
  	padding:3px; 
	border:1px solid #b9b9b9; 
	margin:5px 0 5px 10px;
}
.teaser {
	background: #131001; /* schwarz hell */
	padding:10px 10px 20px 10px;
	margin: 0 0px 30px 0px;
	}
#teaser_1 p {
	margin-right: 25px;
	}
	
/* Styles für Layoutbereiche 
=============================*/

#wrapper {
	width:964px;
	margin: 10px auto;
	border:1px solid #FFF;
	background-color:#333;
	position: relative;
}


/* Layout infonavigation */

#info_navigation {
	overflow: hidden;
	height: 20px;
	border: 1px solid #b9b9b9; 
	background-color:#333;
	margin: 0;
	}
	#info_navigation ul {
		float: right;
		width: auto;
		margin-right: 10px;
		margin-bottom: 0;
	}
	#info_navigation li {
		float: left;
		width: auto;
		list-style-type: none;
		margin: 0;
		padding-right: 8px;
		margin-right: 0;
		}
		#info_navigation a {
		display: block;
		border-bottom: none;
		padding: 0 4px;
		}
		#info_navigation a:hover,
		#info_navigation a:focus,
		#info_navigation a:active,
		#startseite #infonavi01 a,
		#perm_make-up_kontakt #infonavi02 a,
		#lageplan #infonavi03 a,
		#impressum #infonavi04 a {
		color:#BFD010;
		}
		#info_navigation img {
			border:none;
		}
	
	/* Zweite Ebene infonavigation positionieren */
	
	#infonavi_ebene01 li#infonavi02 ul {
		display: none;
		position: absolute;
		right: 160px;
		top:auto;
		width: auto;
		height:auto;
		padding: 2px 0 0 0;
		margin: 0;
		}

	#infonavi_ebene01 li#infonavi02:hover ul {
		display: block;
		left: auto;
		right: auto;
		width: auto;
		}
	#info_navigation #infonavi_ebene02 li {
		clear: both;
			}
/* Ende Info-Navigation */
		
#header {
	height:160px;
	background: #373536 url(../images/background/d-art-lounge-logo_neu.jpg) no-repeat center;
	}
#packer {
	width: 962px;
	margin: 0 auto;
}

/* Layout navigation */

#navigation {
	height:54px;
	color:#333;
	background: #373536 url(../images/background/bg-menu-level4.png) repeat-x;
	border-top:1px solid #FFF;
	border-bottom:1px solid #FFF;
	position: relative;
}
	#navigation ul {
			padding-left: 2px; /* muss auf 2 gesetzt sein für IE und Safari*/
			margin-bottom: 0px;
			border: 0;
	}
	#navigation li{
		display: inline;
		list-style-type: none;
		padding: 0 22px 0 0px; /* 22px padding-left ist Maximum vor Umbruch Navigation !!*/
		margin-right: 22px; /* 23px margin-right ist Maximum vor Umbruch Navigation (IE & Safari Problem!!*/
				}
#navigation a {
	border: none;
	}
#navigation a img {
	border: none;
}
	
#navigation #navi01 a img:hover, 
#navigation #navi01 a img:focus,
#navigation #navi01 a img:active { 
			background: #FC0 url(../images/coiffeur/d-art_navi_coiffeur_ho.png);
			}
#navigation #navi02 a img:hover, 
#navigation #navi02 a img:focus,
#navigation #navi02 a img:active { 
			background: #FC0 url(../images/make-up/d-art_navi_make-up_ho.png);
			}
#navigation #navi03 a img:hover, 
#navigation #navi03 a img:focus,
#navigation #navi03 a img:active { 
			background: #FC0 url(../images/kunst/d-art_navi_kunst_ho.png);
			}
#col_1 {
	float:left;
	width:290px;
	min-height:470px;
	padding:20px;
	padding-left: 8px;
	border-right:1px solid #FFF;
	background:#373536 url(../images/background/bg_coiffeur.gif);
	}
	#col_2 {
	float:left;
	width:290px;
	min-height:470px;
	padding:20px;
	padding-left: 10px;
	border-right:1px solid #FFF;
	background: #373536 url(../images/background/d-art_make-up_schwarz_bg.JPG) ;
	}
	#col_3 {
	
	float:left;
	width:290px;
	min-height:470px;
	padding:20px;
	padding-left: 10px;
	background: #373536 url(../images/background/bg_coiffeur.gif);
	}
	
#col_4 {
	float:left;
	width:142px;
	min-height:680px;
	padding:20px;
	padding-left: 8px;
	border-right:1px solid #FFF;
	background: #373536 url(../images/background/d-art_perm_make-up_bg_schmal.jpg) top;
	}
#col_5 {
	float:left;
	width:592px;
	min-height:680px;
	padding:20px;
	padding-left: 8px;
	border-right:1px solid #FFF;
	background:#373536 url(../images/background/bg_coiffeur.gif);
	}
#col_6 {
	float:left;
	width:142px;
	min-height:680px;
	padding:20px;
	padding-left: 8px;
	background: #373536 url(../images/background/d-art_perm_make-up_bg_schmal.jpg) top;
	}

	#footer {
	clear:both;
	height:40px;
	color:#000;
	font-size:0.8em;
	text-align:center;
	border-top:1px solid #FFF;
	background-color:#BFD010;
	}
	* html #footer { /* CSS Anweisung nur für den IE6, damit sich die ID footer unterhalb von content und sidebox einreiht */
	height:1%;
	}
	#footer span {
	color: #FFF;
	font-size: 1.1em;
	font-weight:bold;
	}
	address {
		font-style:normal;
		line-height:normal;
		text-align:center;
		padding:2px;
		}
		address a {
		color:#333;
		border-bottom:none;
		}
		address a:hover, address a:focus {
			color:#CC0000;
			border-bottom: 1px solid #CC0000;
		}
		
/* Ende CSS */