css: set form to 100% on desktop, 80% on mobile

css/css.css

@@ -480,15 +480,14 @@ form .span_2 {
 form .span_3 {
   width: 33%;
 }
-/* mh....*/
+/* mh.... no!*/
 form {
-  max-width: 80%;
   margin-left: auto;
   margin-right: auto;
 }
 @media (max-width: 40em) {
   form {
-    max-width: auto;
+    max-width: 80%; /* allow scrolling! */
     margin: auto;
   }
   .span_1, .span_2, .span_3, form .span_1, form .span_2, form .span_3 {
@@ -976,7 +975,7 @@ ul.ui-listview.subscription_selector {
   margin-top: 0.5em;
 }
 ul.ui-listview.subscription_selector li.ui-li-has-thumb {
-  padding-left: 1.25em;
+  padding-left: 5.25em;
 }
 ul.ui-listview.subscription_selector li:first-child {
   border-top-left-radius: .6em;
@@ -1008,7 +1007,28 @@ html body div.ui-collapsible.custom_footer_collapsible div.ui-collapsible-conten
   padding-top: .25em;
   padding-bottom: .25em;
 }
-
+/* pull up the info box under the listview subscription on desktop */
+.custom_advantage {
+  max-width: 40%;
+}
+.custom_advantage p {
+  margin: 0;
+}
+.custom_advantage ~ .span_1 {
+  display: inline-block;
+}
+.custom_form_display .span_2 {
+  float: left;
+}
+@media (max-width: 60em) {
+  .custom_form_display .span_2 {
+    float: none;
+  }
+  html div.ui-page div.ui-content .ui-content-element > .ui-btn,
+  .custom_advantage {
+    max-width: none;
+  }
+}