<!DOCTYPE html>
<html>
<head>
  <title></title>
  <style>
      @media  print {
        margin: 1cm 1cm;
        size: A4 portrait;
      }
      @page  {
        margin: 1cm 1cm;
        size: A4 portrait;
      }
      header{
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: 100px;
        font-size: 0.9em;
      }
      footer{
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        height: 80px;
        font-size: 0.7em;
      }
      body {
        font-family: sans-serif;
        margin: 2cm 0cm 1.9cm 0cm;
        text-align: justify;
        marginwidth: 0; 
        marginheight: 0;
        font-size: 13px;
      }
      .header,
      .footer {
        position: fixed;
        left: 0px;
        right: 0px;
        color: #222;
        height: 100px;
        font-size: 0.9em;
      }
      .header {
        top: 0;
        /*border-bottom: 0.1pt solid #222;*/
      }
      .footer {
        bottom: -5px;
        height: 50px;
        /*border-top: 0.1pt solid #222;*/
      }
      .header table,
      .footer table {
        width: 100%;
        border-collapse: collapse;
        border: none;
      }
      .header td,
      .footer td {
        padding: 0;
        width: 50%;
      }
      .page-number {
        text-align: center;
        align-content: center;
        align-items: center;
      }
      .page-number:before {
        content: 'Hoja: ' counter(page);
      }
      #contenido{
        width: 100%;
        top: 20px;
        /*bottom: -20px;*/
        /*padding-top: 10px;*/
        /*padding-bottom: 10px;*/
        position: relative;
        /*background-color: green;*/
      }
      main{
        bottom: 20px;
      }
      .tab{
        font-size: 11px;
        border-radius: 10px;
      }
      #encabezado{
        /*background: #fe632d;*/
        background: #0fcec9;
        color: #fff;
        border-radius: 100%;
        font-size: 11px;
      }
      .tabla tr:nth-child(even){
        background: #e6e6e6;
      }          
      .tabla tr:nth-child(odd){
        background: #F7F5F3;
      }
      hr {
        page-break-after: always;
        border: 0;
      }
  </style>
</head>
<body>
   <header id="header" style="page-break-inside: auto;">
      <table style=' width:100%;'>
        <tr style='height:40px;'>
          <td style='width:100%;'>
            <img src="<?php echo e('http://vinculacion.teds.mx/Departamento/public/ServicioSocial/Logos/'.$encabezado[0]->logo_mem); ?>" align="center">
          </td>
        </tr>
      </table>
    </header>

    <footer id="footer" style="page-break-inside: auto;">  
      <table width="100%" border="0">
          <tbody>
            <tr>
              <td width="50%" align="left"><?php if($leyenda): ?>
                <?php echo e($leyenda->izquierda_leyfor); ?>

              <?php endif; ?></td>
              <td width="50%" align="right"><?php if($leyenda): ?>
                <?php echo e($leyenda->derecha_leyfor); ?>

              <?php endif; ?></td>
            </tr>
            <tr>
              <td colspan="2" style="text-align: center;width: 100%; vertical-align: center;">
                <img src="<?php echo e('http://vinculacion.teds.mx/Departamento/public/ServicioSocial/Logos/'.$pie[0]->logo_mem); ?>" align="center">
              </td>
            </tr>
          </tbody>
      </table>    
    </footer>

    <main style="page-break-inside: auto;">
      <div id="contenido" style="page-break-inside: auto;">
        <div align="center" ><small style="font-size: 15px;">DEPARTAMENTO DE GESTIÓN TECNOLÓGICA Y VINCULACIÓN<br>PROGRAMA DE ACTIVIDADES DEL PRESTANTE DE SERVICIO SOCIAL</small><br><br>
          Período de realización oficial 
          <?php $__currentLoopData = $fi; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $fi): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
            <?php echo e(date('d-m-Y', strtotime($fi->finicio_evecal))); ?>

          <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?> al 
          <?php $__currentLoopData = $ft; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $ft): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
            <?php echo e(date('d-m-Y', strtotime($ft->finicio_evecal))); ?>  
          <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>

          <table class="tabla" align="center" border="1">
            <tr align="center" style="font-size: 15px; font-weight: bold;">
              <td width="10%">No.</td>
              <td width="60%">Actividad a realizar</td>
              <td width="30%">Fecha</td>
            </tr>
            <?php $__currentLoopData = $periodos; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $p): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
              <tr>
                <td align="center" width="10%"><?php echo e($p->id_act); ?></td>
                <td width="60%"><?php echo e($p->nombre_act); ?></td>
                <td align="center" width="30%">
                  <?php if($p->finicio_evecal == $p->ftermino_evecal): ?>
                    <?php echo e(date('d-m-Y', strtotime($p->finicio_evecal))); ?>

                  <?php else: ?>
                    <?php echo e(date('d-m-Y', strtotime($p->finicio_evecal))); ?> al <?php echo e(date('d-m-Y', strtotime($p->ftermino_evecal))); ?>

                  <?php endif; ?>
                </td>
              </tr>
            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
          </table>
          <br>
          <br>

          <table width="100%" align="center">
            <tr>
              <td align="center">ELABORA</td>
              <td align="center">AUTORIZA</td>
            </tr>
            <tr>
              <td width="50%" align="center">
                <?php if($elabora): ?>
                  <?php $__currentLoopData = $elabora; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $elabora): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                    <?php if($elabora->firmaDpto_cal!=''): ?>
                      <img src="data:image/png;base64, <?php echo base64_encode(QrCode::format('png')->size(100)->generate($elabora->firmaDpto_cal)); ?>">
                      <?php
                      ($nombreeee = explode('_', $elabora->firmaDpto_cal))
                      ?>
                      <br>
                      <?php echo e($nombreeee[0]); ?>

                    <?php endif; ?>
                  <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                <?php endif; ?>
                <br>Departamento de Gestión Tecnológica y Vinculación
              </td>
              <td width="50%" align="center">
                <?php if($autoriza): ?>
                  <?php $__currentLoopData = $autoriza; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $autoriza): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                    <?php if($autoriza->firmaSub_cal!=''): ?>
                      <img src="data:image/png;base64, <?php echo base64_encode(QrCode::format('png')->size(100)->generate($autoriza->firmaSub_cal)); ?>">
                      <?php
                      ($nombre_2 = explode('_', $autoriza->firmaSub_cal))
                      ?>
                      <br>
                      <?php echo e($nombre_2[0]); ?>

                    <?php endif; ?>
                  <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                <?php endif; ?>
                <br>Subdirección de Planeación y Vinculación
              </td>
            </tr>
          </table>
        </div>
      </div>
    </main>
</body>
</html>