Rearrange the service listing page

Preparations for collapsable service details.

_pages/tjenester.md

@@ -15,10 +15,9 @@ en uddybning af [hvad de forskellige badges dækker over](/tjenester/badges/).
 
 ### [Gitea](https://git.data.coop/)
 
-Hosting af [git-versionsstyringssystem](https://da.wikipedia.org/wiki/Git).
-
-#### Badges
-
+<section class="service-details">
+    <p>Hosting af <a href="https://da.wikipedia.org/wiki/Git">git-versionsstyringssystem</a>. Skriver du kode eller anden tekst som du gerne vil holde under versionsstyring, kan du gemme det her.</p>
+    <h4>Badges</h4>
     <ul class="badges">
         <li>
             <span class="badge badge-positive badge-secure-connection">Positiv:</span>
@@ -61,14 +60,14 @@ Hosting af [git-versionsstyringssystem](https://da.wikipedia.org/wiki/Git).
     <p class="badge-notes">
         [1] Offentligt tilgængelige repositories kan tilgås af alle, uden at være logget ind.
     </p>
+</section>
 
 
 ### [Passit](https://passit.data.coop/)
 
-Password manager (kodeordshusker).
-
-#### Badges
-
+<section class="service-details">
+    <p>Password manager. Hjælper dig med at huske stærke, unikke kodeord til alle de sites og apps du benytter dig af.</p>
+    <h4>Badges</h4>
     <ul class="badges">
         <li>
             <span class="badge badge-positive badge-secure-connection">Positiv:</span>
@@ -111,3 +110,4 @@ Password manager (kodeordshusker).
     <p class="badge-notes">
         [1] Al brugerdata (navne, websites, kodeord, noter osv.) er krypteret så det kun er brugerne selv der kan tilgå deres data. Der foretages dog stadig logning af brugen af tjenesten, så helt 100% ZN er det ikke.
     </p>
+</section>

_sass/_badges.scss

@@ -55,12 +55,12 @@
     font-size: .75em;
 }
 
-ul.badges {
+.service-details ul.badges {
     list-style-type: none;
     margin: 0 0 0 .5em;
     padding: 0;
 }
 
-ul.badges li {
+.service-details ul.badges li {
     margin: .5em 0;
 }