/**Stylesheet for Center for Molecular Machines. By Andrea Habura, with sincere thanks to Holly n' John at PIE, Sergio Villarreal, Raydeen Gallogly, and Lisa Alaxanian.**/

/*** Layout elements of the page template ***/

#body {margin: 0; padding: 0;}

#wrapper {margin: 0; padding: 0;}
		
#center {
	padding: 0;
	margin: 0 0 0 160px !important;
  	overflow : hidden;
	 _height : 1%;
		 }

#left {
position: absolute;
	left: 0px;
	top: 300px;
}

#right {
  width: 200px;          
  text-align: center;
  float: right;
  margin-left: 20px;
   }

#footer {
  clear: both;
}


/*** Graphical elements of the page template ***/

* {font-family: Helvetica, sans-serif;}

body {
	background-color: #DDDDDD;
	background-image: url(bodystripebackground.gif);
	background-repeat: repeat-x;
	background-position: right top;
	margin: 0px;
	padding: 0px;
}

img {border: none;}

#wrapper {
	background-image: url(finaltitlegear2.jpg);
	background-repeat: no-repeat;
	margin: 0px;
	z-index: 1;
	position: absolute;
	left: 0px;
	top: 0px;
	background-position: 0px -1px;
} 
		
#center {
	background: url(centerbackstripelong.gif) repeat-y right top;
	}

#center p {margin: 10px 20px;}

#footer {
	font-style: italic;
	color: #333333;
	text-align: left;
	padding-left: 160px;
	padding-right: 200px;
	font-size: smaller;
}
	
#footer a {text-decoration: none; color: #FF3333;}

/**Phark-method image replace for page header**/

h1 {
	text-align: left;
	text-indent: -7000pt;
	font-size: 10px;
	background-image: url(title.gif);
	background-repeat: no-repeat;
	margin: 0px 0px 20px 170px;
	height: 28px;
	width: 500px;
	clear: left;
	padding: 0px;
}

h2 {
	font-size: 1.2em;
	text-align: center;
	padding: 5px 0;
	margin: 0;
	color: #333333;
	font-style: italic;
}
	
#center h2 {
    text-align: left;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-variant: small-caps;
	color: #333333;
	border-bottom: 3px double #EEEEEE;
	padding: 0px;
	font-size: 24pt;
	margin: 10px 240px 10px 10px;
	
}
	
/**Phark replacements for the right-side section titles**/
#right h2 {
	color: #FFFFFF;
	margin: 5px 0px 10px 0px;
	text-indent: -7000px;
	background-repeat: no-repeat;
	background-position: center;
	border: none;
			}

#rightmachine {
	background-image: url(machinesatwork.gif);
	margin-top: -20px;
	}
	
#upcomingevents{
	background-image: url(upcomingevents.gif);
	}

h3 {
	margin: 1em 0 .3em;
	letter-spacing: 0.2em;
	word-spacing: normal;
	font-weight: lighter;
}
		
/**Rules for the subsidiary image-replaced navigation links in the page header**/	

#header ul {
	margin: 2px 0px 0px 180px;
	padding: 0px;
	border: 1px solid #000066;
}

#header li {
	list-style-type: none;
	float: left;
	height: 28px;
	display: block;
	font-size: 7px;
	margin: 0px;
	padding: 0px;
}

#header li img {border: 0;}

/**Styling rules for content**/
 	
#indeximage{
	background-image: url(indeximagesample.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	margin: 0px;
	padding: 0px;
	border-top-width: 1px;
	border-right-width: 2px;
	border-bottom-width: 1px;
	border-left-width: 2px;
	border-style: solid;
	border-color: #CCCCCC;
}

#feature {float: right; border: 1px solid #ccc; margin: 0px 10px 10px 10px; text-align: center; width: 330px;}

#feature img {margin: 10px;}

#feature p {text-align: left; font-size: smaller; color: #666;}

#feature h4 {text-align: left; border-top: 1px dotted #ddd; padding: 5px 10px;}

.caption {text-align: right; font-style: italic; color: #333; margin-right: 20px; display: block;}

#homeleft {margin-right: 370px;}

#feature2 p {margin-left: 350px;}

#feature2 h2 {clear: both;}

#feature2 {margin: 0 200px 0 10px;
	padding: 0;}

#feature2left {float: left; margin-right: 15px; padding-right: 15px; border-right: 1px solid #ccc;}

#center a { text-decoration: none;}

#center a:link {
	color: #990000;
}

#center a:visited {
	color: #660000;
}

#center a:hover, #center a:active {
	color: #FF0000;
			
}

#center .clearfooter {
  clear: right;
  border: 1px solid #f0f;
  margin: 0;
  padding: 5px;
}

#right a {text-decoration: none; color: #0000FF; }

#right a:hover {color: #6666FF; }
	

/**Image dropshadow styles, which may be applied on any image in the page**/
	
.img-shadow {
	float:left;
  	background: url(shadowAlpha.png) no-repeat bottom right !important;
  	background: url(shadow.gif) no-repeat bottom right;
 	margin: 10px 0 0 10px !important;
 	margin: 10px 0 0 5px;
}

.img-shadow img {
	display: block;
	position: relative;
	background-color: #fff;
	border: 1px solid #a9a9a9;
	margin: -6px 6px 6px -6px;
	padding: 4px;
 } 
		
/**The styles for the news listings, especially on the homepage**/	

.news {
	border-top: 1px dotted #ddd;
	margin: 0 200px 0 10px;
	padding: 0;
	
}
		
.newsblock {
	padding: 5px 10px;
	border-bottom: 1px dotted #ccc;
	margin: 0;
	height: 120px;

	
}

.newsblock2 {
	padding: 5px 10px;
	border-bottom: 1px dotted #ccc;
	margin: 0;
		
}

.newsblock h3 {letter-spacing: normal;}
.newsblock2 h3 {letter-spacing: normal;}
			
.newsblock h4 { padding-left: 10px; }

.newsblock p {padding-left: 10px; }
.newsblock2 p {padding-left: 10px; }


.newsblock ul {}

.newsblock li {}

.newsblock h5 {
	font-style: italic;
	text-align: right;
	clear: left;
	margin: 0px;
	padding: 0px;
	padding-right: 10px;
	}
		
		
/**Styles for more generic listings, such as investigator lists and seminar lists**/	

.genlist {
	border-top: 1px dotted #ddd;
	margin-right: 200px;
	margin-left: 10px;
}

.genlist h2 {font-size: 16pt !important; border: none !important;}
		
.genlistblock {
	border-bottom: 1px dotted #ccc;
	padding: 10px 0px;
}
			
.genlistblock h3 {
	letter-spacing: normal;
	margin: 5px;
	color: #333333;
	font-size: 12pt;
	font-weight: bold;
}
		
.genlistblock h4 {
	font-style: italic;
	margin: 0px 0px 5px 20px;
	font-size: 10pt;
	font-variant: small-caps;
	color: #666666;
	line-height: normal;
}

.genlistblock p {
	font-size: 10pt;
	margin: 5px 25px;
}

.genlistblock ul {
	font-size: 10pt;
	background-color: #F3F3F3;
	margin: 5px 30px 5px 20px;
	border-left: 1px solid #999;
	list-style-image: none;
	padding-left: 5px;
}

.genlistblock li {
	list-style-type: none;
	line-height: 1.5em;
}

.genlistblock h5 {
	font-style: italic;
	text-align: right;
	clear: left;
	margin: 0px 10px 0px 0px;
	padding: 0px;
}
 #plainlist {}
 #plainlist h3 {letter-spacing: normal; margin-left: 1em;}
 #plainlist h2 {font-size: 120%; color: #600;}		

/**Styles for the event announcements in the right-hand Featured Events bar**/

.eventblock {
	text-align: center;
	margin: 10px;
	padding: 5px;
	border-bottom: 1px solid #FFF;
}

.eventblock img {
	border: 1px outset #666;
}

.eventblock p {
	color: #000000;
}

/**Styles for the navigation menu on the left-hand side**/

.sidenav {
	
	text-align: right;
	list-style-type: none;
	width: 160px;
	margin: 0;
	padding: 0;
				}

.sidenav li {
	margin: 0px;
	padding: 0px;
	border: 1px 0px solid #ddd;
}

.sidenav a {
	display: block;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
	font-style: italic;
	margin: 0px;
	line-height: 1em;
	padding: 0px;
}
			
.sidenav a:link {
	color: #666666;
	padding: 4px 5px 4px 10px;
	}

.sidenav a:visited {
	color: #333333;
	padding: 4px 5px 4px 10px;
}

.sidenav a:hover {
	padding: 3px 6px 5px 9px;
	color: #000066;
}

.sidenav a:active {
	padding: 3px 6px 5px 9px;
	color: #000066;
}

.sidenav #current {color: #660000; font-weight: bold; background-color: #eee;
 }

/*\*/ /*/
.sidenav a:hover {position: relative;}
/* this fixes an IEmac hover bug in the left column, hidden from other browsers */
.investigatorpicture {
	margin-top: 5px;
	margin-right: 15px;
	margin-bottom: 5px;
	margin-left: 20px;
}