/* 
	bioRASI three column web page	layout

	<TIMESTAMP>10/23/2008 11:43 AM</TIMESTAMP>

	TTS 10/23/2008 11:42 AM
	
	I have separated the css in two files: the layout is in this file
	and the color information is in the colors.css file.  The colors
	are used across many of the layout items and the colors.css makes
	it possible to synchronize changes.  The color classes are generally
	named -color and are used as an additional class in the html like
	so:
	
		<div class="menuitem menuitem-color">
		
	or

		<div id="main" class="block-color">

	I have generally ignored or overridden the geeklog css layout
	classes.  I did it this way because (1) I was under severe time
	pressure to get this done, and (2) this way I can use meaningful
	names for our layout, which has characteristics that the geeklog
	layout does not.
	
	The following diagram shows the page layout with the id or class
	name and the color class.

/- body ---------------------------------------------------------------------------------\
| /- menu-top -------------------------------------------------------------------------\ |
| |                      /- menu-item  ----\  /- menu-item  ----\  /- menu-item  ----\ | |
| |                      |  menuitem-color |  |  menuitem-color |  |  menuitem-color | | |
| |                      \-----------------/  \-----------------/  \-----------------/ | |
| \------------------------------------------------------------------------------------/ |
| /- logo-top -------------------------------------------------------------------------\ |
| \------------------------------------------------------------------------------------/ |
| /- page -----------------------------------------------------------------------------\ |
| |  page-color                                                                        | |
| | /- header  ----------------------------------------------------------------------\ | |
| | |  hdr-color                                                                     | | |
| | \--------------------------------------------------------------------------------/ | |
| |                                                                                    | |
| | /- subheader --------------------------------------------------------------------\ | |
| | |  hdr-color                                                                     | | |
| | \--------------------------------------------------------------------------------/ | |
| | /- sub2header -------------------------------------------------------------------\ | |
| | |  hdr-color                                                                     | | |
| | \--------------------------------------------------------------------------------/ | |
| |                                                                                    | |
| | /- menu -------------------------------------------------------------------------\ | |
| | |  /- menu-item  ----\  /- menu-item  ----\  /- menu-item  ----\                 | | |
| | |  |  menuitem-color |  |  menuitem-color |  |  menuitem-color |                 | | |
| | |  \-----------------/  \-----------------/  \-----------------/                 | | |
| | \--------------------------------------------------------------------------------/ | |
| |                                                                                    | |
| | /- news --------------------\ /- main --------------\ /- feature ----------------\ | |
| | |  block-color              | |  block-color        | |  block-color             | | |
| | | /- news-header ---------\ | | /- main-header ---\ | | /- featured-item ------\ | | |
| | | |  block-header-color   | | | |                 | | | |  block-header-color  | | | |
| | | \-----------------------/ | | \-----------------/ | | \----------------------/ | | |
| | | /- news-month ----------\ | | /- main-news -----\ | | /- featured-item ------\ | | |
| | | |                       | | | |                 | | | |  block-header-color  | | | |
| | | \-----------------------/ | | \-----------------/ | | \----------------------/ | | |
| | | /- news-item -----------\ | | /- main-divider --\ | | /- featured-item ------\ | | |
| | | |                       | | | |  menuitem-color | | | |  block-header-color  | | | |
| | | \-----------------------/ | | \-----------------/ | | \----------------------/ | | |
| | \---------------------------/ \---------------------/ \--------------------------/ | |
| |                                                                                      |
| |  /- site-map ----------------------------------------------------------------------\ |
| |  \---------------------------------------------------------------------------------/ |
\ \--------------------------------------------------------------------------------------|
\----------------------------------------------------------------------------------------/
*/

body{
	margin:0;
	font-size:11px;
	font-family:arial,helvetica,thorndale,sans-serif;
	text-align:center; /* for firefox */
}

#logotop{
	font-size:50px;
	font-style:italic;
	font-family:times,serif;
	width:97%;
	text-align:left;
	padding-left:3%;
}

#menutop{
	width:97%;
	text-align:right;
	padding:5px 3% 0px 0px;
}

#page{
	width:806px;
	margin-left:auto;  /* for ie */
	margin-right:auto;
}

#header{
	text-align:center;
	font-size:35px;
	font-style:italic;
	padding:0px 0px 5px 0px;
}
#sub-header{
	text-align:center;
	font-size:20px;
	padding:0px 0px 10px 0px;
/*	border:1px solid white; */
}
#sub2-header{
	text-align:center;
	font-size:16px;
	font-style:italic;
	padding:0px 0px 8px 0px;
/*	border:1px solid white; */
}
#menu{
	text-align:center;
/*	padding:3px 0px 4px 0px;
	border:1px solid white; */
}

.menuitem {
	text-decoration:none;
	text-align:center;
	font-weight:bold;
	padding:3px 9px 4px 9px;
	border-style:solid;
	border-width:1px 1px 1px 2px;
}
#body-table{
	margin-top:10px;
}
.body-spacer{
	width:15px;
}
#news{
	width:200px;
	height:250px;
	text-align:left;
}
#newsscroll {
	position: absolute;
	visibility: visible;
	z-index: 10;
	top: 160px;
	height:200px;
	width: 200px;
	clip: rect(0px, 100px, 60px, 0px);
	border-width: 0px;
}
.news-header{
	display:block;
	position:relative;
	left:-10px;
	top:-10px;
	width:190px;
	font-size:12px;
	font-weight:bold;
	padding:5px;
	text-align:left;
	text-decoration:none;
}
.news-month {
	font-weight:bold;
	text-align:center;
}
.news-item {
	font-style:italic;
	text-indent:-10px;
	margin-left:10px;
	padding:5px;
}
******************************** */
.main-header{
	font-size:14px;
	font-weight:bold;
	margin-bottom:10px;
}
.main-news{
	padding-top:10px;
	text-align:left;
}
.main-divider{
	width:100%;
	height:0px;
	border:1px solid;
}
#main{
	width:380px;
	margin:0px 3px 0px 3px;
	/* the following line is necessary for proper placement 
	of the box in FF and Opera */
	border:1px solid white; 
}
#feature{
	width:150px;
	text-align:left;
}
.featured-item{
	display:block;
	position:relative;
	left:10px;
	top:-10px;
	width:140px;
	font-size:12px;
	font-weight:bold;
	padding:5px;
	text-align:left;
	margin-bottom:10px;
	text-decoration:none;
	border:1px solid;
}

#site-map {
}

.image-right{
	margin:5px;
	float:right;
}
.image-left{
	margin:5px;
	float:left;
}