How to use transition-timing-function: ease to create ease-in transitions

Question

For a digital comic strip that I want to develop, I wonder if it's possible to create ease-ins or ease-outs with transition-timing-function: ease.

I inserted transition-timing-function in an old "animation" but it seems to have no effect, even changing the parameters wildly. I'm probably doing something stupid. Mixing pears with apples or putting eggs in tomato cans.

Can someone guide me on this?

The piece of CSS code is:

.rotate {
  animation: 1s linear infinite rotate;
  position: relative;
  transform-origin: 103% 98%;
  transform-delay: 2s;
   /* THIS IS NEW */
  transition-timing-function: ease;
  /* THIS IS NEW */ 
  transition-timing-function: cubic-bezier(0.25, 1, 0.25, 1);
} 

The Codepen: https://codepen.io/Sergio_Urra/pen/JVEexy