
/* Basic Modal Styles */

body > div#wrapper {
	transition: filter 500ms;
}
/* body > div#wrapper.blurred {
	filter: blur(5px) grayscale(50%);
} */

body div.modal-popup {
	position: fixed;
	left: 0; top: 0;
	width: 100%; height: 100%;
	display: flex;
	overflow: hidden;
	background-color: #0008;
	transition: opacity 500ms cubic-bezier(0, 0, 0.2, 1);
	z-index: 1001;
}

body div.modal-popup > div.modal-content {
	position: relative;
	margin: auto;
	padding: 0;
	width: 90vw;
	max-height: 100vh;
	border: none;
	overflow-x: hidden;
	overflow-y: auto;
}

body div.modal-popup[aria-hidden="false"] { opacity: 1; }
body div.modal-popup[aria-hidden="true"] { opacity: 0; }
body div.modal-popup[aria-hidden="false"] > div.modal-content {
	animation: kbmfadeInUp 500ms cubic-bezier(0, 0, 0.2, 1);
}
body div.modal-popup[aria-hidden="true"] div.modal-content {
	animation: kbmfadeOutDown 500ms cubic-bezier(0, 0, 0.2, 1);
}

/* body div.modal-popup div.modal-content form.frm-show-form > div.frm_form_fields > fieldset {
	box-shadow: 0 0 14px #22303d;
} */

body div.modal-popup div.modal-content > div.close {
	position: absolute;
	top: 18px; right: 18px;
	fill: #888;
	cursor: pointer;
	line-height: 0;
	transition: 300ms cubic-bezier(0, 0, 0.2, 1);
	z-index: 10;
}

body div.modal-popup div.modal-content > div.close:hover,
body div.modal-popup div.modal-content > div.close:focus {
	fill: white;
	/* rotate: 60deg; */
}

body article div.modal-popup-trigger > a[disabled] {
	opacity: 0.25;
	cursor: not-allowed;
}
