@-webkit-keyframes line-scale { 0% { -webkit-transform : scaley(1); transform : scaley(1); } 50% { -webkit-transform : scaley(0.4); transform : scaley(0.4); } 100% { -webkit-transform : scaley(1); transform : scaley(1); } } @-moz-keyframes line-scale { 0% { -moz-transform : scaley(1); transform : scaley(1); } 50% { -moz-transform : scaley(0.4); transform : scaley(0.4); } 100% { -moz-transform : scaley(1); transform : scaley(1); } } @-o-keyframes line-scale { 0% { -o-transform : scaley(1); transform : scaley(1); } 50% { -o-transform : scaley(0.4); transform : scaley(0.4); } 100% { -o-transform : scaley(1); transform : scaley(1); } } @keyframes line-scale { 0% { -webkit-transform : scaley(1); -moz-transform : scaley(1); -o-transform : scaley(1); transform : scaley(1); } 50% { -webkit-transform : scaley(0.4); -moz-transform : scaley(0.4); -o-transform : scaley(0.4); transform : scaley(0.4); } 100% { -webkit-transform : scaley(1); -moz-transform : scaley(1); -o-transform : scaley(1); transform : scaley(1); } } .line-scale > div:nth-child(1) { -webkit-animation : line-scale 1s -0.4s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); -moz-animation : line-scale 1s -0.4s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); -o-animation : line-scale 1s -0.4s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); animation : line-scale 1s -0.4s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); } .line-scale > div:nth-child(2) { -webkit-animation : line-scale 1s -0.3s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); -moz-animation : line-scale 1s -0.3s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); -o-animation : line-scale 1s -0.3s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); animation : line-scale 1s -0.3s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); } .line-scale > div:nth-child(3) { -webkit-animation : line-scale 1s -0.2s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); -moz-animation : line-scale 1s -0.2s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); -o-animation : line-scale 1s -0.2s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); animation : line-scale 1s -0.2s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); } .line-scale > div:nth-child(4) { -webkit-animation : line-scale 1s -0.1s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); -moz-animation : line-scale 1s -0.1s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); -o-animation : line-scale 1s -0.1s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); animation : line-scale 1s -0.1s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); } .line-scale > div:nth-child(5) { -webkit-animation : line-scale 1s 0s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); -moz-animation : line-scale 1s 0s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); -o-animation : line-scale 1s 0s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); animation : line-scale 1s 0s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); } .line-scale > div { background-color : #55595C; width : 4px; height : 3.45rem; border-radius : 2px; margin : 2px; -webkit-animation-fill-mode : both; -moz-animation-fill-mode : both; -o-animation-fill-mode : both; animation-fill-mode : both; display : inline-block; }