.loading {
	display:block;
	position:fixed;
	width:100%;
	height:100%;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background:#111;
	opacity:1;
	z-index:9999;
	transition:all 1.5s ease-in-out 2s
}
.loading .loading-wrapper {
	position:relative;
	left:calc(50% - 25px);
	top:calc(50% - 20px);
	width:50px;
	height:40px;
	transition:all 2s ease-in-out 1s
}
.loading .loading-wrapper .rec {
	float:left;
	height:100%;
	width:6px;
	margin-right:3px;
	background:#fff;
	animation:loading 1.2s infinite ease-in-out
}
.loading .loading-wrapper .rec:last-child {
	margin-right:0
}
.loading .loading-wrapper .r2 {
	animation-delay:-1.1s
}
.loading .loading-wrapper .r3 {
	animation-delay:-1s
}
.loading .loading-wrapper .r4 {
animation-delay:-.9s
}
.loading .loading-wrapper .r5 {
animation-delay:-.8s
}
@keyframes loading {
0%, 40%, to {
-ms-transform:scaleY(.5);
transform:scaleY(.5)
}
20% {
-ms-transform:scaleY(1);
transform:scaleY(1)
}
}
.loading.loaded {
	visibility:hidden;
	opacity:0
}
.loaded .loading-wrapper {
	opacity:0
}