.loader {
	height: 100vh;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-around;
	grid-row : 1/-1;
	grid-column: 1/-1;
}

.loader svg {
	display: flex;
	flex-wrap: nowrap;
	justify-content: flex-end;
}

.loader .bottom-left,
.loader .upper_left,
.loader .bottom-right,
.loader .arrow {
	fill: transparent;
	animation: fill 2s infinite alternate;
}

.loader .upper_left {
	animation-delay: 0s;
	color: #000;
}

.loader .bottom-left {
	animation-delay: 0.5s;
	color: #79797A;
}

.loader .bottom-right {
	animation-delay: 1s;
	color: #002C68;
}

.loader .arrow {
	animation-delay: 1.5s;
	color: #0E8264;
}

@keyframes fill {
	0% {
			fill: transparent;
	}
	100% {
			fill: currentColor;
	}
}

.loading {
	font-size: 40px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 800;
	text-align: center;
	color: var(--BodyFG);
}

.loading03 span {
	margin: 0 -0.075em;
	animation: loading03 0.7s infinite alternate;
}

.loading03 span:nth-child(1) { animation-delay: 0.1s; }
.loading03 span:nth-child(2) { animation-delay: 0.2s; }
.loading03 span:nth-child(3) { animation-delay: 0.3s; }
.loading03 span:nth-child(4) { animation-delay: 0.4s; }
.loading03 span:nth-child(5) { animation-delay: 0.5s; }
.loading03 span:nth-child(6) { animation-delay: 0.6s; }
.loading03 span:nth-child(7) { animation-delay: 0.7s; }

@keyframes loading03 {
	0% {
			transform: scale(1);
	}
	100% {
			transform: scale(0.8);
	}
}


.loading {
	font-size: 40px;
	font-family: 'Montserrat', sans-serif;
	font-weight: 800;
	text-align: center;
	span {
		display: inline-block;
		margin: 0 -.05em;
	}
}

@keyframes loading03 {
	0% {
		transform: scale(1);
	}
	100% {
		transform: scale(.8);
	}
}