/*----------------------------------------------------------------------------*	MODAL SHORTCODE
\*----------------------------------------------------------------------------*/
.mpc-modal { position: relative; display: inline-block; }

.mpc-modal__close { position: absolute; right: 0; top: 0; z-index: 1000; cursor: pointer; }

.mpc-modal__close .mpc-icon { margin: 0 !important; }

.mpc-modal__content { max-width: 90vw; max-height: 90vh; overflow-x: hidden; overflow-y: auto; }

.mpc-modal__content > *:last-child { margin-bottom: 0; }

html.mpc-block-scroll, body.mpc-block-scroll { overflow: hidden !important; }

/*----------------------------------------------------------------------------*	MODAL OVERLAY
\*----------------------------------------------------------------------------*/
.mpc-modal-overlay { position: fixed; left: 0; top: 0; right: 0; bottom: 0; width: 100%; height: 100%; opacity: 0; visibility: hidden; -webkit-transition: all .25s; transition: all .25s; }

.mpc-modal-overlay.mpc-visible { visibility: visible; opacity: 1; z-index: 1000000; }

.mpc-modal-overlay:before { content: ''; display: inline-block; width: 0; height: 100%; }

.mpc-modal-overlay .mpc-inited, .mpc-modal-overlay .mpc-inited * { visibility: inherit; }

.mpc-overlay__wrapper { position: relative; display: table; width: 100%; height: 100%; }

.mpc-overlay__wrapper--vertical { display: table-cell; }

/* Alignment */
.mpc-modal-overlay[data-position^=top]:before, .mpc-modal-overlay[data-position^=top] .mpc-modal { vertical-align: top; }

.mpc-modal-overlay[data-position^=middle]:before, .mpc-modal-overlay[data-position^=middle] .mpc-modal { vertical-align: middle; }

.mpc-modal-overlay[data-position^=bottom]:before, .mpc-modal-overlay[data-position^=bottom] .mpc-modal { vertical-align: bottom; }

.mpc-modal-overlay[data-position$=left] { text-align: left; }

.mpc-modal-overlay[data-position$=center] { text-align: center; }

.mpc-modal-overlay[data-position$=right] { text-align: right; }

/* Mobile */
@media screen and (max-width: 768px) { .mpc-modal-overlay .mpc-modal.mpc-modal .mpc-modal__content { max-height: 80vh; max-width: 80vw; }
  .mpc-close--outside .mpc-modal__close { margin: 0 !important; }
  .mpc-modal-overlay:before, .mpc-modal-overlay .mpc-modal { vertical-align: middle !important; margin: 0 !important; }
  .mpc-modal-overlay { text-align: center !important; } }
