~~~
#redball{
border-radius: 50%;
width: 20vw;
height: 20vw;
margin-left: 40%;
background-image: radial-gradient(ellipse farthest-corner at 25% 25% ,#f00,#000);
transform-origin: center bottom;
animation: bounce 3s cubic-bezier(0.3,2.4,0.85,0.3) infinite;
}
@keyframes bounce {
from, to{
transform: translateY(15vh) scaleY(0.88);
}
0%{
transform: translateY(15vh) scaleY(0.88);
}
75%{
transform: translateY(15vh) scaleY(0.88);
}
80%{
transform: translateY(15vh) scaleY(1.12);
}
}
~~~
