/*
  $Id: stylesheet.css 1739 2007-12-20 00:52:16Z hpdl $

  osCommerce, Open Source E-Commerce Solutions
  http://www.oscommerce.com

  Copyright (c) 2003 osCommerce

  Released under the GNU General Public License
*/

.errorBox { font-family : Verdana, Arial, sans-serif; font-size : 12px; background: #ffb3b5; font-weight: bold; }
.stockWarning { font-family : Verdana, Arial, sans-serif; font-size : 12px; color: #cc0033; }
.productsNotifications { background: #000000; }
.orderEdit { font-family : Verdana, Arial, sans-serif; font-size : 12px; color: #70d250; text-decoration: underline; }

/*Set body width of entire page - note will be overridden by size of tables in code etc. The background.png is the file behind everything else for larger screens */
/* To Master - PD
BODY {
  background-color:#252525;  /* origninally transparent *-/
  /* background-image:url('images/background.gif'); *-/  
  background-repeat: repeat;
/*  width: 1200px; PD-Moved to *-/
  font-size: 13px;
  font-family: Verdana, Arial, sans-serif;
  }
*/

/* Set Info Box Text Size and Type - Includes Category Listing Box etc. */
.boxText { 
	font-family: Verdana, Arial, sans-serif; 
	font-size: 11px;
}
 
 /* This sets the width for the entire site, but is overridden if you specifiy graphics that are too wide for table (like normal HTML) */
TABLE.sitewidth {  
	border-width: 0px;
	border-style: solid;
	width: 900px;
	margin: 0 auto; 
	/* background-image:url('images/backbody7.jpg'); */
	/* background-color:#707070;    */
	padding-left:15px;
	padding-right:10px; 
	background-repeat: repeat;
}


/* Wrapper that sets the position and spacing of the main graphics from the top of the page.  In other words it creates the space of the header where everything is placed. */
#headerspacing {
	position: relative;
	text-align:left;
	padding-bottom: 100px;
	border-width: 0px;
	border-style: solid;
	width: 900px;
	margin: 0 auto; 
	/* background-image:url(images/backhead6.jpg); */
	 background-repeat: no-repeat;
	/* background-color:#707070; */  
}


#footer {
	position: relative;
	text-align:center;
	padding-bottom: 100px;
	border-width: 0px;
	border-style: solid;
	width: 900px;
	margin: 0 auto; 
	/* background-image:url('images/backfooter6.jpg'); */
	background-repeat: no-repeat;
	/* background-color:#707070;  */
}

/* This allows you to set the left margin in the Products List Table, which is the main Product Top Category List  Changing the number so products in each row requires editing the modulo of the %i in boxes.php*/
TABLE.JoeProductListTable {  
	text-align: left;
	margin-left:200px;
  }

/* Typically unused but adds more left padding to each row in the product list table.*/
TR.JoeProductListTable {
 padding-left:0px;
 }

/* Typically unused but adds more left padding to each product in the product list to provide more spacing in the table.*/ 
TD.JoeProductListTable {
 padding-left:0px;
 }

/* This puts a graphic and offset behind the line in the Product Listing Table which reads something like "Displaying 1 to 1 (of 1 products) Result Pages:  1"  
 Also turns visibility off.*/
TD.numberofproductslistedbackground {
  visibility: hidden;
  padding-left:80px;
  background-image:url('');
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  }

/* Sets Logo Position */
#logoPosabs {   
	  margin: 0 auto;  
	  position:absolute;
	  margin-left:15px;
	  top:10px;	  
	  z-index:4;
	  }

/* Puts Phone Number Up for Website - Hidden */
#phonenumberPosabs {   
	  visibility: visible;  
	  color:#ffffff;
	  font-size: 12px;
	  position:absolute;
	  margin-left:220px;
	  top:7px;	  
	  text-align:left;	  
}

/* Sets position of background of nav bar if you want it to be transparent use the following code:
    filter:alpha(opacity=50);
    opacity:0.5; */
#barPosabs {
  visibility: visible;
  position:absolute;
  margin-left:480px;
  top:19px;
  z-index:0;
  }

/* Position Flyout Nav Bar */
#navPos {
	  position:absolute;
	  margin-left:210px;
	  top:60px;
	  z-index:7;
}

  
  /* Sets position of credit card logos */
  #sslPosabs {
  visibility: hidden;
  position:absolute;
  margin-left:530px;
  top:7px;
  z-index:3;
  }
  

/* Positions login icons */
#texthiUserPosabs {
	font-size: 11px;
	visibility: visible;    
	position:absolute;
	margin-left:484px;
	top:22px;	
	z-index:5; 
	}

#textlogonofficonPosabs {
	font-size: 11px;
    font-weight: bold; 
	visibility: visible;    
	position:absolute;
	margin-left:570px;
	top:22px;	
	z-index:5; 
	}

#textaccounticonPosabs {
	visibility: visible;
	position: absolute;
	font-size: 11px;
    font-weight: bold; 
	color: #000180;
	margin-left:633px;
	top:22px;	
	z-index:5;  
	}

/* Set position of Cart Icon and Cart Flyout */
#textcartflyoutPosabs {
	 font-size: 11px; 
     font-weight: bold; 
	 visibility: visible; 
	 position:absolute;
	 margin-left:710px;
	 top:22px;
	 background-color: transparent;	  
	 z-index: 8;
	}
	
#imgadminPosabs {
	 font-size: 11px; 
     font-weight: bold; 
	 visibility: visible; 
	 position:absolute;
	 margin-left:790px;
	 top:18px;
	 background-color: transparent;	  
	 z-index: 8;
	}
	
#textcheckouticonPosabs {
	visibility: visible;    
	position:absolute;
	color: #000180;
	font-size: 11px;
	margin-left:640px;
	top:22px;	
	z-index:5;  
	}

	/* Hide login, checkout, and account text instead use icons. Turn on if you want text */
#headertextPosabs {
	visibility: hidden;
	display: block;
	font-size: 10px;
	font-weight: normal;
	color: #000180;
	position:absolute;
	margin-left:0px;
	top:29px;	  
	}
	
/* Positions searchbar */
#searchbarPosabs {  
	  visibility: hidden;
	  position:absolute;
	  margin-left:640px;
	  top:5px;	  
	  background-color: transparent;
	  z-index: 5;
}

#main{
	color: #000000;
}
TD.indexmenu {
	font-family : Verdana, Arial, sans-serif;
	font-size: 24px;
	font-weight: normal;
	color: #777777;
	padding-left:0px;
	border-style:solid;
	border-left-width: 0px;
	border-top-width: 0px;
	border-bottom-width: 0px;
	border-right-width: 0px;
	border-color: #aaaaaa;
	text-align: left;
	background-color:transparent;
	vertical-align:top;
	width:250px;
}

TD.news {
	font-family : Verdana, Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	color: #ffffff;
	padding-left:2px;
	padding-right:2px;
	border-style:solid;
	border-left-width: 0px;
	border-top-width: 0px;
	border-bottom-width: 0px;
	border-right-width: 0px;
	border-color: #aaaaaa;
	text-align: left;
	background-color:transparent;
	vertical-align:top;
	width:155px;
}

TD.indexmenuright {
	font-family : Verdana, Arial, sans-serif;
	font-size: 24px;
	font-weight: normal;
	color: #777777;
	padding-left:0px;
	border-style:solid;
	border-left-width: 0px;
	border-top-width: 0px;
	border-bottom-width: 0px;
	border-right-width: 0px;
	border-color: #aaaaaa;
	text-align: left;
	background-color:transparent;
	vertical-align:top;
	width:250px;
}
TD.indexmenuchilds {
	font-size:12px; 
	padding-top:0px; 
	color:#333333;
}

/* Searchbar background and table etc */
TABLE.searchbarPosabs {   
  border: 0px;
  border-style: solid;
  border-color: #b6b7cb;
  border-spacing: 1px;
}

/* This sets the placement of the main table pages specifically the left margins - also refer to additional class below*/
TD.main, P.main {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  line-height: 1.5;
  color: #eeeeee;  /*This sets the product-info page text color. */
  padding-left:0px;
}

/* This sets the placement of the right_column.php to provide more padding*/
TD.right_column {
  font-family: Verdana, Arial, sans-serif;
  font-size: 11px;
  line-height: 1.5;
  padding-left: 5px;
}

/* Space main index .png from top and left of page, and right padding */
TD.mainpicturePosAbs {
		padding-top:  20;	
		padding-left: 20;
		padding-right: 5;
		background-color: transparent;
	}

/*Offset Catalog Image from top - when you click on the the Product List for example.  This would only be used when you turn on category pictures.  */
TD.topcatoffsetPosabs {
		padding-left:20;
		padding-top: 0;
		background-color: transparent;
	}

/* Offsets all subsequent file pages that come off the index page so you have adequate spacing from the header, logo etc. */	
TD.allfilesPosAbs {
		padding-left: 0;
		padding-top: 0;
		background: transparent;
		/* background-color: transparent; */
}	
/* Sets position of Catagory Tracking Nav */
#breadcrumbPosabs {   
	visibility: hidden;
	font-family: Verdana, Arial, sans-serif;
	font-size: 11px;
	position:absolute;
	margin-left:25px;
	top:130px;	  
	}


/* Below are Oscommerce style setting typically not modified by joe's modifications */
	
/* All unspecified links */
A:hover {
  color: #AABBDD;
}

FORM {
	display: inline;
}

TR.header {
      background-color: transparent;
}


A.headerNavigation { 
  color: #000000;   /* Color of Text */
}

A.headerNavigation:hover {
  color: #000000;
}

TR.headerError {
  background: #ff0000;
}

TD.headerError {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  background: #ff0000;
  color: #000000; 
  font-weight : bold;
  text-align : center;
}

TR.headerInfo {
  background: #00ff00;
  }

TD.headerInfo {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  background: #00ff00;
  font-weight: bold;
  text-align: center;
}

TR.footer {
  background-color: transparent;
  text-align: center;
}

TD.footer {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  background-color: transparent;
  color: #ffffff;
  font-weight: bold;
}

/* Set background colors of info boxes */
.infoBox {
  background: transparent;
  font-family: Verdana, Arial, sans-serif;
  font-size: 10px;
  color: #000000;
}

.infoBoxContents {
  background-color: transparent;
  font-family: Verdana, Arial, sans-serif;
  color: #000000;
  font-size: 10px;
}

.infoBoxNotice {
  background: #000000;
}

.infoBoxNoticeContents {
  background: #000000;
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  
}

TD.infoBoxHeading {
  font-family: Verdana, Arial, sans-serif;
  font-size: 13px;
  font-weight: bold;
  background-color: transparent;
  color: #000000;
  padding-top:4px;
  padding-bottom:3px;
}

TD.infoBox, SPAN.infoBox {
  font-family: Verdana, Arial, sans-serif;
  font-size: 10px;
  }

TR.accountHistory-odd, TR.addressBook-odd, TR.alsoPurchased-odd, TR.payment-odd, TR.productListing-odd, TR.productReviews-odd, TR.upcomingProducts-odd, TR.shippingOptions-odd {
  background: #eeeeee;
  
}

TR.accountHistory-even, TR.addressBook-even, TR.alsoPurchased-even, TR.payment-even, TR.productListing-even, TR.productReviews-even, TR.upcomingProducts-even, TR.shippingOptions-even {
  background: #f8f8f9;
  }

TABLE.productListing {
  padding-left: 100px;
  border: 1px;
  border-style: solid;
  border-color: #b6b7cb;
  border-spacing: 1px;
  color: #000000;  /*Changes font color in shopping cart */
}

.productListing-heading {
  font-family: Verdana, Arial, sans-serif;
  font-size: 11px;
  background: #b6b7cb;
  color: #000000;  /*Changes font color in shopping cart */
  font-weight: bold;
}

.productListing-footer {
  font-family: Verdana, Arial, sans-serif;
  font-size: 11px;
  background: #b6b7cb;
  color: #000000;  /*Changes font color in shopping cart */
  height:30px;
  font-weight: bold;
}

.productListing td{
  font-family: Verdana, Arial, sans-serif;
  font-size: 11px;
  color: #000000;  /*Changes font color in shopping cart */
  text-align:center;
  padding-right:5px;  
  padding-left:1px;  
  }
  
.subtotal td
{	
text-align:right;  
font-size: 12px;
}	

.productListing td span
{ display:inline;  
}

.productListing a{
  font-family: Verdana, Arial, sans-serif;
  font-size: 11px;
  color: #666666;  /*Changes font color in shopping cart */
  }
  
.productListing img{
  border:0;
  }

A.productListing-data:hover{
  font-family: Verdana, Arial, sans-serif;
  font-size: 13px;
  color: #333333;  /*Changes font color in shopping cart */
  }
  
A.pageResults {
  color: #0000ff;
}

A.pageResults:hover {
  color: #0000FF;
  background: #FFFF33;
}

TD.pageHeading, DIV.pageHeading {
  font-family: Verdana, Arial, sans-serif;
  font-size: 18px;
  font-weight: normal;
  color: #dddddd;  /* Color of Product Info Heading */
  text-align:left;
}

TR.subBar {
  background: #f4f7fd;
}

TD.subBar {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  color: #000000;
}



TD.smallText, SPAN.smallText, P.smallText {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
}

TD.accountCategory {
  font-family: Verdana, Arial, sans-serif;
  font-size: 13px;
  color: #aabbdd;
}

TD.fieldKey {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  font-weight: bold;
}

TD.fieldValue {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
}

TD.tableHeading {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  font-weight: bold;
  
}

SPAN.newItemInCart {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  color: #ff0000;
}

CHECKBOX, INPUT, RADIO, SELECT {
  font-family: Verdana, Arial, sans-serif;
  font-size: 11px;
}

TEXTAREA {
  width: 100%;
  font-family: Verdana, Arial, sans-serif;
  font-size: 11px;
}

SPAN.greetUser {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  color: #f0a480;
  font-weight: bold;
}

TABLE.formArea {
  background: #777777;
  border-color: #7b9ebd;
  border-style: solid;
  border-width: 1px;
}

TD.formAreaTitle {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  font-weight: bold;
}

SPAN.markProductOutOfStock {
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  color: #c76170;
  font-weight: bold;
}


SPAN.productSpecialPrice {
  font-family: Verdana, Arial, sans-serif;
  color: #ff0000;
}

SPAN.errorText {
  font-family: Verdana, Arial, sans-serif;
  color: #ff0000;
}

.moduleRow { }
.moduleRowOver { background-color: #ff0000; cursor: pointer; cursor: hand; }
.moduleRowSelected { background-color: #333333; }

.checkoutBarFrom, .checkoutBarTo { font-family: Verdana, Arial, sans-serif; font-size: 12px; color: #8c8c8c; }
.checkoutBarCurrent { font-family: Verdana, Arial, sans-serif; font-size: 12px; color: #000000; }

/* message box */

.messageBox { font-family: Verdana, Arial, sans-serif; font-size: 12px; }
.messageStackError, .messageStackWarning { font-family: Verdana, Arial, sans-serif; font-size: 12px; background-color: #ffb3b5; }
.messageStackSuccess { font-family: Verdana, Arial, sans-serif; font-size: 12px; background-color: #99ff00; }

/* input requirement */

.inputRequirement { font-family: Verdana, Arial, sans-serif; font-size: 12px; color: #ff0000; }

/* OTF contrib begins */
/* DDB - 041031 - Form Field Progress Bar */
.progress{
  width: 1px;
  height: 14px;
  color: white;
  font-size: 12px;
  overflow: hidden;
  background-color: navy;
  padding-left: 5px;
}
/* OTF contrib ends */

.options
{
	margin-left:25px;
	font-size:14px;  
}

.options li 
{
	margin-top:20px;
}

.options li label
{
	margin-left:8px;
}

.smalllist
{
	font-size: 9px;
	margin-left:18px;
}

.smalllist li 
{
	margin-top:0px;
}

.smalllist li label
{
	margin-left:7px;
}

.largebutton {
	font-size:9px;
	font-weight:bold;
	margin-top: 10px;
	color:white;
	text-align:center;
}

a.largebutton {
	color: white;
	font-weight: bold;
}

a:link.largebutton, a:visited.largebutton, a:active.largebutton {
	color: white; /*button text color*/
	font-weight: bold;
}

a:hover.largebutton 
{
	color: #555555;
	font-weight: bold;
}

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

a.circlebutton{
display: block;
float: left;
font: normal 20px Verdana; /* Change 12px as desired */
font-style:italic;
line-height: 32px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 23px) */
height: 28px; /* Height of button background height */
padding-left: 0px; /* Width of left menu image */
text-decoration: none;
}

a.circlebutton img
{
	border:0;
	display: inline;
	padding: 0px 5px 0px 5px;
}

a:link.circlebutton, a:visited.circlebutton, a:active.circlebutton{
color: Green; /*button text color*/
}

a.circlebutton span.Num{
background: transparent url('../images/circle.gif') no-repeat top left;
display: inline;
padding: 0px 8px 4px 6px; /*Set 9px below to match value of 'padding-left' value above*/
color:Red; 
font-weight:bold;  
}

a.circlebutton span.Txt{
padding: 0px 1px 4px 1px; /*Set 9px below to match value of 'padding-left' value above*/
color:White;         
}

a.circlebutton:hover, a.circlebutton.selected { /* Hover state CSS */
background-position: bottom left;
}

a.circlebutton:hover span.Txt
{
color: #ffff70;        
}

a.circlebutton.selected span.Txt
{
font-weight:bold;
color: #ffff70;    
}

a.circlebutton:hover span.Num, a.circlebutton.selected span.Num{ /* Hover state CSS */
background-position: bottom left;
font-weight:bold;
color: black;
}

.buttonwrapper{ /* Container you can use to surround a CSS button to clear float */
overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
width: 100%;
padding-bottom:8px; 
border-bottom: solid 1px white; 
}

.pricegrid
{
  padding: 0;
  margin: 0;
  border-collapse: collapse;
}

.pricegrid td
{
	border:solid 1px #fff;
	text-align:right;
	margin:0px;
	width:100px;
	padding-right:10px;     
}

.pricegrid th
{
	font-weight:bold;
	width:100px;
	text-align:center;     
}

.pricegrid td.col1
{
	border:0;
	font-weight:bold;  	
}

.InfoTable
{
	padding: 8px;
	font-size: 14px;
}

.InfoTable td
{
	border-bottom: 1px solid #666;
	text-align:left;
	vertical-align:top; 
	padding-right: 40px; 
}

.tbl
{
  padding: 0;
  margin: 0;
  border-collapse: collapse;
  border: 1px solid #666;
  font-size: 12px;
  color: #000;
  background: #D4D4D4 url("../images/widget-table-bg.gif") top left repeat-x;
}

.tbl td
{
  border: 1px solid #666;
  padding:5px 1px 5px 1px;
  color: #333;
  text-align:center;  
}

.tbl.info td
{
	text-align:left; 
	padding-left:5px; 
	padding-right:5px; 
}

 .tbl td a,  .tbl th a,  .tbl td a:visited
{
	color: #333;
}


.tbl .head th
{
  color: #fff;
  background-color: #3a3a3a;
  text-transform: uppercase;
  font-size: 11px;
  border-bottom: 2px solid #f00;
  border-right: 1px solid #fff;
  letter-spacing:0px;
  padding-bottom:4px;
  padding-top:2px; 
}

.tbl.info .head th
{
	text-align:left;
	letter-spacing:2px;
	padding-bottom:5px;
	padding-top:5px; 
	padding-left:5px;    
}

.tbl.info th.alt , .tbl.info th.row
{
	text-align:right;
	padding-right:4px;  
	background-color: #ccc;
	border-right: 2px solid #333;
}


.tbl th.merge
{
  border-bottom: 1px solid #fff;
}

.tbl tr.alt th, .tbl tr.alt td
{
 background-color: #ccc;
}

.tbl tr.row td
{
	background-color: #eee;
}

.tbl .foot td
{
	 color:#222;
	 background-color: #999;
	 font-size:12px;
	 font-weight:bold;
	 padding-right:5px;
	 border: 1px solid #666;    
}


.colcell{
border: solid 1px #000;
height:9px;
width:8px;
display:inline-block;
margin-right:4px;
margin-bottom:1px;
padding-left:2px; 
font-size:10px;
font-weight:bolder;   
}

.errorlbl 
{
	width:100%;
	background-color:#e23030; 
	padding:2px 0px 2px 0px;
}
	
.errorlbl span
{
	display:inline; 
	color:White;
	vertical-align:middle; 	
	background-color:Transparent;  
}

.errorlbl img
{
	display:inline;
	margin-left:5px;
	margin-right:5px;        
}

/* Context Menus */

ul.morcontextmenu {
        position:absolute;
         margin: 0;
         padding: 1px;
         list-style: none;
         width: 150px; /* Width of Menu Items */
         border: 1px solid #ccc;
        background:white;
        display:none;
         z-index:10;
}

ul.morcontextmenu li {
         position: relative;
}

ul.morcontextmenu li ul {
         position: absolute;
         left: 150px; /* Set 1px less than menu width */
         top: 0;
         display: none;
         z-index:10;
}

/* Styles for Menu Items */
ul.morcontextmenu li a {
         display: block;
         text-decoration: none;
         color: black;
         padding: 2px 5px 2px 20px;
}

ul.morcontextmenu li a:hover {
    background:#cccccc;
    color:white;
}

ul.morcontextmenu li a.parent {
    background:url('drop_down_triangle.gif') no-repeat 140px 4px; 
}
ul.morcontextmenu li a.parent:hover {
    background:#cccccc url('drop_down_triangle_hover.gif') no-repeat 140px 4px;
}

/* IE \*/
* html ul.morcontextmenu li { float: left; height: 1%; }
* html ul.morcontextmenu li a { height: 1%; }
* html ul.morcontextmenu li ul {left:147px;}
/* End */

ul.morcontextmenu li:hover ul, ul.morcontextmenu li.over ul { display: block; } /* The magic */
ul.morcontextmenu li ul{left:150px;}