.whirlpool{width:100px;height:100px;margin:100px auto;margin-top:37vh;margin-bottom:37vh;position:relative}.ring:before{content:"";border-radius:50%;border:1px solid #fc0;height:30px;width:100px;position:absolute}.ring1:before{left:40px;width:20px;top:12px;height:6px;-webkit-animation:spinner 2.5s ease 0s infinite;animation:spinner 2.5s ease 0s infinite}.ring2:before{left:35px;width:30px;top:10.5px;height:9px;-webkit-animation:spinner 2.5s ease .1s infinite;animation:spinner 2.5s ease .1s infinite}.ring3:before{left:30px;width:40px;top:9px;height:12px;-webkit-animation:spinner 2.5s ease .2s infinite;animation:spinner 2.5s ease .2s infinite}.ring4:before{left:25px;width:50px;top:7.5px;height:15px;-webkit-animation:spinner 2.5s ease .3s infinite;animation:spinner 2.5s ease .3s infinite}.ring5:before{left:20px;width:60px;top:6px;height:18px;-webkit-animation:spinner 2.5s ease .4s infinite;animation:spinner 2.5s ease .4s infinite}.ring6:before{left:15px;width:70px;top:4.5px;height:21px;-webkit-animation:spinner 2.5s ease .5s infinite;animation:spinner 2.5s ease .5s infinite}.ring7:before{left:10px;width:80px;top:3px;height:24px;-webkit-animation:spinner 2.5s ease .6s infinite;animation:spinner 2.5s ease .6s infinite}.ring8:before{left:5px;width:90px;top:1.5px;height:27px;-webkit-animation:spinner 2.5s ease .7s infinite;animation:spinner 2.5s ease .7s infinite}.ring9:before{width:100px;height:30px;-webkit-animation:spinner 2.5s ease .8s infinite;animation:spinner 2.5s ease .8s infinite}@-webkit-keyframes spinner{0%{transform:translateY(10px);-webkit-animation-timing-function:cubic-bezier(.455,.03,.515,.955);animation-timing-function:cubic-bezier(.455,.03,.515,.955)}50%{transform:translateY(60px);-webkit-animation-timing-function:cubic-bezier(.455,.03,.515,.955);animation-timing-function:cubic-bezier(.455,.03,.515,.955)}to{transform:translateY(10px);-webkit-animation-timing-function:cubic-bezier(.455,.03,.515,.955);animation-timing-function:cubic-bezier(.455,.03,.515,.955)}}@keyframes spinner{0%{transform:translateY(10px);-webkit-animation-timing-function:cubic-bezier(.455,.03,.515,.955);animation-timing-function:cubic-bezier(.455,.03,.515,.955)}50%{transform:translateY(60px);-webkit-animation-timing-function:cubic-bezier(.455,.03,.515,.955);animation-timing-function:cubic-bezier(.455,.03,.515,.955)}to{transform:translateY(10px);-webkit-animation-timing-function:cubic-bezier(.455,.03,.515,.955);animation-timing-function:cubic-bezier(.455,.03,.515,.955)}}