ball-scale-ripple.css 865 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. /*========================================================
  2. DARK LAYOUT
  3. =========================================================*/
  4. @-webkit-keyframes ball-scale-ripple {
  5. 0% {
  6. transform: scale(0.1);
  7. opacity: 1;
  8. }
  9. 70% {
  10. transform: scale(1);
  11. opacity: 0.7;
  12. }
  13. 100% {
  14. opacity: 0;
  15. }
  16. }
  17. @keyframes ball-scale-ripple {
  18. 0% {
  19. transform: scale(0.1);
  20. opacity: 1;
  21. }
  22. 70% {
  23. transform: scale(1);
  24. opacity: 0.7;
  25. }
  26. 100% {
  27. opacity: 0;
  28. }
  29. }
  30. .ball-scale-ripple > div {
  31. -webkit-animation-fill-mode: both;
  32. animation-fill-mode: both;
  33. height: 50px;
  34. width: 50px;
  35. border-radius: 100%;
  36. border: 2px solid #b8c2cc;
  37. -webkit-animation: ball-scale-ripple 1s 0s infinite cubic-bezier(0.21, 0.53, 0.56, 0.8);
  38. animation: ball-scale-ripple 1s 0s infinite cubic-bezier(0.21, 0.53, 0.56, 0.8);
  39. }