/* structure.css are the styles for the DIVs in a website and should not contain
any typographic or content-related styles for a site. The styles within are strictly
used to create the layout/structure of the website and, as such, this style sheet 
will (almost) never need to be altered by the client or back-end programmers. */
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
/* ----- comment styles well for better reference later! ----- */
/* ----- try to lay this out in the following sections and from top to bottom on pages ----- */

/* STYLES FOR ALL PAGES */

	*
	{
		padding:0;
		margin:0;
	}
	html
	{
		padding:0;
		margin:0;
	}
	#uber{
		position:relative;
		width:890px;
		margin:0 auto;
		padding:0;
	}
	#headBanner1{/*main switching header on the home page*/
		float:left;
		padding:0;
		margin:0;
		width:890px;
		height:245px;
		background:url(/images/header_main_01.jpg) top left no-repeat;
	}
	#headBanner2{/*main switching header on the home page*/
		float:left;
		padding:0;
		margin:0;
		width:890px;
		height:245px;
		background:url(/images/header_main_02.jpg) top left no-repeat;
	}
	#headerLogo{/*holds the let's curb pesticides logo*/
		width:447px;
		height:245px;
		position:absolute;
		top:0;
		left:0;
	}
	#mainNav{
		z-index:-1;
		height:39px;
		width:890px;
		display:inline;
		padding:0;
		margin:0;
		overflow:hidden;
	}
	#mainNav a{/* hides the dashes (by turning them green) caused by the nbsp in the navigation anchor tags*/
		color:#98B36C;
		font-family:Arial, Helvetica, Verdana, sans-serif;
		font-size:1px;
		padding-top:-40px;/* puts the words off the screen because the links are actually images -> a w3c compliancy issue */
		text-decoration:none;
		}
	#mainNav a:hover{
		color:#CFDAB8;
		}
	body
	{
		margin:0;
		padding:0;
		color:#000;
		background:#9eab98 url(/images/bkgnd_grass_01.jpg);
	}
	img{
		border:0;
		padding:0;
	}
	p{
		font-family:Arial, Helvetica, Verdana, sans-serif;
		font-size:14px;
		line-height:18px;
		color:#000;
		padding:0;
		margin:0;
	}
	h1{
		font-family:Arial, Verdana, Helvetica, sans-serif;
		font-style:bold;
		font-size:16px;
		color:#648628;
		padding-left:20px;
	}
	#clear{
		clear:both;
	}
		ul{
		font-family:Arial, Helvetica, Verdana, sans-serif;
		font-size:14px;
		color:#000;
		list-style-type:disc;
		list-style-position:inside;
		padding:0;
		margin:0;
	}
	ol{
		font-family:Arial, Helvetica, Verdana, sans-serif;
		font-size:14px;
		color:#000;
		list-style-type:decimal;
		list-style-position:inside;
		padding:0;
		margin:0;
	}
	a{
		font-family:Arial, Helvetica, Verdana, sans-serif;
		font-size:14px;
		color:#000;
		text-decoration:underline;
	}
	a:hover{
		text-decoration:none;
	}
	table{
		font-family:Arial, Helvetica, Verdana, sans-serif;
		font-size:14px;
		line-height:16px;
		color:#000;
		margin:20px 0;
		border:1px solid #000;
	}
	th{
		font-family:Arial, Helvetica, Verdana, sans-serif;
		font-size:14px;
		line-height:16px;
		color:#000;
		border:1px solid #000;
		padding:1px 10px;
	}
	td{
		font-family:Arial, Helvetica, Verdana, sans-serif;
		font-size:14px;
		line-height:16px;
		color:#000;
		border:1px solid #000;
		padding:1px 10px;
	}

/* ---- NAVIGATION tags ---- */

	#navtab1 a {
			display: block; width: 230px; height: 39px; margin: 0; float: left;
			background: url(/images/navTab01.jpg) 0 0 no-repeat;
	}
	#navtab1 a:hover {background-position: 0px -39px; text-decoration: none;}
	#navtab1on, #navtab1on a, #navtab1on a:hover {
			display: block; width: 230px; height: 39px; margin: 0; float: left;
			background: url(/images/navTab01.jpg) 0px -39px no-repeat; color:#CFDAB8;
	}
	#navtab2 a {
			display: block; width: 169px; height: 39px; margin: 0; padding: 0; float: left;
			background: url(/images/navTab02.jpg) 0 0 no-repeat;
	}
	#navtab2 a:hover {background-position: 0px -39px;text-decoration: none;}
	#navtab2on, #navtab2on a, #navtab2on a:hover {
			display: block; width: 169px; height: 39px; margin: 0; padding: 0; float: left;
			background: url(/images/navTab02.jpg) 0px -39px no-repeat; color:#CFDAB8;
	}
	#navtab3 a {
			display: block; width: 188px; height: 39px; margin: 0; padding: 0; float: left;
			background: url(/images/navTab03.jpg) 0 0 no-repeat;
	}
	#navtab3 a:hover {background-position: 0px -39px;text-decoration: none;}
	#navtab3on, #navtab3on a, #navtab3on a:hover {
			display: block; width: 188px; height:39px; margin: 0; padding: 0; float: left;
			background: url(/images/navTab03.jpg) 0px -39px no-repeat; color:#CFDAB8;
	}
	
	#navtab4 a {
			display: block; width: 97px; height: 39px; margin: 0; padding: 0; float: left;
			background: url(/images/navTab04.jpg) 0 0 no-repeat;
	}
	#navtab4 a:hover {background-position: 0px -39px;text-decoration: none;}
	#navtab4on, #navtab4on a, #navtab4on a:hover {
			display: block; width: 97px; height: 39px; margin: 0; padding: 0; float: left;
			background: url(/images/navTab04.jpg) 0px -39px no-repeat; color:#CFDAB8;
	}
	
	#navtab5 a {
			display: block; width: 206px; height: 39px; margin: 0; padding: 0; float: left;
			background: url(/images/navTab05.jpg) 0 0 no-repeat;
	}
	#navtab5 a:hover {background-position: 0px -39px;text-decoration: none;}
	#navtab5on, #navtab5on a, #navtab5on a:hover {
			display: block; width: 206px; height: 39px; margin: 0; padding: 0; float: left;
			background: url(/images/navTab05.jpg) 0px -39px no-repeat; color:#CFDAB8;
	}
	/* ---- Home Content ---- */
	
	#content{
		float:left;
		position:relative;
		padding:30px;
		width:830px;
		background:#ccd9b6 url(/images/content_bkgnd.gif) repeat-x top;
		/*height:407px;*/
	}
	#medOfficer{ /* contains banner with message from the medical officer */
		display:block;
		float:left;
		position:relative;
		margin:5px 15px 10px 0;
		/*top:30px;
		left:30px;*/
		}
	#illustration{ /* contains interactive illustration banner */
		display:block;
		float:left;
		position:relative;
		margin-right:15px;
		margin-bottom:10px;
		/*top:150px;
		left:30px;*/
	}
	
	
	
	/* --- Local Lawns is the box on the right in the content window on the home page --- */
	
	#localLawns{
		float:right;
		width:399px;
		background:url(/images/content_right_bkgnd.gif) repeat-y top;
		display:block;
		position:relative;
		padding-top:210px;
		}
	#localLawnsImg{
		position:absolute;
		top:0;
		left:0;
	}
	#localLawnsBottom{ /* bottom rounded corners */
		position:relative;
		height:11px;
		width:399px;
		padding-top:10px;
		margin:0;
		background:url(/images/content_right_bottom.gif) no-repeat bottom left;
		}
	#localLawnsSignature{ /* john and jane doe */
		float:left;
		width:162px;
		height:22px;
		left:45px;
		position:relative;
		padding:10px;
		background:url(/images/content_right_sig.gif) no-repeat;
	}
	#localLawnsButton{ /* the local lawns button */
		padding-right:45px;
		padding-bottom:0px;
		float:right;
		width:129px;
		height:27px;
	}
	#localLawnsText{
		padding:0px 30px 20px 45px;
	}
	#leftQuote{/* div containing the opening quote of the local lawns paragraph */
		position:absolute;
		top:210px;
		left:28px;
		width:8px;
		height:11px;
		background:url(/images/quote_left.gif) top left no-repeat;
	}
	#rightQuote{
		display:block;
		}
		
	/* Home events is the section on the home page in the bottom left with updateable events */
	#homeEvents{
		display:block;
		position:relative;
		float:left;
		/*top:276px;
		left:30px;*/
		width:380px;
		}
	#homeEvents a{
		color:#003366;
		font-size:14px;
		line-height:18px;
		font-family:Arial, Helvetica, Verdana, sans-serif;
		font-weight:bold;
		text-decoration:none;
		}
	#homeEvents a:hover{
		text-decoration:underline;
		}
	#homeEvents ul{
		display:block;
		list-style-image:url(/images/content_bullet.gif);
		list-style-position:outside;
		margin-left:20px;
		/*list-style-type:none;
		list-style-position:outside;
		background: url(/images/content_bullet.gif) no-repeat 0 6px;
		padding-left:20px;
		margin-top:5px;
		margin-left:3px;*/
		}
	#homeEvents li{
		margin-top:5px;
	}
	/* ---- Footer content ---- */	
	#logoFooter{
		width:890px;
		float:left;
		height:90px;
		padding:0;
		margin:0;
		background:#ccd9b6;
		display:block;
	}
	#logoFooter a{
		color:#ffffff;/* hides the text (by turning it white) */
		font-family:Arial, Helvetica, Verdana, sans-serif;
		font-size:1px;
		padding-top:5px;/* puts the words off the screen because the links are actually images -> a w3c compliancy issue */
		text-decoration:none;
		}
/* divs for all of the logos at the bottom */
	#logoBar01 a{/* north dumfries */
		display:block;
		width:99px;
		height:90px;
		float:left;
		background:url(/images/logoBar01.jpg) top left no-repeat;
		}
	#logoBar02 a{/* no idea */
		display:block;
		width:108px;
		height:90px;
		float:left;
		background:url(/images/logoBar02.jpg) top left no-repeat;
		}
	#logoBar03 a{/* city of cambridge */
		display:block;
		width:134px;
		height:90px;
		float:left;
		background:url(/images/logoBar03.jpg) top left no-repeat;
		}
	#logoBar04 a{/* city of kitchener */
		display:block;
		width:109px;
		height:90px;
		float:left;
		background:url(/images/logoBar04.jpg) top left no-repeat;
		}
	#logoBar05 a{/* region of waterloo-public health */
		display:block;
		width:114px;
		height:90px;
		float:left;
		background:url(/images/logoBar05.jpg) top left no-repeat;
		}
	#logoBar06 a{/* city of waterloo */
		display:block;
		width:116px;
		height:90px;
		float:left;
		background:url(/images/logoBar06.jpg) top left no-repeat;
		}
	#logoBar07 a{/* wellington county */
		display:block;
		width:95px;
		height:90px;
		float:left;
		background:url(/images/logoBar07.jpg) top left no-repeat;
		}
	#logoBar08 a{/* no idea */
		display:block;
		width:115px;
		height:90px;
		float:left;
		background:url(/images/logoBar08.jpg) top left no-repeat;
		}
		
	#footerNav a{ /* navigation in the footer section of the site */
		font-size:12px;
		color:#000;
		text-decoration:underline;
		}
	#footerNav a:hover{
		text-decoration:none;
	}
	#footerNav p{
		font-size:12px;
	}
	#footerTop{
		position:relative;
		padding:0 30px;
		background:#ccd9b6;
		height:68px;
		width:830px;
	}
	#footerBottom{ /* the round corners at the bottom of the page */
		margin-bottom:10px;
		position:relative;
		background:url(/images/footer_bottom.jpg) no-repeat;
		width:890px;
		height:7px;
	}
	#footerNav{ /* the navigation at the bottom of the page */
		display:block;
		float:left;
		padding-top:25px;
	}
	#esolLogo a{/* the esolutions logo in the footer */
		position:absolute;
		top:17px;
		left:595px;
		width:262px;
		height:30px;
		display:block;
	}



/* ---- TOP NAVIGATION - the navigation at the top of the page with the search bar ---- */
	#topNav{
		width:330px;
		height:21px;
		position:absolute;
		top:10px;
		left:550px;
		color:#FFFFFF;
	}
	#topNav a{
		vertical-align:middle;
		color:#FFFFFF;
		font-family:Arial, Helvetica, Verdana, sans-serif;
		font-size:11px;
		text-decoration:none;
		font-weight:bold;
		}
	#topNav a:hover{
		text-decoration:underline;
		}
	#searchField{ /* attributes of the search field */
		width:100px;
		height:21px;
		margin-left:5px;
		margin-right:5px;
		background:#d2deb3;
		border-top:2px solid #848484;
		border-left:2px solid #848484;
		border-bottom:2px solid #fafafa;
		border-right:2px solid #fafafa;
		}
	#searchButton{
		vertical-align:middle;
		width:21px;
		height:19px;
		}
	
/* ---- INSIDE PAGE ---- */
/* sub-navigation on the left of an inside page */
	#subNav{ 
		margin:0;
		padding:0;
		float:left;
		width:180px;
		display:block;
		}
	#subNav a{ 
		display:block;
		width:180px;
		padding:5px 0;
		margin:0;
		color:#003366;
		font-size:13px;
		text-decoration:none;
		font-family:Arial, Helvetica, Verdana, sans-serif;
		font-weight:bold;
		}
	#subNav a:hover, #subNavOn, #subNavOn a, #subNavOn a:hover{
		color:#5C6A45;
		}
	#subNav ul li{
		float:left;
		margin:0;
		list-style-type:none;
		border-bottom:1px solid #ACB19F;
		}
/* Paragraph of content on the inside page */
	#insideContent{
		margin-left:20px;
		width:630px;
		float:left;
		display:inline;
		}
	#insideContent h1{ 
		font-family:Arial, Helvetica, Verdana, sans-serif;
		font-weight:normal;
		font-size:18px;
		color:#000000;
		padding-bottom:10px;
		padding-left:0;
		}
	#insideContent h2{
		font-family:Arial, Helvetica, Verdana, sans-serif;
		font-size:15px;
		font-weight:bold;
		color:#000000;
	}
	#insideContent p{
		font-family:Arial, Helvetica, Verdana, sans-serif;
		font-size:14px;
		line-height:17px;
		padding-bottom:10px;
	}
	
/*image on the right in an inside page*/
	.insideImage{
		width:216px;
		height:273px;
		float:right;
		/*top:62px;
		left:644px;*/
		margin:30px 0 20px 20px;
		display:inline;
		}
/* Print and email buttons */
	#printEmail{
		position:absolute;
		width:216px;
		top:32px;
		left:644px;
		text-align:right;
		}
	#printEmail a{
		padding-left:10px;
	}	
	#icreate{/* removes the underline on the <a name=""> tag */
		text-decoration:none;
	}

/* ----- end template ----- */