 
	
	$(document).ready(function(){  

    //get the height and width of the page  
    var window_width = $(window).width();  
	//alert("Window Width" + window_width);
    var window_height = $(window).height();
	//alert("Window Height" + window_height);  
	
	var document_height = $(document).height();
	//alert("Document Height " + document_height);
	$('#mask').css({ 'width' : window_width, 'height' : document_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 = (window_height-modal_height)/2;  
        var left = (window_width-modal_width)/2;  
      
        //apply new top and left css values  
        $(this).css({'top' : top , 'left' : left});  
		show_modal();  
      
    });  
      
        //$('.activate_modal').click(function(){ 
		 
      
              //get the id of the modal window stored in the name of the activating element  
              //var modal_id = $(this).attr('name');  
			  //var playerId = $(this).attr('id');
			  //var player_name = $(this).text();
      
              //use the function to show it  
              show_modal();  

        //});  
		

      
        $('.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(){  
		$('#mask').empty();     
        //set display to block and opacity to 0 so we can use fadeTo  
        $('#mask').css({ 'display' : 'block', opacity : 0});  
      
        //fade in the mask to opacity 0.8  
        $('#mask').fadeTo(500,0.8);  
      
         //show the modal window  
        $('#modalWindow').fadeIn(500);  
		

    }  



