.modal-open { overflow: hidden; } .modal-open .modal { overflow-x: hidden; overflow-y: auto; } .modal { position: fixed; top: 0; left: 0; z-index: 1050; display: none; width: 100%; height: 100%; overflow: hidden; outline: 0; } .modal-dialog { position: relative; width: auto; margin: 0.5rem; pointer-events: none; } .modal.fade .modal-dialog { transition: transform 0.3s ease-out; transform: translate(0, -50px); } @media (prefers-reduced-motion: reduce) { .modal.fade .modal-dialog { transition: none; } } .modal.show .modal-dialog { transform: none; } .modal-dialog-scrollable { display: flex; max-height: calc(100% - 1rem); } .modal-dialog-scrollable .modal-content { max-height: calc(100vh - 1rem); overflow: hidden; } .modal-dialog-scrollable .modal-header, .modal-dialog-scrollable .modal-footer { flex-shrink: 0; } .modal-dialog-scrollable .modal-body { overflow-y: auto; } .modal-dialog-centered { display: flex; align-items: center; min-height: calc(100% - 1rem); } .modal-dialog-centered::before { display: block; height: calc(100vh - 1rem); content: ""; } .modal-dialog-centered.modal-dialog-scrollable { flex-direction: column; justify-content: center; height: 100%; } .modal-dialog-centered.modal-dialog-scrollable .modal-content { max-height: none; } .modal-dialog-centered.modal-dialog-scrollable::before { content: none; } .modal-content { position: relative; display: flex; flex-direction: column; width: 100%; pointer-events: auto; background-color: #fff; background-clip: padding-box; border: 1px solid #e2e2e2; border-radius: 0.3rem; outline: 0; } .modal-backdrop { position: fixed; top: 0; left: 0; z-index: 1040; width: 100vw; height: 100vh; background-color: #000; } .modal-backdrop.fade { opacity: 0; } .modal-backdrop.show { opacity: 0.75; } .modal-header { display: flex; align-items: flex-start; justify-content: space-between; padding: 16px 16px; border-bottom: 1px solid #e2e2e2; border-top-left-radius: 0.3rem; border-top-right-radius: 0.3rem; } .modal-header .close { padding: 16px 16px; margin: -16px -16px -16px auto; } .modal-title { margin-bottom: 0; line-height: 20px; } .modal-body { position: relative; flex: 1 1 auto; padding: 24px; } .modal-footer { display: flex; align-items: center; justify-content: flex-end; padding: 24px; border-top: 1px solid #e2e2e2; border-bottom-right-radius: 0.3rem; border-bottom-left-radius: 0.3rem; } .modal-footer > :not(:first-child) { margin-left: .25rem; } .modal-footer > :not(:last-child) { margin-right: .25rem; } .modal-scrollbar-measure { position: absolute; top: -9999px; width: 50px; height: 50px; overflow: scroll; } @media (min-width: 576px) { .modal-dialog { max-width: 600px; margin: 1.75rem auto; } .modal-dialog-scrollable { max-height: calc(100% - 3.5rem); } .modal-dialog-scrollable .modal-content { max-height: calc(100vh - 3.5rem); } .modal-dialog-centered { min-height: calc(100% - 3.5rem); } .modal-dialog-centered::before { height: calc(100vh - 3.5rem); } .modal-sm { max-width: 392px; } } @media (min-width: 992px) { .modal-lg, .modal-xl { max-width: 808px; } } @media (min-width: 1272px) { .modal-xl { max-width: 1140px; } } .fade { transition: opacity 0.15s linear; } @media (prefers-reduced-motion: reduce) { .fade { transition: none; } } .fade:not(.show) { opacity: 0; } .collapse:not(.show) { display: none; } .collapsing { position: relative; height: 0; overflow: hidden; transition: height 0.35s ease; } @media (prefers-reduced-motion: reduce) { .collapsing { transition: none; } } .close { float: right; font-size: 1.3125rem; font-weight: 500; line-height: 1; color: #777; text-shadow: 0 1px 0 #fff; opacity: .5; } @media (max-width: 1200px) { .close { font-size: calc(1.25625rem + 0.075vw) ; } } .close:hover { color: #777; text-decoration: none; } .close:not(:disabled):not(.disabled):hover, .close:not(:disabled):not(.disabled):focus { opacity: .75; } button.close { padding: 0; background-color: transparent; border: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; } a.close.disabled { pointer-events: none; } .modal .modal-header { position: relative; } .modal .modal-header .close { padding: 16px; margin: -16px -16px -16px auto; font-size: 20px; font-weight: 600; opacity: 1; } .modal .modal-header .close span { color: #777; } .modal .modal-footer { border-top: 0; } /*# sourceMappingURL=mekari-ui-modal.css.map */