Event.observe(window, 'load', function()
{
	Event.observe('studio', 'click', function()
	{
		// Turn text red
		$('studio').toggleClassName('active');

		if ($('projects_sub').visible())
		{
			$('projects').toggleClassName('active');
			Effect.BlindUp('projects_sub', { duration: 0.6 });
			Effect.Fade('clients_sub', { duration: 0.6 });
			Effect.Fade('websites_sub', { duration: 0.6 });
			Effect.toggle('studio_sub', 'blind', { duration: 0.6, delay: 0.6 });
		}
		else
		{
			Effect.toggle('studio_sub', 'blind', { duration: 0.6 });
		}

	});

	Event.observe('projects', 'click', function()
	{
		// Turn text red
		$('projects').toggleClassName('active');

		if ($('studio_sub').visible())
		{
			$('studio').toggleClassName('active');
			Effect.BlindUp('studio_sub', { duration: 0.6 });
			Effect.toggle('projects_sub', 'blind', { duration: 0.6, delay: 0.6 });
		}
		else
		{
			if ($('clients_sub').visible())
			{
				Effect.Fade('clients_sub', { duration: 0.6 });
				Effect.toggle('projects_sub', 'blind', { duration: 0.6, delay: 0.6 });
			}
			else if ($('websites_sub').visible())
			{
				Effect.Fade('websites_sub', { duration: 0.6 });
				Effect.toggle('projects_sub', 'blind', { duration: 0.6, delay: 0.6 });
			}
			else
			{
				Effect.toggle('projects_sub', 'blind', { duration: 0.6 });
			}
		}
	});

	Event.observe('clients', 'click', function()
	{
		if ($('websites_sub').visible())
		{
			Effect.Fade('websites_sub', { duration: 0.6 });
			Effect.toggle('clients_sub', 'appear', { duration: 0.6, delay: 0.6 });
		}
		else
		{
			Effect.toggle('clients_sub', 'appear', { duration: 0.6 });
		}
	});
	
	Event.observe('websites', 'click', function()
	{
		if ($('clients_sub').visible())
		{
			Effect.Fade('clients_sub', { duration: 0.6 });
			Effect.toggle('websites_sub', 'appear', { duration: 0.6, delay: 0.6 });
		}
		else
		{
			Effect.toggle('websites_sub', 'appear', { duration: 0.6 });
		}
	});
});

