.loader{border:5px solid #0000;border-radius:50%;width:220px;height:220px;position:relative;box-shadow:5px 5px 5px #0c0c0c,inset 5px 5px 5px #181717,inset -1px -1px 10px #9994946e,-1px -1px 10px #cec6c648}.loader:before{content:"";background:repeating-conic-gradient(#3d3b3b 0%,#f8f8f688 15%,#363434 33.33%);border-radius:50%;width:180px;height:180px;display:inline-block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:5px 5px 20px #000,-2px -2px 40px #000}.ball{width:15px;height:15px;animation:rotate 5s calc(var(--delay) * .2s) infinite linear;background:radial-gradient(circle at 5px 5px,#fff 1%,#050505 50%);border-radius:50%;display:inline-block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)translate(97.5px)}@keyframes rotate{0%{transform:translate(-50%,-50%)rotate(0)translate(97.5px)}to{transform:translate(-50%,-50%)rotate(360deg)translate(97.5px)}}