//
// Modals
// --------------------------------------------------

/* Joomla JUI NOTE: Original .modal definition has to be commented */

// > Joomla JUI
// Base modal
div.modal {
  position: fixed;
  top: 5%;
  left: 50%;
  z-index: @zindexModal;
  width: 80%;
  margin-left: -40%;
  background-color: @white;
  border: 1px solid #999;
  border: 1px solid rgba(0,0,0,.3);
  *border: 1px solid #999; /* IE6-7 */
  .border-radius(6px);
  .box-shadow(0 3px 7px rgba(0,0,0,0.3));
  .background-clip(padding-box);
  // Remove focus outline from opened modal
  outline: none;

  &.fade {
    .transition(e('opacity .3s linear, top .3s ease-out'));
    top: -25%;
  }
  &.fade.in { top: 5%; }
}
//Modal for Batch views
.modal-batch {
  overflow-y: visible;
}
// Modal viewport dimensions
.modal-body[class^="jviewport-height"],
.modal-body[class*="jviewport-height"] {
  max-height: none;
}
.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; }
}
div.modal.jviewport-width {
  &10 { width: 10vw; margin-left: -5vw; }
  &20 { width: 20vw; margin-left: -10vw; }
  &30 { width: 30vw; margin-left: -15vw; }
  &40 { width: 40vw; margin-left: -20vw; }
  &50 { width: 50vw; margin-left: -25vw; }
  &60 { width: 60vw; margin-left: -30vw; }
  &70 { width: 70vw; margin-left: -35vw; }
  &80 { width: 80vw; margin-left: -40vw; }
  &90 { width: 90vw; margin-left: -45vw; }
  &100 { width: 100vw; margin-left: -50vw; }
}
// < Joomla JUI