html,body{height:100%}.dots-loader{width:50px;height:15px;margin-right:50px;animation:1s linear infinite base;position:relative}@keyframes base{0%{transform:translate(25px)}33%{transform:rotate(360deg)}66%{transform:translate(50px)rotate(360deg)}to{transform:translate(25px)}}.dots-loader span{border-radius:50%;width:10px;height:18px;position:absolute}.dots-loader span:first-child{background:#b1f6b0;border:1px solid #12a039;animation:3s linear infinite loader}.dots-loader span:nth-child(2){background:#b0f6f2;border:1px solid #10658d;animation:3s linear -1s infinite loader}.dots-loader span:nth-child(3){background:#ffd463;border:1px solid #ff9007;animation:3s linear -2s infinite loader}@keyframes loader{33%{transform:translate(25px)}66%{transform:translate(50px)}to{transform:rotate(180deg)translate(0)}}