@charset "UTF-8";
.text {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}
a:link {
	color: #000000;
	text-decoration: underline;
}
a:hover {
	color: #000000;
	text-decoration: none;
}
a:active {
	color: #000000;
	text-decoration: underline;
}
a:visited {
	color: #000000;
	text-decoration: underline;
}
#apDiv1 {
	position:absolute;
	left:142px;
	top:32px;
	width:459px;
	height:72px;
	z-index:1;
}
#apDiv2 {
	position:absolute;
	left:51px;
	top:117px;
	width:712px;
	height:26px;
	z-index:2;
}
#apDiv3 {
	position:absolute;
	left:48px;
	top:498px;
	width:805px;
	height:42px;
	z-index:3;
}
#apDiv4 {
	position:absolute;
	left:84px;
	top:271px;
	width:344px;
	height:127px;
	z-index:8;
}
#apDiv5 {
	position:absolute;
	left:271px;
	top:507px;
	width:155px;
	height:72px;
	z-index:5;
}
#apDiv6 {
	position:absolute;
	left:456px;
	top:505px;
	width:186px;
	height:72px;
	z-index:6;
}
#apDiv7 {
	position:absolute;
	left:446px;
	top:162px;
	width:419px;
	height:286px;
	z-index:7;
}
#apDiv8 {
	position:absolute;
	left:486px;
	top:191px;
	width:355px;
	height:295px;
	z-index:8;
}
#apDiv9 {
	position:absolute;
	left:675px;
	top:505px;
	width:186px;
	height:72px;
	z-index:6;
}


#phaWrapper { width:400px; height:300px; position:relative; display:block; overflow:hidden; background:#FFF; background-color:#FFF; margin:156px 0 0 444px;}
	.kachel {display:block; width:130px; height:130px;}
	
	#ersteKachel { background:#F2F2F3; background-color:#F2F2F3; transform:rotate(45deg); -ms-transform:rotate(45deg); -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); position:absolute; top:50%; left:450px; margin-top:-65px; animation:myfirst 0.5s linear 1 forwards; -moz-animation:myfirst 0.5s linear 1 forwards; -webkit-animation:myfirst 0.5s linear 1 forwards; -o-animation:myfirst 0.5s linear 1 forwards; animation-delay:1s; -moz-animation-delay:1s; -webkit-animation-delay:1s; -o-animation-delay:1s;}
	
	#zweiteKachel { background:#F6F6F6; background-color:#F6F6F6; transform:rotate(45deg); -ms-transform:rotate(45deg); -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); position:absolute; top:50%; left:450px; margin-top:-65px; animation:myfirst2 0.5s linear 1 forwards; -moz-animation:myfirst2 0.5s linear 1 forwards; -webkit-animation:myfirst2 0.5s linear 1 forwards; -o-animation:myfirst2 0.5s linear 1 forwards; animation-delay:1.2s; -moz-animation-delay:1.2s; -webkit-animation-delay:1.2s; -o-animation-delay:1.2s;}
	
	#dritteKachel { background:#F9F9F9; background-color:#F9F9F9; transform:rotate(45deg); -ms-transform:rotate(45deg); -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); position:absolute; top:50%; left:450px; margin-top:-65px; animation:myfirst3 0.5s linear 1 forwards; -moz-animation:myfirst3 0.5s linear 1 forwards; -webkit-animation:myfirst3 0.5s linear 1 forwards; -o-animation:myfirst3 0.5s linear 1 forwards; animation-delay:1.4s; -moz-animation-delay:1.4s; -webkit-animation-delay:1.4s; -o-animation-delay:1.4s;}
	@keyframes myfirst
	{
	from {left:450px; top:50%; }
	to {left:45px; top:50%; }
	}
	@-moz-keyframes myfirst /* Firefox */
	{
	from {left:450px; top:50%; }
	to {left:45px; top:50%; }
	}
	@-webkit-keyframes myfirst /* Safari and Chrome */
	{
	from {left:450px; top:50%; }
	to {left:45px; top:50%; }
	}
	@-o-keyframes myfirst /* Opera */
	{
	from {left:450px; top:50%; }
	to {left:45px; top:50%; }
	}
	
	@keyframes myfirst2
	{
	from {left:550px; top:50%; }
	to {left:145px; top:50%; }
	}
	@-moz-keyframes myfirst2 /* Firefox */
	{
	from {left:550px; top:50%; }
	to {left:145px; top:50%; }
	}
	@-webkit-keyframes myfirst2 /* Safari and Chrome */
	{
	from {left:550px; top:50%; }
	to {left:145px; top:50%; }
	}
	@-o-keyframes myfirst2 /* Opera */
	{
	from {left:550px; top:50%; }
	to {left:145px; top:50%; }
	} 
	
	@keyframes myfirst3
	{
	from {left:650px; top:50%; }
	to {left:245px; top:50%; }
	}
	@-moz-keyframes myfirst3 /* Firefox */
	{
	from {left:650px; top:50%; }
	to {left:245px; top:50%; }
	}
	@-webkit-keyframes myfirst3 /* Safari and Chrome */
	{
	from {left:650px; top:50%; }
	to {left:245px; top:50%; }
	}
	@-o-keyframes myfirst3 /* Opera */
	{
	from {left:650px; top:50%; }
	to {left:245px; top:50%; }
	}