.css-tooltip-top,
.css-tooltip-bottom,
.css-tooltip-right,
.css-tooltip-left
	{
	position: relative !important;
	display: inline-block !important;
	text-decoration: none !important;    
	}
	
.css-tooltip-top span,
.css-tooltip-bottom span,
.css-tooltip-right span,
.css-tooltip-left span,
.css-tooltip-diagonal-right span,
.css-tooltip-diagonal-left span
	{
	width: 300px;
	font-family: arial, sans-serif !important;
	font-size: 13px !important;
	line-height: normal !important;
	text-align: left !important;
	padding:0px !important;
	visibility: hidden;
    opacity: 0;
	position: absolute;
	z-index: 9999999 !important;

	-webkit-transition-duration: 0.25s;
	-moz-transition-duration: 0.25s;
	-o-transition-duration: 0.25s;
	-ms-transition-duration: 0.25s;
	transition-duration: 0.25s;
	-webkit-transition-timing-function: cubic-bezier(0.35,0,0.35,1);
	-moz-transition-timing-function: cubic-bezier(0.35,0,0.35,1);
	-o-transition-timing-function: cubic-bezier(0.35,0,0.35,1);
	-ms-transition-timing-function: cubic-bezier(0.35,0,0.35,1);
	transition-timing-function: cubic-bezier(0.35,0,0.35,1);
	}

.css-tooltip-top span:before,
.css-tooltip-bottom span:before,
.css-tooltip-right span:before,
.css-tooltip-left span:before,
.css-tooltip-diagonal-right span:before,
.css-tooltip-diagonal-left span:before
	{
	content: "";
	display: block;
	width: 0px;
	height: 0px;
	position: absolute;
	}

/* Tool tip Top */
.css-tooltip-top span
	{
	left: -10px;
	bottom: 100%;
	margin-bottom: 30px;
	
	-webkit-transition-property: opacity, margin-bottom, visibility;
	-moz-transition-property: opacity, margin-bottom, visibility;
	-o-transition-property: opacity, margin-bottom, visibility;
	-ms-transition-property: opacity, margin-bottom, visibility;
	transition-property: opacity, margin-bottom, visibility;
	}
	
.css-tooltip-top span:before
	{
    border-left: 8px solid transparent !important;
    border-right: 8px solid transparent !important;
	border-top: 8px solid #000;
	border-bottom: 0 !important;
	bottom: -8px;
	left: 15px;
	}

.css-tooltip-top:hover span
	{	
	margin-bottom: 10px; /* End Position */
	visibility: visible;
	opacity: 1;
	}

	
/* tooltip left
-------------------------------------------------------------- */

.css-tooltip-left span
	{
	right: 100%;
	top: -7px;
	margin-right: 35px;
	
	-webkit-transition-property: opacity, margin-right, visibility;
	-moz-transition-property: opacity, margin-right, visibility;
	-o-transition-property: opacity, margin-right, visibility;
	-ms-transition-property: opacity, margin-right, visibility;
	transition-property: opacity, margin-right, visibility;
	}
	
.css-tooltip-left span:before
	{
    border-left: 8px solid #000;
    border-right: 0 !important;
	border-top: 8px solid transparent !important;
	border-bottom: 8px solid transparent !important;
	top: 11px;
	right: -8px;
	}

.css-tooltip-left:hover span
	{	
	margin-right: 15px;
	visibility: visible;
	opacity: 1;
	}
	
/* tooltip right
-------------------------------------------------------------- */

.css-tooltip-right span
	{
	left: 100%;
	top: -7px;
	margin-left: 35px;

	-webkit-transition-property: opacity, margin-left, visibility;
	-moz-transition-property: opacity, margin-left, visibility;
	-o-transition-property: opacity, margin-left, visibility;
	-ms-transition-property: opacity, margin-left, visibility;
	transition-property: opacity, margin-left, visibility;
	}
	
.css-tooltip-right span:before	{
    border-left: 0 !important;
    border-right: 8px solid #000;
	border-top: 8px solid transparent !important;
	border-bottom: 8px solid transparent !important;
	top: 11px;
	left: -8px;
	}

.css-tooltip-right:hover span
	{	
	margin-left: 15px;
	visibility: visible;
	opacity: 1;
	}
	
	
/*tooltip bottom
-------------------------------------------------------------- */

.css-tooltip-bottom span
	{
	left:10px;
	top:90%;
	margin-top: 30px;
	
	-webkit-transition-property: opacity, margin-top, visibility;
	-moz-transition-property: opacity, margin-top, visibility;
	-o-transition-property: opacity, margin-top, visibility;
	-ms-transition-property: opacity, margin-top, visibility;
	transition-property: opacity, margin-top, visibility;
	}
	
.css-tooltip-bottom span:before
	{
    border-left: 8px solid transparent !important;
    border-right: 8px solid transparent !important;
	border-top: 0 !important;
	border-bottom: 8px solid #000;
	top: -8px;
	left: 15px;
	}

.css-tooltip-bottom:hover span
	{	
	margin-top: 10px;
	visibility: visible;
	opacity: 1;
	}
	
/* Tooltip Color */
.color-blue span
	{
	color: #ffffff !important;
	
	background: #31598a;
	background: -moz-linear-gradient(top,  #37659d 0%, #31598a 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#37659d), color-stop(100%,#31598a)); 
	background: -webkit-linear-gradient(top,  #37659d 0%,#31598a 100%);
	background: -o-linear-gradient(top,  #37659d 0%,#31598a 100%);
	background: -ms-linear-gradient(top,  #37659d 0%,#31598a 100%);
	background: linear-gradient(top,  #37659d 0%,#31598a 100%);

	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	
	text-shadow: 0px 1px 0px rgba(0,0,0,0.4);
	}

.color-blue span:before
	{
	border-color: #31598a;
	}
	
.color-blue span:after
	{
	content: "";
	display: block;
	border-top: 1px solid #6591c3;
	position: absolute;
	left: 0px;
	top: 1px;
	width: 100%;
	height: 10px;
	
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	}
	
.color-green span
	{
	color: #ffffff !important;
	
	
	background: #206906; 
	background: -moz-linear-gradient(top,  #37790c 0%, #206906 100%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#37790c), color-stop(100%,#206906)); 
	background: -webkit-linear-gradient(top,  #37790c 0%,#206906 100%); 
	background: -o-linear-gradient(top,  #37790c 0%,#206906 100%); 
	background: -ms-linear-gradient(top,  #37790c 0%,#206906 100%); 
	background: linear-gradient(top,  #37790c 0%,#206906 100%); 
	
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	
	
	text-shadow: 0px 1px 0px rgba(0,0,0,0.4);
	}


.color-green span:before
	{
	border-color: #206906;
	}
	

.color-green span:after
	{
	content: "";
	display: block;
	border-top: 1px solid #4f9c21;
	position: absolute;
	left: 0px;
	top: 1px;
	width: 100%;
	height: 10px;
	
	
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	}
	

.color-green span strong
	{
	background: #246407;
	border-bottom: 1px solid #205a06;
	}
	
/*orange*/

.color-orange span
	{
	color: #ffffff !important;
	
	
	background: #c34722; 
	background: -moz-linear-gradient(top,  #cb581f 0%, #c34722 100%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#cb581f), color-stop(100%,#c34722)); 
	background: -webkit-linear-gradient(top,  #cb581f 0%,#c34722 100%); 
	background: -o-linear-gradient(top,  #cb581f 0%,#c34722 100%); 
	background: -ms-linear-gradient(top,  #cb581f 0%,#c34722 100%); 
	background: linear-gradient(top,  #cb581f 0%,#c34722 100%);
	
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	
	
	text-shadow: 0px 1px 0px rgba(0,0,0,0.4);
	}


.color-orange span:before
	{
	border-color: #c34722;
	}
	

.color-orange span:after
	{
	content: "";
	display: block;
	border-top: 1px solid #e28266;
	position: absolute;
	left: 0px;
	top: 1px;
	width: 100%;
	height: 10px;
	
	
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	}
	

.color-orange span strong
	{
	background: #bf461a;
	border-bottom: 1px solid #ac3f17;
	}
	
	/*red*/

.color-red span
	{
	color: #ffffff !important;
	background: #b01c34; 
	background: -moz-linear-gradient(top,  #c01e38 0%, #b01c34 100%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c01e38), color-stop(100%,#b01c34)); 
	background: -webkit-linear-gradient(top,  #c01e38 0%,#b01c34 100%); 
	background: -o-linear-gradient(top,  #c01e38 0%,#b01c34 100%); 
	background: -ms-linear-gradient(top,  #c01e38 0%,#b01c34 100%); 
	background: linear-gradient(top,  #c01e38 0%,#b01c34 100%); 
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	text-shadow: 0px 1px 0px rgba(0,0,0,0.4);
	}
.color-red span:before
	{
	border-color: #b01c34;
	}
.color-red span:after
	{
	content: "";
	display: block;
	border-top: 1px solid #e96e82;
	position: absolute;
	left: 0px;
	top: 1px;
	width: 100%;
	height: 10px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	}
.color-red span strong
	{
	background: #b0182d;
	border-bottom: 1px solid #9d1628;
	}
	
	/*White*/

.color-white span
	{
	color: #333333 !important;
	background: #F9F9F9; 
	background: -moz-linear-gradient(top,  #FFFFFF 0%, #F9F9F9 100%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFFFFF), color-stop(100%,#F9F9F9)); 
	background: -webkit-linear-gradient(top,  #FFFFFF 0%,#F9F9F9 100%); 
	background: -o-linear-gradient(top,  #FFFFFF 0%,#F9F9F9 100%); 
	background: -ms-linear-gradient(top,  #FFFFFF 0%,#F9F9F9 100%); 
	background: linear-gradient(top,  #FFFFFF 0%,#F9F9F9 100%); 
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	}
.color-white span:before
	{
	border-color:#F9F9F9;
	}
.color-white span:after
	{
	content: "";
	display: block;
	position: absolute;
	left: 0px;
	top: 1px;
	width: 100%;
	height: 10px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	}