/* jsfiddle per testarlo
http://jsfiddle.net/77Dj2/6033/
*/

.loading{
opacity:0!important;
}

#loader {
text-align: center;
width: 50%;  
position: absolute;
top: 49%;
left:25%;
z-index:1000;	
}
#loader span {
    display: inline-block;
    vertical-align: middle;
    width: 0.5rem;
    height: 0.5rem;
    margin: 0;
    border-radius: 100%;
	-webkit-border-radius: 100%;
	/*background: darkgoldenrod;*/
	position: absolute;
	animation: spinner 2s infinite cubic-bezier(0,.7,1,0.3);
	-webkit-animation: spinner 2s infinite cubic-bezier(0,.7,1,0.3);
	-moz-animation: spinner 2s infinite cubic-bezier(0,.7,1,0.3);
}

#loader span:nth-child(1) {
animation-delay: 0ms;
-webkit-animation-delay: 0ms;
-moz-animation-delay: 0ms;
}

#loader span:nth-child(2) {
animation-delay: 50ms;
-webkit-animation-delay: 50ms;
-moz-animation-delay: 50ms;
}

#loader span:nth-child(3) {
animation-delay: 100ms;
-webkit-animation-delay: 100ms;
-moz-animation-delay: 100ms;
}

#loader span:nth-child(4) {
animation-delay: 150ms;
-webkit-animation-delay: 150ms;
-moz-animation-delay: 150ms;
}

@keyframes spinner {
0% {left: 0%;}
100% {left:100%;}
}