html, body { width:100%; height:100%; margin:0; padding:0 }

	body { background: #ffffff }

	#designElement1 { display:block; background:url('../style/img/sneaky-oachkatzerl.png') -10px 0px no-repeat; position:absolute; width:36px; height:95px; right:-37px; top:1.5em; z-index:100 }
	#designElement1:hover { background-position:0px 0px }

	#designElement1 { 
		-moz-transition: background-position 0.2s ease-out;
		-webkit-transition: background-position 0.2s ease-out;
		-o-transition: background-position 0.2s ease-out;
		transition: background-position 0.2s ease-out;
	}


	#photoarea { height:30em; position:relative; overflow:hidden }

	#background { display:block; width:110%; min-height:110%; position:absolute; left:-5%; top:-5%; z-index:1 }

	#photoBlock { position:absolute; right:2em; bottom:3em; z-index:3 }
	#photoBlock a { display:block; background:#ffffff; text-decoration:none !important; color:#000000 !important; padding:6px; }
	#photoBlock a:hover, #photoBlock a:focus { outline:none; -moz-transform:rotate(5deg); -webkit-transform:rotate(5deg); -o-transform:rotate(5deg); -ie-transform:rotate(5deg) }

	#photoBlock a img { border:none; height:15em; width:20em }
	#photoBlock span { display:block; padding:.6em 0em .4em 0em; text-align:center }

	#photoBlock a { border-left:1px solid #aaaaaa; border-top:1px solid #aaaaaa; border-right:1px solid #777777; border-bottom:1px solid #777777;
			-webkit-box-shadow: 1px 1px 3px rgba(0,0,0,0.6); box-shadow: 1px 1px 3px rgba(0,0,0,0.6); -moz-box-shadow: 1px 1px 3px rgba(0,0,0,0.6); -o-box-shadow: 1px 1px 3px rgba(0,0,0,0.6); -ie-box-shadow: 1px 1px 3px rgba(0,0,0,0.6) }

	/* Trick für smootheres Erscheinungsbild im Firefox, keine richtige Animation */
	@-moz-keyframes photo-moz {
		0% { -moz-transform:rotate(5deg); }
		100% { -moz-transform:rotate(4.9deg); }
	}
	#photoBlock a:hover, #photoBlock a:focus { -moz-animation-name:photo-moz; -moz-animation-duration:10s; -moz-animation-iteration-count:infinite }

	
	h1 { display:block; background:#ffffff; position:absolute; width:100%; font-size:1.6em; padding:2em 10em 1em 2.5em; margin:0em; bottom:0px; font-weight:normal; z-index:2;
		box-shadow: 0px 0px 4px rgba(0,0,0,0.7); -moz-box-shadow: 0px 0px 4px rgba(0,0,0,0.7); -webkit-box-shadow: 0px 0px 4px rgba(0,0,0,0.7); -o-box-shadow: 0px 0px 4px rgba(0,0,0,0.7); -ms-box-shadow: 0px 0px 4px rgba(0,0,0,0.7);
		background:url('../style/img/index-titlebg.png') top repeat-x }

	.advent h1 { background:url('../img/adventbottom.jpg') bottom repeat-x; padding-top:10em }
	#photoarea.advent { background:url('../img/adventstars.jpg') left top repeat }
	.advent #inphotoarea { position:absolute; left:355px; top:-60px; width:355px; height:347px; max-height:100%; background:url('../img/adventstars.gif') left top no-repeat }

	#content { overflow-x:hidden }

	#content { padding:.5em 0em 4em 21em }
	.contentspace { padding-bottom:0em }
	#incontent { margin:-4em -4em 0em -21em; position:relative }
	#incontent2 { background:url('../style/img/index-right-shadow.png') right top no-repeat; margin-right:-5px; padding-right:5px }
	#afternavi.withcomments #incontent { margin-left:0em }
	#afternavi.withcomments h1 { margin-left:13.125em }
	
	#welcomeBlock { float:left; width:50% }
	#welcomeBlock .inBlock { padding:0em 4em 1.7em 0em }

	#whatsNewBlock, #naviBlock { float:left; width:25% }
	#whatsNewBlock .inBlock, #naviBlock .inBlock { padding:0em 4em 1.7em 0em }

	#content h2:first-child { padding-top:0em }

	#content h2 + p { margin-top:-1px }


	#endClearer { clear:both; margin:0em 4em 0em 0em; height:0em }

	#anispace { text-align:right }

	/* Kleine Bildschirme */

	@media only screen and (max-width: 100em) {
		#welcomeBlock { width:70% }
		#whatsNewBlock, #naviBlock { width:30% }
	}

	@media only screen and (max-width: 127em) {
		#afternavi.withcomments #welcomeBlock { width:70% }
		#afternavi.withcomments #whatsNewBlock, #afternavi.withcomments #naviBlock { width:30% }
	}

	@media only screen and (max-width: 87em) {
		#afternavi.withcomments #welcomeBlock { width:100% }
		#afternavi.withcomments #whatsNewBlock, #afternavi.withcomments #naviBlock { width:50% }
	}

	@media only screen and (max-width: 60em) {
		#welcomeBlock { width:100% }
		#whatsNewBlock, #naviBlock { width:50% }
	}

	@media only screen and (max-width: 67em) {
		#afternavi.withcomments #whatsNewBlock, #afternavi.withcomments #naviBlock { width:100% }
	}

	@media only screen and (max-width:40em) {
		#whatsNewBlock, #naviBlock { width:100% }
	}

	@media only screen and (max-width: 750px) {

		#photoarea { height:26em }
		#photoBlock { bottom:6em; right:2em }
		h1 { padding-top:2.5em; padding-left:1.25em; margin-left:0em !important }
		#content { padding-left:0em }
		#incontent { margin: -2em -2em 0em 0em }
		.inBlock { padding:0em 2em 1.7em 0em !important }
		#endClearer { margin-right:2em }
	}