.dialog {
  display: flex;
  flex-flow: column;

  position: fixed;
  top: 50%;
  left: 50%;

  transform: translate(-50%, -50%);


  width: 335px;
  height: auto;

  padding: 1.5rem 1.7rem;

  background: white;

  .shadow-16;

  z-index: 3;

  transition: opacity 0.5s ease;

  opacity: 0;
  pointer-events: none;

  &.active {
    opacity: 1;
    pointer-events: all;
  }

  p:first-of-type {
    margin: 0 0 2.5rem;
  }
  p {
    margin: 0 0 2rem;
  }

  input {
    margin-bottom: 2rem;
  }

  .foot {
    display: flex;

    justify-content: space-between;

    button {
      flex: 1;

      margin: 0 8px;

      &:first-of-type {
        margin-left: 0;
      }
      &:last-of-type {
        margin-right: 0;
      }
    }
  }
}