@charset "utf-8";

/*---------------------------------------------------------------------------------------
--------------------------------------AUTHOR: DUY TRAN-----------------------------------
---------------------------------------------------------------------------------------*/


/*---------------------------------------------------------------------------------------
--------------------------------------IMPORT CSS-----------------------------------------
---------------------------------------------------------------------------------------*/

	@import url("lightbox.css");
	@import url("cms.css");

/*---------------------------------------------------------------------------------------
--------------------------------------STANDARDS------------------------------------------
---------------------------------------------------------------------------------------*/

html, body, p, h1, h2, h3, h4, h5, h6, ul, ol, span, a, table, td, form, img, li, form, object, textarea {
	margin: 0;
	padding: 0;
	font-family: Georgia, "Times New Roman", Times, serif;
	text-decoration: none;
	list-style-type: none;
	color: #444;
	font-size:15px;
}

body {
	background: #FFF url(../images/layout/bg.jpg) repeat top center;
}

html[xmlns^="http"] {
	overflow-y: scroll;
}

h1{
	font-size: 28px;
	color: #2e2d2d;
	font-weight:lighter;
	font-family: Georgia, "Times New Roman", Times, serif;
	padding: 0 0 0 0;
}

h2 {
	font-size: 18px;
	color: #8c2524;
	font-weight: lighter;
	font-family: Georgia, "Times New Roman", Times, serif;
	padding: 0 0 5px 0;
	margin: 0 0 0 45px;
	width:480px;
}

h3 {
	font-size: 12px;
	color: #444;
	font-weight:bold;
	font-family: Georgia, "Times New Roman", Times, serif;
	padding: 0 0 10px 0;
}

h4 {
	font-size: 11px;
	color: #444;
	font-weight:bold;
	font-family: Georgia, "Times New Roman", Times, serif;
	padding: 0 0 10px 45px;
}

strong { font-weight: bold; font-size: 12px;}

img { border: none;}
.clear {clear: both;}
.unsichtbar  {display: none;}

.red-font { color: #8c2524; font-size: 17px;}

/*---------------------------------------------------------------------------------------
--------------------------------------LAYOUT---------------------------------------------
---------------------------------------------------------------------------------------*/



#wrapper {
	width: 955px;
	position:relative;
	margin: 0 auto;
}

#logowrap {
	width: 245px;
	height: 396px;
	background: url(../images/layout/logowrap.jpg);
	float: left;
}

h1#h1-logo {
	width: 185px;
	height: 158px;
	padding: 36px 0 0 60px;
}

#logo {
	width: 136px;
	height: 150px;
	text-indent: -9999px;
	display: block;
}

#logo:hover { background: url(../images/layout/logo-hover.jpg);}

#header {
	width: 707px;
	height: 396px;
	float: left;
}

.header { background: url(../images/layout/header.jpg); }
.header-team { background: url(../images/content/header-team.jpg); }
.header-hair-beauty-frisur { background: url(../images/content/header-hair-beauty-frisur.jpg); }
.header-hair-beauty-color { background: url(../images/content/header-hair-beauty-color.jpg); }
.header-hair-beauty-great-lengths { background: url(../images/content/header-hair-beauty-great.jpg); }
.header-hair-beauty-produkte { background: url(../images/content/header-hair-beauty-produkte.jpg); }
.header-hair-beauty-dekorative-kosmetik { background: url(../images/content/header-hair-beauty-kosmetik.jpg); }
.header-hair-beauty-ohrlochstechen { background: url(../images/content/header-hair-beauty-ohrlochs.jpg); }
.header-hair-beauty-ghd-styler { background: url(../images/content/header-hair-beauty-ghd-styl.jpg); }
.header-preise { background: url(../images/content/header-preise.jpg); }
.header-frisuren { background: url(../images/content/header-frisuren.jpg); }
.header-aktionen { background: url(../images/content/header-aktionen.jpg); }
.header-tipps { background: url(../images/content/header-tipps.jpg); }
.header-tipps { background: url(../images/content/header-tipps.jpg); }
.header-anfahrt { background: url(../images/content/header-anfahrt.jpg); }
.header-kontakt { background: url(../images/content/header-kontakt.jpg); }
.header-impressum { background: url(../images/content/header-impressum.jpg); }



#left {
	width: 245px;
	height: 300px;
	background: url(../images/layout/left.jpg) no-repeat;
	float: left;
}

#eingang {
	width: 285px;
	height: 539px;
	background: url(../images/layout/eingang.png) ;
	position: absolute;
	margin-top: -411px;
	margin-left: -270px;
	*margin-left: -950px;
}


*html #eingang {
	margin-left: -143px;
	position:relative;
	float:left;
	background: url(../images/layout/eingang.gif) no-repeat;
	width: 285px;
	height: 539px;
}



#content {
	width: 955px;
	min-height: 560px;
	overflow: hidden;
	float: left;
	line-height: 20px;
	background: url(../images/layout/content.jpg) repeat;
	padding: 0 0 80px 0;
}

#contenttext {	width: 480px; float: left;}
#contenttext-gross { width: 660px; float: left; padding: 0 50px 0 0;}

#contenttext p, #contenttext-gross p { margin: 0 0 20px 45px;}

#contentbilder {
	width: 195px;
	float: left;
	padding: 0 0 0 35px;
}



#footer {
	width: 680px;
	height: 125px;
	background: url(../images/layout/footer.jpg);
	margin: 0 auto;
	padding: 0 0px 0 275px;
	position: relative;
	z-index: 1;
}

#schwarzenbek {
	width: 207px;
	height: 93px;
	float: left;
	padding: 32px 0 0 18px;
}

#schwarzenbek h3, #buechen h3,  #open h3 { color: #d0c8a8;}
#schwarzenbek p, #buechen p, #open p { color: #d0c8a8;font-size: 11px; line-height: 17px;}

#schwarzenbek h3:hover, 
#buechen h3:hover,  
#open h3:hover, 
#schwarzenbek p:hover, 
#buechen p:hover,  
#open p:hover {color: #fff;}

#buechen {
	width: 182px;
	height: 93px;
	float: left;
	padding: 32px 0 0 43px;
}


#open { 
	width: 173px;
	height: 93px;
	float: left;
	padding: 32px 0 0 57px;
}

#schwarzenbek:hover { background: url(../images/layout/schwarzenzbek-hover.jpg);}
#buechen:hover { background: url(../images/layout/buechen-hover.jpg);}
#open:hover { background: url(../images/layout/open-hover.jpg);}

#footwrap {
	width: 100%;
	height: 125px;
	background: url(../images/layout/footwrap.jpg);
	position: relative;
}

/*---------------------------------------------------------------------------------------
--------------------------------------NAVI-----------------------------------------------
---------------------------------------------------------------------------------------*/

#navi { 
	width: 211px;
	height: 202px;
	padding: 0 0 0 34px;
	background: url(../images/layout/navi/navi.jpg);
}

#navi li  { text-indent: -9999px;}

#navi li a { display: block;}

#n1 { width: 180px; height: 34px;}
#n2 { width: 180px; height: 31px;}
#n3 { width: 180px; height: 30px;}
#n4 { width: 211px; height: 33px;}
#n5 { width: 180px; height: 31px;}
#n6 { width: 180px; height: 31px;}

#n1:hover { background: url(../images/layout/navi/n1-hover.jpg);}
#n2:hover { background: url(../images/layout/navi/n2-hover.jpg);}
#n3:hover { background: url(../images/layout/navi/n3-hover.jpg);} 
#n4:hover { background: url(../images/layout/navi/n4-hover.jpg);} 
#n5:hover { background: url(../images/layout/navi/n5-hover.jpg);} 
#n6:hover { background: url(../images/layout/navi/n6-hover.jpg);} 


#navi-hair-beauty {
	width: 205px;
	height: 215px;
	padding: 12px 0 0 40px;
}


#navi-hair-beauty  li a {
	text-decoration: none; 
	background: #f5f1eb; 
	padding: 2px;
	line-height: 25px;
}

#navi-hair-beauty  li a:hover {
	background: #8c2524; 
	color: #f5f1eb;
}
	
	

/*---------------------------------------------------------------------------------------
--------------------------------------SUBNAVI--------------------------------------------
---------------------------------------------------------------------------------------*/

#subnaviwrap {
	position: relative;
	width: 285px;
	height: 539px;
}

#subnavi {
	position: absolute;
	background: url(../images/layout/navi/subnavi.jpg);
	top: 420px; left: 119px;
	width: 89px;
	height: 89px;
}

#subnavi li  { color: #4a3420; text-indent: -9999px;}

#subnavi li a { display: block;}


#s1 { width: 89px; height: 21px;}
#s2 { width: 89px; height: 22px;}
#s3 { width: 89px; height: 23px;}
#s4	{ width: 89px; height: 23px;}

#s1:hover { background:url(../images/layout/navi/s1-hover.jpg);}
#s2:hover { background:url(../images/layout/navi/s2-hover.jpg);}
#s3:hover { background:url(../images/layout/navi/s3-hover.jpg);}
#s4:hover { background:url(../images/layout/navi/s4-hover.jpg);}

/*---------------------------------------------------------------------------------------
--------------------------------------CONTENT--------------------------------------------
---------------------------------------------------------------------------------------*/
#headline {
	width: 710px;
	height: 166px;
	float: left;
}

#headline h1 {
	width: 710px;
	height: 166px;
	text-indent: -9999px;
}

h1#home { background: url(../images/content/h1-home.jpg) no-repeat;}
h1#kontakt { background: url(../images/content/h1-kontakt.jpg) no-repeat;}
h1#anfahrt { background: url(../images/content/h1-anfahrt.jpg) no-repeat;}
h1#impressum { background: url(../images/content/h1-impressum.jpg) no-repeat;}
h1#team { background: url(../images/content/h1-team.jpg) no-repeat;}
h1#hair-beauty { background: url(../images/content/h1-hair-beauty.jpg) no-repeat;}
h1#hair-beauty-frisur { background: url(../images/content/h1-hair-beauty-frisur.jpg) no-repeat;}
h1#hair-beauty-color { background: url(../images/content/h1-hair-beauty-color.jpg) no-repeat;}
h1#hair-beauty-produkte { background: url(../images/content/h1-hair-beauty-produkte.jpg) no-repeat;}
h1#hair-beauty-great-lengths { background: url(../images/content/h1-hair-beauty-great.jpg) no-repeat;}
h1#hair-beauty-dekorative-kosmetik { background: url(../images/content/h1-hair-beauty-kosmetik.jpg) no-repeat;}
h1#hair-beauty-ohrlochstechen { background: url(../images/content/h1-hair-beauty-ohrlochs.jpg) no-repeat;}
h1#hair-beauty-ghd-styler { background: url(../images/content/h1-hair-beauty-ghd-styl.jpg) no-repeat;}
h1#preise { background: url(../images/content/h1-preise.jpg) no-repeat;}
h1#frisuren { background: url(../images/content/h1-frisuren.jpg) no-repeat;}
h1#aktionen { background: url(../images/content/h1-aktionen.jpg) no-repeat;}
h1#tipps { background: url(../images/content/h1-tipps.jpg) no-repeat;}
h1#impressum { background: url(../images/content/h1-impressum.jpg) no-repeat;}


.pic {
	width: 145px; 
	height: 135px; 
	background: url(../images/content/thumb.jpg) no-repeat;
	padding: 7px 4px 0 6px;
	font-size: 11px;
	margin-bottom: 20px;
	color: #444;
}

.pic:hover {
	background:url(../images/content/thumb-hover.jpg) no-repeat;
	color: #8c2524;
}

#contentbilder img { margin-bottom: 6px;}


.pfeil {font-size: 21px; background: url(../images/content/pfeil.jpg) no-repeat right; padding: 0px 30px 0 0px;}
.pfeil a { font-size: 21px;}	
	
.logos { border: 3px solid #fff;}	


.nachoben { 
	background: url(../images/layout/nachoben.jpg) no-repeat; 
	font-size: 10px; 
	padding: 10px 0 0 17px;
	position: absolute;
	top: -35px;
	right: 200px;
	_right: 70px;
	text-decoration: none;
	height: 24px;
	color: #444;
}

ul.liste { margin-bottom: 15px;}

ul.liste li { 
	background: url(../images/content/li-punkt.jpg) no-repeat;
	margin: 0 0 0 45px;
	line-height: 18px;
	padding: 2px 0 5px 25px;
}



.preisueberschrift { padding: 20px 0 10px 0;}

ul.preisliste li {  
	border-top: 1px solid #9c3130;
	padding: 2px;
	margin: 0 0 2px 43px;
	_margin: 0 0 2px 22px; /*IE6*/
	width: 500px;
	float: left;
}

ul.preisliste>li:first-child{
	border-top:none !important;
}

ul.preisliste li strong {
	font-weight: lighter;
	width: 400px;
	display: block;	
	float: left;
}

.preisliste li:hover {
	background: #e5dda4;
	color: #9c3130;
}

.bildborder {
	border: 1px solid #666;
	padding: 1px;
	background:#FFF url(../images/progress.gif) no-repeat center center;
	margin: 4px 8px 4px 0;
	cursor: url(../images/zoomin.cur), pointer;
    outline: none;
}

.bildborder:hover{
	border: 1px solid #8c2524;
	padding: 1px;
}

.bildbordernohover {
	border: 2px solid #fff;
	padding: 1px;
	background:#FFF url(../images/progress.gif) no-repeat center center;
	margin: 4px 4px 0 0;
}


/*ANFAHRT*/

#anfahrtsskizze { float: left; width: 300px; }
#routenplaner { float: left; width: 320px; padding: 0 0 0 20px;}
#routenplaner iframe { margin: 0 0 0 45px;}

/*IMPRESSUM*/

#adressdaten { float: left; width: 315px;}
#geschaeftsdaten { float: left; width: 300px;}
#datenschutzhinweis p { font-size: 11px; line-height: 16px;}

#euroweb{
margin-left: 43px;
filter:alpha(opacity=60); 
-moz-opacity:0.6;
}

/*CMS*/

.pic-cms { 
	width: 145px; 
	height: 120px; 
	background: url(../images/content/thumb.jpg) no-repeat;
	padding: 7px 4px 0 6px;
	font-size: 11px;
	margin: 0 0 20px 43px;
	_margin-left: 22px; /*für den IE6*/
	color: #444;
	float: left;
}

.pic-cms:hover {
	background:url(../images/content/thumb-hover.jpg) no-repeat;
	color: #8c2524;
}


.pic-cms2 { 
	width: 145px; 
	height: 120px; 
	padding: 7px 4px 0 6px;
	font-size: 11px;
	margin: 0 13px 0 7px;
	color: #444;
	float: left;
}

.pic-cms2:hover {
	
	color: #8c2524;
}

.h2-cms { padding: 0 0 20px 0; width:480px;}
.text-cms { width: 480px; min-height: 127px;float: left;}
.bilderkasten-cms { width: 140px;  float: left; padding: 0 0 0 35px;}
.pdf-cms { width: 300px; height: 20px; float: left;}
.link-cms { width: 337px; height: 20px;  float: left;}
.link-cms p { margin: 0 0 0 15px 0!important; padding: 0;}

/*---------------------------------------------------------------------------------------
--------------------------------------LINKS----------------------------------------------
---------------------------------------------------------------------------------------*/


a, .escape span{
	text-decoration: underline;
	color: #8c2524;
	outline: none;
}

a:hover, a:hover span{
	text-decoration:none;
	color:#8c2524;
}

.nachoben:hover { color: #8c2524;}


a[href$=".pdf"] {
	 padding: 4px 0 4px 55px;
	 background: url(../images/pdf.gif) no-repeat 0 50%;
	 line-height: 30px;
	 border-bottom: none;
	 display:block;
}

.float-right{
	float: right;
}

.float-left{
	float: left;
	padding-right:10px;
}