/* basic screen layout */

html, body{ 
 margin:0; 
 padding:0; 
 text-align:center; 
} 
 
#pagewidth{ 
 width:100%; 
 max-width:900px;
 width:expression(document.body.clientWidth > 900? "900px": "auto" );
 text-align:left;  
 margin-left:auto; 
 margin-right:auto;  
} 
 
#header{
 position:relative; 
 text-align:center;
 background-color:#FFFFFF; 
 width:100%;
 margin-top:20px;
 margin-bottom:20px;
} 
 
#menu{
 width:195px; 
 float:left;
 position: absolute;
 text-align:left;
}
 
#maincol{background-color: #FFFFFF;  
 float: right; 
 display:inline; 
 position: relative;
 min-height:400px; 
 _height: 400px;
 width:75%;
 }
 
#footer{
 height:10px; 
 background-color:#FFFFFF; 
 clear:both;
 position: relative;
 border-top: 1px #ccc solid;
 color: #bbb;
 } 
 
/* font declaration */

h1,h2,h3,h4,body,td,label,select, input, textarea { 
    font-family: "Trebuchet MS", Verdana, Geneva, Arial, Helvetica, sans-serif; 
}

body { 
    font-size: 0.9em; 
}

h1 {font-size: 1.2em; font-weight:bold; color: #336699; margin:0.2em 0 0.5em 0; border-bottom: 1px #ccc solid;}
h2 {font-size: 1.0em; font-weight:bold; color: #336699; margin:0.2em 0 0.5em 0;}

/* link definition */

a { color: #900; text-decoration:none;}
a:hover {background-color: #fee; text-decoration:underline;}

/* specialized classes */

.image_descripton {font-size: 0.9em;}
.price { white-space: nowrap; }
.tons { white-space: nowrap; }
.required {font-weight:bold; }

input.submit {
	background: #FFB642;
    color: black;
}

/* Autocomplete */

  div.auto_complete {
    width: 350px;
    background: #fff;
  }
  div.auto_complete ul {
    border:1px solid #888;
    margin:0;
    padding:0;
    width:100%;
    list-style-type:none;
  }
  div.auto_complete ul li {
    margin:0;
    padding:3px;
    font-size: 0.8em;
  }
  div.auto_complete ul li.selected { 
    background-color: #ffb; 
    font-size: 0.8em;
  }
  div.auto_complete ul strong.highlight { 
    color: #800; 
    margin:0;
    padding:0;
    font-size: 0.8em;
  }

/* The error box */

.fieldWithErrors {
  padding: 2px;
  background-color: red;
  display: table;
}

#errorExplanation {
  width: 400px;
  border: 2px solid red;
  padding: 7px;
  padding-bottom: 12px;
  margin-bottom: 20px;
  background-color: #f0f0f0;
}

#errorExplanation h2 {
  text-align: left;
  font-weight: bold;
  padding: 5px 5px 5px 15px;
  font-size: 12px;
  margin: -7px;
  background-color: #c00;
  color: #fff;
}

#errorExplanation p {
  color: #333;
  margin-bottom: 0;
  padding: 5px;
}

#errorExplanation ul li {
  font-size: 12px;
  list-style: square;
}

/* notice */
#notice {
  border: 2px solid #C1DAD7;
  padding: 1em;
  margin-bottom: 2em;
  background-color: #5DBAE8;
  font-weight: bold;
}

/* shopping cart */

#shoppingcart {
	padding: 0;
	margin: 0;
	font-size: 0.8em;
}

#shoppingcart th {
	font: bold;
	color: black;
	letter-spacing: 2px;
	text-align: left;
	padding: 3px 3px 3px 6px;
	background: #5DBAE8;
    vertical-align:top;
}

#shoppingcart td {
	border: 1px solid #C1DAD7;
	padding: 3px 3px 3px 6px;
}

/* css menu */

a.menuodd { display:block; text-align:left; width:191px; height:44px;
         margin:4px 0 4px 0;
         padding:0 0 0 0;
         text-decoration:none;
         font-weight:bold;
         font-size:20px;
         vertical-align: middle;
         font-family: "Trebuchet MS", Verdana, Geneva, Arial, Helvetica, sans-serif; 
         line-height: 20px;
         background-image:url(/images/bj/menu_odd.gif);
         background-repeat: no-repeat;}

a.menuoddactive { display:block; text-align:left; width:191px; height:44px;
         margin:4px 0 4px 0;
         padding:0 0 0 0;
         text-decoration:none;
         font-weight:bold;
         font-size:20px;
         vertical-align: middle;
         font-family: "Trebuchet MS", Verdana, Geneva, Arial, Helvetica, sans-serif; 
         line-height: 20px;
         background-image:url(/images/bj/menu_odd_hover.gif);
         background-repeat: no-repeat;}
         
a.menueven { display:block; text-align:left; width:191px; height:44px;
         margin:4px 0 4px 0;
         padding:0 0 0 0;
         text-decoration:none;
         font-weight:bold;
         font-size:20px;
         vertical-align: middle;
         font-family: "Trebuchet MS", Verdana, Geneva, Arial, Helvetica, sans-serif; 
         line-height: 20px;
         background-image:url(/images/bj/menu_even.gif);
         background-repeat: no-repeat;}

a.menuevenactive { display:block; text-align:left; width:191px; height:44px;
         margin:4px 0 4px 0;
         padding:0 0 0 0;
         text-decoration:none;
         font-weight:bold;
         font-size:20px;
         vertical-align: middle;
         font-family: "Trebuchet MS", Verdana, Geneva, Arial, Helvetica, sans-serif; 
         line-height: 20px;
         background-image:url(/images/bj/menu_even_hover.gif);
         background-repeat: no-repeat;}

a.menuodd:link    { color:black;}
a.menuodd:visited { color:black;}
a.menuodd:hover   { color:black; text-decoration:none; background-image:url(/images/bj/menu_odd_hover.gif) }
a.menuodd:active  { color:black; text-decoration:none;}

a.menuoddactive:link    { color:black;}
a.menuoddactive:visited { color:black;}
a.menuoddactive:hover   { color:black; text-decoration:none; background-image:url(/images/bj/menu_odd_hover.gif) }
a.menuoddactive:active  { color:black; text-decoration:none;}

a.menueven:link    { color:black;}
a.menueven:visited { color:black;}
a.menueven:hover   { color:black; text-decoration:none; background-image:url(/images/bj/menu_even_hover.gif) }
a.menueven:active  { color:black; text-decoration:none;}

a.menuevenactive:link    { color:black;}
a.menuevenactive:visited { color:black;}
a.menuevenactive:hover   { color:black; text-decoration:none; background-image:url(/images/bj/menu_even_hover.gif) }
a.menuevenactive:active  { color:black; text-decoration:none;}


.clearfix:after {
 content: "."; 
 display: block; 
height: 0; 
 clear: both; 
 visibility: hidden;
 }
 
.clearfix{display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/* End hide from IE-mac */  


 
 /*printer styles*/ 
 @media print{ 
/*hide the left column when printing*/ 
#menu{display:none;} 
#twocols, #maincol{width:100%; float:none;}
}