/* стили необходимые для работы скрипта */
select.srReplacedSelect {
	width: 1px;
	position: absolute;
	left: -999em;
}

ul.srList {
	list-style: none;
	padding: 0;
	/* лучше всего техника работает 
	   для элементов фиксированной ширины
	   хотя при некоторых дополнителных
	   требованиях к изображению и небольшом
	   изменение стилей ее можно применять
	   и для резиновых select`ов */
	width: 198px;
	margin: 1px 1px 10px;
	/* поскольку используется техника
	   Sliding Doors элемент хорошо переносит
	   масштабирование шрифтов, для этого
	   его высоту нужно задать в em */
	height: 1.5em;
	color: black;
	cursor: pointer;
}

ul.srList li {
	display: none;
	background: #DFB27D;
	line-height: 1.5em;
	padding: 0 10px;
	width: 180px;
}

ul.srList li.srHoverLi {
	background: wheat;
}

ul.srBlur {
	background: url('srBgTop.png') no-repeat;
}

ul.srFocus,ul.srHoverUl { /* чтобы при наведении мышки
	   или получении фокуса элемент
	   не оставался на некоторое время без фона,
	   и для ускорения загрузки, совмещаем
	   два фоновых изображения в одном и изменяем его
	   подвигая на 300 пикслей влево */
	background: url('srBgTop.png') no-repeat -300px 0px;
}

ul.srBlur li.srSelectedLi {
	display: block;
	background: url('srBgBottom.png') no-repeat 0px 100%;
}

ul.srFocus li.srSelectedLi,ul.srHoverUl li.srSelectedLi {
	display: block;
	background: url('srBgBottom.png') no-repeat -300px 100%;
}

ul.srExpanded li.srSelectedLi {
	display: block;
	background: wheat;
}

ul.srExpanded {
	position: absolute;
	/* при разворачивании списка,
	   нужно выдвинуть его на первый
	   план, иначе другие элементы будут
	   перекрывать опции */
	z-index: 1000;
}

div.srList {
	padding: 0;
	position: absolute;
	/* лучше всего техника работает 
	   для элементов фиксированной ширины
	   хотя при некоторых дополнителных
	   требованиях к изображению и небольшом
	   изменение стилей ее можно применять
	   и для резиновых select`ов */
	width: 200px;
	/* поскольку используется техника
	   Sliding Doors элемент хорошо переносит
	   масштабирование шрифтов, для этого
	   его высоту нужно задать в em */
	height: 250px;
	color: black;
	cursor: pointer;
}

div.srExpanded {
	/* при разворачивании списка,
	   нужно выдвинуть его на первый
	   план, иначе другие элементы будут
	   перекрывать опции */
	z-index: 1000;
	overflow: auto;
	position: absolute;
	height: 250px;
}

ul.srExpanded li {
	display: block;
}