#tip {
	width: auto;
	height: auto;
	display: block;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 999;
	font-family: 'Lucida Grande', Tahoma, Verdana, Arial, sans-serif;
}

#tip.left,
#tip.right {
	padding: 0;
}

#tip .content {
	padding: 4px 8px;
	background: rgba(0,0,0,0.9);
	color: #fff;
	font-size: 11px;
	line-height: 14px;
}

#tip .arrow {
	width: 0;
	height: 0;
	position: absolute;
	border: 4px solid transparent;
}

#tip.top .arrow {
	left: 5px;
	border-width: 4px 4px 0;
	border-top-color: rgba(0,0,0,0.9);
}

#tip.bottom .arrow {
	left: 5px;
	top: -4px;
	border: 4px solid transparent;
	border-width: 0 4px 4px;
	border-bottom-color: rgba(0,0,0,0.9);
}

#tip.left .arrow {
	top: 50%;
	margin-top: -4px;
	right: -4px;
	border-width: 4px 0 4px 4px;
	border-left-color: rgba(0,0,0,0.9);
}

#tip.right .arrow {
	top: 50%;
	margin-top: -4px;
	left: -4px;
	border-width: 4px 4px 4px 0;
	border-right-color: rgba(0,0,0,0.9);
}