(function($) {

$.fn.kToggleBox = function(options) {
	options = $.extend({
		duration: 350,
		opener: null,
		offset: 10
	}, options);
	
	var $body = $(this);
	var content = $body.html();
	var initialTop = parseInt($body.css('top'), 10);
	var opened = false;
	
	$body.addClass('box').html(''
		+ '<div class="tl"></div>'
		+ '<div class="tm"></div>'
		+ '<div class="tr"></div>'
		+ '<div class="ml"></div>'
		+ '<div class="mm">' + content + '</div>'
		+ '<div class="mr"></div>'
		+ '<div class="bl"></div>'
		+ '<div class="bm"></div>'
		+ '<div class="br"></div>'
		+ '<div class="bb"></div>'
		+ '<div class="cb"></div>'
	)
	.hide();
	
	$body.children('.cb').click(function() { close(); return false; });
	
	if (options.opener) {
		$(options.opener).click(function() { open(); return false; });
	}
	
	function open() {
		//debugger;
		if (!opened) {
			$body
				.show()
				.css({ opacity: 0, top: $body[0].offsetTop }) // lol, safari fix :D
				.animate({
					opacity: 1.0,
					top: $body[0].offsetTop - options.offset
				});
			opened = true;
			//console.info($body[0].offsetTop);
			//console.info($body[0].offsetParent);
		}
	}
	
	function close() {
		if (opened) {
			$body
				.animate({
					opacity: 0.0,
					top: $body[0].offsetTop + options.offset
				}, { complete: function() { $body.hide(); } });
			opened = false;
		}
	}
};

})(jQuery);