Fix feature image and title margins

Author: lauraengelhardt

_layouts/associated.html

@@ -33,7 +33,7 @@ <h1>{{ page.title }}</h1>
             height="auto"
           />
         </div>
-        <h2 class="feature-title">{{ associate.title }}</h2>
+        <span class="feature-title">{{ associate.title }}</span>
         <div class="feature-content">{{ associate.description }}</div>
         {% if associate.link %}
         <div class="feature-content">

_layouts/capabilities.html

@@ -23,7 +23,7 @@ <h2>Examples</h2>
           />
         </div>
         {% endif %}
-        <h2 class="feature-title">{{ capability.title }}</h2>
+        <span class="feature-title">{{ capability.title }}</span>
         <div class="feature-content">{{ capability.description }}</div>
         {% if capability.link %}
         <div class="feature-content">

_layouts/contributor.html

@@ -23,7 +23,7 @@ <h1>{{page.title}}</h1>
           />
         </div>
         {% endif %}
-        <h2 class="feature-title">{{ institution.name }}</h2>
+        <span class="feature-title">{{ institution.name }}</span>
         <a target="_blank" href="{{ contributor.institution.url }}">
           <div class="content">{{ institution.institute }}</div>
         </a>

_layouts/home.html

@@ -30,7 +30,7 @@ <h2>Featured examples</h2>
           />
         </div>
         {% endif %}
-        <h2 class="feature-title">{{ capability.title }}</h2>
+        <span class="feature-title">{{ capability.title }}</span>
         <div class="feature-content">{{ capability.description }}</div>
       </div>
     </div>
@@ -64,7 +64,7 @@ <h2 class="feature-title">{{ capability.title }}</h2>
             />
           </div>
           {% endif %}
-          <h2 class="feature-title">{{ institution.name }}</h2>
+          <span class="feature-title">{{ institution.name }}</span>
           <div class="feature-content">{{ institution.institute }}</div>
         </div>
       </div>

_sass/components/_feature.scss

@@ -13,14 +13,19 @@
     width: auto;
     height: 100px;
     display: flex;
-    margin-bottom: 20px;
     text-align: center;
   }
   img {
     width: auto;
     height: 100px;
   }
   .feature-title {
+    font-family: $font-family-heading;
+    font-size: 26px;
+    font-weight: bold;
+    line-height: 1.4;
+    margin-top: 20px;
+    margin-bottom: 15px;
   }
   .feature-content {
     margin-bottom: 0;