$(function() {
	$('#map li>a').click(function() {
		$('div#bubble').remove();
		$('#container ol > li').removeClass('active');
		var bContent = $('#'+$(this).parent().attr('rel')).html();
		$(this).after(
			'<div id="bubble" style="z-index:9999;">' + 
			bContent + 
			'<a class="btn-close" href="#" title="Click to close" ' +
			'onclick="$(this).parent().hide();$(\'#container ol > li\').removeClass(\'active\');return false;">' +
			'<img src="img/style/btn-close.gif" width="16" height="16" alt="Close" /></a>' +
			'<div id="tail" /></div>'
		);
		$(this).siblings('div#bubble').show();
		$(this).siblings('div#bubble').children('.counter').remove();
		$('#'+$(this).parent().attr('rel')).addClass('active');
		return false;
	});
	$('#map li>a').hover(
		function() {$('#'+$(this).parent().attr('rel')).addClass('current');},
		function() {$('#'+$(this).parent().attr('rel')).removeClass('current');}
	);
	$('#container ol li').hover(
		function() {$(this).addClass('current');$('#map li[rel='+$(this).attr('id')+'] a').addClass('active');},
		function() {$(this).removeClass('current');$('#map li[rel='+$(this).attr('id')+'] a').removeClass('active');}
	);
});