{% load layout i18n fb_versions cyclope_utils %}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!--
    Plantilla Boletín Neutron para Cyclope 3 GPL
    Esta plantilla fue desarrollada por Codigo Sur: www.codigosur.org
    Diseno conceptual + HTML + CSS: Santiago Hoerth
    Codigo HTML realizado bajo licencia GPL (copialo, mejoralo, pasalo)
    Ver licencia en: http://creativecommons.org/licenses/GPL/2.0/deed.es_AR
    Ten en cuenta que las imagenes, los nombres y los logos de este sitio no pueden usarse. Solo el codigo HTML y CSS es GPL. Gracias :)
    Si modificas no borres estas lineas :)
  -->

{% join CYCLOPE_BASE_URL CYCLOPE_THEME_MEDIA_URL as base_theme_media_url %}

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
  <head>
    <title>{{ newsletter.name }}</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <style>
      body {color:#000;margin:0;padding:0;}
      .mascara {color:#000;padding:0 50px;background-color:#ccc;}
      #menucito td {background-color: #fff;}
      #contenedora {background-color: #fff;}
      .encabezado {padding:0 0 0 10px;color:#666;font-size:13px;display:block;margin:5px 0 0;top:0;float:left;font-family: Arial,Helvetica,sans-serif;font-weight:700;}
      .menuh {display:block;padding:0;color:#000;margin:5px 0;font-family: Arial,Helvetica,sans-serif;text-align:right;width:720px;}
      .menuh a {padding:5px;color:#333;font-size:12px;text-decoration:none;}
      .medianera {padding:15px 0 0;}
      .editorial {margin:0 0;}

      .header {background-color: #fff;}
      .header td {background: #ccc url({{ base_theme_media_url }}images/boletin/cabezal.png) no-repeat 0 0;}
      .header .title {color:#fff;text-align:center;font-family: Arial,Helvetica,sans-serif;font-size:30px;padding:5px 10px 0;margin:0;}
      .header .summary {text-align:center;font-family: Arial,Helvetica,sans-serif;color:#fff;display:block;}

      .category_description {background:#fff;}
      .category_description .mask {padding:0; }
      .category_description img {padding:0 0 0 10px;}
      .category_description .summary {margin:0;padding:0 10px 0;font-family: Arial,Helvetica,sans-serif;text-align:left;font-size:18px;display:block;}
       
      .table_of_contents {border:1px solid #999;background-color:#333;margin:0 10px 0 0;padding:0;}
      .table_of_contents .mask {margin:0 auto;}
      .table_of_contents .content {background:#e6e6e6;font-family: Arial,Helvetica,sans-serif; font-size: 11px; color:#000;padding: 0 0 10px 0;}
      .table_of_contents .general_title {padding:4px 0;margin:0 0 0;background:#333;color:#fff;font-weight:700;text-align:center;font-size:16px;}
      .table_of_contents .general_title a {color:fff;}
      .table_of_contents .pretitle {padding:0 8px;display:block;text-transform:uppercase;}
      .table_of_contents .title {text-align:left;padding:15px 8px 0;display:block;font-size:14px;font-weight:700;color:#333;}
      .table_of_contents .author {padding:0 8px;margin:0;}

      .block_content {display:block;width:720px;padding:0 5px;background:#fff;border-top:1px dotted #ccc;margin-top:0;}
      .block_content .title {font-family:Arial,Helvetica,sans-serif;font-size:28px;padding:0 0 0;margin:0;color:#999;}
      .block_content a {text-decoration:none;}
      .block_content .title {font-family:Arial,Helvetica,sans-serif;font-size:28px;padding:0 0 0;margin:0;color:#000;}
      .block_content .author {font-family:Arial,Helvetica,sans-serif;font-size:16px;padding:0 0 0;margin:0;}
      .block_content .summary {font-family:Arial,Helvetica,sans-serif;padding:0 0 0;margin:0;color:#666;text-align:justify;font-size:16px;}
      .block_content .content {font-weight:700;font-size:16px;}
      .block_content p {font-family:Arial,Helvetica,sans-serif;padding:2px;margin:5px 0;text-align:justify;}
      .block_content img {padding:5px 0 10px 15px;float:right;}
      .block_content hr {border:none;border-top:2px solid #ccc;margin:15px 0;}
      .block_content .pretitle {color:#000;font-family:Arial,Helvetica,sans-serif;font-size:12px;padding:5px 0;background:transparent;text-transform:uppercase;}
      .block_content .pretitle a {color:#000;text-decoration:none;}
      .block_content .show-ToC {font-family:Arial,Helvetica,sans-serif;font-size:11px;padding:5px;margin: 0;float:none;text-align:right;display:block;}
      .block_content .show-ToC {color:#999;text-decoration:none;}

      .block_content .teaser {border-bottom:1px dotted #ccc;margin:0 0 15px;}
      .block_content .detail {border-bottom:1px dotted #ccc;margin:0 0 15px;}

      
      .editorial-titulo {font-family: Arial,Helvetica,sans-serif;font-size:30px;font-weight:700;color:#000;padding:0;display:block;}
      .editorial-titulo h2 {font-family: Arial,Helvetica,sans-serif;font-size:30px;font-weight:700;color:#000;padding:0;display:block;}
      

      
      .
      .newsletter_detail {border-bottom:1px dotted #ccc;margin:0 0 15px;}
      .pie {text-align:center;padding:10px 0;color:#fff;font-size:13px;display:block;margin:0;font-family: Arial,Helvetica,sans-serif; background-color: #666;}
      .pie a {color:#fff;text-decoration:none;}
      .clear {clear:both;}
      .image_content {width:240px;}
 


      .permalink {font-family:Arial,Helvetica,sans-serif;font-size:16px;padding:0 0 0;margin:10px 0 0;font-weight:700;}

    </style>
  </head>
  <body leftmargin="0" topmargin="0">
    {% region 'header' %}
    <a name="arriba"></a>

    <table class="mascara" align="center">
      <tr>
        <td>

          <!-- inicia menucito -->
          <table id="menucito" align="center" border="0" cellpadding="0" cellspacing="0" width="720">
            <tr>
              <td valign="middle">
                <span class="encabezado">{{ newsletter.content_category.name }}</span>
                <span class="menuh"><a href="{% url index %}">{% trans "Visit our website" %}</a> <a href="{% url collection newsletter.content_category.collection.slug %}">{% trans "View archives" %}</a> <a href="http://listas.codigosur.org/mailman/listinfo">{% trans "Subscription options" %}</a>
                </span>
              </td>
            </tr>
          </table>
          <!-- fin menucito -->

          <!-- header -->
          <table class="header" align="center" border="0" cellpadding="0" cellspacing="0" width="720">
            <tr>
              <td height="124" valign="middle">
                <h1 class="title">{{ newsletter.name }}</h1>
                <span class="summary">{{ newsletter.header }}</span>
              </td>
            </tr>
          </table>
          <!-- /header -->

          {% region 'before_content' %}

          <!-- tabla contenedora de columnas -->
          <table id="contenedora" align="center"  border="0" cellpadding="0" cellspacing="0" width="720" class="medianera">
            <tr>
              <td valign="top">

                {% if newsletter.show_ToC %}
                
                <!-- category_description -->
                <table width="530" border="0" align="left" cellpadding="0" cellspacing="0" class="category_description">
                  <tr>
                    <td valign="top">
                      <div class="mask">
                      {% if newsletter.content_category.image %} <img src="{% version  newsletter.content_category.image.path 'medium' %}" hspace="0" vspace="0" align="top" width="170px" style="float:left;margin:0 10px 0 0;"/> {% endif %}
                        <span class="summary">
                          {{ newsletter.content_category.description|smart_style }}
                        </span>
                      </div>

                    </td>
                  </tr>
                </table>
                <!-- /category_description -->

                <!-- table_of_contents -->
                <table class="table_of_contents" width="180" align="right" border="0" cellpadding="0" cellspacing="0">
                  <tr>
                    <td valign="top">
                      <!-- ToC-->
                      
                      <table align="center" border="0" cellpadding="0" cellspacing="0" width="180" class="mask">
                        <tr>
                          <td class="content">
                            <div class="general_title"><a name="ToC">{% trans "Table of Contents" %}</a></div>
                            {% for categorization in categorizations %}
                            {% alias categorization.content_object as 'article' %}
                            <a href='#{{ categorization.content_type.model }}__{{ article.slug }}' class="title">{{ article.name }}</a>
                            {% if article.author %}<span class="author">{% trans "By"%} {{ article.author }}</span>{% endif %}                            
                            {% endfor %}
                          </td>
                        </tr>
                      </table>
                      <!-- /ToC-->
                    </td>
                  </tr>
                </table>
                <!-- /table_of_contents -->
             {% else %}
             
<!-- category_description -->
                <table width="720" border="0" align="left" cellpadding="0" cellspacing="0" class="category_description">
                  <tr>
                    <td valign="top">
                      <div class="mask">
                      {% if newsletter.content_category.image %} <img src="{% version  newsletter.content_category.image.path 'medium' %}" hspace="0" vspace="0" align="top" width="170px" style="float:left;margin:0 10px 0 0;"/> {% endif %}
                        <span class="summary">
                          {{ newsletter.content_category.description|smart_style }}
                        </span>
                      </div>

                    </td>
                  </tr>
                </table>
                <!-- /category_description -->
             {% endif %}
                
                <div class="clear"></div>

                <!-- block_content -->
                <table align="center" class="block_content">
                  <tr>
                    <td>
                      {% block content%}{% endblock %}
                    </td>
                  </tr>
                </table>
                <!-- /block_content -->


                <!-- fin tabla contenedora de columnas -->
              </td>
            </tr>
          </table>

          {% region 'after_content' %}

          <!-- inicia pie -->
          <table align="center" border="0" cellpadding="0" cellspacing="0" width="720">
            <tr>
              <td height="80" valign="top">
                <span class="pie">
                  Una Publicación de .<br/>
                  Boletín realizado con <a href="http://cyclope.codigosur.org" >Cyclope3 GPL</a>. Hecho por <a href="http://codigosur.org" >Código Sur</a>. <br/>
                  Los contenidos de este sitio web están bajo una <a href="http://creativecommons.org/licenses/by-nc-nd/3.0/deed.es_CO" >Licencia Creative Commons</a>.<br/>
                  Para desuscribirse <a href="http://listas.dominio.org/mailman/listinfo/" >ingresar aquí</a>.
                </span>
              </td>
            </tr>
          </table>
          <!-- fin pie -->
        </td>
      </tr>
    </table>

  </body>
</html>

