Move header margin styles to CSS

Using HTML classes to apply styles to certain elements makes views
harder to customize.

app/assets/stylesheets/participation.scss

@@ -909,6 +909,8 @@
 .help-header {
   background: #fafafa;
   border-bottom: 1px solid #eee;
+  margin-top: -$line-height;
+  margin-bottom: $line-height;
   padding-bottom: $line-height / 2;
   padding-top: $line-height;
 
@@ -1142,6 +1144,7 @@
 
   &.budget {
     background: $budget;
+    margin-top: -$line-height;
 
     h1,
     h2,

app/views/budgets/index.html.erb

@@ -7,7 +7,7 @@
 <% end %>
 
 <% if current_budget.present? %>
-  <div id="budget_heading" class="expanded budget no-margin-top">
+  <div id="budget_heading" class="expanded budget">
     <div class="row" data-equalizer data-equalizer-on="medium">
       <div class="small-12 medium-9 column padding" data-equalizer-watch>
 

app/views/shared/_section_header.html.erb

@@ -1,4 +1,4 @@
-<div class="help-header no-margin-top margin-bottom">
+<div class="help-header">
   <div class="row">
     <div class="small-12 column" data-magellan>
       <%= image_tag "help/help_icon_#{image}.png", alt: t("#{i18n_namespace}.icon_alt"), class: "align-top" %>