function getLeft(ele){  
	     if (ele.offsetParent){ return ele.offsetLeft + getLeft(ele.offsetParent) ; }
	     else{ return ele.offsetLeft ; } 
	}  

	function getTop(ele){
		if (ele.offsetParent){ return (ele.offsetTop + getTop(ele.offsetParent)) ;  }
		else{ return (ele.offsetTop) ; }
	}
	
	function removePicker(){
		if(document.getElementById('colors-picker')){
			document.getElementById('colors-picker').parentNode.removeChild(document.getElementById('colors-picker')) ;
		}
	}
	
	function findFather(element, tagname){
	
		if(element.parentNode.nodeName.toLowerCase() == tagname.toLowerCase()){
			return element.parentNode ;
		}
		else{
			return findFather(element.parentNode, tagname) ;
		}
	}
	
	function removeRow(element){
		
		var row = findFather(element, 'tr') ;
		var table = document.getElementById('tbody-details') ;
		
		if(table.rows.length > 1){
			table.removeChild(row) ;
		}	
	}
	
	
	function clearRow(row){
		
		var inputs = row.getElementsByTagName('input') ;
		
		for(var i = 0 ; i < inputs.length ; i++){
			inputs[i].value = '' ;
			if(inputs[i].id.split('-')[0] == 'productdetail_color' || inputs[i].id.split('-')[0] == 'new_color'){
				inputs[i].id = 'new_color-' + (document.getElementById('tbody-details').rows.length) ;
			}
		}
		
		var divs = row.getElementsByTagName('div') ; // the color
		for(var i = 0 ; i < divs.length ; i++){
			divs[i].style.backgroundColor = '' ;
			if(divs[i].id.split('-')[0] == 'div_color' || divs[i].id.split('-')[0] == 'new_div_color'){
				divs[i].id = 'new_div_color-' + (document.getElementById('tbody-details').rows.length) ;
				divs[i].setAttribute("onClick", "_whichField = 'new_color-" + document.getElementById('tbody-details').rows.length + "'; _whichDiv = this.id; CLCPshowPicker()") ;
			}
		}
	}
	
	function addRow(element){
		
		var table = document.getElementById('tbody-details') ;
		var cloned = table.rows[(table.rows.length - 1)].cloneNode(true) ;
		clearRow(cloned) ;
		table.appendChild(cloned) ;
	
	}