$(document).ready(function() {	

	//Background color, mouseover and mouseout
	var colorOver = '#31b8da';
	var colorOut = '#1f1f1f';

	//Padding, mouseover
	var padLeft = '20px';
	var padRight = '20px';
	
	//Default Padding
	var defpadLeft = $('#homesideNavMain ul li a').css('paddingLeft');
	var defpadRight = $('#homesideNavMain ul li a').css('paddingRight');
		
	//Animate the LI on mouse over, mouse out
	$('#homesideNavMain ul li').click(function () {	
		//Make LI clickable
		window.location = $(this).find('a').attr('href');
		
	}).mouseover(function (){
		
 
	}).mouseout(function () {
	
		 
	});	
	
	
	
	
	
	
	
	
	
	
	//Scroll the menu on mouse move above the #sidebar layer
	$('#homesideNavMain ul').mousemove(function(e) {

		//Sidebar Offset, Top value
		var s_top = parseInt($('#homesideNav').offset().top + 30);		
		
		//Sidebar Offset, Bottom value
		var s_bottom = parseInt($('#homesideNav').height() + s_top );
	
		//Roughly calculate the height of the menu by multiply height of a single LI with the total of LIs
		var mheight = parseInt($('#homesideNavMain ul ').height() * $('#homesideNavMain ul ').length) + 1900;
	
		//I used this coordinate and offset values for debuggin
		//$('#debugging_mouse_axis').html("X Axis : " + e.pageX + " | Y Axis " + e.pageY);
		//$('#debugging_status').html(Math.round(((s_top - e.pageY)/100) * mheight / 2));
			
		//Calculate the top value
		//This equation is not the perfect, but it 's very close	
		var top_value = Math.round(( (s_top - e.pageY) / 600) * mheight  / 8);
		
		//Animate the #menu by chaging the top value
		$('#homesideNavMain ul.mainSideNav').animate({top: top_value}, { queue:false, duration:700});
	});


	$('#homesideNavMain').mouseleave(function(e) {

		//alert("sasd");
		 $('#homesideNavMain ul').animate({top:0}, { queue:false, duration:1500});

	});
	


	
});