function visibleHeight() {
	var height = 0;
	if ( typeof( window.innerWidth ) == 'number' ) {
		height = window.innerHeight;
	} else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
		height = document.documentElement.clientHeight;
	} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
        height = document.body.clientHeight;
	}
	return height;
}

$(document).ready(function()
{
/* 	tubular */
    //$('body').tubular('2X4s3D7xPUQ','wrapper'); // where someYTid is the YouTube ID and wrapper is your containing DIV.

	$(".reference li a").mouseover(function()
	{
		$(this).dequeue().animate(
		{
			paddingLeft: 4
		}, 100);
	});
	
	$(".reference li a").mouseout(function()
	{
		$(this).dequeue().animate(
		{
			paddingLeft: 0
		}, 100);
	});
	
	$(".color").mouseover(function()
	{
		$(this).dequeue().animate(
		{
			paddingTop: 8
		}, 100);
	});
	
	$(".color").mouseout(function()
	{
		$(this).dequeue().animate(
		{
			paddingTop: 0
		}, 100);
	});
	
	
	var i = 0;
	
	$(".reference li").each(function()
	{
		i++;
		$(this).dequeue().delay(100 * i).animate(
		{
			paddingLeft: 4
		}, 200, function ()
		{
			$(this).dequeue().animate(
			{
				paddingLeft: 0
			}, 200);
		});
	});
	
	
	$("#name-3d").show();
	
	$(document).scroll(function()
	{
		var offsetTop = $("body").scrollTop();
		var bodyHeight = $("body").height();
		var number = Math.round((offsetTop/bodyHeight) * 8);
		var top = (offsetTop + (visibleHeight()/2));
		$("#name-3d").dequeue().animate({ top: top }, 300);
		//
		$("#name-3d .red-3d").css("padding-left", number + "px");
		$("#name-3d .green-3d").css("padding-left", (2 * number) + "px");
		$("#name-3d .blue-3d").css("padding-left", (3 * number) + "px");
	});
	
	$("#name-3d").mouseover(function()
	{
		var i = 0;
		$(this).children().each(function()
		{
			i++;
			$(this).dequeue().animate(
			{
				paddingLeft: 2 * i
			}, 200)
		});
	});
	
	$("#name-3d").mouseout(function()
	{
		$(this).children().each(function()
		{
			$(this).dequeue().animate(
			{
				paddingLeft: 0
			}, 200)
		});
	});
	
	var offsetTop = $("body").scrollTop();
	var top = (offsetTop + (visibleHeight()/2));
	$("#name-3d").css("top", top + "px");
});