﻿/*----- main text and body styles -----*/
body {
	color: #222;
	text-align: center;
	font: 85% "Trebuchet MS",Verdana,Arial,sans-serif;
    margin: 0 auto;
    padding: 0;
    }
      
h1, h2, p {
	margin: 0;
	padding: 0 10px;
	font-weight:normal;
	}

p {
	margin: 0; 
	padding: 0 10px 10px 10px;
	}	
	
ul {
	margin: 0; 
	padding: 0 10px 5px 10px;
	text-decoration: none;
	text-indent: 5px;
	list-style-position: outside;
	list-style-type: square;
	}
	
h1 {
	font-size: 250%;
	color: #fff;
	letter-spacing: 1px;
	}
h2, h3 {
	font-size: 200%;
	color: RGB(00, 102, 51);
	}
h3{
	font-size: 100%;
	padding: 0 10px 5px 10px;
	}

/*----- ordinary hyperlinks -----*/
a:link, a:visited, a:hover {
	text-decoration: none;
	font-weight: bold;	
	}
	a:link, a:visited {color: #003300;}
	a:hover {color: #339933;}

/*****
 ***** Main navigation menu */
ul#mainmenu {
	list-style: none;
	margin: 0;
	padding: 0;
	background-image: none;
	}
	
ul#mainmenu li {
	display: block;
	border-top: 1px solid #ccc;
	}
	ul#mainmenu li a {
		display: block;
		text-decoration: none;
		margin: 0px 0px 0px 0px;
		padding: 5px 4%;
		background: RGB(00, 102, 51);
		background-image: none;
		width: 88%;				
		color: #C6E1B9;
		font:  small verdana, sans-serif;
		font-weight: bold;
		}
	
		ul#mainmenu li a.woodactivepage {background: #393; color: #C6E1B9; }
		ul#mainmenu li a.fireactivepage {background: #a01; color: #C6E1B9; }
		ul#mainmenu li a.earthactivepage {background: #cc0; color: #006633; }
		ul#mainmenu li a.metalactivepage {background: #222; color: #C6E1B9; }
		ul#mainmenu li a.wateractivepage {background: #044; color: #C6E1B9; }
		
		ul#mainmenu li a:hover {
			background: #C6E1B9; 
			background-image: none;
			color: #009933;
			}
		ul#mainmenu a:hover#woodnav {background: #393; color: #C6E1B9; }
		ul#mainmenu a:hover#firenav {background: #a01; color: #C6E1B9; }
		ul#mainmenu a:hover#earthnav {background: #cc0; color: #006633; }
		ul#mainmenu a:hover#metalnav {background: #222; color: #C6E1B9; }
		ul#mainmenu a:hover#waternav {background: #044; color: #C6E1B9; }


/*----- containers for layout -----*/
#page {
	width:800px;
    text-align:left;
    background:#fff;
    margin: auto;
    padding: 0;
    }

#header {
	position: absolute;
	float: right;
	width:800px;
	margin: 5px 0 0 0;
	padding: 5px;
	z-index: 3;
	}

#container{ 
	position: absolute;
	z-index: 0;
	top: 120px;
	width:790px;
	margin: 0 auto;
	padding:5px;
	text-align:left;
	border-top: 1px dotted #ccc;
	border-bottom: 1px dotted #ccc;
	border-left: 1px dotted #ccc;
	border-right: 1px dotted #ccc;
	}
	
#content {
	float:right;
	width:600px;
	margin:50px 0;
	padding-left:0px; padding-right:0px; padding-top:10px; 
	}

#leftside {
	float:left;
	width:180px;
	padding:10px 0 10px 0;
	margin:50px 0;
	}
	div#leftside p {
		text-align: center
		}
		
#navbar {
	float:left;
	width:180px;
	padding:10px 0 10px 0;
	margin: 0;
	background: #A9D289;
	}

#contact, #contactname {
	float:left;
	width:97%;
	margin:0;
	padding:5px 2px 5px 2px;
	background: #fff;
	background-image: none;
	}
	#contact p {
		color: RGB(00, 102, 51);
		font: 80% Verdana, sans-serif;
		}
	#contactname p {
			color: RGB(00, 102, 51);
			font: bold 85% verdana, sans-serif;
			font-variant: small-caps;
			}
	#contact {
		margin-top: 5px;
		border: 1px dashed #ccc;}
					
#imagebar {
	float: right;
	padding : 10px 0 10px 0;
	margin: 0;
	width: 70px;
	/*border: 1px solid #ccc;*/
	}

ul#subjectlist {
	text-indent: 5px;
	list-style-position: inside;
	list-style-type: square;
	}
	
/*----- picture galleries -----*/
#gallery { 
	width:100%;
	padding: 0 0 10px 0;
	margin: 0;
	}
	div#gallery ul {
		list-style-type: none;
		text-align: center;
		margin: 0;
		padding: 0;
		}
		div#gallery li, div#gallery li.gallerywoodimg, div#gallery li.galleryfireimg,
		div#gallery li.galleryearthimg, div#gallery li.gallerymetalimg, div#gallery li.gallerywaterimg {
			width: 60px;
			padding: 3px 0px 3px 0px;
			margin: 2px 0px 2px 0px;
			background-color: RGB(00, 102, 51);
			text-align: center;
			}
		div#gallery li.gallerywoodimg {background-color: #393; }
		div#gallery li.galleryfireimg {background-color: #a01; }
		div#gallery li.galleryearthimg {background-color: #cc0; }
		div#gallery li.gallerymetalimg {background-color: #222; }
		div#gallery li.gallerywaterimg {background-color: #044; }

		div#gallery li img {
			padding-left: 3px;
			margin-left: 0;
			display: block;
			width: 50px;
			border: 0px;
			}

#leftgallery{ 
	float:left;
	width:100%;
	margin: 10px 0 10px 0;
	padding: 0 0 0 0;
	}
	div#leftgallery ul{
		list-style-type: none;
		margin: 0 0 0 60px;
		padding: 0 0 0 0;
		}
		div#leftgallery li, div#leftgallery li.singlewoodimg, div#leftgallery li.singlefireimg,
		div#leftgallery li.singleearthimg, div#leftgallery li.singlemetalimg, div#leftgallery li.singlewaterimg {
			width:60px;
			padding: 3px 0px 3px 0px;
			margin: 2px 0px 2px 0px;
			background-color: RGB(00, 102, 51);
			text-align: center;
			}
		div#leftgallery li.singlewoodimg {background-color: #393; }
		div#leftgallery li.singlefireimg {background-color: #a01; }
		div#leftgallery li.singleearthimg {background-color: #cc0; }
		div#leftgallery li.singlemetalimg {background-color: #222; }
		div#leftgallery li.singlewaterimg {background-color: #044; }
	
		div#leftgallery li img {
			display: block;
			padding-left: 3px;
			margin-left: 0;
			width: 50px;
			border: 0px;
			}
			
#box {
	float:right;
	width:150px;
	padding: 0;
	margin: 5px 15px 0 5px;
	background:#ff9933;
	text-align:center;
	}
	div#box p{
		margin: 0;
		padding:0 5px;
		}

#footer {
	clear: both;
	border-top: 1px dotted #ccc;
	}

#mousedoctor, #mousedoctor a {
	clear: both;
	background: #fff;
	padding: 0;
	margin-top: 2px;
	font: 70% "Verdana",Arial,sans-serif;
	color: #aaa;	
	}
	#mousedoctor a {
		text-decoration: none;
		font: 100% "Verdana",Arial,sans-serif;
		font-weight: bold;
		}
		#mousedoctor a:hover {
			color: #888;
			font: 100% "Verdana",Arial,sans-serif;
			font-weight: bold;
			}

#tablelayout {
		width: 90%;
	}

#WHOtable {
	width: 85%;
	border-collapse: collapse;
	margin-left: 10px;
	}
	
.WHOheaderrow {
	background: #eee;
	font-weight: bold;	
	font-size: 85%;
	color: RGB(00, 102, 51);;
	}

.WHOnormalrow {
	font-size: 85%;
	color: #570710;
	vertical-align: top;
	}
	.WHOnormalrow td { 
		width: 33%;
		padding: 2px;
		}	
.WHOtreatmentlist {
	list-style-type: square
	}
	
/*****
 ***** End of CSS declarations */