
#center {
	position: absolute;
	margin: 0;
	padding: 0;
	top: 50%;
	left: 50%;
	width: 1px;
	height: 1px;
	overflow: visible;
}

#sl {
	position: absolute;
	margin: 0;
	padding: 0;
	width: 700px;
	height: 500px;
	left: -350px;
	top: -250px;
}

#sllo {
	position: absolute;
	top: 0;
	left: 0;
	height: 400px;
	width: 400px;
	background-image: url(../img/sllo.png);
	z-index: 0;
}

#slro {
	position: absolute;
	top: 0;
	right: 0;
	height: 400px;
	width: 400px;
	background-image: url(../img/slro.png);
	z-index: 0;
}

#sllu {
	position: absolute;
	bottom: 0;
	left: 0;
	height: 400px;
	width: 400px;
	background-image: url(../img/sllu.png);
	z-index: 0;
}

#slru {
	position: absolute;
	bottom: 0;
	right: 0;
	height: 400px;
	width: 400px;
	background-image: url(../img/slru.png);
	z-index: 0;
}

#slo {
	position: absolute;
	top: 0;
	left: 400px;
	right: 400px;
	height: 18px;
	background-image: url(../img/slo.png);
	background-repeat: repeat-x;
	z-index: 0;
}

#sll {
	position: absolute;
	left: 0;
	top: 400px;
	bottom: 400px;
	width: 18px;
	background-image: url(../img/sll.png);
	background-repeat: repeat-y;
	z-index: 0;
}

#slr {
	position: absolute;
	right: 0;
	top: 400px;
	bottom: 400px;
	width: 18px;
	background-image: url(../img/slr.png);
	background-repeat: repeat-y;
	z-index: 0;
}

#slu {
	position: absolute;
	bottom: 0;
	left: 400px;
	right: 400px;
	height: 18px;
	background-image: url(../img/slu.png);
	background-repeat: repeat-x;
	z-index: 0;
}

#titel {
	position: absolute;
	top: 25px;
	right: 130px;
	font-size: 10pt;
	margin: 0;
	padding: 0;
	font-variant: normal;
	font-weight: normal;
	z-index: 1;
}

#untertitel {
	position: absolute;
	top: 47px;
	right: 130px;
	font-size: 9pt;
	margin: 0;
	padding: 0;
	font-variant: normal;
	font-weight: normal;
	z-index: 1;
}

#zdh {
	position: absolute;
	top: 270px;
	left: 50px;
	width: 300px;
	height: 47px;
	background-image: url(../img/zdh.png);
	background-repeat: no-repeat;
	z-index: 1;
}

#stuckateur {
	position: absolute;
	top: 45px;
	left: 65px;
	width: 225px;
	height: 200px;
	background-image: url(../img/stuckateur.png);
	background-repeat: no-repeat;
	z-index: 1;
}

#bild {
	position: absolute;
	top: 75px;
	left: 97px;
	width: 165px;
	height: 165px;
	background-repeat: no-repeat;
	display: none;
	z-index: 2;
}

#bild.restaurierung {
	background-image: url(../img/restaurierung.png);
}

#bild.stuck {
	background-image: url(../img/stuck.png);
}

#bild.putz {
	background-image: url(../img/putz.png);
}

#bild.historisch {
	background-image: url(../img/historisch.png);
}

#bild.sanierung {
	background-image: url(../img/sanierung.png);
}

#bild.daemmung {
	background-image: url(../img/daemmung.png);
}

#schneider {
	position: absolute;
	top: 100px;
	left: 300px;
	width: 340px;
	height: 100px;
	background-image: url(../img/schneider.png);
	background-repeat: no-repeat;
	z-index: 1;
}

#leistungen {
	position: absolute;
	top: 240px;
	left: 300px;
	width: 300px;
	list-style: disc outside url(../img/list.png);
	font-size: 14pt;
	font-family: "Century Gothic", "Avant Garde", "Lucida Grande", "Lucida Sans", "Bitstream Vera Sans", Verdana, sans-serif;
	z-index: 1;
}

#leistungen li {
	position: relative;
	height: 21pt;
	padding: 1pt 5pt;
	line-height: 1.5;
	float: left;
	clear: left;
	z-index: 2;
}

#restaurierung {
	left: 125px;
}

#stuck {
	left: 100px;
}

#putz {
	left: 75px;
}

#historisch {
	left: 50px;
}

#sanierung {
	left: 25px;
}

#daemmung {
	left: 0px;
}

#links {
	position: absolute;
	bottom: 25px;
	left: 130px;
	width: 450px;
	font-size: 10pt;
	text-align: center;
	list-style-type: none;
	z-index: 1;
}

#links li {
	position: relative;
	display: inline;
	padding: 1pt 2pt;
	line-height: 1.5;
	z-index: 2;
}

.ahover {
	position: absolute;
	background: #fff;
	border: 1px inset #eee;
	border-radius: 7px;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	-khtml-border-radius: 7px;
}

/* mobile */

@media only screen and (max-width: 720px) and (orientation: portrait)  {

	#sl {
		width: 360px;
		left: -180px;
		height: 665px;
		top: -320px;
	}

	#titel, #untertitel {
		font-size: 11pt;
		right: 5px;
	}

	#titel {
		top: 0;
	}

	#untertitel {
		top: 20px;
	}

	#schneider {
		top: 55px;
		left: 5px;
	}

	#stuckateur {
		top: 180px;
	}

	#bild {
		top: 210px;
	}

	#zdh {
		display: none;
	}

	#leistungen {
		left: 50px;
		top: 390px;
		font-size: 16pt;
	}

	#restaurierung, #stuck, #putz, #historisch, #sanierung, #daemmung {
		left: 0;
	}

	#links {
		left: 15px;
		font-size: 12pt;
		width: 300px;
		bottom: 5px;
	}

	#sllo, #slo, #slro, #sll, #slm, #slr, #sllu, #slu, #slru {
		background: none;
		display: none;
	}

}

@media only screen and (max-width: 720px) and (orientation: landscape)  {

	#sllo, #slo, #slro, #sll, #slm, #slr, #sllu, #slu, #slru {
		background: none;
		display: none;
	}
}
