//this one works, but throws a single error in IE the first time you hover
var smartHoverBox = function(boxTimer, xOffset, yOffset, smartBoxSuffix, smartBoxClose, hoverShadowSuffix) {

	var smartBoxes = $(document.body).getElements('[id$=' + smartBoxSuffix + ']');
	
	var hoverShadows = $(document.body).getElements('[id$=' + hoverShadowSuffix + ']');
	var closeElem = $(document.body).getElements('.' + smartBoxClose);  
	var closeBoxes = function() { smartBoxes.setStyle('display', 'none'); };
	var hideShadows = function () { hoverShadows.setStyle('display', 'none'); };
	
	closeElem.addEvent('click', function(){ 
		closeBoxes();
		
		// sn // q'n'd solution ... replace with proper one when needed
		document.getElementById("ipm_replacement").setStyles ({display: 'none'})
		// /sn //
		
		}).setStyle('cursor', 'pointer');
	
	var hideShadowsTimer = 0;
	
	smartBoxes.each(function(item){		
		var currentBox = item.getProperty('id');
		currentBox = currentBox.replace('' + smartBoxSuffix + '', '');		 
		item.setStyle('margin', '0'); 
	});

	hoverShadows.each(function(item, i){	

		var currentShadow = item.getProperty('id');
		var currentBox = smartBoxes[i];
		
		currentShadow = currentShadow.replace('' + hoverShadowSuffix + '', ''); 

		$(currentShadow).addEvent('mouseleave', function(){
			// sn // q'n'd solution ... replace with proper one when needed
			if (item.getProperty('id') == "ipm" + hoverShadowSuffix)
			{
				hideShadowsTimer = hideShadows.delay(boxTimer/40);
			}else{
				hideShadowsTimer = hideShadows.delay(boxTimer/4);
			}
			// /sn //
		});	
		
		item.addEvent('mouseleave', function(){
			hideShadowsTimer = hideShadows.delay(boxTimer/4);								  
		});	
		
		$(currentShadow).addEvent('mouseenter', function(){ 
			if($defined(hideShadowsTimer)) $clear(hideShadowsTimer); 
		});
		
		item.addEvent('mouseenter', function(){
			if($defined(hideShadowsTimer)) $clear(hideShadowsTimer);
		}); 		
	
		item.addEvent('click', function(){			
			if (currentBox.className && currentBox.className == 'open') {
				currentBox.setStyles({ display: 'none', position: 'absolute' }).setStyle('z-index', '200000'); 
			}else			{
				currentBox.addClass('open');
				smartBoxes.setStyle('display', 'none');
				currentBox.setStyles({ display: 'block', position: 'absolute' }).setStyle('z-index', '200000'); 
				
			}
		}).setStyle('cursor', 'pointer');
		
		// sn // q'n'd solution ... replace with proper one when needed
		if (item.getProperty('id') == "ipm" + hoverShadowSuffix)
		{
			item.addEvent ('click', function(){
				 document.getElementById("ipm_replacement").setStyles ({display: 'block', position: 'absolute'})
			});
		}else{
			item.addEvent ('click', function(){
				 document.getElementById("ipm_replacement").setStyles ({display: 'none'})
			});
		}
		// /sn //
		
		$(currentShadow).addEvent('mouseenter', function(){					 
			hoverShadows.setStyle('display', 'none');
			item.setStyles({ display: 'block', position: 'absolute' }).setStyle('z-index', '100000'); 							
		}).setStyle('cursor', 'pointer');

	});

}; 
