.loading {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: #fff;
	z-index: 99;
}
.loading>div {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	-webkit-perspective:700px;
	perspective: 700px;
	white-space: nowrap;
}
.loading>div>span {
	display: inline-block;
	font-weight: 600;
	animation: flip 4.8s infinite linear;
	transform-origin: 0 70%;
	transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
}
@keyframes flip {
	35%	{
		transform: rotateX(360deg);
	}
	100% {
		transform: rotatex(360deg);
	}
}
.loading>div>span:nth-child(odd) {
	color: #222;
}
.loading>div>span:nth-child(even) {
	color: #777;
}
.loading>div>span:nth-child(2) {
	animation-delay: 0.4s;
}
.loading>div>span:nth-child(3) {
	animation-delay: 0.8s;
}
.loading>div>span:nth-child(4) {
	animation-delay: 1.2s;
}
.loading>div>span:nth-child(5) {
	animation-delay: 1.6s;
}
.loading>div>span:nth-child(6) {
	animation-delay: 2.0s
}
.loading>div>span:nth-child(7) {
	animation-delay: 2.4s
}
.loading>div>span:nth-child(8) {
	animation-delay: 2.8s
}