@import "work/work-includes";

modal {
  @include align-items(center);
  @include display(flex);
  @include justify-content(center);
  @include transform(scale(0));
  @include transition (all 0.2s ease-in-out);

  position  : fixed;
  top       : 0;
  left      : 0;
  width     : 100%;
  height    : 100%;
  z-index   : 1000;
  opacity   : 0;

  &.slide {
    top: 100vh;
    transform: inherit;

    &.show {
      top: 0;
      opacity: 1;
    }
  }

  &.show {
    @include transform(scale(1));
    opacity: 1;
  }

  .close {
    position        : absolute;
    right           : 20px;
    top             : 20px;
    background-color: white;
    z-index         : 1000;

    .icon {
      width: 25px;
      height: 25px;
    }
  }
}