.colorTip {
    /* This class is assigned to the color tip span by jQuery */
    display: none;
    position: absolute;
    left: -150px;
    top: 24px;
    padding: 6px;
    background-color: #F0F4F8;
    border: solid 1px #0456A1;
    font-family: Montserrat,sans-serif;
    font-size: 11px;
    font-style: normal;
    line-height: 1;
    text-decoration: none;
    text-align: left;
    /*text-shadow:0 0 1px white;*/
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    /*border-radius:4px;*/
    width: 375px;
    white-space: normal;
    line-height: 14pt;
    z-index: 5;
}

reference { width: 100px; overflow: hidden;}

.pointyTip {
	/* Setting a thick transparent border on a 0x0 div to create a triangle */
	border-color: transparent transparent #F5F6F7 transparent;
    border-width: 7px;
	border-style: solid;
	top:-14px;
	margin-left:-7px;
	position:absolute;
	height:0;
	width:0;
    left:150px;

    /* ie6 height fix */
    font-size: 0;
    line-height: 0;
     /* ie6 transparent fix */
    _border-right-color: pink;
    _border-left-color: pink;
    _border-top-color: pink;
    _filter: chroma(color=pink);
}

.pointyTipShadow{
	/* The shadow tip is 1px larger, so it acts as a border to the tip */
	border-color: transparent transparent #C0C0C0 transparent;
    border-width: 8px;
    border-style: solid;
  	top:-16px;
	margin-left:-8px;
	position:absolute;
	height:0;
	width:0;
    left:150px;

    /* ie6 height fix */
    font-size: 0;
    line-height: 0;
     /* ie6 transparent fix */
    _border-right-color: pink;
    _border-left-color: pink;
    _border-top-color: pink;
    _filter: chroma(color=pink);
}

.colorTipContainer{
	position:relative;
	text-decoration:none !important;
	 
}


/* 6 Available Color Themes */

.white { border-top-color:white;}
.white { border-top-color:#ddd;}
.white .colorTip{
	background-color:white;
	border:1px solid #DDDDDD;
	color:#555555;
}

.yellow { border-top-color:#f9f2ba;}
.yellow { border-top-color:#e9d315;}
.yellow .colorTip{
	background-color:#f9f2ba;
	border:1px solid #e9d315;
	color:#5b5316;
}

.blue { border-top-color:#d9f1fb;}
.blue { border-top-color:#7fcdee;}
.blue .colorTip{
	background-color:#d9f1fb;
	border:1px solid #7fcdee;
	color:#1b475a;
}

.green { border-top-color:#f2fdf1;}
.green { border-top-color:#b6e184;}
.green .colorTip{
	background-color:#f2fdf1;
	border:1px solid #b6e184;
	color:#558221;
}

.red { border-top-color:#bb3b1d;}
.red { border-top-color:#8f2a0f;}
.red .colorTip{
	background-color:#bb3b1d;
	border:1px solid #8f2a0f;
	color:#fcfcfc;
	text-shadow:none;
}

.black { border-top-color:#333;}
.black { border-top-color:#111;}
.black .colorTip{
	background-color:#333;
	border:1px solid #111;
	color:#fcfcfc;
	text-shadow:none;
}

.corifact { border-top-color:#fff;}
.corifact { border-top-color:#C0C0C0;}
.corifact .colorTip{
	/*background: #ffffff url(images/toolTip.png) repeat;*/
	background-color:#F0F0F0  ;
	border:1px solid #C0C0C0;
	color:#7A7A7A;
	
}
