/* CSS Document */
/* common styling */


		
body {
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: normal;
 	 }

h1{
	font-size: small;
	color: #8C692F;
	margin: 0px;
	padding: 0px;
}

h2{
 font-family: Arial,sans-serif;
 font-size: 114%;
 color: #006699;
 margin: 0px;
 padding: 0px;
}

h3{
 font-family: Arial,sans-serif;
 font-size: 100%;
 color: #334d55;
 margin: 0px;
 padding: 0px;
}

h4{
	font-family: Verdana,Arial,sans-serif;
	font-size:x-small;
	text-align:center;
	color:#EAEAEA;
	margin: 0px;
	padding: 0px;
	margin-top: 40px;
}

h5{
 font-family: Verdana,Arial,sans-serif;
 font-size:x-small;
 color: #334d55;
 margin: 0px;
 padding: 0px;
}

h6{
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:normal;
	color:#CC9900;
	margin: 0px;
	padding: 0px;
	text-align: left;
}

h7{
	font-family:Arial, Helvetica, sans-serif;
	font-size:x-small;
	color:#FFFFFF;
	text-align:center;
}

h8{
	font-family:Arial, Helvetica, sans-serif;
	font-size:medium;
	color:#FFFFFF;
	text-align:left;
}

ul{
 list-style-type: square;
}

ul ul{
 list-style-type: disc;
}

ul ul ul{
 list-style-type: none;
}

label{
 font-family: Arial,sans-serif;
 font-size: 100%;
 font-weight: bold;
 color: #334d55;
}

	
/* this stuff effects your links - or navigation bar*/
a.nav, a.nav:link, a.nav:visited {display:block; width:150px; height:25px; background:#dca; border:1px solid #000; margin-top:2px; text-align:center; text-decoration:none; font-family:verdana, arial, sans-serif; font-size:12px; color:#000; line-height:25px; overflow:hidden;
	}	
a.nav:hover {color:#fff; background:#764;}
a.nav:active {color:#fff; background:#c00;}

	#container {
	width: 800px;
	height: 1000px;
	margin-left: auto;
	margin-right: auto;
	margin-top:50px;
	text-align:left;
  	}

	
	#leftcontenttop {
	float:inherit;	
	position:relative;
	width:132px;
	height: 599px;
	background-image:url(../images/navbackground_01.jpg);
	left:0px;
	top:0px;
		}

	#navbar {
	float:inherit;
	position:absolute;
	width: 110px;
	height: 262px;
	left: 23px;
	top: 232px;
	}
	
	#rssid{
	float:inherit;
	position:absolute;
	left: 0px;
	width: 39px;
	top: 579px;
	height: 19px;
	left: -1px;
	}
	
	#topcontent {
	float:inherit;
	position:relative;
	height:205px;
	width: 197px;
	background-image: url(../images/virocodemast_02.jpg);
	left: 132px;
	top: -599px;
	}	
		
		
	#centercontent {
	background-image:url(../images/pilline_04.jpg);
	float:inherit;
	position:relative;
	top:-600px;
	padding:20px;
	width: 157px;
	height: 355px;
	left: 132px;
	font-size: 12px;
	}
			
	#centercontentphotographs {
	background-image:url(../images/photographspagecenter.jpg);
	position:relative;
	top:-600px;
	padding:20px;
	width: 157px;
	height: 355px;
	left: 132px;
	}	
	
	#rightcontentindex {
	float:inherit;
	background-image:url(../images/pharmacopeia_03.jpg);
	position:relative;
	top:-1199px; left:328px;
	width:445px;
	height: 599px;
	}
	
	#rightcontentprojectpage {
	background-image:;
	position:relative;
	top:-1199px;
	left:328px;
	width: 610px;
	height:	800px;
	margin-left: 0px;
	padding: 0px;
	visibility: inherit;
	}
	
	#rightcontentprojectpagetop {
	float:inherit;
	position:relative;
	top:-1199px;
	left:328px;
	height:200px;
	width:610px;
	border:0;
	margin: 0;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding: 0;
	padding-top: 5px;
	padding-right: 5px;
	padding-left: 5px;
	color: #000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-style: normal;
	}
	
	#rightcontentlinks {
	background-image:url(../images/mailboxlinks.jpg);
	position:relative;top:-1200px; left:328px;
	width:445px;
	height: 599px;
	}
	
	#rightcontentphotographs {
	background-image:url(../images/photographspageright.jpg);
	position:relative;top:-1199px; left:328px;
	width: 472px;
	height: 599px;
	}
	
	#rightcontentinfo {
	background-image:url(../images/infopageright.jpg);
	position:relative;top:-1199px; left:328px;
	width: 472px;
	height: 599px;
	}
	
	#videoright {
	background:#030303;
	position:relative;top:-1199px; left:328px;
	width: 472px;
	height: 599px;
	}
	
	#rightcontentprojects {
	background-image:url(../images/websiteprojects.jpg);
	position:relative;top:-1199px; left:328px;
	width: 472px;
	height: 599px;
	}
	
	#rightcontentbio {
	position:absolute;
	width:452px;
	height:407px;
	left: 9px;
	top: 180px;
	color: #FFF;
	font-size: 16px;
	overflow: scroll;
	visibility: visible;
	}
	
	#container #rightcontentprojectpagetop p {
}
#container #rightcontentprojectpagetop p {
	font-size: 12px;
}

#container #rightcontentprojectpagetoptext {
	font-size: 12px;
	background-image:;
	position:relative;
	top:-1199px;
	left:328px;
	width: 610px;
	height:	250px;
	margin-left: 0px;
	padding: 0px;
	visibility: visible;
	overflow: scroll;
	margin: 5;
	padding-left: 5px;
	}

		
	#viroblog {
	position:absolute;
	float:inherit;
	font-family: Arial,sans-serif;
	font-size:small;
	width: 425px;
	height: 380px;
	overflow:scroll;
	left: 445px;
	top: 83px;
	padding: 5 px;
	border: 2px groove;
	border-color: #957225;
	}
	
	#textnavigation {
	position:absolute;
	float:inherit;
	width:291px;
	height: 25px;
	top:626px;
	left: -327px;
	}

	#videoone {
	position:absolute;
	width:191px;
	height:131px;
	float:inherit;
	left: 241px;
	top: 30px;
	}
	
	#videotwo {
	position:absolute;
	width:193px;
	height:132px;
	float:inherit;
	left: 39px;
	top: 31px;
	}
	
	#videothree {
	position:absolute;
	width:193px;
	height:132px;
	float:inherit;
	left: 41px;
	top: 169px;
	}
	
	#videofour {
	position:absolute;
	width:193px;
	height:132px;
	float:inherit;
	left:241px;
	top:167px;
	}
	
	#videofive {
	position:absolute;
	width:193px;
	height:132px;
	float:inherit;
	left:41px;
	top:308px;
	}
	
	#videosix {
	position:absolute;
	width:193px;
	height:132px;
	float:inherit;
	left: 241px;
	top: 307px;
	}
	
	#videoseven {
	position:absolute;
	width:193px;
	height:132px;
	float:inherit;
	left: 42px;
	top: 446px;
	}
	
	#videoeight {
	position:absolute;
	width:193px;
	height:126px;
	float:inherit;
	left: 241px;
	top: 446px;
	}
	
	#videolarge{
	position:absolute;
	width:250px;
	height: 422px;
	float:inherit;
	left: 51px;
	top:85px;
	}
	
	

/* css hoverbox gallery code*/
	#photocontainer{
	position:absolute;
	float:inherit;
	left: -44px;
	top: 318px;
	width: 468px;
	}
	
	
.photo
{
	cursor: default;
	list-style: none;
	left: .5px;
	top: 336px;
	left: .5px;
	top: 37px;
	left: .5px;
	top: 36px;
	left: .5px;
	width: 460px;
	top: 20px;
	height: 149px;
	top: 248px;
}

.photo a
{
	cursor: default;
}

.photo a .preview
{
	display: none;
}

.photo a:hover .preview
{
	display: block;
	position: fixed;
	top:50px;
	left: 610px;
	z-index: 1;
}

.photo img
{
	background: #fff;
	border-color: #aaa #ccc #ddd #bbb;
	border-style: solid;
	border-width:thin;
	color: inherit;
	padding:.5px;
	vertical-align:bottom;
	width: 32px;
	height: 45px;
}

.photo li
{
	background: #eee;
	border-color: #ddd #bbb #aaa #ccc;
	border-style: solid;
	border-width: thin;
	color: inherit;
	display:inline;
	float: left;
	margin: 3px;
	padding: .5px;
	position: relative;
}

.photo .preview
{
	border-color: #000;
	height: 348px;
	width: auto;
}

{
	voice-family: "\"}\"";
		voice-family: inherit;
		height:39px;
		}
		
/* another ID element. This is for our center content area....the background has a color of white, and we set margins appropriate to where the box's contents should be displayed. Margin-left at 199px (pushing it just past the absolute positioning of the box on the left....but wait! the positioning for the left box is 200? Yes, so we give our border a 1px width, and this will effectively make it look like just ONE 1px border between these boxes, clever eh? We'll so the same for the right margin. */
		

	/* another ID element, this one for our right side content. we also give this an absolute positioning, so that our borders consistiently overlap with the center area, tucking the center content area in where it should always be. The rules here tell the broser to place this object in an absolute position at 10px in from the right, 50px down from the top, with a width of 200px. Background color and border properties are set as well.*/
	

		
		
/* Now what the eff is this? This is a HACK. Some browsers have still not totally complied with CSS design standards, and will sometimes display your content weirdly....Opera is one, and IE 5.X is another. This should get you around that problem....now what does this code say? OK, the "voice-family" element is a hardly-used element, so it's "Safe" here to play with. Voice-family actually denotes speech characteristics for screen readers. But here, we can use this to put in some INVALID code. INVALID? Wha? Why? Because writing this code will not break the rest of your correct code, and is a hack that will make your other settings show up correctly in browsers that aren't supporting CSS. If this confuses you, DON'T USE IT!! 

       " This piece of code was proposed by Tantek Celik, and it preys upon a CSS
		parsing bug in IE5x PC that will prematurly close a style rule when it runs
		into the string "\"}\"". After that string appears in a rule, then, we can override
		previously set attribute values and only browsers without the parse bug will
		recognize the new values. So any of the name-value pairs above this comment
		that we need to override for browsers with correct box-model implementations
		will be listed below.
		
		We use the voice-family property because it is likely to be used very infrequently,
		and where it is used it will be set on the body tag. So the second voice-family value 
		of "inherit" will override our bogus "\"}\"" value and allow the proper value to
		cascade down from the body tag.

		The style rule immediately following this rule offers another chance for CSS2
		aware browsers to pick up the values meant for correct box-model implementations.
		It uses a CSS2 selector that will be ignored by IE5x PC."
		
		Read more at http://www.glish.com/css/hacks.asp

This code should follow all of your box elements, as such:

#centercontent {
background:#fff;
margin-left: 199px;
margin-right:199px;
border:1px solid #000;
voice-family: "\"}\"";
voice-family: inherit;
margin-left: 201px;
margin-right:201px;
	}
	filter:alpha(opacity=50);
	-moz-opacity:.50;
	opacity:.50;
	
overflow: makes scroll bars

whew, that's over. */









/* the following is the css for flyout menu/nav bar

.menu1{
font-family: arial, sans-serif; width:100px; height:180px; position:relative; font-size:11px; margin:30px 0; background:#eee; padding:25px 10px; border:1px solid #888;
}
.menu1 ul {
padding:0; margin:0; list-style-type: none;
}
.menu1 ul li ul {
visibility:hidden; position:absolute; height:0; overflow:hidden; top:-1px; left:99px;
}
.menu1 ul li {
float:left; position:relative; z-index:90;
}
.menu1 ul li a, .menu1 ul li a:visited {
display:block; float:left; text-decoration:none; color:#000; width:65px; height:30px; line-height:29px; font-size:11px; background:transparent; padding-left:35px;
}
* html .menu1 ul li a, .menu1 ul li a:visited {width:100px; w\idth:65px;}

.menu1 ul li.home {background:url(home.gif);}
.menu1 ul li.photographs {background:url(products.gif);}
.menu1 ul li.video {background:url(services.gif);}
.menu1 ul li.projects {background:url(contact.gif);}
.menu1 ul li.info {background:url(sitemap.gif);}
.menu1 ul li.contact {background:url(news.gif);}

.menu1 ul li ul li.subprod1 {background:url(subprod1.gif) no-repeat;}
.menu1 ul li ul li.subprod2 {background:url(subprod2.gif) no-repeat;}
.menu1 ul li ul li.subprod3 {background:url(subprod3.gif) no-repeat;}
.menu1 ul li ul li.subnews1 {background:url(subnews1.gif) no-repeat;}
.menu1 ul li ul li.subnews2 {background:url(subnews2.gif) no-repeat;}
.menu1 ul li ul li.subnews3 {background:url(subnews3.gif) no-repeat;}
.menu1 ul li ul li.subserv1 {background:url(subserv1.gif) no-repeat;}
.menu1 ul li ul li.subserv2 {background:url(subserv2.gif) no-repeat;}
.menu1 ul li ul li.subserv3 {background:url(subserv3.gif) no-repeat;}
.menu1 ul li ul li.subserv4 {background:url(subserv4.gif) no-repeat;}
.menu1 ul li ul li.subserv5 {background:url(subserv5.gif) no-repeat;}

.menu1 table {
border-collapse:collapse; border:0; padding:0; font-size:1em; position:absolute; left:0; top:0;
}

.menu1 ul li:hover a,
.menu1 ul li a:hover{
text-decoration:underline; border:0;
}

.menu1 ul li a:hover {position:relative; z-index:100;}

.menu1 ul li:hover ul,
.menu1 ul li a:hover ul { */