// Modal

.jviewport-height {
  &10 {
    height: 10vh;
  }

  &20 {
    height: 20vh;
  }

  &30 {
    height: 30vh;
  }

  &40 {
    height: 40vh;
  }

  &50 {
    height: 50vh;
  }

  &60 {
    height: 60vh;
  }

  &70 {
    height: 70vh;
  }

  &80 {
    height: 80vh;
  }

  &90 {
    height: 90vh;
  }

  &100 {
    height: 100vh;
  }
}

[class*=jviewport-height] iframe {
  height: 100%;
}

.modal-dialog.jviewport-width {
  &10 {
    width: 10vw;
  }

  &20 {
    width: 20vw;
    max-width: none;
  }

  &30 {
    width: 30vw;
    max-width: none;
  }

  &40 {
    width: 40vw;
    max-width: none;
  }

  &50 {
    width: 50vw;
    max-width: none;
  }

  &60 {
    width: 60vw;
    max-width: none;
  }

  &70 {
    width: 70vw;
    max-width: none;
  }

  &80 {
    width: 80vw;
    max-width: none;
  }

  &90 {
    width: 90vw;
    max-width: none;
  }

  &100 {
    width: 100vw;
    max-width: none;
  }
}

.modal-dialog {
  @include media-breakpoint-down(md) {
    margin: 1.75rem auto;
  }

  .modal-body {
    padding: 0;
  }
}