{{extend 'layout.html'}}
<link rel="stylesheet" href="{{=URL('static', 'css/transformando.css')}}">
<div class="container-fluid main-container" style="background-color:#7e0018;">
  <div class="row align-items-center">
    <div class="col-12 p-0 banner-transformando mx-auto">
      <img class="d-block logo-transformando" src="{{=URL('static', 'images/logo_transformando.png')}}" class="img-fluid" alt="">
      <h3 class="text-center">
        TRANSFORMÉMONOS
      </h3>
    </div>
  </div>
  <div class="row div-transformando-form">
    <div class="col-12 mx-auto" style="max-width: 1280px; padding:2rem 1.5rem 2rem 1.5rem; background-color: #f1e8c9; background-image: url({{=URL('static', 'images/fondo_transformando.png')}}); background-repeat: no-repeat; background-size: auto 100%; background-position:left;">
      <div class="text-center form-title-transformando">
        <span>REGISTRATE A NUESTRA </span><span style="color:#00a1a0;">COMUNIDAD</span>
      </div>
      <form class="" enctype="multipart/form-data" method="post">
        <div class="row mb-3">
          <div class="col-12 col-lg-6 form-group">
            <input type="text" class="form-control" id="formularioNombre" placeholder="Apellidos paterno*">
          </div>
          <div class="col-12 col-lg-6 form-group">
            <input type="text" class="form-control" id="formularioApellido" placeholder="Apellido materno*">
          </div>
        </div>
        <div class="row mb-3">
          <div class="col-12 form-group">
            <input type="text" class="form-control" id="formularioNombre" placeholder="Nombre(s)*">
          </div>
        </div>
        <label for="formularioNacimiento">Fecha de nacimiento*</label>
        <div class="row mb-3">
          <div class="col-12 col-lg-6 form-group">
            <div class="row" id="formularioNacimiento">
              <div class="col-3">
                <input type="numeric" class="form-control" placeholder="Día">
              </div>
              <div class="col-3">
                <input type="numeric" class="form-control" placeholder="Mes">
              </div>
              <div class="col-6">
                <input type="numeric" class="form-control" placeholder="Año">
              </div>
            </div>
          </div>
          <div class="col-12 col-lg-6 form-group">
            <input type="numeric" class="form-control" id="formularioCorreo" placeholder="Correo Electrónico*">
          </div>
        </div>
        <div class="row mb-3">
          <div class="col-12">
            <textarea class="form-control" id="formularioComentario" rows="5" placeholder="¿Como quieres Transformar Hidalgo?..."></textarea>
          </div>
        </div>
        <div class="text-center">
          <input class="btn btn-transformando" type="submit" value="TRANSFORMEMOS">
          <input type="hidden" name="_formname" value="enviarFormulario">
        </div>
      </form>
    </div>
  </div>
</div>
{{block footer}} <!-- this is default footer -->
<footer class="footer footer-img container-fluid px-0">
  <div class="row align-items-center mx-auto" style="margin-top:0px; height:100%; max-width:1280px;">
    <div class="col-10">
      <div class="copyright pull-left">{{=T('Copyright')}} &#169; Transformando Hidalgo {{=request.now.year}}. Todos los derechos reservados. Aviso de privacidad</div>
    </div>
    <div class="col-2">
      <img src="{{=URL('static', 'images/fb_transformando.png')}}" class="img-fluid" alt="" style="width:100%; max-width:75px;">
    </div>
  </div>
</footer>
{{end}}