/* 
we need two separate classes that each specify everything
because ie cant handle applying styles for
  #productFinder {...}
at the same time as either of
  #productFinder.open{...}
  #productFinder.closed{...}

*/

div.productFinderClosed{
	position:absolute;	
	z-index:1000; /* make sure its on top of other stuff*/
	top:43px;
	right:25px;
	width:230px;
	
	height:30px;
	background:url("/images_new/FJ_prodfinder_bottom.gif") bottom left no-repeat;	
}
	
div.productFinderOpen{
	position:absolute;	
	z-index:10000; /* make sure its on top of other stuff*/
	top:43px;
	right:25px;	
	width:230px;	

	height:auto;	
	background:url("/images_new/FJ_prodfinder_bottom_trans.png") bottom left no-repeat;	
}

#productFinder div.dropdownButton{	
	height:25px;
	background:url("/images_new/FJ_prodfinder_top.gif") top left no-repeat;	
}

#productFinder div.dropdownButton a{
	display:block;
	margin-left:10px;
	padding-left:20px;
	padding-top:4px;
	background:url("/images_new/FJ_prodfinder_button_bkg.gif") 0 4px no-repeat;	
	
	/* these are just for looks, adjust as necessary */
	color:white;
	line-height:1.5em;
	text-decoration:none;
	font-size:1.2em;
	font-weight:bold;
}

#productFinder div.dropdownButton a img{
	border:0;	
}

#productFinderDropdownForm{
	position:relative;
	z-index:-10; /* we move the form backwards because ie5 mucks up the position of div.dropdownButton if we try to bring /it/ forward */
	top:-12px;
	background:url("/images_new/FJ_prodfinder_middle_trans.png") top left repeat-y;			
}

div.productFinderClosed #productFinderDropdownForm{
	display:none;
}

div.productFinderOpen #productFinderDropdownForm{
	display:block;
}

#productFinderDropdownForm form{
	padding-top:15px; /* this counteracts the offset of #productFinderDropdownForm used to fill the gap at the bottom of the button. */
	
	/* these are just for looks, adjust as necessary */
	padding-left:10px;
	padding-bottom:5px;
}

/*Styles for productFinderLabelOn + productFinderLabelOff*/
*.productFinderLabelOn, *.productFinderLabelOff {
clear:left;
font-weight:bold;
float:left;
font-size:1.0em; font-weight:bold; color:#000000;
width:80px;
margin:0 0 11px 0;
padding:0;
}
select {
	font-size:1em;
	font-weight:strong;
}
div.notAvailable {
	display:inline;
}
/*
/*Styles for select boxes labels
div#gender_type_div, div#product_type_div, div#size_select_div, div#width_select_div, div#hand_size_div, div#price_div, div#styling_div, div#material_div{
width:120px;
display:inline;
float:left;
margin-left:3px;

padding:0;
}
*/
/*Styles for select boxes*/
#productFinderDropdownForm select{
float:left;
width:120px;
 color:#000000;
margin-left:4px;
padding:0;
}
/* only IE (and its poor png support) will catch these */
* html div.productFinderClosed{
	background:url("/images_new/FJ_prodfinder_bottom.gif") bottom left no-repeat;	
}
* html div.productFinderOpen{
	background:url("/images_new/FJ_prodfinder_bottom_trans.gif") bottom left no-repeat;	
}
* html #productFinderDropdownForm{	
	background:url("/images_new/FJ_prodfinder_middle_trans.gif") top left repeat-y;
}