$(function()
{
	
$("#aboutlogo").click(function(){  
	centerBox();   
	openBox();  
}); 

$("#aboutlogoi").click(function(){  
	centerBox();   
	openBox();  
}); 


//Click the x event!  
$("#boxclose").click(function(){  
	closeBox();  
}); 
 
//Click out event!  
$("#cover").click(function(){  
	closeBox();  
});
  
//Press Escape event!  
$(document).keypress(function(e){  
	if(e.keyCode==27 && boxstat==1){  
	closeBox();  
	}  
});   
	
});

var boxstat = 0;

function openBox(){  
	if(boxstat == 0){  
		$("#cover").css({  
			"opacity": "0.9"  
		});
		  
		$("#cover").fadeIn("slow");  
		$("#box").fadeIn("slow");  
		boxstat = 1;  
	}  
} 

function closeBox(){  
	if(boxstat == 1){  
		$("#cover").fadeOut("slow");  
		$("#box").fadeOut("slow");  
		boxstat = 0;
	}  
}

 
function centerBox(){   
	//var windowWidth = document.documentElement.clientWidth;  
	//var windowHeight = document.documentElement.clientHeight;
	var windowWidth = $(window).width();
  var windowHeight =$(window).height();
  //alert(screen.height);
  
	var boxHeight = $("#box").height();  
	var boxWidth = $("#box").width();  
 
	$("#box").css({  
		"position": "fixed",  
		"top": windowHeight/2-boxHeight/2,  
		"left": windowWidth/2-boxWidth/2 
	}); 
	
	 
	//only need force for IE6 ?   
	//$("#box").css({  
	//	"height": windowHeight  
	//});    
}