.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;width: 120px;
}
.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 #fff; 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);}
}