html, body {margin:0; padding:0; height:100%;  overflow:hidden; width:100%; text-align:left;}
body {font-family:verdana, arial, sans-serif; font-size:76%;}
#background{position:fixed; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat;}
#scroller {position:absolute; width:100%; height:100%; top:0; left:0; overflow:auto; z-index:2;} /* not used here */

#content {padding:5px 300px 20px 200px;} /* not used here */

div#copyright {
	width: 100%; 
	height: 8%; 
	font-family: arial, verdana, sans-serif; 
	letter-spacing:0.1em;
	font-size: 95%;
	color: #999999;
	text-align: left;
	border: 0px solid white;
}
#cafe {
	position: absolute;
	z-index:1;
	top: 50%;         /* Top left corner of the div holding the background image relative to browser window size */
	left: 50%;
	/*left: 446px;           the left, like the top above */
	margin-top: -290px;  /* 336 half the height of the image: 580 */
	margin-left: -430px; /* 505 half the width of the image: 860 */
	border: 1px solid #f5a106;

	-webkit-box-shadow: 0px 5px 20px rgba(0,0,0,0.50);
	-khtml-box-shadow: 0px 5px 20px rgba(0,0,0,0.50);
	-moz-box-shadow: 0px 5px 20px rgba(0,0,0,0.50);
	box-shadow: 0px 5px 20px rgba(0,0,0,0.50);

	-webkit-border-radius: 15px;
	-moz-border-radius: 15px; 
	border-radius: 15px;
	
/* Because cafe uses translucent background the box-shadow in IE 7-8 is rendered black, and is not implemented */
	/*behavior: url(jstools/PIE-CSS3-IE7-IE8/PIE.htc);   /*PIE-CSS3 implements round corners for IE7-8 */	
}

A:link {color: #FFFFFF;text-decoration: none;}
A:visited {color: #FFFFFF;text-decoration: none;}
A:active {color: #632726;text-decoration: none;}
A:hover {font-size: 16px; color: #f5a106;}

div#menu {
  
  margin-left: 66.5%;
  margin-top: 46.2%;
  height: 38px;      /* menu height before dropping */
  width: 105px;
  line-height: 22px; /* distance between the lines/links in the box */
  text-align: center;
  overflow: hidden;
  border: 2px solid #f5a106;
  background-color: #632726;
	/* Border Radius is a CSS3 feature, which is not supported in IE < 9;  PIE-CSS3 corrects this behavor*/
	/* For IE7-8 as required under PIE-CSS3 implementation*/
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px; 
	border-radius: 15px;

	-webkit-box-shadow: 0px 5px 20px rgba(0,0,0,0.7);
	-khtml-box-shadow: 0px 5px 20px rgba(0,0,0,0.05);
	-moz-box-shadow: 0px 5px 20px rgba(0,0,0,0.7);
	box-shadow: 0px 5px 20px rgba(0,0,0,0.50);
}
div#menu a:hover {font-size: 14px; color: #f5a106;}
div#menu span, div#menu a {
  display: block;
  padding: 1px;
}
p {line-height:1.8em; letter-spacing:0.1em; text-align:justify;}
#fixed {position:absolute; top:25px; left:10px; width:160px; z-index:10; color:#567; border:1px solid #000; padding:10px;}
/*#cafe {position:absolute; width: 100%; height: 100%; -- the cafe image gets distorted this way}*/

/*
#hot_spot {
	width: 100px;
	height: 100px;
	margin_top: 300px;
	margin_left: 60px;
	border: 1px solid green;
	z-index: 60;
}
  overflow: hidden;
  display: block;
  margin-left: 733px;*/
  /*border: 1px;
   float: right;    without this div#fade will not show */

  /*border: 1px solid #f5a106;
  background-color: #d8bd8d;*/
  
/*div#myOtherElement a:hover {
  background: #f5f5f5;
}


div.floated {
  width: 400px;
  float: left;
  margin-left: 1em;
}
div#fade {
  margin-left: 633px;
  margin-top: 0px;
  width: 378px;
  height: 547px;
  float: left;   -- without this div#fade will not show 
}


*/