function loadBordersAndCornersDecoration(elementId,imagesDirectoryPath,size){
	
	var element = document.getElementById(elementId);
	var content = element.innerHTML;
		
	//its very important to set content padding to zero before get back its width
	var contentPadding = getStyle(elementId,"paddingTop") + " " + getStyle(elementId,"paddingRight") + " " + getStyle(elementId,"paddingBottom") + " " + getStyle(elementId,"paddingLeft");
	element.style.padding = "0px 0px 0px 0px";
	
	var backgroundArray = document.createElement("table");
	var tbody = document.createElement("tbody");
	backgroundArray.appendChild(tbody);
	
	var firstRow = document.createElement("tr");
	var secondRow = document.createElement("tr");
	var thirdRow = document.createElement("tr");
	
	var TLCorner = document.createElement("td");
	var TBorder = document.createElement("td");
	var TRCorner = document.createElement("td");
	var LBorder = document.createElement("td");
	var contentCell = document.createElement("td");
	var RBorder = document.createElement("td");
	var BLCorner = document.createElement("td");
	var BBorder = document.createElement("td");
	var BRCorner = document.createElement("td");
	
	TLCorner.style.backgroundImage = "url(" + imagesDirectoryPath + "/TLCorner.png)";
	TBorder.style.backgroundImage = "url(" + imagesDirectoryPath + "/TBorder.png)";
	TRCorner.style.backgroundImage = "url(" + imagesDirectoryPath + "/TRCorner.png)";
	LBorder.style.backgroundImage = "url(" + imagesDirectoryPath + "/LBorder.png)";
	RBorder.style.backgroundImage = "url(" + imagesDirectoryPath + "/RBorder.png)";
	BLCorner.style.backgroundImage = "url(" + imagesDirectoryPath + "/BLCorner.png)";
	BBorder.style.backgroundImage = "url(" + imagesDirectoryPath + "/BBorder.png)";
	BRCorner.style.backgroundImage = "url(" + imagesDirectoryPath + "/BRCorner.png)";
	
	backgroundArray.style.margin = "0";
	backgroundArray.cellSpacing = "0";
	backgroundArray.cellPadding = "0";
	backgroundArray.height = element.offsetHeight;
	backgroundArray.width = element.offsetWidth;
	contentCell.style.padding = contentPadding
	element.innerHTML = "";
	
	TLCorner.width = size;
	TLCorner.height = size;
	TRCorner.width = size;
	TRCorner.height = size;
	BLCorner.width = size;
	BLCorner.height = size;
	BRCorner.width = size;
	BRCorner.height = size;
	TBorder.height = size;
	BBorder.height = size;
	LBorder.width = size;
	RBorder.width = size;
	
	contentCell.innerHTML = content;
	
	firstRow.appendChild(TLCorner); firstRow.appendChild(TBorder); firstRow.appendChild(TRCorner);
	secondRow.appendChild(LBorder); secondRow.appendChild(contentCell); secondRow.appendChild(RBorder);
	thirdRow.appendChild(BLCorner); thirdRow.appendChild(BBorder); thirdRow.appendChild(BRCorner);
	
	tbody.appendChild(firstRow); tbody.appendChild(secondRow); tbody.appendChild(thirdRow);

	element.appendChild(backgroundArray);
}

function loadBordersDecoration(elementId,imagesDirectoryPath,width,heightBorder){
	
	var element = document.getElementById(elementId);
	var content = element.innerHTML;
	var parent = element.parentNode;
	
	//its very important to set content padding to zero before get back its width
	var contentPadding = getStyle(elementId,"paddingTop") + " " + getStyle(elementId,"paddingRight") + " " + getStyle(elementId,"paddingBottom") + " " + getStyle(elementId,"paddingLeft");
	element.style.padding = "0px 0px 0px 0px";
	
	var backgroundArray = document.createElement("table");
	var tbody = document.createElement("tbody");
	backgroundArray.appendChild(tbody);
	
	var firstRow = document.createElement("tr");
	var secondRow = document.createElement("tr");
	var thirdRow = document.createElement("tr");
	
	
	var TBorder = document.createElement("td");
	var contentCell = document.createElement("td");
	var BBorder = document.createElement("td");
	
	TBorder.style.backgroundImage = "url(" + imagesDirectoryPath + "/TBorder.png)";
	contentCell.style.backgroundImage = "url(" + imagesDirectoryPath + "/content.png)";
	BBorder.style.backgroundImage = "url(" + imagesDirectoryPath + "/BBorder.png)";
	
	backgroundArray.style.margin = "0px 0px 0px 0px";
	backgroundArray.cellSpacing = "0px";
	backgroundArray.cellPadding = "0px";
	
	backgroundArray.width = element.offsetWidth;
	backgroundArray.height = element.offsetHeight;
	backgroundArray.id = elementId + "_decoration";
	
	contentCell.style.padding = contentPadding
	element.innerHTML = "";
	
	TBorder.height = heightBorder;
	BBorder.height = heightBorder;
	
	contentCell.innerHTML = content;
	
	firstRow.appendChild(TBorder);
	secondRow.appendChild(contentCell);
	thirdRow.appendChild(BBorder);
	
	tbody.appendChild(firstRow); tbody.appendChild(secondRow); tbody.appendChild(thirdRow);

	element.appendChild(backgroundArray);
}