.mfp-content {width:100%;}
.get-code-window {
	position: relative;
	background: #FFF;
	padding: 2em 3em;
	width: auto;
	margin: 20px auto;
	max-width: 600px
}
#magnific_popup_documentation {
	font-size: 3em;
	margin-bottom: 1em;
	font-weight: 700;
	text-align: center
}


#main-wrapper {
	background: 0;
	max-width: 800px;
	width: 100%;
	margin: 2em auto 4em;
	padding: 3em;
	padding-top: 0;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	position: relative
}
.white-popup-block {
	background: url(../images/head-bg.png) repeat;
	text-align: left;	
	width:100%;
	max-width: 650px;		
	margin: 40px auto;
	position: relative;	
	border-radius:6px;
	border: 1px solid #666;
	
}
.popup-reports {
	max-width: 1200px;	
}
.white-popup-block .cntnt{padding:20px 15px;}
.cntnt label{display:block; padding:8px 0;}
.cntnt input[type="text"], .cntnt select, .cntnt textarea{width:100%; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -webkit-box-sizing:border-box; -khtml-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box;}
.cntnt .actions input{margin-right:10px;}
.cntnt .infor{font-size:16px; color:#0890c4;}
ul.tablelist li{margin-bottom:10px;}
.cntnt .actions{padding-top:20px;}
.cntnt .txt{display:block; padding-top:10px;}
.cntnt .block{width:48%; padding-left:2%; float:left;}
.cntnt .block:first-child{padding-left:0;}
.cntnt small{font-size:12px; color:#999;}
input[type="text"].words{width:70px; margin-right:10px;}


#examples:after {
	content: 'to view source click on the title of example';
	opacity: .4;
	font-weight: 400;
	font-size: 14px;
	margin-top: 13px;
	float: right
}
.example {
	margin-bottom: 20px;
	position: relative
}
.white-popup-block .title{padding:15px; background:#dda726; font-size:20px; color:#fff; border-radius:5px 5px 0 0;}

.white-popup-block input[type="checkbox"]{margin-right:10px;}	


@media all and (max-width:30em) {
#examples:after {
	display: none
}
.gc3 {
	width: 100%
}
.grid-c .gc3:nth-of-type(2n+1) {
	clear: none
}
#main-wrapper {
	padding: 1em;
	margin-top: 0
}
.highlight {
	padding: .2em 1em;
	margin: 1em -1em
}
}
@media all and (max-width:700px) {
.zoom-cursor {
	cursor: pointer
}
#conditional-lightbox-notice {
	display: block;
	padding: 10px;
	background: #FFEAEA
}
.cntnt .block { width:100%; }
.cntnt .actions input { margin-bottom:10px; }
}


.mfp-bg {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1042;
	overflow: hidden;
	position: fixed;
	background: rgb(224, 224, 224) none repeat scroll 0% 0%;
	opacity: .8;
	filter: alpha(opacity=80)
}
.mfp-wrap {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 99999;
	position: fixed;
	outline: 0!important;
	-webkit-backface-visibility: hidden
}
.mfp-container {
	text-align: center;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	padding: 0 8px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box
}
.mfp-container:before {
	content: '';
	display: inline-block;
	height: 100%;
	vertical-align: middle
}
.mfp-align-top .mfp-container:before {
	display: none
}
.mfp-content {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	margin: 0 auto;
	text-align: left;
	z-index: 1045
}



.mfp-hide {
	display: none!important
}


.mfp-close, .mfp-close:hover{
	width: 26px;
	height: 26px;
	line-height: 26px;
	position: absolute;
	right: 10px;
	top: 10px;
	text-decoration: none;
	text-align: center;
	text-indent:-9999px;
	background:url(../css/close.png) left top no-repeat;
	border:none;
	cursor:pointer;
	padding:0;
}

.popup_body {
  padding: 15px;
}

/* to reduce the width of Login window in state login screen */
#loginId.white-popup-block {
	max-width: 350px;
}