/*!
* 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 {
    box-sizing: border-box!important;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    outline: 0;
    z-index: 1001;
}

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

.axZmAppContainerBack.axZmAppContainerFadeIn {
    opacity: 0.6;
    -webkit-transition: all 0.25s linear;
    transition: opacity 0.25s linear;
}

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

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

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

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

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

.axZmAppContainerBox.axZmAppContainerModal {
    padding: 40px;

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

    /* center element on the screen */
    position: absolute;
    margin: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.axZmAppContainerBox.axZmAppContainerWindow {
    padding: 35px;

    /* center element on the screen */
    position: absolute;
    margin: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

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

.axZmAppContainerBox.axZmAppContainerFlyOutPrepare {
    transition: transform, opacity;
    transition-duration: 0.4s, 0.15s;
}

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

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

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

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

/* Style of the modal window */
.axZmAppContainerWindow .axZmAppContainerContent,
.axZmAppContainerModal .axZmAppContainerContent {
    -webkit-box-shadow: 0 5px 15px rgb(0,0,0,0.5);
    box-shadow: 0 5px 15px rgb(0,0,0,0.5);
    border-radius: 0;
    padding: 0;
    /* 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 {
        padding: 0;

        /* Remove max size and max width if they were set */
        max-width: none;
        max-height: none;
    }

    .axZmAppContainerModal .axZmAppContainerContent,
    .axZmAppContainerWindow .axZmAppContainerContent {
        -webkit-box-shadow: none;
        box-shadow: none !important;
        border-radius: 0 !important;
        border-width: 0 !important;
        padding: 0 !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 {
    box-sizing: border-box;
    position: relative;
    overflow: visible;
    height: 0;
    z-index: 2;
}

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