.abs-100 { position: absolute; left: 0; top: 0; right: 0; bottom: 0; } .offcanvas { position: fixed; left: 0; top: 0; width: 100% !important; height: 100% !important; } .popup-mask { position: fixed; left: 0; right: 0; height: 100%; width: 100%; bottom: 0; top: 0; background-color: rgba(0, 0, 0, 0.6); transition: opacity 0.3s; opacity: 0; z-index: 999; } .popup-mask.active { opacity: 0.8; } .popup-wrapper { z-index: 1000; width: 80%; max-width: 800px; position: fixed; border-radius: 4px; background-color: #fff; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); left: 50%; top: 50%; opacity: 0; transition: all 0.3s; margin-top: 20px; } .popup-wrapper.active { opacity: 1; margin-top: 0; } .popup-wrapper.small-wrapper { width: 500px; } .popup-wrapper .popup-header { padding: 10px 30px 0; } .popup-wrapper .popup-header h3.title, .popup-wrapper .popup-header .popup-header-title { border-bottom: 1px solid #e9e9e9; margin-bottom: 20px; } .popup-wrapper .popup-header h3.title span, .popup-wrapper .popup-header .popup-header-title span { display: inline-block; font-size: 18px; border-bottom: 3px solid #68c258; margin-bottom: -2px; height: 36px; line-height: 36px; } .popup-wrapper .popup-content { max-height: 500px; overflow: auto; margin-top: 20px; margin-bottom: 20px; padding: 0 30px; color: #666666; } .popup-wrapper .popup-content p { font-size: 16px; line-height: 1.6; } .popup-wrapper .popup-footer { padding-bottom: 20px; } .popup-wrapper .popup-footer .btn { width: 140px; } .popup-wrapper .close { width: 20px; position: absolute; right: 10px; top: 10px; cursor: pointer; } .popup-wrapper .icon-close { position: absolute; right: 30px; top: 10px; cursor: pointer; } /*# sourceMappingURL=popup.css.map */ /*# sourceMappingURL=popup.css.map */