.modal.fade {
  opacity: 0;
  transition: opacity 0.5s ease;
}

.modal.fade.show {
  opacity: 1;
  transition-duration: 0.5s;
}

.modal.fade .modal-dialog {
  transform: translate3d(0, 100vh, 0) !important;
  opacity: 0 !important;
  transition: transform 0.5s ease, opacity 0.5s ease !important;
  will-change: transform, opacity;
}

.modal.fade.show .modal-dialog {
  transform: translate3d(0, 0, 0) !important;
  opacity: 1 !important;
  transition-duration: 0.5s !important;
}

.modal.is-open .modal-dialog {
  transform: translate3d(0, 0, 0) !important;
  opacity: 1 !important;
}

.modal-backdrop.fade {
  opacity: 0;
  transition: opacity 0.5s ease !important;
}

.modal-backdrop.show {
  opacity: 0.5;
  transition-duration: 0.5s !important;
}