/*
/////////////////////////////////

Name des Dokumentes: "screen.css"

Erstellt von: "Nico Gutmann"
Erstellt für: "Beauty Atelier Blankenese"

Erstellungsdatum: "19.05.2009"
Letzte Änderung: "20.05.2009"

Hauptfarben:

#FFFFFF = Weiß
#555555 = Grauwert
#000000 = Schwarz
#710440 = Dunkelrosa des Hintergrundes unten
#920e7c = Dunkellila für BG der Links
#bd1f71 = Lila für die Überschrift (h3)
#fff3ba = Beige

/////////////////////////////////
*/



/* Setzt alle vordefinierten Einstellungen des Browsers auf 0
-------------------------*/
* {
margin:				0;
padding:			0;
border:				0;
list-style:			none
}


/* /////////////////////////////// Allgemeine Informationen /////////////////////////////// */

html {
background:			#710440 url(imgs/bg.png) 0 0 repeat-x;
color:				#444;
min-height:			100%
}

body {
font:				1em/120% Arial,Helvetica,sans-serif;
text-align:			center /* Horizontale Zentrierung der Seite für den <IE6 */
}


/* /////////////////////////////// Wrapper & Kopf /////////////////////////////// */


/* Umhüllendes Div
-------------------------*/
div#wrapper {
	width: 873px;
	margin:0 auto;
	text-align: left;
	position: relative;
	background: url(imgs/bg-content-blumen.png) 0 157px no-repeat
}


/* Das Logo
-------------------------*/
h1 {
	width: 240x;
	height: 100px;
	margin-left: 34px
}
	
	h1 a {
		text-decoration: none
	}
		
	h1 strong,
	#topnavi #jump {
		display: none
	}
	
/* Die Öffnungszeiten
-------------------------*/

#zeiten {
	position: absolute;
	width: 300px;
	top: 15px;
	right: 65px;
	font-size: .7em;
	color: #FFF;
	text-align: right;
	line-height: 110%
}

	#zeiten label {
		display: block;
		font-size: 1.1em;
		color: #fa88c0;
		margin-bottom: 10px;
		text-transform: uppercase
	}
	
	#zeiten span {
		display: block;
		padding-top: 7px
	}
		

/* Link zum Impressum
-------------------------*/
ul#topnavi {
	background: url(imgs/anfang-content.png) left bottom no-repeat;
	height: 55px;
	clear: both /* Korrektur für den IE 6 */	
}

	#topnavi li#impr {
		float: right;
		padding:0 65px 0 0;
		display: inline
	}
	
		li#impr a {
			color: #FFF;
			background: #920e7c;
			padding: 2px 5px;
			font-size: .7em;
			text-decoration:none
		}
		
		li#impr a:hover {
			color: #920e7c;
			background: #FFF
		}

			
/* /////////////////////////////// Inhalt /////////////////////////////// */


div#inhalt {
	background: url(imgs/bg-content.png) 4px 0 repeat-y;
	font-size: .8em
	}
	

/* Content
-------------------------*/
div#text {
	width: 802px;
	margin: 0 0 0 34px;
	padding: 20px 0 30px;
	background: white url(imgs/bg-content-unt.png) left bottom repeat-x;
	overflow: auto
	}
	
	/* Textbereiche
	-------------------------*/
	div#inhalt .textbox {
		padding: 0 40px
	}
	
	/* Hauptüberschrift der Seite
	-------------------------*/
	div#inhalt h2 {
		color: white;
		background: url(imgs/titel.png) left center no-repeat;
		width: 180px;
		line-height: 54px;
		text-transform: uppercase;
		font-size: 1.1em;
		font-weight: bold;
		padding-left: 20px;
		margin:0 0 15px 40px
	}
	
	/* Überschriften der Absätze
	-------------------------*/
	div#inhalt h3 {
		color: #bd1f71;
		background: url(imgs/bg-h3.png) left center no-repeat;
		text-transform: uppercase;
		font-size: 1.2em;
		font-weight: bold;
		padding-left: 16px;
		margin: 35px 0 20px;
	}
	
	
	/* Kleine Überschriften im Content
	-------------------------*/
	div#inhalt h4 {
		width:300px;
		color: #333;
		border-bottom: 1px solid #e8d998;
		font-size: 1em;
		margin: 20px 0 7px
	}
	
		/* Inhaberin auf der Startseite
		-------------------------*/
		.inhaber {
			margin-left:20px;
			color: #222
		}
		.inhaber dt {
			color: #710440;
			margin:15px 0 6px;
			font-weight: bold
		}
		.inhaber span {
			color: #710440;
		}
		
		/* Die Kontaktadresse
		-------------------------*/
		div.textbox li,dd {
			background: url(imgs/list-style.png) left center no-repeat;
			padding-left: 8px;
			margin-left: 5px
		}
	
		/* Paragrafen im Content
		-------------------------*/
		div.textbox p {
			padding-top: 10px
		}
		
		/* Verlinkung im Content
		-------------------------*/
		div.textbox a {
			color: #000;
			text-decoration: underline
		}
		
		div.textbox a:hover {
			color: #FFF !important;
			text-decoration: none;
			background: #920e7c
		}
		
		div.textbox a:visited {
			color: #444
		}
		
		/* 2-spaltiger Inhalt
		-------------------------*/
		.links {
			float:left;
			width:40%
		}
		.rechts {
			float:right;
			width:40%
		}
		
		
		/* Formular Beginn
		-------------------------*/
		form {
			width: 293px;
			text-align: right;
			background: #fff3ba url(imgs/bg-form-top.png) 0 0 no-repeat
		}
			
			form label,
			p#legende {
				font-size:.85em;
				color: #666
			}
			
			/* Formularfelder
			-------------------------*/
			form input,
			form textarea {
				width: 190px;
				padding: 3px 5px;
				font: .9em Arial,sans-serif;
				color: #444;
				background: #fff7d2 url(imgs/bg-formfeld.png) right top no-repeat;
				border: 1px solid #f4a6a6
			}
			
			input:focus {
				background: white
			}
			
			/* Sendebutton
			-------------------------*/
			input#Senden {
				background: #bc2974 !important;
				color: white !important;
				width: 90px !important
			}
			
			#sendebutton label {
				display: none
			}
			
			form p {
				padding: 5px 20px
			}
			
			form #namenfeld,
			form #mailfeld,
			form p#nachrichtenfeld {
				background: url(imgs/form-trenner.gif) left top repeat-x
			}
			
			form em {
				color: #ec74a2;
				font-style: normal;
				font-size: 1.2em
			}
			
			#nachrichtenfeld {
				position: relative
			}
			
				form textarea {
					background: white url(imgs/bg-formarea.png) right top no-repeat !important;
					font-size:.85em !important
				}
				
				#nachrichtenfeld label {
					position: absolute;
					top: 10px;
					right: 225px
				}
				
			/* Meldungen
			-------------------------*/
			
			#verschickt {
				font-size: .9em;
				color: #468c1c;
				background: url(imgs/okay.gif) left center no-repeat;
				padding: 0 0 0 14px;
				margin: 8px 0 0 20px;
				text-align: left
			}
			
			#ausfuellen {
				font-size: .9em;
				color: #d21111;
				background: url(imgs/fehler.gif) 0 16px no-repeat;
				padding-left: 13px;
				margin: 8px 0 0 20px;
				text-align: left
			}
	

/* /////////////////////////////// Footer /////////////////////////////// */

div#footer {
	height: 85px;
	padding-top: 98px;
	background: url(imgs/ende-content.png) 1px 0 no-repeat
	}
	
#footer ul {
	width: 100%;
	height: 85px;
	font-size: .7em;
	line-height: 25px;
	background: url(imgs/bg-footer.png) center top no-repeat
	}
	
	/* Links unten
		-------------------------*/
	#footer ul li {
		display: inline
	}
	
	#footer li#oben {
		padding: 0 20px 0 180px
	}
	
	#footer li#drucken {
	}
	
	#footer li#addr {
		color: #f4a9a7;
		padding-left: 130px;
	}
	
		#footer li a {
			color: #FFF;
			text-decoration: underline;
		}
		
		#footer li a:hover {
			color: #f4a9a7
		}
		
		#oben a {
			padding-left: 13px;
			background: url(imgs/icon-oben.png) left center no-repeat
		}
		#drucken a {
			padding-left: 13px;
			background: url(imgs/icon-drucken.png) left center no-repeat
		}