/* Copyright 2007 AbrasiveStore.com */

/* Note: Max width is specified in menu, body and footer to "push" content out if window is smaller than max width px (min-width used for FF) */

* { padding:0; margin:0; } select { min-width:1.5em } p { margin:0 0 1em 0; } 
form { display:inline; }

/*SEE FORM INSTEAD 1/11/7 - form { behavior:url('/design/autocomp.htc') }*/ /* Not tested - but should turn auto-complete off in forms */
h1 { font-size:12pt; margin:0; } /* site heading */
h2,h3 {font-family:Verdana,Arial,Helvetica,sans-serif;}
h2  { font-size:12pt; margin:0; border-bottom:1px solid #E0E0E0; letter-spacing:1px; line-height:27px; } /* page headings */
h3 { font-size:11pt; margin:0; padding:0; } /* for section headings; manuf. */
h4,h5,h6 { font-size:10pt; margin:0 0 1em 0; }
.small { font-size:8pt; } a,a:link,a:visited,a:active { color:#0000DD; } a:hover { color:#a9a9a9; }
.smaller { font-size:7pt; }
body { background-image:url('/design/images/abrstore1107_09rptbk.jpg'); padding:0; margin:0; text-align:center; font-family:Arial,Helvetica,sans-serif; 
	font-size:10pt; color:black; } 
table,td { font-family:Arial,Helvetica,sans-serif; font-size:10pt; color:black; }
	
#headertop { padding:0; margin:0 auto; text-align:center; background-image:url('/design/images/abrstore07rpt_02.jpg'); 
	background-repeat :repeat-x; background-position:top; width:100%; height:159px; }

#menubar { height:44px; width:100%; text-align:center; margin:0 auto 0 auto; background-image:url('/design/images/abrstore1107_05rpt.jpg'); 
	background-repeat :repeat-x; background-position:top; }
#menuitems { height:44px; padding:0; margin:0 auto 0 auto; background-image:url('/design/images/abrstore1107_05.jpg'); 
	background-repeat :no-repeat; background-position:top; /*min-width:760px;*/ }
#menuitems #maxmenuwidth { width:920px; margin:0 auto 0 auto; text-align:center; }

#menuitems #nav {  display:block; height:20px; padding:0; margin:0; list-style-type:none; list-style-image:none; overflow:hidden; padding:4px 0;
	/* use widths of ea. menu item defined below, instead of float */ }
#menuitems li { float:left; padding:0; margin:0; border-right:1px solid #aaa; text-align:center;  height:16px; }
/* MENU widths determined by 'font width util' plus 40px */
#menuitems .one { width:73px; }     #menuitems .two { width:124px; }     #menuitems .three { width:70px; }
#menuitems .four { width:91px; }			
#menuitems .five { width:102px; border:none; }			
/* Menu spacer - # Six. Width determined by...
	(( Menu 8 is to have right padding, to balance menu 1's left pad (no longer defined; with actual width of the menu is enough padding). 
		Instead of defining padding-right, allow the total menu width to be x px shorter

	(Max width 920, use 915 for added L/R padding)
	915 minus   [menu 1 (w/pad left) + 2 + 3 + 4 + 5 + 7 + 8 = 636px] = 279
	
	After taking a screen shot in Photoshop, of both IE and FF, +1px correction may be needed to balance it (meaning #6 may need +1px)
	// BORDERS turned off on FIVE, SIX and EIGHT //
*/
#menuitems .six { width:279px; border:none; }     #menuitems .seven { width:95px; }     #menuitems .eight { width:81px; border:none; }

#menuitems .active { font-weight:bold; }
#menuitems a, #menuitems a:link, #menuitems a:visited, #menuitems a:active, #menuitems a:hover { display:block; padding:0; 
	font-size:12px; color:black; text-decoration:none; } /* Menu font size */
#menuitems a:hover { text-decoration:underline; }
/* AnyLink Drop Down Menu Styles: */
#dropmenudiv { position:absolute; /*border:1px solid #AAAAAA; border-bottom-width: 0; */font-size:12px; line-height:18px; z-index:100; text-align:left;  
	border-width: 1px 2px 2px 1px; 
	border-style:solid;
	border-color:#808080 #222222 #222222 #808080;
}
#dropmenudiv a { width: 100%; display: block; text-indent: 10px; border-bottom: 1px solid #A8A8A8; padding: 1px 0; text-decoration: none; /*font-weight: bold;*/ color:black; }
#dropmenudiv .lasta { border-bottom-width:0; } /* hide on last a in menu */
#dropmenudiv .sep { border-bottom: 3px solid #AAAAAA; }
#dropmenudiv a:hover{ /*hover background color*/ background-color: #E4E4E4; text-decoration:underline; }
/* Other styles set in JS file */
/* ## End AnyLink Styles. */

#boxback { background-image:url('/design/images/abrstore1107_08.jpg'); background-repeat :repeat-y; background-position:top;
	text-align:center; /*border:1px solid orange;*/ min-width:920px; } /* was 760px on previous site design.*/

/* Max width is 920 */
#contentbox { width:920px; margin:0 auto 0 auto; text-align:center; }  /* Spacer is used to make SURE content is at least 890 in CONTENT BTTM, FOOTER and MENU */
/* Max useable area is 920 minus L/R padding (-20) = 900 */
	/* For MFG tables, use max width of 900-10=890 (not 100%! - IE Breaks that) [for half-width/2 col tables, use 890-25 /2 = 433] */
#content {	
	padding: 0 10px 10px 10px; /* Must have padding or the * will be cut off */ 
	text-align:left;
	margin:0;
}

#content li { list-style-position: outside; list-style-type: disc; list-style-image: none; margin-bottom:2px; margin-left:3px; }
#content .decimal { list-style-position: outside; list-style-type: decimal; list-style-image: none; margin-bottom:2px; margin-left:1em; } /* force LIs to be decimals - use larger margin left */
#content ul { margin-top:0; margin-left: 1em; padding-left: 0; margin-bottom:2px; }
/* To remove spaces before ULs, while using P tags, use DIV also... e.g. <p><div><ul><li>Text</li></ul></div></p> */


/* Product/MFG pages : Max 'useable' width (w/padding already subtracted) = 900. */
/* ******************************************************************************************************** <<<< Edit to be 900 instead of 735 */
/* UL already defined above, and initial LI elements also - just add extra padding: */
/* For 2 column index pages:  ---  900 minus 25 (for border/spacing) = 875, 875/2 = 438.*/
#mfgpagecolone { width:438px;float:left; margin:0 auto 0 auto; padding:0 0 0 5px; } /* This must have padding or * will be cut off */
#mfgpagecoltwo { width:438px;float:right; margin:0 auto 0 auto; padding:0 0 0 5px; } /* This must have padding or * will be cut off  (5 padd + 5 for LIs) */
/* For 3 column index pages */
	/* --5px--DIV1:285 px--|(sp)|--DIV23:(5+285+5+285 = 580) px--|(leftover)|--
		                       --5px-DIV2:285 px--|(sp)|--5px-DIV3:285 px--|(sp)|--
	For this, take 875 from 2 col. above, subract 12 from it [25 used above, div by 2] = 863 / 3 = 285 (rounded down)
	*/
#mfgpage3colone,#mfgpage3coltwo { /*border:1px solid red;*/ float:left; width: 285px; margin:0 auto 0 auto; padding:0 0 0 5px; } /* This must have L padding; 3px shorter on R for R padding */
#mfgpage3coldiv23 { float:right; width:580px; margin:0 auto 0 auto; padding:0; } /* surrounds DIVs 2 and 3 for 3-col view */ 
#mfgpage3colthree { /*border:1px solid red;*/ float:right; width: 285px; margin:0 auto 0 auto; padding:0 0 0 5px; }

/* For 1 column index pages */
#mfgpage1col { width:895px;float:left; margin:0 auto 0 auto; padding:0 0 0 5px; } /* This must have padding or * will be cut off ---- 900 - 5. */
/* For use by all column index pages - define LIs for above mfgpage styles. */
#mfgpagecolone li, #mfgpagecoltwo li, #mfgpage3colone li,  #mfgpage3coltwo li,  #mfgpage3colthree li, #mfgpage1col li { padding-bottom:5px; }

/* 2 columned products pages (started 9Feb07) -- similar layout to mfgpagecolone/two  [for half-width/2 col tables, use table width of 350] */
.prodcolone { width:438px;float:left; margin:0 auto 0 auto; padding:0 0 0 5px; clear:left; } /* This must have padding or * will be cut off */
.prodcoltwo { width:438px;float:right; margin:0 auto 0 auto; padding:0 0 0 5px; clear:right; } /* This must have padding or * will be cut off  (5 padd + 5 for LIs) */


/* Accessory pages - use div class around UL list. */
/*.accessories { padding:0 0 0 5px; margin:0; }
.accessories ul {margin-top:0; margin-left: 1em; padding-left: 0; }
.accessories li { padding-bottom:5px; }*/
/* li defined above with mfgpagecolone/two */

#boxbottom { background-image:url('/design/images/abrstore1107_09.jpg'); background-repeat :no-repeat;background-position:top;
	text-align:center; margin:0 auto 0 auto; height:75px; font-size:9pt; color:#CBDAEF; }
#boxbottom a { color:#CBDAEF; }
#boxbottom #footers { width:890px; margin:0 auto 0 auto; text-align:center; } /* 920-30 */
#boxbottom #footer1 { float:left; margin:0 auto 0 auto; padding:14px 0 0 0; text-align:left; }
#boxbottom #footer2 { float:right; margin:0 auto 0 auto; padding:14px 0 0 0; text-align:right; }
.clearfloats { clear:both; height:10px; }
hr { border:0px; height:1px; color:#555; background-color:#555; clear:both; } /* specify bkgrnd&color the same for FF and IE compat. */
/* Search Box */
#searchbox { position:absolute; width: 310px; margin:5px; padding: 0; display:none; } 
#searchtop {background-image:url('/design/images/abrstr_srchbx1.gif'); background-repeat:repeat-y; width:310px; }
#searchbttm {background-image:url('/design/images/abrstr_srchbx2.gif');background-repeat:no-repeat;width:310px;height:13px;}
/* Qty Update Box */
#qtyupdate { position:absolute; width: 180px; margin:5px; padding: 0; display:none; } 
#qtyupdatetop {background-image:url('/design/images/abrstr_qtybx1.gif'); background-repeat:repeat-y; width:180px; border-top:1px solid #757575;}
#qtyupdatebttm {background-image:url('/design/images/abrstr_qtybx2.gif');background-repeat:no-repeat;width:180px;height:7px;}


.phalfspace { margin:0 0 .5em 0; }

/* NOTE: if anything is changed here, be sure it doesn't break any 'customized' tables - search for mfginfoTable in-use */


/*.mfginfoTable { border-width: 1px 2px 2px 1px; border-spacing: 2px; border-style: solid / *outset* /; border-color: #808080 #000 #000 #808080; border-collapse: collapse; }
.mfginfoTable TD { border-width: 1px; padding:3px; text-align:center; border-style: inset; border-color: #808080; border-collapse: collapse; }
.mfginfoTable TH { border-width: 1px; padding:3px; text-align:center; border-style: inset; border-color: #808080; border-collapse: collapse; background-color:#CCCCCC; }
*/

/* The above styles were causing problems in FF. Sometimes the boarders weren't showing inside the TDs. This alternate layout
seems to be working so far (16-Feb-07). [The bug didn't start showing until around p209, where I was using multiple rowspans(?)]. */
.maxTableWidth { width: 890px; } /* 1 col  -----  900 minus 10 [for padding/borders] --- also see cart below; 17-Nov-07 */
.tableHalfWidth { width: 433px; } /* 2 cols  -----  433px [prodcols and mfgpagecols are 438px - 5px    (890-24 (spacing) = 866 / 2)  ]. */
.tableGTHalf { width: 550px; } /* use with tables next to images - slightly bigger than half width. */
.tableThirdWidth { width: 285px; } /* 3 cols  -----  (890-24 (spacing) = 866 / 3 = 288.67; using 285)   ]. */
.tableQtrWidth { width: 205px; } /* 2cols in 2 cols (4 cols)  -----  ~ Half/2 (minus some for spacing) */
.table3QtrWidth { width:700px; } /* 3/4 of page width ~ 700. */
.mfginfoTable { 
	border-width: 0 2px 2px 0; 
	border-spacing: 0px; 
	border-style: solid; border-color: #000; 
}
.mfginfoTable TD { 
	padding:3px;
	border-width:1px 0 0 1px;
	border-spacing:2px;
	border-style:solid;
	border-color:#808080;
	text-align:center; 
}
.mfginfoTable TH { 
	padding:1px;
	border-width:1px 0 0 1px;
	border-style:solid;
	border-color:#808080;
	text-align:center; background-color:#CCCCCC; 
}



.mfginfoTable .tdasheader { background-color:#CCCCCC; } /* used on custom table where TDs are to show as THs do (bkcolor,etc) */
.mfginfoTable .trwithhdrbckcolor { background-color:#CCCCCC; } /* used on custom table where TRs rows that are background color */
.mfginfoTable .tdashdrnobrdr { border:none !important; background-color:#CCCCCC; } /* used on custom table where TDs are to show as THs do (bkcolor,etc) */
.mfginfoTable table td { border:none; } /* table inside of table */
/* .sectionbreak { padding:1px 0 0 0;} */


#mfgcartbox, #shippingbox { position:absolute; width: 310px; margin:5px; padding: 0; display:none; } 
#mfgcartboxtop, #shippingboxtop {background-image:url('/design/images/abrstr_cartbx1.gif'); background-repeat:repeat-y; width:310px; border-top:1px solid #757575;}
#mfgcartboxbttm, #shippingboxbttm {background-image:url('/design/images/abrstr_cartbx2.gif');background-repeat:no-repeat;width:310px;height:7px;}
.mfgon { font-weight:bold !important;  }
.cartTable { width:800px; border-width: 1px 2px 2px 1px; border-spacing: 2px; border-style: solid /*outset*/; border-color: #808080 #000 #000 #808080; border-collapse: collapse; }
.cartTable TD { border-width: 1px; padding:2px; border-style: inset; border-color: #808080; border-collapse: collapse; font-size: 10pt; }
.cartTable TD .small { font-size:8pt;  }
.cartTable TH { border-width: 1px; padding:2px 0 2px 0; border-style: inset; border-color: #808080; border-collapse: collapse; background-color:#CCCCCC; }
.cartsmprint { font-size:8pt; color:#888888; }
.cartalert { background-color: #FFFFCC; border: 1px solid #808080; padding:8px; }
.cartalerterr { background-color: #cc0033; border: 1px solid #808080; padding:8px; color:white; }
/* shipTable is declared on shipping page itself, since it is also used for QTY popup */

/* Search headers */
.searchbytext { padding-bottom:3px;border:1px solid #696969;padding:2px; }
.searchbypartL { /* left */ padding-bottom:3px;	border-width:1px 0 1px 1px;	border-color:#696969; border-style:solid; padding:2px; }
.searchbypartM { /* middle */ padding-bottom:3px;	border-width:1px 0 1px 0;	border-color:#696969; border-style:solid; padding:2px; }
.searchbypartR { /* right */ padding-bottom:3px;	border-width:1px 1px 1px 0;	border-color:#696969; border-style:solid; padding:2px; }

/* Home Page MFG Grid */
#hpmfggrid img { margin-bottom:10px; border:1px solid #BEBEBE; }

/* Monroe Mfg only */
.monroeconc td { text-align:center; padding:0 10px 0 10px; }
.monroeconc .nopadd { padding: 0 !important;}
.monroeconc .ul { text-align:left; padding:0 5px 0 0; }


.checkouttable { width: 370px; background-color:#F0F0F0; border-width: 1px 2px 2px 1px; border-spacing: 2px; border-style: solid /*outset*/; border-color: #808080 #000 #000 #808080; border-collapse: collapse; }
.checkouttable TH { border-width: 1px; padding:2px 0 2px 0; border-style: inset; border-color: #808080; border-collapse: collapse; background-color:#CCCCCC; text-align:left; font-weight:bold; padding:3px;}

.checkouttableWide { width: 750px; background-color:#F0F0F0; border-width: 1px 2px 2px 1px; border-spacing: 2px; border-style: solid /*outset*/; border-color: #808080 #000 #000 #808080; border-collapse: collapse; }
.checkouttableWide TH { border-width: 1px; padding:2px 0 2px 0; border-style: inset; border-color: #808080; border-collapse: collapse; background-color:#CCCCCC; text-align:left; font-weight:bold; padding:3px;}
.checkouttableWide td { padding:3px; vertical-align:top;}

.checkouttable input .widthone { width:125px; }
.checkouttable td { padding:3px; vertical-align:top;}
.checkouttable .col1td { width:140px; }
.checkouttable .col2td { width:230px; }
.checkouttable .inputwidth { width:217px; } /* for input fields */
.checkouttable .inputwidthtxa { width:350px; height:80px; } /* for textarea field */
.checkouttable .widthzip { width:100px; } 
.checkouttable .phonesm { width:40px; } 
.checkouttable .phonemid { width:75px; }
.checkouttable .cccodewidth { width:75px; } 
.req { color:red; } /* mark required fields */