/**************************************************************
    MODALS
***************************************************************/
.mox-modal { position: fixed; top: 0; bottom: 0; left: 0; right: 0; transition: opacity .2s; opacity: 1; z-index: 100; }
.mox-modal-shadow { overflow-y: auto; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: rgba(0, 0, 0, 0.4); }
.mox-modal-shadow.loading:before { display: block; content: ''; position: absolute; top: calc(5vh + 100px); left: calc(50% - 30px); background width: 60px; height: 60px; background-image: url('/mox/static/svg/loader-button-white.svg'); background-size: 28px; background-repeat: no-repeat; background-position: center; }
.mox-modal-wrapper { width: 100%; max-width: 600px; margin: 5vh auto; background-color: #fff; border-radius: 5px; box-sizing: border-box; box-shadow: rgba(0, 0, 0, 0.25) 0 0 20px; position: relative; overflow: hidden; transition: opacity .2s, transform .2s; }
.mox-modal-content { overflow-y: auto; box-sizing: border-box; }
.mox-modal-content.mox-content { padding-bottom: 16px; background-color: unset; }
.mox-modal-content.mox-content h1 { margin-top: 0; }

.mox-modal.hidden { opacity: 0; }

.mox-modal-wrapper.loading { opacity: 0; transform: translateY(-10px); }

.mox-modal-close { background-image: url('/mox/static/svg/x.svg'); background-size: 20px; background-repeat: no-repeat; background-position: center; position: absolute; top: 16px; right: 16px; width: 38px; height: 38px; border-radius: 50%; color: #000; opacity: 0.6; transition: background-color .1s, opacity .1s; }
.mox-modal-close:hover { background-color: #f0f0f0; opacity: 1; }

.mox-dialog .mox-modal-content, .mox-dialog .mox-modal-wrapper { max-height: 800px; }
.mox-dialog form { padding-bottom: 40px; }
.mox-dialog .buttons { margin: 0; padding: 0 16px; border-top: 1px solid #eee; position: absolute; left: 0; right: 0; bottom: 0; background-color: #fff; }
.mox-dialog .buttons p { float: right; }

.mox-content fieldset input[type=submit],
.mox-content fieldset button.save,
.mox-button.save { background-position-x: -16px; transition: padding-left .2s, background-position .2s; }
.mox-content fieldset input[type=submit].loading,
.mox-content fieldset button.save.loading,
.mox-button.save.loading { padding-left: 28px; background-image: url('/mox/static/svg/loader-button-white.svg'); background-position: 6px center; background-size: 16px; background-repeat: no-repeat; }
.mox-content { padding: 25px; }

.quill-content p { margin: 0; }