More CSS dividing, making footer buttons larger, adding new section on main page.

layouts/main-index.html

@@ -21,7 +21,7 @@
         </div>
     </div>
 </section>
-<section style="" class="section-skewed">
+<section class="section-skewed">
     <h1 class="text-center">Software commitments</h1>
     <div class="columns-container padding-container-3" >
         <div class="column col3 vertical-center padding-container">
@@ -89,4 +89,19 @@
         </div>
     </div>
 </section>
+<section class="padding-container-3">
+    <h1>{{ .Params.NewSection.Title }}</h1>
+    <p>
+    {{ .Params.NewSection.Description | markdownify }}
+    </p>
+    <div class="grid">&nbsp;
+        {{ range .Params.NewSection.Links }}
+        <div>
+            <a href="{{ .URL | safeURL }}" role="button" class="primary" title="{{ .Title }}">
+                <img src="/icons/{{ .Icon }}.svg" class="icon-as-text" alt="{{ .Icon }}">{{ .Title }}
+            </a>&nbsp;
+        </div>
+        {{ end }}
+    </div>
+</section>
 {{ end }}

layouts/partials/footer.html

@@ -1,7 +1,7 @@
 <footer>
     <br><br>
     <div class="columns-container">
-        <div class="col3 footer-social-list grid padding-container-1">
+        <div class="col3 footer-social-list grid padding-container-point3">
             {{ range .Site.Menus.social }}
                 <a role="button" alt="{{ .Name }}" title="{{ .Name }}" href={{ .URL }}>
                     {{ .Pre }}