1.loader {
2  display: flex;
3  justify-content: center;
4  align-items: center;
5  height: 100%;
6}
7
8.loader__circle {
9  width: 14px;
10  height: 14px;
11  border-radius: 50%;
12  margin: 0 4px;
13  animation: loader_901 1s ease-in-out infinite;
14}
15
16.loader__circle:nth-of-type(1) {
17  background-color: #007aff;
18  animation-delay: 0;
19}
20
21.loader__circle:nth-of-type(2) {
22  background-color: #ff2d55;
23  animation-delay: 0.25s;
24}
25
26.loader__circle:nth-of-type(3) {
27  background-color: #34c759;
28  animation-delay: 0.5s;
29}
30
31.loader__circle:nth-of-type(4) {
32  background-color: #ff9500;
33  animation-delay: 0.75s;
34}
35
36@keyframes loader_901 {
37  0% {
38    transform: scale(1);
39  }
40
41  20% {
42    transform: scale(1.2);
43  }
44
45  40% {
46    transform: scale(1);
47  }
48}
49