.spinner{margin:100px auto 0;width:100px;text-align:center}.spinner>div{width:16px;height:16px;background-color:#fff;border-radius:100%;display:inline-block;-webkit-animation:sk-bouncedelay 1.7s infinite ease-in-out both;animation:sk-bouncedelay 1.7s infinite ease-in-out both;margin-right:5px}.spinner--orange>div{background:#ff9a27}.spinner--cyan>div{background:#3fcca1}.spinner--yellow>div{background:#f2d915}.spinner .spinner__item1{-webkit-animation-delay:-.4s;animation-delay:-.4s}.spinner .spinner__item2{-webkit-animation-delay:-.2s;animation-delay:-.2s}@-webkit-keyframes sk-bouncedelay{0%,100%,80%{-webkit-transform:scale(0);transform:scale(0);opacity:0}40%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes sk-bouncedelay{0%,100%,80%{-webkit-transform:scale(0);transform:scale(0);opacity:0}40%{-webkit-transform:scale(1);transform:scale(1);opacity:1}}@keyframes spin{to{transform:rotate(1turn)}}.progress{position:relative;display:inline-block;width:5em;height:5em;margin:0 .5em;font-size:12px;text-indent:999em;overflow:hidden;animation:spin 1s infinite steps(8)}.small.progress{font-size:4px}.large.progress{font-size:24px}.progress:after,.progress:before,.progress>div:after,.progress>div:before{content:'';position:absolute;top:0;left:2.25em;width:.5em;height:1.5em;border-radius:.2em;background:#eee;box-shadow:0 3.5em #eee;transform-origin:50% 2.5em}.progress:before{background:#555}.progress:after{transform:rotate(-45deg);background:#777}.progress>div:before{transform:rotate(-90deg);background:#999}.progress>div:after{transform:rotate(-135deg);background:#bbb}