Edit in JSFiddle

<div class="loader"></div>

.loader {
	margin: 100px auto 0;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	animation: 
    color 4s infinite ease,
    animation 2s infinite linear;
}

@keyframes color {
  0%{
    background-color: rgba(30,30,30,1);
  }
  50%{
    background-color: rgba(30,30,30,0)
  }
  100%{
    background-color: rgba(30,30,30,1);
  }
}

@keyframes animation {
	0%,
	100% {
		box-shadow: 0 -60px 0 0.40px #bf103c, 40px -40px 0 0 #bf103c, 60px 0 0 -10px #bf103c, 40px 40px 0 -10px #bf103c, 0 60px 0 -10px #bf103c, -40px 40px 0 -10px #bf103c, -60px 0 0 -10px #bf103c, -40px -40px 0 0 #bf103c;
	}
	12.5% {
		box-shadow: 0 -60px 0 0 #bf103c, 40px -40px 0 0.40px #bf103c, 60px 0 0 0 #bf103c, 40px 40px 0 -10px #bf103c, 0 60px 0 -10px #bf103c, -40px 40px 0 -10px #bf103c, -60px 0 0 -10px #bf103c, -40px -40px 0 -10px #bf103c;
	}
	25% {
		box-shadow: 0 -60px 0 -10px #bf103c, 40px -40px 0 0 #bf103c, 60px 0 0 0.40px #bf103c, 40px 40px 0 0 #bf103c, 0 60px 0 -10px #bf103c, -40px 40px 0 -10px #bf103c, -60px 0 0 -10px #bf103c, -40px -40px 0 -10px #bf103c;
	}
	37.5% {
		box-shadow: 0 -60px 0 -10px #bf103c, 40px -40px 0 -10px #bf103c, 60px 0 0 0 #bf103c, 40px 40px 0 0.40px #bf103c, 0 60px 0 0 #bf103c, -40px 40px 0 -10px #bf103c, -60px 0 0 -10px #bf103c, -40px -40px 0 -10px #bf103c;
	}
	50% {
		box-shadow: 0 -60px 0 -10px #bf103c, 40px -40px 0 -10px #bf103c, 60px 0 0 -10px #bf103c, 40px 40px 0 0 #bf103c, 0 60px 0 0.40px #bf103c, -40px 40px 0 0 #bf103c, -60px 0 0 -10px #bf103c, -40px -40px 0 -10px #bf103c;
	}
	62.5% {
		box-shadow: 0 -60px 0 -10px #bf103c, 40px -40px 0 -10px #bf103c, 60px 0 0 -10px #bf103c, 40px 40px 0 -10px #bf103c, 0 60px 0 0 #bf103c, -40px 40px 0 0.40px #bf103c, -60px 0 0 0 #bf103c, -40px -40px 0 -10px #bf103c;
	}
	75% {
		box-shadow: 0 -60px 0 -10px #bf103c, 40px -40px 0 -10px #bf103c, 60px 0 0 -10px #bf103c, 40px 40px 0 -10px #bf103c, 0 60px 0 -10px #bf103c, -40px 40px 0 0 #bf103c, -60px 0 0 0.40px #bf103c, -40px -40px 0 0 #bf103c;
	}
	87.5% {
		box-shadow: 0 -60px 0 0 #bf103c, 40px -40px 0 -10px #bf103c, 60px 0 0 -10px #bf103c, 40px 40px 0 -10px #bf103c, 0 60px 0 -10px #bf103c, -40px 40px 0 0 #bf103c, -60px 0 0 0 #bf103c, -40px -40px 0 0.40px #bf103c;
	}
}