/* Andrew Pennebaker's Twitter icon-o-rama

   Based on Philippe Archambault's "Creating a nice twitter icon with tooltip"
   http://www.philworks.com/blog/2009/03/16/creating-a-nice-twitter-icon-with-tooltip.html

   and Fiji Web Design's "CSS Tooltips - Floating HTML Elements"
   http://www.fijiwebdesign.com/fiji-web-design-blog/css-tooltips-floating-html-elements.html */

#twitter-icon { position: relative; text-decoration: none; }
#twitter-icon img { border: none; vertical-align: middle; }
#twitter-icon .tip { display: none; }

/* Trent Richardson's IE/Opera hover fix http://trentrichardson.com/examples/csstooltips/ */
#twitter-icon:hover, #twitter-icon:hover * { z-index: 25; color: #aaaaff; background: inherit; }

#twitter-icon:hover .tip {
	display: block;
	position: absolute;
	padding: 5px;
	top: -40px;
	left: 30px;
	width: 80px;
	height: 10px;
	background: #E8F5FC;
	border: 1px solid #07AAEF;
	color: #07AAEF;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 10px !important;
	line-height: 10px !important;
	font-style: normal;
	font-weight: normal;
	text-transform: uppercase;
	text-align: center;
	vertical-align: middle;
}

#twitter-icon .tip .p, #twitter-icon .tip .ip {
	position: absolute;
	width: 0;
	height: 0;
	border-bottom-width: 0;
	background: none;
}

#twitter-icon .tip .p {
	margin-left: -5px;
	left: 5px;
	bottom: -5px;
	right: auto;
	border-top: 5px solid #07AAEF;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
}

#twitter-icon .tip .ip {
	top: -5px;
	left: -3px;
	bottom: auto;
	border-top: 3px solid #E8F5FC;
	border-left: 3px solid transparent;
	border-right: 3px solid transparent;
}
