.loader {
  display: inline-grid;
  width: 20vmin;
  aspect-ratio: 1;
  border-radius: 50%;
  background: repeating-conic-gradient(from 30deg,#C02942 0 60deg,#eee 0 120deg);
  animation: l10-0 2s linear infinite;
}
.loader:before,
.loader:after {
  content:"";
  grid-area: 1/1;
  border-radius: 50%;
  background: inherit;
  transform: rotate(0turn) translate(100%,0);
  animation: l10-1 3s infinite ease-in-out;
}
.loader:after {
  animation-delay: -1.5s;
}
@keyframes l10-0 {to{rotate: -1turn}}
@keyframes l10-1 {to{transform: rotate(1turn) translate(100%,0) rotate(1turn)}}


body {
  margin: 0;
  min-height: 100vh;
  display: grid;
  place-content: center;
}