$(function() {

		var bar = $("#hSC");
		var bar_ch = $("#hSC ul.hsc li");

		var top = bar.css('top');

		$(window).scroll(function() {

			if($(this).scrollTop() > 1) {
				
				//bar.hide();

				bar.stop().animate({'top' : '-50px'}, 100);
				$('body').stop().animate({'margin-top' : '-50px'}, 300);

			} else {

				//bar.show();
				bar.stop().animate({'top' : top}, 100);
				$('body').stop().animate({'margin-top' : '0px'}, 00);

			}

		});
		
		bar_ch.hover(function() {
			$(this).css({'z-index' : '1000'}); /*Add a higher z-index value so this image stays on top*/ 
			$(this).find('img').addClass("hover").stop() /* Add class of "hover", then stop animation queue buildup*/
				.animate({
					marginTop: '0px', /* The next 4 lines will vertically align this image */ 
					marginLeft: '-50px',
					top: '50%',
					right: '50%',
					width: '200px', /* Set new width */
					height: '110px', /* Set new height */
					padding: '20px'
				}, 200); /* this value of "200" is the speed of how fast/slow this hover animates */
		
			} , function() {
			$(this).css({'z-index' : '0'}); /* Set z-index back to 0 */
			$(this).find('img').removeClass("hover").stop()  /* Remove the "hover" class , then stop animation queue buildup*/
				.animate({
					marginTop: '0', /* Set alignment back to default */
					marginLeft: '0',
					top: '0',
					left: '0',
					width: '82px', /* Set width back to default */
					height: '45px', /* Set height back to default */
					paddingTop: '1px',
					paddingLeft: '20px',
					paddingRight: '20px',
					paddingBottom: '1px',
				}, 400);
		});

	});