diff --git a/src/components/QuickNav.vue b/src/components/QuickNav.vue
index 3ba98bb..2fbe3b1 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 65f261b..b9a6624 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 2d13099..3163318 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 20cbe16..1b2de02 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 122d9fc..fdf0372 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 35bec25..8232d76 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 3c1cdb5..9bef1b0 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 baa9b82..8f7d808 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 758c534..9fe9532 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 ceaf278..c106a86 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 8400747..8a3fe3f 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 c659f5f..7642f45 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 69b39ce..94f436a 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 74d17c3..806fa1f 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 6e87a74..8334fe4 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 b62ec91..4d0ea8a 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 b59f0da..3948253 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 76bbccb..4495700 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 573053b..113dd8a 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 f518e03..490602c 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 ca31c5e..919f3b3 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 5f36b72..528ca9b 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 746574b..18de561 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 5aaf53d..970dcdd 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 01d8c32..f82de41 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 1e0a7f8..5e896d5 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 -->