/*----------Zero out elements----------*/
html, body, p, h1, h2, h3, h4, h5, h6, ul, ol, li, form, input {
	margin: 0; /* Zeros out the various default values browsers place on elements to give a consistent starting point. */
	padding: 0;
	border: 0;
}

/*----------Set body rule----------*/
/* change b5804a to 99CC66 */
body {
	background: #f9fc66 url(images/body_bg.jpg) repeat-x; /* Sets the body background color and a background image that repeats on the x-axis. */
	font: 100.01% Calibri, Arial, Helvetica, sans-serif; /* Sets the base font size and face. */
}

/*----------Sets the styles for the skip to navigation link----------*/
#skip {
	position: absolute; /* Sets the skip DIV to absolute to take it out of the flow of the document; this allows it to be placed in an exact location. */
	left: -3000px; /* Adds a high negative margin to take the skip DIV off the viewport so that visual visitors do not see it. */
}

/*----------Sets the width of the main wrapper that will contain all the other DIVs----------*/
#wrapper {
	width: 1024px; /* Makes the main wrapper 760 pixels wide. */
}

/*----------Sets the header area styles. ----------*/
#header {
	background: url(images/header_bg.jpg) no-repeat; /* Sets the header background image with no repeat. */
	height: 136px; /* Sets the height of the header DIV to the height of its background image. */
	width: 744px; /* Sets the header width the same as its background image. */
	margin-left: 180px; /* Sets the left margin to carve out space for the sidebar and navigation area. */
}

#header img {
	margin-left: 1px; /* Moves the logo image over a pixel so it doesn't cover the white border on the background image.  */
}

/*----------Sets the innerwrapper DIV that encloses the two right-floated columns.----------*/ 
#innerwrapper {
	float: left; /* Floats the innerwrapper left. */
	width: 1024px; /* Sets the width to 760 pixels to hold the two right-floated columns. */
	padding: 1px 0 1px 0; /* Adds one pixel of top and bottom padding to prevent margin escaping. */
	background: url(images/content_bg.jpg) 180px 0 repeat-y; /* Sets the main content area background image. Repeats it on the y-axis, and starts it at 280 pixels horizontally and 0 vertically. */
}

/*----------Sets the styles for the content area of the page.----------*/
#content {
	float: right; /* Floats the content DIV right; floating both columns right allows the main content to come first in the source order. */
	width: 800px; /* Sets the width to 445 pixels. */
	margin: 0 15px 0 0px; /* Sets margins around the content DIV to separate it from the sidebar and right edge of the innerwrapper. */
	display: inline; /* Fixes IE doubled float margin bug. */
}

#content h1 {
	padding: 10px 20px 10px; /* Sets padding around the heading 1 text. */
	font: bold 120% "Lucida Grande","Lucida Sans","Lucida Sans Unicode",Lucida,Arial,Helvetica,sans-serif;  /* Sets the font size and face. */
	color: #597293; /* Sets the text color of the heading 1 text. */
}
#content h2 {
	padding: 10px 20px 5px; /* Sets padding around the heading 1 text. */
	font: bold 110% Calibri,Arial,Helvetica,sans-serif;  /* Sets the font size and face. */
	color: #667B33; /* Sets the text color of the heading 1 text. */
}
#content p, td {
	margin: 1em 0 .6em 0; /* Sets margin space around the paragraph text. */
	font-size: 85%; /* Sets the relative font size of paragraph text. */
	line-height: 1.5; /* Sets the leading (spacing) between lines of text. */	
}
.table_content {
	font: 1.1em Calibri,Lucida,Arial,Helvetica,sans-serif;  /* Sets the font size and face. */
}
/*----------Sets the styles for the sidebar area.----------*/

#sidebar {
	float: left; /* Floats the sidebar DIV to the right. */
	width: 150px; /* Sets the width of the sidebar area. */
	margin-top: 240px; /* Sets a top margin on the sidebar area so that it starts beneath the navigation link area. */
	margin-left:10px;
}

#sidebar p {
	font-size: 80%; /* Sets the font size of paragraph text within the sidebar. */
	color: #000; /* Sets the text color to white in the sidebar div. */
	margin: 1em 0 4em 0; /* Sets margin space around sidebar paragraphs. */
}

/*----------Sets the styles for the navigation area.----------*/

#nav {
	left: 15px; /* Sets the left coordinate of the absolutely positioned nav DIV. */
	top: 60px; /* Sets the top coordinate of the absolutely positioned nav DIV. */
 	position: absolute; /* Takes the nav DIV out of the flow of the document and places it at a set location. */
	width: 140px; /* Sets the width of the navigation area to 240 pixels. */
	height: 185px; /* Sets the height of the nav to match the height of the striped area of body background image. */
}

#nav a { 
    display: block; /* Changes the a element from its default inline display property to display as a block. */
    width: 100%; /* Sets the width of the block element to 100% of the nav DIV to make it fully clickable. */
    padding: 4px 0 5px 4px; /* Pads the top and bottom of the link. */
} 

#nav a:link, #nav a:visited { 
    color: #000; /* Sets the text color of links and visited links. */ 
    text-decoration: none; /* Removes underlines from links. */ 
    font:normal 12px/16px Calibri,Arial,Helvetica,sans-serif; 
} 

#nav a:hover, #nav a:active, #nav a:focus { 
    color: #5A7293; /* Sets the color of the text when the link is in the hover, active, or focus state. */ 
} 

#nav li { 
    padding-left: 20px; /* Pads the list item so that there is space after the decorative bullet. */
    font-size: 100%; /* Sets the font size of links. */ 
    list-style: none; /* Removes the default solid, round bullet from list items. */ 
    background: url(images/nav_bg.jpg) 0 7px no-repeat; /* Sets a decorative image for the links. */ 
} 

/*----------Sets the styles for the footer area.----------*/

#footer {
	background: url(images/footer_bg.jpg) no-repeat; /* Sets the non-repeating background image on the footer */
	width: 744px; /* Sets the width of the footer DIV to 480 pixels. */
	margin-left: 180px; /* Sets the margin to 280 pixels to carve out room for the sidebar area. */
	margin-bottom: 10px; /* Adds some space between the footer and the bottom of the viewport. */
	height: 63px; /* Sets the height to the height of the background image. */
	clear: both; /* Makes sure both floated columns in the main area are clear of content before the footer begins. */
}

#header_date p {
	font-size: 75%; /* Sets the font size of footer paragraph text. */
	color: #0a0a0a; /* Sets the text color to white. */
	padding-top: 25px; /* Adds 25 pixels of padding to the top of the paragraph so that text starts further down the background image. */
	padding-bottom: 5px; /* Adds 5 pixels of padding to the bottom of the text. */
	margin-left:10px;
}

#footer p {
	font-size: 75%; /* Sets the font size of footer paragraph text. */
	color: #fff; /* Sets the text color to white. */
	padding-top: 25px; /* Adds 25 pixels of padding to the top of the paragraph so that text starts further down the background image. */
	padding-bottom: 5px; /* Adds 5 pixels of padding to the bottom of the text. */
	text-align: center; /* Aligns footer paragraph text in the middle of the div. */
	
}
#footer a {
	color: #fff; /* Sets links in the footer to white. */
}

/*----------Right and left float classes to add to images.----------*/

.lftimg {
	float: left; /* Floats an image to the left and wraps text around it. */
	margin-right: 10px; /* Adds 10 pixels of margin space to the right of the image. */
}

.rghtimg {
	float: right; /* Floats an image to the right and wraps text around it. */
	margin-left: 10px; /* Adds 10 pixels of margin space to the left of the image. */
}
.blacktext {
	color:#000000;
    font: bold 12px/16px Calibri,Arial,Helvetica,sans-serif; 
}
.nolightbulb {
	color:#222222;
    font: bold oblique 18px/20px Calibri,Arial,Helvetica,sans-serif; 
}
.list1 {
	margin-left:20px;
	margin-right:10px;
	margin-top:10px;
	margin-bottom:10px;
}
.smallText {
	font-size: 75%;
	color: #000000;
	font-family: Calibri,Arial, Helvetica, sans-serif;
	}
.whitetext {
	font-weight: bold;
	color: #ffffff;
	text-decoration:none;
	font-family: Calibri,Arial, Helvetica, sans-serif;
} 
/* the following selectors are the form styles */
#formcontainer {
	width: 480px;/*set the width of the form container*/
	margin: 0px 20px 20px 10px;/*set the margins*/
}

/*set the h1 element in the form container*/
#formcontainer h1 {
	font-size: 120%;/*scale the font size against the body selector*/
	font-family: Georgia, "Times New Roman", Times, serif;/*set the font family*/
	margin: 10px 15px 0 0;/*set the margins of the h1*/
	padding: 0 0 20px 0;/*set the padding on the h1*/
	color: #000000;/*set the font colour*/
	font-weight: 500;/*sets the font weight a little less than bold, if not supported in a given browser defaults to a normal weight. If you want bold for your h1 delete this property and value pair - or simply comment them out*/
}

/*style the p in the form container*/
#formcontainer p {
	font-size: 80%;/*scale the font size against the body selector*/
	margin: 0 0 20px 0;/*set a 20 pixel margin on the bottom, zero the rest*/
	padding: 0;/*zero the padding*/
}

/*style the inputs*/
#formcontainer input {
	background-color: #BCCFEF;/*set a background colour on the form inputs*/
	color: #000000;/*set a colour for the text that is added to the inputs*/
	border: 1px solid #4C5854;/*set a border on the inputs - gives them a flat appearance*/
	margin: 0;/*zero off any margins*/
}

/*style the textarea*/
#formcontainer textarea {
	background-color: #BCCFEF;/*set the background colour*/
	color: #000000;/*set the text colour*/
	border: 1px solid #4C5854;/*add a border to give it a flat appearance*/
	margin: 0 25px 0 0;/*set a 25 pixel margin to the right zero off any remaining borders*/
}

/* shows focus in the form inputs and textarea */
#formcontainer input:focus, #formcontainer textarea:focus {
	background-color: #FFE898; /*set the background colour of the input and textarea when the cursor is inside*/
	color: #000000; /*set the text colour to white*/
}

/*position the textarea by floating its containing lable*/
.labelfloat {
	float: right;/*float to the right*/
	padding-top: 20px;/*level it off with the inputs to the left by adding 20 pixels of padding to the top of the label*/
}

/*style the form element labels*/
#formcontainer label {
	color: #333333;/*set the text colour*/
	font-size: 75%;/*scale the font size off the body selector*/
	padding-top: 5px;/*set a little padding to the top*/
	padding-bottom: 5px;/*set a little padding to the bottom*/
	display:block;/*set the display to block to ensure each input is shown on a different line i.e. they do not run horizontally*/
}

/*style the parent fieldset*/
#formcontainer fieldset {
	margin: 0;/*zero off the margins*/
	border: 1px solid #5C6231;/*add a border to define it's edges*/
	text-align: left;/*align the text to the left*/
	padding: 5px 5px 20px 20px;/*set the padding*/
	width: 425px;/*give it a width*/
}

/*style the nested fieldset*/
#formcontainer fieldset fieldset {
	width: 425px;/*give it a width*/
	padding: 0;/*remove any default padding*/
/*	border: none;/*add border none to prevent inheriting a border from the parent*/
	border:1px solid #eeeeee;
}
#formcontaner fieldset.radio {
	width:15em;
	margin:1em 0 2em 0;
}
/*style the form legend */
#formcontainer legend {
	color: #333333;/*set the text colour*/
	font-weight: bold;/*set the font weight to bold*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
/*
	background-color: #BCCFEF;/*set a background colour*/
/*	border: 1px solid #000;/*set a border around the legend*/
	padding: 0px;/*set alittle padding to give it some space against the border*/
	font-size: 80%;/*scale the font size against the body selector*/
}

#formcontainer input {
	background-color: #BCCFEF;/*set a background colour on the form inputs*/
	color: #000000;/*set a colour for the text that is added to the inputs*/
	border: 1px solid #4C5854;/*set a border on the inputs - gives them a flat appearance*/
	margin: 0;/*zero off any margins*/
}

#formcontainer li {
	color: #000099;/*set the text colour*/
	font-family: Verdana, Arial, Helvetica, sans-serif;
	padding: 2px;/*set alittle padding to give it some space against the border*/
	font-size: 80%;/*scale the font size against the body selector*/
	background-color:#ffffff;
	margin-right:10px;
}

