/**************************************************************
/* SelectInput.css
/* jpl 5/14/08

	Styles for the SelectInput widget, an hybrid between
	free text inputs and select drop down menus.  The styles
	in this css define the drop down arrow and drop down
	menu of select options, and by default should aim to
	emulate the native browser aesthetics of <select> inputs.

	This styling them is keyed entirely on the "SelectInput".
	To create an alternate CSS theme for SelectInput object,
	copy the contents of this file entirely and replace all instances
	"SelectInput" with the "[altnerateThemeName]".  Then
	supply that new name as the value of className in the options
	of the SelectInput constructor, as in:
	
	new SelectInput(myInput, myOptionSet, {className: "[altnerateThemeName]"};

/*************************************************************/


span.SelectInput-arrowImage {
	background:				url(../images/dropDownArrow.gif) 0 0 no-repeat;
	width:					16px;
	height:					18px;
}

span.SelectInput-arrowImage:active {
	background:				url(../images/dropDownArrow.gif) -16px 0 no-repeat;
}

div.SelectInput-options {
	position:				absolute;
	border:					1px solid #eee;
	background-color:		white;
	border-right-color:		#ddd;
	border-bottom-color:	#ddd;
	text-align:				left;
	font-family:			Verdana, Geneva, Arial, Helvetica, sans-serif;
	z-index:				50;
}

ul.SelectInput-options {
	margin:					0;
	padding:				0;
	list-style:				none;
}

ul.SelectInput-options li {
	position:				relative;
	padding:				0.1em 1.5em 0.1em 1em;
	cursor:					pointer;
	font-weight:			normal;
	font-size:				10px;
}

ul.SelectInput-options li.SelectInput-selected {
	background-color:		#6C9C31;
	color:					#fff;
}