Loader by Peary74
#e8e8e8
1.loader { 2 position: absolute; 3} 4 5.cercle { 6 position: absolute; 7 background: #3f7ee8; 8 border-radius: 50%; 9 width: 60px; 10 height: 60px; 11 top: -40px; 12 left: -70px; 13 animation: move-up6 .4s ease-in infinite alternate-reverse; 14} 15 16.cercle:nth-child(2) { 17 width: 25px; 18 height: 25px; 19 top: -2px; 20 left: -5px; 21 background: #de4032; 22 animation: move-down1 .4s ease-in infinite alternate-reverse; 23} 24 25.cercle:nth-child(3) { 26 width: 30px; 27 height: 30px; 28 top: 35px; 29 left: -7px; 30 background: #eeb205; 31 animation: move-updown1 .4s ease-in infinite alternate-reverse; 32} 33 34.cercle:nth-child(4) { 35 width: 12px; 36 height: 12px; 37 top: -10px; 38 left: 25px; 39 background: #31aa52; 40 animation: move-up6 .4s ease-in infinite alternate-reverse; 41} 42 43@keyframes move-up6 { 44 to { 45 transform: translateY(-5px); 46 } 47} 48 49@keyframes move-down1 { 50 to { 51 transform: translateY(5px); 52 } 53} 54 55@keyframes move-updown1 { 56 to { 57 transform: translateY(10px); 58 } 59 60 from { 61 transform: translateY(-7px); 62 } 63} 64 65 66
610 views
610 views
MIT License