diff --git a/src/components/QuickNav.vue b/src/components/QuickNav.vue
index 3ba98bb8..2fbe3b11 100644
--- a/src/components/QuickNav.vue
+++ b/src/components/QuickNav.vue
@@ -1,7 +1,7 @@
 <template>
   <!-- QUICK NAV -->
   <nav id="QuickNav" class="fixed bottom-0 left-0 right-0 bg-slate-200 z-50">
-    <ul class="flex text-2xl p-2 gap-2">
+    <ul class="flex text-2xl p-2 gap-2 max-w-3xl mx-auto">
       <!-- Home Feed -->
       <li
         :class="{
diff --git a/src/views/AccountViewView.vue b/src/views/AccountViewView.vue
index 65f261bd..b9a66249 100644
--- a/src/views/AccountViewView.vue
+++ b/src/views/AccountViewView.vue
@@ -3,7 +3,7 @@
   <TopMessage />
 
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Heading -->
     <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-4">
       Your Identity
diff --git a/src/views/ClaimView.vue b/src/views/ClaimView.vue
index 2d130992..31633180 100644
--- a/src/views/ClaimView.vue
+++ b/src/views/ClaimView.vue
@@ -1,7 +1,7 @@
 <template>
   <QuickNav />
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div id="ViewBreadcrumb" class="mb-8">
       <h1 class="text-lg text-center font-light relative px-7">
diff --git a/src/views/ConfirmContactView.vue b/src/views/ConfirmContactView.vue
index 20cbe169..1b2de025 100644
--- a/src/views/ConfirmContactView.vue
+++ b/src/views/ConfirmContactView.vue
@@ -1,6 +1,6 @@
 <template>
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div id="ViewBreadcrumb" class="mb-8">
       <h1 class="text-lg text-center font-light relative px-7">
diff --git a/src/views/ContactAmountsView.vue b/src/views/ContactAmountsView.vue
index 122d9fc5..fdf03728 100644
--- a/src/views/ContactAmountsView.vue
+++ b/src/views/ContactAmountsView.vue
@@ -1,6 +1,6 @@
 <template>
   <QuickNav selected="Contacts"></QuickNav>
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div class="mb-8">
       <h1
diff --git a/src/views/ContactGiftingView.vue b/src/views/ContactGiftingView.vue
index 35bec254..8232d764 100644
--- a/src/views/ContactGiftingView.vue
+++ b/src/views/ContactGiftingView.vue
@@ -1,7 +1,7 @@
 <template>
   <QuickNav selected="Home"></QuickNav>
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div id="ViewBreadcrumb" class="mb-8">
       <h1 class="text-lg text-center font-light relative px-7">
diff --git a/src/views/ContactQRScanShowView.vue b/src/views/ContactQRScanShowView.vue
index 3c1cdb5e..9bef1b09 100644
--- a/src/views/ContactQRScanShowView.vue
+++ b/src/views/ContactQRScanShowView.vue
@@ -1,7 +1,7 @@
 <template>
   <QuickNav selected="Profile"></QuickNav>
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div class="mb-8">
       <!-- Back -->
diff --git a/src/views/ContactScanView.vue b/src/views/ContactScanView.vue
index baa9b825..8f7d808b 100644
--- a/src/views/ContactScanView.vue
+++ b/src/views/ContactScanView.vue
@@ -1,5 +1,5 @@
 <template>
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div id="ViewBreadcrumb" class="mb-8">
       <h1 class="text-lg text-center font-light relative px-7">
diff --git a/src/views/ContactsView.vue b/src/views/ContactsView.vue
index 758c5344..9fe9532b 100644
--- a/src/views/ContactsView.vue
+++ b/src/views/ContactsView.vue
@@ -1,6 +1,6 @@
 <template>
   <QuickNav selected="Contacts"></QuickNav>
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Heading -->
     <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
       Your Contacts
diff --git a/src/views/DiscoverView.vue b/src/views/DiscoverView.vue
index ceaf2789..c106a860 100644
--- a/src/views/DiscoverView.vue
+++ b/src/views/DiscoverView.vue
@@ -3,7 +3,7 @@
   <TopMessage />
 
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Heading -->
     <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
       Discover
diff --git a/src/views/HelpNotificationsView.vue b/src/views/HelpNotificationsView.vue
index 8400747d..8a3fe3ff 100644
--- a/src/views/HelpNotificationsView.vue
+++ b/src/views/HelpNotificationsView.vue
@@ -2,7 +2,7 @@
   <QuickNav />
 
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div class="mb-8">
       <!-- Back -->
diff --git a/src/views/HelpView.vue b/src/views/HelpView.vue
index c659f5f7..7642f451 100644
--- a/src/views/HelpView.vue
+++ b/src/views/HelpView.vue
@@ -2,7 +2,7 @@
   <QuickNav />
 
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div class="mb-8">
       <!-- Back -->
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 69b39ce5..94f436a8 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -3,7 +3,7 @@
   <TopMessage />
 
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
       Time Safari
     </h1>
diff --git a/src/views/IdentitySwitcherView.vue b/src/views/IdentitySwitcherView.vue
index 74d17c3d..806fa1f4 100644
--- a/src/views/IdentitySwitcherView.vue
+++ b/src/views/IdentitySwitcherView.vue
@@ -1,6 +1,6 @@
 <template>
   <QuickNav selected="Profile"></QuickNav>
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div id="ViewBreadcrumb" class="mb-8">
       <h1 class="text-lg text-center font-light relative px-7">
diff --git a/src/views/ImportAccountView.vue b/src/views/ImportAccountView.vue
index 6e87a74f..8334fe47 100644
--- a/src/views/ImportAccountView.vue
+++ b/src/views/ImportAccountView.vue
@@ -1,5 +1,5 @@
 <template>
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div id="ViewBreadcrumb" class="mb-8">
       <h1 class="text-lg text-center font-light relative px-7">
diff --git a/src/views/ImportDerivedAccountView.vue b/src/views/ImportDerivedAccountView.vue
index b62ec912..4d0ea8a4 100644
--- a/src/views/ImportDerivedAccountView.vue
+++ b/src/views/ImportDerivedAccountView.vue
@@ -1,5 +1,5 @@
 <template>
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div id="ViewBreadcrumb" class="mb-8">
       <h1 class="text-lg text-center font-light relative px-7">
diff --git a/src/views/NewEditAccountView.vue b/src/views/NewEditAccountView.vue
index b59f0da3..39482538 100644
--- a/src/views/NewEditAccountView.vue
+++ b/src/views/NewEditAccountView.vue
@@ -1,5 +1,5 @@
 <template>
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div id="ViewBreadcrumb" class="mb-8">
       <h1 class="text-lg text-center font-light relative px-7">
diff --git a/src/views/NewEditCommitmentView.vue b/src/views/NewEditCommitmentView.vue
index 76bbccbc..44957000 100644
--- a/src/views/NewEditCommitmentView.vue
+++ b/src/views/NewEditCommitmentView.vue
@@ -1,6 +1,6 @@
 <template>
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div id="ViewBreadcrumb" class="mb-8">
       <h1 class="text-lg text-center font-light relative px-7">
diff --git a/src/views/NewEditProjectView.vue b/src/views/NewEditProjectView.vue
index 573053bd..113dd8ae 100644
--- a/src/views/NewEditProjectView.vue
+++ b/src/views/NewEditProjectView.vue
@@ -1,7 +1,7 @@
 <template>
   <QuickNav selected="Projects"></QuickNav>
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div id="ViewBreadcrumb" class="mb-8">
       <h1 class="text-lg text-center font-light relative px-7">
diff --git a/src/views/NewIdentifierView.vue b/src/views/NewIdentifierView.vue
index f518e03a..490602ce 100644
--- a/src/views/NewIdentifierView.vue
+++ b/src/views/NewIdentifierView.vue
@@ -2,7 +2,7 @@
   <QuickNav />
 
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div class="mb-8">
       <!-- Back -->
diff --git a/src/views/ProjectViewView.vue b/src/views/ProjectViewView.vue
index ca31c5ed..919f3b3f 100644
--- a/src/views/ProjectViewView.vue
+++ b/src/views/ProjectViewView.vue
@@ -3,7 +3,7 @@
   <TopMessage />
 
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div id="ViewBreadcrumb" class="mb-8">
       <h1 class="text-lg text-center font-light relative px-7">
diff --git a/src/views/ProjectsView.vue b/src/views/ProjectsView.vue
index 5f36b72d..528ca9b8 100644
--- a/src/views/ProjectsView.vue
+++ b/src/views/ProjectsView.vue
@@ -2,7 +2,7 @@
   <QuickNav selected="Projects"></QuickNav>
   <TopMessage />
 
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Heading -->
     <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
       Your Ideas
diff --git a/src/views/SearchAreaView.vue b/src/views/SearchAreaView.vue
index 746574bb..18de5618 100644
--- a/src/views/SearchAreaView.vue
+++ b/src/views/SearchAreaView.vue
@@ -2,7 +2,7 @@
   <QuickNav />
 
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div class="mb-8">
       <!-- Back -->
diff --git a/src/views/SeedBackupView.vue b/src/views/SeedBackupView.vue
index 5aaf53d0..970dcdd6 100644
--- a/src/views/SeedBackupView.vue
+++ b/src/views/SeedBackupView.vue
@@ -1,7 +1,7 @@
 <template>
   <QuickNav selected="Profile"></QuickNav>
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Heading -->
     <h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
       Seed Backup
diff --git a/src/views/StatisticsView.vue b/src/views/StatisticsView.vue
index 01d8c323..f82de413 100644
--- a/src/views/StatisticsView.vue
+++ b/src/views/StatisticsView.vue
@@ -2,7 +2,7 @@
   <QuickNav />
 
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div class="mb-8">
       <!-- Back -->
diff --git a/src/views/TestView.vue b/src/views/TestView.vue
index 1e0a7f80..5e896d5b 100644
--- a/src/views/TestView.vue
+++ b/src/views/TestView.vue
@@ -2,7 +2,7 @@
   <QuickNav />
 
   <!-- CONTENT -->
-  <section id="Content" class="p-6 pb-24">
+  <section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
     <!-- Breadcrumb -->
     <div class="mb-8">
       <!-- Back -->