.ui-tooltip.ui-helper-clearfix:before,
.ui-tooltip.ui-helper-clearfix:after {
	content: "";
	display: table;
	border-collapse: collapse;
}

.ui-tooltip.ui-helper-clearfix:after {
	clear: both;
}

.ui-tooltip.ui-helper-clearfix {
	min-height: 0; /* support: IE7 */
}

.ui-tooltip.ui-helper-zfix {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
	opacity: 0;
	filter:Alpha(Opacity=0);
}

.ui-tooltip.ui-front {
	z-index: 100;
}

/* Misc visuals
----------------------------------*/

/* Overlays */
.ui-tooltip {
	padding: 8px;
	position: absolute;
	z-index: 9999;
	max-width: 350px;
	-webkit-box-shadow: 0 0 5px #aaa;
	box-shadow: 0 0 5px #aaa;
}


.ui-tooltip,
.ui-tooltip .arrow:after {
/* visual styling of the box and the arrow */
    background: #FFFFA3;
    border: 2px solid #F1D031;
}

.ui-tooltip {
    padding: 7px 15px;
    color: #555555; /* for debug */
    border-radius: 5px;
    font-size: 12px;
    font-weight: 700;
}

.ui-tooltip .arrow {
    /* This is just a container which will cover the .arrow:after's unwanted parts */
    width: 70px;
    height: 16px;
    overflow: hidden;
    position: absolute;
    left: 50%;
    margin-left: -35px;
    bottom: -16px;
    border: 1px solid black;
}

.ui-tooltip .arrow.top {
    /* This class will be added if the tooltip is below the object (the arrow is at the top of the box)*/
    top: -16px;
    bottom: auto;
}

.ui-tooltip .arrow.left {
    left: 20%;
}

.ui-tooltip .arrow:after {
    content: "";
    position: absolute;
    left: 20px;
    top: -20px;
    width: 25px;
    height: 25px;
    box-shadow: 6px 5px 9px -9px black;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    tranform: rotate(45deg);
}

.ui-tooltip .arrow.top:after {
    bottom: -20px;
    top: auto;
}