/* Copyright 2006 - Healty Home. */
/* All these files used in layout for Healthy Home */

/* Page Elements */

	body { margin: 10px 0 0 0; background-color:#CCCC9A; }
	img { border: 0px; }
	
	#content_container{
		width:800px;
		margin:0 auto;
	}
		
/* Top Elements */

	#top { width: 100%; height: 237px; }
	
		#top .hotspot a { display: block; position: absolute; width: 400px; height: 175px; margin: 30px 0px 0px 375px; }
		#sublinks_bg { width: 100%; height: 21px; background: #333; filter:alpha(opacity=50); -moz-opacity:.50; opacity:.50;} 
		#sublinks_border { width: 100%; height: 1px; font-size: 1px; border-top: 1px solid #333;}
		#sublinks { position: absolute; top: 0; height: 21px; background: #2B4E75; }
		#sublinks ul { list-style-type: none; padding: 0px; margin: 0px; }
		#sublinks li { float: left; margin: 0px; padding: 3px 8px 3px 16px; border-right: 1px solid #333; margin-left: 8px}
			#sublinks li.a { background: url("/images/ico_home.jpg") no-repeat left center; }
			#sublinks li.b { background: url("/images/ico_envelope.jpg") no-repeat left center; }
			#sublinks li.c { background: url("/images/ico_checkmark.jpg") no-repeat left center; }
		#sublinks, #sublinks a { color: #fff; font: normal 12px Arial, Helvetica, sans-serif }
		
		#nav { width: 100%; height: 31px; background: #2B4E75; margin-top: 212px; border-top: 1px solid #333; border-bottom: 1px solid #fff; }
		#nav ul { list-style-type: none; padding: 0px; margin: 6px 0px 6px 0px; }
		#nav li { background: url("/images/ico_arrow.jpg") no-repeat left center; float: left; margin: 0px 0px 6px 10px; border-right: 1px dotted #fff; }
		#nav li a {display: block; padding: 3px 10px 5px 8px; color: #fff; text-decoration: none; font: 14px Verdana, Arial, Helvetica, sans-serif; text-transform: uppercase;}
		#nav li img {padding: 0px 15px 0px 25px; margin-left: -15px}	
			#nav li.last { border: 0px; }

/* Mid Elements */

	#mid { width: 100%; clear: left; float: left; background: #D0DEEE; border-bottom: 31px solid #2B4E75; font: normal 11px Verdana, Arial, Helvetica, sans-serif }
		#mid.full { background: #fff url("/images/bg_mid.jpg") repeat-x; }
		#mid h1 { font: bold 18px Verdana, Arial, Helvetica, sans-serif; color: #2B4E75; margin: 12px 0px; }
		#mid h2 { font: bold 14px Verdana, Arial, Helvetica, sans-serif; color: #333; }
		#mid a { font: bold 11px Verdana, Arial, Helvetica, sans-serif; color: #FF9933; }
			#mid a:hover { color: #2B4E75; }
		#mid .content { float: left; width: 430px; padding: 0px 20px 10px 40px; background: #fff url("/images/bg_mid.jpg") repeat-x;}
		#mid.full .content { width: 706px; }
		/*Ask the expert section */
		#mid .expert { float: left; width: 217px; padding: 0px 40px 0px 20px}
			#mid .expert label { clear: left; float: left; width: 50px; padding: 4px 0px 0px 0px; font-size: 10px}
			#mid .expert input.txt { float: left; margin: 0px 0px 3px 0px; width: 155px; font: normal 10px Verdana, Arial, Helvetica, sans-serif; padding: 2px 0px}
			#mid .expert textarea { margin: 3px 0px 10px 0px; width: 205px; height: 60px; font: normal 10px Verdana, Arial, Helvetica, sans-serif; padding: 2px 0px}
			#mid .expert p.r { text-align: right; }
		/*Account login section */
		#mid .login { float: left; width: 217px; padding: 0px 40px 0px 20px}
			#mid .login label { clear: left; float: left; width: 50px; padding: 4px 14px 0px 0px; font-size: 10px}
			#mid .login input.txt { float: left; margin: 0px 0px 3px 0px; width: 145px; font: normal 10px Verdana, Arial, Helvetica, sans-serif; padding: 2px 0px}
			#mid .login textarea { margin: 3px 0px 10px 0px; width: 205px; height: 60px; font: normal 10px Verdana, Arial, Helvetica, sans-serif; padding: 2px 0px}
			#mid .login p.r { text-align: right; }

/* Btm Elements */

	#btm { clear: left; width: 800px; font: normal 10px Verdana, Arial, Helvetica, sans-serif; padding: 5px 0px 10px 0px; margin:0 auto; }
		#btm a { font: normal 10px Verdana, Arial, Helvetica, sans-serif; color: #000; }
		#btm .left { float: left; width: 485px; padding-left: 10px; line-height: 15px}
		#btm .right { float: left; width: 250px; text-align: right; }
		#btm .footer { width: 485px; text-align:center; margin:0 auto; }