function hideCountryDropdown(e){
	
	var dd = document.getElementById("countrySelect");
	var form = document.getElementById("countrySelectHidden");

	if (!e) var e = window.event;
	var reltg = (e.relatedTarget) ? e.relatedTarget : e.toElement;
	while (reltg != dd && reltg.nodeName != 'BODY' && reltg.nodeName != 'HTML') reltg= reltg.parentNode;
	
	//if the destination is not inside the product finder close the productfinder if it's open	
	if ((reltg != dd) && (form.style.display == "block")) 
		toggleCountryDropdown();
}

function toggleCountryDropdown(){
	var ddButton = document.getElementById("countrySelect");	
	var form = document.getElementById("countrySelectHidden");
	var htEffect;
	
	//The try-catch blocks are for graceful degradation to ie5, which doesn't support the fx.		
	if (form.style.display == "block"){
		//this is open, so close it.
		try{
			htEffect = new fx.Height(form , {duration: 250,
						onComplete: function(){
							//ddButton.className = "productFinderClosed";							
							form.style.display="none";
						}
						});
			htEffect.custom(form.offsetHeight, 0);
		}catch (e){
			form.style.display="none";
		}

	}else{
		//this is closed, so open it		
		form.style.display = "block";
		
		try{
			htEffect = new fx.Height(form , {duration: 250});
			
			//	IE5/mac hides the background of the form if it has a height set explicitly.
			//	everything that supports this animation flickers the form the first time
			//	it's opened if the height isn't set explicitly. 
			//	IE5/mac will have failed by now, so it's safe to set it.
			form.style.height="0px";
			
			htEffect.custom(0, form.scrollHeight);
		}catch (e){
			//nothing
		}

	}
	return false;
}


var country_oldOnload = window.onload;
window.onload = function(){
	if (country_oldOnload) country_oldOnload(); 
	document.getElementById("countrySelect").onmouseout = hideCountryDropdown;
	document.getElementById("countrySelectButton").onclick = toggleCountryDropdown;
}