<div class="teasing-part" style="
  display: none;
  background: #222;
  color: #eee; 
  position: absolute; 
  top: 0; 
  left: 0; 
  width: 100%;
  height: 100%;
  box-shadow: 0 5px 15px rgba(0,0,0,0.45);
  overflow: hidden">                                                                      

<div style="
  position: absolute;
  top: 7%;
  width: 100%;
  text-align: center;
  text-align: center">
<img src="https://yunohost.org/images/ynh_logo_white.png" width="100"/>
</div>

<br />

<div style="
  position: absolute; 
  top: 27%; 
  width: 100%; 
  text-align: center; 
  font-weight: bold; 
  margin: 50px auto 0">
<p style="font-size: 3em; margin-bottom: 4%">
<span class="yolo 1" style="color: #FF3399;">datalove <3</span>
<span class="yolo 2" style="color: #6699FF;">data@home</span>
<span class="yolo 3" style="color: #66FF33;">Alojar arriba, dijeron</span>
<span class="yolo 4" style="color: #00FFCC;">Host me I'm famous</span>
<span class="yolo 5" style="color: #FF5050;">sudo internet</span>
<span class="yolo 6" style="color: #FF0066;">Ellos alojamientido y tenía muchos hijos</span>
<span class="yolo 8" style="color: #FFFFFF;">Try Internet</span>
<span class="yolo 7" style="color: #3366FF;">Internet, lectura y escritura</span>
<span class="yolo 9" style="color: #CC66FF;">No tengo nada que ocultar</span>
<span class="yolo 10" style="color: #FF6600;">How I met your server</span>
<span class="yolo 11" style="color: #FF3399;">datalove <3</span>
</p>
<button class="btn btn-primary btn-lg btn-block yolobtn"  style="
  min-width: 200px; 
  width: 20%; 
  margin: 0 auto;
  color: #222;
  font-size: 1.6em">Perdón ?</button>
</div>


<br />

<div class="text-center hidden-xs" style="
  width: 100%;
  position: absolute; 
  top: 90%;
  text-align: center;">
<a style="color: #777" href="http://news.yunohost.org">últimas noticias</a> <span class="colored-bar">•</span> <a style="color: #777" href="https://ask.yunohost.org" target="_blank">Preguntas más frecuentes</a> <span class="colored-bar">•</span> <a style="color: #777" href="/docs_fr">Documentación</a>
</div>

</div>

<div class="boring-part" markdown="1">

<h1>YunoHost <small>es un herramiento que permite installar et utilizar facilamente sur propio servidor.</small></h1>

<br />

<div style="
  width: 100%; 
  max-height: 350px; 
  overflow: hidden; 
  border-radius: 5px; 
  border: 1px solid rgba(0,0,0,0.15); 
  box-shadow: 0 5px 15px rgba(0,0,0,0.35);">

<img style="width: 100%; min-width: 580px;" src="https://yunohost.org/images/home_panel.jpg" />
</div>


<div class="text-center" style="
  width: auto; 
  min-width: 150px; 
  margin: 40px auto 0;">
<a class="btn btn-primary btn-lg"  style="min-width: 150px; font-size: 1.5em;margin-bottom:0.5em;" href="/try">Intentar</a> <a class="btn btn-success btn-lg" style="min-width: 150px; font-size: 1.5em;margin-bottom:0.5em;" href="/whatsyunohost">Obtenga más información</a>
<p class="text-muted text-center"><small>YunoHost v2 • bêta4</small></p>
</div>

<br />

<hr />

<br />
<br />

<div class="row">
<div class="col-md-7">
<h1>Installar <small>su seridor simplemente, tienes todo a casa</small></h1>
<p><br /><a href="/install_fr">Ver los requisitos previos</a></p>
</div>
<div class="col-md-4">
<div style="
  width: 100%; 
  max-height: 290px; 
  overflow: hidden; 
  border-radius: 5px; 
  border: 1px solid rgba(0,0,0,0.15); 
  box-shadow: 0 5px 15px rgba(0,0,0,0.35);">

<img style="width: 100%; min-width: 320px; max-width: 635px" src="https://yunohost.org/images/home_install.png" />
</div>
</div>
</div>


<div class="clearfix"></div>
<br />
<br />
<hr />
<br />
<br />

<div class="row">
<div class="col-md-4">
<div style="
  width: 100%; 
  max-height: 290px; 
  overflow: hidden; 
  border-radius: 5px; 
  border: 1px solid rgba(0,0,0,0.15); 
  box-shadow: 0 5px 15px rgba(0,0,0,0.35);">

<img style="width: 100%; min-width: 580px; max-width: 635px" src="https://yunohost.org/images/home_enjoy.jpg" />
</div>
</div>

<div class="col-md-7 text-right">
<h1>Disfrutar <small>de sus aplicaciones web, y crea su esquina de Internet</small></h1>
<p><br /><a href="/apps_fr">Lista de aplicationes disponible</a></p>
</div>
</div>

<div class="clearfix"></div>

<br />
<br />
<hr />
<br />
<br />

<div class="row">
<div class="col-md-7">
<h1>Gestionar <small>su servidor como quieras : via web, móvil o en línea de comandos</small></h1>
<p><br /><a href="/try_fr">Intentar el interfaz de administración</a></p>
</div>
<div class="col-md-4">
<div style="
  width: 100%; 
  max-height: 290px; 
  overflow: hidden; 
  border-radius: 5px; 
  border: 1px solid rgba(0,0,0,0.15); 
  box-shadow: 0 5px 15px rgba(0,0,0,0.35);">

<img style="width: 100%; min-width: 310px; max-width: 635px" src="https://yunohost.org/images/home_manage.jpg" />
</div>
</div>
</div>


<div class="clearfix"></div>
<br />
<br />
<br />
<hr />
<br />
<br />

<div class="row">
<div class="col-md-4">
<div style="
  width: 100%; 
  max-height: 290px;
  overflow: hidden; 
  border-radius: 5px; 
  border: 1px solid rgba(0,0,0,0.15);
  box-shadow: 0 5px 15px rgba(0,0,0,0.35);">
<a class="btn btn-lg btn-block btn-primary" style="box-shadow: 0 5px 15px rgba(0,0,0,0.35);" href="/userdoc_fr">Guía del usuario</a>
<a class="btn btn-lg btn-block btn-info" style="box-shadow: 0 5px 15px rgba(0,0,0,0.35);" href="https://ask.yunohost.org" target="_blank">Preguntas más frecuentes</a>
<a class="btn btn-lg btn-block btn-success" style="box-shadow: 0 5px 15px rgba(0,0,0,0.35);" href="/whatsyunohost_fr">Que es YunoHost ?</a>
<a class="btn btn-lg btn-block btn-warning" style="box-shadow: 0 5px 15px rgba(0,0,0,0.35);" href="/contribute_fr">Cómo contribuir</a>
<a class="btn btn-lg btn-block btn-danger" style="box-shadow: 0 5px 15px rgba(0,0,0,0.35);" href="http://news.yunohost.org">últimas noticias</a>
</div>
</div>

<div class="col-md-7 text-right">
<h1>Explorar <small>las posibilidad de su servidor, y aprender pourque es importante</small></h1>
<p><br /><a href="/docs_fr">Leer la documentación</a></p>
</div>
</div>

<div class="clearfix"></div>

<br />
<br />
<hr />
<br />
<br />

<div class="text-center">
<h1>¡ Hey ! Somos humanos<br /><small> Si tiene algun pregunta, un problema, o simplemente estás interesado, ven decir "¡ Hola !" sobre nuetra salón de discusión clic en el botón abajo &nbsp;<span class="glyphicon glyphicon-share-alt"></span> </small></h1>
</div>

<br />
<br />
<br />
<br />

<div class="text-center">
<!--<img style="width: 100px" src="http://pix.toile-libre.org/upload/original/1386012810.png" />-->
<h5><small>2014 • Datalove <3 • <a href="https://twitter.com/yunohost" style="color:#999">@YunoHost on Twitter</a>
</div>

</div>

<script type="text/javascript">
    jQuery('.teasing-part').css({
        marginTop: '0',
        display: 'block'
    });
    jQuery('.boring-part').css({
        marginTop: jQuery(window).height() + 100
    });
    jQuery( window ).resize(function() {
        jQuery('.boring-part').css({
            marginTop: jQuery('.teasing-part').height() + 100
        });
    });
    jQuery('.yolo').hide();
    randomNumber = Math.floor((Math.random()*jQuery('.yolo').length)+1);
    color = jQuery('.yolo.' + randomNumber).css('color');
    jQuery('.yolo.' + randomNumber).fadeIn();
    document.title = jQuery('.yolo.' + randomNumber).text();
    jQuery('.colored-bar').css({
      color: color,
      fontWeight: 'bold',
      padding: '1%'
    });
    jQuery('.yolobtn').css({
      background: color,
      borderColor: color
    }).on('click', function() {
      jQuery('html, body').animate({
        scrollTop: jQuery(window).height() + 80
      }, 500);
    });
    $(".actions").css('opacity', 0);
    jQuery.ajaxSetup({cache: false});
    jQuery.getScript('https://'+ location.host +'/mini/javascripts/mini.js', function() {
        HOST_BOSH = 'https://'+ location.host +'/http-bind/';
        JappixMini.launch({
            connection: {
              domain: 'anonymous.yunohost.org'
            },

            application: {
              network: {
                autoconnect: false
              },

              interface: {
                showpane: true,
                animate: true
              },

              groupchat: {
                open: ['support@conference.yunohost.org']
              }
            }
        });
    });
</script>