Finish first version of "Letzte Gelegenheit"

src/style.css

@@ -39,7 +39,7 @@
   display: flex;
   max-width: 180px;
   align-self: center;
-  margin-top: 2%;
+  margin-top: var(--dl-space-space-threeunits);
   transition: 0.3s;
   align-items: center;
   padding-top: var(--dl-space-space-oneandhalfunits);
@@ -208,10 +208,10 @@
   flex: 0 0 auto;
   width: 100%;
   display: flex;
+  padding: var(--dl-space-space-unit);
   position: relative;
   align-self: flex-start;
   align-items: center;
-  padding-top: var(--dl-space-space-unit);
   border-color: rgba(200, 200, 200, 0.8);
   border-style: dashed;
   border-width: 0px;
@@ -223,9 +223,8 @@
 }
 .event-date {
   color: #ffffff;
-  width: 24%;
+  width: 210px;
   height: auto;
-  max-width: 220px;
   font-family: Poppins;
   line-height: 28px;
 }
@@ -278,6 +277,7 @@
   font-weight: 400;
 }
 .character-header {
+  gap: var(--dl-space-space-unit);
   flex: 0 0 auto;
   width: 100%;
   display: flex;
@@ -302,10 +302,24 @@
   justify-content: center;
 }
 .character-group {
+  color: #ffffff;
+  align-self: center;
+  margin-top: var(--dl-space-space-threeunits);
+}
+.character-title {
   color: rgb(255, 255, 255);
   font-size: 36px;
   align-self: center;
-  margin-top: var(--dl-space-space-threeunits);
+  margin-top: var(--dl-space-space-sixunits);
+}
+.home-row {
+  gap: var(--dl-space-space-twounits);
+  width: 100%;
+  display: flex;
+  max-width: 1200px;
+  align-items: center;
+  flex-direction: row;
+  justify-content: center;
 }
 .Heading {
   font-size: 32px;
@@ -330,9 +344,13 @@
   .event-title {
     font-size: 24px;
   }
-  .character-group {
+  .character-title {
     font-size: 32px;
   }
+  .home-row {
+    gap: var(--dl-space-space-halfunit);
+    flex-direction: column;
+  }
 }
 @media(max-width: 767px) {
   .nav-link {
@@ -345,7 +363,6 @@
     flex-wrap: wrap;
   }
   .event-date {
-    width: 220px;
     height: auto;
   }
   .event-title {
@@ -362,9 +379,14 @@
     gap: var(--dl-space-space-unit);
     flex-flow: column;
   }
-  .character-group {
+  .character-title {
     color: rgb(255, 255, 255);
   }
+  .home-row {
+    gap: var(--dl-space-space-oneandhalfunits);
+    flex-wrap: wrap;
+    flex-direction: column;
+  }
 }
 @media(max-width: 479px) {
   .section-head {

src/views/ein-orden-fr-eine-gute-tat.vue

@@ -38,7 +38,7 @@
         rel="noreferrer noopener"
       >
         <div class="button">
-          <span class="ein-orden-fr-eine-gute-tat-anmeldung1">
+          <span class="ein-orden-fr-eine-gute-tat-anmeldung">
             <span>PDF Download</span>
             <br />
           </span>
@@ -122,7 +122,7 @@ export default {
 .ein-orden-fr-eine-gute-tat-text08 {
   font-style: italic;
 }
-.ein-orden-fr-eine-gute-tat-anmeldung1 {
+.ein-orden-fr-eine-gute-tat-anmeldung {
   color: rgb(12, 16, 12);
   font-size: 16px;
   font-style: normal;

src/views/home.vue

@@ -29,7 +29,8 @@
         <div class="home-letzte-gelegenheit-run2 event-entry">
           <h3 class="event-title">Letzte Gelegenheit Run 2 (Deutschland)</h3>
           <p class="event-date">
-            15. April 2023, 10:00 Uhr bis 16. April 2023, 14:00 Uhr
+            <span>coming soon</span>
+            <br />
           </p>
           <p class="event-location home-standort1">coming soon</p>
           <router-link to="/letzte-gelegenheit">
@@ -42,7 +43,7 @@
     </section>
     <section class="home-larps-kapitel">
       <h2 class="home-larps-titel section-head">LARPs</h2>
-      <main class="home-cards">
+      <main class="home-row">
         <section class="card">
           <h1 class="home-header">Letzte Gelegenheit</h1>
           <p class="home-description">
@@ -56,7 +57,7 @@
             die Ressourcen aus und die Lage verschärft sich.
           </p>
           <router-link to="/letzte-gelegenheit">
-            <div class="home-button"><p class="home-text04">Mehr -&gt;</p></div>
+            <div class="home-button"><p class="home-text06">Mehr -&gt;</p></div>
           </router-link>
         </section>
         <div class="card">
@@ -72,7 +73,7 @@
             schlafen legten.
           </p>
           <router-link to="/suesse-traeume">
-            <div class="home-button1"><p class="home-text05">Mehr -&gt;</p></div>
+            <div class="home-button1"><p class="home-text07">Mehr -&gt;</p></div>
           </router-link>
         </div>
       </main>
@@ -82,7 +83,7 @@
         <span>Kurzgeschichten</span>
         <br />
       </h2>
-      <main class="home-cards1">
+      <main class="home-row">
         <div class="card">
           <h1 class="home-header2">Ein Orden für eine gute Tat</h1>
           <p class="home-description2">
@@ -96,7 +97,7 @@
             Fragestellung bilden.
           </p>
           <router-link to="/ein-orden-fuer-eine-gute-tat">
-            <div class="home-button2"><p class="home-text08">Lesen -&gt;</p></div>
+            <div class="home-button2"><p class="home-text10">Lesen -&gt;</p></div>
           </router-link>
         </div>
         <div class="card">
@@ -111,7 +112,7 @@
             schreiben.
           </p>
           <router-link to="/rosenteufel">
-            <div class="home-button3"><p class="home-text09">Lesen -&gt;</p></div>
+            <div class="home-button3"><p class="home-text11">Lesen -&gt;</p></div>
           </router-link>
         </div>
       </main>
@@ -277,15 +278,6 @@ export default {
   font-size: 36px;
   text-transform: capitalize;
 }
-.home-cards {
-  gap: var(--dl-space-space-threeunits);
-  width: 100%;
-  display: flex;
-  max-width: 1200px;
-  align-items: center;
-  flex-direction: row;
-  justify-content: center;
-}
 .home-header {
   color: rgb(255, 255, 255);
   font-size: 24px;
@@ -316,7 +308,7 @@ export default {
 .home-button:hover {
   opacity: 0.5;
 }
-.home-text04 {
+.home-text06 {
   color: #ffff00;
   font-style: normal;
   font-weight: 500;
@@ -352,7 +344,7 @@ export default {
 .home-button1:hover {
   opacity: 0.5;
 }
-.home-text05 {
+.home-text07 {
   color: #FFFF00;
   font-style: normal;
   font-weight: 500;
@@ -375,15 +367,6 @@ export default {
   font-size: 36px;
   text-transform: uppercase;
 }
-.home-cards1 {
-  gap: var(--dl-space-space-threeunits);
-  width: 100%;
-  display: flex;
-  max-width: 1200px;
-  align-items: center;
-  flex-direction: row;
-  justify-content: center;
-}
 .home-header2 {
   color: rgb(255, 255, 255);
   font-size: 24px;
@@ -414,7 +397,7 @@ export default {
 .home-button2:hover {
   opacity: 0.5;
 }
-.home-text08 {
+.home-text10 {
   color: #ffff00;
   font-style: normal;
   font-weight: 500;
@@ -450,7 +433,7 @@ export default {
 .home-button3:hover {
   opacity: 0.5;
 }
-.home-text09 {
+.home-text11 {
   color: #ffff00;
   font-style: normal;
   font-weight: 500;
@@ -466,14 +449,6 @@ export default {
   .home-standort1 {
     text-align: center;
   }
-  .home-cards {
-    gap: var(--dl-space-space-halfunit);
-    flex-direction: column;
-  }
-  .home-cards1 {
-    gap: var(--dl-space-space-halfunit);
-    flex-direction: column;
-  }
 }
 @media(max-width: 767px) {
   .home-caption {
@@ -489,15 +464,6 @@ export default {
   .home-veranstaltungen-liste {
     flex-wrap: wrap;
   }
-  .home-cards {
-    gap: var(--dl-space-space-oneandhalfunits);
-    flex-wrap: wrap;
-    flex-direction: column;
-  }
-  .home-cards1 {
-    gap: var(--dl-space-space-oneandhalfunits);
-    flex-direction: column;
-  }
 }
 @media(max-width: 479px) {
   .home-caption {

src/views/larpkonzept.vue

@@ -8,28 +8,29 @@
     <span class="larpkonzept-caption">
       <span>
         Für eine sichere Durchführung von intensiven, emotionalen und
-        kontrastreichen Nordic LARPs
+        kontrastreichen LARPs
       </span>
       <br />
     </span>
-    <p class="text-body">
+    <div class="text-body">
+      <p>
         <span class="larpkonzept-text04">
           Kurze Begriffserklärung für Larp-Neulinge
         </span>
         <br class="larpkonzept-text05" />
         <span>
           LARP steht für Live Action Roleplay. Hierbei schlüpft man in die Rolle
-        eines fiktiven Menschen für die Dauer einer Veranstaltung. Immer wenn man
+          eines fiktiven Menschen für die Dauer einer Veranstaltung. Immer wenn
-        die Rolle des Charakters übernimmt, ist man In-Time (IT). Ansonsten ist
+          man die Rolle des Charakters übernimmt, ist man In-Time (IT). Ansonsten
-        man Out-Time (OT). Hierbei ist wichtig für die Trennung, dass man vor und
+          ist man Out-Time (OT). Hierbei ist wichtig für die Trennung, dass man
-        nach der Veranstaltung (OT) wieder sich selbst ist und vom Charakter am
+          vor und nach der Veranstaltung (OT) wieder sich selbst ist und vom
-        besten in der dritten Person (er/sie/*) redet. Auch wenn man während der
+          Charakter am besten in der dritten Person (er/sie/*) redet. Auch wenn
-        Veranstaltung mal etwas ausserhalb des Charakters macht/sagt ist man OT.
+          man während der Veranstaltung mal etwas ausserhalb des Charakters
-        Manche Leute zeigen das, in dem man mit den Armen ein Kreuz vor der Brust
+          macht/sagt ist man OT. Manche Leute zeigen das, in dem man mit den Armen
-        macht oder mit den flachen Händen ein “T” darstellt. Falls möglich,
+          ein Kreuz vor der Brust macht oder mit den flachen Händen ein “T”
-        versucht man OT-Signale aber so zu senden, dass man die Immersion durch OT
+          darstellt. Falls möglich, versucht man OT-Signale aber so zu senden,
-        Ansagen nicht stört. Zu diesen kommen wir im Kapitel “Spielintensitäts
+          dass man die Immersion durch OT Ansagen nicht stört. Zu diesen kommen
-        Steigerung- und Verringerrung”.
+          wir im Kapitel “Spielintensitäts Steigerung- und Verringerrung”.
         </span>
         <br class="larpkonzept-text07" />
         <br class="larpkonzept-text08" />
@@ -38,13 +39,14 @@
         <br class="larpkonzept-text11" />
         <span>
           Grundsätzlich gilt, &quot;Du kannst was Du darstellen kannst&quot;. D.h.
-        man zeigt in echt was man kann und sagt nicht &quot;ich tue gerade X&quot;
+          man zeigt in echt was man kann und sagt nicht &quot;ich tue gerade
-        (sogenanntes Telling). Beispiel: Wenn man ein Kräftiger Metallbiegender
+          X&quot; (sogenanntes Telling). Beispiel: Wenn man ein Kräftiger
-        Muskelprotz sein möchte muss man entweder so trainieren, dass man das
+          Metallbiegender Muskelprotz sein möchte muss man entweder so trainieren,
-        wirklich kann, oder z.B. überall leichte Props verstecken, die der
+          dass man das wirklich kann, oder z.B. überall leichte Props verstecken,
-        Charakter mit Leichtigkeit verbiegt oder aufhebt. Der Grund weswegen wir
+          die der Charakter mit Leichtigkeit verbiegt oder aufhebt. Der Grund
-        das möchten ist um eine Immersion im Spiel aufrechtzuerhalten, sodass man
+          weswegen wir das möchten ist um eine Immersion im Spiel
-        sich besser in die Charaktere einfühlen kann.
+          aufrechtzuerhalten, sodass man sich besser in die Charaktere einfühlen
+          kann.
         </span>
         <br class="larpkonzept-text13" />
         <br class="larpkonzept-text14" />
@@ -52,84 +54,88 @@
         <br class="larpkonzept-text16" />
         <span>
           Play to Lose heisst für eine bessere Geschichte oder besseres Spiel für
-        die Beteiligten auf einen Erfolg des eigenen Charakters zu verzichten. Das
+          die Beteiligten auf einen Erfolg des eigenen Charakters zu verzichten.
-        heisst der eigene Charakter kann viele Erfolge haben, doch das Spiel ist
+          Das heisst der eigene Charakter kann viele Erfolge haben, doch das Spiel
-        kein Wettstreit darum, wer den erfolgreichsten Charakter gespielt hat. Es
+          ist kein Wettstreit darum, wer den erfolgreichsten Charakter gespielt
-        geht bei “Letzte Gelegenheit” darum, kollaborativ eine spannende
+          hat. Es geht bei “Letzte Gelegenheit” darum, kollaborativ eine spannende
           Geschichte zu erzählen.
         </span>
         <br class="larpkonzept-text18" />
+        <br class="larpkonzept-text19" />
         <span>
           Das Gegenteil von Play to Lose ist Play to Win, also wenn man versucht
           einen möglichst siegreichen Charakter zu spielen. Das ist an sich nicht
           schlecht und kann auch viel Spass machen, ist aber bei “Letzte
-        Gelegenheit” nicht das Ziel. Allgemein verpönt ist Powergaming, also wenn
+          Gelegenheit” nicht das Ziel. Allgemein verpönt ist Powergaming, also
-        man eine offensichtliche Niederlage des eigenen Charakters nicht zulässt
+          wenn man eine offensichtliche Niederlage des eigenen Charakters nicht
-        oder ignoriert und damit die Glaubwürdigkeit der Szene und die Immersion
+          zulässt oder ignoriert und damit die Glaubwürdigkeit der Szene und die
-        der Beteiligten bricht. Powergaming ist bei “Letzte Gelegenheit” verboten.
+          Immersion der Beteiligten bricht. Powergaming ist bei “Letzte
+          Gelegenheit” verboten.
         </span>
-      <br class="larpkonzept-text20" />
         <br class="larpkonzept-text21" />
-      <span class="larpkonzept-text22">Play to Lift</span>
+        <br class="larpkonzept-text22" />
-      <br class="larpkonzept-text23" />
+        <span class="larpkonzept-text23">Play to Lift</span>
+        <br class="larpkonzept-text24" />
         <span>
-        Play to Lift heisst seinen Mitspielern beim Ausspielen ihres Charakters zu
+          Play to Lift heisst seinen Mitspielern beim Ausspielen ihres Charakters
-        unterstützen. Grundsätzlich gilt DKWDDK, doch es gibt auch Spiel deren
+          zu unterstützen. Grundsätzlich gilt DKWDDK, doch es gibt auch Spiel
-        Darstellung schwierig ist, zum Beispiel wenn zwei Spieler Wissenschaftler
+          deren Darstellung schwierig ist, zum Beispiel wenn zwei Spieler
-        spielen, die sich über eine fiktive Technologie streiten. Wenn jemand vor
+          Wissenschaftler spielen, die sich über eine fiktive Technologie
-        dem Spiel angibt, ein Charakter zu spielen der ein kompetenter
+          streiten. Wenn jemand vor dem Spiel angibt, ein Charakter zu spielen der
-        Wissenschaftler ist, dann können sich die Mitspieler schon mal das
+          ein kompetenter Wissenschaftler ist, dann können sich die Mitspieler
-        richtige Mindset setzen, dass man, was dieser erzählt, nicht einfach als
+          schon mal das richtige Mindset setzen, dass man, was dieser erzählt,
-        unbewiesene Theorien abstempelt, sondern seinen Argumenten als Zuhörer
+          nicht einfach als unbewiesene Theorien abstempelt, sondern seinen
-        Gewicht verleiht. Falls ich jetzt mit dem Charakter streiten möchte,
+          Argumenten als Zuhörer Gewicht verleiht. Falls ich jetzt mit dem
-        kritisiere ich nicht seine Kompetenz, sondern vielleicht seine Herkunft
+          Charakter streiten möchte, kritisiere ich nicht seine Kompetenz, sondern
-        und Kultur oder den Zweck seiner Erfindungen. Man nennt das Ganze auch
+          vielleicht seine Herkunft und Kultur oder den Zweck seiner Erfindungen.
-        “sich gegenseitig Hochspielen”. Die wenigsten von uns bedienen wohl als
+          Man nennt das Ganze auch “sich gegenseitig Hochspielen”. Die wenigsten
-        Beruf oder in der Freizeit militärische Funkgeräte, also müssen wir uns da
+          von uns bedienen wohl als Beruf oder in der Freizeit militärische
-        gegenseitig helfen, die Kompetenzen dazu glaubwürdig darzustellen.
+          Funkgeräte, also müssen wir uns da gegenseitig helfen, die Kompetenzen
+          dazu glaubwürdig darzustellen.
         </span>
-      <br class="larpkonzept-text25" />
         <br class="larpkonzept-text26" />
-      <span class="larpkonzept-text27">
+        <br class="larpkonzept-text27" />
+        <span class="larpkonzept-text28">
           Vorgeschriebene Charaktere und Beziehungen
         </span>
-      <br class="larpkonzept-text28" />
+        <br class="larpkonzept-text29" />
         <span>
-        Wir werden Charaktere schreiben die dicht miteinander vernetzt sind. Dies
+          Wir werden Charaktere schreiben die dicht miteinander vernetzt sind.
-        hat zur Konsequenz, dass eher weniger Spielerplätze verfügbar sind, dafür
+          Dies hat zur Konsequenz, dass eher weniger Spielerplätze verfügbar sind,
-        ist die Intensivität für diese Spieler umso höher. Letztendlich liegt es
+          dafür ist die Intensivität für diese Spieler umso höher. Letztendlich
-        an den Spielern, was die Organisatoren schreiben zu interpretieren und
+          liegt es an den Spielern, was die Organisatoren schreiben zu
-        selber zusätzliche Verknüpfungen ins Spiel zu bringen wenn es passt. Die
+          interpretieren und selber zusätzliche Verknüpfungen ins Spiel zu bringen
-        vorgeschriebenen Charaktere und Beziehungen sollen aber sicherstellen,
+          wenn es passt. Die vorgeschriebenen Charaktere und Beziehungen sollen
-        dass sicher jeder Spieler andere Spieler hat, die man anspielen kann.
+          aber sicherstellen, dass sicher jeder Spieler andere Spieler hat, die
+          man anspielen kann.
         </span>
-      <br class="larpkonzept-text30" />
         <br class="larpkonzept-text31" />
-      <span class="larpkonzept-text32">
+        <br class="larpkonzept-text32" />
+        <span class="larpkonzept-text33">
           Spielintensitäts Steigerung- und Verringerrung
         </span>
-      <br class="larpkonzept-text33" />
+        <br class="larpkonzept-text34" />
         <span>
           Wie an vielen Nordic Larps gibt es oft OT-Signale um seinem gegenüber zu
-        vermitteln, dass man die Spielintensität verringern oder steigern möchte.
+          vermitteln, dass man die Spielintensität verringern oder steigern
-        Der Vorteil bei solchen Signalen, ist dass man die Szene dabei nicht OT
+          möchte. Der Vorteil bei solchen Signalen, ist dass man die Szene dabei
-        unterbrechen muss und das die Immersion schützt und gleichzeitig die
+          nicht OT unterbrechen muss und das die Immersion schützt und
-        Hemmungen senkt für das eigene Wohl einzustehen. Um etwas OT mitzuteilen,
+          gleichzeitig die Hemmungen senkt für das eigene Wohl einzustehen. Um
-        meist, dass man etwas OT nicht tun will, nutzen wir am “Letzte
+          etwas OT mitzuteilen, meist, dass man etwas OT nicht tun will, nutzen
-        Gelegenheit” die Formell “wirklich wirklich”. Dies hat sich beim Larp
+          wir am “Letzte Gelegenheit” die Formell “wirklich wirklich”. Dies hat
-        “Tales Inside” bewährt. Man sagt z.B. “Ich will das wirklich wirklich
+          sich beim Larp “Tales Inside” bewährt. Man sagt z.B. “Ich will das
-        nicht tun.” oder “Bitte schlage mich wirklich wirklich nicht.” Das
+          wirklich wirklich nicht tun.” oder “Bitte schlage mich wirklich wirklich
-        Steigern erwirkt man durch die Ansage “War das schon alles?”. Dies hat
+          nicht.” Das Steigern erwirkt man durch die Ansage “War das schon
-        sich auch beim “Tales Inside” bewährt. Das Steigern ist dabei immer nur
+          alles?”. Dies hat sich auch beim “Tales Inside” bewährt. Das Steigern
-        ein Angebot. Das Gegenüber muss auch komfortabel mit einer
+          ist dabei immer nur ein Angebot. Das Gegenüber muss auch komfortabel mit
-        Intensitätssteigerung sein. Es kann also sein, dass das Steigerungssignal
+          einer Intensitätssteigerung sein. Es kann also sein, dass das
-        ignoriert wird.
+          Steigerungssignal ignoriert wird.
         </span>
-      <br class="larpkonzept-text35" />
         <br class="larpkonzept-text36" />
+        <br class="larpkonzept-text37" />
         <span>
           Zu guter Letzt benutzen wir am “Letzte Gelegenheit” auch die
-        <span v-html="rawoiac"></span>
+          <span v-html="rawhsmv"></span>
         </span>
         <a
           href="https://en.wikipedia.org/wiki/OK_gesture"
@@ -140,35 +146,37 @@
           OK-Hand
         </a>
         <span>
-        . Diese soll man Spielern zeigen, bei denen man sich nicht sicher ist, ob
+          . Diese soll man Spielern zeigen, bei denen man sich nicht sicher ist,
-        es denen OT gut geht. Diese geben dann mit einem Daumen an, wie es ihnen
+          ob es denen OT gut geht. Diese geben dann mit einem Daumen an, wie es
-        geht (nach oben heisst gut, Mitte eher mittelmässig und nach unten
+          ihnen geht (nach oben heisst gut, Mitte eher mittelmässig und nach unten
           schlecht). Nur wenn der Daumen nach oben zeigt, soll man die
           Spielintensität beibehalten, ansonsten soll man sie verringern, um
           sicherzustellen, dass es der Person wieder besser geht.
-        <span v-html="rawhzo2"></span>
+          <span v-html="rawzfyh"></span>
         </span>
-      <br class="larpkonzept-text39" />
         <br class="larpkonzept-text40" />
-      <span class="larpkonzept-text41">
+        <br class="larpkonzept-text41" />
+        <span class="larpkonzept-text42">
           Workshops vor und Feedback nach dem Spiel
         </span>
-      <br class="larpkonzept-text42" />
+        <br class="larpkonzept-text43" />
         <span>
-        Wir werden vor und nach dem Spiel Workshops durchführen um die Spielenden
+          Wir werden vor und nach dem Spiel Workshops durchführen um die
-        ins Spiel ein- und wieder auszuführen. Wenn man intensives Spiel hat, was
+          Spielenden ins Spiel ein- und wieder auszuführen. Wenn man intensives
-        unser Ziel ist, kann es schwer sein, die Rolle wieder zu verlassen. IT
+          Spiel hat, was unser Ziel ist, kann es schwer sein, die Rolle wieder zu
-        Gefühle wandern ins OT. Das ist der sogenannte “Bleed”. Das ist
+          verlassen. IT Gefühle wandern ins OT. Das ist der sogenannte “Bleed”.
-        grundsätzlich gut, weil einem Larp nur so wirklich unter die Haut gehen
+          Das ist grundsätzlich gut, weil einem Larp nur so wirklich unter die
-        kann, doch es ist wichtig dann damit sauber abzuschliessen. Wir versuchen
+          Haut gehen kann, doch es ist wichtig dann damit sauber abzuschliessen.
-        euch dabei zu helfen. Zusätzlich wird es eine Feedbackrunde geben, wobei
+          Wir versuchen euch dabei zu helfen. Zusätzlich wird es eine
-        die Spielenden auf Plakaten mit verschiedenen Aspekten des Larps
+          Feedbackrunde geben, wobei die Spielenden auf Plakaten mit verschiedenen
-        schreiben, was sie gut fanden und was sie verbessern würden. Organisatoren
+          Aspekten des Larps schreiben, was sie gut fanden und was sie verbessern
-        sind nach einem Larp meist auch OT angeschlagen und können das Feedback
+          würden. Organisatoren sind nach einem Larp meist auch OT angeschlagen
-        dann später wenn der Stress abgeklungen ist in Ruhe anschauen.
+          und können das Feedback dann später wenn der Stress abgeklungen ist in
+          Ruhe anschauen.
         </span>
-      <br class="larpkonzept-text44" />
+        <br class="larpkonzept-text45" />
       </p>
+    </div>
     <app-kontakt rootClassName="kontakt-root-class-name2"></app-kontakt>
   </div>
 </template>
@@ -186,8 +194,8 @@ export default {
 
   data() {
     return {
-      rawoiac: ' ',
+      rawhsmv: ' ',
-      rawhzo2: ' ',
+      rawzfyh: ' ',
     }
   },
 
@@ -238,6 +246,42 @@ export default {
 .larpkonzept-text04 {
   font-weight: 700;
 }
+.larpkonzept-text10 {
+  font-weight: 700;
+}
+.larpkonzept-text15 {
+  font-weight: 700;
+}
+.larpkonzept-text23 {
+  font-weight: 700;
+}
+.larpkonzept-text28 {
+  font-weight: 700;
+}
+.larpkonzept-text33 {
+  font-weight: 700;
+}
+.larpkonzept-link {
+  font-style: normal;
+  font-weight: 500;
+  text-decoration: underline;
+}
+.larpkonzept-text42 {
+  font-weight: 700;
+}
+@media(max-width: 767px) {
+  .larpkonzept-heading {
+    font-size: 40px;
+  }
+  .larpkonzept-caption {
+    color: rgb(255, 255, 255);
+    font-size: 16px;
+    font-family: Poppins;
+    line-height: 24px;
+  }
+  .larpkonzept-text04 {
+    font-weight: 700;
+  }
   .larpkonzept-text05 {
     font-weight: 700;
   }
@@ -271,7 +315,7 @@ export default {
   .larpkonzept-text18 {
     font-weight: 700;
   }
-.larpkonzept-text20 {
+  .larpkonzept-text19 {
     font-weight: 700;
   }
   .larpkonzept-text21 {
@@ -283,7 +327,7 @@ export default {
   .larpkonzept-text23 {
     font-weight: 700;
   }
-.larpkonzept-text25 {
+  .larpkonzept-text24 {
     font-weight: 700;
   }
   .larpkonzept-text26 {
@@ -295,7 +339,7 @@ export default {
   .larpkonzept-text28 {
     font-weight: 700;
   }
-.larpkonzept-text30 {
+  .larpkonzept-text29 {
     font-weight: 700;
   }
   .larpkonzept-text31 {
@@ -307,20 +351,20 @@ export default {
   .larpkonzept-text33 {
     font-weight: 700;
   }
-.larpkonzept-text35 {
+  .larpkonzept-text34 {
     font-weight: 700;
   }
   .larpkonzept-text36 {
     font-weight: 700;
   }
+  .larpkonzept-text37 {
+    font-weight: 700;
+  }
   .larpkonzept-link {
     font-style: normal;
     font-weight: 500;
     text-decoration: underline;
   }
-.larpkonzept-text39 {
-  font-weight: 700;
-}
   .larpkonzept-text40 {
     font-weight: 700;
   }
@@ -330,18 +374,11 @@ export default {
   .larpkonzept-text42 {
     font-weight: 700;
   }
-.larpkonzept-text44 {
+  .larpkonzept-text43 {
     font-weight: 700;
   }
-@media(max-width: 767px) {
+  .larpkonzept-text45 {
-  .larpkonzept-heading {
+    font-weight: 700;
-    font-size: 40px;
-  }
-  .larpkonzept-caption {
-    color: rgb(255, 255, 255);
-    font-size: 16px;
-    font-family: Poppins;
-    line-height: 24px;
   }
 }
 @media(max-width: 479px) {

src/views/rosenteufel.vue

@@ -6,7 +6,8 @@
       <span>Kurzgeschichte</span>
       <br />
     </span>
-    <span class="text-body">
+    <div class="text-body">
+      <span>
         <span class="rosenteufel-text003">
           Ich erzähl euch ein Gschicht von wahr, so wahr wie ihr danach nicht
           gwollt. Ein Gschicht die erzähl als einzger überlebend: Mein Gschicht. S
@@ -26,10 +27,10 @@
         <br />
         <br />
         <span>
-        Vogt Eberhardt: “Im Nord herrsch Brand und Stank. Räuberband wahrscheinch,
+          Vogt Eberhardt: “Im Nord herrsch Brand und Stank. Räuberband
-        nicht zu schätz woher. Leichen sein gesetzt ins Ufer, ein Blum obendrein.
+          wahrscheinch, nicht zu schätz woher. Leichen sein gesetzt ins Ufer, ein
-        So gefund ein Kind. Rest ausgegraben, all vom selben Weiler. S’ist im
+          Blum obendrein. So gefund ein Kind. Rest ausgegraben, all vom selben
-        Weiler Immerthain...”
+          Weiler. S’ist im Weiler Immerthain...”
         </span>
         <br />
         <br />
@@ -48,8 +49,8 @@
         <br />
         <span>
           Köhler: “Entschuld mein Entsetz Edler, nur wisst, der Teufel treibt dort
-        sein Feuer. Die nicht ermordert flohen mit aller Hab. Nur wenige blieben.
+          sein Feuer. Die nicht ermordert flohen mit aller Hab. Nur wenige
-        Möge sich der Herr ihnen erbarmen...”
+          blieben. Möge sich der Herr ihnen erbarmen...”
         </span>
         <br />
         <br />
@@ -60,19 +61,19 @@
         <br />
         <br />
         <span>
-        Köhler: “Verzeiht’s mir Edler, verzeiht’s. Der schnellste Weg führt durch
+          Köhler: “Verzeiht’s mir Edler, verzeiht’s. Der schnellste Weg führt
-        den Kammertwald. Hie wo ich zeig überm Pfad. Zwei Tag, ein Nacht. Aber...
+          durch den Kammertwald. Hie wo ich zeig überm Pfad. Zwei Tag, ein Nacht.
-        Edler, bei Gotts Gnad, ich wärt kein gut Christ Euch ohne Warn lass
+          Aber... Edler, bei Gotts Gnad, ich wärt kein gut Christ Euch ohne Warn
-        schreiten. Seit Geschehnem ist hie keiner entlang. Wer weiss was
+          lass schreiten. Seit Geschehnem ist hie keiner entlang. Wer weiss was
         </span>
         <br />
         <span>Geziefer dort treibt...”</span>
         <br />
         <br />
         <span>
-        Ritter von Petz: “Tieft den Zinken nun. Hast getan was gesagt. Wartet mein
+          Ritter von Petz: “Tieft den Zinken nun. Hast getan was gesagt. Wartet
-        Kommen in einem Dutzend Tag – nicht spät. Sollt ich kehr, so ritz ich dies
+          mein Kommen in einem Dutzend Tag – nicht spät. Sollt ich kehr, so ritz
-        Holz mit eir Botschaft. Andernfalls berichtet meins Schicksal.”
+          ich dies Holz mit eir Botschaft. Andernfalls berichtet meins Schicksal.”
         </span>
         <br />
         <br />
@@ -80,8 +81,8 @@
         <br />
         <br />
         <span>
-        Ritter von Petz dreht sich: “Auf jetzt, Gefolg. Noch die letzten Schritte
+          Ritter von Petz dreht sich: “Auf jetzt, Gefolg. Noch die letzten
-        nicht geschritten.”
+          Schritte nicht geschritten.”
         </span>
         <br />
         <br />
@@ -110,11 +111,11 @@
         <br />
         <br />
         <span>
-        Ritter dreht zu Rück, zeigt mit grüstet Finger, all’s hält ein: “So zügle
+          Ritter dreht zu Rück, zeigt mit grüstet Finger, all’s hält ein: “So
-        er seine Zunge, der sich gewagt meins Gfährten zu schwörn! So halt er den
+          zügle er seine Zunge, der sich gewagt meins Gfährten zu schwörn! So halt
-        Mund der nur striegelt und Dung sticht, um seines Lebens kein Sorg! Und so
+          er den Mund der nur striegelt und Dung sticht, um seines Lebens kein
-        bleibe sie still solang sie noch eines Brots erbetteln möcht. Ihr all seid
+          Sorg! Und so bleibe sie still solang sie noch eines Brots erbetteln
-        feig und Kloss an mei’m Bein.”
+          möcht. Ihr all seid feig und Kloss an mei’m Bein.”
         </span>
         <br />
         <br />
@@ -126,9 +127,9 @@
           Gnad zeig wem wieder erblick! Wer weiss wieviel noch gemordt währn ihr
           quängelt wie neugeborns, nackts Kindlein. Erinnert Eberhardts Wort: Acht
           tot in acht Nacht. Sieht mein Stundglas. Seit hee s rieselt. Ich gedreht
-        jed Stund. Nach zehn weiter Dreh unds letzt Korn gerieselt s des nächsten
+          jed Stund. Nach zehn weiter Dreh unds letzt Korn gerieselt s des
-        arm Seel dessen euch verantwort. So zügelt und schluckt der schwächend
+          nächsten arm Seel dessen euch verantwort. So zügelt und schluckt der
-        Quängelei.”
+          schwächend Quängelei.”
         </span>
         <br />
         <br />
@@ -159,12 +160,13 @@
         <br />
         <br />
         <span>
-        Knappe von Jachstett: “Edler Herr, gehört Geräusch vom Walde. S der Teufel
+          Knappe von Jachstett: “Edler Herr, gehört Geräusch vom Walde. S der
-        wir när schreit. Uns verdammt hie auf Glut mit barem Fuss. Bei Gott, Euch
+          Teufel wir när schreit. Uns verdammt hie auf Glut mit barem Fuss. Bei
-        verwerf nicht den Mut zu gehn in wackren Kampf. Aber schauet nur ins
+          Gott, Euch verwerf nicht den Mut zu gehn in wackren Kampf. Aber schauet
-        Gsicht von einfach Leut, Knecht und Magd. Beid mit Angst, des Herrn kein
+          nur ins Gsicht von einfach Leut, Knecht und Magd. Beid mit Angst, des
-        Mittel. So lässt hie in sicher, nicht drohn ihrets Blut. Schon meiner mir
+          Herrn kein Mittel. So lässt hie in sicher, nicht drohn ihrets Blut.
-        erbarme, aber deren Leben verworfen sobald in selbe Flammen waten.”
+          Schon meiner mir erbarme, aber deren Leben verworfen sobald in selbe
+          Flammen waten.”
         </span>
         <br />
         <br />
@@ -180,7 +182,8 @@
         <br />
         <br />
         <span>
-        Knecht Troffecht: “Edler Herr, wisst wo sich Herrn von Jachstett treibt?”
+          Knecht Troffecht: “Edler Herr, wisst wo sich Herrn von Jachstett
+          treibt?”
         </span>
         <br />
         <br />
@@ -191,12 +194,12 @@
         <br />
         <br />
         <span>
-        Unds wart kein weiter Wort gesproch, bis zum Weiler angekomm. Am Ufer, man
+          Unds wart kein weiter Wort gesproch, bis zum Weiler angekomm. Am Ufer,
-        sah, s wart ein pechschwarz Mantel gehüllt Gestalt, Kapuz über Gesicht
+          man sah, s wart ein pechschwarz Mantel gehüllt Gestalt, Kapuz über
-        hängend. S leert eins Hands Sand über einen Sandhaufen der bereits eins
+          Gesicht hängend. S leert eins Hands Sand über einen Sandhaufen der
-        Manns lang wie breit. Ritter zittert erst, reisst die Zügel in Knechts
+          bereits eins Manns lang wie breit. Ritter zittert erst, reisst die Zügel
-        Hand, schleicht so gut sein Harnisch’s vermag. Sein Eisen in Höh, in
+          in Knechts Hand, schleicht so gut sein Harnisch’s vermag. Sein Eisen in
-        tiefer Sonn s blinkt.
+          Höh, in tiefer Sonn s blinkt.
         </span>
         <br />
         <br />
@@ -211,9 +214,10 @@
         <br />
         <br />
         <span>
-        Ritter spricht zur Magd, kommt zum Knecht mit seufz: “Aufgab’s vollbracht.
+          Ritter spricht zur Magd, kommt zum Knecht mit seufz: “Aufgab’s
-        Des Teufels bedarfs kein Grab, ihn lässt nur rotten solangs ihm möglich,
+          vollbracht. Des Teufels bedarfs kein Grab, ihn lässt nur rotten solangs
-        sein Höll auf Erd. Wir nun kehren und vielleicht des Knapp einholn.”
+          ihm möglich, sein Höll auf Erd. Wir nun kehren und vielleicht des Knapp
+          einholn.”
         </span>
         <br />
         <br />
@@ -225,15 +229,15 @@
         <br />
         <br />
         <span>
-        In Nacht keiner ein Aug zugetan. Des Ritters Kling noch rot, er sie nicht
+          In Nacht keiner ein Aug zugetan. Des Ritters Kling noch rot, er sie
-        sauber gefragt und der Knecht viel zu blass als ihm vorzukommen. Letztlich
+          nicht sauber gefragt und der Knecht viel zu blass als ihm vorzukommen.
-        doch die Augen sich schlossen. Doch wachten nur noch Ritter und Knecht.
+          Letztlich doch die Augen sich schlossen. Doch wachten nur noch Ritter
-        Des Ritters Petz Kling noch immer rot; des Knechts Haut
+          und Knecht. Des Ritters Petz Kling noch immer rot; des Knechts Haut
         </span>
         <br />
         <span>
-        noch immer weiss und nass. Dieses Mal der Knecht nicht wagte zu fragen der
+          noch immer weiss und nass. Dieses Mal der Knecht nicht wagte zu fragen
-        Verschwundenen.
+          der Verschwundenen.
         </span>
         <br />
         <br />
@@ -254,10 +258,10 @@
         <br />
         <br />
         <span>
-        Der Knecht blickt zurück. Ritter greift zur Klinge. Knecht rennt. Er rennt
+          Der Knecht blickt zurück. Ritter greift zur Klinge. Knecht rennt. Er
-        und rennt, so schnell er kann. Ritter hinterher, ohne Harnisch flink,
+          rennt und rennt, so schnell er kann. Ritter hinterher, ohne Harnisch
-        flinker als der Knecht. Doch der Knecht nicht stumpf und so bricht in den
+          flink, flinker als der Knecht. Doch der Knecht nicht stumpf und so
-        dunklen Wald. Seine Fährte der Ritter rasch verlorn.
+          bricht in den dunklen Wald. Seine Fährte der Ritter rasch verlorn.
         </span>
         <br />
         <br />
@@ -269,9 +273,9 @@
         <br />
         <span>
           Doch sein Stimm bald verblasst. Ich kam zum Weiler, klein Leut bereits
-        gestanden um die düstre Gstalt. Daneben ein weiterer, gleicher Haufen mit
+          gestanden um die düstre Gstalt. Daneben ein weiterer, gleicher Haufen
-        einer weissen Ros in Mitt. Zehn Häufen, all geschmückt mit weisser Ros.
+          mit einer weissen Ros in Mitt. Zehn Häufen, all geschmückt mit weisser
-        All bis auf der vord Gstalt. Kindsvolk starrte mir.
+          Ros. All bis auf der vord Gstalt. Kindsvolk starrte mir.
         </span>
         <br />
         <br />
@@ -280,9 +284,10 @@
           zuher. Sie starrten; auch kalt und hilflos wie Kind. Ich schritt nach
           vorn: In die Händ des Toten seh, weiss Ros. Ins Gesicht des Toten blick.
           Beulen zierten’s. Hässliche Beulen. Der Teufel aber wart woanders...
-        <span v-html="rawj2h8"></span>
+          <span v-html="rawjwr4"></span>
         </span>
       </span>
+    </div>
     <app-kontakt rootClassName="kontakt-root-class-name1"></app-kontakt>
   </div>
 </template>
@@ -300,7 +305,7 @@ export default {
 
   data() {
     return {
-      rawj2h8: ' ',
+      rawjwr4: ' ',
     }
   },
 

src/views/ssse-trume.vue

@@ -9,24 +9,26 @@
       <span>Fantasy Mini-LARP</span>
       <br />
     </span>
-    <p class="text-body">
+    <div class="ssse-trume-container1 text-body">
+      <p>
         <span>
           &quot;Weisst du, wer du bist? Was du bereust, befürchtest, vergessen
-        möchtest? Was du erreichen möchtest und was dir alles recht ist um dies zu
+          möchtest? Was du erreichen möchtest und was dir alles recht ist um dies
-        erreichen? Zeit, deine Antworten auf diese Fragen auf die Probe zu
+          zu erreichen? Zeit, deine Antworten auf diese Fragen auf die Probe zu
           stellen...&quot;
         </span>
         <br />
         <br />
         <span>
-        Süsse Träume war ein Fantasy Minilarp (nicht Nordic) im Wald von Eschikon
+          Süsse Träume war ein Fantasy Minilarp (nicht Nordic) im Wald von
-        (8315 Lindau, Schweiz) das Sue und Hermann organisierten. Es ging darum,
+          Eschikon (8315 Lindau, Schweiz) das Sue und Hermann organisierten. Es
-        dass ein Hexer Trajar die Spielercharaktere in seine Traumwelt entführte,
+          ging darum, dass ein Hexer Trajar die Spielercharaktere in seine
-        als diese sich schlafen legten. Hier wurde das Open Visor Larpkonzept noch
+          Traumwelt entführte, als diese sich schlafen legten. Hier wurde das Open
-        nicht verwendet.
+          Visor Larpkonzept noch nicht verwendet.
         </span>
         <br />
       </p>
+    </div>
     <app-kontakt rootClassName="kontakt-root-class-name"></app-kontakt>
   </div>
 </template>
@@ -78,6 +80,10 @@ export default {
   font-family: Poppins;
   line-height: 30px;
 }
+.ssse-trume-container1 {
+  align-items: center;
+  justify-content: center;
+}
 @media(max-width: 991px) {
   .ssse-trume-caption {
     text-align: left;