select#countries {
	display: block;
	margin: 3px 0 10px;
	width: 200px;
}
/* стили необходимые для работы скрипта */
select.srReplacedSelect {
	width: 1px;
	position: absolute;
	left: -999em;
}

ul.srList {
	list-style:none;
	padding:0;

	/* лучше всего техника работает
	   для элементов фиксированной ширины
	   хотя при некоторых дополнителных
	   требованиях к изображению и небольшом
	   изменение стилей ее можно применять
	   и для резиновых select`ов */
	width: 200px;
	margin: 0;

	/* поскольку используется техника
	   Sliding Doors элемент хорошо переносит
	   масштабирование шрифтов, для этого
	   его высоту нужно задать в em */
	height: 1.5em;
    border: 1px solid #f39c9e;
    color: #fff;
}

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

ul.srList li.srHoverLi {
	background: #f0747c;
}

ul.srBlur {
	background: #e10e15 url(../images/sel_contries.gif) no-repeat;
}

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

ul.srBlur li.srSelectedLi {
	display:block;
	background: #e10e15 url(../images/sel_contries_act.gif) no-repeat right;
}

ul.srFocus li.srSelectedLi, ul.srHoverUl li.srSelectedLi {
	display:block;
	background: #e10e15 url(../images/sel_contries_act.gif) no-repeat right;
}

ul.srExpanded li.srSelectedLi {
	display:block;
	background: #e10e15 url(../images/sel_contries.gif);
}

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

ul.srExpanded li {
	display:block;
}