/*basic colors*/
@rose: #E4C2DD;
@light-rose: #F0D8EA;
@gray: #808080;

/*	Resets	*/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, 
p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, 
img, ins, q, samp, small, strong, sub, sup, var, b, i, hr, 
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figure, figcaption, hgroup, 
menu, footer, header, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
}

article, aside, canvas, figure, figure img, figcaption, hgroup,
footer, header, nav, section, audio, video {
	display: block;
}



a img {border: 0;}



/*	Typography presets
	------------------	*/
@font-face {
    font-family: 'corbertregular';
    src: url('font/corbert-regular-webfont.eot');
    src: url('font/corbert-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/corbert-regular-webfont.woff') format('woff'),
         url('font/corbert-regular-webfont.ttf') format('truetype'),
         url('font/corbert-regular-webfont.svg#corbertregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
html{
	height:100%;
}
body {
	font:normal normal normal 9pt/12pt 'corbertregular', Arial, Helvetica, sans-serif;
	color:@gray;
	height:100%;
	 -moz-text-size-adjust:none;
	 -webkit-text-size-adjust:none;
	-ms-text-size-adjust:none;
	text-size-adjust:none;
}	

.huge, h1 {
	font-size: 11pt;
	line-height: 16pt;
}

.large, h2 {
	font-size: 9pt;
	line-height: 12pt;
	font-weight:bold;
}



.small, small {
	font-size: 7pt;
	line-height: 10pt;
}

/* Selection colours (easy to forget) */

::selection 	 	{background: rgb(240,217,235);}
::-moz-selection 	{background: rgb(240,217,235);}
img::selection 		{background: transparent;}
img::-moz-selection	{background: transparent;}
body {-webkit-tap-highlight-color: rgb(240,217,235);}

body{
	position:relative;
	top:0;
	left:0;
	background:white;
	overflow-y:scroll;
	
	#termin{
		position:relative;
		top:0;
		height: 28px;
		background-color:#e5c2dd;
		padding-top:12px;
		text-align:center;
		
		p{
			font-size:16px;
			color: #000;
		}
		
		a{
			color: #602d50;
		}
		
	}
	
	#bg{
		position:relative;
		top:0;
		left:0;
		width:100%;
		margin:auto;
		min-height:400px;		
		z-index:1;
		
		&.start{
			background:url(img/skindeep_startseite.jpg) top center no-repeat;
		}
		&.kosmetische-behandlung{
			background:url(img/skindeep_kosmetische_behandlung.jpg) top center no-repeat;
		}
		&.permanent-make-up{
			background:url(img/skindeep_permanent_makeup.jpg) top center no-repeat;
		}
		&.hand-und-fusspflege{
			background:url(img/skindeep_nagel.jpg) top center no-repeat;
		}
		&.kontakt{
			background:url(img/skindeep_kontakt.jpg) top center no-repeat;
		}
		>#nav-bg{
			position:relative;
			top:370px;
			left:0;
			height:30px;
			width:auto;
			min-width:950px;
			background:url(img/nav-bg.png) repeat;
			
			
		}		
	}
	#tile{
		position:absolute;
		top:40px;
		left:50%;
		width:100%;
		margin:0 0 0 -50%;
		min-height:564px;
		z-index:2;
		background:url(img/tile.png) top center no-repeat;
	}
	
}

#content-wrap{
	position:relative;
	top:0;
	left:0;	
	width:950px;
	margin:auto;
	z-index:3;
	
	#main-nav ul{
		position:relative;
		top:-23px;
		left:0;
		
		>li{
			float:left;
			width:auto;
			margin:0 6px 0 6px;
			list-style:none;
			
			&:first-child{
				margin-left:10px;
			}
			&.space{
				background:url(img/space.png) 0 4px no-repeat;
				width:9px;
				height:16px;
			}
			>a{
				text-transform:uppercase;
				color:@gray;
				letter-spacing:1pt;
				text-decoration:none;
				
				&:hover, &.selected{
					border-bottom: 1px solid @rose;
				}
			}
		}
	}
	#content{
		width:785px;
		color:@gray;
		clear:both;
		margin:0 0 130px 0;
		display:block;
		position:relative;
		top:15px;
		left:10px;
		min-height:400px;
		
		>h1{
			text-transform:uppercase;
			margin:30px 0 15px 0;
			font-weight:bold;
			font-size:12pt;
		}
		>p, >table{
			font-size:11pt;
			line-height:17pt;
			text-align:justify;
			
			>a{
				color:@gray;
				text-decoration:none;
				
				&:hover{
					border-bottom:1px solid @rose;
					text-decoration:none;
				}
			}
		}
		>table{
			text-align:left;
			width:460px;
		}
	}
	
}
#foot{
	background:url(img/foot.jpg) bottom center no-repeat;
	width:447px;
	height:140px;
	text-align:center;
	position:absolute;
	right:-20px;
	top:auto;
	
	a{
		color:@gray;
		text-decoration:none;
		
		&:hover{
			border-bottom:1px solid @rose;
			text-decoration:none;
		}
	}
}