/***********************************************
* Cool DHTML tooltip script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

var offsetxpoint=-694/2 //Customize x offset of tooltip
var offsetypoint=5 //Customize y offset of tooltip
var ie=document.all
var ns6=document.getElementById && !document.all
var enabletip=false
var clicked = false
if (ie||ns6)
var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : ""

function ietruebody(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function ddrivetip(img, logo, name,email,id,v1,v2,v3,v4,v5,v6,v7,v8,v9,v10){
if (ns6||ie){
//if (typeof thewidth!="undefined") tipobj.style.width=thewidth+"px"
//if (typeof thecolor!="undefined" && thecolor!="") tipobj.style.backgroundColor=thecolor
tipobj.style.width=694;
clicked = false

html = '<table width="694" border="0" cellspacing="0" cellpadding="0">'
html = html +'  <tr>'
html = html +'    <td height="390" background="images/pop_bg.gif"><table width="683" border="0" align="center" cellpadding="0" cellspacing="0">'
html = html +'      <tr>'
html = html +'        <td width="402" height="383"><table width="100%" border="0" cellspacing="0" cellpadding="0">'
html = html +'          <tr>'
html = html +'            <td><table width="100%" border="0" cellspacing="0" cellpadding="0">'
html = html +'                <tr>'
html = html +'                  <td width="2%"><img src="images/detailarrow.gif" width="41" height="43" /></td>'
html = html +'                  <td width="98%" class="product_name"><strong>' + name + '</strong></td>'
html = html +'                </tr>'
html = html +'            </table></td>'
html = html +'          </tr>'
html = html +'          <tr>'
html = html +'            <td><table width="385" border="0" align="right" cellpadding="0" cellspacing="0">'
html = html +'                <tr>'
html = html +'                  <td height="313" background="images/big_img_bg.gif"><div align="center">'
html = html +'                      <table width="385" border="0" align="center" cellpadding="0" cellspacing="0">'
html = html +'                        <tr>'
html = html +'                          <td height="313" background="images/big_img_bg.gif"><div align="center"><a href="' + id + '"  target="_blank"><img src="../../images/catalogue/' + img + '" width="363" height="291" border=0 /></a></div></td>'
html = html +'                        </tr>'
html = html +'                      </table>'
html = html +'                  </div></td>'
html = html +'                </tr>'
html = html +'            </table></td>'
html = html +'          </tr>'
html = html +'          <tr>'
html = html +'            <td><div align="center"><a href="#"></a></div></td>'
html = html +'          </tr>'
html = html +'        </table></td>'
html = html +'        <td width="281"><table width="99%" border="0" cellspacing="0" cellpadding="0">'
html = html +'          <tr>'
html = html +'            <td><div align="right"><a href="#" onclick="hideonclick();return false;" ><img src="images/bt_close.gif" width="64" height="20" border="0" /></a></div></td>'
html = html +'          </tr>'
html = html +'          <tr>'
html = html +'            <td height="85"><div align="center">'
if (logo!=''){
html = html +'<a href="' + id + '"  target="_blank"><img src="../../images/logos/' + logo + '" border=0 /></a>'
}
html = html +'</div></td>'
html = html +'          </tr>'
html = html +'          <tr>'
html = html +'            <td height="96" bgcolor="#e4e4e4"><table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">'
html = html +'              <tr>'
html = html +'                <td width="22%"><img src="images/ico_gold_grey.gif" width="56" height="50" /></td>'
html = html +'                <td width="78%"><table width="63%" border="0" cellpadding="0" cellspacing="0">'
if (v1!='') {
html = html +'                  <tr>'
html = html +'                    <td width="47%" class="small_grey"><div align="right">Type</div></td>'
html = html +'                    <td width="6%" class="small_black"><div align="center">:</div></td>'
html = html +'                    <td width="47%" class="small_black">' + v1 + '</td>'
html = html +'                  </tr>'
html = html +'                  <tr class="small_grey">'
html = html +'                    <td colspan="3" class="details_grey"><div align="right"><img src="images/div_details_white.gif" width="162" height="5" /></div>'
html = html +'                        <div align="center"></div></td>'
html = html +'                  </tr>'
}
if (v2!='') {
html = html +'                  <tr>'
html = html +'                    <td class="small_grey"><div align="right">Color</div></td>'
html = html +'                    <td class="small_black"><div align="center">:</div></td>'
html = html +'                    <td class="small_black">' + v2 + '</td>'
html = html +'                  </tr>'
html = html +'                  <tr class="small_grey">'
html = html +'                    <td colspan="3" class="details_grey"><div align="right">'
html = html +'                        <div align="right"><img src="images/div_details_white.gif" width="162" height="5" /></div>'
html = html +'                    </div>'
html = html +'                        <div align="center"></div></td>'
html = html +'                  </tr>'
}
if (v3!='') {
html = html +'                  <tr>'
html = html +'                    <td class="small_grey"><div align="right">Weight</div></td>'
html = html +'                    <td class="small_black"><div align="center">:</div></td>'
html = html +'                    <td class="small_black">' + v3 +'</td>'
html = html +'                  </tr>'
html = html +'                  <tr class="small_grey">'
html = html +'                    <td colspan="3" class="details_grey"><div align="right">'
html = html +'                        <div align="right"><img src="images/div_details_white.gif" width="162" height="5" /></div>'
html = html +'                    </div>'
html = html +'                        <div align="center"></div></td>'
html = html +'                  </tr>'
}
if (v4!='') {
html = html +'                  <tr>'
html = html +'                    <td class="small_grey"><div align="right">Fineness</div></td>'
html = html +'                    <td class="small_black"><div align="center">:</div></td>'
html = html +'                    <td class="small_black">' + v4 + '</td>'
html = html +'                  </tr>'
}
html = html +'                </table></td>'
html = html +'              </tr>'
html = html +'            </table></td>'
html = html +'          </tr>'
html = html +'          <tr>'
html = html +'            <td bgcolor="#e4e4e4"><div align="center"><img src="images/pop_div.gif" width="258" height="15" /></div></td>'
html = html +'          </tr>'
html = html +'          <tr>'
html = html +'            <td height="112" bgcolor="#e4e4e4"><table width="90%" border="0" align="center" cellpadding="0" cellspacing="0">'
html = html +'              <tr>'
html = html +'                <td width="22%"><img src="images/ico_diamond_grey.gif" width="56" height="50" /></td>'
html = html +'                <td width="78%"><table width="63%" border="0" cellpadding="0" cellspacing="0">'
if (v5!='') {
html = html +'                  <tr>'
html = html +'                    <td width="47%" class="small_grey"><div align="right">Type</div></td>'
html = html +'                    <td width="6%" class="small_black"><div align="center">:</div></td>'
html = html +'                    <td width="47%" class="small_black">' + v5 +'</td>'
html = html +'                  </tr>'
html = html +'                  <tr class="small_grey">'
html = html +'                    <td colspan="3" class="details_grey"><div align="right"><img src="images/div_details_white.gif" width="162" height="5" /></div></td>'
html = html +'                  </tr>'
}
if (v6!='') {
html = html +'                  <tr>'
html = html +'                    <td class="small_grey"><div align="right">Piece</div></td>'
html = html +'                    <td class="small_black"><div align="center">:</div></td>'
html = html +'                    <td class="small_black">' + v6 + '</td>'
html = html +'                  </tr>'
html = html +'                  <tr class="small_grey">'
html = html +'                    <td colspan="3" class="details_grey"><div align="right"><img src="images/div_details_white.gif" width="162" height="5" /></div></td>'
html = html +'                  </tr>'
}
if (v7!='') {
html = html +'                  <tr>'
html = html +'                    <td class="small_grey"><div align="right">Color</div></td>'
html = html +'                    <td class="small_black"><div align="center">:</div></td>'
html = html +'                    <td class="small_black">' + v7 + '</td>'
html = html +'                  </tr>'
html = html +'                  <tr class="small_grey">'
html = html +'                    <td colspan="3" class="details_grey"><div align="right"><img src="images/div_details_white.gif" width="162" height="5" /></div></td>'
html = html +'                  </tr>'
}
if (v8!='') {
html = html +'                  <tr>'
html = html +'                    <td class="small_grey"><div align="right">Clearness</div></td>'
html = html +'                    <td class="small_black"><div align="center">:</div></td>'
html = html +'                    <td class="small_black">' + v8 + '</td>'
html = html +'                  </tr>'
html = html +'                  <tr class="small_grey">'
html = html +'                    <td colspan="3" class="details_grey"><div align="right">'
html = html +'                        <div align="right"><img src="images/div_details_white.gif" width="162" height="5" /></div>'
html = html +'                    </div></td>'
html = html +'                  </tr>'
}
if (v9!='') {
html = html +'                  <tr>'
html = html +'                    <td class="small_grey"><div align="right">Shape</div></td>'
html = html +'                    <td class="small_black">:</td>'
html = html +'                    <td class="small_black">' + v9 + '</td>'
html = html +'                  </tr>'
html = html +'                  <tr class="small_grey">'
html = html +'                    <td colspan="3" class="details_grey"><div align="right">'
html = html +'                        <div align="right"><img src="images/div_details_white.gif" width="162" height="5" /></div>'
html = html +'                    </div></td>'
html = html +'                  </tr>'
}
if (v10!='') {
html = html +'                  <tr>'
html = html +'                    <td class="small_grey"><div align="right">Weight</div></td>'
html = html +'                    <td class="small_black">:</td>'
html = html +'                    <td class="small_black">' + v10 +'</td>'
html = html +'                  </tr>'
}
html = html +'                </table></td>'
html = html +'              </tr>'
html = html +'            </table></td>'
html = html +'          </tr>'
html = html +'          <tr>'
html = html +'            <td height="54"><table width="95%" border="0" align="center" cellpadding="0" cellspacing="0">'
html = html +'              <tr>'
html = html +'                <td width="55%"><table width="87%" border="0" align="center" cellpadding="0" cellspacing="0">'
html = html +'                  <tr>'
html = html +'                    <td width="9%"><img src="images/ico_feedback.gif" width="21" height="16" /></td>'
html = html +'                    <td width="91%"><a href="' + id + '" class="norm_black" style="color: #FF0000" target="_blank">Website</a></td>'
html = html +'                  </tr>'
html = html +'                </table></td>'
html = html +'                <td width="45%"><table width="90%" border="0" cellspacing="0" cellpadding="0">'
html = html +'                  <tr>'
html = html +'                    <td width="9%"><img src="images/ico_contacts.gif" width="21" height="16" /></td>'
html = html +'                    <td width="91%"><a href="mailto:'+ email +'" class="norm_black"  style="color: #FF0000">E- Mail</a></td>'
html = html +'                  </tr>'
html = html +'                </table></td>'
html = html +'              </tr>'
html = html +'            </table></td>'
html = html +'          </tr>'
html = html +'        </table></td>'
html = html +'      </tr>'
html = html +'    </table></td>'
html = html +'  </tr>'
html = html +'</table>'


tipobj.innerHTML=html;
enabletip=true
return false
}
}

function positiontip(e){
if (!clicked){
if (enabletip){
var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;
var curY=(ns6)?e.pageY : event.clientY+ietruebody().scrollTop;
//Find out how close the mouse is to the corner of the window
var rightedge=ie&&!window.opera? ietruebody().clientWidth-event.clientX-offsetxpoint : window.innerWidth-e.clientX-offsetxpoint-20
var bottomedge=ie&&!window.opera? ietruebody().clientHeight-event.clientY-offsetypoint : window.innerHeight-e.clientY-offsetypoint-20

var leftedge=(offsetxpoint<0)? offsetxpoint*(-1) : -1000

clicked = true

//if the horizontal distance isn't enough to accomodate the width of the context menu
if (rightedge<tipobj.offsetWidth)
//move the horizontal position of the menu to the left by it's width
tipobj.style.left=ie? ietruebody().scrollLeft+event.clientX-tipobj.offsetWidth+"px" : window.pageXOffset+e.clientX-tipobj.offsetWidth+"px"
else if (curX<leftedge)
tipobj.style.left="5px"
else
//position the horizontal position of the menu where the mouse is positioned
tipobj.style.left=curX+offsetxpoint+"px"

//same concept with the vertical position
if (bottomedge<tipobj.offsetHeight)
tipobj.style.top=ie? ietruebody().scrollTop+event.clientY-tipobj.offsetHeight-offsetypoint+"px" : window.pageYOffset+e.clientY-tipobj.offsetHeight-offsetypoint+"px"
else
tipobj.style.top=curY+offsetypoint+"px"
tipobj.style.visibility="visible"
}
}
}

function hideddrivetip(){
	if (!clicked){	
		if (ns6||ie){
		enabletip=false
			tipobj.style.visibility="hidden"
			tipobj.style.left="-1000px"
			tipobj.style.backgroundColor=''
			tipobj.style.width=''
		}
	}
}
function hideonclick(){
	if (ns6||ie){
		enabletip=false
		tipobj.style.visibility="hidden"
		tipobj.style.left="-1000px"
		tipobj.style.backgroundColor=''
		tipobj.style.width=''
		clicked = false
	}	
}

document.onmousemove=positiontip