Edit File: ball-clip-rotate-multiple.css
/*======================================================== DARK LAYOUT =========================================================*/ @-webkit-keyframes rotate { 0% { -webkit-transform : rotate(0deg) scale(1); transform : rotate(0deg) scale(1); } 50% { -webkit-transform : rotate(180deg) scale(0.6); transform : rotate(180deg) scale(0.6); } 100% { -webkit-transform : rotate(360deg) scale(1); transform : rotate(360deg) scale(1); } } @keyframes rotate { 0% { -webkit-transform : rotate(0deg) scale(1); transform : rotate(0deg) scale(1); } 50% { -webkit-transform : rotate(180deg) scale(0.6); transform : rotate(180deg) scale(0.6); } 100% { -webkit-transform : rotate(360deg) scale(1); transform : rotate(360deg) scale(1); } } .ball-clip-rotate-multiple { position : relative; } .ball-clip-rotate-multiple > div { -webkit-animation-fill-mode : both; animation-fill-mode : both; position : absolute; left : -20px; top : -20px; border : 2px solid #B8C2CC; border-bottom-color : transparent; border-top-color : transparent; border-radius : 100%; height : 35px; width : 35px; -webkit-animation : rotate 1s 0s ease-in-out infinite; animation : rotate 1s 0s ease-in-out infinite; } .ball-clip-rotate-multiple > div:last-child { display : inline-block; top : -10px; left : -10px; width : 15px; height : 15px; -webkit-animation-duration : 0.5s; animation-duration : 0.5s; border-color : #B8C2CC transparent #B8C2CC transparent; animation-direction : reverse; }
Back to File Manager