.spectrum--large .spectrum-Modal {

  transition: transform 130ms ease-in-out,
              opacity 130ms ease-in-out,
              visibility 0ms linear 130ms;
}
.spectrum--large .spectrum-Modal-wrapper {
  transition: visibility 0ms linear
    130ms;
}
.spectrum--large .spectrum-Modal {
  transform: translateY(25px);
  max-height: 90vh;

  border-radius: 5px;
  transition: opacity 130ms
      cubic-bezier(0.5, 0, 1, 1) 0ms,
    visibility 0ms linear
      130ms,
    transform 0ms linear
      130ms;
}
.spectrum--large .spectrum-Modal.is-open {
    transition: transform 250ms
        cubic-bezier(0, 0, 0.4, 1) 160ms,
      opacity 250ms
        cubic-bezier(0, 0, 0.4, 1) 160ms;
  }
.spectrum--large .spectrum-Modal--fullscreen {
  left: 32px;
  top: 32px;
  right: 32px;
  bottom: 32px;
}
.spectrum-Modal {
  visibility: hidden;

  opacity: 0;

  transition: transform 130ms ease-in-out,
              opacity 130ms ease-in-out,
              visibility 0ms linear 130ms;

  pointer-events: none;
}
.spectrum-Modal.is-open {
  visibility: visible;

  opacity: 1;

  transition-delay: 0ms;

  pointer-events: auto;
}
.spectrum-Modal-wrapper {
  position: fixed;
  left: 0;
  top: 0;

  display: -ms-flexbox;

  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center;

  box-sizing: border-box;
  width: 100vw;
  height: 100vh;
  height: -webkit-fill-available;
  height: fill-available;

  visibility: hidden;
  pointer-events: none;
  z-index: 2;
  transition: visibility 0ms linear
    130ms;
}
.spectrum-Modal-wrapper.is-open {
    visibility: visible;
  }
.spectrum-Modal {
  transform: translateY(20px);
  z-index: 2;
  max-height: 90vh;

  border-radius: 4px;
  overflow: hidden;
  outline: none;
  pointer-events: auto;
  transition: opacity 130ms
      cubic-bezier(0.5, 0, 1, 1) 0ms,
    visibility 0ms linear
      130ms,
    transform 0ms linear
      130ms;
}
.spectrum-Modal.is-open {
    transition: transform 250ms
        cubic-bezier(0, 0, 0.4, 1) 160ms,
      opacity 250ms
        cubic-bezier(0, 0, 0.4, 1) 160ms;

    transform: translateY(0);
  }
@media only screen and (max-device-width: 400px), only screen and (max-device-height: 350px) {
  .spectrum-Modal--responsive {
    width: 100%;
    height: 100%;
    max-width: 100%;
    max-height: 100%;
    border-radius: 0;
  }
    .spectrum-Modal-wrapper .spectrum-Modal--responsive {
      margin-top: 0;
    }
}
.spectrum-Modal--fullscreen {
  position: fixed;
  left: 32px;
  top: 32px;
  right: 32px;
  bottom: 32px;
  max-width: none;
  max-height: none;
}
.spectrum-Modal--fullscreenTakeover {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  max-width: none;
  max-height: none;

  box-sizing: border-box;
  border: none;
  border-radius: 0;
}
.spectrum-Modal--fullscreenTakeover,
  .spectrum-Modal--fullscreenTakeover.is-open {
    transform: none;
  }
.spectrum--dark .spectrum-Modal {
  background: rgb(50, 50, 50);
}.spectrum--darkest .spectrum-Modal {
  background: rgb(30, 30, 30);
}.spectrum--light .spectrum-Modal {
  background: rgb(245, 245, 245);
}.spectrum--lightest .spectrum-Modal {
  background: rgb(255, 255, 255);
}