.coutdown-animate {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
border-radius: 50%;
opacity: 0.3;
&:before {
content: "";
display: block;
margin-left: 50%;
height: 100%;
background-color: inherit;
color: #fff;
display: flex;
justify-content: center;
align-items: center;
border-radius: 0 50px 50px 0;
transform-origin: left;
}
&.animate {
background: #000;
background-image: linear-gradient(to right, transparent 50%, #9acd32 0);
&:before{
animation: spin 1.5s linear infinite, bg 3s step-end infinite;
}
}
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(180deg);
}
}
@keyframes bg {
50% {
background: #9acd32;
}
}