$(document).ready(function(){
	$('.codeOff').mouseover(function(){
		$($('b', this)).css('display', 'inline');
	});
	
	$('.codeOff').mouseout(function(){
		$($('b', this)).css('display', 'none');
	});
	
	$('.codeHolder').click(function(){
		//change button and voucher scratch panel thingy to be off state
		$('.clickForCode', this).addClass('enterCode');
		$('.codeOff', this).addClass('codeOn');
		$('.clickForCode', this).removeClass('clickForCode');
		$('.codeOff', this).removeClass('codeOff');
		
		//remove event binds, otherwise it still fires even though the class has changed.
		$('.codeOn', this).unbind();
		
		//replace the <a> tag so the voucher code can be copied
		$('.codeOn', this).replaceWith($('<div class="codeOn">'+$('.codeOn', this).html()+'</div>'));
		
		//unhide the code
		$('b', this).css('display', 'inline');
		
		//display 'site has opened' text
		$('.newWindowText', $(this).parent()).fadeIn('slow');
	});

})