CSS CODE
/*width 100% which would force the content to the left and right edges of the viewport 
to centre the div in the viewport, we apply "auto" margins to left and right. To move the div away from the top and bottom of the viewport we use a margin of 10px. Combined into one: "margin: 10px auto". This will apply a margin of 10px to the top and bottom and auto margins to the left and right. 

*/

/* =universals 
These rules are applied to all elements unless otherwise specified below. */

  * {	PADDING-RIGHT: 0px;	PADDING-LEFT: 0px;	PADDING-BOTTOM: 0px;	MARGIN: 0px;	PADDING-TOP: 0px} 

#site {
	top:185px;
	width:900px;
	z-index:2000;
	padding-top:10px;
}


#menu {
	padding:0;
	width:920px; 
	margin:0; 
	height:18px; 
	position:relative; 
	background:#003340;
}


#content {
	margin-left: 190px;
	margin-right: 160px;
	padding: 0em 1em 1em 1em;
	max-width: 600px;
	min-height: 500px; /*375*/
	color: #666666;
}


/* =a */
	A {	TEXT-DECORATION: none} 
	a:link { color : #FFF; text-decoration : none; }
	a:hover { color : #666666; }
	a:active, a:focus, a:visited  { color: #FFF; text-decoration : none; }
	A:link, A:visited {	COLOR: #000;	BORDER-BOTTOM: #555 1px solid}



ul {
	LIST-STYLE-TYPE: none;
	 margin-left: 0px;
} 
 
ul li a:visited {
 	BORDER-BOTTOM: #555 1px solid;
}
 
 
#quicklinksbody A:link, A:visited {  BORDER-BOTTOM: none}  

/* =body */
body { font : Tahoma, Verdana, Arial, sans-serif;}


#container {
	width: 800px;  /*85%*/
	margin-left: 20px;
	background-color: #fff;
	color: #000;
	border: 0px solid gray;
	line-height: 130%;
	text-align:left;
	font : 76%/160% Tahoma, Verdana, Arial, sans-serif;  color : #000000;
}

#masthead
{
	padding: 0.5em;
	background-color: #fff;
	text-indent:-9999px;
	background : url(images/logo6.gif) no-repeat;
	height:100px;
	border-bottom-width: 1px;
	border-bottom-style: none;
	border-bottom-color: gray;
	width:600px;
}


#masthead a {
    position: absolute; 
	top: 0px;    
	left: 50px; 
	width:400px; 
	height:100px; 
	border-bottom:none;
	text-align:right;
}
	   
#masthead h1 {
	padding: 0;
	margin: 0;
	display: none;
}

 #contactme {
	background:url(images/contactme.gif) 95% 100% no-repeat;
	height:40px;
	width:180px;
	position:relative;
	color:#ffffff;
	top:50px;
	left:710px;
	}
	
#contactme h3{
	text-indent:-300px;
}

.quickLinks {
	font-size: 62.5%;
	font-weight: bold;
	background:  url(images/brown-corners.png) no-repeat;
	padding: 5px 5px;
	text-align: center;
	font: 1em/100% Arial, sans-serif;
	margin-bottom: 0;
	line-height: 100%;
	text-decoration: none;
}
			
h3 {
	font: bold 1.1em/1.54545454em Verdana, Arial, sans-serif;
	margin-bottom: 1px;
	margin-top: 1.2em;
}
		
		

#articles  li {
  color:#000000;
  }
	
#articles ul {	
	margin:1em 0 1.5em;
	padding:0;
	font-size:110%;
	list-style:none;
	display:inline;
}

#articles ul li {
	margin:0 0 0em; /*originally 0 0 0.5em */
	padding:0 0 0 0px;
	line-height:1.5em;
}
  

#articles {
	margin-left: -15px;
	margin-bottom: 10px;
	padding-bottom: 10px;
	width: 170px;
}
	
#quicklinks  {
	margin-left: -15px;
	width: 170px; 
}


#articles h3, #quicklinks h3 {
	background: url(images/topbrownbar170.gif) no-repeat top; 
	padding-right: 10px;
	padding-left: 10px;
	color: #fff;
	margin-top: 0px;
  }

 
#articlesbody {
	padding:10px 5px 10px 15px;
	line-height:1.5em;
	text-align:justify;
	background-image: url(images/170bttms.gif); /*was 170white.gif */
	background-repeat: no-repeat;
	background-position: 0px bottom;
	
   }
   
#quicklinksbody {
	text-align:left;
	padding:5px 10px 5px 10px;
	padding:10px 5px 5px 5px;
	line-height:1.5em;
	text-align:justify;
	background-image: url(images/170bttms.gif);
	background-repeat: no-repeat;
	background-position: -340px bottom;
}
  
#articles a:link,  a:visited  {display:inline;}
#articles a:hover {color: #333333;}

/* To float the left nav, we need to use the rule: "#leftnav {float: left;}". When a div is set to float, a width must also be included, so we can add another declaration: "width: 160px;". 
Next, we set the margin to "0", add 1em of padding (which will move the text away from the edges of the div). */

#rightnav {
	float: left;
	width: 180px;
	margin-top: 0px;
	padding: 0;
	line-height:0;
}


#leftnav {
	width: 135px; 
	margin: 0;
	padding: 0em 0em 0em 1em;
	float: right;
}


/*This next step is the most important of the entire process. The "leftnav" div has been floated, so text from the "content" div will flow down its left edge and then wrap around under it. To make the text appear as it is in a new column, we apply margin-left to the "content" div, making sure that the width is greater than the overall width of the "leftnav" div. In this case, we will use "margin-left: 200px", which will give us 40px margin between the leftnav and the main content. The same is done to the right side. */

p.strapline {
	FONT-WEIGHT: bold;
	FONT-SIZE: 110%;
	MARGIN-BOTTOM: 8px;
	COLOR: #333333; /*333333*/
}

.tighterstrapline {
	FONT-WEIGHT: bold;
	FONT-SIZE: 110%;
	MARGIN-TOP: 0px;
	COLOR: #333333; 
}

.strapline {
	FONT-WEIGHT: bold;
	FONT-SIZE: 110%;
	MARGIN-BOTTOM: 8px;
	COLOR: #333333; /*So we can make part of a paragraph like the strapline heading*/
}





/* To style the footer, we first need to set it to "clear: both". This is critical, as it will force the footer below any floated elements above */

#footer {
	clear: both;
	margin: 0px;
	width:920px;
	color: #FFF;
	text-align:center;
	background-color: #003340; /*#853514*/
	border-top: 1px solid gray;
	vertical-align:middle;
}

 
#footer a:link{
	color : #FFFFFF;
	text-decoration : none;
	display:inline;
 
}
#footer a:visited {
	color : #FFFFFF;
	display:inline;
}

#footer a:hover {
	color:#cccccc;
}
/* To remove the space above content in the "lefnav", "rightnav" and "content" divs, use the following rules: "#leftnav p, #rightnav p { margin: 0 0 1em 0; }" and "#content h2 { margin: 0 0 .5em 0; }". 

Browsers use different amounts of margin above paragraphs and headings. It is safe to remove all top margins, as long as there are bottom margins to keep the paragaphs and headings seperate from elements below them. */


#leftnav p, #rightnav p { margin: 0 0 1em -2em; }
#rightnav p {
	text-indent:-9999px;
	background : url(images/briefcase-kid2.jpg) no-repeat;
	height: 380px; /*380x228*/
	width: 224px;
}

#addresses p {
	padding: 0px;
	margin: 0px;
}

#addresses a:link, a:visited {
	display:inline;
}


#content h3 {	MARGIN-TOP: 0px;	PADDING-LEFT: 4px;	FONT-SIZE: 110%;	MARGIN-BOTTOM: 5px;	PADDING-BOTTOM: 1px;	COLOR: #ffffff;	PADDING-TOP: 0px;	BACKGROUND-COLOR: #ada089}

#maintitlecontent h3 {
	background: url(images/topbrownbar522.gif)  no-repeat;
	background-color: #ffffff;
}

#servicephoto {
	float:right;
	margin-top:20px;
	margin-left:10px;
}

#content p {
	text-align:justify;
}

#content  a:visited {
	text-decoration: underline;
}

#content  a:link {
	text-decoration: underline;
	border-bottom:none;
}



#noindent {
padding:0;/*stop ul indentation in firefox - ie uses margin */
} 

#services li a {font-size:110%;}
#services li a:visited {
	text-decoration:underline;
	border-bottom:none;
}

#tooltip {
	position: absolute;
	z-index: 3000;
	border: 1px solid #111;
	background-color: #fff;
	padding: 5px;
	opacity: 0.85;
	font:normal;
	font-size:10px;
	-moz-border-radius-bottomleft:7px;
	-moz-border-radius-bottomright:7px;
	-moz-border-radius-topleft:7px;
	-moz-border-radius-topright:7px;
}

#tooltip div { margin: 0;}
 
 #tooltip h3 {
	margin:0;
	font-size:8pt;
	font-weight:normal;
}


A:visited { text-decoration: underline;}

#printfooter {
	visibility: hidden;
}

#printheader {
	visibility: hidden;
}
