/*
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.

*/


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

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

/*==================================
red curvy example
====================================*/

.stylishItemFrameSizes
{
	background-image: url(http://www.profileimages.nl/images/profiletyrecenter2010/images/input_frame.jpg);
	background-repeat: no-repeat;
	width: 60px;
	height: 27px;
	text-align: center;
	vertical-align: middle;
	padding: 0px 0px 0px 0px;
}

.stylishTextFrameSizes
{
	text-align: center;
	vertical-align: middle;
	font-size: 16px;
	color: #000000;
	height: 27px;
	padding-right: 10px;
}
.stylishPopupFrameSizes
{
}

.stylishHoverFrameSizes
{
	background-image: url(http://www.profileimages.nl/images/profiletyrecenter2010/images/input_frameOver.jpg);
	background-repeat: no-repeat;
}

.stylishItemFrameCar
{
	background-image: url(http://www.profileimages.nl/images/profiletyrecenter2010/images/input_frameCar.jpg);
	background-repeat: no-repeat;
	width: 150px;
	height: 17px;
	text-align: left;
	vertical-align: middle;
	padding-top: 1px;
}
.stylishTextFrameCar
{
	text-align: left;
	vertical-align: middle;
	font-size: 14px;
	color: #000000;
	padding-left: 5px;
}
.stylishPopupFrameCar
{
	font-size: 14px;
	width: 148px !important;
}
.stylishHoverFrameCar
{
	background-image: url(http://www.profileimages.nl/images/profiletyrecenter2010/images/input_frameCarOver.jpg);
	background-repeat: no-repeat;
}


.stylishItemFrameBrands
{
	background-image: url(http://www.profileimages.nl/images/profiletyrecenter2010/images/input_frameBrands.jpg);
	background-repeat: no-repeat;
	width: 130px;
	height: 17px;
	text-align: left;
	vertical-align: middle;
	padding-top: 1px;
}

.stylishTextFrameBrands
{
	text-align: left;
	vertical-align: middle;
	font-size: 14px;
	color: #000000;
	padding-left: 5px;
}
.stylishPopupFrameBrands
{
	font-size: 14px;
	width: 128px !important;
}

.stylishHoverFrameBrands
{
	background-image: url(http://www.profileimages.nl/images/profiletyrecenter2010/images/input_frameBrandsOver.jpg);
	background-repeat: no-repeat;
}

.stylishItemFrameCarBig
{
	background-image: url(http://www.profileimages.nl/images/profiletyrecenter2010/images/input_frameBigCar.jpg);
	background-repeat: no-repeat;
	width: 500px;
	height: 17px;
	text-align: left;
	vertical-align: middle;
	padding-top: 1px;
}
.stylishTextFrameCarBig
{
	text-align: left;
	vertical-align: middle;
	font-size: 14px;
	color: #000000;
	padding-left: 5px;
}
.stylishPopupFrameCarBig
{
	font-size: 14px;
	width: 498px !important;
}
.stylishHoverFrameCarBig
{
	background-image: url(http://www.profileimages.nl/images/profiletyrecenter2010/images/input_frameBigCarOver.jpg);
	background-repeat: no-repeat;
}

ul.newList *
{
	margin: 0;
	padding: 0;
}
ul.newList a
{
	color: #000;
	text-decoration: none;
	display: block;
}
ul.newList
{
	margin: 0;
	padding: 0;
	list-style: none;
	color: #000;
	width: 58px;
	background: #fff;
	position: absolute;
	border: 1px solid #ccc;
	top: 22px;
	left: 0;
	overflow: auto;
	overflow-x: hidden;
	z-index: 9999;
}
.newListSelected
{
	color: #000;
	float: left; /*background-image: url(          'Images/input_frame.jpg' ); 	background-repeat: no-repeat; 	width: 60px; 	height: 27px; 	text-align: center; 	vertical-align: middle; 	padding-top: 0px;*/
}
.newListSelected span
{
	width: 60px;
	display: block;
}
ul.newList li a
{
	padding: 3px 8px;
	display: block;
}
ul.newList li a:focus
{
	-moz-outline-style: none;
}
.selectedTxt
{
}
.hiLite
{
	background: #ccc !important;
	color: #fff !important;
}
.hiLite a
{
	background: #ccc !important;
	color: #fff !important;
}
.newListHover
{
	background: #f9f9f9 !important;
	color: #000 !important;
	cursor: default;
}
.newListSelHover, .newListSelFocus
{
	cursor: default; /*background-image: url(          'Images/input_frame.jpg' ); 	background-repeat: no-repeat; 	width: 60px; 	height: 27px; 	text-align: center; 	vertical-align: middle; 	padding-top: 0px;*/
}
.newListOptionTitle
{
	font-weight: bold;
}
.newListOptionTitle ul
{
	margin: 3px 0 0;
}
.newListOptionTitle li
{
	font-weight: normal;
	border-left: 1px solid #ccc;
}

/*======================================
windows xp style - div that contains the 
<select> has been given an id of #win-xp
(for the purposes of this example
========================================*/
#win-xp .newListSelected
{
	background: #FFF url(dropdown.gif) no-repeat scroll 155px 1px;
	border: 1px solid #A5ACB2;
	color: #000;
	height: 17px;
	margin-bottom: 10px;
	padding: 0;
	width: 60px;
}
#win-xp .newListSelected div
{
	display: block;
	font-size: 0.85em;
	padding: 2px 21px 2px 4px;
	text-align: left !important;
	width: 149px;
}
#win-xp ul.newList
{
	list-style: none;
	color: #000;
	width: 60px;
	background: #fff;
	border: 1px solid #000;
	top: 22px;
	left: 0;
	height: auto;
	overflow: auto;
	font-size: 0.85em;
	text-align: left !important;
	position: absolute;
	z-index: 9999;
}
#win-xp ul.newList li
{
	padding: 2px 5px !important;
	border-bottom: 1px solid #cccccc;
}
#win-xp .hiLite
{
	background: #316ac5 !important;
	color: #fff !important;
}
#win-xp .newListHover
{
	background: #ccc !important;
	color: #000 !important;
	cursor: default;
}
#win-xp .newListSelHover
{
	cursor: default;
}
#win-xp .newListSelHover, #win-xp .newListSelFocus
{
	background-position: auto;
}
#win-xp .newListSelHover div, #win-xp .newListSelFocus div
{
	font-weight: bold;
}