center:

2 files changed, 39 insertions, 1 deletions

diff --git a/static/main.css b/static/main.css
index 006e857..8b49de5 100644
--- a/static/main.css
+++ b/static/main.css
@@ -705,6 +705,40 @@ select {
   --tw-backdrop-sepia:  ;
 }
 
+.container {
+  width: 100%;
+}
+
+@media (min-width: 640px) {
+  .container {
+    max-width: 640px;
+  }
+}
+
+@media (min-width: 768px) {
+  .container {
+    max-width: 768px;
+  }
+}
+
+@media (min-width: 1024px) {
+  .container {
+    max-width: 1024px;
+  }
+}
+
+@media (min-width: 1280px) {
+  .container {
+    max-width: 1280px;
+  }
+}
+
+@media (min-width: 1536px) {
+  .container {
+    max-width: 1536px;
+  }
+}
+
 .sr-only {
   position: absolute;
   width: 1px;
@@ -811,6 +845,10 @@ select {
   max-width: 80rem;
 }
 
+.max-w-sm {
+  max-width: 24rem;
+}
+
 .flex-1 {
   flex: 1 1 0%;
 }
diff --git a/templates/index.html b/templates/index.html
index 06f78bb..0b49f39 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -57,7 +57,7 @@
         </div>
       </nav>
       
-      <div>
+      <div class="container mx-auto max-w-sm">
         <label for="email" class="block text-sm font-medium leading-6 text-gray-900">Email</label>
         <div class="relative mt-2 rounded-md shadow-sm">
           <div class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3">