.cube {
	position: absolute;
	width: 50px;
	margin-left: 1.9em;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	transform: rotateY;}

.cube div {
	position: absolute;
	width: 50px;
	height: 50px;
	box-shadow: inset 0 0 15px rgba(125, 125, 125, 0.8);
	line-height: 50px;
}

.hinten {
	transform: rotateY(180deg) translateZ(25px) ;
	background: red;
}

.rechts {
	transform: rotateY(-270deg) translateX(25px);
	transform-origin: top right;
	background: red;
}

.links {
	transform: rotateY(270deg) translateX(-25px);
	transform-origin: top left;
	background: red;
}

.oben {
	transform: rotateX(90deg) translateY(-25px);
	transform-origin: top center;
	background: red;
}

.unten {
	transform: rotateX(-90deg) translateY(25px);
	transform-origin: bottom center;
	background: red;
}

.vorne {
	transform: translateZ(25px);
	background: red;
}

@keyframes drehung {
	100% {
		transform: rotate3d(0, 1, 0, 0);
	}
	0% {
		transform: rotate3d(0, 1, 0, 360deg);
	}
}

.cube {
	animation: drehung 10s infinite linear;
}