.cube-container {
	margin: 0 auto;
	width: 200px;
	height: 300px;
	position: relative;
	perspective: 1000px;
	padding-top: 40px;
}
.cube {
	height: 100%;
	width: 100%;
	position: absolute;
	transform-style: preserve-3d;
	transition: transform 1s;
}
.cube-item {
	display: block;
	position: absolute;
	opacity: 0.95;
	border-radius: 10px;
}
.cube-item img {
	width: 200px;
	border-radius: 8px
}
.a {
	transform: rotateY(0deg) translateZ(250px);
}
.b {
	transform: rotateY(60deg) translateZ(250px);
}
.c {
	transform: rotateY(120deg) translateZ(250px);
}
.d {
	transform: rotateY(180deg) translateZ(250px);
}
.e {
	transform: rotateY(240deg) translateZ(250px);
}
.f {
	transform: rotateY(300deg) translateZ(250px);
}
.next-scrn, .prev-scrn {
	color: var(--blue);
	position: absolute;
	top: 50%;
	padding: 10px;
	cursor: pointer;
	background: var(--white);
	border-radius: 26px;
	transition: box-shadow 0.1s, top 0.1s;
	width: 45px;
	height: 45px;
	text-align: center;
}
.cube-res {
	position: relative;
	height: 500px;
	margin-top:20px;
}
.next-scrn:hover, .prev-scrn :hover {
	color: var(--yellow)
}
.next-scrn:active, .prev-scrn:active {
	top: 50%;
	box-shadow: 0 1px 0 #999;
}
.next-scrn {
	right: 5em;
}
.prev-scrn {
	left: 5em;
}
.cube-btn {
	margin-top: 60px;
}
.cube-btn .btn {
	border-radius: 25px;
	background: var(--white) !important;
	color: var(--blue) !important;
	font-weight: bold;
	min-width: 200px;
	border: none;
	padding: 10px;
}
.cube-btn .btn:hover {
	color: var(--blue) !important;
	background: var(--yellow) !important;
}
@media only screen and (max-width: 480px) {
 .next-scrn, .prev-scrn {
top: 440px !important;
}
 .cube-res {
height: 460px!important
}
 .next-scrn {
right: 1em !important;
}
 .prev-scrn {
left: 1em !important;
}
 .cube-container {
width: 175px;
}
 .cube-item img {
width: 175px;
border-radius: 8px
}
 .a {
transform: rotateY(0deg) translateZ(175px);
}
 .b {
transform: rotateY(60deg) translateZ(175px);
}
 .c {
transform: rotateY(120deg) translateZ(175px);
}
 .d {
transform: rotateY(180deg) translateZ(175px);
}
 .e {
transform: rotateY(240deg) translateZ(175px);
}
 .f {
transform: rotateY(300deg) translateZ(175px);
}
}