.preloader {
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 16;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #fff;
	pointer-events: none;
	transition: .2s;
}

.page-loaded .preloader {
	opacity: 0;
	visibility: hidden;
}

.preloader-inner {
	display: inline-block;
	position: relative;
}

.preloader-svg {
	width: 100px;
	height: auto;
	transform: rotate(45deg);
}

.stroke-still {
	stroke: #E3EEF4;
}

.stroke-animation {
	animation: stroke-spacing 1.2s ease-in, stroke-color 4.8s linear;
	animation-iteration-count: infinite;
	animation-delay: 0;
	animation-direction: normal;
	animation-fill-mode: forwards;
	animation-play-state: running;
	transform-origin: center center;
}

@-webkit-keyframes stroke-spacing {
	0% {
		stroke-dasharray: 0 200;
	}
	45% {
		stroke-dashoffset: 0;
		stroke-dasharray: 200 200;
	}
	90% {
		stroke-dashoffset: -200;
		stroke-dasharray: 200 200;
	}
	100% {
		stroke-dashoffset: -200;
		stroke-dasharray: 200 200;
	}
}

@keyframes stroke-spacing {
	0% {
		stroke-dasharray: 0 200;
	}
	45% {
		stroke-dashoffset: 0;
		stroke-dasharray: 200 200;
	}
	90% {
		stroke-dashoffset: -200;
		stroke-dasharray: 200 200;
	}
	100% {
		stroke-dashoffset: -200;
		stroke-dasharray: 200 200;
	}
}

@keyframes stroke-color {
	0% {
		stroke: #1c77ff;
	}
	24% {
		stroke: #1c77ff;
	}
	25% {
		stroke: #1c77ff;
	}
	49% {
		stroke: #ed930d;
	}
	50% {
		stroke: #ed930d;
	}
	74% {
		stroke: #ed930d;
	}
	75% {
		stroke: #2cae87;
	}
	99% {
		stroke: #2cae87;
	}
}