.Modal {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: var(--space-5xl);
}

  .Modal-Window {
    z-index: 100;
    overflow: auto;
    min-width: 400px;
    max-width: 90%;
    min-height: 200px;
    max-height: 90%;
    background-color: var(--color-bg-default);
    border-radius: var(--control-radius);
    -webkit-box-shadow: 0 4px 12px rgba(var(--color-nums-shadow), 0.08),
      0 9px 24px rgba(var(--color-nums-shadow), 0.16);
            box-shadow: 0 4px 12px rgba(var(--color-nums-shadow), 0.08),
      0 9px 24px rgba(var(--color-nums-shadow), 0.16);
  }

  .Modal-Window_position_center {
        -ms-flex-item-align: safe center;
            align-self: safe center;
      }

  .Modal-Window_position_top {
        -ms-flex-item-align: safe flex-start;
            align-self: safe flex-start;
      }

  .Modal-Overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    background: var(--color-bg-tone);
    border: none;
  }

  .Modal_animate_appear,
    .Modal_animate_enter,
    .Modal_animate_exit,
    .Modal_animate_appearActive,
    .Modal_animate_enterActive,
    .Modal_animate_exitActive {
      -webkit-transition: opacity 0.2s ease;
      transition: opacity 0.2s ease;
    }

  .Modal_animate_appear,
    .Modal_animate_enter {
      opacity: 0;
    }

  .Modal_animate_appearActive,
    .Modal_animate_enterActive {
      opacity: 1;
    }

  .Modal_animate_exit {
      opacity: 1;
    }

  .Modal_animate_exitActive {
      opacity: 0;
    }
