<table>
  <tr>
        <td class="celda-i" style="width: {{ ancho1 }};">
            <label>{{ label1 }}</label>
            <input type="text" value="{{ valor1 }}">
        </td>
        <td class="celda-c" style="width: {{ ancho2 }};">
            <label>{{ label2 }}</label>
            <div style="position: relative; height: 35px;">
                <!-- Opción Urbana -->
                <div class="chequeo-i" style="position: absolute; left: 0; min-width: 200px;">
                    <div style="position: relative;">
                        {% if valor2 == "1" %}
                            <i class="fa-regular fa-square-check" style="position: absolute; left: 0; font-size: 30px; color: #888;"></i>
                        {% else %}
                            <i class="fa-regular fa-square" style="position: absolute; left: 0; font-size: 30px; color: #ccc;"></i>
                        {% endif %}
                        <p style="position: absolute; left: 35px; top: 5px; font-size: 15px; color: #002857; text-align: left; margin: 0px;">
                            {{check1}}
                        </p>
                    </div>
                </div>
                <div class="chequeo-i" style="position: absolute; left: {{izquierda2}}; min-width: 200px;">
                    <div style="position: relative;">
                        {% if valor2 == "2" %}
                            <i class="fa-regular fa-square-check" style="position: absolute; left: 0; font-size: 30px; color: #888;"></i>
                        {% else %}
                            <i class="fa-regular fa-square" style="position: absolute; left: 0; font-size: 30px; color: #ccc;"></i>
                        {% endif %}
                        <p style="position: absolute; left: 35px; top: 5px; font-size: 15px; color: #002857; text-align: left; margin: 0px;">
                            {{check2}}
                        </p>
                    </div>
                </div>
                <div class="chequeo-i" style="position: absolute; left: {{izquierda3}}; min-width: 200px;">
                    <div style="position: relative;">
                        {% if valor2 == "3" %}
                            <i class="fa-regular fa-square-check" style="position: absolute; left: 0; font-size: 30px; color: #888;"></i>
                        {% else %}
                            <i class="fa-regular fa-square" style="position: absolute; left: 0; font-size: 30px; color: #ccc;"></i>
                        {% endif %}
                        <p style="position: absolute; left: 35px; top: 5px; font-size: 15px; color: #002857; text-align: left; margin: 0px;">
                            {{check3}}
                        </p>
                    </div>
                </div>
                <div class="chequeo-i" style="position: absolute; left: {{izquierda4}}; min-width: 200px;">
                    <div style="position: relative;">
                        {% if valor2 == "4" %}
                            <i class="fa-regular fa-square-check" style="position: absolute; left: 0; font-size: 30px; color: #888;"></i>
                        {% else %}
                            <i class="fa-regular fa-square" style="position: absolute; left: 0; font-size: 30px; color: #ccc;"></i>
                        {% endif %}
                        <p style="position: absolute; left: 35px; top: 5px; font-size: 15px; color: #002857; text-align: left; margin: 0px;">
                            {{check4}}
                        </p>
                    </div>
                </div>
            </div>
        </td>
        <td class="celda-d" style="width: {{ ancho2 }};">
            <label>{{ label2 }}</label>
            <input type="text" value="{{ valor2 }}">
        </td>
    </tr>
</table>