diff --git a/app/assets/javascripts/legislation.js.coffee b/app/assets/javascripts/legislation.js.coffee
index 3eb53e6d2..303d4c98e 100644
--- a/app/assets/javascripts/legislation.js.coffee
+++ b/app/assets/javascripts/legislation.js.coffee
@@ -1,14 +1,9 @@
 App.Legislation =
 
   initialize: ->
-    $('#js-toggle-debate').on
-      click: ->
-        $('#debate-show').toggle()
-
     $('#js-toggle-small-debate').on
       click: ->
-        $('#debate-show').toggle()
-        $('span').toggleClass('icon-angle-up')
+        $(this).find($('span')).toggleClass('icon-angle-up')
 
     $('form#new_legislation_answer input.button').hide()
     $('form#new_legislation_answer input[type=radio]').on
@@ -19,7 +14,3 @@ App.Legislation =
     $('form#draft_version_go_to_version select').on
       change: ->
         $('form#draft_version_go_to_version').submit()
-
-    $('#js-toggle-legislation-process-header').on
-      click: ->
-        $('[data-target="legislation-header-full"]').toggle()
diff --git a/app/assets/stylesheets/legislation_process.scss b/app/assets/stylesheets/legislation_process.scss
index e536bb280..042348f42 100644
--- a/app/assets/stylesheets/legislation_process.scss
+++ b/app/assets/stylesheets/legislation_process.scss
@@ -39,10 +39,6 @@ $border-dark:  darken($border, 10%);
     }
   }
 
-  .legislation-debate-show {
-    display: none;
-  }
-
   .debate-add-info {
     border-top: 1px solid $border-dark;
     margin-top: $line-height;
@@ -357,10 +353,6 @@ $border-dark:  darken($border, 10%);
 .legislation-allegation {
   padding-top: 1rem;
 
-  .legislation-debate-show {
-    margin-top: 2rem;
-  }
-
   .headline {
     margin-bottom: 0;
 
diff --git a/app/views/legislation/processes/_header.html.erb b/app/views/legislation/processes/_header.html.erb
index 660c5a5de..d228673de 100644
--- a/app/views/legislation/processes/_header.html.erb
+++ b/app/views/legislation/processes/_header.html.erb
@@ -1,12 +1,12 @@
 <% if header == :small %>
-  <div class="legislation-hero jumbo grey-heading" data-target="legislation-header-small">
+  <div class="legislation-hero jumbo grey-heading">
     <div class="row headline">
       <div class="small-12 medium-8 column">
         <h3 class="headline-small"><%= process.title %></h3>
       </div>
     </div>
 
-    <div id="debate-show" class="row description legislation-debate-show">
+    <div id="debate-show" class="row description is-hidden" data-toggler=".is-hidden">
       <div class="small-12 column">
         <% if process.description.present? %>
           <p class="title"><%= t('legislation.processes.header_full.description') %></p>
@@ -17,19 +17,18 @@
         <div class="small-12 column debate-add-info">
           <%= markdown process.additional_info if process.additional_info %>
         </div>
-       <% end %>
+      <% end %>
     </div>
 
     <% if process.description.present? || process.additional_info.present? %>
       <div class="text-center">
-        <a class="button big text-center button-circle" title="<%= t('.view_process_information') %>" id="js-toggle-small-debate">
+        <a class="button big text-center button-circle" title="<%= t('.view_process_information') %>" id="js-toggle-small-debate" data-toggle="debate-show">
           <span class="icon-angle-down" aria-hidden="true"></span>
         </a>
       </div>
     <% end %>
   </div>
 
-  <%= render 'legislation/processes/header_full', process: @process, hidden: true %>
 <% else %>
-  <%= render 'legislation/processes/header_full', process: @process, hidden: false %>
+  <%= render 'legislation/processes/header_full', process: @process %>
 <% end %>
diff --git a/app/views/legislation/processes/_header_full.html.erb b/app/views/legislation/processes/_header_full.html.erb
index 7a3e29550..4505a9ba5 100644
--- a/app/views/legislation/processes/_header_full.html.erb
+++ b/app/views/legislation/processes/_header_full.html.erb
@@ -1,4 +1,4 @@
-<div class="legislation-hero jumbo grey-heading" style="display:<%= hidden ? 'none' : 'block' %>" data-target="legislation-header-full">
+<div class="legislation-hero jumbo grey-heading">
   <div class="row headline">
     <div class="small-12 medium-8 column">
       <%= back_link_to legislation_processes_path %>
@@ -16,7 +16,7 @@
       <% end %>
     </div>
     <% if process.additional_info.present? %>
-      <div id="debate-show" class="small-12 column debate-add-info legislation-debate-show">
+      <div id="additional_info" class="small-12 column debate-add-info is-hidden" data-toggler=".is-hidden">
         <%= markdown process.additional_info if process.additional_info %>
       </div>
     <% end %>
@@ -24,7 +24,7 @@
 
   <% if process.additional_info.present? %>
     <div class="text-center">
-      <a id="js-toggle-debate" class="button big text-center" title="<%= t('.more_info') %>">
+      <a id="js-toggle-debate" class="button big text-center" title="<%= t('.more_info') %>" data-toggle="additional_info">
         <strong><%= t('.more_info') %></strong>
       </a>
     </div>