@charset "UTF-8";

/*
-----------------------------------------------
Screen Stylesheet

Author: Delwin Holeman delwin@idwebandprint.com
Version: 2008.07
----------------------------------------------- */

* {
	margin: 0; /* it's good practice to zero the margin and padding of all the elements to account for differing browser defaults */
	padding: 0;
	}

body  {
	margin: 0 auto;
	font-family: verdana, arial, helvetica, sans-serif;
	color: #333;
	background: url(/images/bg.gif) repeat-x top;
	}
	
body#cartNav  {
	margin: 0 auto;
	font-family: verdana, arial, helvetica, sans-serif;
	color: #333;
	background: #fff url(/images/bg.gif) repeat-x top;
	}

#header {                                                                                             
	margin: 0 auto;
	height: 117px;
	width: 828px;
	}
	
body#cartNav #header {                                                                                             
	margin: 0 auto;
	height: 150px;
	width: 828px;
	}
	
#header #logo {
	float: left;
	}
	
#header #logo a {
	float: left;
	text-indent:-9999px;
	display: block;
	width: 702px;
	height: 116px;
	background: #fff url(/images/logo.gif) no-repeat 0 0;
	overflow: hidden;
	}
	
#phone {
	float: right;
	margin-top: -25px;
	color: #fff;
	font: bold .70em verdana, arial, sans-serif;
	text-transform: uppercase;
	}
	
	
/*
LINKS --------------------- */

a img {
	border: none;
	}
	
a {
	color: #3753fc;
	text-decoration: none;
	}
	
a:hover {
	text-decoration: underline;
	}
	
	
/* 
NAVIGATION --------------------- */

.skiplink {
	display: none;
	}

#navMain {
	float: left;
	width: 828px;
	height: 34px;
	}

#navMain ul {
	float: left;
	display: inline;
	margin: 5px 0 0 143px;
	list-style: none;
	padding: 0;
	height: 34px;
	font: bold .70em verdana, arial, sans-serif;
	text-transform: uppercase;
	}
	
#navMain ul li {
	float: left;
	display: inline;
	margin: 0;
	}
	
#home 	   			li#n-home a:link, 			#home li#n-home a:active, 						#home li#n-home a:visited,
#products   		li#n-products a:link,		#products li#n-products a:active,				#products li#n-products a:visited,
#contact   			li#n-contact a:link,			#contact li#n-contact a:active,					#contact li#n-contact a:visited
	{
	color: #fff;
	}

#navMain a:link, #navMain a:active, #navMain a:visited {
	display: block;
	float: left;
	padding: 3px 16px 3px 16px;
	color: #eaeffb;
	text-decoration: none;
	}
	
#navMain a:hover {
	color: #fff;
	}
	
#navMain li#n-home a {
	padding-left: 0;
	}
	
/*
CONTENT AND COLUMNS --------------------- */

#content { 
	width: 828px; 
	margin: 126px auto 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
	} 
	
body.ms #mainContent, 
body.sm #mainContent {
	width: 500px;
	}
	
body.ms #sidebar,
body.sm #sidebar {
	display: block;
	width: 328px;
	}
	
body.ms #mainContent,
body.sm #sidebar {
	float: left;
	}
	
body.sm #mainContent,
body.ms #sidebar {
	float: right;
	}
	
#mainContent {
	text-align: left;
	padding: 0;
	}
	
div#sidebar {
	display: none;
	}
		
#banner {   
	margin: 0 auto;
	width: 828px;
	height: 92px;
	}
	
p {	
	margin: 0 35px 15px 0;
	font-size: 12px;
	line-height: 1.8em;
	color: #444;
	}
	
#mainContent p.largeText {
	padding: 35px 25px 15px 0;
	margin: 0;
	font-size: 14px;
	line-height: 1.5em;
	color: #444;
	}
	
.productGraphic {
	float: left;
	padding: 20px 6px 20px 0;
	}
	
.productGraphic .caption{
	margin: 10px 0 0 0;
	font-size: 12px;
	font-weight: bold;
	}
	
.manufacturerGraphic {
	float: left;
	padding: 20px 20px 20px 0;
	}
	
sup {
	font-size: 45%;
	}
	
#leftcolumn {
	float: left;
	width: 235px;
	}
	
#rightcolumn {
	float: left;
	width: 235px;
	}
	
	
/*
HEADING TAGS --------------------- */
	
h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
	}

h1 {
	margin: 0 35px 0 0;
	padding: 0;
	font-size: 1.7em;
	}
	
h1.products {
	text-indent:-9999px;
	margin: 22px 0 10px 0;
	display: block;
	width: 471px;
	height: 25px;
	background: #fff url(/images/txt_products.gif) no-repeat 0 0;
	overflow: hidden;
	}
	
h1.manufacturers {
	text-indent:-9999px;
	margin: 42px 0 10px 0;
	display: block;
	width: 471px;
	height: 25px;
	background: #fff url(/images/txt_manufacturers.gif) no-repeat 0 0;
	overflow: hidden;
	}
	
h1.contact {
	text-indent:-9999px;
	margin: 42px 0 10px 0;
	display: block;
	width: 471px;
	height: 25px;
	background: #fff url(/images/txt_contact.gif) no-repeat 0 0;
	overflow: hidden;
	}
	
h2 {
	clear: left;
	margin: 23px 25px 0 0;
	padding: 17px 0 0 0;
	font-size: 1.2em;
	border-top: 1px dotted #000;
	}
	
#products h2 {
	clear: left;
	margin: 13px 25px 0 0;
	padding: 12px 0 0 0;
	font-size: 1.1em;
	border: none;
	}
	
h3 {
	padding: 15px 0 12px 0;
	margin: 0 0 0 0;
	font-size: 1.4em;
	}
	
h3.requestQuote {
	text-indent:-9999px;
	margin: 40px 0 0 0;
	display: block;
	width: 235	px;
	height: 26px;
	background: #fff url(/images/txt_request_quote.gif) no-repeat 0 0;
	overflow: hidden;
	}
	
h3.mapDirections {
	text-indent:-9999px;
	margin: 40px 0 0 0;
	display: block;
	width: 235	px;
	height: 26px;
	background: #fff url(/images/txt_map_directions.gif) no-repeat 0 0;
	overflow: hidden;
	}
	
h3.insideSales {
	text-indent:-9999px;
	margin: 40px 0 0 0;
	display: block;
	width: 235	px;
	height: 10px;
	background: #fff url(/images/txt_inside.gif) no-repeat 0 0;
	overflow: hidden;
	}
	
h3.outsideSales {
	text-indent:-9999px;
	margin: 40px 0 0 0;
	display: block;
	width: 235	px;
	height: 10px;
	background: #fff url(/images/txt_outside.gif) no-repeat 0 0;
	overflow: hidden;
	}
	
h3.products {
	text-indent:-9999px;
	margin: 20px 0 0 0;
	padding: 0;
	display: block;
	width: 471px;
	height: 25px;
	background: #fff url(/images/txt_products.gif) no-repeat 0 0;
	overflow: hidden;
	}

h4 {
	margin: 0 0 12px 0;
	font-size: 1.0em;
	}
	
h5 {
	margin: 25px 0 15px 0;
	font-size: 1.0em;
	line-height: 1.4em;
	}
		
h6 {
	font-family: verdana, arial, sans-serif;
	margin: -8px 0 15px 0;
	font-size: .65em;
	color: #777;
	text-transform: uppercase;
	}
	
.subheading {
	margin: 3px 0 0 0;
	font-size: 12px;
	font-family: Georgia, Times, serif;
	text-transform: uppercase;
	}
	
hr {
	margin: 30px 0 30px 0;
	color: #fff; 
	background-color: #fff; 
	border: 1px dotted #333; 
	border-style: none none dotted; 
	}
	
ul {
	padding: 16px 0 0 0;
	font-size: .80em;
	list-style: none;
	}
	
ul li {
	padding: 0 0 7px 0;
	}
	
ul.productlist {
	width: 185px;
	padding: 13px 0 12px 5px;
	font-size: .80em;
	list-style: none;
	border-bottom: 1px dotted #333;
	}
	
ul.productlist li {
	padding: 0 0 5px 10px;
	background: url(/images/bullet_products.gif) no-repeat 0 6px;
	}
	
ul.bullet {
	margin: 0 15px 15px 20px;
	list-style: none;
	font-size: .85em;
	}
	
ul.bullet li {
	padding: 0 0 6px 15px;
	background: url(/images/bullet.gif) no-repeat 0 5px;
	}
	
ul.twoColumn {
  	float: left;
	margin: 0 0 15px 20px;
  	width: 480px;
	list-style: disc;
	}
	
ul li.twoColumn {
  	float: left;
	list-style: disc;
	width: 230px;
	}

ol {
	margin: 0 30px 15px 70px;
	font-size: .9em;
	line-height: 1.6em;
	}
	
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin: 5px 35px 10px 25px;
	}

.fltlt { /* this class can be used to float an element left in your page */
	float: left;
	margin: 5px 25px 10px 25px;
	}
	
img.border {
	border: 1px solid #1b3c87;
	}
	
.caption a {
	font-size: 12px;
	color: #1b3c87;
	line-height: 25px;
	text-decoration: underline;
	}
	
form {
	font-size: 13px;
	}
	

/*
TABLES--------------------- */


/* sortable table alternating row colors. styles below are for td's that have another class applied which makes the automatic class application not work. See the body onload for the automatic colors */
	

 .even {
 	background-color: #efefef;
	}
	
.odd {
	background-color: #fff;
	} 

/*
FOOTER --------------------- */

	
#footer { 
	width: 100%;
	font-size: 13px;
	background: url(/images/bg_footer_wide.gif) repeat-x;
	} 
	
#footer-container { 
	margin: 0 auto;
	width: 828px;
	height: 264px;
	background: url(/images/bg_footer.gif) no-repeat;
	} 
	
#footer .fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin: 93px 35px 10px 25px;
	}
	
#footer .fltrt img {
	border: 1px solid #1b3c87;
	}
	

#footer .fltrt .caption a {
	font-size: 10px;
	color: #1b3c87;
	line-height: 25px;
	text-decoration: underline;
	}
	
#footer address {
	float: right;
	text-align: right;
	padding: 90px 0 0 39px;
	font-size: 12px;
	line-height: 16px;
	color: #1b3c87;
	width: 280px;
	}

#copyright{ 
	width: 828px;
	margin: 0 auto;
	background: #fff;
	height: 20px;
	} 

#copyright p {
	margin: 0; /* zeroing the margins of the first element in the copyright area will avoid the possibility of margin collapse - a space between divs */
	padding: 5px 25px 5px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
	font-size: 10px;
	color: #b3ad9a;
	background: #fff;
	}
	
#copyright a {
	color: #b3ad9a;
	text-decoration: none;
	}
	
#copyright a:hover {
	text-decoration: underline;
	}

.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
	}