/*!
* Plugin: jQuery AJAX-ZOOM, /axZm/extensions/axZmAppContainer/jquery.axZm.appContainer.css
* Copyright: Copyright (c) 2010-2021 Vadim Jacobi
* License Agreement: https://www.ajax-zoom.com/index.php?cid=download
* Extension Version: 1.1.0
* Extension Date: 2021-05-25
* URL: https://www.ajax-zoom.com
* Extension usage: https://www.ajax-zoom.com/examples/example32_modal.php
*/

body.axZmAppContainer {
  overflow: hidden !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
}

.axZmAppContainerOverlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  box-sizing: border-box !important;
  width: 100%;
  height: 100%;
  outline: 0;
}

.axZmAppContainerBack {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background-color: #000;
  opacity: 0;
}

.axZmAppContainerBack.axZmAppContainerFadeIn {
  opacity: .6;
  transition: all .25s linear;
  transition: opacity .25s linear;
}

.axZmAppContainerBack.axZmAppContainerFadeOut {
  opacity: 0;
  transition: all .15s linear;
  transition: opacity .15s linear;
}

.axZmAppContainerOverlay .axZmAppContainerCloseButton {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 11;
  width: 32px;
  height: 32px;
  font-family: Arial;
  font-size: 24px;
  line-height: 32px;
  text-align: center;
  cursor: pointer;
  background-color: transparent;
  transition: all .25s ease-out;
  transition: all .25s ease-out;
  transform: rotate(0deg);
}

.axZmAppContainerOverlay .axZmAppContainerCloseButton:hover {
  /* transform: rotate(-90deg); */

  /* background-color: red; */
}

.axZmAppContainerOverlay .axZmAppContainerCloseButton::after {
  content: "\2716\fe0e"; /* 10006 */
}

.axZmAppContainerBox {
  position: relative;
  z-index: 2;
  box-sizing: border-box !important;
  width: 100%;
  height: 100%;
  padding: 0; /* full page */
  pointer-events: none;
  outline: 0;
}

.axZmAppContainerBox.axZmAppContainerModal {
  /* center element on the screen */
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  /* You can set max-width if you wish and center vertically and horizontally; remove the below otherwise */
  max-width: 1220px;
  max-height: 1024px;
  padding: 40px;
  margin: auto;
}

.axZmAppContainerBox.axZmAppContainerWindow {
  /* center element on the screen */
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 35px;
  margin: auto;
}

@media (min-width: 1900px) and (min-height: 1020px) {
  .axZmAppContainerBox.axZmAppContainerModal {
    max-width: 1540px;
  }
}

.axZmAppContainerBox.axZmAppContainerFlyOutPrepare {
  transition: transform, opacity;
  transition-duration: .4s, .15s;
}

.axZmAppContainerBox.axZmAppContainerFlyOut {
  opacity: 0;
  transform: translate(0, -50%);
}

.axZmAppContainerBox.axZmAppContainerFlyInPrepare {
  opacity: 0;
  transition: transform, opacity;
  transition-timing-function: ease;
  transition-duration: .4s;
  transform: translate(0, -50%);
}

.axZmAppContainerBox.axZmAppContainerFlyIn {
  opacity: 1;
  transform: translate(0, 0);
}

.axZmAppContainerContent {
  position: relative;
  box-sizing: border-box !important;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  overflow: hidden;
  pointer-events: auto;
  background-color: #fff;
}

/* Style of the modal window */
.axZmAppContainerWindow .axZmAppContainerContent,
.axZmAppContainerModal .axZmAppContainerContent {
  padding: 0;
  border-radius: 0;
  box-shadow: 0 5px 15px rgb(0, 0, 0, .5);
  box-shadow: 0 5px 15px rgb(0, 0, 0, .5);

  /* if you want rounded corners for the modal, add them here */

  /* border-radius: 6px; */

  /* For having an inner border, add padding here */

  /* padding: 5px; */
}

/* Disable modal on small screens */
@media (max-width: 1023px), (max-height: 600px) {
  .axZmAppContainerBox.axZmAppContainerModal,
  .axZmAppContainerBox.axZmAppContainerWindow {
    /* Remove max size and max width if they were set */
    max-width: none;
    max-height: none;
    padding: 0;
  }

  .axZmAppContainerModal .axZmAppContainerContent,
  .axZmAppContainerWindow .axZmAppContainerContent {
    padding: 0 !important;
    border-width: 0 !important;
    border-radius: 0 !important;
    box-shadow: none;
    box-shadow: none !important;
  }

  /* Rest the offset that may arrize when centering upon the centered layout after removing the scrollbar */
  body.axZmAppContainer > .axZmAppContainerOverlay {
    left: 0;
    width: 100%;
  }
}

/* Presets for some AJAX-ZOOM extensions */
.axZmAppContainerContent .axZm_mouseOverZoomContainerWrap {
  border-width: 0;
}

/* A helper conainer which content may overflow the box */
.axZmAppContainerOverflowTopContent {
  position: relative;
  z-index: 2;
  box-sizing: border-box;
  height: 0;
  overflow: visible;
}

.axZmAppContainerOverflowBottomContent {
  position: relative;
  z-index: 2;
  box-sizing: border-box;
  height: 0;
  overflow: visible;
}