/* @group simple tooltip  */
/* jquey rooltips

	generierte code: 
	================
	.tooltipContent (.tooltipright, .tooltiptop, .tooltipleft, .tooltipbottom)
		%a.tooltipIcon
			%i
		Inhalt des Title Attrbutes
		
	Requires:
	=========
	JQUERY 
	/js/jquery/jquery.tools.min.js
	/js/jquery/jquery.tooltip.js
	
		
*/

.has_tooltip{}
.tooltipContent{position:  relative; background:  #fff; 
	width: 150px; padding:  5px; 
	border: 2px solid;
	-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;
	-webkit-box-shadow: 2px 2px 10px rgba(0,0,0,0.4); -moz-box-shadow: 2px 2px 10px rgba(0,0,0,0.4); box-shadow: 2px 2px 10px rgba(0,0,0,0.4); 
}

.tooltipIcon {position: absolute; 
	width:0; height:0; 
	border: 10px solid transparent;
	bottom:  -20px;	left:  50%; 
	margin-left:  -10px;
}

.tooltipIcon i{
	top: -13px;
	left: -10px;
	position: absolute; 
	width:0; height:0; 
	border: 10px solid transparent;
	border-top-color:  #fff;}

.tooltipright{margin-left: -30px;}
.tooltipright .tooltipIcon {left:  15px; right:  auto;}
.tooltipleft{margin-left: 30px;}
.tooltipleft .tooltipIcon{left:  auto; right:  5px;}



.tooltipbottom .tooltipIcon{top: -20px;}
.tooltipbottom .tooltipIcon i{top: auto; bottom:  -13px;}

.tooltipContent {border-color: #ccc; color:  #000; }
.tooltipIcon{border-top-color: #ccc;}
.tooltipbottom .tooltipIcon{border-top-color: transparent; border-bottom-color:  #ccc;}
.tooltipbottom .tooltipIcon i{border-top-color: transparent; border-bottom-color:  #fff; }

#phoneSupportBox p.small {
    color: #66666;
    font-size: 10px;
    line-height: 14px;
}

#phoneSupportBox p {
    font-size: 12px;
    font-family: verdana;
}

#phoneSupportBox strong {
    font-size: 12px;
    font-family: verdana;
    font-weight: bold;
}

/* @end */