Select the timing function to be used for the transition:
linear - this animation goes from its initial state to its final one regularly, with a constant velocity.
ease - this animation accelerates more sharply at the beginning, starts to slow down before the time is halfway through, and gently comes to rest.
ease-in - this animation begins slowly, then progressively accelerates until the final state is reached and the animation stops abruptly.
ease-out - this animation starts quickly and then slows down when approaching to its final state.
ease-in-out - this animation starts slowly, accelerates faster, and then slows down when approaching its final state. At the beginning, it behaves similarly to the ease-in function; at the end, it is similar to the ease-out function.
