var dialogLogin = new Class ({
							 
	options: {
		bgcolor: '#333333'
	},
	
	initialize: function(options) {
		var dWidth = window.getScrollWidth();
		var dHeight = window.getScrollHeight();
		this.overdiv = new Element('div', {
			'styles': {
				'width': dWidth,
				'height': dHeight,
				'background': this.options.bgcolor,
				'opacity': 0,
				'position': 'absolute',
				'z-index': '1',
				'top': 0,
				'left': 0
			},
			'id': 'div-overlay'
		});
		this.logindiv = new Element('div', {
			'styles': {
				'opacity': 1,
				'position': 'absolute',
				'left': (dWidth/2) - (349/2),
				'top': (window.getHeight()/2) - (137/2),
				'z-index':2
			},
			'id': 'div-login'
		});
		this.logindiv.setHTML('<table width="349" height="137" border="1" bordercolor="#CCCCCC">' +
							  '<tr><td bgcolor="#FFFFFF"><table width="100%" border="0" align="center">' +
							  '<tr><th bgcolor="#839639"><div align="left"><strong>Login to Your Account </strong></div></th>' +
							  '</tr><tr><td><strong>Username: <input type="text" name="textfield" /></strong></td></tr>' +
							  '<tr><td><strong>Password: <input type="text" name="textfield2" /></strong></td></tr>' +
							  '<tr><td>&nbsp;</td></tr><tr>' +
							  '<td><div align="right"><strong>Forgot your Password?</strong> | ' +
							  '<input type="submit" name="Submit" value="Login" />' +
							  '<input type="submit" name="Submit2" value="Cancel" />' +
							  '</div></td></tr></table></td></tr></table>');
		
		this.overdiv.addEvent('click', function() { $('div-overlay').remove(); $('div-login').remove(); });
		overEffect = new Fx.Styles(this.overdiv, {duration: 500});
		loginEffect = new Fx.Styles(this.logindiv, {duration: 500});
	},
	
	show: function() {
		this.overdiv.injectTop(document.body);
		this.logindiv.injectInside(document.body);
		overEffect.start({
			'opacity': [0,.75]
		});
		loginEffect.start({
			'opacity': [0,1]
		});
	},
	
	hide: function() {
		this.remove();
	}
	
});