div.fancy-select {
	display: inline-block; /* Needed to behave like a select element */
	*display: inline; /* IE7 fix */
	*zoom: 1; /* IE7 fix */
	vertical-align: middle;
	margin: 0;
	overflow: hidden; /* For float clearing */
	cursor: pointer;
	padding: 1px;
	color: #333333;
	border: 0;
	width: 187px;
	font-size: 12px;
	background: url('images/content-order-select.png') no-repeat;
	z-index: 101;
	position: relative;
}

	div.fancy-select.long {
		background: url('images/content-order-select-long.png') no-repeat;
		width: 318px;
	}

div.fancy-select .arrow {
	display: block;
	position: absolute;
	height: 20px;
	width: 19px;
	margin: 8px 0 0 157px;
	background: url('images/content-order-select-arrow.png') no-repeat;
}

		div.fancy-select.long .arrow {
			margin-left: 290px;
		}


ul.fancy-select {
	margin: -1px 0 0 0; /* Reccomended! */
	padding: 0;

	background: #FFF;
	z-index: 100;
	position: relative;
}

ul.fancy-select li {
	margin: 0;
	padding: 1px;
	list-style-type: none; /* We do not need bullets */
	border: 1px solid #e0e0e0;
	background-color: #FFF;
	overflow: hidden; /* For float clearing */
	border-top: none; /* Avoid double-borders */
	cursor: pointer;
	width: 184px;

	*width: 184px; /* IE7 fix, we HAVE TO se fixed with :( */
	*margin-bottom: -3px; /* IE7 fix */

  z-index: 100;
}

	ul.fancy-select.long li {
		width: 315px;
	}

ul.fancy-select li:hover,
ul.fancy-select li.selected:hover {
	background-color: #F9F9F9;
}

/* This is for the currently selected option */

ul.fancy-select li.selected {
	background-color: #FFF;
}

/* This is for the disabled options */

ul.fancy-select li.disabled {
	background-color: #FFF;
	color: #666666;
	cursor: default;
}

/* The following rules set style for inner content of the <select> 
 * replacement and the dropdown list. Just an image and a text left-floated */

.fancy-select .image {
	display: none;
	float: left;
	width: 32px;
	height: 32px;
}

.fancy-select .text {
	display: block;
	float: left;
	height: 34px;
	line-height: 32px;
	padding: 3px 10px;
	text-align: left;
}

/* Some rules to have bigger images for "fancy-select-big" class */

ul.fancy-select-big li .image {
	display: none;
	float: left;
	width: 64px;
	height: 64px;
}

ul.fancy-select-big li {
	*width: 64px; /* IE7 fix, we HAVE TO se fixed with :( */
}