.loaderContainer{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.loader{--color-1:#c18b57;--color-2:#558082;--size:2px;width:calc(48 * var(--size));height:calc(48 * var(--size));border:calc(3 * var(--size)) dotted var(--color-1);box-sizing:border-box;border-style:solid solid dotted dotted;border-radius:50%;animation:2s linear infinite rotation;display:inline-block;position:relative}.loader:after{content:"";box-sizing:border-box;border:calc(3 * var(--size)) dotted var(--color-2);width:calc(24 * var(--size));height:calc(24 * var(--size));transform-origin:50%;border-style:solid solid dotted;border-radius:50%;margin:auto;animation:1s linear infinite rotationBack;position:absolute;inset:0}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotationBack{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}