This post is saved as a draft.
#212121
1.ld-ripple { 2 position: relative; 3 width: 80px; 4 height: 80px; 5} 6 7.ld-ripple div { 8 position: absolute; 9 border: 4px solid #fff; 10 opacity: 1; 11 border-radius: 50%; 12 animation: ld-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite; 13} 14 15.ld-ripple div:nth-child(2) { 16 animation-delay: -0.5s; 17} 18 19@keyframes ld-ripple { 20 0% { 21 top: 36px; 22 left: 36px; 23 width: 0; 24 height: 0; 25 opacity: 0; 26 } 27 28 4.9% { 29 top: 36px; 30 left: 36px; 31 width: 0; 32 height: 0; 33 opacity: 0; 34 } 35 36 5% { 37 top: 36px; 38 left: 36px; 39 width: 0; 40 height: 0; 41 opacity: 1; 42 } 43 44 100% { 45 top: 0px; 46 left: 0px; 47 width: 72px; 48 height: 72px; 49 opacity: 0; 50 } 51}
Variation of aloader
Variation of aloader