(function($) {
	var $id = 'loginbox' + parseInt(Math.random()*1e12);
	var $back = {};
    $(document).ready(function(){
	$('#top-login > a')
		.click(function() {
			if ($('#' + $id).length == 0) {
				$back = $('<div id="' + $id + '" style="position:fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; background: black; opacity: 0.0; z-index: 90; display: none;"></div>')
				.appendTo($('body'))
			} else {
				$back = $('#' + $id)
			}
			var $handler = function() {
				$(this)
					.unbind('click', $handler)
					.animate({'opacity': 0}, 300, function(){$(this).hide()})					
				.end()

				$('#top-login-login')
					.animate({'opacity': 0}, 300, function(){$(this).hide()})
				.end()
			}

			$back
				.css({'opacity': 0})
				.show()
				.animate({'opacity': 0.3}, 300)
				.bind('click', $handler)
			.end()

			$('#top-login-login')
				.css({'opacity': 0})
				.show()
				.animate({'opacity': 1}, 300)
			.end()

		})
	.end()
    })
}(jQuery))