// JavaScript Document
Event.observe(window, 'load', function() {
	// animation for the alpha button
	var aniAlpha = new Animator({
		onCompleteState: 0,
		onComplete: function() { $('alpha').setStyle({ backgroundPosition: 'left top' }); }
	}).addSubject( new CSSStyleSubject( $('alpha'), 'closed-alpha', 'opened-alpha' ) );
	$('alpha').onmouseover = function(){
		$('alpha').setStyle({ backgroundPosition: 'left -94px' });
		aniAlpha.seekTo(1);
	};
	$('alpha').onmouseout = function(){
		aniAlpha.seekTo(0);
	};
	// animation for the northstar button
	var aniNorth = new Animator({
		onCompleteState: 0,
		onComplete: function() { $('northstar').setStyle({ backgroundPosition: 'left top' }); }
	}).addSubject( new CSSStyleSubject( $('northstar'), 'closed-northstar', 'opened-northstar' ) );
	$('northstar').onmouseover = function(){
		$('northstar').setStyle({ backgroundPosition: 'left -93px' });
		aniNorth.seekTo(1);
	};
	$('northstar').onmouseout = function(){
		aniNorth.seekTo(0);
	};
	// animation for the corporate button
	var aniCorp = new Animator({
		onCompleteState: 0,
		onComplete: function() { $('corporate').setStyle({ backgroundPosition: 'left top' }); }
	}).addSubject( new CSSStyleSubject( $('corporate'), 'closed-corporate', 'opened-corporate' ) );
	$('corporate').onmouseover = function(){
		$('corporate').setStyle({ backgroundPosition: 'left -94px' });
		aniCorp.seekTo(1);
	};
	$('corporate').onmouseout = function(){
		aniCorp.seekTo(0);
	};
	
	
	// animation for the corporate_ button
	var aniCorp_ = new Animator({
		onCompleteState: 0,
		onComplete: function() { $('corporate_').setStyle({ backgroundPosition: 'left top' }); }
	}).addSubject( new CSSStyleSubject( $('corporate_'), 'closed-corporate_', 'opened-corporate_' ) );
	$('corporate_').onmouseover = function(){
		$('corporate_').setStyle({ backgroundPosition: 'left -93px' });
		aniCorp_.seekTo(1);
	};
	$('corporate_').onmouseout = function(){
		aniCorp_.seekTo(0);
	};
});