
#cube .wrap {
	height: 800px;
	margin-top: 0;
	position: relative;
	left: 0;
	top: 0;
	transform: scale(.5);
	transition: transform 1s ease-out;
	perspective: 1600px;
	perspective-origin: 0 0
}

@media screen and (min-width:961px)and (max-width:1320px) {
	#cube .wrap {
		transform: scale(0.75);
		perspective: 1600px;
		perspective-origin: 0 0
	}

}

@media screen and (min-width:961px)and (max-width:1620px) {
	#cube .wrap {
		transform: scale(1);
		top: 300px;
		perspective: 1600px;
		perspective-origin: 50% 600px
	}

}

@media screen and (min-width:1321px)and (max-width:1880px) {
	#cube .wrap {
		transform: scale(1);
		perspective: 1600px;
		perspective-origin: 50% 600px
	}

}

@media screen and (min-width:1620px) {
	#cube .wrap {
		top: 300px;
		transform: scale(1);
		perspective: 1600px;
		perspective-origin: 50% 600px;
	}

}

#cube .wrap.shrink {
	transform: scale(0) !important
}

#cube .cube {
	position: relative;
	width: 800px;
	transform-style: preserve-3d;
}

#cube .cube div {
	position: absolute;
	width: 600px;
	height: 600px;
	background: url('borg2.jpg');
	background-size: cover;
}

#cube .cube div a.entry {
	display: block;
	border: 0
}

#cube .cube div a.entry:hover img, #cube .cube div a.entry:focus img {
	border: solid 2px #b0f566
}

#cube .cube div a.entry img {
	border-radius: 0
}

#cube .cube .back {
	transform: translateZ(-300px) rotateY(180deg)
}

#cube .cube .right {
	transform: rotateY(-270deg) translateX(300px);
	transform-origin: top right
}

#cube .cube .left {
	transform: rotateY(270deg) translateX(-300px);
	transform-origin: center left
}

#cube .cube .top {
	transform: rotateX(-90deg) translateY(-300px);
	transform-origin: top center
}

#cube .cube .bottom {
	transform: rotateX(90deg) translateY(300px);
	transform-origin: bottom center
}

#cube .cube .front {
	transform: translateZ(300px)
}

@keyframes spin {
	from {
		transform: rotateY(0)
	}

	to {
		transform: rotateY(360deg)
	}

}

#cube .cube.spinning {
	animation: spin 20s infinite linear
}
