{% if product_attachs  or  exten_links  %} 
<style>

    #tab-attach-document .table>tbody>tr>td, #tab-attach-document  .table>tbody>tr>th, .table>tfoot>tr>td,  #tab-attach-document  .table>tfoot>tr>th,  #tab-attach-document  .table>thead>tr>td,  #tab-attach-document  .table>thead>tr>th {

        vertical-align:  middle !important;


    }
    #tab-attach-document .img-responsive {
        margin: 0 auto;
    }
    #tab-attach-document small {
       color: #CAC7C7;
       vertical-align: bottom;
    }
 
</style>
<div class="tab-pane tab-content fade" id="tab-attach-document">
    {% if product_attachs  %} 
    <table class="table table-striped table-bordered">
{#}
        <thead>
            <tr>
                <td class="text-center col-md-1 col-sm-2">{{ attach_thumb }}</td>
                <td class="text-left col-md-11 col-sm-10">{{ attach_filename }}</td>
            </tr>
        </thead>
{#}
        <tbody>
            {% for product_attach in product_attachs %} 
            <tr>
                <td class="text-center col-md-1 col-sm-2"><img class="img-rounded img-responsive" src="{{ product_attach.thumb }}" /></td>
                <td class="text-left col-md-11 col-sm-10"> 
                    <a {% if product_attach.href  != ''  %} href="{{ product_attach.href }}" {% else %}    class="btn-link" onclick="alert('{{ attach_error_login }} ')"  {% endif %}  title="{{ attach_button_download }}"><i class="fa fa-cloud-download"></i> {{ product_attach.name }}  </a>
                    <span class="clearfix">
                    <small><i class="fa fa-info-circle"></i> <span class="hidden-xs"> {{ attach_filesize }}  </span>{{ product_attach.size }}</small>
                   {% if show_download  %}  <small><i class="fa fa-hdd-o"></i> <span class="hidden-xs">{{ attach_downloaded~': '}}</span> {{ product_attach.download }}</small> {% endif %}  
                   </span>
                    </td>

            </tr>
            {% endfor %} 
        </tbody>
    </table>
    {% endif %} 
    {% if exten_links  %} 
    <span><strong>{{ external_link }}</strong></span>
    <table class="table table-striped table-bordered">
        <thead>
            <tr>
                <td class="text-center  col-md-1 col-sm-2">{{ attach_thumb }}</td>
                <td class="text-left col-md-11 col-sm-10">{{ attach_linkname }}</td>

            </tr>
        </thead>
        <tbody>
            {% for exten_link in exten_links %} 
            <tr>
                <td class="text-center col-md-1 col-sm-2"><img class="img-rounded img-responsive"  src="{{ exten_link.thumb }}" /></td>
                <td class="text-left col-md-11 col-sm-10" style="vertical-align: middle;"><a {% if exten_link.href != ""  %}  href="{{ exten_link.href }}" target="_blank"  {% else %}    onclick="alert('{{ attach_error_login }} ')"  {% endif %}  title="{{ attach_button_download }}"><i class="fa fa-cloud-download"></i> {{ exten_link.name }}</a></td>

            </tr>
            {% endfor %} 
        </tbody>
    </table>
    {% endif %} 
</div>
{% endif %}