.preloader {
    place-content: center;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100vh;
    /*background: #000;*/
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999999999;
    display: inline-grid;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    /*background-image: -webkit-gradient(linear, left top, left bottom, from(#9647DB), to(#5E57EA));
    background-image: linear-gradient(#9647DB, #5E57EA);*/
}
.preloader_wrap {
    display: flex;
    zoom: 2;
}

.cssload-mask2 {
    transform: skew(-15deg, 0) rotate(90deg) !important;
    -o-transform: skew(-15deg, 0) rotate(90deg) !important;
    -ms-transform: skew(-15deg, 0) rotate(90deg) !important;
    -webkit-transform: skew(-15deg, 0) rotate(90deg) !important;
    -moz-transform: skew(-15deg, 0) rotate(90deg) !important;
    left: -12px !important;
    top: 16px !important;
    transform: skew(-15deg, 0) rotate(90deg) !important;
    -o-transform: skew(-15deg, 0) rotate(90deg) !important;
    -ms-transform: skew(-15deg, 0) rotate(90deg) !important;
    /* -webkit-transform: skew(-15deg, 0) rotate(0deg) !important; */
    -moz-transform: skew(-15deg, 0) rotate(90deg) !important;
    /* left: -43px !important; */
    top: 14.5px !important;
    width: 48px !important;
}

.cssload-mask3 {
    top: 12.5px !important;
    left: 13.9px !important;
    transform: skew(-15deg, 54deg) rotate(35deg) !important;
    -o-transform: skew(-15deg, 54deg) rotate(35deg) !important;
    -ms-transform: skew(-15deg, 54deg) rotate(35deg) !important;
    -webkit-transform: skew(-15deg, 55deg) rotate(35deg) !important;
    -moz-transform: skew(-15deg, 54deg) rotate(35deg) !important;
    width: 27.5px !important;
    height: 23px !important;
}

.cssload-mask4 {
    transform: skew(-15deg, 0) rotate(90deg) !important;
    -o-transform: skew(-15deg, 0) rotate(90deg) !important;
    -ms-transform: skew(-15deg, 0) rotate(90deg) !important;
    -webkit-transform: skew(-15deg, 0) rotate(90deg) !important;
    -moz-transform: skew(-15deg, 0) rotate(90deg) !important;
    right: 0.8px !important;
    top: 16px !important;
    top: 14.5px !important;
    width: 48px !important;
}

.cssload-mask01 {
    height: 19px !important;
    left: 18.5px !important;
}

.cssload-mask02 {
    transform: skew(-15deg, 40deg);
    -o-transform: skew(-15deg, 40deg);
    -ms-transform: skew(-15deg, 40deg);
    -webkit-transform: skew(-15deg, 42deg) !important;
    -moz-transform: skew(-15deg, 40deg);
    left: 19.2px !important;
    top: 14.2px !important;
}

.cssload-mask03 {
    left: 0.3px !important;
    top: 28.5px !important;
}

#cssload-global {
	width: 68px;
	margin: auto;
	position: relative;
	height: 58px;
}

.cssload-mask {
	position: absolute;
	border-radius: 2px;
	overflow: hidden;
	perspective: 1000;
		-o-perspective: 1000;
		-ms-perspective: 1000;
		-webkit-perspective: 1000;
		-moz-perspective: 1000;
	backface-visibility: hidden;
		-o-backface-visibility: hidden;
		-ms-backface-visibility: hidden;
		-webkit-backface-visibility: hidden;
		-moz-backface-visibility: hidden;
}

.cssload-plane {
	background: var(--color1);
	width: 400%;
	height: 100%;
	position: absolute;
	z-index: 100;
	transform: translate3d(0px, 0, 0);
	-o-transform: translate3d(0px, 0, 0);
	-ms-transform: translate3d(0px, 0, 0);
	-webkit-transform: translate3d(0px, 0, 0);
	-moz-transform: translate3d(0px, 0, 0);
	perspective: 1000;
	-o-perspective: 1000;
	-ms-perspective: 1000;
	-webkit-perspective: 1000;
	-moz-perspective: 1000;
	backface-visibility: hidden;
	-o-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
}

#cssload-top .cssload-plane {
	z-index: 2000;
	animation: cssload-trans1 1.5s ease-in infinite	0s backwards;
	-o-animation: cssload-trans1 1.5s ease-in infinite	0s backwards;
	-ms-animation: cssload-trans1 1.5s ease-in infinite	0s backwards;
	-webkit-animation: cssload-trans1 1.5s ease-in infinite	0s backwards;
	-moz-animation: cssload-trans1 1.5s ease-in infinite	0s backwards;
}

#cssload-middle .cssload-plane {
	background: #3F51B5;
	transform: translate3d(0px, 0, 0);
	-o-transform: translate3d(0px, 0, 0);
	-ms-transform: translate3d(0px, 0, 0);
	-webkit-transform: translate3d(0px, 0, 0);
	-moz-transform: translate3d(0px, 0, 0);
	animation: cssload-trans2 1.5s linear infinite	0.35s	backwards;
	-o-animation: cssload-trans2 1.5s linear infinite	0.35s	backwards;
	-ms-animation: cssload-trans2 1.5s linear infinite	0.35s	backwards;
	-webkit-animation: cssload-trans2 1.5s linear infinite	0.35s	backwards;
	-moz-animation: cssload-trans2 1.5s linear infinite	0.35s	backwards;
}

#cssload-bottom .cssload-plane {
	z-index: 2000;
	animation: cssload-trans3 1.5s ease-out infinite	0.81s backwards;
	-o-animation: cssload-trans3 1.5s ease-out infinite	0.81s backwards;
	-ms-animation: cssload-trans3 1.5s ease-out infinite	0.81s backwards;
	-webkit-animation: cssload-trans3 1.5s ease-out infinite	0.81s backwards;
	-moz-animation: cssload-trans3 1.5s ease-out infinite	0.81s backwards;
}

#cssload-top {
	width: 52px;
	height: 19px;
	left: 19px;
	transform: skew(-15deg, 0);
		-o-transform: skew(-15deg, 0);
		-ms-transform: skew(-15deg, 0);
		-webkit-transform: skew(-15deg, 0);
		-moz-transform: skew(-15deg, 0);
	z-index: 100;
}

#cssload-middle {
	width: 32px;
	height: 19px;
	left: 19px;
	top: 15px;
	transform: skew(-15deg, 40deg);
		-o-transform: skew(-15deg, 40deg);
		-ms-transform: skew(-15deg, 40deg);
		-webkit-transform: skew(-15deg, 40deg);
		-moz-transform: skew(-15deg, 40deg);
}

#cssload-bottom {
	width: 52px;
	height: 19px;
	top: 29px;
	transform: skew(-15deg, 0);
	-o-transform: skew(-15deg, 0);
	-ms-transform: skew(-15deg, 0);
	-webkit-transform: skew(-15deg, 0);
	-moz-transform: skew(-15deg, 0);
}









@keyframes cssload-trans1 {
	from {
		transform: translate3d(52px, 0, 0);
	}
	to {
		transform: translate3d(-244px, 0, 0);
	}
}

@-o-keyframes cssload-trans1 {
	from {
		-o-transform: translate3d(52px, 0, 0);
	}
	to {
		-o-transform: translate3d(-244px, 0, 0);
	}
}

@-ms-keyframes cssload-trans1 {
	from {
		-ms-transform: translate3d(52px, 0, 0);
	}
	to {
		-ms-transform: translate3d(-244px, 0, 0);
	}
}

@-webkit-keyframes cssload-trans1 {
	from {
		-webkit-transform: translate3d(52px, 0, 0);
	}
	to {
		-webkit-transform: translate3d(-244px, 0, 0);
	}
}

@-moz-keyframes cssload-trans1 {
	from {
		-moz-transform: translate3d(52px, 0, 0);
	}
	to {
		-moz-transform: translate3d(-244px, 0, 0);
	}
}

@keyframes cssload-trans2 {
	from {
		transform: translate3d(-156px, 0, 0);
	}
	to {
		transform: translate3d(52px, 0, 0);
	}
}

@-o-keyframes cssload-trans2 {
	from {
		-o-transform: translate3d(-156px, 0, 0);
	}
	to {
		-o-transform: translate3d(52px, 0, 0);
	}
}

@-ms-keyframes cssload-trans2 {
	from {
		-ms-transform: translate3d(-156px, 0, 0);
	}
	to {
		-ms-transform: translate3d(52px, 0, 0);
	}
}

@-webkit-keyframes cssload-trans2 {
	from {
		-webkit-transform: translate3d(-156px, 0, 0);
	}
	to {
		-webkit-transform: translate3d(52px, 0, 0);
	}
}

@-moz-keyframes cssload-trans2 {
	from {
		-moz-transform: translate3d(-156px, 0, 0);
	}
	to {
		-moz-transform: translate3d(52px, 0, 0);
	}
}

@keyframes cssload-trans3 {
	from {
		transform: translate3d(52px, 0, 0);
	}
	to {
		transform: translate3d(-214px, 0, 0);
	}
}

@-o-keyframes cssload-trans3 {
	from {
		-o-transform: translate3d(52px, 0, 0);
	}
	to {
		-o-transform: translate3d(-214px, 0, 0);
	}
}

@-ms-keyframes cssload-trans3 {
	from {
		-ms-transform: translate3d(52px, 0, 0);
	}
	to {
		-ms-transform: translate3d(-214px, 0, 0);
	}
}

@-webkit-keyframes cssload-trans3 {
	from {
		-webkit-transform: translate3d(52px, 0, 0);
	}
	to {
		-webkit-transform: translate3d(-214px, 0, 0);
	}
}

@-moz-keyframes cssload-trans3 {
	from {
		-moz-transform: translate3d(52px, 0, 0);
	}
	to {
		-moz-transform: translate3d(-214px, 0, 0);
	}
}

@keyframes cssload-animColor {
	from {
		background: red;
	}
	25% {
		background: yellow;
	}
	50% {
		background: green;
	}
	75% {
		background: brown;
	}
	to {
		background: blue;
	}
}

@-o-keyframes cssload-animColor {
	from {
		background: red;
	}
	25% {
		background: yellow;
	}
	50% {
		background: green;
	}
	75% {
		background: brown;
	}
	to {
		background: blue;
	}
}

@-ms-keyframes cssload-animColor {
	from {
		background: red;
	}
	25% {
		background: yellow;
	}
	50% {
		background: green;
	}
	75% {
		background: brown;
	}
	to {
		background: blue;
	}
}

@-webkit-keyframes cssload-animColor {
	from {
		background: red;
	}
	25% {
		background: yellow;
	}
	50% {
		background: green;
	}
	75% {
		background: brown;
	}
	to {
		background: blue;
	}
}

@-moz-keyframes cssload-animColor {
	from {
		background: red;
	}
	25% {
		background: yellow;
	}
	50% {
		background: green;
	}
	75% {
		background: brown;
	}
	to {
		background: blue;
	}
}