var morphOVER = function(){
	var image = arguments[0];
	var morphInfo = arguments[1];
	var morphImage = arguments[2];
	var morphBackground = arguments[3];
	var morphOverlay = arguments[4];
	
	morphBackground.start({
		'z-index': 100,
		'padding':25,
		'top':-56, 'left':-63,
		'height': 161, 'width': 150,
		'background-position': '0px 0px'
	}).chain(function() {
		morphInfo.start({
			'opacity':1
		});
		morphOverlay.start({
			'opacity':.75
		});
	});
	
	morphImage.start({
		'height': 161, 'width': 150
	});
	
}

var morphOUT = function(){
	var image = arguments[0];
	var morphInfo = arguments[1];
	var morphImage = arguments[2];
	var morphBackground = arguments[3];
	var morphOverlay = arguments[4];

	morphInfo.start({
		'opacity':0
	});
	
	morphOverlay.start({
		'opacity':0
	});
	
	morphBackground.start({
		'z-index': 0,
		'padding':0,
		'top':0,'left':0,
		'height': 94, 'width': 88,
		'background-position': '-63px -58px'
	}).chain(function() {
		this.set({
			'z-index': 'auto'
		});
	});
	
	morphImage.start({
		'height': 94, 'width': 88
	}).chain(function() {
		this.set({
			'z-index': 'auto'
		});
	});
	
}

var positionOverlay = function() {
	
	var morphOverlay = arguments[0];
	
	var container = document.id('people');
	var pplSize = container.getSize();
	pplSize.y -= container.getStyle('margin-bottom').toInt() - container.getStyle('margin-top').toInt();
	pplSize.x -= container.getStyle('margin-left').toInt() - container.getStyle('margin-right').toInt();
	var pplPosition = container.getPosition();
	
	morphOverlay.set({
		'display': 'block','opacity': 0,
		//'height': pplSize.y,
		'width': pplSize.x,
		'top': pplPosition.y,'left': pplPosition.x
	});
	
}