ball-scale-random.css 1016 B

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. @keyframes ball-scale {
  2. 0% {
  3. transform: scale(0); }
  4. 100% {
  5. transform: scale(1);
  6. opacity: 0; } }
  7. .ball-scale > div {
  8. background-color: #55595c;
  9. width: 15px;
  10. height: 15px;
  11. border-radius: 100%;
  12. margin: 2px;
  13. animation-fill-mode: both;
  14. display: inline-block;
  15. height: 60px;
  16. width: 60px;
  17. animation: ball-scale 1s 0s ease-in-out infinite; }
  18. .ball-scale-random {
  19. width: 37px;
  20. height: 40px; }
  21. .ball-scale-random > div {
  22. background-color: #55595c;
  23. width: 15px;
  24. height: 15px;
  25. border-radius: 100%;
  26. margin: 2px;
  27. animation-fill-mode: both;
  28. position: absolute;
  29. display: inline-block;
  30. height: 30px;
  31. width: 30px;
  32. animation: ball-scale 1s 0s ease-in-out infinite; }
  33. .ball-scale-random > div:nth-child(1) {
  34. margin-left: -7px;
  35. animation: ball-scale 1s 0.2s ease-in-out infinite; }
  36. .ball-scale-random > div:nth-child(3) {
  37. margin-left: -2px;
  38. margin-top: 9px;
  39. animation: ball-scale 1s 0.5s ease-in-out infinite; }