diff --git a/src/templates.rs b/src/templates.rs
index 96866b8..fb122b2 100644
--- a/src/templates.rs
+++ b/src/templates.rs
@@ -297,6 +297,7 @@ pub async fn middleware<B>(
             .first()
             .expect("Expected at least one language to be present due to default")
             .to_string();
+        // Return Value because this value is optional.
         translations.get_item(&Value::from(selected_language))
     });
     // Render a fluent message.
@@ -363,7 +364,7 @@ pub async fn middleware<B>(
 
             let mut html = String::new();
             pulldown_cmark::html::push_html(&mut html, parser);
-            Ok(html)
+            Ok(Value::from_safe_string(html))
         },
     );
     environment.add_function("ansi_to_html", |ansi_string: &str| {
@@ -387,6 +388,19 @@ pub async fn middleware<B>(
         })
         .unwrap_or(().into());
     environment.add_function("uuid", || Uuid::new_v4().to_string());
+    environment.add_filter("md", |value: Value| {
+        if value.is_none() || value.is_undefined() {
+            return value;
+        }
+        if let Some(string) = value.as_str() {
+            let parser = pulldown_cmark::Parser::new(string);
+            let mut html = String::new();
+            pulldown_cmark::html::push_html(&mut html, parser);
+            Value::from_safe_string(html)
+        } else {
+            Value::from(())
+        }
+    });
     environment.add_filter("querystring", querystring);
     environment.add_filter("mapinsert", mapinsert);
     environment.add_filter("mapremove", mapremove);
diff --git a/src/templates/forecast.html b/src/templates/forecast.html
index 78bfe52..94e1ab0 100644
--- a/src/templates/forecast.html
+++ b/src/templates/forecast.html
@@ -157,10 +157,10 @@ <h3 class="text-3xl text-center pt-2">{{ fl("problem-type-" ~ problem.kind) }}</
                             {{ fl("avalanche-likelihood-heading") }}
                         </div>
                     </div>
-                    <p class="hyphens-auto md:hyphens-none md:text-justify py-2">
-                        <span class="italic">{{ fl("problem-type-" ~ problem.kind ~ "-about") }}</span>
-                        {{ translated_string(problem.description) }}
-                    </p>
+                    <div class="hyphens-auto md:hyphens-none md:text-justify pt-2 italic">
+                        {{ fl("problem-type-" ~ problem.kind ~ "-about") }}
+                    </div>
+                    <div class="prose prose-p:leading-normal text-black pb-2">{{ translated_string(problem.description) | md }}</div>
                     <div class="py-2">
                         <table class="w-full">
                             <tr class="odd:bg-gray-100">
@@ -169,7 +169,9 @@ <h3 class="text-3xl text-center pt-2">{{ fl("problem-type-" ~ problem.kind) }}</
                             </tr>
                             <tr class="odd:bg-gray-100">
                                 <td class="text-right font-bold p-2">{{ fl("distribution-heading") }}</td>
-                                <td class="p-2">{{ fl("distribution-" ~ problem.distribution ~ "-about") }}</td>
+                                <td class="p-2">
+                                    {{ fl("distribution-" ~ problem.distribution ~ "-about") }}
+                                </td>
                             </tr>
                             <tr class="odd:bg-gray-100">
                                 <td class="text-right font-bold p-2">
@@ -207,15 +209,15 @@ <h3 class="text-3xl text-center pt-2">{{ fl("problem-type-" ~ problem.kind) }}</
                 <h2 class="text-4xl text-center py-4">
                     {{ fl("recent-relevant-observations-heading") }}
                 </h2>
-                <p class="md:text-justify md:hyphens-none pb-2">
-                    {{ translated_string(recent_observations) }}
-                </p>
+                <div class="pb-2 prose leading-normal text-black">
+                    {{ translated_string(recent_observations) | md }}
+                </div>
                 <h2 class="text-4xl text-center py-2">
                     {{ fl("weather-forecast-heading") }}
                 </h2>
-                <p class="md:text-justify md:hyphens-none pb-2">
-                    {{ translated_string(weather_forecast) }}
-                </p>
+                <div class="pb-2 prose leading-normal text-black">
+                    {{ translated_string(weather_forecast) | md }}
+                </div>
             </div>
         </div>
     </div>
diff --git a/src/templates/index.html b/src/templates/index.html
index a78e24c..0ffa490 100644
--- a/src/templates/index.html
+++ b/src/templates/index.html
@@ -63,9 +63,7 @@ <h1 class="text-5xl font-bold text-center">{{ page_title }}</h1>
                 <div class="py-5">
                     <p class="md:text-justify">{{ fl("disclaimer-message") }}</p>
                     <p class="prose max-w-none">
-                        {% autoescape false %}
-                            {{ fl_md("see-facebook-page-message", {"url": "https://www.facebook.com/groups/830534093958221"}, { "use_isolating": false} ) }}
-                        {% endautoescape %}
+                        {{ fl_md("see-facebook-page-message", {"url": "https://www.facebook.com/groups/830534093958221"}, { "use_isolating": false} ) }}
                     </p>
                 </div>
                 <div class="sticky bottom-0 h-px -mt-px bg-slate-200 dark:bg-slate-400/20"></div>
@@ -78,9 +76,7 @@ <h2 class="text-2xl font-bold py-2">{{ fl("forecast-archive-heading") }}</h2>
                 <h2 class="text-2xl font-bold text-rose-600">Errors Reading Forecast Files</h2>
                 {% for error in errors %}
                     <h3 class="text-xl font-bold text-rose-600">Error {{ loop.index }}</h3>
-                    {% autoescape false %}
-                        <pre>{{ ansi_to_html(error) }}</pre>
-                    {% endautoescape %}
+                    <pre>{{ ansi_to_html(error) }}</pre>
                 {% endfor %}
             {% endif %}
         </div>
diff --git a/src/templates/macros/forecast_intro.html b/src/templates/macros/forecast_intro.html
index 4a82303..dee1538 100644
--- a/src/templates/macros/forecast_intro.html
+++ b/src/templates/macros/forecast_intro.html
@@ -9,24 +9,12 @@
             <p class="italic hyphens-auto md:text-justify">
                 {{ fl("avalanche-hazard-" ~ overall_hazard ~ "-likelihood") }} {{ fl("avalanche-hazard-" ~ overall_hazard ~ "-size-distribution") }}
             </p>
-            <p class="md:text-justify">{{ translated_string(description) }}</p>
+            <div class="prose leading-normal text-black">{{ translated_string(description) | md }}</div>
         </div>
     </div>
     <div class="py-4">
-        <p class="text-center">
-            {% autoescape false %}
-                {{ fl_md("forecast-issued-at", {'time': formatted_time}) }}
-            {% endautoescape %}
-        </p>
-        <p class="text-center">
-            {% autoescape false %}
-                {{ fl_md("forecast-valid-until", {'time': formatted_valid_until}) }}
-            {% endautoescape %}
-        </p>
-        <p class="text-center">
-            {% autoescape false %}
-                {{ fl_md("forecast-forecaster", {'name': forecaster_name}) }}
-            {% endautoescape %}
-        </p>
+        <p class="text-center">{{ fl_md("forecast-issued-at", {'time': formatted_time}) }}</p>
+        <p class="text-center">{{ fl_md("forecast-valid-until", {'time': formatted_valid_until}) }}</p>
+        <p class="text-center">{{ fl_md("forecast-forecaster", {'name': forecaster_name}) }}</p>
     </div>
 {% endmacro %}