#rockHint {
	position:fixed;
	z-index:9999;
	top:0;
	left:0;
	max-width:120px;
	cursor:default;
	pointer-events: none;
	margin:auto;
	visibility: hidden;
	opacity: 0;
}
#rockHint.rockVisible {
	visibility: visible;
	opacity: 1;
}
#rockHint > span {
	position:absolute;
	display:block;
	margin:auto;
	width:14px;
	height:14px;
	z-index:1;
}
#rockHint > span:before, #rockHint > span:after {
	content:'';
	display:block;
	width:0;
	height:0;
	border:7px solid transparent;
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	margin:auto;
}

/* TOP & BOTTOM */
#rockHint.top > span, #rockHint.bottom > span {
	left:0;
	right:0;
}

#rockHint.top > span {
	top:100%;
}
#rockHint.top > span:before {
	border-top-color:#444;
}
#rockHint.top > span:after {
	border-top-color:#222;
	z-index:1;
	margin-top:-1px;
}

#rockHint.bottom > span {
	bottom:100%;
}
#rockHint.bottom > span:before {
	border-bottom-color:#444;
}
#rockHint.bottom > span:after {
	border-bottom-color:#222;
	z-index:1;
	margin-bottom:-1px;
}

/* LEFT & RIGHT */
#rockHint.left > span, #rockHint.right > span {
	top:0;
	bottom:0;
}

#rockHint.left > span {
	left:100%;
}
#rockHint.left > span:before {
	border-left-color:#444;
}
#rockHint.left > span:after {
	border-left-color:#222;
	z-index:1;
	margin-left:-1px;
}

#rockHint.right > span {
	right:100%;
}
#rockHint.right > span:before {
	border-right-color:#444;
}
#rockHint.right > span:after {
	border-right-color:#222;
	z-index:1;
	margin-right:-1px;
}

/* CONTENT */
#rockHint > div {
	padding:7px 10px;
	border-radius:4px;
	box-shadow:0 0 10px rgba(0,0,0,.3);
	background:#222;
	border:1px solid #444;
	white-space:normal;
	
	font-family:inherit;
	color:#ddd;
	font-size:12px;
	text-align:left;
	line-height:16px;
}
#rockHint > div > :first-child {
	margin-top:0;
}
#rockHint > div > :last-child {
	margin-bottom:0;
}

#rockHint > div h3 {
	margin:0 0 7px !important;
	font-size:15px;
	font-weight:bold;
}
#rockHint > div p {
	margin:0 0 7px;
}

/* POSITIONING */
#rockHint.top,
#rockHint.bottom {
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
}
#rockHint.left,
#rockHint.right {
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}