.jgb_spinner-cube-folding {
	width: 1em;
	height: 1em;
	position: relative;
	transform: rotateZ(45deg);

	>div {
		background-color: initial;
		float: left;
		width: 50%;
		height: 50%;
		position: relative;
		transform: scale(1.1);

		&:nth-child(2) {
			transform: scale(1.1) rotateZ(90deg);
		}

		&:nth-child(4) {
			transform: scale(1.1) rotateZ(180deg);
		}

		&:nth-child(3) {
			transform: scale(1.1) rotateZ(270deg);
		}

		&:nth-child(2)::before {
			animation-delay: 0.3s;
		}

		&:nth-child(4)::before {
			animation-delay: 0.6s;
		}

		&:nth-child(3)::before {
			animation-delay: 0.9s;
		}
	}

	>div::before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: currentColor;
		animation: sk-foldCubeAngle 2.4s infinite linear both;
		transform-origin: 100% 100%;
	}
}

@keyframes sk-foldCubeAngle {
	0% {
		transform: perspective(140px) rotateX(-180deg);
		opacity: 0;
	}

	10% {
		transform: perspective(140px) rotateX(-180deg);
		opacity: 0;
	}

	25% {
		transform: perspective(140px) rotateX(0deg);
		opacity: 1;
	}

	75% {
		transform: perspective(140px) rotateX(0deg);
		opacity: 1;
	}

	90% {
		transform: perspective(140px) rotateY(180deg);
		opacity: 0;
	}

	100% {
		transform: perspective(140px) rotateY(180deg);
		opacity: 0;
	}
}