/**
 * Modals are independent windows that slide in from off-screen.
 */

.modal {
  position: fixed; 

  z-index: $zindex-modal;

  top: 0;

  opacity: 0;
  -webkit-transform: translate3d(0,100%,0);

  width: 100%;
  min-height: 100%;

  overflow: hidden;

  background-color: $modal-bg-color;

  // Active modal
  &.active {
    height: 100%;
  }
}