.wizard {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  
  width: 500px;
  background-color: #f0f0f0;
  overflow: hidden;
  transition: transform 0.3s ease-in-out;
  &.step_1 .wizard__step {
    transform: translateX(-100%);
  }

  &.step_2 .wizard__step {
    transform: translateX(-200%);
  }
}

.wizard__step {
  backface-visibility: hidden; 
  transform: translate3d(0, 0, 0);
  transition: transform 0.5s ease-in-out;
  width: 500px;
  flex-shrink: 0;
}