/* Layout
------------------------------------------------------------------ */
#container {
background:#fff url(../img/leftBg.gif) left repeat-y; /* The img is faking bg color to left nav bar */
position:relative;
margin:15px auto; /* center, not in IE5 */
width:800px;

height:auto !important; height:100%; /* All browsers use first rule, IE6 reads only the second */ 
min-height:99%; /* real browsers */

border:3px solid #fff;
}

#contentBox {width: 770px;}



/* Top/Header
------------------------------------------------------------------ */
#header { 
width: 800px; height: 88px;
background:#D9D9D9 url(../img/headerBG.jpg) top repeat-x;
position: relative;
}

#header h1 {position: absolute; left:0; top:0; margin:0;}


#navBar {
width: 800px; height: 22px;
background:#B2B2B2;
border: 1px solid #000;
border-left: none;
border-right: none;
}

#navlist {
float:right;
}

#navlist  dd {
float: left;
background:url(../img/bu-BG-off.gif) 0 repeat-x;
font: 13px/22px "Tahoma", verdana, sans-serif;
text-align: center;
}

#navlist a { 
margin:0; padding:0;
color: #000;
text-decoration: none;
display: block;
border-left: 1px solid #000;
padding-left:30px;
padding-right:30px;
}

#navlist dl#active { background:url(../img/bu-BG-on.gif) repeat-x;}
#navlist a:hover { background:url(../img/bu-BG-on.gif) repeat-x;}


/* Columns
------------------------------------------------------------------ */
#leftSide {
width:167px;
float:left;
margin:0; padding:3px;
background:#D9D9D9;
}

#leftSide dl {
float:left;
font:1.15em "Century Gothic",Arial,Helvetica,sans-serif;
}

#leftSide dt {margin:7px auto; text-align:center;}

#leftSide dd {
padding-left: 10px;
background:url(../img/lNavBullet.gif) left no-repeat;
line-height: 200%;
}

#leftSide dd a {
background:transparent;
height:35px;
text-decoration:none;
}

#leftSide dd a:hover {
background:#fff;
height:35px
}


/* Content
------------------------------------------------------------------ */
#content {margin-left: 173px;}
#content h2 {color: #8AA5C7; font-size:22px; text-transform:none; }
.main {padding: 20px}

.prodSort { 
width:49%;
float:left;
line-height: 150%;
}

.prodSort h3 { 
color: #8AA5C7; font-size:14px; text-transform:none; font-weight:normal;
}

.prodSort h4 { 
clear: both;
float:left;
margin-left:20px;
text-transform:none;
color:#000;
font-weight:normal;
}

.prodThumb {
float:left;
padding:5px;
}

#cartNav {
display:inline;
float:right;
margin:10px 15px;
}



/* Footer
------------------------------------------------------------------ */
#footer {
width: 797px; height: 14px;
padding-right:3px;
text-align:right;
background:#B2B2B2;
border: 1px solid #000;
border-left: none;
border-right: none;
bottom: 0;
position:absolute;
font-size:10px;
}




/* Global Styles
------------------------------------------------------------------ */
.center {}

.separator {}

.clear {clear:both; margin: 5px 0;}

.right {}

.left {}

.menu { background: url(../Images/Main/MenuBground.gif) repeat-x;}

.prodImage {margin-right:15px}


/* Form 
------------------------------------------------------------------ */
label{
float: left;
text-align:right;
margin-right:5px;
width: 120px;
color: #666666
}

input, textarea, select, file{
width: 180px;
margin-bottom: 5px;
border:1px solid #666666; 
}

input:hover, textarea:hover, select:hover, file:hover {background-color: #EDFED6;}
input:focus, textarea:focus, select:focus, file:focus {background-color: #D9F9B9;}

textarea{width: 350px; height: 90px;}

#actionbutton{
margin-left: 20px;
margin-top: 5px;
width: 120px;
}

.small {font-size: 90%; line-height: 120%; }
 
.req {color:#0099FF;}

fieldset{}

legend {
color: #2777D1;
padding:2px; margin:5px auto;
width: 97%;
font-weight:bold;
background-color: #E5E5E5;
display:block;
float:left;
}

.formError {
background: #ffeded;
color: #911b44;
border-top: 1px solid #E7C3C3;
border-bottom: 1px solid #E7C3C3;
list-style: none;
width:100%;
float:left;
}







/* SubNav Highlighting current page with CSS 
------------------------------------------------------------------ */
body#teamMain a#teamNav, 
body#philoMain a#philosophyNav, 
body#careersMain a#careersNav
{background: #fff;}






/* Products Page Styles 
------------------------------------------------------------------ */

.gallerycontainer{
position: relative;
/*Add a height attribute and set to largest image's height to prevent overlaying*/
}

.galleryBox {
	width: 150px;
	float:left;
	margin:5px;
	text-align: center;
}

.galleryBox a:hover {
text-decoration:none;
}