
/*
Stylish Select 0.4.1 - $ plugin to replace a select drop down box with a stylable unordered list
http://scottdarby.com/

Copyright (c) 2009 Scott Darby

Requires: jQuery 1.3 or newer

Dual licensed under the MIT and GPL licenses.

*/

/*
<select style="display: none;" id="id_code-geslacht" name="code-geslacht" class="" tabindex="10">
	<option value=""></option>
	<option value="M">Man</option>
	<option value="V">Vrouw</option>
</select>
<div style="position: static;" class="newListSelected" tabindex="0">
	<div class="selectedTxt"></div>
	<ul style="top: 29px; height: 53px; left: 0pt; display: none;" class="newList">
		<li class="hiLite"></li>
		<li class="">Man</li>
		<li class="">Vrouw</li>
	</ul>
</div>
*/

/*==================================
Hide lists on page load
====================================*/

.stylish-select ul.newList {left:-9999px;}

/*==================================
red curvy example
====================================*/
ul.newList * {
	margin: 0; 
	padding: 0;
}

ul.newList a {
	color: #666666; 
	text-decoration: none; 
	display: block;
}

ul.newList {
	margin: 0; 
	padding: 0; 
	list-style: none; 
	color: #666666; 
	width: 68px; /* 290px */
	background: #fff; 
	position: absolute; 
	border: 1px solid #ccc; 
	top: 22px; /* 22px */
	left: 0; 
	overflow: auto; 
	z-index: 9999;
}

.newListSelected {
	width: 63px; /* 285px */
	color: #000; 
	height: 19px; /* 19px */
	padding: 3px 0 0 6px; /* 3px 0 0 6px */
	float: left; 
	cursor: pointer;
	background: url(css/images/select-bg.png) no-repeat;
}

.newListSelected span {
	width: 62px;  /* 284px */
	display: block;
}

ul.newList li a {
	padding: 3px 8px; /* 3px 8px */
	display: block;
}

ul.newList li a:focus {
	-moz-outline-style: none;
}

.selectedTxt {
	width: 48px; /* 258px */
	overflow: hidden; 
	height: 16px; /* 16px */
	padding: 0 21px 0 0; /* 23px */
}

.hiLite {
	background: #e8e8e8 !important; 
	color: #666666 !important;
}

.hiLite a {
	background: #e8e8e8 !important; 
	color: #666666 !important;
}

.newListHover {
	background: #e8e8e8 !important; 
	color: #666666 !important; 
	cursor: pointer;
}

.newListSelHover, .newListSelFocus {
	background-position: 0 -22px; /* 0 -22px */
	cursor: pointer;
}

.newListOptionTitle {
	font-weight: bold;
}

.newListOptionTitle ul {
	margin:3px 0 0; /* 3px 0 0 */
}

.newListOptionTitle li {
	font-weight: normal; 
	border-left: 1px solid #ccc;
}
