html body *:focus {outline:none;}
a {outline:none;}
html { margin:0; padding:0; background:url(../images/bottom_bg.jpg) fixed; }
body {
	margin:0;
	padding:0;
	font-family: Helvetica, Arial, sans-serif;
	font-size:12px;
	line-height:18px;
	color:#ab4;
	background:url(../images/top_bg.gif) top left repeat-x;	
}
div#top {
	position:relative;
	margin:0 auto;
	padding:0 5%;
	width:90%; max-width:800px;
	height:220px;
	background: url(../images/surreallife.jpg) 50px 18px no-repeat;
}
div#navi {
	position:relative;
	margin:0;
	padding:50px 0 0 0;
	width:300px;
	height:150px;
	float:right;
	font-size:14px;
	font-family:"Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;
}
div#main {
	position:relative;
	margin:0;
	padding:20px 0 50px;
	width:100%;
	height:auto;
	background:url(../images/text_bg.jpg) fixed;
	border-top:#cdb 1px solid;
	border-bottom:#ffe 1px solid;
}
div#content {
	position:relative;
	margin:0 auto;
	padding:0 5%;
	width:90%; max-width:800px;
	height:auto;
	color:#553;
}
div#button {
	position:fixed;
	top:320px;
	right:0;
	width:173px;
	height:71px;
	background:url(../images/foto.gif) top left no-repeat;
	z-index:5;
}
div#button:hover {background:url(../images/foto_on.gif); cursor:pointer;}

div#footer {
	position:relative;
	width:100%;
	height:auto;
	margin:0;
	padding:0;
	clear:both;
}
div#impressum {
	position:relative;
	height:auto;
	margin:0 auto;
	padding:30px 5% 50px;
	width:90%; max-width:800px;
	color:#ab7;
}
div.clear {	clear:both; }

h1, h2, h3 {font-family:"Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;}
h1 {
	font-size:24px;
	line-height:32px;
	font-weight:normal;
	font-style:normal;
	color:#ab4;
	margin:32px 0 22px 0;
	padding:0;
}
h2 {
	font-size:24px;
	line-height:32px;
	font-weight:normal;
	font-style:normal;
	color:#ab4;
	margin:32px 0 22px 0;
	padding:0;
}
h3 {
	font-size:18px;
	line-height:24px;
	font-weight:normal;
	margin:18px 0 12px 0;
	padding:0;
}
a:link, a:visited { color:#553; text-decoration:underline; }
a:hover, a:active { color:#ab4; text-decoration:underline; }

div#impressum a:link, div#impressum a:visited { color:#ab7; text-decoration:none; }
div#impressum a:hover, div#impressum a:active { color:#ab7; text-decoration:underline; }

h2 a:link, h2 a:visited { color:#ab4; text-decoration:none; }
h2 a:hover, h2 a:active { color:#ab4; text-decoration:underline; }

div#navi a:link, div#navi a:visited { color:#ab4; text-decoration:none; }
div#navi a:hover, div#navi a:active { color:#774; text-decoration:none; }
div#navi li.active a { color:#774; text-decoration:none; }

div#navi ul {position:relative; padding:0; margin:0; height:20px; display:inline;}
div#navi ul li {position:relative; padding:0; margin:0 16px 0 0; display:inline; list-style-type:none;}
div#navi ul li a {position:relative; display:inline; overflow:hidden;}
div#navi ul li a img {visibility:hidden; overflow:hidden;}
div#navi ul li a:hover img {visibility:visible; overflow:visible;}
div#navi ul li a img#first {position:absolute; top:-68px; left:-200px; z-index:11;}
div#navi ul li a img#second {position:absolute; top:-68px; left:-220px; z-index:12;}
div#navi ul li a img#third {position:absolute; top:-68px; left:-220px; z-index:13;}
div#navi ul li a img#fourd {position:absolute; top:-68px; left:-220px; z-index:14;}
div#navi ul li a span#fir {position:absolute; top:0px; left:0px; z-index:91 !important;}
div#navi ul li a span#sec {position:absolute; top:0px; left:50px; z-index:92 !important;}
div#navi ul li a span#thi {position:absolute; top:0px; left:105px; z-index:93 !important;}
div#navi ul li a span#fou {position:absolute; top:0px; left:165px; z-index:94 !important;}

ul.web li {margin-bottom:18px;}

img { border:none; }

div#content a img {border:#cda 1px solid; padding:1px;}
div#content a:hover img {border:#ab7 1px solid;}

/*///////////////////// RESPONSIVE ////////////////////*/

@media (max-width: 1000px) { 
div#navi ul li a:hover img {visibility:hidden; overflow:hidden;}
}