receipt/view: Fix image sizing on moble

I wasn't paying attention and added a bunch of CSS rules that only apply
to destkop screen sizes that should apply to all clients.

templates/receipt.html.tera

@@ -1,6 +1,19 @@
 {% extends "base" %} {% block head %}
 <title>Receipt: ${{ amount }} at {{ vendor }}</title>
 <style>
+  .photo {
+    max-width: 100%;
+  }
+
+  .photo img {
+    max-width: 100%;
+  }
+
+  .photo iframe {
+    width: 100%;
+    aspect-ratio: 8.5 / 11;
+  }
+
   @media screen and (min-width: 900px) {
     article {
       display: flex;
@@ -14,15 +27,6 @@
     .photo {
       flex-grow: 1;
     }
-
-    .photo img {
-      max-width: 100%;
-    }
-
-    .photo iframe {
-      width: 100%;
-      aspect-ratio: 8.5 / 11;
-    }
   }
 </style>
 {% endblock %} {% block main %}