.wtokdfnshdiuwezrkjsdfhksnalsdjalejkrwekfkskfjsdjfkksldfjghksdkfklsdfjuerjfksdlksdflkjsdkthfdkvnfskdlfjksdhtj-spinner { width: 72px; height: 72px; position: relative; } .wtokdfnshdiuwezrkjsdfhksnalsdjalejkrwekfkskfjsdjfkksldfjghksdkfklsdfjuerjfksdlksdflkjsdkthfdkvnfskdlfjksdhtj-spinner > div { border-radius: 50%; width: 9px; left: 0; box-sizing: border-box; display: block; position: absolute; border: 9px solid #fff; width: 72px; height: 72px; } .wtokdfnshdiuwezrkjsdfhksnalsdjalejkrwekfkskfjsdjfkksldfjghksdkfklsdfjuerjfksdlksdflkjsdkthfdkvnfskdlfjksdhtj-spinner-ring-bg{ opacity: 0.25; } div.wtokdfnshdiuwezrkjsdfhksnalsdjalejkrwekfkskfjsdjfkksldfjghksdkfklsdfjuerjfksdlksdflkjsdkthfdkvnfskdlfjksdhtj-spinner-ring { animation: spinner-animation 0.8s cubic-bezier(1, 1, 1, 1) infinite; border-color:var(--wtokdfnshdiuwezrkjsdfhksnalsdjalejkrwekfkskfjsdjfkksldfjghksdkfklsdfjuerjfksdlksdflkjsdkthfdkvnfskdlfjksdhtj-beautiful-spinner-color2) transparent transparent transparent; } @keyframes spinner-animation{ from{ transform: rotate(0deg); } to { transform: rotate(360deg); } }