1.loader {
2  position: relative;
3  overflow: hidden;
4  box-shadow: -5px -5px -5px rgba(255, 255, 255, 0.1),
5                10px 10px 10px rgba(0, 0, 0, 0.4),
6                inset -5px -5px -5px rgba(255, 255, 255, 0.2),
7                inset 10px 10px 10px rgba(0, 0, 0, 0.4);
8  height: 100px;
9  width: 100px;
10  border-radius: 50%;
11}
12
13.loader:before {
14  position: absolute;
15  content: '';
16  z-index: 10;
17  opacity: 10;
18  top: 25px;
19  left: 25px;
20  right: 25px;
21  bottom: 25px;
22  background-color: #010113;
23  border-radius: 50%;
24  box-shadow: -5px -5px -5px rgba(255, 255, 255, 0.1),
25    10px 10px 10px rgba(0, 0, 0, 0.4),
26    inset -5px -5px -5px rgba(255, 255, 255, 0.2),
27    inset 10px 10px 10px rgba(0, 0, 0, 0.4);
28}
29
30.loader span {
31  position: absolute;
32  height: 100%;
33  width: 100%;
34  filter: blur(20px);
35  border-radius: 50%;
36  background: linear-gradient(#0e11d4, #0b8f84, #d81587);
37  animation: loader_41 0.6s linear infinite;
38}
39
40@keyframes loader_41 {
41  0% {
42    transform: rotate(0deg);
43  }
44
45  100% {
46    transform: rotate(360deg);
47  }
48}