@include keyframes(loader) {
	0%, 10%, 100% {
		width: 80px;
		height: 80px;
	}
	65% {
		width: 150px;
		height: 150px;
	}
}
@include keyframes(loaderBlock) {
	0%, 30% { 
		@include transform(rotate(0));
	}
	55% {
		background-color: #F37272;
	}
	100% {
		@include transform(rotate(90deg));

	}
}
@include keyframes(loaderBlockInverse) {
	0%, 20% { 
		@include transform(rotate(0));
	}
	55% {
		background-color: #F37272;
	}
	100% {
		@include transform(rotate(-90deg));
	}
}
.loader {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 80px;
	height: 80px;
	@include transform(translate(-50%, -50%) rotate(45deg) translate3d(0,0,0));
	@include animation(loader 1.2s infinite ease-in-out);

	span {
		position: absolute;
		display: block;
		width: 40px;
		height: 40px;
		background-color: #EE4040;
		@include animation(loaderBlock 1.2s infinite ease-in-out both);

		&:nth-child(1) {
			top: 0;
			left: 0;
		}
		&:nth-child(2) {
			top: 0;
			right: 0;
			@include animation(loaderBlockInverse 1.2s infinite ease-in-out both);
		}
		&:nth-child(3) {
			bottom: 0;
			left: 0;
			@include animation(loaderBlockInverse 1.2s infinite ease-in-out both);
		}
		&:nth-child(4) {
			bottom: 0;
			right: 0;
		}
	}
}

body {
  background-color: #584E4A;
}