var Old =					'Webdesign';		// Name of the current visible layer

var New =					'';							// Name of the layer to be made visible

var Count = 			100;						// Opacity level of layer

var Direction = 	'Down';					// Direction of fade

var Locked = 			'No';						// Locks functionality until transitiion is complete



function fadeOut(New) {

	if (Old != New) {

		if (Locked == 'No') {

			Locked = 'Yes';

		}

		document.getElementById(Old+'Tab').className = '';

		document.getElementById(New+'Tab').className = 'Selected';

		if ((Count > 0) && (Direction == 'Down')) {

			Count = Count - 10;

			document.getElementById(Old+'Info').style.opacity = Count/100;

			document.getElementById(Old+'Info').style.filter = 'alpha(opacity=' + Count + ')';

			setTimeout("fadeOut('" + New + "')", 10);

		} else {

			Direction = 'Up';

			document.getElementById(Old+'Info').style.display = 'none';

			setTimeout("fadeIn('" + New + "')", 10);

		}

	}

}

function fadeIn(New) {

	if ((Count < 100) && (Direction == 'Up')) {

		document.getElementById(New+'Info').style.display = 'block';

		Count = Count + 10;

		document.getElementById(New+'Info').style.opacity = Count/100;

		document.getElementById(New+'Info').style.filter = 'alpha(opacity=' + Count + ')';

		setTimeout("fadeIn('" + New + "')", 10);

	} else {

		Direction = 'Down';

		Old = New;

		Locked = 'No';

	}

}