<HTML>
<HEAD>
<TITLE>Quienes Somos</TITLE>
<style type="text/css">
#slider{
            margin: 0 auto;
            width: 800px;
            height: 500px;
            overflow:hidden;
            background-color: black;
        }
    /*Valores de las imagenes*/
        #slider img{
            margin: 0 auto;
            -moz-transition: opacity 2s;
            -webkit-transition: opacity 2s;
            transition: opacity 2s;
            width: 800px;
            height: 500px;
            position: absolute;
            opacity: 0;
        }
    /*Para que la primera imagen este activa al inicio*/
        #slider img:nth-child(1){
            opacity: 1;
        }
</style>
<script>
/*Cargador de eventos al iniciar la página*/
    window.addEventListener('load',iniciar,false);

    /*Contador inicializado en cero*/
    var contador=0;

    function iniciar(){
        setInterval('cambiarImg()',2000);
    }

    function cambiarImg(){
        var obj=document.getElementById('slider');
        var obj2=obj.getElementsByTagName('img');

        if(contador==obj2.length){
            for(var i=0; i<obj2.length; i++){
                obj2[i].style.opacity='0';
                contador--;
            }
            obj2[contador].style.opacity='1';
        }
        else{
        obj2[contador].style.opacity='1';
        contador++
        }
    }
 </script>
</HEAD>
<BODY style="background-image:url('fondo38.jpg')">
<center>
<table style="border:2px solid #000000;border-collapse: collapse;width:800px;background-color:#66A3E0;color:#96E9C2;height:50px">
<tr>
<td style="width:50px;height:50px;text-align:center"><image src="fondo15.jpg"</td>
<td style="width:84px;height:50px;text-align:center;font-size:49pt">Quienes Somos</td>
<td style="width:50px;height:50px;text-align:center"><image src="fondo15.jpg"</td>
</tr>
</table>
<br>
<table style="border:2px solid #000000;border-collapse: collapse;width:800px;background-color:#66A3E0;color:#96E9C2;height:50px">
<tr>
<td style="border:1px solid #000000;width:84px;height:50px;text-align:center"><a href="./index.html"  style="color:#96E9C2;">Inside of Books</a></td> 
<td style="border:1px solid #000000;width:84px;height:50px;text-align:center"><a href="./géneros.html"  style="color:#96E9C2;">Géneros</a></td> 
<td style="border:1px solid #000000;width:84px;height:50px;text-align:center"><a href="./formulario2.html"  style="color:#96E9C2;">Formulario</a></td>
<td style="border:1px solid #000000;width:84px;height:50px;text-align:center"><a href="./quienessomos.html"  style="color:#96E9C2;">Quienes Somos</a></td>
<td style="border:1px solid #000000;width:84px;height:50px;text-align:center"><a href="./lugares.html"  style="color:#96E9C2;">Lugares</a></td>
</tr>
</table>
<br><br>
<table style="border:2px solid #ffffff;border-collapse: collapse;width:800px;background-color:#FF8080;color:#ffffff;height:50px">
<tr>
<td style="width:800px;height:730px;;text-align:center;text-align:justify;padding:26px">Hola, bienvenidos a mi página web.<br>Esta es una página en la que yo que soy una persona a la que le apasiona leer y le encanta hacer reseñas sobre los libros leidos , por ese motivo he creado esta página web de este tema , para contarle a todo el mundo que me quiera leer sobre mi opnión de los libros que he leido.Espero que os guste mucho mi página.<br><br>

<div id="slider">
        <img class="slide" src="fondo13.jpg" alt="">
        <img class="slide" src="fondo14.jpg" alt="">
        <img class="slide" src="fondo56.jpg" alt="">
        <img class="slide" src="fondo57.jpg" alt="">
        <img class="slide" src="fondo58.jpg" alt="">
        <img class="slide" src="fondo59.jpg" alt="">

    </div>
</td>
</tr>
</table>
<table>
<tr>
<td style="width:836px;height:20px;text-align:center;padding:8px;background-color:#B9596D;color:#FCE3E7">Realizado por:Araceli Ruiz Vallecillo.
</td>
</tr>
</table>