/*======================================================
** 				|     popup panel       |  			  **
======================================================== */

.editmode .stylePopupZone {
	width: 925px;
	margin: 0 auto;
}

.overlay {
	background: rgba(0, 0, 0, 0.6);
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	bottom: 0px;
	z-index: 1003;
}
.overlay.show {
	display: block;
}
.overlay__contents {
	background: #fff;
	box-shadow: 0 0 15px 2px #000;
	box-shadow: 0 0 8em 5px rgba(0,0,0,0.4);
	border: 2px solid #000;
	border-radius: 7px;
	width: 560px;
	min-height: 200px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -280px;
	margin-top: -300px;
}
.overlay__contentbox {
	padding: 0;
	overflow: hidden;
	border-radius: 5px;
	font-family: "Lucida Grande", Verdana,sans-serif;
	font-size: 1rem;
	color: #444;
}
.overlay__closebtn {
	background: #000;
	border: 0;
	padding: .5em;
	
	position: absolute;
	top: 0;
	right: 0;
	color: #fff;
}

/*======================================================
** 			|     Custom styles for img and text       |  		  **
======================================================== */
.overlay__text {
	padding: 25px;
}
.overlay__html iframe {
	width: 100% !important;
}
.overlay__imgbox {
	line-height: 0;
}
.overlay__imgbox__img {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	
	width: 100%;
	height: auto;
}
/*======================================================
** 			|     Small screen popup size fix       |  		  **
======================================================== */
@media ( max-width: 600px ) {
	.overlay__contents {
		margin: 0;
		width: 90%;
		max-height: 90vh;

		left: 5%;
		top: 5%;

		/* extra content should scroll to fit */
		overflow: auto;
	}
}