function colorPicker(event) {

//HEXIDECIMAL FUNCTIONS
function dtoh(d) {
d=d.toString(16);
if (d.length == 1) {d = "0"+d;}
else {d = d;}
return d;
}
function htod(h) {return parseInt(h,16);}

//CREATE COLOR BOX
var cDiv = document.createElement('div');
cDiv.id = 'colorpicker';
cDiv.style.position = 'absolute';
cDiv.style.display = 'none';
cDiv.style.top = event.pageY + 105 + "px";
cDiv.style.left = (document.body.clientWidth / 2) - (event.pageX / 4) + "px";

//DISPLAY COLORS
innerHTML = "<div style=text-align:right;cursor:pointer;cursor:hand;font-style:italic;font-size:10px; id=closecolor title=Close onclick=closeColor('colorpicker');>[x]</div><table>";
//REDS
innerHTML = innerHTML+"<tr>";
for (c=85;c<=255;c=c+34) {
temp = dtoh(c).toString();
color = (temp+"0000").toUpperCase();
innerHTML = innerHTML + "<td height=15px width=15px bgcolor=#"+color+" onclick=submitColor('"+color+"') title='Choose #"+color+"' style=cursor:hand;cursor:pointer;>";
}
//ORANGES
innerHTML = innerHTML+"</tr><tr>";
for (c=85;c<=255;c=c+34) {
temp = dtoh(c).toString();
temp2 = dtoh(c-51).toString();
color = (temp+temp2+"00").toUpperCase();
innerHTML = innerHTML + "<td height=15px width=15px bgcolor=#"+color+" onclick=submitColor('"+color+"') title='Choose #"+color+"' style=cursor:hand;cursor:pointer;>";
}
//YELLOWS
innerHTML = innerHTML+"</tr><tr>";
for (c=85;c<=255;c=c+34) {
temp = dtoh(c).toString();
color = (temp+temp+"00").toUpperCase();
innerHTML = innerHTML + "<td height=15px width=15px bgcolor=#"+color+" onclick=submitColor('"+color+"') title='Choose #"+color+"' style=cursor:hand;cursor:pointer;>";
}
//GREENS
innerHTML = innerHTML+"</tr><tr>";
for (c=85;c<=255;c=c+34) {
temp = dtoh(c).toString();
color = ("00"+temp+"00").toUpperCase();
innerHTML = innerHTML + "<td height=15px width=15px bgcolor=#"+color+" onclick=submitColor('"+color+"') title='Choose #"+color+"' style=cursor:hand;cursor:pointer;>";
}
//TEALS
innerHTML = innerHTML+"</tr><tr>";
for (c=85;c<=255;c=c+34) {
temp = dtoh(c).toString();
temp2 = dtoh(c-51).toString();
color = ("00"+temp+temp2).toUpperCase();
innerHTML = innerHTML + "<td height=15px width=15px bgcolor=#"+color+" onclick=submitColor('"+color+"') title='Choose #"+color+"' style=cursor:hand;cursor:pointer;>";
}
//BLUES
innerHTML = innerHTML+"</tr><tr>";
for (c=85;c<=255;c=c+34) {
temp = dtoh(c).toString();
color = ("0000"+temp).toUpperCase();
innerHTML = innerHTML + "<td height=15px width=15px bgcolor=#"+color+" onclick=submitColor('"+color+"') title='Choose #"+color+"' style=cursor:hand;cursor:pointer;>";
}
//PURPLES
innerHTML = innerHTML+"</tr><tr>";
for (c=85;c<=255;c=c+34) {
temp = dtoh(c).toString();
temp2 = dtoh(c-51).toString();
color = (temp+"00"+temp2).toUpperCase();
innerHTML = innerHTML + "<td height=15px width=15px bgcolor=#"+color+" onclick=submitColor('"+color+"') title='Choose #"+color+"' style=cursor:hand;cursor:pointer;>";
}
innerHTML = innerHTML+"</tr></table>";

//DISPLAY COLOR BOX
document.body.appendChild(cDiv);
cDiv.style.display = 'block';
cDiv.style.backgroundColor = "#FFFFFF";
cDiv.style.border = '#000000 1px dashed';
cDiv.style.zIndex = 9999;
cDiv.innerHTML = innerHTML;
}

function submitColor(color) {
window.frames[0].document.getElementById('colorVote').value = color;
window.frames[0].document.getElementById('colorVote').form.submit();
closeColor();
}

function closeColor() {
document.body.removeChild(document.getElementById('colorpicker'));
}