.ModalBackdrop {
  z-index: 1000;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.5);
  padding: 0;
  animation: fadeIn ease 0.3s;

  @include iftablet {
    position: fixed;
    height: 100vh;
    padding: 0 rem(20px);
  }

  @include iflaptop {
    padding: 0 rem(48px);
  }

  &_open {
    animation: fadeOut ease 0.3s;
  }

  &_isIOS {
    height: 150vh !important;

    @include iftablet {
      height: unset;
    }
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}