@charset "UTF-8";
/* CSS Document */

/*---------- bubble tooltip -----------*/
a.tt{
    position:relative;
    z-index:3000;
    color:#000000;
    text-decoration:none;
}
a.tt span{ display: none; }

/*background:; ie hack, something must be changed in a for ie to execute it*/
a.tt:hover{ z-index:3001;background:;}
a.tt:hover div.tooltip{
    display:block;
    position:absolute;
    top:0px;
	left:0px;
	padding:0;
	width:200px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
    text-align: left;
	filter: alpha(opacity:90);
	KHTMLOpacity: 0.90;
	MozOpacity: 0.90;
	opacity: 0.90;
}


a.tt:hover span.top{
	display: block;
	padding: 0;
	height:4px;
	width:200px;
	font-size:1px;
    background: url(../images/popTop.gif) no-repeat;
}
a.tt:hover span.middle{ /* different middle bg for stretch */
	display: block;
	padding: 14px;
	background: url(../images/popMid.gif) repeat-y; 
}
a.tt:hover span.bottom{
	display: block;
	padding:0;
	height:4px;
	width:200px;
	font-size:1px;
    background: url(../images/popBttm.gif) no-repeat;
}

#powerChart{
position:relative;
width:509px;
height:445px;
margin:0;
}
#grid1{
position:absolute;
width:142px;
height:135px;
top:50px;
left:75px;
z-index:15;
}
#grid1 a{
	display:block;
	height:135px;
	width:142px;
}
#grid2{
position:absolute;
width:133px;
height:81px;
top:7px;
left:234px;
z-index:20;
}
#grid2 a{
	display:block;
	width:133px;
	height:81px;
}
#grid3{
position:absolute;
width:140px;
height:88px;
top:90px;
left:328px;
z-index:25;
}
#grid3 a{
	display:block;
	width:140px;
	height:88px;
}
#grid4{
position:absolute;
width:155px;
height:119px;
top:228px;
left:47px;
z-index:30;
}
#grid4 a{
	display:block;
	width:155px;
	height:119px;
}
#grid5{
position:absolute;
width:186px;
height:139px;
top:216px;
left:234px;
z-index:35;
}
#grid5 a{
	display:block;
	width:186px;
	height:139px;
}
#grid1 a.tt:hover div.tooltip{
	top:20px;
	left:380px;
}
#grid2 a.tt:hover div.tooltip{
	top:63px;
	left:221px;
}
#grid3 a.tt:hover div.tooltip{
	top:-20px;
	left:127px;
}
#grid4 a.tt:hover div.tooltip{
	top:-158px;
	left:408px;
}
#grid5 a.tt:hover div.tooltip{
	top:-146px;
	left:221px;
}
#powerImage{
position:absolute;
top:0;
left:0;
z-index:10;
}
