<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<title>Whistler</title>
	<script type="text/javascript" src="jquery.js"></script>
	<script type='text/javascript' src='jquery.autocomplete.js'></script>

	<link rel="stylesheet" type="text/css" href="jquery.autocomplete.css" />
	<link rel="stylesheet" type="text/css" href="screen.css" />
</head>

<body>

<div id="tabs"><a id="learn" href="#" onmouseover="learn()"></a><a id="cover_your_tracks" href="#" onmouseover="cover_your_tracks()"></a><a id="tell" href="#" onmouseover="tell()"></a></div>

<script type="text/javascript">
function learn()
{
	document.getElementById('tabs').style.backgroundImage = 'url(learn.png)';

	document.getElementById('learn_screen').style.display = '';
	document.getElementById('route').style.display = 'none';
	document.getElementById('tell_screen').style.display = 'none';
}
function cover_your_tracks()
{
	document.getElementById('tabs').style.backgroundImage = 'url(cover_your_tracks.png)';

	document.getElementById('learn_screen').style.display = 'none';
	document.getElementById('route').style.display = '';
	document.getElementById('tell_screen').style.display = 'none';
}
function tell()
{
	document.getElementById('tabs').style.backgroundImage = 'url(tell.png)';

	document.getElementById('learn_screen').style.display = 'none';
	document.getElementById('route').style.display = 'none';
	document.getElementById('tell_screen').style.display = '';
}
</script>