<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Earthing-Was ist Earthing</title>
<style type="text/css">
body {
font-family: Arial;
background-color: #dfcfa8;
font-size: 14px;
}
.background{
position: absolute; /*nos posicionamos en el centro del navegador*/
top:50%; left:50%; /*determinamos una anchura*/
width:1100px; /*indicamos que el margen izquierdo, es la mitad de la anchura*/
margin-left:-550px; /*determinamos una altura*/
height:677px; /*indicamos que el margen superior, es la mitad de la altura*/
margin-top:-338px;
}
.background.span {
position: absolute;
left: 0;
}
#contenedortabla{
position:absolute;
top:90px ; /*mover esto para alinearlo verticalmente*/
left:100px; /*mover esto para alinearlo a la horizontalmente*/
}
#boton2 {
position: absolute;
top: 10px;
left: 10px;
}
#botones {
position: absolute;
display:inline;
top: 400px;
left: 280px;
}
li.opcion{
display:inline;
}
li.opcion:hover{
border-radius: 50%; /* Borde redondeado */
box-shadow: 0px 0px 15px #000; /* Sombra */
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
cursor:pointer;
}
p {font-family: Arial; font-size:14px; text-align:justify; }
h1 {font-family: Arial, bold; font-size:18px; color:rgb(0,40,101); text-align: justify; }
</style>
</head>
<body>
<div class="background"> <img src="http://cubos.datcom.ch/earthing/images/Mann nuevo sintexto.jpg" width="1100px" height="677px" alt="" title="" />
<span>
<div id="contenedortabla">
<table align= "center">
<TABLE WIDTH=700 HEIGHT=200><tbody><tr><td width="50%" style="padding-right: 15px; margin-top: 20px; padding-left: 15px; padding-bottom: 15px; width: 20%; padding-top: 15px"><p style="text-align: justify"><h1 align="justify">Natürlich bla bla blaaaaa</h1>
<p>Aqui va a un parrafo</p>
<h1 align="justify">bla bla bla</h1>
<center></center>
<td width="50%" style="padding-right: 15px; margin-top: 20px; padding-left: 15px; padding-bottom: 15px; width: 20%; padding-top: 15px"><p style="text-align: justify">aqui va otro parrafo
<UL type = "disc">
<LI>
<div align="justify">un punto
</div>
</LI>
<LI>
<div align="justify">otro punto
</div>
</LI>
<LI>
<div align="justify">otro punto bla bla
</div>
</LI>
</UL>
</p>
</td>
</td></tr>
<tr>
<td style="padding-right: 15px; margin-top: 20px; padding-left: 15px; padding-bottom: 15px; width: 20%; padding-top: 15px"> </td>
<td style="padding-right: 15px; margin-top: 0px; padding-left: 15px; padding-bottom: 15px; width: 20%; padding-top: 15px"> </td>
</tr>
</tbody>
</table>
</table>
<center> </center>
</span>
<div id="botones">
<ul style="list-style-type:none; display:inline;">
<li class="opcion"><a href="was.html"><img src="http://cubos.datcom.ch/earthing/images/tierra.png" width="20px" height="20px" ></a></li>
<li class="opcion"><a href="was2.html"><img src="http://cubos.datcom.ch/earthing/images/tierra.png" width="20px" height="20px" ></a></li>
<li class="opcion"><a href="was3.html"><img src="http://cubos.datcom.ch/earthing/images/tierra.png" width="20px" height="20px" ></a></li>
</ul>
</div>
</div>
<div id="boton2">
<a href="Index nuevo.html" > <img src ="http://cubos.datcom.ch/earthing/images/tierrahome.png" width="80px" height="80px" > </a>
</div>
</div>
</body>
</html>