@font-face {
    font-family: 'tendernessregular';
    src: url('../font/Tenderness-webfont.eot');
    src: url('../font/Tenderness-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/Tenderness-webfont.woff') format('woff'),
         url('../font/Tenderness-webfont.ttf') format('truetype'),
         url('../font/Tenderness-webfont.svg#tendernessregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

::-moz-selection 	{ background-color: #eee; color: black; }
::selection 		{ background-color: #eee; color: black; }

body {
	font: 1em Arial, serif;
	text-align:center;
	color:#2c2c2c;
	margin:0;
	padding:0;
	background: rgb(255,255,255) url(../images/bg_content.png) center top repeat-y;	
}

a {
	color: #000;
	text-decoration: underline;
}

#main {
	max-width:700px;
	min-width:500px;
	margin:0 auto 50px auto;
}
#header, #mainNavi, #content, #footer{
	width:100%;
	text-align: center;
}


#content h1,
#content h2.links,
#content p.links {
	text-align: left
}

#footer {
	text-align: left;
}
#header,
#footer {
	padding:20px 0;
	margin:0 0 50px 0;
	width:100%;
	background-color: rgba(255,255,255,1); 
	
	-moz-border-radius-bottomright:5px;
	-moz-border-radius-bottomleft:5px;
	-webkit-border-bottom-right-radius:5px;
	-webkit-border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
	border-bottom-left-radius:5px;
}
#header h1 {
	
	font: 2.3em 'tendernessregular', arial, serif; 
	text-indent:50px;
}
#footer {
	padding:25px 0;
	margin:50px 0 0 0;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;	
	border-radius:5px;
}
#content {
	background-color: #FFF;
	margin:0;
	padding:40px 0;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;	
	border-radius:5px;
	-moz-border-radius-topleft:0px;
	-webkit-border-top-left-radius:0px;	
	border-top-left-radius:0px;
}
#content h2,
#content p {
	margin:0;
	padding:10px 50px;
}
#content h2 {
	font: normal 1.2em Arial, serif;

}
#content h2  span{
	color:#6c6c6c;
	font: 1.2 'tendernessregular', arial, serif;
	display: block;
}
#main p {
	font-size: 14px;
	line-height:20px;
}
#footer p {
	
	font: normal 0.8em Arial, serif;
	margin:0;
	padding:0;
	text-indent:50px;
}
#navi ul {
	float:left;
	width:100%;
	padding:0;
	margin:0;
	list-style:none;
}
#navi li {
	float:left;
	padding:7px 0 0 0;
	margin:0 5px 0 0;
	font: bold 81.25%/2.125 Arial, Verdana, sans-serif;
}
#navi li a {
	display: block;
	color:#fff;
	text-decoration: none;
	padding:0 0 0 5px;
	background:#2c2c2c;
	background: -moz-linear-gradient(top, #848487, #3c3c3c);
	background: -webkit-gradient(linear, left top, left bottom,color-stop(0, #848487), color-stop(1, #3c3c3c));
}
#navi li#active span,
#navi li a {
	-moz-border-radius-topright:5px;
	-moz-border-radius-topleft:5px;
	-webkit-border-top-right-radius:5px;
	-webkit-border-top-left-radius:5px;
	border-top-right-radius:5px;
	border-top-left-radius:5px;
}
#navi li a:hover,
#navi li a:active,
#navi li a:focus {
	outline: none;
	text-decoration: underline;
}
#navi li a span {
	display:block;
	margin:0;
	padding:0 15px 0 10px;
}
#navi li#active {
	margin:0 5px 0 0;
	padding:0;
}
#navi li#active span {
	display:block;
	margin:0;
	padding:7px 15px 0 15px;
	color:#2c2c2c;
	background:#FFF;
}

hr {
	width: 220px;  
	border:none;
    height:1px;
    background-image:url('../images/ruler.png');
}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
/* IE-Patch für IE 7*/
*:first-child+html .clearfix { min-height: 0; }
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */


@media only screen and (max-width: 750px) {
	#main {
		margin:0 auto;
		max-width:700px;
		min-width:401px;
		width:95%;
	}
	#header,
	#footer {
		margin:25px auto;
		width:100%;
		height:auto;
	}
	#header {
		margin-top:0;
	}
	#content {
		padding:10px 0;
	}
	#content h2,
	#content p {
		margin:0;
		padding:10px 20px;
	}
	#header h1,
	#footer p {
		text-indent:20px;
	}
	#main h1,
	#main h2 {
		line-height: 1.25;
	}
}

@media only screen and (max-width: 495px) {
	#main {
		margin:0 auto;
		max-width:400px;
		min-width:150px;
		width:90%;
	}
	#header img.logo{ 
		width: 80%;
	}

	#navi ul {
		float:none;
		width:100%;
		padding:0;
	}
	#navi li,
	#navi li#active span,
	#navi li a,
	#navi li a span {
		float:none;
		width:100%;
	}
	#navi ul li {
		padding:0;
	}
	#content h2,
	#content p {
		margin:0;
		padding:10px;
	}
	#content img.map{ 
		width: 80%;
	}
	#header,
	#footer {
		padding:5px 0;
	}
	#header h1,
	#footer p {
		text-align: center;
	}
	#header h1 {
		line-height:.66;
	}
	#navi li a,
	#navi li a span,
	#navi li#active span {
		padding:0;
	}
	#navi li a,
	#navi li#active {
		text-align: left;
		margin:0;
		padding:0;
		text-indent:10px;
	   -webkit-border-radius:0px;
		-moz-border-radius:0px;
		border-radius:0px;
	}
	#content,
	#navi li#active span,
	#navi li a {
		-webkit-border-top-right-radius:0px;
		-webkit-border-top-left-radius:0px;
		-moz-border-radius-topright:0px;
		-moz-border-radius-topleft:0px;
		border-top-right-radius:0px;
		border-top-left-radius:0px;
	}
	#navi li:first-child a,
	#navi li#active:first-child span {
		-webkit-border-top-right-radius:5px;
		-webkit-border-top-left-radius:5px;
		-moz-border-radius-topright:5px;
		-moz-border-radius-topleft:5px;
		border-top-right-radius:5px;
		border-top-left-radius:5px;
	}
}