/* CODSHIPX_READINESS_KYC_SPA_SLIDE_R11R3R2 */

main.cx-seller-route-exit-r11r3r2 {
  pointer-events: none;
  animation:
    cxSellerRouteExitR11R3R2
    145ms
    cubic-bezier(.4,0,.8,.2)
    both;
  will-change: transform, opacity;
}

main.cx-seller-route-enter-r11r3r2 {
  animation:
    cxSellerRouteEnterR11R3R2
    300ms
    cubic-bezier(.16,1,.3,1)
    both;
  will-change: transform, opacity;
}

@keyframes cxSellerRouteExitR11R3R2 {
  from {
    opacity: 1;
    transform: translate3d(0,0,0);
  }

  to {
    opacity: 0;
    transform: translate3d(-18px,0,0);
  }
}

@keyframes cxSellerRouteEnterR11R3R2 {
  from {
    opacity: 0;
    transform: translate3d(22px,0,0);
  }

  to {
    opacity: 1;
    transform: translate3d(0,0,0);
  }
}

@media (max-width: 640px) {
  @keyframes cxSellerRouteExitR11R3R2 {
    from {
      opacity: 1;
      transform: translate3d(0,0,0);
    }

    to {
      opacity: 0;
      transform: translate3d(-12px,0,0);
    }
  }

  @keyframes cxSellerRouteEnterR11R3R2 {
    from {
      opacity: 0;
      transform: translate3d(14px,0,0);
    }

    to {
      opacity: 1;
      transform: translate3d(0,0,0);
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  main.cx-seller-route-exit-r11r3r2,
  main.cx-seller-route-enter-r11r3r2 {
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
  }
}