$(document).ready(function() 
{  
	$("#TitleCnt").backgroundCanvas(); 
});

// Draw the background  on load and resize
$(window).load(function () 
{ 
	DrawBackground(); 
});

$(window).resize(function()
{
	DrawBackground(); 
});


function DrawBackground()
{
	$("#TitleCnt").backgroundCanvasPaint(RoundFkt); 

}



function RoundFkt(context, width, height, canvas, $canvas, $canvasDiv, $content, $element ) 
{
		var options = {x:0, height: height, width: width, radius:8,  border: 0 };
		var backgroundGradient = context.createLinearGradient(0, 0, 0, height - 2);
		backgroundGradient.addColorStop(0 ,'#FFF');
		backgroundGradient.addColorStop(1, '#FFF');
		context.fillStyle = "#d5d5d5";
		
		// Draw the blue border rectangle 
		$.canvasPaint.roundedRect(context,options);
		
		// Draw the gradient filled inner rectangle
		options.border = 2;
		context.fillStyle = backgroundGradient; 
		$.canvasPaint.roundedRect(context,options);
}

