/* preview window styling */

body
{
	padding:0px;
	margin:0px;
	overflow-x:hidden;
}

#neePreview {
	overflow-y: hidden;
	overflow-x: hidden;
}

.neePreviewPopup
{
	margin-top:10px !important;
}

#neePreview .mcPop {
	font: 14px Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
	color: #666;
}

#neePreview .mcPop * {
	margin:0;
	padding:0
}

/* Preview Popup */

#neePreview #mcPopPreview {
	position:relative;
}

/* Right Col */

#neePreview .popRightMenu {
	float:right;
	width:128px;
	height:256px;
	margin-top:160px;
	position: relative;
	
}

/* Central Col */

#neePreview .popPhone {
	text-align:center;
}

#neePreview .previewDefault {
	padding-top:34px;
}

#neePreview .previewPortrait {
	padding-top:134px;
}

#neePreview .popPhone p {
	display: block;
	width: 191px;
	height: 84px;
	position: relative;
	top: 34px;
	right: 68px;
	background: url(/editor/nee/images/preview/preview-icons.png) no-repeat 100% 100%;
	overflow: hidden;
	text-indent: -2000em;
	text-align: left;
	margin: 0px auto;
	left: 315px;
}

/* Left Col */

#neePreview .popLeftMenu {
	float:left;
	width:128px;
	height: 750px;
	border-right:1px solid #c1c1c1;
	padding-top:28px;
	padding-bottom:28px;
	position:relative;
	top:0px;
}

#neePreview .compareBeforeTag
{
	font: bold 19px arial !important;
	color: #696969;
}
#neePreview .compareAfterTag
{
	font: bold 19px arial !important;
	color: #696969;
}
#neePreview .compareBeforeTag img, #neePreview .compareAfterTag img
{
	margin-right: 10px !important;
	vertical-align: middle;
}
#neePreview .compareBeforeTag span, #neePreview .compareAfterTag span
{
	vertical-align: middle;
}
/* Buttons */


#neePreview #mcPopPreview ul {
	list-style:none;
	display:block;
	position: relative;
}

#neePreview #mcPopPreview li {
	display:block;
}

#neePreview #mcPopPreview li a {
	width:88px;
	height:50px;
	display:block;
	color:#666;
	font-size:16px;
	text-align:center;
	padding:78px 20px 0;
	background:url(/editor/nee/images/preview/preview-icons.png) no-repeat 48px 40px;
	text-decoration:none;
	cursor:pointer;
}

#neePreview #mcPopPreview li a:hover, #neePreview #mcPopPreview li.current a {
	background-position:-93px 40px
}

#neePreview .popRightMenu li {
	border:1px solid #ccc;
	border-right:none;
}



#neePreview #mcPopPreview .popRightMenu li a {
	font-size:14px;
}

/* Button Icons */

/* iPhone*/
#neePreview #mcPopPreview li#plmIphone a {
	background-position:48px -86px
}


	


#neePreview #mcPopPreview li#plmIphone a:hover, #neePreview #mcPopPreview li#plmIphone.current a {
	background-position:-93px -86px
}

/* Windows */
#neePreview #mcPopPreview li#plmWindows a {
	background-position:48px -206px
}

#neePreview #mcPopPreview li#plmWindows a:hover, #neePreview #mcPopPreview li#plmWindows.current a {
	background-position:-93px -206px
}

/* Blackberry */
#neePreview #mcPopPreview li#plmBlackberry a {
	background-position:48px -336px
}

#neePreview #mcPopPreview li#plmBlackberry a:hover, #neePreview #mcPopPreview li#plmBlackberry.current a {
	background-position:-93px -336px
}


/* Rotate */
#neePreview #mcPopPreview li#prmRotate a {
	background-position:-267px 36px
}

#neePreview #mcPopPreview li#prmRotate a:hover, #mcPopPreview li#prmRotate.current a {
	background-position:-437px 36px
}

#neePreview #mcPopPreview li#prmRotate.disabled a {
	filter:alpha(opacity=50);
	opacity:0.5;
}

#neePreview #mcPopPreview li#prmRotate.disabled a:hover, #mcPopPreview li#prmRotate.current a {
	background-position:-267px 36px;
	cursor:default;
	background-color:white;
	color: #666;
}




/* Send URL */
#neePreview #mcPopPreview li#prmSend a {
	background-position:-267px -82px
}

#neePreview #mcPopPreview li#prmSend a:hover, #mcPopPreview li#prmSend.current a {
	background-position:-437px -82px
}

.compareBeforeWrapper
{
	float:left;
}
.compareAfterWrapper
{
	float:right;
	margin: 0 45px !important;
}
#neePreview #neePrevieweviceWrapper
{
	position:relative;
	margin: -80px auto 0px;

}

#neePreview #neePrevieweviceWrapper .neeIframeWrapper
{
	position: absolute;
	border: 0px;
	background:white;
	
	
}
 #neePreview .compareBeforeWrapper #neePrevieweviceWrapper .neeIframeWrapper, #neePreview  #neePrevieweviceWrapper .ios.neeIframeWrapper {
   	overflow: auto;
   	-webkit-overflow-scrolling: touch;
   	/* this rule adds scrollbars which are important to tablet and mobile display  */
   } 

#neePreview #neePrevieweviceWrapper iframe
{
	width:100%;
	height:100%;
	border: 0px;
	-webkit-overflow-scrolling: touch;
}	


.neeIframeWrapper:not(.noScale){
	-moz-transform: scale(0.84);
	-moz-transform-origin: 0 0;
	-o-transform: scale(0.84);
	-o-transform-origin: 0 0;
	-webkit-transform: scale(0.84);
	-webkit-transform-origin: 0 0;
	-ms-transform: scale(0.84);
	-ms-transform-origin: 0 0;
	transform: scale(0.84);
	transform-origin: 0 0;	
}

#neePreview .iPhone
{
	width: 347px;
	height: 699px;
	background: url(/editor/nee/images/devices/Iphone-5-black.png) no-repeat;
	padding: 0;
	top: 0;
}
#neePreview .iPhone .neeIframeWrapper
{
	
	top: 100px;
	left: 33px;
	width: 332px;
	height: 587px;
}

#neePreview .compareZoomed .iPhone .neeIframeWrapper
{
	width: 790px;
	height: 1409px;
}

#neePreview .iPhone.landscape
{
	width: 699px;
	height: 347px;
	background: url(/editor/nee/images/devices/Iphone-5-black-landscape.png) no-repeat;
	top: 130px;
	
}
#neePreview .iPhone.landscape .neeIframeWrapper
{
	top: 26px;
	left: 102px;
	width: 587px;
	height: 332px;
}


#neePreview .compareZoomed .neeIframeWrapper
{
	-webkit-transform: scale(0.35);
	-moz-transform: scale(0.35);
	-o-transform: scale(0.35);
	-ms-transform: scale(0.35);
	transform: scale(0.35);
	-moz-transform-origin: 0 0;
	-webkit-transform-origin: 0 0;
	-o-transform-origin: 0 0;
	-ms-transform-origin: 0 0;
	transform-origin: 0 0;
}

/* android */
#neePreview .android
{
	width: 312px;
	height: 666px;
	background: url(/editor/nee/images/devices/HTC-One-90.png) no-repeat;
	top: -22px;
}
#neePreview .android .neeIframeWrapper
{
	top: 83px;
	left: 12px;
	width: 343px;
	height: 575px;
}

#neePreview .compareZoomed .android .neeIframeWrapper
{
width: 827px;
height: 1367px;
}

#neePreview .android.landscape
{
	width: 641px;
	height: 343px;
	background: url(/editor/nee/images/devices/HTC-One-90_landscape.png) no-repeat;
	top: 130px;
	
}
#neePreview .android.landscape .neeIframeWrapper
{
	top: 22px;
	left: 62px;
	width: 575px;
	height: 344px;
}


/* android old*/
#neePreview .android_old
{
	width: 400px;
	height: 650px;
	background: url(/editor/nee/images/devices/nexus-1.jpg) no-repeat;
	padding: 140px 10px 0px 0px;
	top:-22px;
}
#neePreview .android_old .neeIframeWrapper
{
	top: 89px;
	left: 32px;
	width: 337px;
	height: 516px;
}

#neePreview .compareZoomed .android_old .neeIframeWrapper
{
width: 956px;
height: 1479px;
}

#neePreview .android_old.landscape
{
	width: 754px;
	height: 243px;
	background: url(/editor/nee/images/devices/nexus-2.jpg) no-repeat;
	top:89px;
	
}
#neePreview .android_old.landscape .neeIframeWrapper
{
	top: 32px;
	left: 87px;
	width: 526px;
	height: 320px;
}

/* windows phone */
#neePreview .windows
{
	width: 375px;
	height: 651px;
	background: url(/editor/nee/images/devices/Nokia.png) no-repeat;
	top: 0;
}
#neePreview .windows .neeIframeWrapper
{
	top: 62px;
	left: 50px;
	width: 329px;
	height: 550px;
}

#neePreview .compareZoomed .windows .neeIframeWrapper
{
width: 791px;
height: 1315px;
}

#neePreview .windows.landscape
{
	width: 651px;
	height: 375px;
	background: url(/editor/nee/images/devices/Nokia_landscape.png) no-repeat;
	top: 130px;
	
}
#neePreview .windows.landscape .neeIframeWrapper
{
	top: 40px;
	left: 70px;
	width: 550px;
	height: 332px;
}

/* blackberry  */
#neePreview .blackberry
{
	width: 353px;
	height: 660px;
	background: url(/editor/nee/images/devices/Z10.png) no-repeat;
	top: 22px;
}
#neePreview .blackberry .neeIframeWrapper
{
	top: 94px;
	width: 331px;
	height: 550px;
	left: 36px;
}

#neePreview .blackberry.landscape
{
	width: 670px;
	height: 350px;
	background: url(/editor/nee/images/devices/Z10_landscape.png) no-repeat;
	top: 130px;
}
#neePreview .blackberry.landscape .neeIframeWrapper
{
	top: 29px;
	left: 101px;
	width: 551px;
	height: 332px;
}

#neePreview .compareZoomed .blackberry .neeIframeWrapper
{
width: 794px;
height: 1320px;
}

.previewDesignForResellers #neePreview
{
	background-color: white;
	width: 1100px;
	height: 806px;
	margin: 2em auto;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	box-shadow: 1px 0px 4px rgba(0,0,0,0.75);
	-webkit-box-shadow: 1px 0px 4px rgba(0,0,0,0.75);
	-moz-box-shadow: 1px 0px 4px rgba(0,0,0,0.75);
}
.resellerLogoSmall
{
	max-width: 120px;
	max-height: 70px;
	display: block;
	margin-bottom: 50px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	background-position: 50% 50% !important;
	background-size: contain;
	background-repeat: no-repeat;
}
.previewDesignForResellersCompare  #neePreview
{
	background-color: white;
	width: 1100px;
	height: 860px;
	margin: 2em auto;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	box-shadow: 1px 0px 4px rgba(0,0,0,0.75);
	-webkit-box-shadow: 1px 0px 4px rgba(0,0,0,0.75);
	-moz-box-shadow: 1px 0px 4px rgba(0,0,0,0.75);
}
.previewDesignForResellersCompare .previewDefault
{
	float: right;
}
.previewDesignForResellersCompare #neePreview .popLeftMenu
{
	height: 805px;
}
.previewDesignForResellersCompare #neePreview #neePrevieweviceWrapper
{
	padding: 140px 1px 0px 0px;
	margin: 30px 0 0 0;
}


@media all and (max-width: 1145px){
		.previewDesignForResellersCompare #neePreview
		{
			width: 980px;
		}
		#neePreview .previewDefault
		{
			width: 851px !important; 
		}
		.compareBeforeWrapper
		{
			margin: 0  0  0 15px !important;
		}
		.compareAfterWrapper
		{
			margin: 0 15px 0 0 !important;
		}
		
		.visibilityHiddenBelow1024
		{
			visibility:hidden;
		}
}



/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {

 .neeIframeWrapper:not(.noScale){
 		/* this line is important for the inside scrolling on tablets */ 
 		-webkit-overflow-scrolling: touch;

 		/* overflow-y: auto; */
 		-webkit-transform: scale(1);
 		-webkit-transform-origin: 0 0;		
 	}
 	
 	/* this rule adjusts a perfect width of the ifrmae in the device on ipad display */
	#neePreview #neePrevieweviceWrapper iframe {
 		width:95%;
 	}

 	.iPhone .neeIframeWrapper:not(.noScale){

		width: 276px !important;
		height: 490px !important;
	}

	.android .neeIframeWrapper:not(.noScale){

		width: 288px !important;
		height: 477px !important;
	}

	.windows .neeIframeWrapper:not(.noScale){

		width: 277px !important;
		height: 460px !important;
	}

	.blackberry .neeIframeWrapper:not(.noScale){

		width: 278px !important;
		height: 463px !important;
		top: 93px;
	}
}
/* End iPads (landscape) ----------- */