$(document).ready(function () {

	//transitions
	//for more transition, goto http://gsgd.co.uk/sandbox/jquery/easing/
	var style = 'jswing';
	var duration = 500;
	
	//Retrieve the selected item position and width
	var default_left = Math.round($('#menu li.selected').offset().left - $('#menu ul').offset().left)+13;
	var default_width = $('#menu li.selected').width()+15;

	//Set the floating bar position and width
	$('#box').css({left: default_left});
	$('#box .head').css({width: default_width});

	//if mouseover the menu item
	$('#menu ul li').hover(function () {				
		
		//Get the position and width of the menu item
		left = Math.round($(this).offset().left - $('#menu ul').offset().left)+13;
		width = $(this).width()+15; 

		//Set the floating bar position, width and transition
		$('#box').stop(false, true).animate({left: left},{duration:duration, easing: style});	
		$('#box .head').stop(false, true).animate({width:width},{duration:duration, easing: style});	
	
	//if user click on the menu
	}).click(function () {
		
		//reset the selected item
		$('#menu li').removeClass('selected');	
		
		//select the current item
		$(this).addClass('selected');

	});
	
	//If the mouse leave the menu, reset the floating bar to the selected item
	$('#menu').mouseleave(function () {

		//Retrieve the selected item position and width
		default_left = Math.round($('#menu li.selected').offset().left - $('#menu ul').offset().left)+13;
		default_width = $('#menu li.selected').width()+15;
		
		//Set the floating bar position, width and transition
		$('#box').stop(false, true).animate({left: default_left},{duration:duration, easing: style});	
		$('#box .head').stop(false, true).animate({width:default_width},{duration:duration, easing: style});		
		
	});
	
	// OTHER SCRIPTS
	
	
			$("img.glow").css('margin-left',($(window).width() - 990)/2 - 80);
			if ($.browser.mozilla ||$.browser.opera || ($.browser.msie && $.browser.version >= 9 ) ) $("#content").css("margin-left", "0px" );
	
});