/* Zero down margin and paddin on all elements 
* {
  margin: 0;
  padding: 0;
}*/

body     { text-align: center; background-color: #666666; 	margin: 0; font-size: 11px; background-image: url(/art_2009/bckg_colors_mens.png); background-repeat: repeat; 
  font-family:  Trebuchet, Verdana, Lucida Grande, Geneva, sans-serif;
}


#topbar {
	background-color: none;
	background-image: url(/art_2009/bckg_headernew.png);
	visibility: visible;
	position: relative;
	top: 0;
	left: 0;
	width: 950px;
	height: 117px; }
	
#topbar a:visited {
	color: white; }
#topbar a:link {
	color: black; }
#topbarlogo {
	visibility: visible;
	position: relative;
	/*border: 1px solid #ccc; */
	width: 250px;
	padding:0px;
	float:left;
	margin-right:20px;
	top: 0px;
	left: 0px; }
#topbarnav {
	visibility: visible;
	position: relative;
	float:right;
	/*border: 1px solid #ccc; */
	margin-left:30px;
	top: 0;
	width: 400px; }
#topbarmessage {
	visibility: visible;
	position: relative;
	float:right;
	/*border: 1px solid #ccc; */
	text-align: left;
	padding-left:20px;
	margin-left:-10px;
	margin-right:20px;
	margin-top:10px;
	top: 0;
	width: 450px; }
#primarynav   { color: #ffff99; background: #003399; margin-left: 0px; padding: 0px 0px 0px 0px; height: 32px; border-top: 0px solid #003399; width: 950px; }

#fourcolumnlines   { background-image: url("art/4columngridlines.gif"); background-repeat: repeat; }
#bottomcontent  { text-align: center; visibility: visible; position: relative;  width: 728px; height: auto; min-height: auto; clear: both; }	

	/* 4 column code here */
	
/* The Core Technique
================================= */

#usernav {
  height: 110px;
  width: 600px;
   float: right;
   text-align:right;
/*   border: 1px solid black; 
 background-color:white;
*/
}
#branding {
  height: 110px;
  width: 220px;
  padding: 0px;
/*  background-image: url(/art_2009/logo-orange.gif); no-repeat: top left;

   border: 1px solid black; 
 background-color:white;
*/
}

#wrapper {
	background-color: none;
  width: 950px;
  margin: 0 auto; 
  text-align: left;
  border: 0px solid #333333;
/* border: 4px solid #333333;
 background-image: url("art/shadowBg.png"); 
	background-repeat: repeat-y; */
}

#wrappercontent {
	background-color: white;
}

* html #wrapper{
background-image: none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="art/shadowBg.png", sizingMethod="scale");
}




/* Fix for pngs in ie couldn't get to work so used another work around 
img{
behavior:url('pngbehavior.htc');
}
*/

/* now sitewide default styles */

a:link    { color: #900; text-decoration: none; font-family: Trebuchet, Verdana, Arial, Helvetica, sans-serif; }
a:visited   { color: #666; text-decoration: none; font-family: Trebuchet, Verdana, Arial, Helvetica, sans-serif; }
a:hover  { color: #900; text-decoration: underline }
p      { color: black; font-size: 11px; font-family: Trebuchet, Verdana, Arial, Helvetica, sans-serif; margin-top: 15px; margin-right: 0px; margin-left: 0px; margin-bottom: 15px; line-height: 15px; padding-right: 10px;}
/* not using table      { color: #630; font-size: 10px; font-family: Trebuchet, Verdana, Arial, Helvetica, sans-serif; margin-right: 10px; margin-left: 15px ; } 
td {}*/
h1      { color: #900; font-size: 13px; font-family: Trebuchet, Verdana, Arial, Helvetica, sans-serif; font-weight: bold; margin: 5px 12px -0px 0; }
h2      { color: #c60; font-size: 12px; font-family: Trebuchet, Verdana, Arial, Helvetica, sans-serif; font-weight: bold; margin: 5px 12px 0px 0; margin-bottom: 0px; }
* html h2 { margin-bottom: -15px; }
h3      { color: #666; font-size: 11px; font-family: Trebuchet, Verdana, Arial, Helvetica, sans-serif; font-weight: bold; margin: 15px 10px -0px 0; }
h4      { color: #666; font-size: 11px; font-family: Trebuchet, Verdana, Arial, Helvetica, sans-serif; font-weight: bold; margin: 15px 10px -0px 0; }
li   { color: #900; font-size: 11px; font-family: Trebuchet, Verdana, Arial, Helvetica, sans-serif; line-height: 12px; list-style-type: square; list-style-position: outside; margin-left: -25px; margin-top: 7px; margin-right: 10px; }
ul { _margin-bottom: -15px; }
* html ul { margin-bottom: -20px; }


/* end sitewide default styles */

/* primarynav
=======================*/

#primarynav {
  width: 950px;
  font-size: 12px;
  font: Trebuchet, Verdana, Arial, Helvetica, sans-serif;
  height: 32px;
  z-index: 1000;  
  }

#primarynav ul {
  margin: 0;
  padding: 0;
  float: left;
  width: 950px;
  
  background: #FAA819 url(images_futurgarb/mainNavBg-black.gif) repeat-x;
  list-style: none;
  
  display: block;
  height: 30px;
    border-bottom: 5px solid black;

}
#primarynav li {
  list-style: none;
  margin: 0;
}


#primarynav ul li {
text-align: center;
  float: left;
  width: 150px;
  white-space: nowrap;
}


#primarynav ul a {
  padding: 0 2em;
  line-height: 2.1em;
  background: url(images_futurgarb/mainNavBorder-black.gif) repeat-y left top;
  text-decoration: none;
  color: #fff;
  float: left;
  display: block;
}

#primarynav ul .first a {
  background: none;
  background: url(images_futurgarb/mainNavBg-black.gif) repeat-x;

} 



#primarynav ul a:hover {
  color: orange;
}


/*ul .first a {
  background: none;
} */

#primarynav ul li ul {
/*margin:0px 0px 0px 0px;*/
  float: none;
  margin: 0px;
  margin-top:25px;
  display: none;
  text-align: left;
  z-index: 55;

    	/* ie Mac */
 /* 	position:relative !important; */

 /* border: 1px solid green; */

}

/* 2nd level */

/* #primarynav ul li ul li {
  float: none;
  list-style: none;
list-style: circle outside;
  width: auto;
  display: block;
position: relative;
} */

#primarynav ul li:hover ul {
display:block;
position:relative;
/*background: yellow;*/
  width: 220px;
  height: auto;

}



#primarynav ul li ul li a:link {
  padding:3px 10px 3px 6px;
width: 220px;
  text-align: left;
 background: #cccc99; color:#333333; border: 1px solid #666666;
 display: block;     
}

#primarynav ul li:hover ul li a:hover {
    color: #333333;
      display: block;
background: #fff; color:#ff9900; border: 1px solid orange;

}



#primarynav ul li:hover ul li:hover a {

 background: #C9401A; color: white; border: 1px solid #666666;
   
}



/*#primarynav ul li:hover ul {

display:block; 
position:relative; top:20; left:8px; width:auto;  width: 200px;}
*/


/* Level 3 */

/*#primarynav ul li ul li ul {
margin: 0px;
width: 200px;
margin-left: 220px;
margin-top: -25px;
display: none;
background:green;
position: absolute;

} */

 #primarynav ul li:hover ul li ul {
/*margin: 0px;
width: 200px;
margin-left: 220px;
margin-top: -25px;
background:green;
position: absolute;*/
display: none;
/*border: 1px solid blue;*/

border-bottom: 0px solid black;

}

/* #primarynav ul li ul li ul li {
  float: none;
  list-style: none;
  width: 200px;
  display: block;
  position: relative;


} */

/* #primarynav ul li ul li ul li {

  position: relative;
  margin: 0px;
  float: left;


}*/



/* #primarynav ul li:hover ul li:hover ul {
margin: 0px;
display:block; 
position:relative; 
margin-left: 220px;
background-color: green; */

#primarynav ul li:hover ul li a 

{display:block; background: #7895A3; color:#333333; width:220px; border: 1px solid black; text-align: left; padding:3px 10px 3px 6px;

/*
position:absolute; 
margin-top:0; 
left:220px; 
width:auto; 
width: 200px;*/

}



#primarynav ul li:hover ul li:hover ul {
display: block; 
margin-top: 0px;
width: 220px;
position: absolute;
margin: 0px;
margin-left: 220px;
.margin-left: 0px;
_margin-left: 0px; }


*html #primarynav ul li:hover ul li:hover ul {

margin-left: 0px;

}


#primarynav ul li:hover ul li:hover ul li a {

 background: orange; color: white; border: 1px solid #666666; padding:3px 10px 3px 6px;
   
}

#primarynav ul li:hover ul li:hover ul li a:hover {

 background: white; color: orange; border: 1px solid #666666;
   
}





#leftNav { 
  width: 165px;
  max-width: 165px;
  float: left;
  margin-left: 5px;
  list-style: square inside;
  background-color:#eee;
}

#content { 
  width: 52em;
  max-width: 75%; 
  float: right;
}

#content4column { 
  width: 52em;
  max-width: 75%; 
  float: right;
  background-image: url("art/4columngridlines.gif"); background-repeat: repeat;
margin-right: 7px;
margin-top: 0px;
margin-bottom: 15px;
}

#mainContent { 
  width: 215px;
  max-width: 300px;
  float: left;
  margin-left: -85px;
  padding-top: 0px;
  padding-bottom: 15px;
  padding-left: 10px;
  padding-right: 10px;
  background-color: #eee;
}

#twoColumnContent { 
	background-color: white;

  width: 680px;
  float: left;
  margin: 0px;
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 15px;
  padding-right: 15px;
/*  background-color: red;
  
border: 1px solid #ccc; */
}

#twoColumnContent p { 
 font-size: 12px; 
}


#twoColumnSideBar { 
  width: 190px;
  float: left;
  margin: 0px;
  margin-top: 15px;
  margin-left: 0px;
  margin-right: 0px;
  padding-top: -2px;
  padding-left: 0px;
  padding-right: 4px;
  /* border-right: 1px solid gray;
   
  background-color: green;
  border: 1px solid #ccc; */
  }

#secondaryContent { 
  width: 120px;
  max-width: 120px;
  float: right;
  margin: 0px;
  margin-right: 0px;
  padding-top: 0px;
  padding-bottom: 15px;
  padding-left: 0px;
  padding-right: 0px;
  /* background-color:#eee; */
  background-color:#eee;

} 
#thirdContent { 
  width: 215px;
  max-width: 215px;
  float: right;
  margin: 0px;
  margin-right: 5px;
   padding-top: 0px;
  padding-bottom: 15px;
  padding-left: 0px;
  padding-right: 0px;
} 

#content3column { 
  width: 100%;
  max-width: 100%; 
  background-image: url("art/4columngridlines.gif"); background-repeat: repeat; 
margin-right: 7px;
margin-left: 7px;
margin-top: 0px;
margin-bottom: 15px;
}

#contentleft3column {
		width:150px;
		padding:0px;
		margin-right: 10px;
		float:left;
		background:#fff;
		}
	
#contentcenter3column {
		width:435px;
		padding:0px;
		float:left;
		background:#eee;
		}
	
#contentright3column {
		width:150px;
		float:left;
		background:#fff;
		 margin: 0px;
  margin-right: 5px;
   padding-top: 0px;
  padding-bottom: 15px;
  padding-left: 0px;
  padding-right: 0px;
		}


#footer { 
  clear: both; 
    background-color:#b0b0b0;
  padding: 1px 20px;
  margin-left: 5px;
  margin-right: 5px;
}

#privacy { text-align: left; clear: both; margin: 0px auto; padding: 0; width: 950px; }


#leftsidebarnav {
width: 12em;
border-right: 1px solid #000;
padding: 0 0 1em 0;
margin-bottom: 1em;
font-size: 12px;
font-family: Trebuchet, Verdana, Lucida, Geneva, Helvetica,
Arial, sans-serif;
background-color: #90bade;
color: #333;
}

#leftsidebarnav ul {
list-style: none;
margin: 0;
padding: 0;
border: none;
}

#leftsidebarnav li {
border-bottom: 1px solid #90bade;
margin: 0;
}

#leftsidebarnav li a {
display: block;
padding: 5px 5px 5px 0.5em;
border-left: 10px solid #1958b7;
border-right: 10px solid #508fc4;
background-color: #2175bc;
color: #fff;
text-decoration: none;
width: 100%;
}

html>body #leftsidebarnav li a {
width: auto;
}

#leftsidebarnav li a:hover {
border-left: 10px solid #1c64d1;
border-right: 10px solid #5ba3e0;
background-color: #2586d7;
color: #fff;
}
***

div.clearfloats  { clear: both; }
.clearfix:after { content: "."; display:block; height: 0; clear: both; visibility: hidden;}
.clearbefore:before { content: "."; display:block; height: 0; clear: both; visibility: hidden;}


.headline   { color: #990; font-size: 20px; font-family: Trebuchet, Verdana, Arial, Helvetica, sans-serif; font-weight: normal }

.topnav  { color: #7d7d7d; font-size: 10px; font-family: Trebuchet, Verdana, Arial, Helvetica, sans-serif; text-align: right }
a.topnav:link  {
	color: #7d7d7d;
	text-decoration: none }
a.topnav:visited {
	color: #7d7d7d;
	text-decoration: none }
a.topnav:hover  { color: #900; text-decoration: underline }
.primarynav  { color: #504816; font-size: 11px; font-family: Trebuchet, Verdana, Arial, Helvetica, sans-serif; text-decoration: none   ; margin-top: 5px; }

#privacy p {
font-size: 10px;
margin-top: 0px;
color: #333333;
}
#privacy h3 {
font-size: 12px;
color: #333333;
}
#privacy a:link  {
	color: #333333;
	text-decoration: none; }
#privacy a:visited {
	color: gray;
	text-decoration: none }
#privacy a:hover {
	color: orange;
	text-decoration: underline }

.sidebar  { color: #666; font-size: 10px; padding: 10px; }
.sidebar a:link  { color: #900; font-weight: normal; text-decoration: none; margin-left: 0 }
sidebar a:hover  { color: #c60; font-weight: normal; text-decoration: underline }
.sidebar a:visited  { color: #808080; font-weight: normal; text-decoration: none }
.footnote { color: #7d7d7d; font-size: 9px; padding-top: 15px }

.vendor { color: #777; font-size: 10px; font-family: Trebuchet, Verdana, Arial, Helvetica, sans-serif; text-decoration: none; text-align: left; margin-bottom: 5px; margin-top: 5px; padding-left: 1px; border: 0px }

.new      { color: #ca0000; font-size: 11px; font-weight: bold; }
.sale     { color: #f93; font-size: 11px; font-weight: bold; }
.price { color: #c60; font-weight: bold; font-size: 11px;  }
.intro {
font-size: 11px;
margin-top: 5px;
margin-bottom: 10px;
color: #666666;
}
.list { 
 margin-right: 10px;
 padding: 0px;
}

.list li {  list-style: none; background: url(art2007/bullet2.gif) no-repeat left top;
list-style-position: outside; margin: 10px 0px -3px 8px; color: #a00;  padding-left: 16px; font-size: 11px; white-space:nowrap;  }

.list li a:link {
color: #b00;
}

.list li a:hover { color: #c60; text-decoration: underline; }

.greySelect    { color: #888; font-size: 10px; line-height: 10px; font-family: Geneva, SunSans-Regular, Arial, Helvetica, Swiss; background-color: white }
.optionYellow  { color: #f90; font-size: 11px; font-family: SunSans-Regular, Arial, Helvetica, Geneva, Swiss; background-color: white }
.optionRed { background-color: #cc0000 }

/* Content Sections */
#sectiontop { width: 950px; height: 400px; padding: 0px; margin: 0px; background: #FAA819 url(art_2009/bckg_home_cats.png) repeat-y;
border-bottom: 6px solid #507282; margin-top: 0px; border-top: 1px solid #666666; }

* html #sectiontop {
margin-top: 0px;
}

#sectionphoto { margin-top: 20px; }

* html #sectionphoto {
margin-top: 20px;
}

#sectiontoppart2 { width: 440px; height: auto; margin: 0px; padding-top: 10px; padding-right: 10px; padding-left: 10px; border: 0px solid #666666; float: right; }
#sectiontoppart2-content { width: 190px; height: auto; margin: 0px; padding-top: 10px; padding-right: 0px; padding-left: 10px; border: 0px solid #666666; float: right; }


#sectiontoppart1 {width: 440px; height: auto; margin: 0px; padding-top: 10px; padding-right: 10px; padding-left: 15px; border: 0px solid #666666; }

#sectiontoppart1-content {width: 190px; height: auto; margin: 0px; padding-top: 10px; padding-right: 0px; padding-left: 10px; border: 0px solid #666666; float: right; }

#section3 { width: 950px; height: 368px; border-bottom: 2px solid #333333; border-top: 2px solid #333333; background-image: url(art_2009/bckg_footer_section3.jpg); top left; background-repeat: repeat; display: block; margin-top: 5px; }

#section3a { width: 295px; height: 300px; border: 0px solid #333333; display: block; float: left; margin-left: 15px; }

#section3b { width: 295px; height: 300px; border: 0px solid #333333; display: block; float: left; margin-left: 15px; }

#section3c { width: 295px; height: 300px; border: 0px solid #333333; display: block; float: left; margin-left: 15px; }

.sectionlist { 
margin: 14px 7px 2px 15px; 
padding: 0; 
padding-bottom: 10px;
width: 145px; 
height: auto;
/* border: 1px solid #666666;

border: solid 1px #a3a9b6; */
display: block; 
float: left; 
text-align: left;
}

.sectionlist h2 { 
 font-size: 11px; 
 line-height: 12px;
 color: #333399;
 margin-top: 10px;
}

#footer p { 
 font-size: 10px; 
 color: #333399;
 text-align: left;
}

.sectionlistbox p { 
 font-size: 10px; 
 color: #333399;
 text-align: left;
}

.sectionlist a { 
 font-size: 10px; 
 color: #c80000;
 margin: 0px;
 padding: 0px;
}

.sectionlist a:hover { 
  color: #c60
}

.sectionlist a:visited { 
  color: #333333
}

.sectionlist li {   list-style: none inside;
 margin: -3px 2px 5px 0px; color: #333399;  padding-left: 5px; font-size: 10px; }

*html .sectionlist li {
list-style: none outside;
}

.sectionlistphoto { 
padding: 0; 
border: 2px solid #b2b2b2;
clear: both;
}

.sectionlisttitle { margin-bottom: -10px; _margin-bottom: -20px; }
* html .sectionlisttitle { margin-bottom: -25px; }
*html .sectionlisttitle { margin-bottom: -25px; }



/* section page styles */
  
* html .sectionlineitems { margin-top: -10px; _margin-botton: -15px; margin-botton: -15px; }

.sectionlineitems { margin-top: 10px; _margin-botton: -15px; margin-botton: -5px; }

.sectionlineitems li   { color: #333333; font-size: 11px; font-family: Trebuchet, Verdana, Arial, Helvetica, sans-serif; line-height: 12px; list-style-type: none; list-style-position: inside; margin-left: -40px; margin-top: 2px; margin-right: 10px; }



.producttitle      { color: black; font-size: 10px; font-family: Trebuchet, Verdana, Arial, Helvetica, sans-serif; margin-top: 15px; margin-right: 0px; margin-left: 0px; margin-bottom: 15px; line-height: 15px; padding-right: 10px;}

/*-----------------------------------------------------------------------------------------------
CODE FOR THE THUMBNAIL LINK ROLLOVER
-----------------------------------------------------------------------------------------------*/

.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
	position: absolute;
	background-color: white;
	padding: 0px;
	left: -1000px;
	border: 4px orange solid;
	visibility: hidden;
	color: black;
	text-decoration: none;
	font: bold;
	margin-left: 50px;
	margin-top: -250px;
}


.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 0px;
}


.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */
}

*html .thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */
z-index: 50;
}


.shadowed { 
  float:right;
  background: url(/art_2009/drop-shadow.png) no-repeat bottom right !important;
  background: url(/art_2009/drop-shadow.gif) no-repeat bottom right;
  margin: 6px 0 0 6px !important;
  margin: 10px 0 0 5px;
  }
.shadowed img {
  display: block;
  position: relative;
  background-color: #fff;
  border: 1px solid #999;
  margin: -6px 6px 6px -6px;
  padding: 4px;
  }
  
#footernew { width: 950px; height: 63px; display: block; background-color: #7F4300; }

#twoColumnSideBar h2 { background: url(/art_2009/sidenav_hdbckg2.gif) no-repeat top right; height: auto; background-color: #a84a09; width: 190px; border-top: 0px solid #3F3F3F; border-bottom: 4px solid #666666; color: white; padding: 5px 0px 3px 10px }

.list_sidebar { 
 margin-right: 10px;
 margin-top: 0px;
 padding: 0px;
}

.list_sidebar li {  list-style: none; background: url(/art_2009/bullet2.gif) no-repeat left top;
list-style-position: outside; margin: 10px 0px -3px 8px; color: #a00;  padding-left: 16px; font-size: 13px; white-space:nowrap;  }

.list_sidebar li a:link {
color: #b00; font-size: 12px;
}

.list_sidebar li a:hover { color: #c60; text-decoration: underline; }


/* super button */
/* rounded buttons */
.round {
	cursor:pointer; 
	cursor:hand; 
	line-height:27px;
	background:url(/art_2009/orange_button.gif) no-repeat right top; 
	padding-right:15px; 
	vertical-align:middle;
	display:block; /*opera*/
	display:inline-block; /*ie*/
	display:-moz-inline-box;  /*ff*/
}

.round span { 
	background:url(/art_2009/orange_button.gif) no-repeat left top; 
	height:27px;
	display:block;
	display:inline-block;
	padding-left:15px; line-height:27px;
	text-align:center;
	font-size:12px;
}

	a.round:hover {background-position:right -155px;}
	a.round:hover span {background-position:left -155px;}
	
	/*button tag*/
	
button {border:0; border:none; background:transparent; width:1; overflow:visible; white-space:nowrap; padding:0 2px; cursor:pointer; cursor:hand;}
	
/* end rounded buttons */

.bubble{
position: relative;
z-index: 100;
width: 18px;
height: 13px;
/*background:url(/art_2009/bubble-icon.gif) no-repeat left top; */
float:none; display: inline; margin-left: 7px; padding-left: 10px; padding-right: 10px;
}

.bubble:hover{
background-color: transparent;
z-index: 100;
text-decoration: none;
	
}

.bubble span{ /*CSS for enlarged image*/
	position: absolute;
	background-color: white; /**/
	padding: 5px;
	left: -1000px;
	border: 1px gray;
	visibility: hidden;
	color: black;
	font: bold;
	margin-top: -225px;
	margin-left: -75px;
	width: 250px;
	height: auto;
	padding-left: 15px;
	padding-top: 15px;
}

.bubble:hover span{ /*CSS for enlarged image on hover*/
z-index: 75;
visibility: visible;
background-color: white; /**/
border: 4px orange solid;
top: 0;
left: 100px; /*position where enlarged image should offset horizontally */

}