.loader-17 .css-square { position: absolute; top: 50%; width: 40upx; height: 12upx; background: #ffffff; } .loader-17 .square1 { left: 180upx; -webkit-animation: dominos 1s 0.125s ease infinite; animation: dominos 1s 0.125s ease infinite; } .loader-17 .square2 { left: 160upx; -webkit-animation: dominos 1s 0.3s ease infinite; animation: dominos 1s 0.3s ease infinite; } .loader-17 .square3 { left: 140upx; -webkit-animation: dominos 1s 0.425s ease infinite; animation: dominos 1s 0.425s ease infinite; } .loader-17 .square4 { left: 120upx; -webkit-animation: dominos 1s 0.540s ease infinite; animation: dominos 1s 0.540s ease infinite; } .loader-17 .square5 { left: 100upx; -webkit-animation: dominos 1s 0.665s ease infinite; animation: dominos 1s 0.665s ease infinite; } .loader-17 .square6 { left: 80upx; -webkit-animation: dominos 1s 0.79s ease infinite; animation: dominos 1s 0.79s ease infinite; } .loader-17 .square7 { left: 60upx; -webkit-animation: dominos 1s 0.9s ease infinite; animation: dominos 1s 0.9s ease infinite; } .loader-17 .square8 { left: 40upx; -webkit-animation: dominos 1s 1.01s ease infinite; animation: dominos 1s 1.01s ease infinite; } .loader-17 .square9 { left: 20upx; -webkit-animation: dominos 1s 1.10s ease infinite; animation: dominos 1s 1.10s ease infinite; } @keyframes dominos { 50% { opacity: 0.7; } 75% { -webkit-transform: rotate(90deg); transform: rotate(90deg); } 80% { opacity: 1; } } @keyframes ball-turn { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } }