// Color variables (appears count calculates by raw css)
@color0: #ffffff; // Appears 7 times

// Width variables (appears count calculates by raw css)
@width1: 1em; // Appears 3 times

// Height variables (appears count calculates by raw css)
@height1: 5em; // Appears 2 times
@height2: 4em; // Appears 5 times

#load-content {
	background-color: #0097a7;
	height: 100%;
	position: fixed;
	width: 100%;
	z-index: 999999;
}
.loader {
	-ms-transform: translateZ(0);
	-webkit-animation-delay: -0.16s;
	-webkit-animation: load1 1s infinite ease-in-out;
	-webkit-transform: translateZ(0);
	animation-delay: -0.16s;
	animation: load1 1s infinite ease-in-out;
	background: @color0;
	font-size: 11px;
	height: @height2;
	margin: 88px auto;
	position: absolute;
	right: 50%;
	text-indent: -9999em;
	top: 33%;
	transform: translateZ(0);
	width: @width1;
	&:before {
		-webkit-animation-delay: -0.32s;
		-webkit-animation: load1 1s infinite ease-in-out;
		animation-delay: -0.32s;
		animation: load1 1s infinite ease-in-out;
		background: @color0;
		content: '';
		height: @height2;
		left: -1.5em;
		position: absolute;
		top: 0;
		width: @width1;
	}
	&:after {
		-webkit-animation: load1 1s infinite ease-in-out;
		animation: load1 1s infinite ease-in-out;
		background: @color0;
		content: '';
		height: @height2;
		left: 1.5em;
		position: absolute;
		top: 0;
		width: @width1;
	}
}

@-webkit-keyframes load1 {
	0%, 80%, 100% {
		box-shadow: 0 0 @color0;
		height: @height2;
	}
	40% {
		box-shadow: 0 -2em @color0;
		box-shadow: 0 -2em @color0;
		height: @height1;
		height: @height1;
	}
}

@keyframes load1 {
	0%, 80%, 100% {
		box-shadow: 0 0 @color0;
		height: @height2;
	}
	40% {
		box-shadow: 0 -2em @color0;
		box-shadow: 0 -2em @color0;
		height: @height1;
		height: @height1;
	}
}
