function refIntroProductsToggle() {
	var listarrow = $('img.listarrow', this)[0];
	if (this.slidestate == "up") {
		//$('ul', this).slideDown(500);
		//$('ul', this).show(500);
		$('.slidable', this).show(500);
		listarrow.src = '/images/system/list_arrow_down.gif';
		this.slidestate = "down";
	} else {
		//$('ul', this).slideUp(500);
		//$('ul', this).hide(500);
		$('.slidable', this).hide(500);
		listarrow.src = '/images/system/list_arrow_right.gif';
		this.slidestate = "up";
	}
}

function initReferencesIntro() {
	$('#refintroproducts ul ul').css('display', 'none'); // hide sublists first; will be overridden for MSIE later on
	
	//$('#refintroproducts ul').css('margin-left', '10px');
	$('#refintroproducts ul').addClass('foldable');
	$('#refintroproducts ul ul').removeClass('foldable');
	
	$('#refintroproducts ul li').each(function(){
		if ($('li', this).length > 0) {
			this.slidestate = 'up';
			$(this).prepend('<img src="/images/system/list_arrow_right.gif" class="listarrow" />');
			$(this).click(refIntroProductsToggle);
		}
	});
	
	/* // workaround for MSIE does not work
	if ($.browser.msie) {
		$('#refintroproducts ul ul').wrap('<div></div>');
		$('#refintroproducts ul div').addClass('slidable');
		$('#refintroproducts ul div').prepend('<div style="height: 1px; width: 1px;"></div>');
		$('#refintroproducts ul ul').css('position', 'absolute');
		
		$('#refintroproducts ul div').css('display', 'none'); // msie has to hide DIV
		$('#refintroproducts ul ul').css('display', 'block'); // instead of UL
	} else {*/
		$('#refintroproducts ul ul').addClass('slidable');
	//}
}

$(document).ready(initReferencesIntro);