.spinner1{height:40px;position:relative;width:40px}.double-bounce1,.double-bounce2{animation:bounce 2s ease-in-out infinite;background-color:#fff;border-radius:50%;height:100%;left:0;opacity:.6;position:absolute;top:0;width:100%}.double-bounce2{animation-delay:-1s}.spinner2{height:60px;position:relative;width:60px}.container1>div,.container2>div,.container3>div{animation:bouncedelay 1.2s ease-in-out infinite;animation-fill-mode:both;background-color:#fff;border-radius:100%;height:10px;position:absolute;width:10px}.spinner2 .spinner-container{height:100%;position:absolute;width:100%}.container2{transform:rotate(45deg)}.container3{transform:rotate(90deg)}.circle1{left:0;top:0}.circle2{right:0;top:0}.circle3{bottom:0;right:0}.circle4{bottom:0;left:0}.container2 .circle1{animation-delay:-1.1s}.container3 .circle1{animation-delay:-1s}.container1 .circle2{animation-delay:-.9s}.container2 .circle2{animation-delay:-.8s}.container3 .circle2{animation-delay:-.7s}.container1 .circle3{animation-delay:-.6s}.container2 .circle3{animation-delay:-.5s}.container3 .circle3{animation-delay:-.4s}.container1 .circle4{animation-delay:-.3s}.container2 .circle4{animation-delay:-.2s}.container3 .circle4{animation-delay:-.1s}@keyframes bouncedelay{0%,80%,to{transform:scale(0);-webkit-transform:scale(0)}40%{transform:scale(1);-webkit-transform:scale(1)}}.spinner3{animation:rotate 2s linear infinite;height:60px;position:relative;width:60px}.dot1,.dot2{animation:bounce 2s ease-in-out infinite;background-color:#fff;border-radius:100%;display:inline-block;height:60%;position:absolute;top:0;width:60%}.dot2{animation-delay:-1s;bottom:0;top:auto}@keyframes rotate{to{transform:rotate(1turn);-webkit-transform:rotate(1turn)}}@keyframes bounce{0%,to{transform:scale(0);-webkit-transform:scale(0)}50%{transform:scale(1);-webkit-transform:scale(1)}}.spinner4{animation:rotateplane 1.2s ease-in-out infinite;background-color:#fff;height:30px;width:30px}@keyframes rotateplane{0%{transform:perspective(120px) rotateX(0deg) rotateY(0deg);-webkit-transform:perspective(120px) rotateX(0deg) rotateY(0deg)}50%{transform:perspective(120px) rotateX(-180.1deg) rotateY(0deg);-webkit-transform:perspective(120px) rotateX(-180.1deg) rotateY(0deg)}to{transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg);-webkit-transform:perspective(120px) rotateX(-180deg) rotateY(-179.9deg)}}.spinner5{height:32px;position:relative;width:32px}.cube1,.cube2{animation:cubemove 1.8s ease-in-out infinite;background-color:#fff;height:10px;left:0;position:absolute;top:0;width:10px}.cube2{animation-delay:-.9s}@keyframes cubemove{25%{transform:translateX(42px) rotate(-90deg) scale(.5);-webkit-transform:translateX(42px) rotate(-90deg) scale(.5)}50%{transform:translateX(42px) translateY(42px) rotate(-179deg);-webkit-transform:translateX(42px) translateY(42px) rotate(-179deg)}50.1%{transform:translateX(42px) translateY(42px) rotate(-180deg);-webkit-transform:translateX(42px) translateY(42px) rotate(-180deg)}75%{transform:translateX(0) translateY(42px) rotate(-270deg) scale(.5);-webkit-transform:translateX(0) translateY(42px) rotate(-270deg) scale(.5)}to{transform:rotate(-1turn);-webkit-transform:rotate(-1turn)}}.spinner6{height:30px;text-align:center;width:50px}.spinner6>div{animation:stretchdelay 1.2s ease-in-out infinite;background-color:#fff;display:inline-block;height:100%;margin-left:2px;width:6px}.spinner6 .rect2{animation-delay:-1.1s}.spinner6 .rect3{animation-delay:-1s}.spinner6 .rect4{animation-delay:-.9s}.spinner6 .rect5{animation-delay:-.8s}.spinner7{height:30px;text-align:center;width:90px}.spinner7>div{animation:stretchdelay .7s ease-in-out infinite;background-color:#fff;border-radius:50%;display:inline-block;height:15px;margin-left:3px;width:15px}.spinner7 .circ2{animation-delay:-.6s}.spinner7 .circ3{animation-delay:-.5s}.spinner7 .circ4{animation-delay:-.4s}.spinner7 .circ5{animation-delay:-.3s}@keyframes stretchdelay{0%,40%,to{transform:translateY(-10px);-webkit-transform:translateY(-10px)}20%{transform:translateY(-20px);-webkit-transform:translateY(-20px)}}
