diff --git a/app/assets/stylesheets/legislation_process.scss b/app/assets/stylesheets/legislation_process.scss
index e78104101..b5e980f25 100644
--- a/app/assets/stylesheets/legislation_process.scss
+++ b/app/assets/stylesheets/legislation_process.scss
@@ -9,6 +9,7 @@
 // 07. Legislation allegations
 // 08. Legislation changes
 // 09. Legislation comments
+// 10. Legislation draft comment
 //
 
 // 01. Utils
@@ -996,3 +997,51 @@
     }
   }
 }
+
+// 10. Legislation draft comment
+// -----------------
+.legislation-comment {
+  
+  .pull-right {
+    float: right;
+  }
+  
+  .comment-section {
+    background: #FAFAFA;
+    padding: 1rem;
+    border: 1px solid #DEE0E3;
+    margin-top: 0.25rem;
+    margin-bottom: 1rem;
+  }
+  
+  .comment {
+    margin-bottom: 3rem;
+    
+    a {
+      span {
+        text-decoration: underline;
+      }
+      
+      .icon-expand,
+      .icon-comments {
+        text-decoration: none;
+        color: #999999;
+        line-height: 0;
+      }
+      
+      .icon-expand {
+        margin-left: 0.25rem;
+      }
+      
+      .icon-comments {
+        margin-right: 0.25rem;
+      }
+      
+      &:active,
+      &:focus,
+      &:hover {
+        text-decoration: none;
+      }
+    }
+  }
+}
diff --git a/app/views/sandbox/legislation_allegations.html.erb b/app/views/sandbox/legislation_allegations.html.erb
index f18cd2b96..d177d50cc 100644
--- a/app/views/sandbox/legislation_allegations.html.erb
+++ b/app/views/sandbox/legislation_allegations.html.erb
@@ -63,7 +63,7 @@
         <span>actualizada el 13 nov 2017</span>
       </div>
       <div class="small-12 medium-3 column">
-        <a class="button strong" title="Suscríbete al proceso" data-remote="true" rel="nofollow" data-method="post" href="#">Ver todos los comentarios</a>
+        <a class="button strong" title="Suscríbete al proceso" data-remote="true" rel="nofollow" data-method="post" href="legislation_draft_comments.html">Ver todos los comentarios</a>
       </div>
     </div>
     
diff --git a/app/views/sandbox/legislation_draft_changes.html.erb b/app/views/sandbox/legislation_draft_changes.html.erb
index d01cf7e26..d871e842d 100644
--- a/app/views/sandbox/legislation_draft_changes.html.erb
+++ b/app/views/sandbox/legislation_draft_changes.html.erb
@@ -62,7 +62,7 @@
         <span>actualizada el 13 nov 2017</span>
       </div>
       <div class="small-12 medium-3 column">
-        <a class="button strong" title="Suscríbete al proceso" data-remote="true" rel="nofollow" data-method="post" href="#">Ver todos los comentarios</a>
+        <a class="button strong" title="Suscríbete al proceso" data-remote="true" rel="nofollow" data-method="post" href="legislation_allegations.html">Ver borrador del texto</a>
       </div>
     </div>
     
diff --git a/app/views/sandbox/legislation_draft_comment.html.erb b/app/views/sandbox/legislation_draft_comment.html.erb
new file mode 100644
index 000000000..c0008d324
--- /dev/null
+++ b/app/views/sandbox/legislation_draft_comment.html.erb
@@ -0,0 +1,93 @@
+<div class="legislation-hero legislation-allegation no-margin-top grey-heading">
+  <div class="row headline">
+    <div class="small-12 medium-7 column">
+      <h3>
+        Licencias urbanísticas, declaraciones responsables y comunicaciones previas
+      </h3>
+    </div>
+    <div class="small-12 medium-4 column right">
+      <a class="button-subscribed expanded button strong" title="Suscríbete al proceso" data-remote="true" rel="nofollow" data-method="post" href="/proposals/6-soluta-sed-sapiente-dolores/vote?value=yes">
+        <span class="icon-checkmark-circle" aria-hidden="true"></span>
+        <h3>Suscrito</h3>
+      </a>
+    </div>
+  </div>
+  
+  <div class="center half-gradient">
+    <a class="button big center button-circle" title="Suscríbete al proceso" data-remote="true" rel="nofollow" data-method="post" href="/proposals/6-soluta-sed-sapiente-dolores/vote?value=yes">
+      <span class="icon-angle-down" aria-hidden="true"></span>
+    </a>
+  </div>
+</div>
+
+<div class="column row">
+  <ul class="legislation-process-categories">
+    <li>
+      <a href="legislation_debate.html">
+        <h4>Fase debate previo</h4>
+        <p>15 nov 2015 - 15 dic 2016</p>
+      </a>
+    </li>
+    <li>
+      <a href="legislation_draft.html">
+        <h4>Publicación borrador</h4>
+        <p>15 nov 2015 - 15 dic 2016</p>
+      </a>
+    </li>
+    <li class="active">
+      <a href="#">
+        <h4>Fase alegaciones</h4>
+        <p>15 nov 2015 - 15 dic 2016</p>
+      </a>
+    </li>
+    <li>
+      <a href="#">
+        <h4>Publicación resultados</h4>
+        <p>15 nov 2015 - 15 dic 2016</p>
+      </a>
+    </li>
+  </ul>
+  
+  <div class="draft-panels small-12 column row">
+    <div class="row draft-chooser">
+      <div class="small-12 medium-9 column">
+        <h3>Comentarios de la versión</h3>
+        <div class="select-box">
+          <select aria-label="Seleccionar borrador">
+            <option selected="">número 3 del borrador</option>
+            <option value="1">número 2 del borrador</option>
+            <option value="2">número 1 del borrador</option>
+          </select>
+        </div>
+        <span>actualizada el 13 nov 2017</span>
+      </div>
+      <div class="small-12 medium-3 column">
+        <a class="button strong" title="Suscríbete al proceso" data-remote="true" rel="nofollow" data-method="post" href="legislation_allegations.html">Ver borrador del texto</a>
+      </div>
+    </div>
+    
+    <div class="row">
+      <div class="small-12 medium-12 column legislation-comment">
+        <div class="comment">
+          <strong>Comentarios sobre</strong>
+          <div class="comment-section">
+            <div class="row">
+              <div class="small-12 medium-10 column legislation-comment">
+                1. Esta ordenanza tiene por objeto regular los medios de intervención administrativa para el control de la legalidad de las actuaciones urbanísticas.
+              </div>
+              <div class="small-12 medium-2 column legislation-comment">
+                <span class="pull-right"><a href="#"><span>Ver en contexto</span> <span class="icon-expand" aria-hidden="true"></span></a></span>
+              </div>
+            </div>
+        </div>
+        
+        <div class="row">
+          <div class="small-12 medium-12 column">
+              COMENTARIOS
+          </div>
+        </div>
+
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/app/views/sandbox/legislation_draft_comments.html.erb b/app/views/sandbox/legislation_draft_comments.html.erb
index 984d94841..1a334fd12 100644
--- a/app/views/sandbox/legislation_draft_comments.html.erb
+++ b/app/views/sandbox/legislation_draft_comments.html.erb
@@ -62,7 +62,7 @@
         <span>actualizada el 13 nov 2017</span>
       </div>
       <div class="small-12 medium-3 column">
-        <a class="button strong" title="Suscríbete al proceso" data-remote="true" rel="nofollow" data-method="post" href="#">Ver todos los comentarios</a>
+        <a class="button strong" title="Suscríbete al proceso" data-remote="true" rel="nofollow" data-method="post" href="legislation_allegations.html">Ver borrador del texto</a>
       </div>
     </div>
     
@@ -74,7 +74,7 @@
           <div class="comment-section">
             1. Esta ordenanza tiene por objeto regular los medios de intervención administrativa para el control de la legalidad de las actuaciones urbanísticas.
           </div>
-          <a href="#"><span class="icon-comments" aria-hidden="true"></span> <span>34 comentarios</span></a>
+          <a href="legislation_draft_comment.html"><span class="icon-comments" aria-hidden="true"></span> <span>34 comentarios</span></a>
         </div>
         
         <div class="comment">