From 5ba74d2b47d5e6edd2666b5066bfa4e3901d8d48 Mon Sep 17 00:00:00 2001
From: Gary <pgx7aiqs@anonaddy.me>
Date: Thu, 21 Mar 2024 10:47:45 -0700
Subject: [PATCH] fix: about page mobile formatting

---
 contact.html   | 13 ++++++-------
 css/styles.css | 11 +++++++++--
 2 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/contact.html b/contact.html
index 145a210..e568a4e 100644
--- a/contact.html
+++ b/contact.html
@@ -36,12 +36,9 @@
     <header id="header"></header>
 
     <main>
-      <div class="flex-column">
+      <div class="flex-container">
         <h1>Contact Us</h1>
-        <p>
-          Don't hesitate to give us a shout. Our team is standing by, ready to
-          lend a helping hand.
-        </p>
+        <p>Our team is standing by, ready to lend a helping hand.</p>
         <div class="flex-row">
           <div class="flex-container bg-one">
             <h2>Email</h2>
@@ -56,8 +53,10 @@
             <h2>Session App ID</h2>
             <p>https://getsession.org/</p>
             <p>
-              Send message to:
-              05749d3243893f39b968b5531bb8054a957736b99a86abd8731d3b06cec9f59e1b
+              <strong>Send message to:</strong>
+              <span class="break-all"
+                >05749d3243893f39b968b5531bb8054a957736b99a86abd8731d3b06cec9f59e1b</span
+              >
             </p>
           </div>
           <div class="flex-container bg-one">
diff --git a/css/styles.css b/css/styles.css
index 5452479..0fe8ec2 100644
--- a/css/styles.css
+++ b/css/styles.css
@@ -105,13 +105,16 @@ ul,
 ol,
 td,
 li {
+  word-break: normal;
   color: #1c1c1c;
   text-align: left;
   margin: 0 auto;
   padding: 5px;
   max-width: 1000px;
 }
-
+.break-all {
+  word-break: break-all;
+}
 a {
   color: white;
   text-decoration: none;
@@ -410,8 +413,12 @@ input:checked + .drop + .menu-items {
   text-align: center;
   padding: 20px;
 }
-/* mobile menu */
+
 @media all and (max-width: 960px) {
+  .flex-column {
+    padding: 10px 5px;
+  }
+  /* mobile menu */
   /* First Tier Dropdown */
   /* Display All Items in Full-width Column */