@charset "utf-8";
body {
font-family: arial, helvetica, sans-serif;
background:#000000;
/* This centers the main tables. NOT the text "in" the tables. It's here as IE doesn't recognize margin-left and right with "auto" in the main_table_width style below. */
text-align:center;
/* This is just the body colour for any text that hasn't any styles sdded to it. It "IS NOT" the background colour of the pages. That's set above. Ummm.... back this up before you revise or play around on this OK!. */
color: #666666;
}

/* This is the CSS for all of the pages "breadcrumbs". */
.topnav { 
 	font-size: 11px;
	color: #314962;
	font-weight: bold;
 	background-color: #ffffff;
 	border: 1px #dee6e9 solid;
 	padding: 0.5em;
	margin-bottom: 10px;
	margin-left: 10px;
}
/* End of the CSS for the "breadcrumbs". */

/* This is the CSS for the page mouseovers and hidden page elements. It's used for any pages that have "tabs" in them which hide the content until the user clicks a tabbed link reveling alternative content on the page. */

/* This CSS was commented OUT as iot may have been utilized for a test mouseover drop down script. It was disabled February 11th, 2010. If the site navigation works well then delete this from this CSS file and in the "print.css file. Thanks Cam.

.mainExpand {
	font-size: 12px;
	font-weight: bold;
	color: #314962;
	cursor:hand;
	cursor:pointer;
} */
	  
/* This is the CSS for changing the width of the main tables in the site. The "auto" settings for the margins centers the tables but NOT the contents with. */
.main_table_width {
width: 950px;
margin: 0;
padding: 0;
margin-left: auto;
margin-right: auto;
}  

/* This is the CSS for changing the headers for any pages that have a "Feature" product. Anything new or improved that should be brought to attention. Used sparingly on the site, currently just on the home page.*/
.text-feature-headers_bold {
font-size: 12px;
color: #314962;
font-weight: bold;
letter-spacing: 2px;
word-spacing: 2px;
}

/* This is the CSS for changing the "Features" and "Applications" titles of all product pages. */
.features {
font-size: 12px;
color: #AA0000;
font-weight: bold;
letter-spacing: 2px;
font-family: Arial, Helvetica, sans-serif;
}

/* This is the CSS for changing the headers of "ALL" of the pages. It's a very large sweeping change so design with caution. */
.text-headers_bold {
font-size: 18px;
color: #314962;
font-weight: bold;
letter-spacing: 4px;
word-spacing: 2px;
font-style: italic;
padding-bottom: 20px;
}

/* This is the CSS for changing the attributes of any text that is on top of a paragraph as a "header". Changes to this CSS DOES NOT change any text attributes that are within the "anchor" tag set used to link to other documents. When mixxing headers and links on the same page it would be better to change both this AND the anchor attribute tag sets. */
.text-headers-paragraph_bold {
font-size: 12px;
color: #7793af;
font-weight: bold;
}

/* Just in case you wanted to use a bold underline through out the Web site, this would be the code for that. Currently it is only used for the Carrers page. */
.text-bold_underline {
font-size: 12px;
color: #7793af;
font-weight: bold;
letter-spacing: 2px;
word-spacing: 2px;
text-decoration: underline;
}

/* This is the CSS for the side menus on all of the product pages. Since the contents are links their look when you move the mouse over them is controlled from the "anchor" CSS. */
.text-side_menu {
	font-size: 11px;
	color: #000000;
	font-weight: bold;
	line-height: 18px;
	padding-left: 30px;
}

/* This changes all of the text throughout the site. Font size, colour, space between the lines and the right margin so it does not crowd the right border (margin-right). Any changes to this "DOES NOT" change the appearance of text links using the "a" anchor tag sets. It should be flexible enough so that one change to this code will propagate text updates through the whole site. ULP.... think about this well before you make any changes. Maybe copy all of the CSS page onto a text document so you can scoot back to the original if you really F@Q sumthin up! */
.text {
font-size: 11px;
color: #666666;
line-height: 1.5em;
margin-right: 20px;
}

.footer {
font-size: 11px;
color: #666666;
line-height: 1.5em;
margin-right: 20px;
padding-left: 10px;
padding-bottom: 10px;
}

/* This CSS controls all of the link colour, decoration setings. Again, this is a sweeping change to the site so beware. Note: a:active MUST come after a:hover in the CSS definition in order to be effective!! Note: a:hover MUST come after a:link and a:visited in the CSS definition in order to be effective!!
*/

a:link, a:active {
font-size: 11px;
	color: #3E3E3E;
	text-decoration: none;
}
a:visited {
	font-size: 11px;
	color: #6c6c6c; /* Was a lighter Gray #848484. Changed February 04, 2010 */ 
	text-decoration: none;
}

a:hover {
font-size: 11px;
	color: #314962;
	text-decoration: underline;
}

/* This is the CSS for the directions text on the "Contact Us" page only. Maybe change that!
*/
#directions * {
	font-size: 11px;
}

/* This is the CSS for all the text fields that are lists, bulleted points and it can change the leading symbol to an graphic image rather than a disc or a square.
*/
li{
	font-size: 11px;
	color: #314962;
	line-height: 20px;
	list-style-type: disc;
	margin-left: 10px;/* list-style-image: url(images/arrow-over.gif);*/
}

/* This is the CSS for the collapsing accordion menu on all of the product pages. */
.AccordionTitle, .AccordionContent, .AccordionContainer
{
  position:relative;
  width:170px;
}

.AccordionTitle
{
	height: 20px;
	overflow: hidden;
	cursor: pointer;
	font-family: Arial;
	font-size: 8pt;
	font-weight: bold;
	color: #ffffff;
	vertical-align: middle;
	text-align: center;
	display: table-cell;
	/*background-repeat: repeat-x;
	background-image: url('images/title_repeater.jpg');*/
	-moz-user-select: none;
	background: #314962;
	border-top: solid 1px #dbe3e9;
/* Moves the Title text down a bit. Looks better in IE but FF it's a little low. */
	padding-top: 1px;
}

.AccordionContent
{
  height:0px;
  overflow:hidden;
 /* overflow:auto; */
  display:none;
}

 /* These three lines contain the colour code for the menu boxes side lines */
.AccordionContainer
{
  border-bottom: solid 1px #b4c4d1;
  border-left: solid 1px #b4c4d1;
  border-right: solid 1px #b4c4d1;
}

/* End of the CSS for the collapsing accordion menu. */

/* This is the CSS for the scroling News and Events section. */
#pscroller {
border-top: black 0px solid;
border-right: black 0px solid;
border-left: black 0px solid;
border-bottom: black 0px solid;
padding-right: 1px;
padding-left: 1px;
padding-bottom: 1px;
padding-top: 5px;
width: 260px;
height: 180px;
}
/* End of News and Events CSS */

/* This CSS is for the "POP UP" window images for the products. This script should be revised depending upon its versatility. Implemented for test purposes only on February 09th, 2010  */

/* Begin "POP UP" Window CSS */
#thumbBox{ /*Outermost DIV for thumbnail viewer*/
position: absolute;
left: 0;
top: 0;
width: auto;
padding: 10px;
padding-bottom: 0;
background: #314962; /* Dark Blue colour */
visibility: hidden;
z-index: 10;
cursor: hand;
cursor: pointer;
border: 2px solid black;
}

#thumbBox .footerbar{ /*Footer DIV of thumbbox that contains "close" link */
	letter-spacing: 5px;
	line-height: 1.1em;
	color: white;
	padding: 5px 0;
	text-align: right;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
}

#thumbBox #thumbImage{ /*DIV within thumbbox that holds the enlarged image */
background-color: white;
}

#thumbLoading{ /*DIV for showing "loading" status while thumbbox is being generated*/
position: absolute;
visibility: hidden;
border: 1px solid black;
background-color: #EFEFEF;
padding: 5px;
z-index: 5;
}
/* End of "POP UP" Window CSS */