/*
 * Speech-Bubble Tooltip by Jamy Golden
 */
a.sbtooltip {
behavior: url(/css/PIE.htc);
}
a.sbtooltip:hover {
behavior: url("/css/PIE.htc");
	position: relative; /* Allows the tooltip to be absolutely positioned */
	z-index: 100;
	white-space:nowrap;
}

/* Speech Bubble */
a.sbtooltip:before {
white-space:nowrap;
	background: rgb(255,255,255); /* For browsers that don't support gradients */
	background: -webkit-gradient( /* Webkit gradient */
		linear,
		left bottom,
		left top,
		color-stop(0.44, rgb(255,255,255)),
		color-stop(0.72, rgb(255,255,255))
	);
	background: -moz-linear-gradient( /* Firefox gradient */
		90deg,
		rgb(255,255,255) 44%,
		rgb(255,255,255) 72%
	);
	color: #000;
	content: attr(sbtooltip); /* This takes the content of the attribute named ?sbtooltip? and displays it within this element*/
	display: none; /* Hidden until hovered upon */

/* Font, padding, top and right must change depending on the font size you are using on your web page */
	font: 12px Helvetica, Arial,Georgia, sans-serif;
	padding: 5px 15px;
	position: absolute;
	top: 45px;
	left: 0px;
 
/* Border radii for different browsers */
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;

/* Box shadows for different browsers */
	-moz-box-shadow: 0px 0px 4px #999;
	-webkit-box-shadow: 0px 0px 4px #999;
	box-shadow: 0px 0px 4px #999;
}
 
/* Triangle */
a.sbtooltip:after {
white-space:nowrap;
	border-width: 12px;
	border-style: solid;
	border-color: transparent transparent rgb(255,255,255) transparent;
	content: ""; /* Forces this pseudo-element to appear on hover */
	display: none;
	height: 2px; /* Width and height could  be left out, but I prefer a less 'pointy' triangle */
	width: 2px;
	position: absolute;
	top: 22px;
	right: 0px;
}

/* Display on hover */
a.sbtooltip:hover:after, a.sbtooltip:hover:before {
	display: block; /* The Speech-bubble tooltip and pointer will appear on hover */
}