/*------------------------------*/
/* Better Pop up
/*------------------------------*/
#fade {
  left: 0;
  top: 0;
  z-index: 10;
}
body {
  height: 100%;
  border:thick solid 2px;
  border-color:#666;
  margin: 0;
  padding: 0;
  font: normal 12px Verdana, Arial, Helvetica, sans-serif;
  position: relative;
}
#hideshow {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.popup_block {
  background: #ddd;
  border:2px solid black;
  border-color:#666;
  padding: 10px 20px;
  border: 10px solid #fff;
  float: left;
  width: 480px;
  /*position: fixed;*/
  position:relative;
  top: 5%;
  left: 50%;
  margin: 0 0 0 -250px;
  z-index: 100;
}
.popup_block .popup {
  float: left;
  width: 100%;
  background: #fff;
  margin: 10px 0;
  padding: 10px 0;
  border: 1px solid #bbb;
}
.popup p {
  padding: 5px 10px;
  margin: 5px 0;
}
.popup img.cntrl {
  position: absolute;
  right: -20px;
  top: -20px;
  border:none;
}
*html #fade {
  position: absolute;
  top:expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ?  documentElement.scrollTop  : document.body.scrollTop);
}
*html .popup_block {
  position: absolute;

  top:expression(eval(document.compatMode &&  document.compatMode=='CSS1Compat') ?  documentElement.scrollTop  +((documentElement.clientHeight-this.clientHeight)/2)  : document.body.scrollTop  +((document.body.clientHeight-this.clientHeight)/2));

  left:expression(eval(document.compatMode &&  document.compatMode=='CSS1Compat') ?  documentElement.scrollLeft  + (document.body.clientWidth /2 )  : document.body.scrollLeft  + (document.body.offsetWidth /2 ));
}