html, body { height: 100%;}
body { display: block; clear: both; height: 100%; background: #FFF; }
.lds-container { display: block; position: relative; }
.lds-ring { display: block; position: absolute; top: 50%; left: 50%; margin: -26px 0 0 -26px; width: 52px; height: 52px; }
    .lds-ring div { box-sizing: border-box; display: block; position: absolute; width: 40px; height: 40px; margin: 6px; border: 2px solid #AAA; border-radius: 50%; animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; border-color: #AAA transparent transparent transparent; }
        .lds-ring div:nth-child(1) { animation-delay: -0.45s; }
        .lds-ring div:nth-child(2) { animation-delay: -0.3s; }
        .lds-ring div:nth-child(3) { animation-delay: -0.15s; }

@keyframes lds-ring {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}