#pp-root .pp-loading-container {
margin: 60px auto 0;
width: 150px;
}
#pp-root .pp-loading-container .loading {
display: flex;
height: 80px;
justify-content: space-around;
align-items: center;
}
#pp-root .pp-loading-container span {
width: 10px;
height: 10px;
background-color: #e6e6e6;
border-radius: 50%;
display: inline-block;
line-height: 80px;
animation: loading 2s infinite ease;
-webkit-animation: loading 2s infinite ease;
}
#pp-root .pp-loading-container span:nth-child(1) {
animation-delay: 0s;
-webkit-animation-delay: 0s;
}
#pp-root .pp-loading-container span:nth-child(2) {
animation-delay: 0.2s;
-webkit-animation-delay: 0.2s;
}
#pp-root .pp-loading-container span:nth-child(3) {
animation-delay: 0.4s;
-webkit-animation-delay: 0.4s;
}
#pp-root .pp-loading-container span:nth-child(4) {
animation-delay: 0.6s;
-webkit-animation-delay: 0.6s;
}
#pp-root .pp-loading-container span:nth-child(5) {
animation-delay: 0.8s;
-webkit-animation-delay: 0.8s;
}
#pp-root .pp-loading-container span:nth-child(6) {
animation-delay: 1s;
-webkit-animation-delay: 1s;
}
@keyframes loading {
0% {
transform: scale(1);
}
20% {
transform: scale(2.5);
}
40% {
transform: scale(1);
}
}