.preloader {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
    z-index: 9999;
    opacity: 1;
	background-color: transparent;
	-webkit-transition: .3s;
	-o-transition: .3s;
	transition: .3s;
}
.preloader:before,
.preloader:after {
	position: absolute;
	left: 0;
	height: 51%;
	width: 100%;
	-webkit-transition: all 0.6s ease;
	-o-transition: all 0.6s ease;
	transition: all 0.6s ease;
	content: "";
}
.preloader:before {
	top: 0;
}
.preloader:after {
	bottom: 0;
}

.spinner {
	display: block;
	position: relative;
	left: 50%;
	top: 50%;
	width: 70px;
	height: 70px;
	margin: -35px 0 0 -35px;
	z-index: 1001;
}
.spinner-round {
	border-radius: 50%;
	border: 2px solid transparent;
	border-top-color: var(--main);
	-webkit-animation: spin 2s linear infinite;
	animation: spin 2s linear infinite;
}
.spinner-round:before,
.spinner-round:after {
	content: "";
	position: absolute;
	border-radius: 50%;
	border: 3px solid transparent;
}
.spinner-round:before {
	top: 5px;
	left: 5px;
	right: 5px;
	bottom: 5px;
	border-top-color: var(--main);
	-webkit-animation: spin 3s linear infinite;
	animation: spin 3s linear infinite;
}
.spinner-round:after {
	top: 15px;
	left: 15px;
	right: 15px;
	bottom: 15px;
	border-top-color: var(--main);
	-webkit-animation: spin 1.5s linear infinite;
	animation: spin 1.5s linear infinite;
}
.spinner-alt {
	border-radius: 50%;
	width: 150px;
	height: 150px;
	margin: -75px 0 0 -75px;
}
.spinner-alt:after,
.spinner-alt:before {
	content: "";
	position: absolute;
	border-radius: 50%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}
.spinner-alt:before {
	border: 1px solid rgba(255, 255, 255, 0.1);
}
.spinner-alt:after {
	border: 1px solid;
	border-top-color: #fff;
	border-right-color: transparent;
	border-left-width: 0;
	border-bottom-width: 0;
	-webkit-animation: spin 1.5s linear infinite;
	animation: spin 1.5s linear infinite;
}
.spinner-alt.load-done {
	-webkit-transition: all 0.4s;
	-o-transition: all 0.4s;
	transition: all 0.4s;
	-webkit-transform: scale(3);
	-ms-transform: scale(3);
	transform: scale(3);
	opacity: 0;
	border-color: transparent;
}
.spinner-alt.load-done:after,
.spinner-alt.load-done:before {
	opacity: 0;
}
.spinner-alt.spinner-light {
	border: 1px solid rgba(10, 16, 21, 0.1);
}
.spinner-alt.spinner-light:after {
	border-top-color: #0a1015;
}
.spinner-brand {
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	width: 100px;
}
@-webkit-keyframes spin {
	0% {
		-webkit-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}
@keyframes spin {
	0% {
		-webkit-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
		-ms-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}



.intro {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 999;
	height: 100vh;
	width: 100vw;
}
.intro .square {
	float: left;
	width: 100%;
	height: 50%;
	position: absolute;
	left: 0;
	-webkit-transition: .7s;
	-o-transition: .7s;
	transition: .7s;
	background-color: #fff;
}
.intro .square:first-child {
	top: 0;
}
.intro .square:last-child {
	bottom: 0;
}
.animate-intro .intro .square:first-child {
	-webkit-transform: translateY(-100%);
	-ms-transform: translateY(-100%);
	transform: translateY(-100%);
}
.animate-intro .intro .square:last-child {
	-webkit-transform: translateY(100%);
	-ms-transform: translateY(100%);
	transform: translateY(100%);
}