.loader{
	display: flex;
	position: fixed;
	z-index: 10000;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.5);
	justify-content: center;
	align-items: center;
	color: white;
	font-size: 24px;
}

.loader[show="0"]{
	display: none;
}


.loader div{
	opacity: 0;
	animation: loader 3s ease-in-out calc(0.05s * (var(--li))) infinite;
}

@keyframes loader{
	0% {
		opacity: 0;
		transform: scale(1.5);
	}
	20%{
		opacity: 1;
		transform: scale(1);
	}
	60% {
		opacity: 1;
		transform: scale(1);
	}
	80% {
		opacity: 0;
		transform: scale(0.5);
	}
	100% {
		opacity: 0;
		transform: scale(0.5);
	}
}