//Begin main navigation bar
window.addEvent('domready', function(){ //This function must wrap everything that
	//That needs to be called when the dom loads.

	//	alert('the dom is ready');
	
	//Mouse-over color change BEGIN
	var list = $$('#kwicks .unselected');
	list.each(function(element) {

		var fx = new Fx.Styles(element, {duration:200, wait:false});


		element.addEvent('mouseenter', function(){
			fx.start({
				'background-color': '#eee',
				'color': '#FF0000'
			});

		});

		element.addEvent('mouseleave', function(){
			fx.start({
				'background-color': '#C0C0C0',
				'color': '#000'
			});
		});
	});
	//Mouse-over color change END
	//Mouse-over image opacity change BEGIN
	var list = $$('#kwicks .unselected img');
	list.each(function(element) {

		var fx = new Fx.Styles(element, {duration:200, wait:false});


		element.addEvent('mouseenter', function(){
			fx.start({
				'opacity': '1.0'				
			});

		});

		element.addEvent('mouseleave', function(){
			fx.start({
				'opacity': '0.70'
			});
		});
	});
	//Mouse-over image opacity change END

	//Begin Products navigation bar
	//Begin kwicks style list

	//	var szNormal = 80;
	//	var szFull = 110;
	//	var szSmall = 75;
	var szNormal = 86; // 87 w/ no borders
	var szFull = 100;  // 105 w/ no borders -- 104
	var szSmall = 84; // 84 w/ no borders -- 82

	var kwicks = $$("#kwicks .unselected");
	var fx = new Fx.Elements(kwicks, {wait: false, duration: 175, transition: Fx.Transitions.Back.easeOut});
	kwicks.each(function(kwick, i) {
		kwick.addEvent("mouseenter", function(event) {
			var o = {};
			o[i] = {width: [kwick.getStyle("width").toInt(), szFull]}
			kwicks.each(function(other, j) {
				if(i != j) {
					var w = other.getStyle("width").toInt();
					if(w != szSmall) o[j] = {width: [w, szSmall]};
				}
			});
			fx.start(o);
		});
	});

	$("kwicks").addEvent("mouseleave", function(event) {
		var o = {};
		kwicks.each(function(kwick, i) {
			o[i] = {width: [kwick.getStyle("width").toInt(), szNormal]}
		});
		fx.start(o);
	});

});