body {
	margin: 0;
	padding: 0;
}

.loader {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 80px;
	height: 80px;
	box-sizing: border-box;
	border: 3px solid #9f1742;
	animation: animate 2s linear infinite;
}

.loader:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #9f1742;
	animation: animateBg 2s linear infinite;
}

@keyframes animate {
	0% {
		transform: translate(-50%, -50%) rotate(0deg);
	}
	25% {
		transform: translate(-50%, -50%) rotate(180deg);
	}
	50% {
		transform: translate(-50%, -50%) rotate(180deg);
	}
	75% {
		transform: translate(-50%, -50%) rotate(360deg);
	}
	100% {
		transform: translate(-50%, -50%) rotate(360deg);
	}
}

@keyframes animateBg {
	0% {
		height: 0;
	}
	25% {
		height: 0;
	}
	50% {
		height: 100%;
	}
	75% {
		height: 100%;
	}
	100% {
		height: 0;
	}
}