* { 
padding : 0;
margin : 0;
} 

body { 
font : 85% "Trebuchet MS", Arial, Helvetica, sans-serif;
font-size : 13px;
background-image : url(bg.gif);
background-repeat : repeat-x;
text-align: center; /* IE7 is stupid and seems to need this to centre */
} 

p { 
color : #787878;
} 

h1 { 
font-size : 1.6em;
} 

h2 { 
font-size : 1.4em;
} 

h3 { 
font-size : 1.2em;
} 

a { 
color : #348763;
text-decoration : none;
} 

a:hover { 
color : #003366;
text-decoration : underline;
} 

img {
border: 5px #348763 solid;
}

#wrapper { 
margin : 0 auto;
width : 800px;
} 

/*--  THIS IS FOR THE HEADER IMAGE  --*/
#header { 
color : #333;
width : 0px;
padding : 0 0 0 0;
height : 0px;
margin : 0 0 0 0;


background-repeat : no-repeat;
}

/*--  STYLING FOR THE LOGO / SITE NAME AND TAG LINE  --*/
#logo {
float: left;
} 

#logo h1 { 
font-size : 1.7em;
font-weight : lighter;
padding-top : 70px;
padding-left : 25px;
color : #003366;
border : none;
left : 14px;
} 

#logo h2 { 
padding-left : 25px;
font-size : 0.9em;
text-transform : none;
left : 14px;
color : #99cccc;
} 

#logo a { 
color : #99cccc;
text-decoration : none;
} 

/*--  TOP NAVIGATION STYLING  --*/
#navigation { 
float : right;
width : 820px;
color : #333;
padding : 0px 0 0px 0;
margin : -28px 30px 20px 0px;
} 

#navigation ul { 
list-style-type : none;
text-align : center;
float: right;
font-weight : 800;
} 

#navigation li { 
display : inline;
float: left;
} 

#navigation a { 
width : auto;
text-decoration : none;
color : #348763;
padding : 5px;
} 

#navigation a:hover {
height: 39px; 
color : #003366;
background-image: url(navhov.gif);
background-position: 39px;
} 

/*--  LEFT COLUMN STYLING  --*/
#leftcolumn { 
color : #333;
margin : 0 0 0 0px;
padding : 0 0 10px 0;
width : 200px;
float : left;
} 

/*--  STYLING FOR THE LEFT NAVIGATION  --*/
#leftnav ul { 
list-style : none;
} 

#leftnav li { 
margin : 0 0 2px 0;
} 

#leftnav li a { 
display : block;
width : 199px;
height : 40px;
line-height : 30px;
background : url(nav.gif) no-repeat left top;
text-indent : 10px;
color : #348763;
text-decoration : none;
font-weight : 800;
padding-top : 5px;
} 

#leftnav .active, #leftnav li a:hover { 
background-position : right top;
color : #003366;
font-weight : 800;
} 

/*--  INFO BAR STYLING - need to put "<div class='news'>" at beginning of  --*/
/*--  content & finish content with "</div><div class="newsbottom"></div>"  --*/
/*--  for the box to appear around the content  --*/
.news { 
background-image : url(leftbox.gif);
background-repeat : no-repeat;
margin-top : 5px;
width : 200px;
min-height : 100px;
} 

.newsbottom { 
height : 15px;
background-image : url(leftboxbot.gif);
background-repeat : no-repeat;
margin-bottom: -20px;
} 

.news h3 { 
color : #336698;
font-family : verdana;
font-size : 1em;
margin-left : 10px;
margin-right : 10px;
margin-top : 4px;
padding-top : 20px;
padding-bottom : 5px;
} 

.news h4 { 
font-family : verdana;
font-size : 0.9em;
padding-top : 10px;
padding-bottom : 5px;
color : #348763;
margin-left : 5px;
} 

.news p { 
font-family : verdana;
font-size : 0.75em;
padding-left : 10px;
padding-bottom : 5px;
padding-top : 5px;
margin-left : 10px;
margin-right : 10px;
text-align : justify;
padding-right : 10px;
background-color : #eff6ff;
} 

.news a { 
padding-right : 10px;
} 

/*--  RIGHT COLUMN STYLING  --*/
.rightcolumn { 
float : right;
color : #333;
min-height : 350px;
width : 578px;
border-left : 5px solid #B5BEFF;
border-right : 5px solid #B5BEFF;
background-color: #FFFFFF;
} 

.rightcolumn h1 { 
margin : 0 5px 0 5px;
padding : 0 0 0 5px;
color : #003366;
background-color : #348763;
} 

.rightcolumn h2 { 
margin : 10px 5px 0 5px;
padding : 0 0 0 5px;
color : #003366;
background-color : #348763;
} 

.rightcolumn p { 
padding : 10px 5px 0 5px;
text-align : justify;
font-size : 1.1em;
} 

/*--  IF YOU ADD  "<span class="inset"></span>" TO YOUR CONTENT  --*/
/*--  THIS WILL ADD A BOX TO YOUR CONTENT 250px SQUARE  --*/
/*--  ANYTHING TYPED BETWEEN THE TAGS WILL HAVE THE FOLLWOING STYLING  --*/
/*--  IDEAL FOR LARGE ADVERTS BUT IF YOU TYPE, ONLY H3 IS STYLED  --*/ 
.inset { 
float : right;
width : 250px;
height : 250px;
padding : 10px;
margin : 10px 5px 5px 5px;
color : inherit;
font-size : 85%;
background-image : url(250ad.gif);
background-repeat : no-repeat;
} 
.inset h3 { 
padding-left : 10px; 
padding-right : 10px; 
padding-top : 5px; 
color: #348763; 
text-align: justify;
}

/*--  IF YOU ADD  "<div class="adunit"></div>" TO YOUR CONTENT  --*/
/*--  THIS WILL ADD A BOX TO YOUR CONTENT 478px X 70px  --*/
/*--  ANYTHING TYPED BETWEEN THE TAGS WILL HAVE THE FOLLWOING STYLING  --*/
/*--  IDEAL FOR GOOGLE ADS OR OTHER ADVERTS BUT IF YOU TYPE, ONLY H3 IS STYLED  --*/ 
.adunit { 
width : 478px;
height : 70px;
margin : 10px auto;
background-image : url(468ad.gif);
background-repeat : no-repeat;
} 
.adunit h3 {
padding-left : 15px; 
padding-right : 15px; 
padding-top : 5px; 
color: #348763;
text-align: justify;
} 

/*--  THIS ADDS THE BORDER TO THE TOP OF THE RIGHT COLUMN  --*/
#righttop { 
float : right;
color : #333;
height : 15px;
width : 588px;
display : inline;
background-image : url(rctop.gif);
background-repeat : no-repeat;
background-position : 0 0;
} 

/*--  THIS ADDS THE BORDER TO THE BOTTOM OF THE RIGHT COLUMN  --*/
#rightbottom { 
float : right;
color : #333;
margin-bottom: 10px;
height : 11px;
width : 588px;
display : inline;
background-image : url(rcbot.gif);
background-repeat : no-repeat;
} 

/*--  FOOTER STYING  --*/
#footer { 
width : 800px;
height : 95px;
padding-top : 5px;
clear : both;
color : #333;
background-image : url(footer.gif);
background-repeat : no-repeat;
} 

#footer p { 
text-align : center;
padding-top : 10px;
font-size : 80%;
} 

#footer ul {
text-align : center;
padding-top : 10px;
font-size : 80%;
list-style-image: none;
}

#footer li { 
display : inline;
}

#footer a { 
width : auto;
text-decoration : none;
padding : 5px;
}