function selectStyle_replace(obj) {
	// append a class to the select
	obj.className += ' replaced';
	// create list for styling
	var ul = document.createElement('ul');
	ul.className = 'selectReplacement';
	var opts = obj.options;
	var selectedOpt = (!obj.selectedIndex) ? 0 : obj.selectedIndex;
	for (var i=0; i<opts.length; i++) {
		var li = document.createElement('li');
		var txt = document.createTextNode(opts[i].text);
		li.appendChild(txt);
		li.selIndex = opts[i].index;
		li.selectID = obj.id;
		li.onclick = function() { selectStyle_select(this); }
		if (i == selectedOpt) {
			li.className = 'selected';
			li.onclick = function() {
			//li.onmouseover = function() {
				//console.log('li.onmouseover: start class = '+this.parentNode.className);
				this.parentNode.className += ' selectOpen';
				this.onclick = function() { selectStyle_select(this); }
				//console.log('li.onmouseover: end class = '+this.parentNode.className);
			}
			/*
			li.onmouseout = function() {
				console.log('onmouseout: start class = '+this.parentNode.className);
				this.onclick = null;
				this.parentNode.className = 
					this.parentNode.className.replace(new RegExp(" selectOpen"), '');
				console.log('onmouseout: end  class = '+this.parentNode.className);
			}
			*/
		}
		if (window.attachEvent) {
			li.onmouseover = function() {
				this.className += ' hover';
			}
			li.onmouseout = function() {
				this.className = 
					this.className.replace(new RegExp(" hover\\b"), '');
			}
		}
		ul.appendChild(li);
	}
	/*
	ul.onmouseout = function() {
		console.log('ul.onmouseout: start class = '+this.className);
		this.className = 
			this.className.replace(new RegExp(" selectOpen"), '');
		console.log('ul.onmouseout: end  class = '+this.className);
	}
	*/
	// add the input and the ul
	obj.parentNode.appendChild(ul);
}
function selectStyle_select(obj) {
	var lis = obj.parentNode.getElementsByTagName('li');
	for (var i=0; i<lis.length; i++) {
		if (lis[i] != obj) { // not the selected list item
			lis[i].className='';
			lis[i].onclick = function() { selectStyle_select(this); }
	 } else {
			selectStyle_setVal(obj.selectID, obj.selIndex);
			obj.className='selected';
			obj.parentNode.className = 
				obj.parentNode.className.replace(new RegExp(" selectOpen\\b"), '');
			obj.onclick = function() {
				obj.parentNode.className += ' selectOpen';
				this.onclick = function() { selectStyle_select(this); }
			}
		}
	}
}
function selectStyle_setVal(objID, selIndex) {
	var obj = document.getElementById(objID);
	obj.selectedIndex = selIndex;
//	console.log(obj.onchange);
	if(obj.onchange) obj.onchange();
}
function selectStyle_replaceAll() {
	var s = document.getElementsByTagName('select');
	for (var i=0; i<s.length; i++)
		if(s[i].className.match(/replaceSelect/))
			selectStyle_replace(s[i]);
}

/*
function closeSel(obj) {
	// close the ul
}
*/
//window.onload = function() {
//	(document.all && !window.print) ? null : selectStyle_replaceAll();
//}