.loader-page-web {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: 
    radial-gradient(farthest-side,#848484 94%,#0000) top/4px 4px no-repeat,
    conic-gradient(#0000 30%,#848484);
  -webkit-mask: radial-gradient(farthest-side,#0000 calc(100% - 4px),#000 0);
  animation:s3 0.5s infinite linear;
}

@keyframes s3{ 
  100%{transform: rotate(1turn)}
}

.loader-data {
  width:25px;
  height:25px;
  border-radius:50%;
  padding:1px;
  background:conic-gradient(#0000 10%,#51B122) content-box;
  -webkit-mask:
    repeating-conic-gradient(#0000 0deg,#000 1deg 20deg,#0000 21deg 36deg),
    radial-gradient(farthest-side,#0000 calc(100% - 4.5px),#000 calc(100% - 4px));
  -webkit-mask-composite: destination-in;
  mask-composite: intersect;
  animation:s4 0.5s infinite steps(10);
}
@keyframes s4 {to{transform: rotate(1turn)}}