h3{ text-align: center;
font-family:Arial;
font-size:40px; }

#num   {float:left;
	display:inline;
list-style:none;
	margin-top:0px;	
	margin-bottom:60px;
	margin-left: 30px;


}

#num li {
        float:left;
	display:inline;
	color:#ab4785;
	text-align:center;

	margin-top: 0px;
	border-right:1px dotted #0163be;
	border-left:1px dotted #0163be;
	width:120px;
	height:85px;
	border:3px solid #0000;

	


}

#num li a {
	font-family:Myriad pro, Arial, Tahoma;
	font-size:15px; 
	color:#005db5;
    height:80px;
	display:block;
	outline:0;
	text-decoration:none;
    padding-top: 25px;	
    background: #f1f8fe;  -webkit-transition: color .4s linear; -moz-transition: color .4s linear; -ms-transition: color .4s linear; -o-transition: color .4s linear; transition: color .4s linear; }

#num li a:hover { background: #d6bb70; color: white; webkit-transition: color .4s linear; -moz-transition: color .4s linear; -ms-transition: color .4s linear; -o-transition: color .4s linear; transition: color .4s linear; }


.linea-tiempo {
  position: relative;
  width: 950px;
  max-width: 95vw;
  height: 100%;
  font-family: Arial;
}

.linea-tiempo::before {
  content: '';
  position: absolute;
  width: 3px;
  background-color: #000;
  left: 50%;
  height: 100%;
  border-radius: 10px;
}

.momento {
  position: relative;
  width: 45%;
  box-sizing: border-box;
}

.momento:nth-child(even) {
  left: 55%;
}

.momento::after {
  content: '';
  position: absolute;
  top: calc(50% + 10px);
  right: calc(-11.11% - 11.5px);
  height: 20px;
  width: 20px;
  background-color: #000;
  border-radius: 50%;
}

.momento:nth-child(even)::after {
  left: calc(-11.11% - 8.5px);
}

.momento h3 {
  margin: 10px 0px;
  font-size: 30px;
  text-align: center;
}

.momento .descripcion {
  background-color: #eee;
  border-radius: 10px;
  padding: 10px;
  line-height: 22px;
  font-size: 14px;
}

.momento .descripcion::after {
  content: '';
  position: absolute;
  right: -10px;
  top: calc(50% + 10px);
  height: 0;
  width: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 12px solid #eee;
}

.momento:nth-child(even) .descripcion {
  background-color: #3393FE;
  color: white;
}

.momento:nth-child(even) .descripcion::after{
  left: -10px;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-right: 12px solid #3393FE;
  border-left: none;
}


publi
{

float:center;
font-family:Myriad pro, Arial, Tahoma;
font-size:28px; 
color:#005db5;
text-align: center;
padding:10px 390px 15px 350px;
margin-left:82px;
margin-top:100px;
Width:90%;

}

.huella {
float:center;

	display:inline;
	color:#fff;
	text-align:center;
	letter-spacing: 1px;
}

.huella a {
    float:center;
    display:block;
	font-family:Myriad pro, Arial, Tahoma;
	font-size:50px; 
	font-weight:bold;
	color:#fff;
	outline:0;
    width:100%;
	text-decoration:none;
    padding: 7px 0 7px 0;
    margin-bottom:50px;
    border-radius:0px;
    background: #005db0; -webkit-transition: color .4s linear; -moz-transition: color .4s linear; -ms-transition: color .4s linear; -o-transition: color .4s linear; transition: color .4s linear; }
.huella a:hover { background:  #9fbcd2;  color: #0061a8;  webkit-transition: color .4s linear; -moz-transition: color .4s linear; -ms-transition: color .4s linear; -o-transition: color .4s linear; transition: color .4s linear; }

Col{background: #d6bb70; color: white;}

#huella a {
    display: block;      /* Para que se comporte como botón */
    background-color: #e2aee0;  /* Color rosa similar a la imagen */
    color: white;               /* Color del texto */
    text-decoration: none;      /* Quita subrayado */
    padding: 8px 20px;          /* Espaciado interno */
    border-radius: 20px;        /* Bordes redondeados */
    box-shadow: 2px 2px 4px rgba(0,0,0,0.2); /* Sombra ligera */
    font-family: Arial, sans-serif;
    font-weight: bold;
    text-align: center;

    
}

#huella a:hover {
    background-color: #d594d4;  /* Cambio de color al pasar el mouse */
}