css: fixed display of span_1,2,3 (again)

css/css.css

@@ -435,6 +435,12 @@ html body div.ui-panel a.unenhanced:active {
   width: 100%;
 }
 /* ============================= content grid ============================= */
+/* everything wrapped in a span as sibling of content goes top! */
+html div.ui-content > .span_1,
+html div.ui-content > .span_2,
+html div.ui-content > .span_3 {
+  vertical-align: top;
+}
 .span_1 {
   width: 96%; /* 2% padding-left/right */
   display: block;
@@ -473,13 +479,23 @@ form .span_2 {
 form .span_3 {
   width: 33%;
 }
+/* mh....*/
+form {
+  max-width: 80%;
+  margin-left: auto;
+  margin-right: auto;
+}
 @media (max-width: 40em) {
+  form {
+    max-width: auto;
+    margin: auto;
+  }
   .span_1, .span_2, .span_3, form .span_1, form .span_2, form .span_3 {
     width: auto; /* 100 does not work... why? */
     display: block;
     padding: .25em 0;
   }
-  .span_1 textarea {
+  .span_2 textarea {
     width: 100%;
   }
 }
@@ -534,9 +550,15 @@ tbody .large {
   padding-bottom: 1em;
   width: 100%;
 }
-.ui-panel .dyno {
+.ui-panel .dyno,
+.ui-content .span_1 .dyno,
+.ui-content .span_2 .dyno,
+.ui-content .span_3 .dyno {
   padding: 0;
 }
+.dyno > div.ui-table-wrapper:first-child {
+  margin: 0;
+}
 
 /* ======================== CUSTOM CSS ===================================*/
 /* green */