Código: Álbum de mascotas.
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Asoc. de Apoyo a los Animales Callejeros: Album de mascotas.</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<!--Estilos CSS -->
<link rel="stylesheet" href="Se1.css" type="text/css" style="stylesheet" media="screen" />
<!--Insertar Favorite icon de 16 x 16 px -->
<link href="favicon.ico" rel="shortcut icon"/>
<script language="JavaScript" type="text/javascript">
var i = 0;
function md(){
if (i > -380){
window.i = window.i - 25;
document.getElementById("imagentiraI").style.left = String(i) + "px";
document.getElementById("imagentiraII").style.left = String(i) + "px";
document.getElementById("imagentiraIII").style.left = String(i) + "px";
document.getElementById("imagentiraIV").style.left = String(i) + "px";
document.getElementById("imagentiraV").style.left = String(i) + "px";
document.getElementById("imagentiraVI").style.left = String(i) + "px";
document.getElementById("imagentiraVII").style.left = String(i) + "px";
document.getElementById("imagentiraVIII").style.left = String(i) + "px";
document.getElementById("imagentiraIX").style.left = String(i) + "px";
}
}/* fin función md */
function mi(){
if (i < 0 ){
window.i = window.i + 25;
document.getElementById("imagentiraI").style.left = String(i) + "px";
document.getElementById("imagentiraII").style.left = String(i) + "px";
document.getElementById("imagentiraIII").style.left = String(i) + "px";
document.getElementById("imagentiraIV").style.left = String(i) + "px";
document.getElementById("imagentiraV").style.left = String(i) + "px";
document.getElementById("imagentiraVI").style.left = String(i) + "px";
document.getElementById("imagentiraVII").style.left = String(i) + "px";
document.getElementById("imagentiraVIII").style.left = String(i) + "px";
document.getElementById("imagentiraIX").style.left = String(i) + "px";
} /* fin if */
} /* fin función mi */
/* Descripción del animal */
var codigo = ["imagentiraI", "imagentiraII", "imagentiraIII", "imagentiraIV", "imagentiraV", "imagentiraVI", "imagentiraimagentiraVII", "imagentiraVIII", "imagentiraIX"];
var nombre=["Blaqui", "Garfield", "Lolita", "Rocco", "Chuchito", "Pablo y Matilda", "Tay", "Lobito", "Lula"];
var raza = ["Border Collie Mestizo", "Tabby Mestizo", "Somalí Mestizo", "Boxer", "Fox Terrier Mestizo", "Galgos Mestizos", "Mestizo", "Pomeranian Mestizo", "Pastor Alemán Mestiza"];
var tamaño = ["Mediano / Grande (21 kg. aprox.)", "Pequeño (2.5 kg. aprox.)", "Pequeño (1.1 kg. aprox.)", "Mediano / Grande (25.8 kg)", "Pequeño (9.6 kg. aprox.)", "Pequeños (10.8 kg. y 9.7 kg. aprox.)", "Pequeño (6.5 kg. aprox.)", "Mediano (14.3 kg. aprox.)", "Mediano (20 kg. aprox.)"];
var estado = ["Vacunado y desparasitado","Vacunado y desparasitado", "Vacunada y desparasitada / Castrada","Vacunado y desparasitado","Vacunado y desparasitado", "Vacunados, desparasitados. / Recuperando peso","Vacunado y desparasitado","Vacunado y desparasitado", "Vacunada y desparasitada / Castrada"];
var aptitud = ["Valiente / Inteligente / Necesita espacio y mucho verde.","Juguetón / Valiente / El terror de los ratones!", "Temeraria / No teme a las alturas / Adora el pescado!","Fuerte / Leal / Afectuoso","Cazador nato / Ratones a esconderse!", "Inteligentes / Obedientes / Inseparables","Fuerte / Guardián / El mago de las piruetas!","Cazador / Valiente", "Inteligente / Dócil / Compañera"];
/* Historia de vida */
var cero= "Foto 1 / Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per. Ius id vidit volumus mandamus, vide veritus democritum te nec, ei eos debet libris consulatu. No mei ferri graeco dicunt, ad cum veri accommodare. Sed at malis omnesque delicata, usu et iusto zzril meliore. Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per. In usu latine equidem dolores.";
var uno = "Foto 2 / Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per. Ius id vidit volumus mandamus, vide veritus democritum te nec, ei eos debet libris consulatu. No mei ferri graeco dicunt, ad cum veri accommodare. Sed at malis omnesque delicata, usu et iusto zzril meliore.";
var dos= "Foto 3 / Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per. Ius id vidit volumus mandamus, vide veritus democritum te nec, ei eos debet libris consulatu. No mei ferri graeco dicunt, ad cum veri accommodare. Sed at malis omnesque delicata, usu et iusto zzril meliore.";
var tres= "Foto 4 / Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per. Ius id vidit volumus mandamus, vide veritus democritum te nec, ei eos debet libris consulatu. No mei ferri graeco dicunt, ad cum veri accommodare Sed at malis omnesque delicata, usu et iusto zzril meliore.";
var cuatro = "Foto 5 / Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per. Ius id vidit volumus mandamus, vide veritus democritum te nec, ei eos debet libris consulatu. No mei ferri graeco dicunt, ad cum veri accommodare. Sed at malis omnesque delicata, usu et iusto zzril meliore.";
var cinco = "Foto 6 / Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per. Ius id vidit volumus mandamus, vide veritus democritum te nec, ei eos debet libris consulatu. No mei ferri graeco dicunt, ad cum veri accommodare. Sed at malis omnesque delicata, usu et iusto zzril meliore.";
var seis= "Foto 7 / Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per. Ius id vidit volumus mandamus, vide veritus democritum te nec, ei eos debet libris consulatu. No mei ferri graeco dicunt, ad cum veri accommodare. Sed at malis omnesque delicata, usu et iusto zzril meliore. Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per. Ius id vidit volumus mandamus, vide veritus democritum te nec, ei eos debet libris consulatu. No mei ferri graeco dicunt, ad cum veri accommodare. Sed at malis omnesque delicata, usu et iusto zzril meliore. Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per. In usu latine equidem dolores.";
var siete= "Foto 8 / Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per. Ius id vidit volumus mandamus, vide veritus democritum te nec, ei eos debet libris consulatu. No mei ferri graeco dicunt, ad cum veri accommodare. Sed at malis omnesque delicata, usu et iusto zzril meliore.";
var ocho= "Foto 9/ Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per. Ius id vidit volumus mandamus, vide veritus democritum te nec, ei eos debet libris consulatu. No mei ferri graeco dicunt, ad cum veri accommodare. Sed at malis omnesque delicata, usu et iusto zzril meliore. Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per. Ius id vidit volumus mandamus, vide veritus democritum te nec, ei eos debet libris consulatu. No mei ferri graeco dicunt, ad cum veri accommodare. Sed at malis omnesque delicata, usu et iusto zzril meliore. Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per. In usu latine equidem dolores. Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per. Ius id vidit volumus mandamus, vide veritus democritum te nec, ei eos debet libris consulatu. No mei ferri graeco dicunt, ad cum veri accommodare. Sed at malis omnesque delicata, usu et iusto zzril meliore. Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per. In usu latine equidem dolores."
var indicefoto = 0;
var indicehistoria = 0;
/* Ampliar foto y mostrar caracter´siticas del animal */
function ampliar(objeto, j){
window.document.getElementById("imagenampliada").src= objeto;
j= parseInt(j);
indicehistoria = j;
indicefoto = j;
window.document.getElementById("idnombre").value = nombre[j];
window.document.getElementById("idraza").value = raza[j];
window.document.getElementById("idtamaño").value = tamaño[j];
window.document.getElementById("idestado").value = estado[j];
window.document.getElementById("idaptitud").value = aptitud[j];
/* Desactivar historia de vida */
cerrar();
}
var parrafo; /*Se define global para que pueda ser usada en las funciones agregar y eliminar */
/* Mostrar historia a traves del boton ver + / Agregar parrafo */
function historia(indicefoto){
// Cambiar rotulo del boton para cerrar
var rutaboton =document.getElementById("vermas");
rutaboton.value="Cerrar";
/* Pasos */
// Primero: Crear nodo tipo elemento
parrafo = window.document.createElement("p");
switch (parseInt(indicefoto)){
case 0:
// Segundo: Crear el contenido del tipo de elemento / Variables cero uno, dos, tres ... ocho definidas arriba.
var contenido = document.createTextNode(cero);
break;
case 1:
// Segundo: Crear el contenido del tipo de elemento / Variables cero uno, dos, tres ... ocho definidas arriba.
var contenido = document.createTextNode(uno);
break;
case 2:
// Segundo: Crear el contenido del tipo de elemento / Variables cero uno, dos, tres ... ocho definidas arriba.
var contenido = document.createTextNode(dos);
break;
case 3:
// Segundo: Crear el contenido del tipo de elemento / Variables cero uno, dos, tres ... ocho definidas arriba.
var contenido = document.createTextNode(tres);
break;
case 4:
// Segundo: Crear el contenido del tipo de elemento / Variables cero uno, dos, tres ... ocho definidas arriba.
var contenido = document.createTextNode(cuatro);
break;
case 5:
// Segundo: Crear el contenido del tipo de elemento / Variables cero uno, dos, tres ... ocho definidas arriba.
var contenido = document.createTextNode(cinco);
break;
case 6:
// Segundo: Crear el contenido del tipo de elemento / Variables cero uno, dos, tres ... ocho definidas arriba.
var contenido = document.createTextNode(seis);
break;
case 7:
// Segundo: Crear el contenido del tipo de elemento / Variables cero uno, dos, tres ... ocho definidas arriba.
var contenido = document.createTextNode(siete);
break;
case 8:
// Segundo: Crear el contenido del tipo de elemento / Variables cero uno, dos, tres ... ocho definidas arriba.
var contenido = document.createTextNode(ocho);
break;
default:
}
// Tercero: Añadir el con p (parrafo)
parrafo.appendChild(contenido);
// Cuarto: Añadir el elemento p como hijo del documento
var rutatexto=document.getElementById("conocerhistoria");
rutatexto.appendChild(parrafo); /*rutatexto indica el lugar en donde quiero añadir el parrafo. */
}
function cerrar(){
/* Cambiar rotulo al boton */
var rutaboton =document.getElementById("vermas");
rutaboton.value="Conoce su historia de vida!";
/* Eliminar el nodo historia de vida / eliminar parrafo */
parrafo.parentNode.removeChild(parrafo); /* La ruta esta definida en parrafo como variable global */
}
function determinarhistoria(){
var rutaboton =document.getElementById("vermas");
if (rutaboton.value == "Conoce su historia de vida!"){
historia(indicehistoria);
} else {
cerrar();
}
}
</script>
</head>
<body >
<!--Inicio Contenedor-->
<div id="contenedor">
<!--Inicio Cabecera -->
<div id="cabecera"> <img src="CabeceraSE1.JPG"/>
<!--Inicio Título-->
<div id= "titulo"> ASOCIACION DE APOYO A LOS <br/>
ANIMALES CALLEJEROS </div>
<!--fin titulo -->
<!--Inicio Subtítulo-->
<div id="subtitulo"> juntos podemos ayudar! </div>
<!--fin subtitulo -->
</div>
<!--fin cabecera -->
<!--Inicio Cuerpo -->
<div id="cuerpo">
<!--Inicio Menu -->
<div id="menu">
<ul>
<li><a href="file:///C:/escuela2012/plantillas/se1/index.html" target="_self" >Inicio</a>
</li>
<li>|</li>
<li><a href="file:///C:/escuela2012/plantillas/se1/carrito.htm" target="_self">Compra
Nuestros Productos</a></li>
<li>|</li>
<li><a href="#" title="Vínculo en construcción: Preguntas frecuentes / Test de autoevaluación / Pasos para la adopción segura" target="_self">Despeja
Tus Dudas</a></li>
<li>|</li>
<li><a href="#" target="_self" title="Vínculo en construcción: Opiniones / Comentarios">Historias
Exitosas</a></li>
<li>|</li>
<li><a href="file:///C:/escuela2012/plantillas/se1/contacto.htm" target="_self">Contáctanos</a></li>
</ul>
</div>
<!--fin menu -->
<!--Inicio Contenido-->
<div id="contenido" style="overflow-x:hidden; overflow-y:scroll;"> <a name="arriba"></a>
<div id="tira" style="overflow: hidden; border-bottom: 2px solid #666666;">
<img id="imagentiraI" class="imagentira" src="AdopcionI.JPG" onclick="ampliar('C:/Escuela2012/Plantillas/SE1/AdopcionI.JPG', 0);" />
<img id="imagentiraII" class="imagentira" src="AdopcionII.JPG" onclick="ampliar('C:/Escuela2012/Plantillas/SE1/AdopcionII.JPG', 1);"/>
<img id="imagentiraIII" class="imagentira" src="AdopcionIII.JPG" onclick="ampliar('C:/Escuela2012/Plantillas/SE1/AdopcionIII.JPG', 2);"/>
<img id="imagentiraIV" class="imagentira" src="AdopcionIV.JPG" onclick="ampliar('C:/Escuela2012/Plantillas/SE1/AdopcionIV.JPG', 3);"/>
<img id="imagentiraV" class="imagentira" src="AdopcionV.JPG" onclick="ampliar('C:/Escuela2012/Plantillas/SE1/AdopcionV.JPG', 4);"/>
<img id="imagentiraVI" class="imagentira" src="AdopcionVI.JPG" onclick="ampliar('C:/Escuela2012/Plantillas/SE1/AdopcionVI.JPG', 5);"/>
<img id="imagentiraVII" class="imagentira" src="AdopcionVII.JPG" onclick="ampliar('C:/Escuela2012/Plantillas/SE1/AdopcionVII.JPG', 6);"/>
<img id="imagentiraVIII" class="imagentira" src="AdopcionVIII.JPG" onclick="ampliar('C:/Escuela2012/Plantillas/SE1/AdopcionVIII.JPG', 7);"/>
<img id="imagentiraIX" class="imagentira" src="AdopcionIX.JPG" onclick="ampliar('C:/Escuela2012/Plantillas/SE1/AdopcionIX.JPG', 8);"/>
</div>
<!--Botones de desplazamiento-->
<div id="botones" style="left:565px; width: 228px;">
<input type="button" style="width:45px;" value="Ver +" onclick="javascript:md();" />
|
<input type="button" style="width:150px;" value="Ir a la primer imagen" onclick="javascript:mi();" />
</div>
<!--Fin Botones de desplazamiento-->
<div id="lateralizq" style="top: 160px; width: 260px; height: 300px; padding: 0px;">
<!--Posición de la imagen ampliada -->
<!--Idem inicio, mira nuestro trabajo, etc. / Imagen ampliada -->
<img id="imagenampliada" src="file:///C:/Escuela2012/Plantillas/SE1/AdopcionI.JPG" />
</div>
<!--División datos -->
<div id="centro" style="top: 160px; left: 280px; width: 490px; height: 220px;">
<br/>
<br/>
<br/>
<div> Nombre:
<input id="idnombre" type="text" value="Blaqui" disabled= "disabled" style="width: 410px; font: bold 14px arial; border:none; background-color: white"/></br>
</div>
<div> Raza:
<input id="idraza" type="text" value="Pastor Mestizo" disabled= "disabled" style="width:410px; font: bold 14px arial; border:none; background-color: white"/></br>
</div>
<div> Tamaño:
<input id="idtamaño" type="text" value="Mediano / Grande (21 kg. aprox.)" disabled= "disabled" style="width: 410px; font: bold 14px arial; border:none; background-color: white"/></br>
</div>
<div> Estado:
<input id="idestado" type="text" value="Vacunado y desparasitado" disabled= "disabled" style="width: 410px; font: bold 14px arial; border:none; background-color: white"/></br>
</div>
<div> Aptitudes:
<input id="idaptitud" type="text" value="Valiente / Inteligente / Necesita espacio y mucho verde." disabled= "disabled" style="width: 410px; font: bold 14px arial; border:none; background-color: white"/></br>
</div>
<br />
<div>
<!-- ver historia de vida -->
<p>
<input type="button" id="vermas" value="Conoce su historia de vida!" onclick="javascript: determinarhistoria();" />
</p>
<br/>
</div>
</div>
<!--fin contenido -->
<div id="conocerhistoria" style="position: relative; top: 290px; margin:10px 10px 10px 10px;">
</div>
</div>
</div>
<!--fin cuerpo -->
<!--Inicio Pie-->
<div id ="pie">
<p>Contacto: calle nro.- dpto - piso / ciudad / provincia | Tel.:(0000)- 99999
| correo@servidor.com | <a href="politicaprivacidad.htm" target="_self">Política
de Privacidad</a></p>
</div>
<!--fin pie -->
</div>
<!-- fin contenedor-->
</body>
</html>