#loader-wrapper{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;background-color:#f5f5f5;}
#loader{display:block;position:relative;top:50%;transform:translateY(-50%);}
.cssload-spinner{height:50px;width:50px;margin:0 auto;position:relative;animation:cssload-invert 1.7s infinite steps(2, end);-o-animation:cssload-invert 1.7s infinite steps(2, end);-ms-animation:cssload-invert 1.7s infinite steps(2, end);-webkit-animation:cssload-invert 1.7s infinite steps(2, end);-moz-animation:cssload-invert 1.7s infinite steps(2, end);}
.cssload-ball{height:100%;width:100%;position:absolute;border-radius:50%;top:0;left:0;background:rgb(255,51,102);}
.cssload-ball-1{animation:cssload-ball1 0.85s infinite alternate linear;-o-animation:cssload-ball1 0.85s infinite alternate linear;-ms-animation:cssload-ball1 0.85s infinite alternate linear;-webkit-animation:cssload-ball1 0.85s infinite alternate linear;-moz-animation:cssload-ball1 0.85s infinite alternate linear;}
.cssload-ball-2{animation:cssload-ball2 0.85s infinite alternate linear;-o-animation:cssload-ball2 0.85s infinite alternate linear;-ms-animation:cssload-ball2 0.85s infinite alternate linear;-webkit-animation:cssload-ball2 0.85s infinite alternate linear;-moz-animation:cssload-ball2 0.85s infinite alternate linear;}
.cssload-ball-3{animation:cssload-ball3 0.85s infinite alternate linear;-o-animation:cssload-ball3 0.85s infinite alternate linear;-ms-animation:cssload-ball3 0.85s infinite alternate linear;-webkit-animation:cssload-ball3 0.85s infinite alternate linear;-moz-animation:cssload-ball3 0.85s infinite alternate linear;}
.cssload-ball-4{animation:cssload-ball4 0.85s infinite alternate linear;-o-animation:cssload-ball4 0.85s infinite alternate linear;-ms-animation:cssload-ball4 0.85s infinite alternate linear;-webkit-animation:cssload-ball4 0.85s infinite alternate linear;-moz-animation:cssload-ball4 0.85s infinite alternate linear;}
@keyframes cssload-invert{100%{transform:rotate(180deg);}
}
@-o-keyframes cssload-invert{100%{-o-transform:rotate(180deg);}
}
@-ms-keyframes cssload-invert{100%{-ms-transform:rotate(180deg);}
}
@-webkit-keyframes cssload-invert{100%{-webkit-transform:rotate(180deg);}
}
@-moz-keyframes cssload-invert{100%{-moz-transform:rotate(180deg);}
}
@keyframes cssload-ball1{12%{transform:none;}
26%{transform:translateX(25%) scale(1, 0.8);}
40%{transform:translateX(50%) scale(0.8, 0.8);}
60%{transform:translateX(50%) scale(0.8, 0.8);}
74%{transform:translate(50%, 25%) scale(0.6, 0.8);}
88%{transform:translate(50%, 50%) scale(0.6, 0.6);}
100%{transform:translate(50%, 50%) scale(0.6, 0.6);}
}
@-o-keyframes cssload-ball1{12%{-o-transform:none;}
26%{-o-transform:translateX(25%) scale(1, 0.8);}
40%{-o-transform:translateX(50%) scale(0.8, 0.8);}
60%{-o-transform:translateX(50%) scale(0.8, 0.8);}
74%{-o-transform:translate(50%, 25%) scale(0.6, 0.8);}
88%{-o-transform:translate(50%, 50%) scale(0.6, 0.6);}
100%{-o-transform:translate(50%, 50%) scale(0.6, 0.6);}
}
@-ms-keyframes cssload-ball1{12%{-ms-transform:none;}
26%{-ms-transform:translateX(25%) scale(1, 0.8);}
40%{-ms-transform:translateX(50%) scale(0.8, 0.8);}
60%{-ms-transform:translateX(50%) scale(0.8, 0.8);}
74%{-ms-transform:translate(50%, 25%) scale(0.6, 0.8);}
88%{-ms-transform:translate(50%, 50%) scale(0.6, 0.6);}
100%{-ms-transform:translate(50%, 50%) scale(0.6, 0.6);}
}
@-webkit-keyframes cssload-ball1{12%{-webkit-transform:none;}
26%{-webkit-transform:translateX(25%) scale(1, 0.8);}
40%{-webkit-transform:translateX(50%) scale(0.8, 0.8);}
60%{-webkit-transform:translateX(50%) scale(0.8, 0.8);}
74%{-webkit-transform:translate(50%, 25%) scale(0.6, 0.8);}
88%{-webkit-transform:translate(50%, 50%) scale(0.6, 0.6);}
100%{-webkit-transform:translate(50%, 50%) scale(0.6, 0.6);}
}
@-moz-keyframes cssload-ball1{12%{-moz-transform:none;}
26%{-moz-transform:translateX(25%) scale(1, 0.8);}
40%{-moz-transform:translateX(50%) scale(0.8, 0.8);}
60%{-moz-transform:translateX(50%) scale(0.8, 0.8);}
74%{-moz-transform:translate(50%, 25%) scale(0.6, 0.8);}
88%{-moz-transform:translate(50%, 50%) scale(0.6, 0.6);}
100%{-moz-transform:translate(50%, 50%) scale(0.6, 0.6);}
}
@keyframes cssload-ball2{12%{transform:none;}
26%{transform:translateX(25%) scale(1, 0.8);}
40%{transform:translateX(50%) scale(0.8, 0.8);}
60%{transform:translateX(50%) scale(0.8, 0.8);}
74%{transform:translate(50%, -25%) scale(0.6, 0.8);}
88%{transform:translate(50%, -50%) scale(0.6, 0.6);}
100%{transform:translate(50%, -50%) scale(0.6, 0.6);}
}
@-o-keyframes cssload-ball2{12%{-o-transform:none;}
26%{-o-transform:translateX(25%) scale(1, 0.8);}
40%{-o-transform:translateX(50%) scale(0.8, 0.8);}
60%{-o-transform:translateX(50%) scale(0.8, 0.8);}
74%{-o-transform:translate(50%, -25%) scale(0.6, 0.8);}
88%{-o-transform:translate(50%, -50%) scale(0.6, 0.6);}
100%{-o-transform:translate(50%, -50%) scale(0.6, 0.6);}
}
@-ms-keyframes cssload-ball2{12%{-ms-transform:none;}
26%{-ms-transform:translateX(25%) scale(1, 0.8);}
40%{-ms-transform:translateX(50%) scale(0.8, 0.8);}
60%{-ms-transform:translateX(50%) scale(0.8, 0.8);}
74%{-ms-transform:translate(50%, -25%) scale(0.6, 0.8);}
88%{-ms-transform:translate(50%, -50%) scale(0.6, 0.6);}
100%{-ms-transform:translate(50%, -50%) scale(0.6, 0.6);}
}
@-webkit-keyframes cssload-ball2{12%{-webkit-transform:none;}
26%{-webkit-transform:translateX(25%) scale(1, 0.8);}
40%{-webkit-transform:translateX(50%) scale(0.8, 0.8);}
60%{-webkit-transform:translateX(50%) scale(0.8, 0.8);}
74%{-webkit-transform:translate(50%, -25%) scale(0.6, 0.8);}
88%{-webkit-transform:translate(50%, -50%) scale(0.6, 0.6);}
100%{-webkit-transform:translate(50%, -50%) scale(0.6, 0.6);}
}
@-moz-keyframes cssload-ball2{12%{-moz-transform:none;}
26%{-moz-transform:translateX(25%) scale(1, 0.8);}
40%{-moz-transform:translateX(50%) scale(0.8, 0.8);}
60%{-moz-transform:translateX(50%) scale(0.8, 0.8);}
74%{-moz-transform:translate(50%, -25%) scale(0.6, 0.8);}
88%{-moz-transform:translate(50%, -50%) scale(0.6, 0.6);}
100%{-moz-transform:translate(50%, -50%) scale(0.6, 0.6);}
}
@keyframes cssload-ball3{12%{transform:none;}
26%{transform:translateX(-25%) scale(1, 0.8);}
40%{transform:translateX(-50%) scale(0.8, 0.8);}
60%{transform:translateX(-50%) scale(0.8, 0.8);}
74%{transform:translate(-50%, 25%) scale(0.6, 0.8);}
88%{transform:translate(-50%, 50%) scale(0.6, 0.6);}
100%{transform:translate(-50%, 50%) scale(0.6, 0.6);}
}
@-o-keyframes cssload-ball3{12%{-o-transform:none;}
26%{-o-transform:translateX(-25%) scale(1, 0.8);}
40%{-o-transform:translateX(-50%) scale(0.8, 0.8);}
60%{-o-transform:translateX(-50%) scale(0.8, 0.8);}
74%{-o-transform:translate(-50%, 25%) scale(0.6, 0.8);}
88%{-o-transform:translate(-50%, 50%) scale(0.6, 0.6);}
100%{-o-transform:translate(-50%, 50%) scale(0.6, 0.6);}
}
@-ms-keyframes cssload-ball3{12%{-ms-transform:none;}
26%{-ms-transform:translateX(-25%) scale(1, 0.8);}
40%{-ms-transform:translateX(-50%) scale(0.8, 0.8);}
60%{-ms-transform:translateX(-50%) scale(0.8, 0.8);}
74%{-ms-transform:translate(-50%, 25%) scale(0.6, 0.8);}
88%{-ms-transform:translate(-50%, 50%) scale(0.6, 0.6);}
100%{-ms-transform:translate(-50%, 50%) scale(0.6, 0.6);}
}
@-webkit-keyframes cssload-ball3{12%{-webkit-transform:none;}
26%{-webkit-transform:translateX(-25%) scale(1, 0.8);}
40%{-webkit-transform:translateX(-50%) scale(0.8, 0.8);}
60%{-webkit-transform:translateX(-50%) scale(0.8, 0.8);}
74%{-webkit-transform:translate(-50%, 25%) scale(0.6, 0.8);}
88%{-webkit-transform:translate(-50%, 50%) scale(0.6, 0.6);}
100%{-webkit-transform:translate(-50%, 50%) scale(0.6, 0.6);}
}
@-moz-keyframes cssload-ball3{12%{-moz-transform:none;}
26%{-moz-transform:translateX(-25%) scale(1, 0.8);}
40%{-moz-transform:translateX(-50%) scale(0.8, 0.8);}
60%{-moz-transform:translateX(-50%) scale(0.8, 0.8);}
74%{-moz-transform:translate(-50%, 25%) scale(0.6, 0.8);}
88%{-moz-transform:translate(-50%, 50%) scale(0.6, 0.6);}
100%{-moz-transform:translate(-50%, 50%) scale(0.6, 0.6);}
}
@keyframes cssload-ball4{12%{transform:none;}
26%{transform:translateX(-25%) scale(1, 0.8);}
40%{transform:translateX(-50%) scale(0.8, 0.8);}
60%{transform:translateX(-50%) scale(0.8, 0.8);}
74%{transform:translate(-50%, -25%) scale(0.6, 0.8);}
88%{transform:translate(-50%, -50%) scale(0.6, 0.6);}
100%{transform:translate(-50%, -50%) scale(0.6, 0.6);}
}
@-o-keyframes cssload-ball4{12%{-o-transform:none;}
26%{-o-transform:translateX(-25%) scale(1, 0.8);}
40%{-o-transform:translateX(-50%) scale(0.8, 0.8);}
60%{-o-transform:translateX(-50%) scale(0.8, 0.8);}
74%{-o-transform:translate(-50%, -25%) scale(0.6, 0.8);}
88%{-o-transform:translate(-50%, -50%) scale(0.6, 0.6);}
100%{-o-transform:translate(-50%, -50%) scale(0.6, 0.6);}
}
@-ms-keyframes cssload-ball4{12%{-ms-transform:none;}
26%{-ms-transform:translateX(-25%) scale(1, 0.8);}
40%{-ms-transform:translateX(-50%) scale(0.8, 0.8);}
60%{-ms-transform:translateX(-50%) scale(0.8, 0.8);}
74%{-ms-transform:translate(-50%, -25%) scale(0.6, 0.8);}
88%{-ms-transform:translate(-50%, -50%) scale(0.6, 0.6);}
100%{-ms-transform:translate(-50%, -50%) scale(0.6, 0.6);}
}
@-webkit-keyframes cssload-ball4{12%{-webkit-transform:none;}
26%{-webkit-transform:translateX(-25%) scale(1, 0.8);}
40%{-webkit-transform:translateX(-50%) scale(0.8, 0.8);}
60%{-webkit-transform:translateX(-50%) scale(0.8, 0.8);}
74%{-webkit-transform:translate(-50%, -25%) scale(0.6, 0.8);}
88%{-webkit-transform:translate(-50%, -50%) scale(0.6, 0.6);}
100%{-webkit-transform:translate(-50%, -50%) scale(0.6, 0.6);}
}
@-moz-keyframes cssload-ball4{12%{-moz-transform:none;}
26%{-moz-transform:translateX(-25%) scale(1, 0.8);}
40%{-moz-transform:translateX(-50%) scale(0.8, 0.8);}
60%{-moz-transform:translateX(-50%) scale(0.8, 0.8);}
74%{-moz-transform:translate(-50%, -25%) scale(0.6, 0.8);}
88%{-moz-transform:translate(-50%, -50%) scale(0.6, 0.6);}
100%{-moz-transform:translate(-50%, -50%) scale(0.6, 0.6);}
}