$(document).ready(function(){  
   
		 //get the height and width of the page  
	var window_width = $(window).width();  
	var window_height = $(window).height();  
	   
	//vertical and horizontal centering of modal window(s)  
	/*we will use each function so if we have more then 1 
	modal window we center them all*/  
	$('.modal_window').each(function(){  
		   
		//get the height and width of the modal  
		var modal_height = $(this).outerHeight();  
		var modal_width = $(this).outerWidth();  
		   
		//calculate top and left offset needed for centering  
		var top = 131;  
		var left = 0;  
		   
		//apply new top and left css values  
		$(this).css({'top' : top , 'left' : left});  
			   
	});  
		 
	show_modal('goodbye_window');  
   
	$('.close_modal').click(function(){  
		//use the function to close it  
		close_modal();  	   
	});  
   
});  
   
 //THE FUNCTIONS  
   
function close_modal(){  
   
	//hide the mask  
	$('#mask').fadeOut(500);  
   
	//hide modal window(s)  
	$('.modal_window').fadeOut(500);  
   
}  

function show_modal(modal_id){  
   
	//set display to block and opacity to 0 so we can use fadeTo  
	$('#mask').css({ 'display' : 'block', opacity : 0, 'height': $(document).height()});  
   
	//fade in the mask to opacity 0.8  
	$('#mask').fadeTo(500,0.8);     
     
	//$('#'+modal_id).css({'width' : '100%'}).fadeIn(500);
	//show the modal window  
	$('#'+modal_id).css({'width' : '100%'}).fadeIn(500,function(){
		setTimeout(function(){
			$('.modal_window,#mask').fadeOut();    		 
		},8000);
	});
}