/*--------------------------------------------------------------
# Copyright (C) joomla-monster.com
# License: http://www.joomla-monster.com/license.html Joomla-Monster Proprietary Use License
# Website: http://www.joomla-monster.com
# Support: info@joomla-monster.com
---------------------------------------------------------------*/

/** global **/

.cube-wrap {
	-webkit-perspective: 800px;
	-moz-perspective: 800px;
	-o-perspective: 800px;
	-ms-perspective: 800px;
	perspective: 800px;
	transform: scale(0.8);
	-ms-transform: scale(0.8);
	-webkit-transform: scale(0.8); 
	-moz-transform: scale(0.8); 
	-o-transform: scale(0.8); 
}

.cube {
	position: relative;
	margin: 0 auto;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	-ms-transform-style: preserve-3d;
	transform-style: preserve-3d;
	transition: transform 1s;
	-webkit-transition: -webkit-transform 1s;
	-moz-transition: -moz-transform 1s;
	-o-transition: -o-transform 1s;
	-ms-transition: -ms-transform 1s;
}

.cube div {
	position: absolute;
	text-align: center;
	overflow: hidden;
}

.cube img {
	display: none;
	margin-left: auto;
	margin-right: auto;
}

.cube a {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}

/** example 1 **/
	
.example1 .cube {
	height: 320px;
	width: 320px;
}

.example1 .cube.step1 {
	transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	-webkit-transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
	-o-transform: rotateY(0deg);
}

.example1 .cube.step2 {
	transform: rotateX(90deg);
	-moz-transform: rotateX(90deg);
	-webkit-transform: rotateX(90deg);
	-ms-transform: rotateX(90deg);
	-o-transform: rotateX(90deg);
}

.example1 .cube.step3 {
	transform: rotateX(180deg);
	-moz-transform: rotateX(180deg);
	-webkit-transform: rotateX(180deg);
	-ms-transform: rotateX(180deg)
	-o-transform: rotateX(180deg);
}

.example1 .cube.step4 {
	transform: rotateX(270deg);
	-moz-transform: rotateX(270deg);
	-webkit-transform: rotateX(270deg);
	-ms-transform: rotateX(270deg);
	-o-transform: rotateX(270deg);
}

.example1 .cube div {
	height: 320px;
	width: 320px;
}

.example1 .cube-front {
	transform: rotateY(0deg) translateZ(160px);
	-moz-transform: rotateY(0deg) translateZ(160px);
	-webkit-transform: rotateY(0deg) translateZ(160px);
	-o-transform: rotateY(0deg) translateZ(160px);
	-ms-transform: rotateY(0deg) translateZ(160px);
	background-color: #CC7473;
}

.example1 .cube-back {
	transform: rotateX(-180deg) translateZ(160px);
	-moz-transform: rotateX(-180deg) translateZ(160px);
	-webkit-transform: rotateX(-180deg) translateZ(160px);
	-o-transform: rotateX(-180deg) translateZ(160px);
	-ms-transform: rotateX(-180deg) translateZ(160px);
	background-color: #9FB3D4;
}

.example1 .cube-right {
	transform: rotateY(90deg) translateZ(160px);
	-moz-transform: rotateY(90deg) translateZ(160px);
	-webkit-transform: rotateY(90deg) translateZ(160px);
	-o-transform: rotateY(90deg) translateZ(160px);
	-ms-transform: rotateY(90deg) translateZ(160px);
	background-color: blue;
	right: 0;
}

.example1 .cube-left {
	transform: rotateY(-90deg) translateZ(160px);
	-moz-transform: rotateY(-90deg) translateZ(160px);
	-webkit-transform: rotateY(-90deg) translateZ(160px);
	-o-transform: rotateY(-90deg) translateZ(160px);
	-ms-transform: rotateY(-90deg) translateZ(160px);
	background-color: blue;
}

.example1 .cube-top {
	transform: rotateX(90deg) translateZ(160px);
	-moz-transform: rotateX(90deg) translateZ(160px);
	-webkit-transform: rotateX(90deg) translateZ(160px);
	-o-transform: rotateX(90deg) translateZ(160px);
	-ms-transform: rotateX(90deg) translateZ(160px);
	background-color: #DBD05C;
}

.example1 .cube-bottom {
	transform: rotateX(-90deg) translateZ(160px);
	-moz-transform: rotateX(-90deg) translateZ(160px);
	-webkit-transform: rotateX(-90deg) translateZ(160px);
	-o-transform: rotateX(-90deg) translateZ(160px);
	-ms-transform: rotateX(-90deg) translateZ(160px);
	background-color: #88C58A;
}

.example1 .cube .step1-img1 {
	margin-top: 126px;
	margin-bottom: 16px;
}

.example1 .cube .step2-img1 {
	position: absolute;
	top: 71px;
	left: 135px;
}

.example1 .cube .step2-img2 {
	position: absolute;
	top: 165px;
	left: 88px;
}

.example1 .cube .step3-img1 {
	margin-top: 100px;
	margin-bottom: 13px;
}

.example1 .cube .step3-img2 {
	position: absolute;
	right: 30px;
	bottom: 30px;
}

.example1 .cube .step4-img1 {
	position: absolute;
	left: 33px;
	top: 72px;
}

.example1 .cube .step4-img2 {
	position: absolute;
	left: 154px;
	top: 126px;
}

.example1 .cube .step4-img3 {
	position: absolute;
	left: 16px;
	top: 150px;
}

.example1 .cube .step4-img4 {
	position: absolute;
	left: 97px;
	bottom: 72px;
}

/** example 2 **/
	
.example2 .cube {
	height: 320px;
	width: 320px;
}

.example2 .cube.step1 {
	transform: rotateX(0deg);
	-moz-transform: rotateX(0deg);
	-webkit-transform: rotateX(0deg);
	-ms-transform: rotateX(0deg);
	-o-transform: rotateX(0deg);
}

.example2 .cube.step2 {
	transform: rotateY(90deg);
	-moz-transform: rotateY(90deg);
	-webkit-transform: rotateY(90deg);
	-ms-transform: rotateY(90deg);
	-o-transform: rotateY(90deg);
}

.example2 .cube.step3 {
	transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	-webkit-transform: rotateY(180deg);
	-ms-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
}

.example2 .cube.step4 {
	transform: rotateY(270deg);
	-moz-transform: rotateY(270deg);
	-webkit-transform: rotateY(270deg);
	-ms-transform: rotateY(270deg);
	-o-transform: rotateY(270deg);
}

.example2 .cube div {
	height: 320px;
	width: 320px;
}

.example2 .cube-front {
	transform: rotateY(0deg) translateZ(160px);
	-moz-transform: rotateY(0deg) translateZ(160px);
	-webkit-transform: rotateY(0deg) translateZ(160px);
	-o-transform: rotateY(0deg) translateZ(160px);
	-ms-transform: rotateY(0deg) translateZ(160px);
	background-color: #CC7473;
}

.example2 .cube-back {
	transform: rotateY(180deg) translateZ(160px);
	-moz-transform: rotateY(180deg) translateZ(160px);
	-webkit-transform: rotateY(180deg) translateZ(160px);
	-o-transform: rotateY(180deg) translateZ(160px);
	-ms-transform: rotateY(180deg) translateZ(160px);
	background-color: #9FB3D4;
}

.example2 .cube-right {
	transform: rotateY(90deg) translateZ(160px);
	-moz-transform: rotateY(90deg) translateZ(160px);
	-webkit-transform: rotateY(90deg) translateZ(160px);
	-o-transform: rotateY(90deg) translateZ(160px);
	-ms-transform: rotateY(90deg) translateZ(160px);
	background-color: #DBD05C;
	right: 0;
}

.example2 .cube-left {
	transform: rotateY(-90deg) translateZ(160px);
	-moz-transform: rotateY(-90deg) translateZ(160px);
	-webkit-transform: rotateY(-90deg) translateZ(160px);
	-o-transform: rotateY(-90deg) translateZ(160px);
	-ms-transform: rotateY(-90deg) translateZ(160px);
	background-color: #88C58A;
}

.example2 .cube-top {
	transform: rotateX(90deg) translateZ(160px);
	-moz-transform: rotateX(90deg) translateZ(160px);
	-webkit-transform: rotateX(90deg) translateZ(160px);
	-o-transform: rotateX(90deg) translateZ(160px);
	-ms-transform: rotateX(90deg) translateZ(160px);
	background-color: blue;
}

.example2 .cube-bottom {
	transform: rotateX(-90deg) translateZ(160px);
	-moz-transform: rotateX(-90deg) translateZ(160px);
	-webkit-transform: rotateX(-90deg) translateZ(160px);
	-o-transform: rotateX(-90deg) translateZ(160px);
	-ms-transform: rotateX(-90deg) translateZ(160px);
	background-color: blue;
}

.example2 .cube .step1-img1 {
	margin-top: 126px;
	margin-bottom: 16px;
}

.example2 .cube .step2-img1 {
	position: absolute;
	top: 71px;
	left: 135px;
}

.example2 .cube .step2-img2 {
	position: absolute;
	top: 165px;
	left: 88px;
}

.example2 .cube .step3-img1 {
	margin-top: 100px;
	margin-bottom: 13px;
}

.example2 .cube .step3-img2 {
	position: absolute;
	right: 30px;
	bottom: 30px;
}

.example2 .cube .step4-img1 {
	position: absolute;
	left: 33px;
	top: 72px;
}

.example2 .cube .step4-img2 {
	position: absolute;
	left: 154px;
	top: 126px;
}

.example2 .cube .step4-img3 {
	position: absolute;
	left: 16px;
	top: 150px;
}

.example2 .cube .step4-img4 {
	position: absolute;
	left: 97px;
	bottom: 72px;
}

/** example 3 **/
	
.example3 .cube {
	height: 320px;
	width: 320px;
}

.example3 .cube.step1 {
	transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	-webkit-transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
	-o-transform: rotateY(0deg);
}

.example3 .cube.step2 {
	transform: rotateX(90deg);
	-moz-transform: rotateX(90deg);
	-webkit-transform: rotateX(90deg);
	-ms-transform: rotateX(90deg);
	-o-transform: rotateX(90deg);
}

.example3 .cube.step3 {
	transform: rotateY(90deg);
	-moz-transform: rotateY(90deg);
	-webkit-transform: rotateY(90deg);
	-ms-transform: rotateY(90deg);
	-o-transform: rotateY(90deg);
}

.example3 .cube.step4 {
	transform: rotateY(180deg);
	-moz-transform: rotateY(180deg);
	-webkit-transform: rotateY(180deg);
	-ms-transform: rotateY(180deg);
	-o-transform: rotateY(180deg);
}

.example3 .cube div {
	height: 320px;
	width: 320px;
}

.example3 .cube-front {
	transform: rotateY(0deg) translateZ(160px);
	-moz-transform: rotateY(0deg) translateZ(160px);
	-webkit-transform: rotateY(0deg) translateZ(160px);
	-o-transform: rotateY(0deg) translateZ(160px);
	-ms-transform: rotateY(0deg) translateZ(160px);
	background-color: #CC7473;
}

.example3 .cube-back {
	transform: rotateY(180deg) translateZ(160px);
	-moz-transform: rotateY(180deg) translateZ(160px);
	-webkit-transform: rotateY(180deg) translateZ(160px);
	-o-transform: rotateY(180deg) translateZ(160px);
	-ms-transform: rotateY(180deg) translateZ(160px);
	background-color: #DBD05C;
}

.example3 .cube-right {
	transform: rotateY(90deg) translateZ(160px);
	-moz-transform: rotateY(90deg) translateZ(160px);
	-webkit-transform: rotateY(90deg) translateZ(160px);
	-o-transform: rotateY(90deg) translateZ(160px);
	-ms-transform: rotateY(90deg) translateZ(160px);
	background-color: black; /** not visible **/
}

.example3 .cube-left {
	transform: rotateY(-90deg) translateZ(160px);
	-moz-transform: rotateY(-90deg) translateZ(160px);
	-webkit-transform: rotateY(-90deg) translateZ(160px);
	-o-transform: rotateY(-90deg) translateZ(160px);
	-ms-transform: rotateY(-90deg) translateZ(160px);
	background-color: #9FB3D4;
}

.example3 .cube-top {
	transform: rotateX(90deg) translateZ(160px);
	-moz-transform: rotateX(90deg) translateZ(160px);
	-webkit-transform: rotateX(90deg) translateZ(160px);
	-o-transform: rotateX(90deg) translateZ(160px);
	-ms-transform: rotateX(90deg) translateZ(160px);
	background: black; /** not visible **/
}

.example3 .cube-bottom {
	transform: rotateX(-90deg) translateZ(160px);
	-moz-transform: rotateX(-90deg) translateZ(160px);
	-webkit-transform: rotateX(-90deg) translateZ(160px);
	-o-transform: rotateX(-90deg) translateZ(160px);
	-ms-transform: rotateX(-90deg) translateZ(160px);
	background-color: #88C58A;
}

.example3 .cube .step1-img1 {
	margin-top: 126px;
	margin-bottom: 16px;
}

.example3 .cube .step2-img1 {
	position: absolute;
	top: 71px;
	left: 135px;
}

.example3 .cube .step2-img2 {
	position: absolute;
	top: 165px;
	left: 88px;
}

.example3 .cube .step3-img1 {
	margin-top: 100px;
	margin-bottom: 13px;
}

.example3 .cube .step3-img2 {
	position: absolute;
	right: 30px;
	bottom: 30px;
}

.example3 .cube .step4-img1 {
	position: absolute;
	left: 33px;
	top: 72px;
}

.example3 .cube .step4-img2 {
	position: absolute;
	left: 154px;
	top: 126px;
}

.example3 .cube .step4-img3 {
	position: absolute;
	left: 16px;
	top: 150px;
}

.example3 .cube .step4-img4 {
	position: absolute;
	left: 97px;
	bottom: 72px;
}

/** example 4 **/
	
.example4 .cube {
	height: 284px;
	width: 720px;
}

.example4 .cube.step1 {
	transform: rotateY(0deg);
	-moz-transform: rotateY(0deg);
	-webkit-transform: rotateY(0deg);
	-ms-transform: rotateY(0deg);
	-o-transform: rotateY(0deg);
}

.example4 .cube.step2 {
	transform: rotateX(90deg);
	-moz-transform: rotateX(90deg);
	-webkit-transform: rotateX(90deg);
	-ms-transform: rotateX(90deg);
	-o-transform: rotateX(90deg);
}

.example4 .cube.step3 {
	transform: rotateX(180deg) rotateY(0deg);
	-moz-transform: rotateX(180deg) rotateY(0deg);
	-webkit-transform: rotateX(180deg) rotateY(0deg);
	-ms-transform: rotateX(180deg) rotateY(0deg);
	-o-transform: rotateX(180deg) rotateY(0deg);
}

.example4 .cube.step4 {
	transform: rotateX(270deg) rotateY(0deg);
	-moz-transform: rotateX(270deg) rotateY(0deg);
	-webkit-transform: rotateX(270deg) rotateY(0deg);
	-ms-transform: rotateX(270deg) rotateY(0deg);
	-o-transform: rotateX(270deg) rotateY(0deg);
}

.example4 .cube div {
	height: 284px;
	width: 720px;
}

.example4 .cube-front {
	transform: rotateY(0deg) translateZ(142px);
	-moz-transform: rotateY(0deg) translateZ(142px);
	-webkit-transform: rotateY(0deg) translateZ(142px);
	-o-transform: rotateY(0deg) translateZ(142px);
	-ms-transform: rotateY(0deg) translateZ(142px);
	background-color: #CC7473;
}

.example4 .cube-back {
	transform: rotateX(-180deg) translateZ(142px);
	-moz-transform: rotateX(-180deg) translateZ(142px);
	-webkit-transform: rotateX(-180deg) translateZ(142px);
	-o-transform: rotateX(-180deg) translateZ(142px);
	-ms-transform: rotateX(-180deg) translateZ(142px);
	background-color: #9FB3D4;
}

.example4 .cube-right {
	transform: rotateY(90deg) translateZ(142px);
	-moz-transform: rotateY(90deg) translateZ(142px);
	-webkit-transform: rotateY(90deg) translateZ(142px);
	-o-transform: rotateY(90deg) translateZ(142px);
	-ms-transform: rotateY(90deg) translateZ(142px);
	background-color: blue;
	width: 284px !important;
	right: 0;
}

.example4  .cube-left {
	transform: rotateY(-90deg) translateZ(142px);
	-moz-transform: rotateY(-90deg) translateZ(142px);
	-webkit-transform: rotateY(-90deg) translateZ(142px);
	-o-transform: rotateY(-90deg) translateZ(142px);
	-ms-transform: rotateY(-90deg) translateZ(142px);
	background-color: blue;
	width: 284px !important;
}

.example4 .cube-top {
	transform: rotateX(90deg) translateZ(142px);
	-moz-transform: rotateX(90deg) translateZ(142px);
	-webkit-transform: rotateX(90deg) translateZ(142px);
	-o-transform: rotateX(90deg) translateZ(142px);
	-ms-transform: rotateX(90deg) translateZ(142px);
	background-color: #DBD05C;
}

.example4 .cube-bottom {
	transform: rotateX(-90deg) translateZ(142px);
	-moz-transform: rotateX(-90deg) translateZ(142px);
	-webkit-transform: rotateX(-90deg) translateZ(142px);
	-o-transform: rotateX(-90deg) translateZ(142px);
	-ms-transform: rotateX(-90deg) translateZ(142px);
	background-color: #88C58A;
}

.example4 .cube .step1-img1 {
	margin-top: 108px;
	margin-bottom: 16px;
}

.example4 .cube .step2-img1 {
	position: absolute;
	top: 53px;
	left: 335px;
}

.example4 .cube .step2-img2 {
	position: absolute;
	top: 146px;
	left: 288px;
}

.example4 .cube .step3-img1 {
	margin-top: 64px;
	margin-bottom: 13px;
}

.example4 .cube .step3-img2 {
	position: absolute;
	right: 230px;
	bottom: 30px;
}

.example4 .cube .step4-img1 {
	position: absolute;
	left: 233px;
	top: 54px;
}

.example4 .cube .step4-img2 {
	position: absolute;
	left: 354px;
	top: 108px;
}

.example4 .cube .step4-img3 {
	position: absolute;
	left: 216px;
	top: 132px;
}

.example4 .cube .step4-img4 {
	position: absolute;
	left: 297px;
	bottom: 54px;
}

/** animations **/

/*
==============================================
slideLeft
==============================================
*/

.slideLeft {
	animation-name: slideLeft;
	-webkit-animation-name: slideLeft;	

	animation-duration: 1s;	
	-webkit-animation-duration: 1s;

	animation-timing-function: linear;	
	-webkit-animation-timing-function: linear;		

	visibility: visible !important;	
}

@keyframes slideLeft {
	0% {
		transform: translateX(150%);
	}
	50%{
		transform: translateX(-8%);
	}
	65%{
		transform: translateX(4%);
	}
	80%{
		transform: translateX(-4%);
	}
	95%{
		transform: translateX(2%);
	}			
	100% {
		transform: translateX(0%);
	}
}

@-webkit-keyframes slideLeft {
	0% {
		-webkit-transform: translateX(150%);
	}
	50%{
		-webkit-transform: translateX(-8%);
	}
	65%{
		-webkit-transform: translateX(4%);
	}
	80%{
		-webkit-transform: translateX(-4%);
	}
	95%{
		-webkit-transform: translateX(2%);
	}			
	100% {
		-webkit-transform: translateX(0%);
	}
}

/*
==============================================
slideRight
==============================================
*/


.slideRight {
	animation-name: slideRight;
	-webkit-animation-name: slideRight;	

	animation-duration: 1s;	
	-webkit-animation-duration: 1s;

	animation-timing-function: linear;	
	-webkit-animation-timing-function: linear;		

	visibility: visible !important;	
}

@keyframes slideRight {
	0% {
		transform: translateX(-150%);
	}
	50%{
		transform: translateX(8%);
	}
	65%{
		transform: translateX(-4%);
	}
	80%{
		transform: translateX(4%);
	}
	95%{
		transform: translateX(-2%);
	}			
	100% {
		transform: translateX(0%);
	}	
}

@-webkit-keyframes slideRight {
	0% {
		-webkit-transform: translateX(-150%);
	}
	50%{
		-webkit-transform: translateX(8%);
	}
	65%{
		-webkit-transform: translateX(-4%);
	}
	80%{
		-webkit-transform: translateX(4%);
	}
	95%{
		-webkit-transform: translateX(-2%);
	}			
	100% {
		-webkit-transform: translateX(0%);
	}
}

/*
==============================================
fadeIn
==============================================
*/

.fadeIn {
	animation-name: fadeIn;
	-webkit-animation-name: fadeIn;	

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-timing-function: ease-in-out;	
	-webkit-animation-timing-function: ease-in-out;		

	visibility: visible !important;	
}

@keyframes fadeIn {
	0% {
		transform: scale(0);
		opacity: 0.0;		
	}
	60% {
		transform: scale(1.1);	
	}
	80% {
		transform: scale(0.9);
		opacity: 1;	
	}	
	100% {
		transform: scale(1);
		opacity: 1;	
	}		
}

@-webkit-keyframes fadeIn {
	0% {
		-webkit-transform: scale(0);
		opacity: 0.0;		
	}
	60% {
		-webkit-transform: scale(1.1);
	}
	80% {
		-webkit-transform: scale(0.9);
		opacity: 1;	
	}	
	100% {
		-webkit-transform: scale(1);
		opacity: 1;	
	}		
}

/*
==============================================
slideDown
==============================================
*/


.slideDown {
	animation-name: slideDown;
	-webkit-animation-name: slideDown;	

	animation-duration: 1s;	
	-webkit-animation-duration: 1s;

	animation-timing-function: ease;	
	-webkit-animation-timing-function: ease;	

	visibility: visible !important;						
}

@keyframes slideDown {
	0% {
		transform: translateY(-100%);
	}
	50%{
		transform: translateY(8%);
	}
	65%{
		transform: translateY(-4%);
	}
	80%{
		transform: translateY(4%);
	}
	95%{
		transform: translateY(-2%);
	}			
	100% {
		transform: translateY(0%);
	}		
}

@-webkit-keyframes slideDown {
	0% {
		-webkit-transform: translateY(-100%);
	}
	50%{
		-webkit-transform: translateY(8%);
	}
	65%{
		-webkit-transform: translateY(-4%);
	}
	80%{
		-webkit-transform: translateY(4%);
	}
	95%{
		-webkit-transform: translateY(-2%);
	}			
	100% {
		-webkit-transform: translateY(0%);
	}	
}

/*
==============================================
slideUp
==============================================
*/


.slideUp {
	animation-name: slideUp;
	-webkit-animation-name: slideUp;	

	animation-duration: 1s;	
	-webkit-animation-duration: 1s;

	animation-timing-function: ease;	
	-webkit-animation-timing-function: ease;

	visibility: visible !important;			
}

@keyframes slideUp {
	0% {
		transform: translateY(100%);
	}
	50%{
		transform: translateY(-8%);
	}
	65%{
		transform: translateY(4%);
	}
	80%{
		transform: translateY(-4%);
	}
	95%{
		transform: translateY(2%);
	}			
	100% {
		transform: translateY(0%);
	}	
}

@-webkit-keyframes slideUp {
	0% {
		-webkit-transform: translateY(100%);
	}
	50%{
		-webkit-transform: translateY(-8%);
	}
	65%{
		-webkit-transform: translateY(4%);
	}
	80%{
		-webkit-transform: translateY(-4%);
	}
	95%{
		-webkit-transform: translateY(2%);
	}			
	100% {
		-webkit-transform: translateY(0%);
	}	
}

/** ie >= 10 support **/

_:-ms-input-placeholder, :root .cube-wrap {
	-webkit-perspective: none;
	-moz-perspective: none;
	-o-perspective: none;
	-ms-perspective: none;
	perspective: none;
	-webkit-perspective-origin: none;
	-moz-perspective-origin: none;
	-moz-transform-origin: none;
	-o-perspective-origin: none;
	-ms-perspective-origin: none;
	perspective-origin: none;
	transform: none !important;
	-moz-transform: none !important;
	-webkit-transform: none !important;
	-o-transform: none !important;
	-ms-transform: none !important;
}

_:-ms-input-placeholder, :root .cube-wrap div {
	transform: none !important;
	-moz-transform: none !important;
	-webkit-transform: none !important;
	-o-transform: none !important;
	-ms-transform: none !important;
}

_:-ms-input-placeholder, :root .cube-wrap img {
	display: block !important;
    -webkit-animation: none !important;;
    animation: none !important;
}

_:-ms-input-placeholder, :root .cube-wrap .cube div {
	filter: opacity(0) !important;
	opacity: 0 !important;
}

_:-ms-input-placeholder, :root .cube-wrap.example1 .step1 .cube-front {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-ms-input-placeholder, :root .cube-wrap.example1 .step2 .cube-bottom {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-ms-input-placeholder, :root .cube-wrap.example1 .step3 .cube-back {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-ms-input-placeholder, :root .cube-wrap.example1 .step4 .cube-top {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-ms-input-placeholder, :root .cube-wrap.example2 .step1 .cube-front {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-ms-input-placeholder, :root .cube-wrap.example2 .step2 .cube-left {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-ms-input-placeholder, :root .cube-wrap.example2 .step3 .cube-back {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-ms-input-placeholder, :root .cube-wrap.example2 .step4 .cube-right {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-ms-input-placeholder, :root .cube-wrap.example3 .step1 .cube-front {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-ms-input-placeholder, :root .cube-wrap.example3 .step2 .cube-bottom {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-ms-input-placeholder, :root .cube-wrap.example3 .step3 .cube-left {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-ms-input-placeholder, :root .cube-wrap.example3 .step4 .cube-back {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-ms-input-placeholder, :root .cube-wrap.example4 .step1 .cube-front {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-ms-input-placeholder, :root .cube-wrap.example4 .step2 .cube-bottom {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-ms-input-placeholder, :root .cube-wrap.example4 .step3 .cube-back {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-ms-input-placeholder, :root .cube-wrap.example4 .step4 .cube-top {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

/** opera support **/

_:-o-prefocus, body:last-child .cube-wrap {
	-webkit-perspective: none;
	-moz-perspective: none;
	-o-perspective: none;
	-ms-perspective: none;
	perspective: none;
	-webkit-perspective-origin: none;
	-moz-perspective-origin: none;
	-moz-transform-origin: none;
	-o-perspective-origin: none;
	-ms-perspective-origin: none;
	perspective-origin: none;
	transform: none !important;
	-moz-transform: none !important;
	-webkit-transform: none !important;
	-o-transform: none !important;
	-ms-transform: none !important;
}

_:-o-prefocus, body:last-child .cube-wrap div {
	transform: none !important;
	-moz-transform: none !important;
	-webkit-transform: none !important;
	-o-transform: none !important;
	-ms-transform: none !important;
}

_:-o-prefocus, body:last-child .cube-wrap img {
	display: block !important;
    -webkit-animation: none !important;;
    animation: none !important;
}

_:-o-prefocus, body:last-child .cube-wrap .cube div {
	filter: opacity(0) !important;
	opacity: 0 !important;
}

_:-o-prefocus, body:last-child .cube-wrap.example1 .step1 .cube-front {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-o-prefocus, body:last-child .cube-wrap.example1 .step2 .cube-bottom {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-o-prefocus, body:last-child .cube-wrap.example1 .step3 .cube-back {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-o-prefocus, body:last-child .cube-wrap.example1 .step4 .cube-top {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-o-prefocus, body:last-child .cube-wrap.example2 .step1 .cube-front {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-o-prefocus, body:last-child .cube-wrap.example2 .step2 .cube-left {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-o-prefocus, body:last-child .cube-wrap.example2 .step3 .cube-back {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-o-prefocus, body:last-child .cube-wrap.example2 .step4 .cube-right {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-o-prefocus, body:last-child .cube-wrap.example3 .step1 .cube-front {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-o-prefocus, body:last-child .cube-wrap.example3 .step2 .cube-bottom {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-o-prefocus, body:last-child .cube-wrap.example3 .step3 .cube-left {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-o-prefocus, body:last-child .cube-wrap.example3 .step4 .cube-back {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-o-prefocus, body:last-child .cube-wrap.example4 .step1 .cube-front {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-o-prefocus, body:last-child .cube-wrap.example4 .step2 .cube-bottom {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-o-prefocus, body:last-child .cube-wrap.example4 .step3 .cube-back {
	filter: opacity(100) !important;
	opacity: 1 !important;
}

_:-o-prefocus, body:last-child .cube-wrap.example4 .step4 .cube-top {
	filter: opacity(100) !important;
	opacity: 1 !important;
}