var Box = new Class({
										
  initialize: function(){
		  this.overlay = $('overlay');
			this.centerBox = $('center-box');
			
		  this.overlay.setStyles({
					'position' : 'absolute',
					'top' : 0,
					'left' : 0,
					'width' : 1,
					'height' : 1,
					'opacity' : 0,
					'background-color' : '#000000',
					'cursor' : 'pointer'
			});
			
			this.overlayFx = new Fx.Style('overlay', 'opacity', { duration: 200, wait: false });
			
			this.tableFx = new Fx.Style('center-box', 'opacity', { duration: 300 });
			this.tableFx.set(0);
			
			this.centerBox.setStyle('display', 'block');
			
			this.overlay.addEvent('click', function(event){
				var event = new Event(event);
				event.stop();
				this.destroyOverlay();
			}.bind(this));
			
			this.closeButton = $('close');
			this.closeButton.addEvent('click', function(event){
				var event = new Event(event);
				event.stop();
				this.destroyOverlay();
			}.bind(this));
	},
	
	createOverlay: function(){
		this.overlay.setStyles({
				'width' : window.getWidth(),
				'height' : window.getScrollHeight()
		});
		this.centerBox.setStyles({
		  'top': '50%',
			'left': '50%'
		});
		this.overlayFx.set(0.7);
		this.tableFx.set(1);
	},
	
	destroyOverlay: function(){
		this.overlayFx.set(0);
		this.tableFx.set(0);
		this.centerBox.setStyles({
		  'top': '-10000px',
			'left': '-10000px'
		});
	}

});

function initBox(){ myBox = new Box() };