.loader-container {
	position: relative;
	float: left;
	width: 100%;
	height: 200px;
}

.loader-container .loader {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}


.square-rotate-3d .loader {
	width: 100px;
	height: 100px;
}

.square-rotate-3d .loader .square {
	margin-top: 25%;
	margin-left: 25%;
	width: 50%;
	height: 50%;
	background-color: #0eb5cd;
	animation: squareRotate3d 2s infinite ease-in-out;
}

@keyframes squareRotate3d {
	25% {
		transform: perspective(100px) rotateX(180deg) rotateY(0);
	}
	50% {
		transform: perspective(100px) rotateX(180deg) rotateY(-180deg);
	}
	75% {
		transform: perspective(100px) rotateX(0) rotateY(-180deg);
	}
	100% {
		transform: perspective(100px) rotateX(0) rotateY(0);
	}
}