/*-----------------------------------------------------------------------------------------------*/
/*                                            TOOLTIP                                            */
/*-----------------------------------------------------------------------------------------------*/

.toolTip { /* This is the hook that the jQuery script will use */
	padding-right: 20px; /* This is need to make sure that the help icon is always visible */
	background: transparent url(../img/hint_1.gif) no-repeat right;
	padding: 8px;
	color: #3366FF;
	cursor: help; 
	position: relative; /* This contains the .toolTipWrapper div that is absolutely positioned  */
	font-family: 'Verdana,Arial,Helvetica';
	font-size: 11px;
}

.toolTipWrapper { /* The wrapper holds its insides together */
	width: 350px;
	position: absolute; /* Absolute will make the tooltip float above other content in the page */
	top: 35px;
	display: none; /* It has to be displayed none so that the jQuery fadein and fadeout functions will work */
	font-family: 'Verdana,Arial,Helvetica';
	font-size: 11px;
}

.toolTipTop { /* Top section of the tooltip */
	width: 175px;
	height: 30px;
	background: transparent url(images/bubbleTop.gif) no-repeat;
}

.toolTipMid { /* Middle section of the tooltip */
	padding: 8px 15px;
	background: #A1D40A url(images/bubbleMid.gif) repeat-x top;
}

.toolTipBtm { /* Bottom Section of the tooltip */
	height: 13px;
	background: transparent url(images/bubbleBtm.gif) no-repeat;
}

.toolTable {
	background-color: #4E70E7;
	font-family: 'Verdana,Arial,Helvetica';
	font-size: 11px;
	color: #fff;
	text-align: left;
}

.toolTd {
	background-color: #fff;
	font-family: 'Verdana,Arial,Helvetica';
	font-size: 12px;
	text-align: left;
	padding: 2px;
	color:#000000;
	font-weight:normal;
}