line-scale-pulse-out-rapid.css 2.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. @-webkit-keyframes line-scale-pulse-out-rapid {
  2. 0% {
  3. -webkit-transform : scaley(1);
  4. transform : scaley(1);
  5. }
  6. 80% {
  7. -webkit-transform : scaley(0.3);
  8. transform : scaley(0.3);
  9. }
  10. 90% {
  11. -webkit-transform : scaley(1);
  12. transform : scaley(1);
  13. }
  14. }
  15. @-moz-keyframes line-scale-pulse-out-rapid {
  16. 0% {
  17. -moz-transform : scaley(1);
  18. transform : scaley(1);
  19. }
  20. 80% {
  21. -moz-transform : scaley(0.3);
  22. transform : scaley(0.3);
  23. }
  24. 90% {
  25. -moz-transform : scaley(1);
  26. transform : scaley(1);
  27. }
  28. }
  29. @-o-keyframes line-scale-pulse-out-rapid {
  30. 0% {
  31. -o-transform : scaley(1);
  32. transform : scaley(1);
  33. }
  34. 80% {
  35. -o-transform : scaley(0.3);
  36. transform : scaley(0.3);
  37. }
  38. 90% {
  39. -o-transform : scaley(1);
  40. transform : scaley(1);
  41. }
  42. }
  43. @keyframes line-scale-pulse-out-rapid {
  44. 0% {
  45. -webkit-transform : scaley(1);
  46. -moz-transform : scaley(1);
  47. -o-transform : scaley(1);
  48. transform : scaley(1);
  49. }
  50. 80% {
  51. -webkit-transform : scaley(0.3);
  52. -moz-transform : scaley(0.3);
  53. -o-transform : scaley(0.3);
  54. transform : scaley(0.3);
  55. }
  56. 90% {
  57. -webkit-transform : scaley(1);
  58. -moz-transform : scaley(1);
  59. -o-transform : scaley(1);
  60. transform : scaley(1);
  61. }
  62. }
  63. .line-scale-pulse-out-rapid > div {
  64. background-color : #55595C;
  65. width : 4px;
  66. height : 3.45rem;
  67. border-radius : 2px;
  68. margin : 2px;
  69. -webkit-animation-fill-mode : both;
  70. -moz-animation-fill-mode : both;
  71. -o-animation-fill-mode : both;
  72. animation-fill-mode : both;
  73. display : inline-block;
  74. vertical-align : middle;
  75. -webkit-animation : line-scale-pulse-out-rapid 0.9s -0.5s infinite cubic-bezier(0.11, 0.49, 0.38, 0.78);
  76. -moz-animation : line-scale-pulse-out-rapid 0.9s -0.5s infinite cubic-bezier(0.11, 0.49, 0.38, 0.78);
  77. -o-animation : line-scale-pulse-out-rapid 0.9s -0.5s infinite cubic-bezier(0.11, 0.49, 0.38, 0.78);
  78. animation : line-scale-pulse-out-rapid 0.9s -0.5s infinite cubic-bezier(0.11, 0.49, 0.38, 0.78);
  79. }
  80. .line-scale-pulse-out-rapid > div:nth-child(2), .line-scale-pulse-out-rapid > div:nth-child(4) {
  81. -webkit-animation-delay : -0.25s !important;
  82. -moz-animation-delay : -0.25s !important;
  83. -o-animation-delay : -0.25s !important;
  84. animation-delay : -0.25s !important;
  85. }
  86. .line-scale-pulse-out-rapid > div:nth-child(1), .line-scale-pulse-out-rapid > div:nth-child(5) {
  87. -webkit-animation-delay : 0s !important;
  88. -moz-animation-delay : 0s !important;
  89. -o-animation-delay : 0s !important;
  90. animation-delay : 0s !important;
  91. }