/* GENERAL */
.preloader{
	position: fixed;
	top:0;
	left:0;
	bottom:0;
	right:0;
	background:rgba(0,0,0,0.85);
	z-index: 99999;
	transition: all 500ms ease;
	-webkit-transition: all 500ms ease;
}
.preloader.out{
	opacity: 0;
	visibility: hidden;
	transition-delay:1s;
}
.loader{
	position: fixed;
	top:50%;
	left:50%;
	transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	transition: all 500ms ease;
	-webkit-transition: all 500ms ease;
	transition-delay:0.8s;
}
.preloader.out .loader{
	transform: translate(-50%,-100%);
	-webkit-transform: translate(-50%,-100%);
	opacity: 0;
}
.preloader.out .loader:before{
	border-color:#fff;
	transition-delay:0.2s;
}

.loader img{
	position: relative;
	transition: all 500ms ease;
	-webkit-transition: all 500ms ease;
}
.loader:before{
	content: "";
	position: fixed;
	top:50%;
	left:50%;
	transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	width: 150px;
	height: 150px;
	background:#222;
	border:5px solid rgba(255,255,255,0.1);
	border-top:5px solid rgb(28, 78, 228);
	border-radius: 50%;
	-webkit-border-radius: 50%;
	animation:preloaderAnimation 1s linear infinite;
	-webkit-animation:preloaderAnimation 1s linear infinite;
	transition: all 500ms ease;
	-webkit-transition: all 500ms ease;
}
@keyframes preloaderAnimation{
	0%{transform: translate(-50%,-50%) rotate(0deg);}
	100%{transform: translate(-50%,-50%) rotate(360deg);}
}
@-webkit-keyframes preloaderAnimation{
	0%{-webkit-transform: translate(-50%,-50%) rotate(0deg);}
	100%{-webkit-transform: translate(-50%,-50%) rotate(360deg);}
}