CSS различные переходы, упрощающие при добавлении или удалении класса

Question

Возможен ли переход CSS для замедления при добавлении класса и замедления при его удалении?

$('button').on("click", function(){
  $('.box').toggleClass("alt")
})

.box {
  width: 50px;
  height: 50px;
  background: red;
  transition: all 1500ms cubic-bezier(0.55, 0.055, 0.675, 0.19);

  /* easeOutCubic cubic-bezier(0.215, 0.61, 0.355, 1); */
  /* easeInCubic cubic-bezier(0.55, 0.055, 0.675, 0.19); */
}

.box.alt {
  transform: translate3d(600px, 0px, 0) scale(1.5);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="box"></div>
<button>CLICK</button>

Answer 1

Добавить переход к классу alt также

.box.alt {
    transition: all 1500ms cubic-bezier(0.55, 0.055, 0.675, 0.19); // added ease in transition as mentioned by you in ques
    transform: translate3d(600px, 0px, 0) scale(1.5);
}