* {
	margin: 0;
	padding: 0;
}

.container,.wrap {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;

	margin: auto;
}

.container {
	width: 800px;
	height: 600px;

	perspective: 2000;
	-webkit-perspective: 2000;
}

.wrap {
	width: 100%;
	height: 100%;

	transform-style:preserve-3d;
	animation: spin 10s linear infinite;
	-webkit-animation: spin 10s linear infinite;
}

@keyframes spin {
	0% {
		transform: rotateY(0deg);
	}
	100% {
		transform: rotateY(360deg);
	}
}

.wrap div {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;

	margin: auto;

	width: 300px;
	height: 300px;
	background-size: 100% 100%;
}

.pic1 {
	background-image: url(images/1.jpg);
	transform: rotateY(0deg) translateZ(340px);
}

.pic2 {
	background-image: url(images/2.jpg);
	transform: rotateY(60deg) translateZ(340px);
}

.pic3 {
	background-image: url(images/3.jpg);
	transform: rotateY(120deg) translateZ(340px);
}

.pic4 {
	background-image: url(images/4.jpg);
	transform: rotateY(180deg) translateZ(340px);
}

.pic5 {
	background-image: url(images/5.jpg);
	transform: rotateY(240deg) translateZ(340px);
}

.pic6 {
	background-image: url(images/6.jpg);
	transform: rotateY(300deg) translateZ(340px);
}