/* ===== popups ===== */

.popupParent {
  position: relative;   /* this is set to a non-static value to allow
  			DIV.popup to position relative to this item */
}

/* skip for ES 2016
.popupParent A {
  border-bottom: 1px dashed blue;
  text-decoration: none;
}
*/

.clickable {
  cursor: pointer;
}

.hoverhover {
  cursor: pointer;
  border-bottom: 1px dashed blue;
  color: blue;
}  

.showhide {
  cursor: pointer;
  border-bottom: 1px solid blue;
  color: blue;
}

DIV.popup {
  border: 1px solid grey; /* 3px outset blue; */
  box-shadow: 10px 10px 5px silver;
  background-color: Lavender; 
  padding: 10px;
  padding-top: 25px;	/* to allow for imgclose, see note below */
  white-space: normal;
  position: fixed;	/* was position: absolute; */
  overflow-y: auto;
  display: none;	/* toggle this via a mouseover event */
  right: 5%;
  top: 5%;		/* bottom does odd things in IE */
  width: 50%;
  max-height: 90%; 
  z-index: 1;	/* evidently needed when a DIV.popup element overlaps a 
  		different element's TD.popupParent, but might not work in IE
  		for now, set position:fixed to see if this cures it
  		*/
}



IMG.imgclose {
  border: 2px black solid; 
  position: absolute;
  right: 2px;		
  top: 2px;		/* was -4, -4 but having a scrollbar seems to restrict 
  			   image to displaying INSIDE the border, hence adjust
  			   offsets to achieve this */
  cursor: pointer;
}