#utip {
	position: absolute;
	z-index: 1000;
	padding: 6px 8px;
	border-radius: 4px 0 4px 4px;
	background: #76BDE5;
	color: white;
	font-size: 14px;
	max-width: 256px;
	line-height: 16px;
	font-size: 12px;
	color: #FFF;
	box-shadow: 0 0 0 2px rgba(118, 189, 229, 0.4);
	background: #76BDE5;
	-webkit-user-select: none;
	user-select: none;
	-moz-user-select: none;
}
#utip::before {
  position: absolute;
  content: ''; }
#utip[data-gravity="ne"] {
  margin-top: -10px;
  margin-left: -15px; }
  #utip[data-gravity="ne"]::before {
	bottom: -10px;
	left: 10px;
	height: 0;
	width: 0;
	border-color: transparent;
	border-style: solid;
	border-width: 5px;
	border-top-color: #78A4BC; }
#utip[data-gravity="n"] {
  margin-top: -10px; }
  #utip[data-gravity="n"]::before {
	bottom: -10px;
	left: 50%;
	margin-left: -5px;
	height: 0;
	width: 0;
	border-color: transparent;
	border-style: solid;
	border-width: 5px;
	border-top-color: #78A4BC; }
#utip[data-gravity="nw"] {
  margin-top: -10px;
  margin-left: 15px; }
  #utip[data-gravity="nw"]::before {
	bottom: -10px;
	right: 10px;
	height: 0;
	width: 0;
	border-color: transparent;
	border-style: solid;
	border-width: 5px;
	border-top-color: #78A4BC; }
#utip[data-gravity="e"] {
  margin-left: 10px; }
  #utip[data-gravity="e"]::before {
	top: 50%;
	margin-top: -5px;
	left: -10px;
	height: 0;
	width: 0;
	border-color: transparent;
	border-style: solid;
	border-width: 5px;
	border-right-color: #78A4BC; }
#utip[data-gravity="se"] {
  margin-top: 10px;
  margin-left: -15px; }
  #utip[data-gravity="se"]::before {
	top: -10px;
	left: 10px;
	height: 0;
	width: 0;
	border-color: transparent;
	border-style: solid;
	border-width: 5px;
	border-bottom-color: #78A4BC; }
#utip[data-gravity="s"] {
  margin-top: 10px; }
  #utip[data-gravity="s"]::before {
	top: -10px;
	left: 50%;
	margin-left: -5px;
	height: 0;
	width: 0;
	border-color: transparent;
	border-style: solid;
	border-width: 5px;
	border-bottom-color: #78A4BC; }
#utip[data-gravity="sw"] {
  margin-top: 10px;
  margin-left: 15px; }
  #utip[data-gravity="sw"]::before {
	top: -10px;
	right: 10px;
	height: 0;
	width: 0;
	border-color: transparent;
	border-style: solid;
	border-width: 5px;
	border-bottom-color: #78A4BC; }
#utip[data-gravity="w"] {
  margin-left: -10px; }
  #utip[data-gravity="w"]::before {
	top: 50%;
	margin-top: -5px;
	right: -10px;
	height: 0;
	width: 0;
	border-color: transparent;
	border-style: solid;
	border-width: 5px;
	border-left-color: #78A4BC;
}