var subNav = {
	
	init : function(page, header){
		
		subNav.initSubNavAbout(page, header);
		
	},
	
	slide : function(array){
		
		var timer = 0;
		
		var slidefxs = [];
		
		array.each(function(el, i){
			timer += 250;
			slidefxs[i] = new Fx.Slide(el, {
				duration: 400,
				wait: false,
				mode: 'horizontal'
			});
			slidefxs[i].hide();
			slidefxs[i].slideIn.delay(timer, slidefxs[i], 0);

		}, this);
	},
	
	initSubNavAbout: function(page, header){
		this.menu=$('subnavabout');
		var div=document.createElement('div');
		div.setAttribute('id', 'subnavaboutBack');
		div.style.zIndex="0";
		div.innerHTML="";
		$('container').appendChild(div);
		this.back = $('subnavaboutBack');
		
		if(header == 'subnav_') {
			this.current = $('subnav_careers');
		} else {
			this.current = $(header);
		}		
		
		this.page=page;
		subNav.setCurrent(this.page, this.current);
		subNav.attachEvents(this.current);
	
	},
	
	setCurrent: function(page, curr){
		//IE & Firefox are off in the top property. Big surprise. This accounts for it.
		if (page=='about') {	
			this.offTop = 18;
		} else {
			if(window.ie7) {
				this.offTop = 42;
			}
			if (window.ie6) {
				this.offTop = -588;
			};
		}
		if(this.offTop == null) {
				this.offTop = 107;
		};
		
		this.back.setStyles({left: (getLeft(curr)+(curr.offsetWidth/2))+'px', width: '0', top: (getTop(curr)+this.offTop)+'px'});
		
		this.grow=new Fx.Styles(this.back, {duration: 400});
		this.grow.start({
						'left': (getLeft(curr)+7)+'px',
						'width': (curr.offsetWidth-15)+'px'						
						});
	},
			
	moveBg: function(el){
		this.over=el;
		if(this.effect) this.effect.stop();
		this.effect=new Fx.Styles('subnavaboutBack', {duration: 600, transition: Fx.Transitions.circOut});
		this.effect.start({
						  'left': (getLeft(this.over)+7),
						  'width': (this.over.offsetWidth-15),
						  'height': 2
						  });
	},
	
	returnBg: function(el){
		if(this.effect) this.effect.stop();
		this.effect=new Fx.Styles('subnavaboutBack', {duration:600, transition: Fx.Transitions.circIn});
		this.effect.start({
						  'left': (getLeft(this.current)+7),
						  'width': (this.current.offsetWidth-15),
						  'height': 3
						  });
	},
	
	attachEvents: function(curr){
		items=$('subnavabout').getElements('li');
		items.each(function(i){
			
				i.addEvent('mouseover', function(){
						subNav.moveBg(i);
												 });
				i.addEvent('mouseout', function(){
						subNav.returnBg(i);
												});
			});
	}
};