body{
	margin: 0;
	padding: 0;

	background: #08103b;
}
.box{
	width: 200px;
	height: 200px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
    overflow: hidden;
}

.box .b{
	border-radius: 50%;
	border-left: 4px solid;
	border-right: 4px solid;
	border-top: 4px solid transparent !important;
	border-bottom: 4px solid transparent !important;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	animation: ro 2s infinite;
}
.box .b1{
	border-color: #00548C;
	width: 120px;
	height: 120px;
}

.box .b2{
	border-color: #0082D9;
	width: 100px;
	height: 100px;
	animation-delay: 0.2s;
}
.box .b3{
	border-color: #006BB2;
	width: 80px;
	height: 80px;
	animation-delay: 0.4s;
}

.box .b4{
	border-color: #0099FF;
	width: 60px;
	height: 60px;
animation-delay: 0.6s;
}

@keyframes ro{
	0% {
		transform: translate(-50%,-50%) rotate(0deg);
	}
	50% {
		transform: translate(-50%,-50%) rotate(-180deg);
	}
	100% {
		transform: translate(-50%,-50%) rotate(0deg);
	}

}

@keyframes fadeout{
	from {opacity: 1;}
	to {opacity: 0;}
}