@keyframes spinner-two { 0% { transform: rotate(0deg); } to { transform: rotate(359deg); } } .gg-spinner-two { transform: scale(var(--ggs, 1)); box-sizing: border-box; position: relative; display: block; width: 20px; height: 20px; &::after { box-sizing: border-box; display: block; width: 20px; height: 20px; content: ""; position: absolute; border-radius: 100px; } &::before { box-sizing: border-box; display: block; width: 20px; height: 20px; content: ""; position: absolute; border-radius: 100px; animation: spinner-two 1s cubic-bezier(0.6, 0, 0.4, 1) infinite; border: 3px solid transparent; border-bottom-color: currentColor; border-top-color: currentColor; } &::after { border: 3px solid; opacity: 0.2; } }