$(document).ready(function() {
	$('#tooltip').addClass('small');
	$('#tooltip .tooltip-content').append('<div class="peak"></div>');
	var tooltipHeight = $('#tooltip').outerHeight();
	$('#tooltip-layer').css({ position: 'absolute', zIndex: '100' }).hide().remove().clone().prependTo('body');

	$('#chooseDrawEuro').focus(function () {
		var self = $(this);
		// delay so height is calculated properly - allows error check to run first
		setTimeout(function() {
			var position = self.offset();
			$('#tooltip-layer').css({ top: position.top - tooltipHeight - self.outerHeight() * 1.5 + 'px', left: position.left - 10 + 'px' });
			$('#tooltip .peak').show();
			($.browser.msie) ? $('#tooltip-layer').show() : $('#tooltip-layer').fadeIn('slow');
		}, 100);
		return false;
	});
	
	$('#chooseDrawEuro').blur(function () {
		($.browser.msie) ? $('#tooltip-layer').hide() : $('#tooltip-layer').fadeOut('slow');
		return false;
	});
});