﻿body {
	background-image: url('images/background/bgpattern.gif');
	background-color: #626262;
	margin: 0px; padding: 0px;
	font: 12px Arial, Helvetica, sans-serif;
}
table {
	border-collapse: collapse;
}
img {
	vertical-align: middle;
}
a {
	color: #0044AA;
}
a.return {
	color: #660066;
}
a:visited {
	color: #660066;
}
a:hover {
	text-decoration: none;
}
a img {
	border-width: 0px;
	border-style: none;
}
.pageintro {
	margin: 1px 0px 3px 0px; padding: 0;
	font-size: 11px;
	line-height: 11px;
	color: #A0A0A0;
	text-align: center;
}
div#main {
	width: 830px;
	margin: auto;
	padding: 0px 4px;
	background-color: white;
	border-top: 1px solid black;
	border-left: 1px solid black;
	border-right: 1px solid black;
}

/* **********************************************************
       div#banner: Contains logo, tagline, top menu, etc
   ********************************************************** */
#banner {
	position: relative;
	height: 78px;
	background-color: #006868;
	border-bottom: 2px solid #005050;
}
img.logo {
	position: absolute;	top: 15px; left: 14px;
	border: none;
}
p.city {
	position: absolute;	bottom: 7px; right: 20px;
	font: italic bold 16px Arial, Helvetica, sans-serif;
	color: #ECECEC;
	margin: 0px;
	padding: 0px;
}
p.tagline {
	position: absolute;	bottom: 7px; left: 14px;
	font: italic bold 16px Arial, Helvetica, sans-serif;
	color: #ECECEC;
	margin: 0px;
	padding: 0px;
}

/* **********************************************************
     table#topmenu: Navigation menu in the top-right corner
   ********************************************************** */
#topmenu {
	position: absolute;	top: 5px; right: 20px;
	text-align: center;
}
#topmenu tr {
	background-color: #B8B6BF;
	background-image: url('images/background/topmenu.jpg');
	background-position: top left;
}
#topmenu td {
	border-left: 1px solid black;
	width: 72px;
}
#topmenu a {
	font: bold 11px/17px Tahoma, Arial, Helvetica, sans-serif;
	color: #000000;
	text-decoration: none;
	display: block;
	margin: 0px;
	padding: 2px 0px 0px 0px;
}
#topmenu a.currentpg {		/* Hover and "Current Page" formatting for the button */
	background-color: #EDEDED;
	background-image: url('images/background/topmenu_current.jpg');
}
#topmenu a:hover {		/* Hover and "Current Page" formatting for the button */
	background-color: #EDEDED;
	background-image: url('images/background/topmenu_current.jpg');
}

/* **********************************************************
         div#prodmenu:  The Main Product Menu
   ********************************************************** */
#prodmenu {

	height: 62px;

	margin: 0px;

	padding: 5px 0px;
  
	background-color: /* XX was #B8B7C1; */  #DEDEE0;

}

#prodmenu ul {

	float: left;

	width: 195px;

	margin: 0px 0px 0px 8px;

	padding: 0px 0px 1px 0px;

	list-style-type: none;

	border: 1px solid gray;

	background: /* XX was #B8B7C1; */  #DEDEE0 url('images/background/prodmenu3.gif') repeat-x left top;
}

#prodmenu li {

	font: bold 11px Arial, Helvetica, sans-serif;

	height: 15px;							/* This height must be specified to reserve space for the blank menu spot (and for IE6 Layout!) */

	text-align: left;

	margin: 3px 6px; text-indent: 12px;		/* These properties indent the text a TOTAL of 18px from the left edge of <#prodmenu ul> */

	padding: 0px;

}

#prodmenu li.category {

	font: bold 11px Tahoma, Arial, Helvetica, sans-serif; /* Tahoma is used for the Product Category headings */

	background-color: black;

	color: white;

	margin: 0px 0px 7px 0px;

	padding: 1px 0px 0px 0px;

	text-indent: 20px;

}

#prodmenu a {
	color: black;
	text-decoration: none;
	display: block;
	margin: 0px;
	padding: 0px;
	border: 1px solid transparent;
}
#prodmenu a.indexpage {
	border: 1px solid gray;
	background-color: white;
}
/* The following code decreases the text-indent assigned in <li#prodmenu> by 7px (from 12px down to 5px) for the index page and current series link styles.
   This accounts for the the 7px taken up by the preceding middot and space of the affected menu title, and thus keeps the main text of that menu item aligned
   with the other menu items in that column */
#prodmenu a.indexpage, #prodmenu a.currentser {
	text-indent: 5px;				
}
#prodmenu a:hover {
	border: 1px solid gray;
	background-color: white;
}
div#content {		/* <div> surrounding all of the main page contents */

	margin: auto 35px;

}


h1, h2, h3 {	/* Page headings */

	text-align: left;

	font-weight: bold;

}

h1 {			

	font-size: 22px;

	margin-bottom: 2px;

}

h2 {
	font-size: 20px;
}
h3 {
	font-size: 16px;
}
p.subheading {		/* Sub-heading for the main <h1> page heading */
	font-size: 16px;
	font-weight: bold;
	text-align: left;
	margin-top: 2px;
	margin-bottom: 12px;
}
p.series {		/* Series name beneath the <h1> page heading */
	font-size: 16px;
	font-weight: bold;
	text-align: left;
	text-indent: 2px;
	margin-top: 2px;
}

/* **********************************************************
    div#orderinfo:  Info on ordering, shipping terms, etc
   ********************************************************** */
#orderinfo {
	width: 720px;
	margin: 35px auto;
	text-align: left;
}
p.order {
	font: bold 16px Arial, Helvetica, sans-serif;
	color: #006868;
	border-bottom: 2px solid #006868;
	margin-bottom: 10px;
}
ul.order {
	font: 14px Arial, Helvetica, sans-serif;
	list-style: none;
	padding: 0px;
	margin: 10px 5px;
}
#viewcart {		/* <div> which encloses the "View Cart" form and the related security and privacy info */
	width: 720px;
	margin: 35px auto;
	padding: 10px;
	border: 1px solid silver;
	text-align: center;
	background-color: #F9F9F9;
}
form.vc {
	margin: 0px; padding: 0px;
	background-color: #EEEEEE;
	border: 1px solid silver;
	font: bold 16px Arial, Helvetica, sans-serif;
}
p.vc1 {
	margin: 0px; padding: 0px;
}
.vc1 input {
	vertical-align: middle;
}
.vc1 img {
	vertical-align: middle;
}
p.vc2 {
	font-size: 13px;
	text-align: left;
	margin: 15px 10px 5px 10px;
}
#hq {			/* <div> Headquarters with company information */
	border-top: 1px solid gray;
	font-weight: bold;
	text-align: center;
	margin: auto;
}
#hq p {
	margin: 20px auto;
}
#hq img {
	vertical-align: middle;
	border: none;
}
p.hq1 {
	font-size: 22px;
	font-style: italic;
}
.hq2, .hq3 {
	font-size: 15px;
}
a.hq4 {
	color: black;
}

/* **********************************************************
       table#footer at the bottom of each page
   ********************************************************** */
#footer {
	width: 100%;
	height: 19px;
	padding: 0px; margin: 20px 0px 0px 0px;
	background-color: #006868;
	color: white;
	font-size: 11px; line-height: 15px;
}
.copyright {
	width: 35%;
	text-align: right;
}
.backtotop {
	text-align: center;
}
.btmlinks {
	width: 35%;
	text-align: left;
}
.flinks {		/*  The <ul> containing the bottom links */
	list-style-type: none;
	padding: 0px;
	margin: 0px;
}
.flinks li{
	float: left;
	margin: 0px;
	padding: 0px 9px;
	border-left: 1px solid white;
}
a.footerlink {
	color: white;			/* Links must be white to match footer text */
}

/* **********************************************************
         General formatting used throughout the site
   ********************************************************** */
.price {
	color: #CC3300;
}
.shaded {			/* <tr> table row shaded to distinguish products in long tables */
	background-color: #F3F3F9;
}
.separator {		/* <td> blank table cell that separates product groups (the cell spans all columns)*/
	height: 35px;
	background-color: #F7F7F7;
	background-image: url('images/background/textured.gif')
}
.purchase {			/* <form> Purchase buttons and View Cart buttons */
	margin: 0px;
	padding: 3px 0px;  /*  XXX_should I change this to 2px ??? */
}
.freeship {
	font-size: 14px;
	text-align: center;
}
.fs {
	font-weight: bold;
	color: #CC3300;
}
.ctrlink {			/* <p> links centered horizontally on the page */
	font-size: 13px;
	font-weight: bold;
	text-align: center;
}
sup {				/* Formatting for all superscripts */
	font-weight: bold;
	color: #CC3300;
}
/* ********************************************
       		Temporary...For Non-Stock Items
   ******************************************** */
p.nonstock {
	font-size: 16px;
	font-weight: bold;
	color: #CC3300;
	text-align: center;
}

/* ********************************************
       			Index Page Formatting
   ******************************************** */
table.index1 { width: 100%; }		/* Index page table used for PT sawblades, GS sawblades, and Router Shaper Bits */
table.index2 { width: 100%; }		/* Index page table used for BL Cutters, BL Router Bits and KC Cutters */
.index2 {
	margin: 20px auto;
	border: 3px solid silver;
}
.index1 {
	margin: 20px auto;
	border: 3px solid silver;
}
.index1 td {
	border: 1px solid silver;
}
.index2 td {
	border-bottom: 1px solid silver;
}
.index2 a{
	font-weight: bold;
}
.index1 a{
	font-weight: bold;
}
td.piclink {				/* Cell that contains a linked image - must be centered */
	text-align: center;
	border-left: 1px solid silver;
}
td.indexheader p {			/* Heading used on index tables */
	margin: 0px;
	padding: 6px 0px;
	text-align: center;
	font-size: 15px;
	font-weight: bold;
	color: navy;
	background-color: #EEEEEE;
}
/* ********************************************
       			General Formatting
   ******************************************** */
.clear {			/* <div> clearing div */
	float: none;
	clear: both;
	height: 0px;
	margin: -1px;
}
.atc {			/* <td> Used for "Add to Cart" table cell */
	font-size: 11px;
}
.nowrap {
	white-space: nowrap;
}
p.anchor {		/* XXX check if this is STYLED correctly, and if it's even needed */
	height: 0px;
	padding: 0px;
	margin: -1px;
}
.f11 { font-size: 11px; }
.f12 { font-size: 12px; }
.f13 { font-size: 13px; }
.f14 { font-size: 14px; }
.f15 { font-size: 15px; }
.f16 { font-size: 16px; }
.n { font-weight: normal; }
.b { font-weight: bold; }
.c { text-align: center; }
.l { text-align: left; }
.r { text-align: right; }
.m { vertical-align: middle; }
.t { vertical-align: top; }
.vs3  { margin: 3px auto; }
.vs5  { margin: 5px auto; }
.vs8  { margin: 8px auto; }
.vs10 { margin: 10px auto; }
.vs12 { margin: 12px auto; }
.vs15 { margin: 15px auto; }
.ind10 { margin: 20px 10px; }
.ind15 { margin: 20px 15px; } 
.ind20 { margin: 20px 20px; }
.ind25 { margin: 20px 25px; } 
.ind35 { margin: 20px 35px; }
.ind40 { margin: 20px 40px; } 
.ind60 { margin: 20px 60px; }
.ind80 { margin: 20px 80px; }
.ind100 { margin: 20px 100px; }

/* ********************************************
       The following code is for BL Pages
   ******************************************** */
.pagenav {
	width: 250px;
	font: bold 15px Arial, Helvetica, sans-serif;
	text-align: center;
	margin: 30px auto;
}
.pagenav a {
	font-size: 12px;
}
.pagenav a.nolink {
	color: gray;
}
table.blchart {
	width: 100%;
	margin: 20px auto;
	text-align: center;
	border: 2px solid gray;
}
td.blprodlistheader {
	background-color: #F0F0F0;
	text-align: left;
}
.blprodlistheader img {
	margin: 8px;
}
div.headertitle {
	float: left;
	width: 320px;
	margin-left: 8px;
	margin-top: 10px;
	font-size: 16px;
	font-weight: bold;

}
.desc {
	width: 320px;
	clear: both;
	float: left;
	font-weight: normal;
	margin-left: 8px;
	margin-top: 5px;
	margin-bottom: 10px;
}
ul.specs {
	width: 300px;
	clear: both;
	float: left;
	font-weight: normal;
	padding: 0px 5px 0px 25px;	/* Use padding-left instead of margin-left for the floated list */
	margin: 5px 5px 10px 0px;
}
.blchart th {
	background-color: #C8C8C8;
	border-top: 1px solid black;
	border-bottom: 1px solid black;
	font-weight: bold;
}
.blchart td {
	border-bottom: 1px solid silver;
}
p.option {			/* Paragraph for glass door cutters link, reducers link, etc. */
	margin: 6px auto;
	font-weight: normal;
}
/* ********************************************
        The following code is for KC Pages
   ******************************************** */
.headerinfo {
	font-size: 80%;
}
.kcheader {				/* <table> contains the picture and product description at the top of each page. */
	margin: 8px auto 8px 0px;
	font-size: 13px;
}
p.kh {
	margin: 0px; padding: 3px 0px;
	font-weight: bold;
	text-align: left;
}
p.kh2 {
	padding: 0px;
	margin-top: 8px;
}
ul.kh {
	padding: 0px;
	margin: 8px 5px 8px 20px;
}
table.productlist {
	margin: 30px auto;
	width: 100%;
	text-align: center;
}
.productlist th {
	border-top: 1px solid black;
	border-bottom: 1px solid black;
	background-color: #C8C8C8;
}
.productlist td {
	border-bottom: 1px solid silver;
}
.samplepic {			/* <p>'s within the table cell that contains the label and sample picture */
	padding: 0px;
	text-align: left;
}
.samplelabel {			/* <p>'s within the table cell that contains the label and sample picture */
	padding: 0px;
	text-align: left;
}
.samplelabel {
	margin: 7px auto 5px auto;
	text-indent: 12px;
	height: 0px;
}
.samplepic {
	margin: 5px auto 7px auto;
	text-indent: 10px;
}
table.bearings {	/* Table for optional Rub Bearings on KC Cutter pages */
	border: 1px solid silver;
	width: 680px;
	margin: 30px auto 30px 5px;
	text-align: center;
}
.bearings th {
	border-top: 1px solid black;
	border-bottom: 1px solid black;
	background-color: #C8C8C8;
}
td.bearingheader {	/* <td> that contains header for the table*/
	border-bottom: none;
	text-align: left;
}

/* ********************************************
        The following code is for Sawblades
   ******************************************** */
table.sawblades {
	width: 100%;
	margin: 20px auto;
	text-align: center;
}
.sawblades th {
	border-top: 1px solid black;
	border-bottom: 1px solid black;
	background-color: #C8C8C8;
}
.sawblades td {
	border-bottom: 1px solid silver;
}
.machine {			/* <p> within table cell which displays the machine type */
	margin: 2px;
	font-size: 14px;
	text-align: left;
}
.teeth {
	font-weight: bold;
	color: navy;
}
.sawblades td.footnote {
	border-bottom: none;
}
p.fn {				/* Footnote for tables */
	margin: 5px 0px 5px 12px;
	text-align: left;
	font-weight: normal;
}
/* **************************************************
    The following code is for Woodworking Machines
   ************************************************** */
.machinetitle {
	color: navy;
	margin: 8px 0px;
}
/* **********************************************
              Formatting for external code
   ********************************************** */
#neXTReMe, #eXTReMe, .statcounter, .webring {
	text-align: center;
}

.sawsale {
	color: maroon;
}
.savings {
	background-color: yellow;
}
.clickabove {
	margin-top: 10px; margin-bottom: 25px;
	padding-top: 0px;
	font-size: 15px;
	font-style: italic;
	text-align: center;
}