/*------------------------------------------------------------------
[Table of contents]


0. Imports
1. HTML Basics
2. Layout
3. Header
4. Navigation
5. Tabs: Item Detail
6. Buttons
7. Tables
8. Forms
9. Lists
10. Boxes
11. Class Styles
12. Alignment
13. Padding & Margins
14. Conversion Classes
15. Print 
-------------------------------------------------------------------*/
/*[0. Imports] ------------------------------------------------------------------*/
 
/*[1. HTML Basics] ------------------------------------------------------------------*/
html { background: #CBCEDD; }
body { font: 12px Arial, sans-serif; height: 100%; margin:0; padding:0; min-width: 800px; }
a { color: #339; }
	a.tooltip { text-decoration: underline; }
	a:hover { color: #c00 !important; }
	a:visited { color: #600; }
a[disabled] { color: #a7a6aa !important; }
h1, h2 { padding:3px 0 0 0; }
h1 { font-size: 1.12em; }
h2 { font-size: 1.09em; }

/*[2. Layout] ------------------------------------------------------------------*/
#wrap { background: #fff; border-left: 1px solid #999; border-right: 1px solid #999; margin:0 auto; width: 800px; }
#printheader { display: none }
#header { margin:0; padding: 5px 11px 8px 0; line-height: 2.8em; text-align: right; background: #000; color: #fff; font-size: .85em;}
	#header a { color: #fff; font-weight: bold; }
	#header img { float: left; padding:0 0 5px 15px; }
	    #header img, #printheader img { border: none; }
	#header ul { margin:0; padding:0; }
        #header ul li { list-style: none; display: inline; }
#footer { background: #000; clear: both; color: #fff; font-size: .9em; margin:0; padding: 5px 0 10px 0; text-align: center;}
	#footer a { color: #fff; }
	#footer img.a { float: right; padding:3px 5px 0 0 ; }
	#footer img.b { float: left; padding:3px 0 0 5px; }
	#footer ul, #footer p { margin:0; padding:3px; }
	#footer ul li { list-style: none; display: inline; }
#content, #main { float: right; margin:0; padding:0; width: 619px; /* width: 603px */ }
    #content h5 { color: #309; }
    #content a.activetab { color: #000; font-weight: bold; text-decoration: none; }
#sidebar {  background-color: #313C79; clear: both; float: left; margin:0; padding:0; width: 180px;}
    #sidebar img { padding:10px 0 0 0; }



/* Any Changes to this need to be made in AjaxCallObject.js IE6 ignores this style sheet so had to do it manually in script. */
#__AjaxCall_Wait { background: #696969; border: 3px solid #000; color: #fff; font: bold 16px Arial, Verdana, Tahoma;height: 30px; padding-top: 15px; position: absolute; text-align: center; visibility: hidden; width: 225px; z-index: 100; }

.panel { padding:0; width: 100%; }
/*[3. TextBoxWaterMark] ------------------------------------------------------------------*/	
#header input[type=text],#footer input[type=text]  { width: 190px; padding: 2px; font-size: 1em;}
.waterBox { color: #555;}
    
   


/*[4. Navigation] ------------------------------------------------------------------*/
#topnav {overflow: hidden; width: 100%; background: #313C79 url(/ImagesCSS/menuTabBackground.png) repeat-x; font-size: .88em; line-height: normal;  margin:0; padding:0;  }
	#topnav ul { list-style: none; margin: 0; padding: 0; }
	#topnav li { background: url(/ImagesCSS/MenuTab2_r1_c1.gif) no-repeat left top;list-style: none;  float: left; margin: 0; padding: 0 0 0 9px; }
	#topnav a { background: url(/ImagesCSS/MenuTab2_r1_c2.gif) no-repeat right top; color: #fff; display: block; font-weight: bold; padding: 3px 10px 4px 3px; text-decoration: none; }
		#topnav a:hover { color: black; }
	#topnav .current a { background-image: url(/ImagesCSS/MenuTab_Selected_r1_c2.jpg); color: black; }
		#topnav .current a:hover { color: black; }
	#topnav .current { background-image: url(/ImagesCSS/MenuTab_Selected_r1_c1.jpg); }
	#topnav .disabled a { color: #999; }
		#topnav .disabled a:hover { color: #999; }
					
#listmenu { color: #fff; font-weight: bold; padding:0; }
#listmenucontainer { font-size: .90em; width: 100%; }
#listmenucontainer, #listmenulist, #listmenulist li { margin:0; padding:0; }
#listmenulist { list-style: none; width: 100%; }
    #listmenulist li a { background: #eee; border: 1px outset #eee; color: #666; display: block; padding:0 0 0 2px; text-decoration: none; width: 98%; line-height: 1.6em;}
	    #listmenulist a.active, #listmenulist li a:hover, #listmenulist li a:hover span { background: #800000; color: #fff !important; }
	    .listmenutitle {font-size: 1.1em; text-transform:uppercase; margin:0; padding:0 0 0 3px; background:#000; }
/*[5. Tabs: Item Detail] ------------------------------------------------------------------*/		
#ItemDetailTabs { border-bottom: 1px solid #ccc; float: left; font-size: .88em; line-height: normal; width: 99%; }
	#ItemDetailTabs ul { list-style: none; margin:0; padding:0; text-align: center; }
	#ItemDetailTabs li { background: url(/ImagesCSS/ItemDetailTabs_r1_c1.gif) no-repeat left top; float: left; margin:0; padding:0 0 0 9px; }
	#ItemDetailTabs a { background: url(/ImagesCSS/ItemDetailTabs_r1_c2.gif) no-repeat right top; color: #37468C; display: block; font-weight: bold; padding: 5px 7px 3px 1px; text-decoration: none; }
		#ItemDetailTabs a:hover { color: #000; }
	#ItemDetailTabs .current { background-image: url(/ImagesCSS/ItemDetailTabsCurrent_r1_c1.gif); }
		#ItemDetailTabs .current a { background-image: url(/ImagesCSS/ItemDetailTabsCurrent_r1_c2.gif); color: #fff; }

/*[6. Buttons] ------------------------------------------------------------------*/	

.input-button, .input-buttonquote, .input-buttonDelete { height: 20px; border: 1px outset #ccc; color: #000; font-size: .9em; }
.input-button { background: #eaeaea; }
.input-buttonquote { background: #E9EDF8; }
.input-buttonDelete { background: #900; color: #fff; font: bold .6em; }
#input-buttonCheckout { padding:10px 0 10px 600px; }
.input-dropdown { color: #333; }
#link a { float: left; height: 40px; left: 0; text-align: left; top: 0; width: 130px; z-index: 10; }
#link i, #hidden i, .background-tab { display: none; }

.menubutton { background: #C4C4D7; font-weight: bold; padding:5px; text-align: center; }

a.btn, button.btn, input.btn { cursor:pointer; font-size:12px; font-weight:700; margin:0 7px 0 0; padding:6px; text-decoration:none; text-shadow:0 1px 1px rgba(100,100,100,0.25); }
button.btn img, .btn img { border:0; padding-right:3px; vertical-align:middle; }
.btn { border: 1px solid #1c2049; white-space:nowrap; text-decoration: none; background-color: #313c79; color: #eee; background-image: -moz-linear-gradient(#4657b2, #2d3975 10%, #242d5d); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #4657b2),color-stop(.10, #2d3975),color-stop(1, #242d5d)); -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5); -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5); box-shadow: 0 1px 3px rgba(0,0,0,0.5); -moz-border-radius: 4px; border-radius: 4px; }
.btn:hover, .btn.active { color: #fff; background: #495ab5; background-image: -moz-linear-gradient(#242d5d, #293369 1%, #3c4b9a 10%, #3c4b9a); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #242d5d),color-stop(.01, #293369),color-stop(.10, #3c4b9a),color-stop(1, #3c4b9a)); }
.btn:link { color: #eee; }
a.btn:visited {color:#eee;}
.btn.close:hover { background: #fbe3e4; border: 1px solid #fbc2c4; color: #d12f19; }
.btn.cancel { background: #c00; color: #fff; background-image: -moz-linear-gradient(#f33, #c00 10%, #c40202); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #f33),color-stop(.10, #c00),color-stop(1, #c40202)); border: 1px solid #c40202; }
.btn.cancel:hover { background: #f33; color: #fff; background-image: -moz-linear-gradient(#c40202, #c00 1%, #e03434 10%, #e03434); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #c40202),color-stop(.01, #c00),color-stop(.10, #de2525),color-stop(1, #de2525)); border: 1px solid #c40202; }
.btn.save, .btn.cart { background: #080; color: #fff; border: 1px solid #007400; background-image: -moz-linear-gradient(#0d0, #0b0 10%, #080); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #0d0),color-stop(.10, #0b0),color-stop(1, #080)); }
.btn.save:hover, .btn.cart:hover { background: #0b0; background-image: -moz-linear-gradient(#070, #080 1%, #0a0 10%, #0b0); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #070),color-stop(.01, #080),color-stop(.10, #0a0),color-stop(1, #0b0)); }
.btn.quote { background: #008; color: #fff; border: 1px solid #007400; background-image: -moz-linear-gradient(#0d0, #0b0 10%, #dcdcdc); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #dcdcdc),color-stop(.10, #0b0),color-stop(1, #080)); }
.btn.option { background: #dcdcdc; color: #555; border: 1px solid #bbb; background-image: -moz-linear-gradient(#ededed, #dcdcdc 10%, #c3c3c3); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #ededed),color-stop(.10, #dcdcdc),color-stop(1, #c3c3c3)); }
.btn.option:hover { background: #eee; background-image: -moz-linear-gradient(#cbcbcb, #dcdcdc 1%, #ededed 10%, #dcdcdc); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #cbcbcb),color-stop(.01, #dcdcdc),color-stop(.10, #ededed),color-stop(1, #dcdcdc)); }
a.btn.option:visited {color:#555;}
.btn.option.active, .btn.option.current { color:#414e95; background:#D4D4D4; background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#D4D4D4), to(#F5F5F5)); background-image:-moz-linear-gradient(top, #D4D4D4, #F5F5F5); }
.btn.disabled, .btn[disabled], .btn[disabled]:hover  { background:#636363 !important; border:1px solid #525252 !important; color:#c0c0c0 !important; cursor:text !important; }
.btn.spacer { margin-right:40px; }
.btn.small { padding:2px 4px; font-size:11px; }
.btn.medium { padding:3px 8px; font-size:12px; }

/*[7. Tables] ------------------------------------------------------------------*/
.dataTable { background: #E8EAEA; }
.dataTableEven { background: #fff; font-weight: bold }
.dataTableOdd { background:#eee; font-weight: bold }

#results { font-size: .9em; }
	#results tr.odd td { background: #eee; vertical-align: top; }
	#results tr.even td { background: #fff; vertical-align: top; }
	#results tr:hover td { background: #CBCEDD; }
	#results .tableheader, table .tablefooter { background: #999EBD; color: #fff; font-weight: bold; }
	#results .tableheader:hover td, table tr.tablefooter:hover td { background: #999EBD !important; }
#invoiceheader th { background: #F5F5F5; }


#cartTable { border: 1px solid #000; margin: 0 20px 0 18px; width: 745px; }
	#cartTable .tableheader, #cartTable .tablefooter { background: #369; color: #fff; font-weight: bold; }
	#cartTable .subtotal { border-top: 1px solid #000; }
	#cartTable .odd { background: #E2ECF5 }
	#cartTable .even { background: #fff; }
	
#Location { float: left; margin: 5px 0 0 4px; width: 475px; }
	#Location table .header { background: #E4EAFC; }
	#Location table .header, #Location table .additional { border: 1px solid #000; padding:2px 0 0 5px; }
#locationsearch { background: #E8EAEA; padding:10px; width: 400px; margin:0 auto;}

#TableFormat td.border { border-bottom: 1px solid #ccc }
	
/*[8. Forms] ------------------------------------------------------------------*/
.inactiveform { color: #999; }
.activeform { color: #000; }

fieldset { border: 1px solid #ccc; margin-left: 45px; padding-left: 10px; width: 75%; }
legend { color: #313c79; font-size: 1em; font-weight: bold; height: 15px; line-height: 15px; margin: 0 0 5px 10px; padding:0 5px; }

/*[9. Lists] ------------------------------------------------------------------*/
dl.productlist { font-size: .98em; line-height: 1.8em; list-style: none; margin: 5px 40px 0 10px; padding-left: 0; width: 236px; }
	dl.productlist dd { background-position: 0 50%; background-repeat: no-repeat; margin-left: 8px; padding-left: 15px; }

#State { border: 1px solid #ccc; float: left; line-height: 1.8em; margin: 5px 3px 0 3px; width: 100px; }
	#State dl, #State dd { margin:0; padding:0; }
	#State dt, #State dd { padding-left:4px; }

.hiddenmenu { background: #F0F0F0; border: 1px solid #ccc; left: 0; margin: 10px; position: absolute; top: 0; visibility: hidden; width: 200px; }
	.hiddenmenu, .hiddenmenu dt { padding:5px; }
.hiddenmenudrop { cursor: hand; cursor: pointer; display: block; margin:0; padding:0; text-align: right;}
.hiddenmenudrop span { text-align: left; float: left; }

li.agreement { line-height: 1.5em; padding:0 0 10px 0; }

.listBread { margin:0; padding:15px 0 5px 20px; font-weight: bold; }
    .listBread li { display: inline; list-style:none; }

.listZero { margin:0; padding:0; }
    .listZero li { list-style: none; }
    
.cusList { margin:0; padding:0; list-style: none; }    

.listCopy { margin:4px 0 0 85px; padding:0; }
    .listCopy li { list-style:none; margin-bottom: 5px; }
            
/*[10. Boxes] ------------------------------------------------------------------*/
.input-box { background: #fff; border: 1px solid #B7A78E; }

#boxA, #boxB, #boxC { float: left; padding:0;}
#boxA { margin: 3px 0 0 2px; text-align: center; width: 200px; }
#boxB { height: 200px; margin: 10px 0 0 5px; width: 210px; }
#boxC { margin: 15px 2px 0 2px; width: 155px; }

#scrollhead, #scrolldata, #scrollfoot { border: 1px solid #000; overflow: auto; margin:0; padding:3px 8px 5px 3px; position: relative; width: 99%;  }
#scrollhead { background: #E8EAEA; border-bottom: none; z-index: 3; }
#scrolldata { height: 240px; padding:0 0 0 5px; visibility: visible; width: 100%; z-index: 2; }
#scrollfoot { background: #eee; border-top: none; font-weight: bold; text-align: right; z-index: 4; }

#productcontainer { padding:0 30px 0 0; }
.Notepadbox, .searchbox, .orderbox { background: #F0F0F0; border: 1px solid #ccc; padding:5px; }
.searchbox { margin: 10px 0 0 10px; }
.orderbox { margin-left: 0; margin-top: 0; }
.sideorder { font-size: .9em; line-height: 1.19em; margin:0; }

#SearchHowBox { border-bottom: 1px solid #ccc; height: 100%; line-height: normal; width: 99%; }
	#SearchHowBox span { font-weight: bold; }
	#SearchHowBox ul { height: 100%; list-style: none; margin:0; padding:0; text-align: center; }

#SearchHowBox li { float: left; height: 100%; margin:0; padding:0 1px 0 1px; }
	#SearchHowBox a { display: inline; font-weight: bold; }
		#SearchHowBox a:hover { color: #000; }

#order { background-image: url(/ImagesPrograms/orderback.jpg); background-repeat: repeat-x; border: 1px solid #999; margin: 5px 3px 0 7px; padding:2px 2px 0 2px; }
#orderinput input { border: 1px solid #C0C0C0; font-size: .89em; }

#address, #CartLogin { background: #E2ECF5; border: 1px solid #999; padding:10px;}
#address { margin: 0 20px; width: 720px; }
#CartLogin { margin: 20px 0 20px 80px; padding-right:0; width: 600px; }
#wizard { font-size: 1.1em; font-weight: bold; margin:0 10px; padding: 5px 0 5px 5px; text-align: left; }

#customer { font-size: .92em; padding:10px 0 10px 5px;}
	#customer, #customer a { color: #fff; margin:0; width: 95%; }
	
/*[11. Class Styles] ------------------------------------------------------------------*/
.hLists { margin-bottom:5px; font-size: 1em; }
.textLeft { text-align: left; }
.textRight { text-align: right; }
.textCenter { text-align: center; }


.textSmall, .smallFont { font-size: .85em; }
.textMedium, .mediumFont { font-size: .95em; }
.textLarge, .largeFont { font-size: 1.1em; }

.textCaps { text-transform: uppercase; }
.textItalic { font-style: italic;}
.textOblique { font-style: oblique; }
.textNormal { font-style:normal; font-weight: normal; }
.textUnderline { text-decoration: underline; }
.textBold, .unread, .read, .smallred, .date, .requiredfield, .note, .title, .brownsubtitle, .instructions, .PartNumber, .CreditMessage, .ErrorMessage { font-weight: bold; }

.account { color: #5C4E3A; font-size: 1em; line-height: 1.3em; padding: 4px 0 4px 8px; }
.unread { background: #fff; color: #1E1E59; }
.read { background: #eee; color: #000;  }
.small { font-size: 85% }
.smallred { color: #c00; font-size: .85em; }
.smallhint { color: #360; font-size: .85em; }
.date { color: #6F2424; font-size: .98em;  padding: 5px 3px 3px 3px; text-align: center; }
.event { color: #666; cursor: pointer; font-size: .92em; line-height: 1.2em; padding:2px 3px 0 15px; text-align: center; text-decoration: underline; }
.requiredfield { color: #900; }
.note { color: #008000; font-size: .90em;  }
.title { color: #009; font-size: 1.25em; padding: 5px 0 0 0; }
.brownsubtitle { color: #960; font-size: 1.12em;  }
.double { border-bottom: 3px double #060; color: #060; line-height: .9em; }
.nonstock { color: #c00; }
.BigBassClassic { color: #36c;}
.tName { color: #009; font-style: oblique; }

.currentstore { border-bottom: 1px solid #ccc; font-size: .9em; padding: 4px 0 4px 10px; width: 585px; clear: both;}
.instructions, .PartNumber { color: #3A3AAF; }
.PartNumber { font-size: 1.2em;  padding:10px 0 0 0; }
.CreditMessage { background: #fc6; color: #000; padding:0 0 0 6px; }
.ErrorMessage { background: #930; color: #fff;  padding:0 0 0 10px; }

/*[12. Alignment] ------------------------------------------------------------------*/  
.left { float: left; }
.right { float: right; }
.center { margin: 0 auto; display: block; }

.vTop { vertical-align: top; }
.vMiddle { vertical-align: middle; }
.vBottom { vertical-align: bottom; }

.dInline { display:inline; }
.dBlock { display:block; }
.dInlineBlock { display:inline-block; }
.dNone { display:none; }

.invisible { display: none; }
.visible { display: inline; }

/*[13. Padding & Margins] ------------------------------------------------------------------*/  
.padTop0 { padding-top: 0; }
.padTop5 { padding-top: 5px; }
.padTop10 { padding-top: 10px; }
.padTop15 { padding-top: 15px; }
.padTop20 { padding-top: 20px; }

.padRight0 { padding-right: 0; }
.padRight5 { padding-right: 5px; }
.padRight10 { padding-right: 10px; }
.padRight15 { padding-right: 15px; }
.padRight20 { padding-right: 20px; }

.padBottom0 { padding-bottom: 0; }
.padBottom5 { padding-bottom: 5px; }
.padBottom10 { padding-bottom: 10px; }
.padBottom15 { padding-bottom: 15px; }
.padBottom20 { padding-bottom: 20px; }

.padLeft0 { padding-left: 0; }
.padLeft5 { padding-left: 5px; }
.padLeft10 { padding-left: 10px; }
.padLeft15 { padding-left: 15px; }
.padLeft20 { padding-left: 20px; }

.pad0, .padZero { padding: 0; }
.pad5 { padding:5px; }
.pad10 { padding:10px; }
.pad15 { padding:15px; }
.pad20 { padding:20px; }

.margTop0 { margin-top: 0; }
.margTop5 { margin-top: 5px; }
.margTop10 { margin-top: 10px; }
.margTop15 { margin-top: 15px; }
.margTop20 { margin-top: 20px; }

.margRight0 { margin-right: 0; }
.margRight5 { margin-right: 5px; }
.margRight10 { margin-right: 10px; }
.margRight15 { margin-right: 15px; }
.margRight20 { margin-right: 20px; }

.margBottom0 { margin-bottom: 0; }
.margBottom5 { margin-bottom: 5px; }
.margBottom10 { margin-bottom: 10px; }
.margBottom15 { margin-bottom: 15px; }
.margBottom20 { margin-bottom: 20px; }

.margLeft0 { margin-left: 0; }
.margLeft5 { margin-left: 5px; }
.margLeft10 { margin-left: 10px; }
.margLeft15 { margin-left: 15px; }
.margLeft20 { margin-left: 20px; }

.marg0, .margZero { margin: 0; }
.marg5 { margin:5px; }
.marg10 {margin:10px; }
.marg15 { margin:15px; }
.marg20 { margin:20px; }



/*[14. Conversion Classes] ------------------------------------------------------------------*/
/* replaces p7_eqCols2_10.js */
.contentWrapper { clear: both; overflow: hidden; padding: 0 0 100px 0; margin:0; background:#fff url(/Images/bg/bg.png) repeat-y;}		
.contentWrapper #main { margin:0 0 0 180px; }
.contentWrapper #main, .contentWrapper #content { float: none; width: auto;}
.contentWrapper #sidebar { background: #313C79; margin:0; padding:0; float: left; width: 180px; clear: none; }
/*.contentWrapper #main, .contentWrapper #sidebar { padding-bottom: 32767px; margin-bottom: -32767px; }*/
.contentPadBottom { padding-bottom:30px; }
.contentPadding { padding:10px; }
.colFloat { overflow: hidden; }

.contentWrapper .currentstore { clear: none; }

/*[15. Print] ------------------------------------------------------------------*/
@media print {
    body { background: #fff; width: 100%; }
    #wrap { border: none; width: 100%; }
    #content { width: 100%; }
    #scrollhead , #scrolldata, #scrollfoot { border: 1px solid #000; margin:0; overflow: auto;  padding:3px 8px 5px 3px; position: relative; width: 99%;}
    #scrollhead { background: #E8EAEA; border-bottom: none; z-index: 3; }
    #scrolldata { height: auto; overflow: visible; padding:0 0 0 5px;  visibility: visible; width: 100%; z-index: 2; }
    #scrollfoot { background: #eee; border-top: none; font-weight: bold; text-align: right;  z-index: 4; }
    a { text-decoration: underline; }
    #sidebar, #header, #footer, #panCurStore, #topnav, #__AjaxCall_Wait, #wizard { display: none }
    #main, .contentWrapper #main  { margin:0;}
    #content { border-left:none; float: none; margin:0; width: 700px; }
    #address { background: #fff; border: 1px solid #999; margin:0 20px; padding:0 10px; width: 610px; }
    #results { width: 670px; }
    #items { border-top: none; width: 590px; }
    #cartTable { width: 630px; }
	    #cartTable .tableheader { background: #fff; border-bottom: 4px solid #000; border-top: none; color: #000; font-weight: bold; }
    #printheader { display: inline; }
}
