/* Estructura */
body {
	margin:0;
}
.colorCeleste {
	background-color: #C8D6FB;
}
.colorGrisClaro {
	background-color: #E1E3E7;
}
.colorSeparador {
	background-color: #BDBEC6;
}
.colorAzulOcuro {
	background-color: #2E4654;
}
/* --------------------------------------------------------- */
#biografiaNombre {
	color: #333333;
	letter-spacing: -1px;
	background:  url("../imagenes/periodico_dotted-line.gif") bottom repeat-x;
	line-height: 1.5em;
	padding: 0px;
	font-size: 1.1em;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
	width: 100%;
	text-align: center;
}
#biografiaTexto {
	color: #333333;
	font-size: 0.8em;
	line-height: 140%;
	text-align: justify;
	margin: 5px;
}
#biografiaMarcoSuperior {
	background-color: #C8D6FB;
	margin: 4px;
}
/* --------------------------------------------------------- */
/* --------------------------------------------------------- */
span.tool {
  position: relative;   /* this is key */
  cursor: help;
}
 
span.tool span.tip {
  display: none;        /* so is this */
}

/* tooltip will display on :hover event */
 
span.tool:hover span.tip {
  display: block;
  z-index: 100;
  position: absolute;
  top: 2.5em;
  left: 0;
  width: auto;
  line-height: 1.2em;
  padding: 3px 7px 4px 6px;
  border: 1px solid #336;
  background-color: #f7f7ee;
  font-family: arial, helvetica, sans-serif;
  font-size: 12px;
  font-weight: normal;
  color: #000;
  text-align: left;
}

#biografiaTexto span.tool::after {
  padding-left: 2px;            /* eye candy */
  content: url(../imagenes/bubble.gif);
}