<!--

body {
    	background-image: url(../images/bg_grad_gray.jpg);
    	background-color: #808080;  /* makes slow loads look nicer */
	}
table {
	border:0;
	border-collapse: collapse;
	table-layout: auto;
	}
a {
	font-family: Arial, Helvetica, Geneva, sans-serif;
	font-size:10pt;
	font-weight:bold;
	}
a:link {
	color:#000000;
	text-decoration: none;
	}
a:visited {
	color:#000000;
	text-decoration: none;
	}
a:hover {
	color:#f0f0f0;
	text-decoration: none;
	}
a:active {
	color:#808080;
	text-decoration: none;
	}
a img {
	border: none; 
	}

h1 {
	font-size: 120%;
	}
h3 {
	font-size: 100%;
	}

#current-page {
	font-family: Arial, Helvetica, Geneva, sans-serif;
	font-size:10pt;
	font-weight:bold;	
	color:#000000;
	text-decoration: underline;
	}
#kw {    /* not currently used */
   	font-family: Arial, Helvetica, Geneva, sans-serif;
   	color: #F2F2F2;  /* selected to blend w grad bg */
   	font-size:2PT;  /* selected to make text less visible without using visible keyword */
   	width: 750px;
  	}


/* The following positioning centers the page vert and horiz in the middle of the screen
   The page is truncated if the screen is scaled too small (due to fixed margin sizes) 
   or if the screen is less than about 600x800 (logo gets lopped off).  A script in site_main.js 
   corrects for this.	 *** The values of margin-left and margin-top of centered-content 
   are used (hardcoded)  in gallery.js ***	This is used for all centered pages. */
   
#centered-content {
	position: absolute;
	overflow: auto;
	left: 50%; /*  center left side horiz on parent container, the viewport */
	top: 50%;  /*  center top vert on parent container, the viewport */
	width: 780px;	/*  780px is for a 800px viewport - the chrome */
	height: 700px;
	margin-left: -390px; /* -390pxthen center the center of content; half of width */
	margin-top:  -350px;  /* -350px then center the center of content; half of height */
	/* background-color: #6699CC;   temp; color makes effect obvious for demo */
	}

/* used on root pages  */
div#logo  {
	position:absolute;
	left: 0px;
	top: 0px;
	width: 780px;
	height: 55px;
	}

#logo-image {
	width: 780px;
	height: 55px;
	border: none;
	}
#id-image  {
	float: right;
	margin-top: 20px;
	margin-left: 40px;
	margin-bottom: 20px;
	}	
div #main  {
	position:absolute;
	top: 55px;  			/* = logo.height */
	left: 0px;
	width: 640px;          	/* same as main-index-pg-image */
	height: 480px;        	/* same as main-index-pg-image */
	margin-left: 70px; 	    /* = (center-content.w - this.w)/2 = (780-640)/2 */
	margin-top: 10px;		/* = bottom margin based on centered-content.height(=600) */
	border: none;
	font-family: Arial, Helvetica, Geneva, sans-serif;
	}
div #main-no-margin  {  /* used on legal.htm */
	position:absolute;
	top: 55px;  			/* = logo.height */
	left: 0px;
	width: 640px;          	/* same as main-index-pg-image */
	height: 480px;        	/* same as main-index-pg-image */
	margin-left: 70px; 	  /* = (center-content.w - this.w)/2 = (780-640)/2 */
	margin-top: -10px;		
	border: none;
	font-family: Arial, Helvetica, Geneva, sans-serif;
	}
div #footer-bar-menu  {
	position:absolute;
	left: 0px;
	top: 545px;
	width: 780px;
	height: 45px;	/* max  based on centered-content.height */
	}
#bar-image {
	width: 780px;
	height: 2px;
	margin-bottom: 10px;
	border-width: 0px;
	}
div.nav-menu  {
	position:absolute;
	left: 0px;
	top: 10px;
	width: 780px;
	height: 43px;
	text-align: center;
	}			

div.page-copy {  
	color:#000000;
	text-decoration: none;
	font-size: 12px;
      } 			
#spot-image  {
	float: right;
	width: 192px;
	height: 256px;
	margin-top: 20px;
	margin-left: 40px;
	}
			
/* used for no-script warning, etc.  */

div.message-box {  
	position:absolute;	
	top: 20px;
	width: 600px;
	height: 60px;
      }    
       
      
div.no-script-msg {
	color:#000000;
	text-decoration: none;
	font-size: 20px;
	}
	
.generic-msg {
	color:#000000;
	text-decoration: none;
	font-size: 20px;
	}
.generic-msg-middle {
	position: absolute;
	top: 40%;
	left: 7%;
	color:#000000;
	text-decoration: none;
	font-size: 20px;
	}	
-->
