/**************************************/
/*                                    */
/*              tooltip               */
/*                                    */
/**************************************/
.tooltip_trigger {
	display:block;
	position:relative;
	z-index:200;
}

.tooltip_trigger:hover .tooltip_box,
.tooltip_trigger.keep_active .tooltip_box {
	visibility: visible;
}

.tooltip_box {
  visibility:hidden;
  position: absolute;
  color: white;
  background: rgba(0,0,0,0.7);
  padding: 10px;
  border-radius: 4px;
  -webkit-transition: visibility 300ms ease-out 100ms;
  -moz-transition: visibility 300ms ease-out 100ms;
  -o-transition: visibility 300ms ease-out 100ms;
  transition: visibility 300ms ease-out 100ms;
  width:250px;
  font-family: Tahoma, Helvetica, sans-serif;
  font-size: 12px;
  
}

.tooltip_box a {
  font-weight: bold;
  color: #0075AD;
}

.no_delay {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -o-transition: none !important;
  transition: none !important;
}

.tooltip_box:before {
  content:"";
  position:absolute;
  width: 0;
  height: 0;
}


/************************************/
/*                                  */
/*   VALIDATION CSS FOR RESET.PHP   */
/*                                  */
/************************************/
.tooltip_box ul.validate li {
  list-style-type: circle; 
  font-size: x-large; 
  list-style-position: inside;
  color:;
  margin-left: -10px;   
}
  
.tooltip_box ul.validate li span {
  font-size: 10px; 
  color: white; 
  vertical-align: top; 
  margin-left: -5px;
}
  
.error{
  visibility: hidden;
  height: 0px; overflow: visible; 
  color: red; font-size: smaller;
  position: relative;
  top:-3px;
}



/**************************************/
/*                                    */
/*   welcome-message/header tooltip   */
/*                                    */
/**************************************/
#user_popup {
	left: auto;
	right: 0px;
	padding: 0px;
	margin: 10px -7px 0 0;
	max-width: none;
	width: 275px;
	font-style: normal;
	font-size: 13px;
	font-family: Verdana, Arial, Geneva, sans-serif;
  color: black;
  background-color: white;
  -moz-box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.5);
  -webkit-box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.5);
  box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.5);
}

#user_popup.arrow_top:before {
  border-bottom: 10px solid white !important;
}

/**************************************/
/*                                    */
/*   profile "other"-input  tooltip   */
/*                                    */
/**************************************/
#other_popup {
	max-width:180px; 
	top:-70px; 
	left:50%;
	padding:0px;	
	border-color:#ffa600;
	border-width:/*2px*/;
	border-radius:0px;
	margin-left:-91px; /* must be half of true width */
	font-size:9px;
}


/**************************************/
/*                                    */
/*   tooltip pointing to help_me/"?"  */
/*                                    */
/**************************************/
.help_me span{
	position: relative;
	color: #0075AD; 
	cursor:pointer;
	font-weight:bold;
	border: 2px solid #0075AD;
	border-radius:50%;
	padding:2px 6px;
	-moz-box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.5);
	-webkit-box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.5);
	box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.5);
}

.help_me.tooltip_trigger .tooltip_box {
	top:-13px;
	left:40px;
	max-width: 175px;
}

.information {
	width: 18px;
	height: 18px;
	text-align: center;
	line-height: 18px; 
	display: inline-block;
	font-size: 13px;
	font-style: italic;
	font-weight: bold; 
	font-family: times new roman, times, serif; 
	text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
	color: #F5F5F5 !important;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	background-color: #3093c7; 
	background-image: -webkit-gradient(linear, left top, left bottom, from(#3093c7), to(#1c5a85));
	background-image: -webkit-linear-gradient(top, #3093c7, #1c5a85);
	background-image: -moz-linear-gradient(top, #3093c7, #1c5a85);
	background-image: -ms-linear-gradient(top, #3093c7, #1c5a85);
	background-image: -o-linear-gradient(top, #3093c7, #1c5a85);
	background-image: linear-gradient(to bottom, #3093c7, #1c5a85);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#3093c7, endColorstr=#1c5a85);
}

.information:hover,
.information.active {
	border:0px solid #5ca6c4;
	text-decoration: none !important;
	background-color: #26759e; 
	background-image: -webkit-gradient(linear, left top, left bottom, from(#26759e), to(#133d5b));
	background-image: -webkit-linear-gradient(top, #26759e, #133d5b);
	background-image: -moz-linear-gradient(top, #26759e, #133d5b);
	background-image: -ms-linear-gradient(top, #26759e, #133d5b);
	background-image: -o-linear-gradient(top, #26759e, #133d5b);
	background-image: linear-gradient(to bottom, #26759e, #133d5b);
	filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#26759e, endColorstr=#133d5b);
}


/************************************/
/*                                  */
/* tooltip arrow-pointer directions */
/*                                  */
/************************************/
.arrow_left:before {
  left: -10px;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-right: 10px solid rgba(0,0,0,0.7);
}

    .arrow_left.top:before {
      top: 15%;
    }

    .arrow_left.middle:before {
      top: 45%;
    }

    .arrow_left.bottom:before {
      bottom: 15%;
    }

.arrow_top:before {
  top: -10px;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid rgba(0,0,0,0.7);
}

    .arrow_top.left:before {
      left: 3%;
    }

    .arrow_top.middle:before {
      left: 45%;
    }

    .arrow_top.right:before {
      right: 3%;
    }

.arrow_bottom:before {
  bottom: -10px;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid rgba(0,0,0,0.7);
}

    .arrow_bottom.left:before {
      left: 3%;
    }

    .arrow_bottom.middle:before {
      left: 45%;
    }

    .arrow_bottom.right:before {
      right: 3%;
    }
