$.fn.DIV2Box = function(options)
{
	var timestamp = new Date().getTime();
	var settings = {
		header: ($("span:first-child", this).length == 1)? $("span:first-child", this).remove().html(): "&nbsp;",
		footer: ($("span:last-child", this).length == 1)? $("span:last-child", this).remove().html(): "&nbsp;",
		startColor: "D7D7D7",
		endColor: ($(this).css("background-color") == "transparent")? "FFFFFF": $(this).css("background-color"),
		cornerSize: "10"
	}

	if(options)
		jQuery.extend(settings, options);

	// Leave color in Hex format (without starting #)
	settings.startColor = new RGBColor(settings.startColor).toHex().substr(1);
	settings.endColor = new RGBColor(settings.endColor).toHex().substr(1);

	var content_gradient_length = parseInt(settings.cornerSize); // ??????????????

	// Generate layer IDs
	var header_id = "#header_" + timestamp;
	var footer_id = "#footer_" + timestamp;
	var content_id = "#content_" + timestamp;
	var top_gradient_id = "#topgrad_" + timestamp;
	var bottom_gradient_id = "#bottomgrad_" + timestamp;

	// Create auxiliar layers:
	//		- blank_div: to avoid low bottom margin
	//		- top_gradient_div: to show partial top gradient not included in header
	//		- bottom_gradient_div: to show partial bottom gradient not included in footer
	var blank_div = "<div class=\"boxBlank\"></div>";
	var top_gradient_div = "<div id=\"" + top_gradient_id.substr(1) + "\" style=\"height: " + content_gradient_length + "px\"></div>";
	var bottom_gradient_div = "<div id=\"" + bottom_gradient_id.substr(1) + "\" style=\"height: " + content_gradient_length + "px\"></div>";

	// Create header, footer and content layers
	var header_div = "<div id=\"" + header_id.substr(1) + "\" class=\"boxHeader\"><span>" + settings.header + "</span></div>";
	var footer_div = "<div id=\"" + footer_id.substr(1) + "\" class=\"boxFooter\">" + settings.footer + "</div>";
	var content_div = "<div id=\"" + content_id.substr(1) + "\" class=\"boxContent\">" + 
					  top_gradient_div + 
					  $(this).html() + 
					  blank_div + 
					  bottom_gradient_div + "</div>";

	// Compose the box!
	$(this).html(header_div + content_div + footer_div);

	// Transfer background color to content
	$(content_id).css("background-color", $(this).css("background-color"));
	$(this).css("background", "transparent");

	// Calculate colors for gradients and borders
	var transition_color = getTransitionColors(settings.startColor, settings.endColor, $(header_id).height());
	var header_gradient_endcolor = transition_color['hf_gradient'];

	// Add borders to content
	$(content_id)
		.css("border-left", "1px solid " + transition_color['content_border'])
		.css("border-right", "1px solid " + transition_color['content_border']);

	
	// Apply top round corners and gradient to Header div
	$(header_id)
		.corner("top " + settings.cornerSize + "px")
		.gradient(
		{
			from:      settings.startColor,
			to:        header_gradient_endcolor,
			direction: 'horizontal'
		});

	// Apply gradient and bottom round corners to Footer div
	$(footer_id)
		.gradient(
		{
			from:      transition_color['hf_gradient'],
			to:        settings.startColor,
			direction: 'horizontal'
		})
		.corner("bottom " + settings.cornerSize + "px");

	// Apply partial top gradient
	$(top_gradient_id)
		.gradient(
		{
			from:      transition_color['content_gradient'],
			to:        settings.endColor,
			direction: 'horizontal',
			length: content_gradient_length
		});
	
	// Apply partial bottom gradient
	$(bottom_gradient_id)
		.gradient(
		{
			from:      settings.endColor,
			to:        transition_color['hf_gradient'],
			direction: 'horizontal',
			length: content_gradient_length
		});
}
