wecuro_blog/common/app-assets/css/plugins/loaders/animations/ball-clip-rotate-multiple.css

32 lines
853 B
CSS
Executable File

@keyframes rotate {
0% {
transform: rotate(0deg) scale(1); }
50% {
transform: rotate(180deg) scale(0.6); }
100% {
transform: rotate(360deg) scale(1); } }
.ball-clip-rotate-multiple {
position: relative; }
.ball-clip-rotate-multiple > div {
animation-fill-mode: both;
position: absolute;
left: -20px;
top: -20px;
border: 2px solid #6B6F82;
border-bottom-color: transparent;
border-top-color: transparent;
border-radius: 100%;
height: 35px;
width: 35px;
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;
animation-duration: 0.5s;
border-color: #6B6F82 transparent #6B6F82 transparent;
animation-direction: reverse; }