@charset "utf-8";
/* CSS Document */

html, body	{
	margin: 0px; /* To keep all of the browsers happy */	
}


body	{
	margin: 0px;
	background-image: url(../Images/jpegs/bkgrd2.jpg); /* the background image */
    font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	text-align: center;
	}
	
form	{
	padding: 0px; /* Necessary so the form remains its proper size */
	margin: 0px;
	}

img     {  
    border-style: none;
	border: none;
    }

/*   ***********************  ID's  ***********************   */

#wrapper	{
	position: relative;
	width: 800px;
	margin: auto;
	background-repeat: repeat-y;	
	}

#content	{
	position: absolute;
    background-image: url(../Images/gifs/wrapper_bg.gif);
	width: 800px;
	margin: 0 0 0 0;
	top: 0px;
	left: 0px;
    border-left: 1.5px solid #CCC;	
	border-right: 1.5px solid #CCC;
    border-bottom: 1.5px solid #CCC;	
	}
	
	
#header	{	/* Holds the page header on each page */
	width: 800px;
	height: 155px;
	background-color: #ffc;
	}
	
#breadcrumb	{	/* Holds the breadcrumb links */
	width: 800px;
	height: 20px;
	background-color: #336699;
	}

#sidebar	{	/* Left side of the page - links, small thumbnail pics, etc */
	float: left;
	width: 150px;
	padding-top: 20px;
	min-height: 600px;
	}

#sidebar2	{	/* Left side of the page - links, small thumbnail pics, etc.  Use with the <iframe> */
    float: left;
	width: 150px;
	}

#sidebar3	{	/* Left side of the page - links, small thumbnail pics, etc.  Use with the <iframe> */
    float: left;
	width: 150px;
	}
		
#navform {  /* style the dropdown "Related Links" box */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	background-color: #fff;
	width: 140px;
	}
	
	
#title	{	/* The title of each page */
	width: 626px;
	float: right;
	margin-right: 11px;
	height: 55px;
	border-bottom: 1px solid #eeeece;
	background-color: white;
	}
		
#mainContent	{	/* Main Content area that will hold the products */
	float: right;
	padding-right: 10px;
	width: 626px;
	background-color: #fff;

}	

	
#footer	{	/* What else can I say, its the footer */
	clear: both;
	width: 800px;
	height: 100px;
	background-color: #cff;
	}


/*   ***********************  PSEUDO CLASSES  ***********************   */

a:link, a:visited	{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #0000ff;
	text-decoration: none;
	}

a:hover	{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #02028e;
	text-decoration: underline;
	}
	
a.name, a:hover.name, a:focus.name, a:active.name
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-style: normal;
	color: #1f1f1f;
	text-decoration: none;
	}
}
	
/*   ***********************  CLASSES  ***********************   */
	
.blackheader	{	/* Style for the heavier Black text */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	}

.bluetext	{	/* Style of the blue text used throughout the site to add emphasis */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #0000ff;
	text-align: left;
	}

.borderbottom	{	/* Bottom borders for multiple pictured items */
	border-bottom-color: #999999;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	}

.borderbtm	{	/* Bottom borders.  Mainly used on "Close-up" pages */
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #ccc;
	border-right-color: #ccc;
	border-bottom-color: #ccc;
	border-left-color: #ccc;
	}

.borderright	{	/* Used as a dividing line for multiple pictures */
	border-right-width: 1px;
	border-right-style: solid;
	border-top-color: #ccc;
	border-right-color: #ccc;
	border-bottom-color: #ccc;
	border-left-color: #ccc;
	}
	
.breadhead	{   /* Style the Breadcrumbs */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: italic;
	font-weight: normal;
	color: #ffff66;
	padding-top: 2px;
	padding-left: 160px;	/* Move the breadcrumbs 160px from the left side of the page */
	}
	
.breadhead a	{   /* Style the links in the Breadcrumbs */
	background: transparent url(../Images/gifs/breadcrumb.gif) no-repeat center right;
	text-decoration: none;
	padding-left: 3px;
	padding-right: 18px; /* Adjust the image padding */
	color: white; 
	}
	
.breadhead a:hover	{	/* Underline the links when the mouse hovers over */
	text-decoration: underline;
	}
	
	
.cartbtn	{	/* Style the "Add to Cart" buttons */
	background-position: center center;
	text-align: center;
	height: 24px;
	}

.cellbdr	{	/* Style the borders in tables */
	border: 1px solid #000099;
	}

.darkbluehdr	{	/* White text, dark blue background */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: bold;
	color: #fff;
	text-align: left;
	background-color: #000066;
	}

.darkbluehdrcntr	{	/* White text, dark blue background */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: bold;
	color: #fff;
	text-align: center;
	background-color: #000066;
	}
	
.darkbluehdrcntr a	{
	color: #fff;
	text-decoration: none;
	}
	
.darkbluehdrcntr a:hover	{
	color: #CCC;
	text-decoration: underline;
	}

.darkredhdr	{	/* White text, dark red background.  Use for Special Alerts on pages */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: bold;
	color: #fff;
	text-align: center;
	background-color: #c60000;
	}

.datatable	{	/* Used on the Hardware Standoff pages */
	border: none;
	border-collapse: collapse;
	width: 626px;
	}
	
.datatable td	{ /* Give the table a 1px solid border */
	border: 1px solid #ccc;
	}

.enlarge	{	/* Style the "Enlarge Image" or "Click Here...", etc links */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	border-top: 1px solid #e6e4e4;
	border-bottom: 1px solid #e6e4e4;
	background-color: #fff;
	color: #333333;
	}

.enlarge a	{	/* Style of the a:link */
	text-decoration: none;
	color: #8c8b8b;
	}
	
.enlarge a:hover	{	/* Style of the a:link when a mouse hovers over it  */
	color: #000;
	}

.enlarge_spoolpage	{	/* Style the "Back to Hook-up Wire" on the Wire Spools Pages */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #8c8b8b;
	padding-left: 6px;
	}

.enlarge_spoolpage a:link	{	/* Style of the a:link */
	text-decoration: none;
	color: #8c8b8b;
	}
	
.enlarge_spoolpage a:visited	{	/* Style of the a:link */
	text-decoration: none;
	color: #8c8b8b;
	}
	
.enlarge_spoolpage a:hover	{	/* Style of the a:link when a mouse hovers over it  */
	color: #000;
	}	

.even	{	/* Row color #eeeece that don't have the alternate rows command used */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #000;
	text-align: center;
	background-color: #eeeece;
	}

.header	{	/* For the "Coming Soon" text on selected Automotive, HeatVentAir pages */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 36px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	color: #000;
	}

.hdrtext	{	/* Style for the Part Numbers on each item */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: bold;
	color: #ff0000;
	}

.odd	{	/* Row color white that don't have the alternate rows command used */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #000;
	text-align: center;
	}
	
.price	{	/* Prices on the external.htm page */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	font-style: normal;
	font-weight: bold;
	font-variant: normal;
	color: #000099;
	text-align: center;
	}

.pricetext	{	/* Style of the prices on each page */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	font-style: normal;
	font-weight: bold;
	font-variant: normal;
	color: #000099;
	text-align: center;
	background-color: #fefeed;  /* New background color */
/*	background-color: #fafaf1; */ /* Old background color */
	border-top: 1px solid #cccccc;
	height: 20px;
	}
	
.pricetext span	{	/* The style for the quantity amounts, i.e. (5+), (10+), (25+) etc... */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	color: #663300;
	text-align: center;
	}

.pricetext2	{	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	color: #663300;
	text-align: center;
	}

.purpletext	{	/* Purple text, mainly used on close-up pages */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-style: italic;
	color: #000066;
	}

.red	{	/* For all the tables.  Styles the Part Number columns */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #ff0000;
	text-align: left;
	line-height: 20px;
	}

.red a {
    font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #ff0000;	
    }

.red a:hover  {
    font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #ff0000;	
    }
		
.blue	{	/* For all the tables.  Styles the Part Number columns in the ILS tables */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #333399;
	text-align: left;
	line-height: 20px;
	}	

.red2	{	/* For all the tables.  Styles the Part Number columns */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	font-style: normal;
	font-weight: normal;
	color: #ff0000;
	text-align: left;
	line-height: 20px;
	}

.redheader	{	/* Page titles text */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	color: #ff0000;
	text-align: center;
	padding-top: 5px;
	}

.redheader span	{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	color: #000000;
	text-align: center;
	padding-top: 5px;
	}
	
.redheadermed	{	/* Page titles text that are too long to fit within the 626 px  */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 20px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	color: #ff0000;
	text-align: center;
	padding-top: 5px;
	}
	
.redheadersmall	{	/* Page titles text that are too long to fit within the 626 px  */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	color: #ff0000;
	text-align: center;
	padding-top: 5px;
	}	

.redtext	{	/* Red text for special notes - left aligned */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #ff0000;
	text-align: left;
	}

.redtext2	{	/* Red text for special notes - left aligned - slightly larger than the .redtext style */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: bold;
	line-height: normal;
	color: #ff0000;
	text-align: left;
	}

.redtextcntr	{	/* Red text for special notes - center aligned */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #ff0000;
	text-align: center;
	}
	
.redtextcntrbold	{	/* Red text for special notes - center aligned and bolded*/
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: bold;
	color: #ff0000;
	text-align: center;
	}

.smalltext	{	/* Style of the text */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #000;
	text-align: left;
	}

.smalltextcntr	{	/* Style of the special text */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #000;
	text-align: center;
	}

.smallertextcntr	{	/* Style of the special text same as above except smaller */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	font-style: normal;
	font-weight: normal;
	color: #000;
	text-align: center;
	}

.smalltextcntrred	{	/* Style of the special text same as .smalltextcntr except red */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #ff0000;
	text-align: center;
	}

.smalltextleftpadded2	{	/* Used on the Potentiometer Pages */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #000093;
	text-align: left;
	padding-left: 14px;
	text-decoration: underline;
	}

.smalltextleftpadded3	{	/* Used on the Potentiometer Pages */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #000;
	text-align: left;
	padding-left: 24px;
	}

.subhdr	{	/* Style for the Sub-headers */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #990000;
	text-align: center;
	}

.subscript	{	/* small text used for subscripting */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	color: #990000;
	}

.subscript2	{	/* small text used for subscripting */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	color: #990000;
	}

.text	{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: normal;
	line-height: normal;
	color: #000;
	}

.text span	{
	color: #003366;
	}

.textbold	{	/* Bolded text */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: bold;
	line-height: normal;
	color: #000;
	text-align: center;
	}
	
.textboldblue	{	/* Bolded text */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: bold;
	line-height: normal;
	color: #3300ff;
	text-align: center;
	}	

.textboldsmall	{	/* Bolded text same as above except smaller size */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	color: #000;
	}

.textsmaller	{	/* Some pages have some descriptive text at the top of the page.  Use this style for those pages */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: normal;
	line-height: normal;
	}
	
.underlinetext {   /* Primarily Used for "Related Links" text */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: italic;
	font-weight: normal;
	color: #000000;
	text-align: left;
	text-decoration: underline;
	padding-left: 6px;
	}
	
.vertline	{
	background-image: url(../Images/gifs/1pixelspacer.gif);
	background-repeat: repeat-y;
	background-position: center center;
	}

.whitetext {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	font-weight: normal;
	color: #FFFFFF;
	text-align: left;
}

.div-tableyellow   {
	display:table; 
	width: 626px;
	margin: auto;

	background-color: #FFFF00;

    }

.div-tableblue   {
	display:table; 
	width: 626px;
	margin: auto;
	background-color: #DEE6EF;

    }
		
.div-table   {
	display:table; 
	width: 400px;
	margin: auto;
	padding: 1px 5px 8px 5px;
	background-color: #DEE6EF;
	border: 1.5px solid #BCCDD6;

    }
	
.div-table-caption   {
	display:table-caption; 
    font-weight: bold;
	}

.div-table-row   {
	display:table-row;
    text-align: center;
	}
	
.div-table-col   {
	display:table-cell; 
	padding: 5px; 
	}		

	
/*   ***********************  TAGS  ***********************   */

h1	{	/* Title of the Parts */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: bold;
	color: #1f1f1f;
	text-align: center;
	line-height: normal;
	margin: 0;
	padding: 0;
	}
	
h1 span	{ /* Sub-title of the Parts */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #990000;
	text-align: center;
	}
	
h2	{	/* Title of the Parts that are too long to fit in the 300px width */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: bold;
	color: #1f1f1f;
	text-align: center;
	line-height: normal;
	margin: 0;
	padding: 0;
	}
	
h2 span	{ /* Sub-title of the Parts that are too long to fit in the 300px width */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	color: #990000;
	text-align: center;
	}
	
h3	{	/* Title of the Parts that are too long to fit in the 300px width */
	margin: 0;
	padding: 0;
	}
		
h4	{	/* Header text for the 3 up layouts.  (200px wide) i.e. Potentiometers, Variable Caps, etc. */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	text-align: center;
	color: #000033;
	margin: 0;
	padding: 0;	
	}
	
h4 span	{	/* Sub-title of the Parts that are too long to fit in the 200px width */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;
	text-align: center;
	color: #990000;
	}

h5  {  /*Red Header*/
	font-family: Arial, Helvetica, sans-serif;
	font-size: 24px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	color: #ff0000;
	text-align: center;
	margin-top: 5px;
    }

.darkredhdr a {
	font-size: 14px;
	color: #FFF;
	text-decoration: none;
	}

.darkredhdr a:hover {
	font-size: 14px;
	color: #FFF;
	text-decoration: underline;
	}

.oddeven	{	/* For JQuery tables */
	background-color: #eeeece;
	}
	
.formlabel   {
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	color: #000;
    float: left;
	margin-left: 60px;
	text-align: left;
}

.forminput  {
	float: right;
	padding-right: 60px;