img.powerImageMask, div.powerImageEditButton {
	position:absolute;
	left:0px;
	top:0px;
}


div.powerImageEditButton img { vertical-align:middle; }


div.powerImageEditButton {
	cursor:pointer;	
	/* margin-top and margin-left should be a negative value 
		 that reflects half the width and height 
		 of the crop image "edit-crop.png"
	*/
	margin-top:-112px;
	margin-left:-112px;
}

div.powerImageEditButton span {
  /* The top and left attributes are related to the image edit-crop.png, also see definition for div.powerImageEditButton 
	  
		 left: (div.powerImageEditButton {margin-left} * -1) - (div.powerImageEditButton span {width}/2)
		 top:  (div.powerImageEditButton {margin-top} * -1) - (div.powerImageEditButton span {height}/2)
	*/
	top:87px;
	left:67px;
	font-weight:bold;
	color:black;
    position:relative;
	display:block;
	width:90px;
	text-align:center;
}

div.powerImage {
	position:relative;
  overflow: hidden;
}

.cropImageContainer {text-align:center;}
img.piImage { visibility:hidden; }
img.showImage { visibility:visible; }
div.admin form.piForm {
  display:inline;
	position:absolute;
	top: 10px;
	z-index:200;
}
.imgCrop_wrap {	margin:0 auto; }
.cropImageContainer p, .cropImageContainer button {	margin:10px auto 20px; }

.powerImageWaitForWindowRender {
	visibility:hidden;
}

.currentlyCroppingImage {
  background: url(../images/loading.gif) no-repeat center center;	
}

.message { text-align:center; }
.spinner {
  background: url(../images/progress.gif) no-repeat center center;
  height: 40px;
}

.currentlyCroppingImage div.powerImageEditButton span, .currentlyCroppingImage div.powerImageEditButton img {
  visibility: hidden;
} 
div.icentris_message { overflow: auto;  position:relative; }

var {
  display:inline-block;
}

var.powerImageMask {
  position:absolute;
  left:0px;
  top:0px;
}