<table style="margin: auto;margin-top:-20px;">
  <tr>
    <td>
      <table>
        <tr>
          <td>
            <table style="margin: auto;">
              <col style="width:550">
              <col style="width:550;">
              <tr>
                <!-- SECCION MOVIL Y DESKTOP -->
                <td>
                  <table>
                    <tr>
                      <td style="padding: 20px 20px;padding-top:30px;text-align: center;">
                        <img src="img/pdf/devices-mobile.png">
                      </td>
                      <td style="text-align: left;">
                        <span style="text-transform:uppercase;font-size: 20px">{{'device-mobile'|trans}}</span><br/>
                        <span style="font-weight: bold; font-size: 60px">{{data['devices-mobile-month'].formatted}}</span>
                      </td>
                      <td class="arrow-big" style="text-align: center; vertical-align: middle;">
                        <span style="font-weight: bold; font-size: 25px">{{data['devices-mobile-compare-last-month'].formatted|raw}}</span>
                      </td>
                    </tr>
                    <tr>
                      <td style="padding: 20px 20px;padding-top:60px;text-align: center;">
                        <img src="img/pdf/devices-desktop.png">
                      </td>
                      <td style="text-align: left;padding-top:30px;">
                        <span style="text-transform:uppercase;font-size: 20px">{{'device-desktop'|trans}}</span><br/>
                        <span style="font-weight: bold; font-size: 60px">{{data['devices-desktop-month'].formatted}}</span>
                      </td>
                      <td class="arrow-big" style="text-align: center; vertical-align: middle;padding-top:30px;">
                        <span style="font-weight: bold; font-size: 25px">{{data['devices-desktop-compare-last-month'].formatted|raw}}</span>
                      </td>
                    </tr>
                  </table>                          
                </td>
                <!-- SECCION MAPAS Y BUSQUEDAS CON TARTAS -->
                <td>
                  <table>
                    <tr>
                      <td>
                        <table style="padding-left:30px;">
                          <tr>
                            <td>
                              <table style="1px solid #ccc;">
                                <tr>
                                  <td style="padding-left: 10px; text-align: center;"><span style="font-weight: bold; text-transform: uppercase; font-size: 20px">{{'views-maps'|trans}}</span></td>
                                </tr>
                                <tr>
                                  <td>
                                    <table >
                                      <tr>
                                        <td>
                                          <span style="font-size: 50px; font-weight: bold;">{{data['devices-maps-month'].formatted}}</span>
                                        </td>
                                        <td class="arrow-big">
                                          <span style="font-weight: bold; font-size: 20px">{{data['views-maps-compare-last-month'].formatted|raw}}</span>
                                        </td>
                                      </tr>
                                    </table>
                                  </td>
                                </tr>
                              </table>
                            </td>
                          </tr>
                          <tr>
                            <td style="text-align:center;">
                              {% if data['devices-maps-month-graph'].img %}
                              <img src="{{data['devices-maps-month-graph'].img}}" style="display: block;">
                              {% endif %}
                            </td>
                          </tr>
                        </table>
                      </td>
                      <td>
                        <table style="padding-left:30px;">
                          <tr>
                            <td style="text-align: center;">
                              <table style="1px solid #ccc;">
                                <tr>
                                  <td style="padding-left: 10px; text-align: center;"><span style="font-weight: bold; text-transform: uppercase; font-size: 20px">{{'searchs'|trans}}</span></td>
                                </tr>
                                <tr>
                                  <td>
                                    <table>
                                      <tr>
                                        <td>
                                          <span style="font-size: 50px; font-weight: bold;">{{data['devices-searches-month'].formatted}}</span>
                                        </td>
                                        <td class="arrow-big">
                                          <span style="font-weight: bold; font-size: 20px">{{data['views-searches-compare-last-month'].formatted|raw}}</span>
                                        </td>
                                      </tr>
                                    </table>
                                  </td>
                                </tr>
                              </table>
                            </td>
                          </tr> 
                          <tr>
                            <td style="text-align:center;">
                              {% if data['devices-searches-month-graph'].img %}
                                <img src="{{data['devices-searches-month-graph'].img}}" style="display: block;">
                              {% endif %}
                            </td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
            </table>
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>
<table style="margin: auto;margin-top:-20px;">
  <tr>
    <td>
      {% if data['devices-year-data-graph'].img %}
        <img src="{{data['devices-year-data-graph'].img}}" style="display: block;">
      {% endif %}
    </td>
  </tr>                
</table>