function init(){
	var imgs = $('bios').getElementsByTagName("a");
	
	//a note on the myTips2 - these are for the tooltips in which the employee has a really
	//long name or title so the box needs less margins to display all the information correctly.
	
	
	var myTips2 = new Tips($$('.bioImages a.alt'),{className: 'hugeNameAndTitle', offset: {'x': -10, 'y': 50}, windowPadding:{x:0, y:-120}, fixed: true});
	var myTips = new Tips($$('.bioImages a'),{className: 'biotooltip', offset: {'x': -10, 'y': 50}, windowPadding:{x:0, y:-120}, fixed: true});
		
	
	
	
	
	
	for (i=0; i<imgs.length; i++){
		imgs[i].id = i + "_img";
		image = $(imgs[i].id).getElementsByTagName('img')[0];
		image.id = i + "_i";
		
		imgs[i].style.zIndex = 0;
		image.style.zIndex = 0;
		
		//this is for displaying the name and title
		var tts = image.alt.split(': ');
		imgs[i].store('tip:title', tts[0]);
		imgs[i].store('tip:text', tts[1]);
		
		//find out of the image matches the page we're on
		var file = getFilename();
		file = file.substr(0, file.lastIndexOf("."));
		imgsrc = image.src.substr(image.src.lastIndexOf("/")+1);
		imgsrc = imgsrc.substr(0, imgsrc.lastIndexOf("_"));
		
		//set classname to ON and ON image if the file and src match
		//otherwise create the src changer
		if((file == imgsrc)){
			imgs[i].className == "on";
			image.src = image.src.substr(0, image.src.lastIndexOf("_")) + ".jpg";
		} else{
		
			$(image.id).addEvents({
				'mouseenter': function(){
					newsrc = this.src.substr(0, this.src.lastIndexOf("_")) + ".jpg";
					this.src = newsrc;
					this.style.zIndex = 10;
				},
				'mouseleave': function(){
					newsrc = this.src.substr(0, this.src.lastIndexOf(".")) + "_bw.jpg";
					this.src = newsrc;
					this.style.zIndex = 0;
				}
			});
		}	
	}
}

//when the dom is ready, call the init() function
window.addEvent('domready',init);