div.spinner{width:54px;height:54px;margin:auto;display:inline-block;position:relative}div.spinner div{opacity:0;background:#000;-webkit-border-radius:50px;width:6%;height:16%;-webkit-animation:1s linear infinite fade;position:absolute;top:43%;left:49%;-webkit-box-shadow:0 0 3px #0003}@-webkit-keyframes fade{0%{opacity:1}to{opacity:.25}}div.spinner div.bar1{-webkit-animation-delay:0s;-webkit-transform:rotate(0)translateY(-130%)}div.spinner div.bar2{-webkit-animation-delay:-.9167s;-webkit-transform:rotate(30deg)translateY(-130%)}div.spinner div.bar3{-webkit-animation-delay:-.833s;-webkit-transform:rotate(60deg)translateY(-130%)}div.spinner div.bar4{-webkit-animation-delay:-.7497s;-webkit-transform:rotate(90deg)translateY(-130%)}div.spinner div.bar5{-webkit-animation-delay:-.667s;-webkit-transform:rotate(120deg)translateY(-130%)}div.spinner div.bar6{-webkit-animation-delay:-.5837s;-webkit-transform:rotate(150deg)translateY(-130%)}div.spinner div.bar7{-webkit-animation-delay:-.5s;-webkit-transform:rotate(180deg)translateY(-130%)}div.spinner div.bar8{-webkit-animation-delay:-.4167s;-webkit-transform:rotate(210deg)translateY(-130%)}div.spinner div.bar9{-webkit-animation-delay:-.333s;-webkit-transform:rotate(240deg)translateY(-130%)}div.spinner div.bar10{-webkit-animation-delay:-.2497s;-webkit-transform:rotate(270deg)translateY(-130%)}div.spinner div.bar11{-webkit-animation-delay:-.167s;-webkit-transform:rotate(300deg)translateY(-130%)}div.spinner div.bar12{-webkit-animation-delay:-.0833s;-webkit-transform:rotate(330deg)translateY(-130%)}