body {
	background-color: black;
}

#masterplane {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,1)), color-stop(0.5, rgba(0,0,20,1)), to(rgba(200,200,200,1)));
	-webkit-perspective: 3000;
}

#luc-at {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 430px;
	height: 460px;
	margin: -115px -215px;
	background-color: rgba(0,0,0,0.01);
	/*
	-webkit-transform: rotateY(10deg); 
	*/
	-webkit-transition: -webkit-transform 2s, opacity 5s;
	-webkit-transition-delay: 1s;
	display: none;
}

#luc-at img {
	width: 100%;
	height: 50%;
	-webkit-box-reflect: below 0px -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0,0,0,0.2)));
	-moz-box-reflect: below 0px;
}

.start-position {
	-webkit-transform: translate3d(0px,0px,-20000px) rotateY(360deg); 
	opacity: 0;
}

/*
test ab hier
*/

#test {
	display: none;
}

.testbox {
	display: inline-block;
	position: relative;
	width: 400px;
	height: 400px;
	margin: 200px 20px;
	background-color: rgba(255,255,255,0);
	overflow: hidden;
}

.testbox > p {
	background-color: #84BD84;
	position: absolute;
	top: 0px;
	left: 0px;
	padding: 2px;
}

.testobject {
	position: absolute;
	top: 0px;
	left: 0px;
	height: 50%;
	width: 100%;
	-webkit-perspective-origin-x: 50%;
	-webkit-perspective-origin-y: 50%;

	-webkit-box-reflect: below 0px -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0,0,0,0.5)));
}

.testobject p {
	position: absolute;
	background-color: #F3B51E;
	bottom: 0px;
	left: 0px;
	width: 100%;
}

.testobject img {
	-webkit-transform: translate3d(0px,0px,-500px) rotateY(45deg);
}

.innerbox {
	overflow: hidden;
}

#box1 .innerbox {
	-webkit-perspective: 800;
}

#box2 .innerbox {
	-webkit-perspective: 1600;
}

#box3 .innerbox {
	-webkit-perspective: 3200;
}

#box4 .innerbox {
	-webkit-perspective: 6400;
}

/*
auto ab hier
*/

#carplane {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	-webkit-perspective: 2000;
	height: 100%;
}

#carplane * {
	-webkit-transform-style: preserve-3d;
}

#car {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 1124px;
	height: 614px;
	margin: -151px -562px;
	-webkit-animation-name: present;
	-webkit-animation-duration: 5s;
	-webkit-animation-iteration-count: infinite;
}

#carbody > *, #gtaspano img {
	-webkit-box-reflect: below 0px -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0,0,0,0.5)));
}

#rear_wheel_Box {
	position: absolute;
	top: 132px;
	left: 82px;
	width: 187px;
	height: 187px;
	background-image: url('../gfx/bremse.png');
	-webkit-transform: translate3d(0px,0px,-10px);
}

#rear_wheel {
	position: absolute;
	top: ßpx;
	left: ßpx;
	width: 187px;
	height: 187px;
	background-image: url('../gfx/car_fronttyre.png');
	-webkit-animation-name: spin;
	-webkit-animation-duration: 2s;
	-webkit-animation-iteration-count: infinite;
}

#front_wheel_box {
	position: absolute;
	top: 132px;
	left: 818px;
	width: 187px;
	height: 187px;
	background-image: url('../gfx/bremse.png');
	-webkit-animation-name: steer;
	-webkit-animation-duration: 5s;
	-webkit-animation-iteration-count: infinite;
}

#front_wheel {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 187px;
	height: 187px;
	background-image: url('../gfx/car_fronttyre.png');
	-webkit-animation-name: spin;
	-webkit-animation-duration: 2s;
	-webkit-animation-iteration-count: infinite;
}

@-webkit-keyframes spin {	
	0% { -webkit-transform: translate3d(0px,0px,1px) rotateZ(0deg);
	-webkit-animation-timing-function: linear; }
	100% {-webkit-transform: translate3d(0px,0px,1px) rotateZ(360deg); }
}

@-webkit-keyframes present {
	0% { -webkit-transform: rotateY(-10deg);  -webkit-animation-timing-function: ease-in-out;}
	50% { -webkit-transform: rotateY(10deg);  -webkit-animation-timing-function: ease-in-out;}
	100% {-webkit-transform: rotateY(-10deg);  -webkit-animation-timing-function: ease-in-out;}
}

@-webkit-keyframes steer {
	0% { -webkit-transform: translate3d(0px,0px,-10px) rotateY(0deg); -webkit-animation-timing-function: ease-in-out;}
	25% { -webkit-transform: translate3d(0px,0px,-10px) rotateY(30deg); -webkit-animation-timing-function: ease-in-out;}
	50% { -webkit-transform: translate3d(0px,0px,-10px) rotateY(0deg); -webkit-animation-timing-function: ease-in-out;}
	75% { -webkit-transform: translate3d(0px,0px,-10px) rotateY(-30deg); -webkit-animation-timing-function: ease-in-out;}
	100% {-webkit-transform: translate3d(0px,0px,-10px) rotateY(0deg); -webkit-animation-timing-function: ease-in-out;}
}

#gtaspano {
	text-align: center;
	position: absolute;
	top: 70%;
	left: 0px;
	width: 100%;
	height: 30%;
}

/*
background-color: rgba(200,200,0,0.3);
*/
