commit a307e49374856c0d697bb8672f3afd4fe4cb034f
Author: Hans P. Schlaepfer <hanspeter.schlaepfer@revamp-it.ch>
Date:   Wed Jun 26 11:06:34 2019 +0200

    Neues Design 2019 Standard-Code

diff --git a/templates/webpages/oe/check_for_direct_delivery.html b/templates/webpages/oe/check_for_direct_delivery.html
index fb2fa9c74..4562b4b7d 100644
--- a/templates/webpages/oe/check_for_direct_delivery.html
+++ b/templates/webpages/oe/check_for_direct_delivery.html
@@ -1,96 +1,85 @@
-<h1>[% 'Carry over shipping address' | $T8 %]</h1>
-
- <p>[% 'You have entered or selected the following shipping address for this customer:' | $T8 %]</p>
-
- <p>
-  <table>
-   <tr>
-    <th align="right" valign="top">[% 'Name' | $T8 %]:</th>
-    <td valign="top">[% HTML.escape(CFDD_shiptoname) %]</td>
-   </tr>
-
-   <tr>
-    <th align="right" valign="top">[% 'Department' | $T8 %]:</th>
-    <td valign="top">[% HTML.escape(CFDD_shiptodepartment_1) %]</td>
-   </tr>
-
-   <tr>
-    <th align="right" valign="top">&nbsp;</th>
-    <td valign="top">[% HTML.escape(CFDD_shiptodepartment_2) %]</td>
-   </tr>
-
-   <tr>
-    <th align="right" valign="top">[% 'Street' | $T8 %]:</th>
-    <td valign="top">[% HTML.escape(CFDD_shiptostreet) %]</td>
-   </tr>
-
-   <tr>
-    <th align="right" valign="top">[% 'Zipcode' | $T8 %]:</th>
-    <td valign="top">[% HTML.escape(CFDD_shiptozipcode) %]</td>
-   </tr>
-
-   <tr>
-    <th align="right" valign="top">[% 'City' | $T8 %]:</th>
-    <td valign="top">[% HTML.escape(CFDD_shiptocity) %]</td>
-   </tr>
-
-   <tr>
-    <th align="right" valign="top">[% 'Country' | $T8 %]:</th>
-    <td valign="top">[% HTML.escape(CFDD_shiptocountry) %]</td>
-   </tr>
-
-   <tr>
-    <th align="right" valign="top">[% 'GLN' | $T8 %]:</th>
-    <td valign="top">[% HTML.escape(CFDD_shiptogln) %]</td>
-   </tr>
-
-   <tr>
-    <th align="right" valign="top">[% 'Contact' | $T8 %]:</th>
-    <td valign="top">[% HTML.escape(CFDD_shiptocontact) %]</td>
-   </tr>
 [% USE T8 %]
 [% USE HTML %]
 
-   <tr>
-    <th align="right" valign="top">[% 'Phone' | $T8 %]:</th>
-    <td valign="top">[% HTML.escape(CFDD_shiptophone) %]</td>
-   </tr>
-
-   <tr>
-    <th align="right" valign="top">[% 'Fax' | $T8 %]:</th>
-    <td valign="top">[% HTML.escape(CFDD_shiptofax) %]</td>
-   </tr>
-
-   <tr>
-    <th align="right" valign="top">[% 'E-mail' | $T8 %]:</th>
-    <td valign="top">[% HTML.escape(CFDD_shiptoemail) %]</td>
-   </tr>
-
-[% FOREACH var = cvars %]
-   <tr valign="top">
-    <th align="right" nowrap>[% HTML.escape(var.config.description) %]</th>
-    <td>[% HTML.escape(var.value_as_text) %]</td>
-   </tr>
-[% END %]
-  </table>
- </p>
-
-  [% 'Do you want to carry this shipping address over to the new purchase order so that the vendor can deliver the goods directly to your customer?' | $T8 %]
- </p>
-
- <form method="post" action="oe.pl">
-
-  <p>
-   <input type="submit" name="action" value="[% 'Yes' | $T8 %]">&nbsp;
-   <input type="submit" name="action" value="[% 'No' | $T8 %]">
-  </p>
-
-  <input type="hidden" name="yes_nextsub" value="check_for_direct_delivery_yes">
-  <input type="hidden" name="no_nextsub" value="check_for_direct_delivery_no">
-
-  [%- FOREACH row = VARIABLES %]
+<h1>[% 'Carry over shipping address' | $T8 %]</h1>
+<p>[% 'You have entered or selected the following shipping address for this customer:' | $T8 %]</p>
+
+ 
+<table class="tbl-horizontal">
+  <tbody>
+    <tr>
+      <th>[% 'Name' | $T8 %]:</th>
+      <td>[% HTML.escape(CFDD_shiptoname) %]</td>
+    </tr>
+    <tr>
+      <th>[% 'Department' | $T8 %]:</th>
+      <td>[% HTML.escape(CFDD_shiptodepartment_1) %]</td>
+    </tr>
+    <tr>
+      <th>&nbsp;</th>
+      <td>[% HTML.escape(CFDD_shiptodepartment_2) %]</td>
+    </tr>
+    <tr>
+      <th>[% 'Street' | $T8 %]:</th>
+      <td>[% HTML.escape(CFDD_shiptostreet) %]</td>
+    </tr>
+    <tr>
+      <th>[% 'Zipcode' | $T8 %]:</th>
+      <td>[% HTML.escape(CFDD_shiptozipcode) %]</td>
+    </tr>
+    <tr>
+      <th>[% 'City' | $T8 %]:</th>
+      <td>[% HTML.escape(CFDD_shiptocity) %]</td>
+    </tr>
+    <tr>
+      <th>[% 'Country' | $T8 %]:</th>
+      <td>[% HTML.escape(CFDD_shiptocountry) %]</td>
+    </tr>
+    <tr>
+      <th>[% 'GLN' | $T8 %]:</th>
+      <td>[% HTML.escape(CFDD_shiptogln) %]</td>
+    </tr>
+    <tr>
+      <th>[% 'Contact' | $T8 %]:</th>
+      <td>[% HTML.escape(CFDD_shiptocontact) %]</td>
+    </tr>
+    <tr>
+      <th>[% 'Phone' | $T8 %]:</th>
+      <td>[% HTML.escape(CFDD_shiptophone) %]</td>
+    </tr>
+    <tr>
+      <th>[% 'Fax' | $T8 %]:</th>
+      <td>[% HTML.escape(CFDD_shiptofax) %]</td>
+    </tr>
+    <tr>
+      <th>[% 'E-mail' | $T8 %]:</th>
+      <td>[% HTML.escape(CFDD_shiptoemail) %]</td>
+    </tr>
+    [% FOREACH var = cvars %] 
+      <tr>
+        <th>[% HTML.escape(var.config.description) %]</th>
+        <td>[% HTML.escape(var.value_as_text) %]</td>
+      </tr>
+    [% END %] 
+  </tbody>
+</table>
+
+
+<p>[% 'Do you want to carry this shipping address over to the new purchase order so that the vendor can deliver the goods directly to your customer?' | $T8 %]</p>
+
+<form method="post" action="oe.pl">
+
+<p>
+  <input type="submit" name="action" value="[% 'Yes' | $T8 %]">&nbsp;
+  <input type="submit" name="action" value="[% 'No' | $T8 %]">
+</p>
+
+<input type="hidden" name="yes_nextsub" value="check_for_direct_delivery_yes">
+<input type="hidden" name="no_nextsub" value="check_for_direct_delivery_no">
+
+[% FOREACH row = VARIABLES %]
   <input type="hidden" name="[% HTML.escape(row.key) %]" value="[% HTML.escape(row.value) %]">
-  [%- END %]
+[% END %]
 
- </form>
+</form>
 
diff --git a/templates/webpages/oe/edit_periodic_invoices_config.html b/templates/webpages/oe/edit_periodic_invoices_config.html
index 6669e6cc5..5a9c3d46b 100644
--- a/templates/webpages/oe/edit_periodic_invoices_config.html
+++ b/templates/webpages/oe/edit_periodic_invoices_config.html
@@ -3,173 +3,167 @@
 [% USE L %]
 [% SET style="width: 400px" %]
 
-[%- IF !popup_dialog -%]
-<h1>[% title %]</h1>
-[%- END -%]
+[% IF !popup_dialog %]
+  <h1>[% title %]</h1>
+[% END %]
 
- <form name="Form" action="oe.pl" method="post">
+<form name="Form" action="oe.pl" method="post">
 
-  <p>
-   <table border="0">
-    <tr>
-     <th align="right">[% LxERP.t8('Status') %]</th>
-     <td>[% L.checkbox_tag("active", checked => config.active, label => LxERP.t8('Active')) %]</td>
-    </tr>
+<div class="wrapper">
 
+<table class="tbl-horizontal">
+  <caption>[% title %]</caption>
+  <colgroup> <col class="wi-normal"><col class="wi-lightwide"> </colgroup>
+  <tbody>
     <tr>
-     <td>&nbsp;</td>
+     <th>[% LxERP.t8('Status') %]</th>
      <td>
-      [% L.checkbox_tag('terminated', label => LxERP.t8('terminated'), checked => config.terminated) %]
+       [% L.checkbox_tag("active", checked => config.active, label => LxERP.t8('Active')) %]<br>
+       [% L.checkbox_tag('terminated', label => LxERP.t8('terminated'), checked => config.terminated) %]
      </td>
     </tr>
-
     <tr>
-     <th align="right" valign="top">[%- LxERP.t8('Billing Periodicity') %]</th>
-     <td valign="top">
-      [% L.select_tag("periodicity", [ [ "o", LxERP.t8("one time") ], [ "m", LxERP.t8("monthly") ], [ "q", LxERP.t8("every third month") ], [ "b", LxERP.t8("semiannually") ], [ "y", LxERP.t8("yearly") ] ], default=config.periodicity, style=style) %]
+     <th>[% LxERP.t8('Billing Periodicity') %]</th>
+     <td>
+       [% L.select_tag("periodicity", [
+           [ "o", LxERP.t8("one time") ],
+           [ "m", LxERP.t8("monthly") ],
+           [ "q", LxERP.t8("every third month") ],
+           [ "b", LxERP.t8("semiannually") ],
+           [ "y", LxERP.t8("yearly") ]
+         ],
+         default=config.periodicity,
+         style=style) %]
      </td>
     </tr>
-
     <tr>
-     <th align="right" valign="top">[%- LxERP.t8('Order value periodicity') %]</th>
-     <td valign="top">
-      [% L.select_tag("order_value_periodicity",
-                      [ [ "p", LxERP.t8("same as periodicity") ], [ "m", LxERP.t8("monthly") ], [ "q", LxERP.t8("every third month") ], [ "b", LxERP.t8("semiannually") ], [ "y", LxERP.t8("yearly") ],
-                        [ "2", LxERP.t8("2 years") ], [ "3", LxERP.t8("3 years") ], [ "4", LxERP.t8("4 years") ], [ "5", LxERP.t8("5 years") ], ],
-                      default=config.order_value_periodicity, style=style) %]
+     <th>[% LxERP.t8('Order value periodicity') %]</th>
+     <td>
+      [% L.select_tag("order_value_periodicity", [
+            [ "p", LxERP.t8("same as periodicity") ],
+            [ "m", LxERP.t8("monthly") ],
+            [ "q", LxERP.t8("every third month") ],
+            [ "b", LxERP.t8("semiannually") ],
+            [ "y", LxERP.t8("yearly") ],
+            [ "2", LxERP.t8("2 years") ],
+            [ "3", LxERP.t8("3 years") ],
+            [ "4", LxERP.t8("4 years") ],
+            [ "5", LxERP.t8("5 years") ],
+          ],
+          default=config.order_value_periodicity,
+          style=style) %]
      </td>
     </tr>
-
     <tr>
-     <th align="right">[%- LxERP.t8('Start date') %]</th>
-     <td valign="top">
-      [% L.date_tag("start_date_as_date", config.start_date_as_date) %]
-     </td>
+     <th>[% LxERP.t8('Start date') %]</th>
+     <td>[% L.date_tag("start_date_as_date", config.start_date_as_date) %]</td>
     </tr>
-
     <tr>
-     <th align="right">[%- LxERP.t8('End date') %]<sup>(1)</sup></th>
-     <td valign="top">
-      [% L.date_tag("end_date_as_date", config.end_date_as_date) %]
-     </td>
+     <th>[% LxERP.t8('End date') %]<sup>1</sup></th>
+     <td>[% L.date_tag("end_date_as_date", config.end_date_as_date) %]</td>
     </tr>
-
     <tr>
-     <th align="right">[%- LxERP.t8('Create first invoice on') %]<sup>(2)</sup></th>
-     <td valign="top">
-      [% L.date_tag("first_billing_date_as_date", config.first_billing_date_as_date) %]
-     </td>
+     <th>[% LxERP.t8('Create first invoice on') %]<sup>2</sup></th>
+     <td>[% L.date_tag("first_billing_date_as_date", config.first_billing_date_as_date) %]</td>
     </tr>
-
     <tr>
-     <th align="right">[% LxERP.t8('Extend automatically by n months') %]</th>
-     <td valign="top">
+     <th>[% LxERP.t8('Extend automatically by n months') %]</th>
+     <td>
       [% L.input_tag("extend_automatically_by", config.extend_automatically_by, size => 10) %]
      </td>
     </tr>
-
     <tr>
-     <th align="right">[%- LxERP.t8('Record in') %]</th>
-     <td valign="top">
-      [% L.select_tag("ar_chart_id", AR, title_key => 'description', default => config.ar_chart_id, style=style) %]
-     </td>
+     <th>[% LxERP.t8('Record in') %]</th>
+     <td>[% L.select_tag("ar_chart_id", AR, title_key => 'description', default => config.ar_chart_id, style=style) %]</td>
     </tr>
-
     <tr>
-     <th align="right">[%- LxERP.t8('direct debit') %]</th>
-     <td valign="top">[% L.checkbox_tag("direct_debit", checked=config.direct_debit) %]</td>
+     <th>[% LxERP.t8('direct debit') %]</th>
+     <td>[% L.checkbox_tag("direct_debit", checked=config.direct_debit) %]</td>
     </tr>
-
     <tr class="rule-before">
-     <th align="right">[%- LxERP.t8('Print automatically') %]</th>
-     <td valign="top">
+     <th>[% LxERP.t8('Print automatically') %]</th>
+     <td>
       [% L.checkbox_tag("print", onclick => "toggle_printer_id_ctrl()", checked => config.print) %]
      </td>
     </tr>
-
     <tr>
-     <th align="right">[%- LxERP.t8('Printer') %]</th>
-     <td valign="top">
+     <th>[% LxERP.t8('Printer') %]</th>
+     <td>
       [% L.select_tag("printer_id", ALL_PRINTERS, title_key = 'printer_description', default = config.printer_id, disabled = !config.print, id = "pic_printer_id", style=style) %]
      </td>
     </tr>
-
     <tr>
-     <th align="right">[%- LxERP.t8('Copies') %]</th>
-     <td valign="top">[% L.input_tag("copies", config.copies, size => 6, disabled => !config.print, id = "pic_copies") %]</td>
+     <th>[% LxERP.t8('Copies') %]</th>
+     <td>[% L.input_tag("copies", config.copies, size => 6, disabled => !config.print, id = "pic_copies") %]</td>
     </tr>
-
     <tr class="rule-before">
-     <th align="right">[%- LxERP.t8("Send invoice via email") %]</th>
+     <th>[% LxERP.t8("Send invoice via email") %]</th>
      <td>[% L.checkbox_tag("send_email", onclick => "toggle_send_email_ctrl()", checked=config.send_email) %]</td>
     </tr>
     <tr>
-     <th align="right">[%- LxERP.t8("Email of the invoice recipient") %]</th>
+     <th>[%- LxERP.t8("Email of the invoice recipient") %]</th>
      <td>[% email_recipient_invoice_address %]</td>
     </tr>
     <tr>
-     <th align="right">[%- LxERP.t8("Contact to send to") %]</th>
+     <th>[% LxERP.t8("Contact to send to") %]</th>
      <td>[% L.select_tag("email_recipient_contact_id", ALL_CONTACTS, title_key="full_name_dep", value_key="cp_id", default=config.email_recipient_contact_id, with_empty=1, disabled=!config.send_email, style=style) %]</td>
     </tr>
-
     <tr>
-     <th align="right">[%- LxERP.t8("Other recipients") %]<sup>3</sup></th>
+     <th>[% LxERP.t8("Other recipients") %]<sup>3</sup></th>
      <td>[% L.input_tag("email_recipient_address", config.email_recipient_address, disabled=!config.send_email, style=style) %]</td>
     </tr>
-
     <tr>
-     <th align="right">[%- LxERP.t8("Sender") %]<sup>4</sup></th>
+     <th>[% LxERP.t8("Sender") %]<sup>4</sup></th>
      <td>[% L.input_tag("email_sender", config.email_sender, disabled=!config.send_email, style=style) %]</td>
     </tr>
-
     <tr>
-     <th align="right">[%- LxERP.t8("Subject") %]</th>
+     <th>[% LxERP.t8("Subject") %]</th>
      <td>[% L.input_tag("email_subject", config.email_subject, disabled=!config.send_email, style=style) %]</td>
     </tr>
-
     <tr>
-     <th align="right" valign="top">[%- LxERP.t8("Message") %]</th>
-     <td valign="top">[% L.textarea_tag("email_body", config.email_body, disabled=!config.send_email, rows=8, style=style) %]</td>
+     <th>[% LxERP.t8("Message") %]</th>
+     <td>[% L.textarea_tag("email_body", config.email_body, disabled=!config.send_email, rows=8, style=style) %]</td>
     </tr>
-   </table>
-  </p>
-
-  <hr>
+  </tbody>
+</table>
 
-  <p>(1): [%- LxERP.t8('The end date is the last day for which invoices will possibly be created.') %]</p>
-  <p>(2): [% LxERP.t8("If missing then the start date will be used.") %]</p>
-  <p>(3): [% LxERP.t8("Multiple addresses can be entered separated by commas.") %]</p>
-  <p>(4): [% LxERP.t8("If left empty the default sender from the kivitendo configuration will be used (key 'email_from' in section 'periodic_invoices'; current value: #1).", HTML.escape(LXCONFIG.periodic_invoices.email_from)) %]</p>
+</div><!-- /.wrapper -->
 
-  [%- IF popup_dialog -%]
+[% IF popup_dialog %]
+  <div class="buttons">
     [% L.button_tag(popup_js_assign_function, LxERP.t8('Assign')) %]
     [% L.button_tag(popup_js_close_function, LxERP.t8('Cancel')) %]
-
-  [%- ELSE -%]
+  </div>
+[% ELSE %]
+  <div class="buttons">
     [% L.hidden_tag('action', 'save_periodic_invoices_config') %]
-
-    <p>
-     [% L.submit_tag('', LxERP.t8('Assign')) %]
-     [% L.submit_tag('', LxERP.t8('Cancel'), onclick => "self.close(); return false;") %]
-    </p>
-  [%- END -%]
- </form>
-
- <script type="text/javascript">
-  <!--
-    function toggle_printer_id_ctrl() {
-      var disabled = !$('#print').prop('checked');
-      $('#pic_printer_id').prop('disabled', disabled);
-      $('#pic_copies').prop('disabled', disabled);
-    }
-
-    function toggle_send_email_ctrl() {
-      var disabled = !$('#send_email').prop('checked');
-      $('#email_recipient_contact_id').prop('disabled', disabled);
-      $('#email_recipient_address').prop('disabled', disabled);
-      $('#email_sender').prop('disabled', disabled);
-      $('#email_subject').prop('disabled', disabled);
-      $('#email_body').prop('disabled', disabled);
-    }
-    -->
- </script>
+    [% L.submit_tag('', LxERP.t8('Assign')) %]
+    [% L.submit_tag('', LxERP.t8('Cancel'), onclick => "self.close(); return false;") %]
+  </div>
+[% END %]
+
+</form>
+
+<div class="wrapper long-description">
+  <p><sup>1</sup> [% LxERP.t8('The end date is the last day for which invoices will possibly be created.') %]</p>
+  <p><sup>2</sup> [% LxERP.t8("If missing then the start date will be used.") %]</p>
+  <p><sup>3</sup> [% LxERP.t8("Multiple addresses can be entered separated by commas.") %]</p>
+  <p><sup>4</sup> [% LxERP.t8("If left empty the default sender from the kivitendo configuration will be used (key 'email_from' in section 'periodic_invoices'; current value: #1).", HTML.escape(LXCONFIG.periodic_invoices.email_from)) %]</p>
+</div>
+
+<script type="text/javascript"><!--
+  function toggle_printer_id_ctrl() {
+    var disabled = !$('#print').prop('checked');
+    $('#pic_printer_id').prop('disabled', disabled);
+    $('#pic_copies').prop('disabled', disabled);
+  }
+
+  function toggle_send_email_ctrl() {
+    var disabled = !$('#send_email').prop('checked');
+    $('#email_recipient_contact_id').prop('disabled', disabled);
+    $('#email_recipient_address').prop('disabled', disabled);
+    $('#email_sender').prop('disabled', disabled);
+    $('#email_subject').prop('disabled', disabled);
+    $('#email_body').prop('disabled', disabled);
+  }
+--></script>
diff --git a/templates/webpages/oe/form_footer.html b/templates/webpages/oe/form_footer.html
index 7f63b10aa..3a22c5704 100644
--- a/templates/webpages/oe/form_footer.html
+++ b/templates/webpages/oe/form_footer.html
@@ -1,132 +1,89 @@
-[%- IF is_req_quo || is_pur_ord %]
-  [%- SET allow_invoice=1 %]
-[%- ELSIF is_sales_quo && INSTANCE_CONF.get_allow_sales_invoice_from_sales_quotation %]
-  [%- SET allow_invoice=1 %]
-[%- ELSIF is_sales_ord && INSTANCE_CONF.get_allow_sales_invoice_from_sales_order %]
-  [%- SET allow_invoice=1 %]
-[%- ELSE %]
-  [%- SET allow_invoice=0 %]
-[%- END %]
-  <tr>
-    <td>
-      <table width="100%">
-        <tr valign="bottom">
-          <td>
-            <table>
-              <tr>
-                <th align="left">[% 'Notes' | $T8 %]</th>
-                <th align="left">[% 'Internal Notes' | $T8 %]</th>
-              </tr>
-              <tr valign="top">
-                <td>[% L.textarea_tag('notes',    notes,    style="width: 350px; height: 150px", class="texteditor") %]</td>
-                <td>[% L.textarea_tag('intnotes', intnotes, style="width: 350px; height: 150px") %]</td>
-              </tr>
 [% USE T8 %]
 [% USE HTML %]
 [% USE LxERP %]
 [% USE L %]
+[% IF is_req_quo || is_pur_ord %]
+  [% SET allow_invoice=1 %]
+[% ELSIF is_sales_quo && INSTANCE_CONF.get_allow_sales_invoice_from_sales_quotation %]
+  [% SET allow_invoice=1 %]
+[% ELSIF is_sales_ord && INSTANCE_CONF.get_allow_sales_invoice_from_sales_order %]
+  [% SET allow_invoice=1 %]
+[% ELSE %]
+  [% SET allow_invoice=0 %]
+[% END %]
+
+
+<table class="full-width">
+  <colgroup> <col style="width:25%"><col style="width:25%"><col style="width:25%"><col style="width:25%"> </colgroup>
+  <tbody>
+    <tr>
+      <td>
+        [% IF show_weight %]
+          <span class="label">[% 'Total weight' | $T8 %]:</span> [% LxERP.format_amount(totalweight, 3) %] [% HTML.escape(weightunit) %]
+          <input type="hidden" name="marge_total" value="[% HTML.escape(marge_total) %]">
+        [% END %]</td>
+      <td>
+        [% IF is_sales %]
+          <div class="table">
+          <div class="field">
+            <span class="label wi-small">[% 'Ertrag' | $T8 %]:</span> <span class="value">[% LxERP.format_amount(marge_total, 2) %]</span>
+          </div>
+          <div class="field">
+            <span class="label wi-small">[% 'Ertrag prozentual' | $T8 %]:</span> <span class="value">[% LxERP.format_amount(marge_percent, 2) %] %</span>
+          </div>
+          </div>
+          <input type="hidden" name="marge_percent" value="[% HTML.escape(marge_percent) %]">
+        [% END %]
+      </td>
+      <td>
+        [% IF taxaccounts %]
+          <input type="hidden" name="taxincluded_changed_by_user" id="taxincluded_changed_by_user" value="[% taxincluded_changed_by_user ? '1' : '0' %]">
+          <label for="cbck_taxincluded">[% 'Tax Included' | $T8 %]</label>
+          <input type="checkbox" name="taxincluded" id="cbck_taxincluded" onclick="document.getElementById('taxincluded_changed_by_user').value = '1';" value="1"[% IF taxincluded %] checked[% END %]>
+        [% END %]
+      </td>
+      <td class="right">
+        <table class="tbl-list full-width" style="float:left">
+          <tfoot>
+            [% IF NOT taxincluded %]
               <tr>
-                <th align="right">[% 'Payment Terms' | $T8 %]</th>
-                <td>[% L.select_tag('payment_id', ALL_PAYMENTS, default = payment_id, title_key = 'description', with_empty = 1, style="width: 250px") %]</td>
+                <th>[% 'Subtotal' | $T8 %]</th>
+                <td class="numeric">[% LxERP.format_amount(invsubtotal, 2) %]</td>
               </tr>
+            [% END %]
+            [% tax %]
+            [% IF rounding %]
               <tr>
-                <th align="right">[% 'Delivery Terms' | $T8 %]</th>
-                <td>[% L.select_tag('delivery_term_id', ALL_DELIVERY_TERMS, default = delivery_term_id, with_empty = 1, title_key = 'description', style = 'width: 250px') %]</td>
+                <th>[% 'Rounding' | $T8 %]</th>
+                <td class="numeric">[% LxERP.format_amount(rounding, 2) %]</td>
               </tr>
-
-[%- IF is_sales_ord %]
-            <tr>
-             <th align="right">[%- LxERP.t8('Periodic Invoices') %]</th>
-             <td>
-              [% L.button_tag("edit_periodic_invoices_config(); return false;", LxERP.t8('Configure')) %]
-              ([% HTML.escape(periodic_invoices_status) %])
-              [% L.hidden_tag("periodic_invoices_config", periodic_invoices_config) %]
-              <a href="doc/html/ch03.html#features.periodic-invoices.variables" target="_blank">?</a>
-             </td>
-            </tr>
-[%- END %]
-
-      [%- IF id && num_follow_ups %]
-      <tr>
-       <td colspan="2">[% LxERP.t8('There are #1 unfinished follow-ups of which #2 are due.', num_follow_ups, num_due_follow_ups) %]</td>
-      </tr>
-      [%- END %]
-      </table>
-          </td>
-      [%- IF show_weight %]
-          <td>
-            <table>
-            <tr>
-              <th  align="left">[% 'Total weight' | $T8 %]</th>
-              <td align="right">
-                [% LxERP.format_amount(totalweight, 3) %] [% HTML.escape(weightunit) %]
-              </td>
-            </tr>
-            </table>
-          </td>
-      [%- END %]
-[%- IF is_sales %]
-          <td>
-            <table>
-
-            <tr>
-              <th  align="left">[% 'Ertrag' | $T8 %]</th>
-              <td align="right">
-                [% LxERP.format_amount(marge_total, 2) %]
-                <input type="hidden" name="marge_total" value="[% HTML.escape(marge_total) %]">
-              </td>
-            </tr>
+            [% END %]
             <tr>
-              <th  align="left">[% 'Ertrag prozentual' | $T8 %]</th>
-              <td align="right">
-                [% LxERP.format_amount(marge_percent, 2) %]
-                <input type="hidden" name="marge_percent" value="[% HTML.escape(marge_percent) %]">
+              <th>[% 'Total' | $T8 %]</th>
+              <td class="numeric">
+                [% LxERP.format_amount(invtotal, 2) %]
+                <input type="hidden" name="oldinvtotal" value="[% HTML.escape(oldinvtotal) %]">
+                <input type="hidden" name="oldtotalpaid" value="[% HTML.escape(totalpaid) %]">
               </td>
-              <td>%</td>
             </tr>
-            </table>
-          </td>
-[%- END %]
-          <td align="right">
-
-[%- IF taxaccounts %]
-            <input type="hidden" name="taxincluded_changed_by_user" id="taxincluded_changed_by_user" value="[% taxincluded_changed_by_user ? '1' : '0' %]">
-            <input name="taxincluded" class="checkbox" onclick="document.getElementById('taxincluded_changed_by_user').value = '1';" type="checkbox" value="1"[% IF taxincluded %] checked[% END %]><b>[% 'Tax Included' | $T8 %]</b><br><br>
-[%- END %]
-            <table>
-[%- IF NOT taxincluded %]
-              <tr>
-                <th align='right'>[% 'Subtotal' | $T8 %]</th>
-                <td align='right'>[% LxERP.format_amount(invsubtotal, 2) %]</td>
-              </tr>
-[%- END %]
-              [% tax %]
-[%- IF rounding %]
-              <tr>
-                <th align='right'>[% 'Rounding' | $T8 %]</th>
-                <td align='right'>[% LxERP.format_amount(rounding, 2) %]</td>
-              </tr>
-[%- END %]
-              <tr>
-                <th align="right">[% 'Total' | $T8 %]</th>
-                <td align="right">[% LxERP.format_amount(invtotal, 2) %]
-                  <input type="hidden" name="oldinvtotal" value="[% HTML.escape(oldinvtotal) %]">
-                  <input type="hidden" name="oldtotalpaid" value="[% HTML.escape(totalpaid) %]">
-                </td>
-              </tr>
-            </table>
-          </td>
-        </tr>
-      </table>
-    </td>
-  </tr>
+          </tfoot>
+        </table>
+      </td>
+    </tr>
+  </tbody>
 </table>
 
-</div>
-[%- PROCESS 'webdav/_list.html' %]
+</div><!-- .ui-tabs-panel  -->
+
+
+
+
+[% PROCESS 'webdav/_list.html' %]
 <div id="ui-tabs-1">
- [%- LxERP.t8("Loading...") %]
+ [% LxERP.t8("Loading...") %]
 </div>
+
+
 </div>
 
 <input type="hidden" name="saved_xyznumber" value="[% HTML.escape(saved_xyznumber) %]">
@@ -147,9 +104,11 @@
 <div id="print_options" class="hidden">
  [% print_options %]
 </div>
-</form>
+
 
 <div id="shipto_dialog" class="hidden"></div>
 <div id="print_dialog" class="hidden">
- [%- PROCESS 'common/_print_dialog.html' %]
+ [% PROCESS 'common/_print_dialog.html' %]
 </div>
+
+</form>
diff --git a/templates/webpages/oe/form_header.html b/templates/webpages/oe/form_header.html
index f2f81f051..607259ba5 100644
--- a/templates/webpages/oe/form_header.html
+++ b/templates/webpages/oe/form_header.html
@@ -4,261 +4,305 @@
 [% USE L %]
 [% USE P %]
 
-  <form method="post" id='form' name="oe" action="[% script %]"
-        data-transport-cost-reminder-article-id="[% HTML.escape(transport_cost_reminder_article.id) %]"
-        data-transport-cost-reminder-article-description="[% HTML.escape(transport_cost_reminder_article.displayable_name) %]"
-        >
+<h1>[% title %]</h1>
 
-    <script type="text/javascript" src="js/delivery_customer_selection.js"></script>
-    <script type="text/javascript" src="js/calculate_qty.js"></script>
-    <script type="text/javascript" src="js/follow_up.js"></script>
-    [%- IF is_sales_ord %]
-     [% L.javascript_tag("js/edit_periodic_invoices_config") %]
-    [%- END %]
+<form method="post" id='form' name="oe" action="[% script %]" data-transport-cost-reminder-article-id="[% HTML.escape(transport_cost_reminder_article.id) %]" data-transport-cost-reminder-article-description="[% HTML.escape(transport_cost_reminder_article.displayable_name) %]">
 
-[%- FOREACH row = HIDDENS %]
-   <input type="hidden" name="[% HTML.escape(row.name) %]" id="[% HTML.escape(row.name) %]" value="[% HTML.escape(row.value) %]" >
-[%- END %]
+<script type="text/javascript" src="js/delivery_customer_selection.js"></script>
+<script type="text/javascript" src="js/calculate_qty.js"></script>
+<script type="text/javascript" src="js/follow_up.js"></script>
+[% IF is_sales_ord %]
+  [% L.javascript_tag("js/edit_periodic_invoices_config") %]
+[% END %]
 
-    <input type="hidden" name="convert_from_oe_ids" value="[% HTML.escape(convert_from_oe_ids) %]">
+[% FOREACH row = HIDDENS %]
+  <input type="hidden" name="[% HTML.escape(row.name) %]" id="[% HTML.escape(row.name) %]" value="[% HTML.escape(row.value) %]" >
+[% END %]
 
-    <input type="hidden" name="follow_up_trans_id_1" value="[% HTML.escape(id) %]">
-    <input type="hidden" name="follow_up_trans_type_1" value="[% HTML.escape(type) %]">
-    <input type="hidden" name="follow_up_trans_info_1" value="[% HTML.escape(follow_up_trans_info) %]">
-    <input type="hidden" name="follow_up_rowcount" value="1">
-    <input type="hidden" name="lastmtime" value="[% HTML.escape(lastmtime) %]">
+<input type="hidden" name="convert_from_oe_ids" value="[% HTML.escape(convert_from_oe_ids) %]">
+<input type="hidden" name="follow_up_trans_id_1" value="[% HTML.escape(id) %]">
+<input type="hidden" name="follow_up_trans_type_1" value="[% HTML.escape(type) %]">
+<input type="hidden" name="follow_up_trans_info_1" value="[% HTML.escape(follow_up_trans_info) %]">
+<input type="hidden" name="follow_up_rowcount" value="1">
+<input type="hidden" name="lastmtime" value="[% HTML.escape(lastmtime) %]">
 
-    <h1>[% title %]</h1>
+[% INCLUDE 'common/flash.html' %]
+[% INCLUDE 'generic/set_longdescription.html' %]
 
-[%- INCLUDE 'common/flash.html' %]
-[%- INCLUDE 'generic/set_longdescription.html' %]
+<div id="oe_tabs" class="tabwidget">
 
-    <div id="oe_tabs" class="tabwidget">
-     <ul>
-      <li><a href="#ui-tabs-basic-data">[% 'Basic Data' | $T8 %]</a></li>
-[%- IF INSTANCE_CONF.get_webdav %]
-      <li><a href="#ui-tabs-webdav">[% 'WebDAV' | $T8 %]</a></li>
-[%- END %]
-[%- IF id AND INSTANCE_CONF.get_doc_storage %]
-      <li><a href="controller.pl?action=File/list&file_type=document&object_type=[% HTML.escape(type) %]&object_id=[% HTML.url(id) %]">[% 'Documents' | $T8 %]</a></li>
-      <li><a href="controller.pl?action=File/list&file_type=attachment&object_type=[% HTML.escape(type) %]&object_id=[% HTML.url(id) %]">[% 'Attachments' | $T8 %]</a></li>
-[%- END %]
-[%- IF id AND AUTH.assert('record_links', 1) %]
-      <li><a href="controller.pl?action=RecordLinks/ajax_list&object_model=Order&object_id=[% HTML.url(id) %]">[% 'Linked Records' | $T8 %]</a></li>
-[%- END %]
-     </ul>
+<ul>
+  <li><a href="#ui-tabs-basic-data">[% 'Basic Data' | $T8 %]</a></li>
+  [% IF INSTANCE_CONF.get_webdav %]
+    <li><a href="#ui-tabs-webdav">[% 'WebDAV' | $T8 %]</a></li>
+  [% END %]
+  [% IF id AND INSTANCE_CONF.get_doc_storage %]
+    <li><a href="controller.pl?action=File/list&file_type=document&object_type=[% HTML.escape(type) %]&object_id=[% HTML.url(id) %]">[% 'Documents' | $T8 %]</a></li>
+    <li><a href="controller.pl?action=File/list&file_type=attachment&object_type=[% HTML.escape(type) %]&object_id=[% HTML.url(id) %]">[% 'Attachments' | $T8 %]</a></li>
+  [% END %]
+  [% IF id AND AUTH.assert('record_links', 1) %]
+    <li><a href="controller.pl?action=RecordLinks/ajax_list&object_model=Order&object_id=[% HTML.url(id) %]">[% 'Linked Records' | $T8 %]</a></li>
+  [% END %]
+</ul>
 
-     <div id="ui-tabs-basic-data">
 
-    <table width="100%">
+
+<div id="ui-tabs-basic-data">
+
+<div class="wrapper" id="wrapper-1">
+  [% INCLUDE 'generic/toggle_wrapper.html' %]
+
+  <table class="tbl-horizontal">
+    <caption>[% IF vc == 'customer' %][% 'Customer' | $T8 %][% ELSE %][% 'Vendor' | $T8 %][% END %] & [% 'Quotation' | $T8 %]</caption>
+    <colgroup><col class="wi-mediumsmall"><col class="wi-lightwide"></colgroup>
+    <tbody>
+      <tr>
+        <th>[% IF vc == 'customer' %][% 'Customer' | $T8 %][% ELSE %][% 'Vendor' | $T8 %][% END %]</th>
+        <td class="wi-lightwide">
+          [% SET vc_id = vc _ "_id" %]
+          [% P.customer_vendor.picker(vc_id, $vc_id, type=vc, class="initial_focus wi-lightwide", onchange="\$('#update_button').click()") %]
+          [% #P.button_tag("show_vc_details('" _ HTML.escape(vc) _  "')", LxERP.t8("Details (one letter abbreviation)"), class="neutral wi-tiny") %]
+          <a href="javascript:show_vc_details('[% HTML.escape(vc) %]');" title="[% 'Show detail informationen' | $T8 %]" class="button-image info"><img src="image/detail.png"></a>
+          [% P.hidden_tag("previous_" _ vc_id, $vc_id) %]
+        </td>
+      </tr>
+      [% IF ALL_CONTACTS.size %]
+        <tr>
+          <th>[% 'Contact Person' | $T8 %]</th>
+          <td>[% L.select_tag('cp_id', ALL_CONTACTS, default=cp_id, value_key='cp_id', title_key='full_name_dep', with_empty=1, class='wi-lightwide') %]</td>
+        </tr>
+      [% END %]
+    <tr>
+      <th>[% 'Shipping Address' | $T8 %]</th>
+      <td>
+        [% IF ALL_SHIPTO.size %]
+          [% shiptos = [ [ "", LxERP.t8("No/individual shipping address") ] ] ; L.select_tag('shipto_id', shiptos.import(ALL_SHIPTO), default=shipto_id, value_key='shipto_id', title_key='displayable_id', class='wi-lightwide') %]
+        [% END %]
+        [% L.button_tag("kivi.SalesPurchase.edit_custom_shipto()", LxERP.t8("Custom shipto"), class="inline below wi-lightwide neutral") %]
+      </td>
+    </tr>
+    [% IF business %]
       <tr>
+        <th>[% business_label %]</th>
+        <td><span class="data wi-lightwide">[% HTML.escape(business) %], [% 'Trade Discount' | $T8 %] [% LxERP.format_percent(tradediscount) %] %</span></td>
+      </tr>
+    [% END %]
+    [% IF is_order %]
+      <tr>
+        <th>[% 'Credit Limit' | $T8 %]</th>
+        <td><span class="data wi-lightwide">[% LxERP.format_amount(creditlimit, 0) %], [% 'Remaining' | $T8 %] <span class="plus[% is_credit_remaining_negativ %]">[% LxERP.format_amount( creditremaining, 0 ) %]</span></span></td>
+      </tr>
+    [% END %]
+    [% IF max_dunning_level %]
+      <tr>
+        <th>[% 'Max. Dunning Level' | $T8 %]:</th>
         <td>
-          <table width="100%">
-            <tr valign="top">
-              <td width="50%">
-                <table width="100%">
-                  <tr>
-                    <th align="right">[% IF vc == 'customer' %][% 'Customer' | $T8 %][% ELSE %][% 'Vendor' | $T8 %][% END %]</th>
-                    <td>
-                     [%- SET vc_id = vc _ "_id" %]
-                     [% P.customer_vendor.picker(vc_id, $vc_id, type=vc, style="width: 250px", class="initial_focus", onchange="\$('#update_button').click()") %]
-                     [% P.button_tag("show_vc_details('" _ HTML.escape(vc) _  "')", LxERP.t8("Details (one letter abbreviation)")) %]
-                     [% P.hidden_tag("previous_" _ vc_id, $vc_id) %]
-                    </td>
-                  </tr>
-[%- IF ALL_CONTACTS.size %]
-                  <tr>
-                    <th align="right">[% 'Contact Person' | $T8 %]</th>
-                    <td>
-                      [% L.select_tag('cp_id', ALL_CONTACTS, default=cp_id, value_key='cp_id', title_key='full_name_dep', with_empty=1, style='width: 250px') %]
-                    </td>
-                  </tr>
-[%- END %]
-                  <tr>
-                    <th align="right">[% 'Shipping Address' | $T8 %]</th>
-                    <td>
-[%- IF ALL_SHIPTO.size %]
-                      [% shiptos = [ [ "", LxERP.t8("No/individual shipping address") ] ] ;
-                         L.select_tag('shipto_id', shiptos.import(ALL_SHIPTO), default=shipto_id, value_key='shipto_id', title_key='displayable_id', style='width: 250px') %]
-[%- END %]
-                      [% L.button_tag("kivi.SalesPurchase.edit_custom_shipto()", LxERP.t8("Custom shipto")) %]
-                    </td>
-                  </tr>
-[%- IF is_order %]
-                  <tr>
-                    <td align="right">[% 'Credit Limit' | $T8 %]</td>
-                    <td>[% LxERP.format_amount(creditlimit, 0) %]; [% 'Remaining' | $T8 %] <span class="plus[% is_credit_remaining_negativ %]">[% LxERP.format_amount(creditremaining, 0) %]</span></td>
-                  </tr>
-[%- END %]
-[%- IF business %]
-                  <tr>
-                    <th align="right">[% business_label %]</th>
-                    <td>[% HTML.escape(business) %]; [% 'Trade Discount' | $T8 %] [% LxERP.format_percent(tradediscount) %] %</td>
-                  </tr>
-[%- END %]
-[%- IF max_dunning_level %]
-                  <tr>
-                    <th align="right">[% 'Max. Dunning Level' | $T8 %]:</th>
-                    <td>
-                      <b>[% HTML.escape(max_dunning_level) %]</b>;
-                      [% 'Dunning Amount' | $T8 %]: <b>[% LxERP.format_amount(dunning_amount, 2) %]</b>
-                    </td>
-                  </tr>
-[%- END %]
-                  <tr>
-                    <th align="right">[% 'Steuersatz' | $T8 %]</th>
-                    <td>
-                      [% L.select_tag('taxzone_id', ( id ? ALL_TAXZONES : ALL_ACTIVE_TAXZONES), default=taxzone_id, title_key='description', style='width: 250px') %]
-                    </td>
-                  </tr>
-[%- IF ALL_DEPARTMENTS.size %]
-                  <tr>
-                    <th align="right" nowrap>[% 'Department' | $T8 %]</th>
-                    <td colspan="3">
-                      [% L.select_tag('department_id', ALL_DEPARTMENTS, default=department_id, title_key = 'description', with_empty=1, style='width:250px') %]
-                    </td>
-                  </tr>
-[%- END %]
-                  <tr>
-                    <th align="right">[% 'Currency' | $T8 %]</th>
-                    <td>[% L.select_tag("currency", ALL_CURRENCIES, value_key="name", default=currency, onchange="document.getElementById('update_button').click();") %]</td>
-                  </tr>
-[%- IF show_exchangerate %]
-                  <tr>
-                    <th align="right">[% 'Exchangerate' | $T8 %]</th>
-                    <td>
-                     [%- IF forex %]
-                      [% LxERP.format_amount(exchangerate, 5) %]
-                     [%- ELSE %]
-                      <input name="exchangerate" size="10" value="[% HTML.escape(LxERP.format_amount(exchangerate)) %]">
-                     [%- END %]
-                    </td>
-                  </tr>
-[%- END %]
-                  <tr>
-                    <th align="right">[% 'Shipping Point' | $T8 %]</th>
-                    <td colspan="3"><input name="shippingpoint" size="35" value="[% HTML.escape(shippingpoint) %]"></td>
-                  </tr>
-                  <tr>
-                    <th align="right">[% 'Ship via' | $T8 %]</th>
-                    <td colspan="3"><input name="shipvia" size="35" value="[% HTML.escape(shipvia) %]"></td>
-                  </tr>
-                  <tr>
-                    <th align="right">[% 'Transaction description' | $T8 %]</th>
-                    <td colspan="3">[% L.input_tag("transaction_description", transaction_description, size=35, "data-validate"=INSTANCE_CONF.get_require_transaction_description_ps ? 'required' : '') %]</td>
-                  </tr>
-[%- IF show_delivery_customer %]
-                  <tr>
-                    <td colspan="4">
-                      <table>
-                        <tr>
-                          <td colspan="2">
-                          <button type="button" onclick="delivery_customer_selection_window('delivery_customer_string','delivery_customer_id')">[% 'Choose Customer' | $T8 %]</button>
-                        </td>
-                          <td colspan="2"><input type="hidden" name="delivery_customer_id" value="[% HTML.escape(delivery_customer_id) %]">
-                          <input size="45" id="delivery_customer_string" name="delivery_customer_string" value="[% HTML.escape(delivery_customer_string) %]"></td>
-                        </tr>
-                        <tr>
-                          <td colspan="2">
-                            <button type="button" onclick="vendor_selection_window('delivery_vendor_string','delivery_vendor_id')">[% 'Choose Vendor' | $T8 %]</button>
-                          </td>
-                          <td colspan="2"><input type="hidden" name="delivery_vendor_id" value="[% HTML.escape(delivery_vendor_id) %]">
-                          <input size="45" id="vendor_string" name="delivery_vendor_string" value="[% HTML.escape(delivery_vendor_string) %]"></td>
-                        </tr>
-                      </table>
-                    </td>
-                  </tr>
-[%- END %]
-                </table>
+          <b>[% HTML.escape(max_dunning_level) %]</b>;
+          [% 'Dunning Amount' | $T8 %]: <b>[% LxERP.format_amount(dunning_amount, 2) %]</b>
+        </td>
+      </tr>
+    [% END %]
+    <tr>
+      <th>[% 'Steuersatz' | $T8 %]</th>
+      <td>[% L.select_tag('taxzone_id', ( id ? ALL_TAXZONES : ALL_ACTIVE_TAXZONES), default=taxzone_id, title_key='description', class='wi-lightwide') %]</td>
+    </tr>
+    [% IF ALL_DEPARTMENTS.size %]
+      <tr>
+        <th>[% 'Department' | $T8 %]</th>
+        <td>[% L.select_tag('department_id', ALL_DEPARTMENTS, default=department_id, title_key = 'description', with_empty=1, class='wi-lightwide') %]</td>
+      </tr>
+    [% END %]
+    <tr>
+      <th>[% 'Currency' | $T8 %]</th>
+      <td>[% L.select_tag("currency", ALL_CURRENCIES, value_key="name", default=currency, onchange="document.getElementById('update_button').click();", class='wi-lightwide') %]</td>
+    </tr>
+    [% IF show_exchangerate %]
+      <tr>
+        <th>[% 'Exchangerate' | $T8 %]</th>
+        <td>
+          [% IF forex %]
+            [% LxERP.format_amount(exchangerate, 5) %]
+          [% ELSE %]
+            <input type="text" name="exchangerate" class="wi-small" value="[% HTML.escape(LxERP.format_amount(exchangerate)) %]">
+          [% END %]
+        </td>
+      </tr>
+    [% END %]
+    <tr>
+      <th>[% 'Shipping Point' | $T8 %]</th>
+      <td><input type="text" name="shippingpoint" class="wi-lightwide" value="[% HTML.escape(shippingpoint) %]"></td>
+    </tr>
+    <tr>
+      <th>[% 'Ship via' | $T8 %]</th>
+      <td><input type="text" name="shipvia" class="wi-lightwide" value="[% HTML.escape(shipvia) %]"></td>
+    </tr>
+    <tr>
+      <th>[% 'Transaction description' | $T8 %]</th>
+      <td>[% L.input_tag("transaction_description", transaction_description, class="wi-lightwide", "data-validate"=INSTANCE_CONF.get_require_transaction_description_ps ? 'required' : '') %]</td>
+    </tr>
+    [% IF show_delivery_customer %]
+      <tr>
+        <td colspan="2">
+          <table>
+            <tr>
+              <td>
+                <button type="button" onclick="delivery_customer_selection_window('delivery_customer_string','delivery_customer_id')">
+                  [% 'Choose Customer' | $T8 %]
+                </button>
               </td>
-              <td align="right">
-                <table>
-              [% openclosed %]
-                  <tr>
-                    <th align="right">[% 'Employee' | $T8 %]</th>
-                    <td>
-                      [% L.select_tag('employee_id', ALL_EMPLOYEES, default=employee_id, title_key='safe_name') %]
-                    </td>
-                  </tr>
-[%- IF is_sales and ALL_SALESMEN.size %]
-                  <tr>
-                    <th align="right">[% 'Salesman' | $T8 %]</th>
-                    <td>
-                      [% L.select_tag('salesman_id', ALL_SALESMEN, default=(salesman_id ? salesman_id : employee_id), title_key='safe_name') %]
-                    </td>
-                  </tr>
-[%- END %]
-[%- IF is_order %]
-                  <tr>
-                    <th width="70%" align="right" nowrap>[% 'Order Number' | $T8 %]</th>
-                    <td><input name="ordnumber" id="ordnumber" size="11" value="[% HTML.escape(ordnumber) %]"></td>
-                  </tr>
-[%- END %]
-                  <tr>
-                    <th width="70%" align="right" nowrap>[% IF is_req_quo %][% 'RFQ Number' | $T8 %][% ELSE %][% 'Quotation Number' | $T8 %][% END %]</th>
-                    <td><input name="quonumber" id="quonumber" size="11" value="[% HTML.escape(quonumber) %]"></td>
-                  </tr>
-[%- IF is_order %]
-                  <tr>
-                    <th width="70%" align="right" nowrap>[% 'Customer Order Number' | $T8 %]</th>
-                    <td><input name="cusordnumber" id="cusordnumber" size="11" value="[% HTML.escape(cusordnumber) %]"></td>
-                  </tr>
-[%- END %]
-                  <tr>
-                    <th align="right" nowrap>
-                     [%- IF is_order %]
-                      [% 'Order Date' | $T8 %]
-                     [%- ELSIF is_req_quo %]
-                      [% 'RFQ Date' | $T8 %]
-                     [%- ELSE %]
-                      [% 'Quotation Date' | $T8 %]
-                     [%- END %]
-                    </th>
-                    <td nowrap>
-                      [% L.date_tag('transdate', transdate, id='transdate') %]
-                    </td>
-                  </tr>
-                  <tr>
-                    <th align="right" nowrap>
-                     [%- IF is_sales_quo %]
-                      [% 'Valid until' | $T8 %]
-                     [%- ELSE %]
-                      [% 'Reqdate' | $T8 %]
-                     [%- END %]
-                    </th>
-                    <td nowrap>
-                      [% L.date_tag('reqdate', reqdate, id='reqdate') %]
-                    </td>
-                  </tr>
-                  [%- IF is_sales_ord %]
-                  <tr>
-                    <th align="right" nowrap>[% 'Insert Date' | $T8 %]</th>
-                    <td>[% oe_obj.itime_as_date %]</td>
-                  </tr>
-                  [%- END %]
-                  <tr>
-                    <th width="70%" align="right" nowrap>[% 'Project Number' | $T8 %]</th>
-                    <td>
-                      [%- L.select_tag('globalproject_id', ALL_PROJECTS, title_key='projectnumber', default=globalproject_id, with_empty='1', onChange="document.getElementById('update_button').click();") %]
-                    </td>
-                  </tr>
-[%- IF type == 'sales_quotation' %]
-                  <tr>
-                    <th width="70%" align="right" nowrap>[% 'Order probability' | $T8 %]</th>
-                    <td nowrap>
-                      [%- L.select_tag('order_probability', ORDER_PROBABILITIES, title='title', default=order_probability) %]%
-                    </td>
-                  </tr>
-                  <tr>
-                    <th width="70%" align="right" nowrap>[% 'Expected billing date' | $T8 %]</th>
-                    <td nowrap>
-                      [%- L.date_tag('expected_billing_date', expected_billing_date) %]
-                    </td>
-                  </tr>
-[%- END %]
-                </table>
+              <td>
+                <input type="hidden" name="delivery_customer_id" value="[% HTML.escape(delivery_customer_id) %]">
+                <input type="text" class="wi-lightwide" id="delivery_customer_string" name="delivery_customer_string" value="[% HTML.escape(delivery_customer_string) %]">
+              </td>
+            </tr>
+            <tr>
+              <td>
+                <button type="button" onclick="vendor_selection_window('delivery_vendor_string','delivery_vendor_id')">[% 'Choose Vendor' | $T8 %]</button>
+              </td>
+              <td>
+                <input type="hidden" name="delivery_vendor_id" value="[% HTML.escape(delivery_vendor_id) %]">
+                <input type="text" class="wi-lightwide" id="vendor_string" name="delivery_vendor_string" value="[% HTML.escape(delivery_vendor_string) %]">
               </td>
             </tr>
           </table>
         </td>
       </tr>
+    [% END %]
+    [% IF is_sales_ord %]
+      <tr>
+      <th>[% LxERP.t8('Periodic Invoices') %]</th>
+      <td>
+        <span class="data  wi-lightwide">[% HTML.escape(periodic_invoices_status) %]</span>
+        <span class="button-inline">
+          [% L.button_tag("edit_periodic_invoices_config(); return false;", LxERP.t8('Configure'), class='neutral') %]
+          <a href="doc/html/ch03.html#features.periodic-invoices.variables" target="_blank" class="button neutral wi-tiny">?</a>
+          [% L.hidden_tag("periodic_invoices_config", periodic_invoices_config) %]
+        </span>
+      </td>
+    </tr>
+    [% END %]
+    <tr>
+      <th class="wi-mediumsmall-lightwide" colspan="2">
+        <span class="label above">[% 'Internal Notes' | $T8 %]</span>
+        [% L.textarea_tag('intnotes', intnotes, style="width: 350px; height: 150px") %]
+      </th>
+    </tr>
+  </tbody>
+  </table>
+
+  <table class="tbl-horizontal">
+  <caption>[% 'Conditions' | $T8 %]</caption>
+  <colgroup> <col class="wi-wide"> </colgroup>
+  <tbody>
+    <tr>
+      <th class="single-col">
+        <span class="label above">[% 'Payment Terms' | $T8 %]</span>
+        [% L.select_tag('payment_id', ALL_PAYMENTS, default=payment_id, title_key='description', with_empty=1, class='wi-wide') %]
+      </th>
+    </tr>
+    <tr>
+      <th class="single-col">
+        <span class="label above">[% 'Delivery Terms' | $T8 %]</span>
+        [% L.select_tag('delivery_term_id', ALL_DELIVERY_TERMS, default=delivery_term_id, with_empty=1, title_key='description', class='wi-wide') %]
+      </th>
+    </tr>
+    <tr>
+      <th class="caption">[% 'Notes' | $T8 %]</th>
+    </tr>
+    <tr>
+      <th class="wi-wide">
+        <span class="wi-wide">
+          [% L.textarea_tag('notes',    notes,    style="width: 350px; height: 150px", class="texteditor") %]
+        </span>
+      </th>
+    </tr>
+    [% IF id && num_follow_ups %]
+      <tr>
+        <td>[% LxERP.t8('There are #1 unfinished follow-ups of which #2 are due.', num_follow_ups, num_due_follow_ups) %]</td>
+      </tr>
+    [% END %]
+  </tbody>
+  </table>
+
+  <table class="tbl-horizontal">
+    <caption>[% 'Handling' | $T8 %]</caption>
+    <colgroup> <col class="wi-mediumsmall"><col class="wi-normal"> </colgroup>
+    <tbody>
+      [% openclosed %]
+      <tr>
+        <th>[% 'Employee' | $T8 %]</th>
+        <td>
+          [% L.select_tag('employee_id', ALL_EMPLOYEES, default=employee_id, title_key='safe_name', class='wi-normal') %]
+        </td>
+      </tr>
+      [% IF is_sales and ALL_SALESMEN.size %]
+        <tr>
+          <th>[% 'Salesman' | $T8 %]</th>
+          <td>
+            [% L.select_tag('salesman_id', ALL_SALESMEN, default=(salesman_id ? salesman_id : employee_id), title_key='safe_name', class='wi-normal') %]
+          </td>
+        </tr>
+      [% END %]
+      [% IF is_order %]
+        <tr>
+          <th>[% 'Order Number' | $T8 %]</th>
+          <td><input type="text" name="ordnumber" id="ordnumber" size="11" value="[% HTML.escape(ordnumber) %]" class="wi-small"></td>
+        </tr>
+      [% END %]
+      <tr>
+        <th>[% IF is_req_quo %][% 'RFQ Number' | $T8 %][% ELSE %][% 'Quotation Number' | $T8 %][% END %]</th>
+        <td><input type="text" name="quonumber" id="quonumber" size="11" value="[% HTML.escape(quonumber) %]" class="wi-small"></td>
+      </tr>
+      [% IF is_order %]
+        <tr>
+          <th>[% 'Customer Order Number' | $T8 %]</th>
+          <td><input type="text" name="cusordnumber" id="cusordnumber" size="11" value="[% HTML.escape(cusordnumber) %]" class="wi-small"></td>
+        </tr>
+      [% END %]
+      <tr>
+        <th>
+         [% IF is_order %]
+          [% 'Order Date' | $T8 %]
+         [% ELSIF is_req_quo %]
+          [% 'RFQ Date' | $T8 %]
+         [% ELSE %]
+          [% 'Quotation Date' | $T8 %]
+         [% END %]
+        </th>
+        <td>[% L.date_tag('transdate', transdate, id='transdate', class='wi-date') %]</td>
+      </tr>
+      <tr>
+        <th>
+          [% IF is_sales_quo %]
+            [% 'Valid until' | $T8 %]
+          [% ELSE %]
+            [% 'Reqdate' | $T8 %]
+          [% END %]
+        </th>
+        <td>[% L.date_tag('reqdate', reqdate, id='reqdate', class='wi-date') %]</td>
+      </tr>
+      [% IF is_sales_ord %]
+        <tr>
+          <th>[% 'Insert Date' | $T8 %]</th>
+          <td class="wi-date">[% oe_obj.itime_as_date %]</td>
+        </tr>
+      [% END %]
+      <tr>
+        <th>[% 'Project Number' | $T8 %]</th>
+        <td>[% L.select_tag('globalproject_id', ALL_PROJECTS, title_key='projectnumber', default=globalproject_id, with_empty='1', onChange="document.getElementById('update_button').click();", class='wi-normal') %]</td>
+      </tr>
+      [% IF type == 'sales_quotation' %]
+        <tr>
+          <th>[% 'Order probability' | $T8 %]</th>
+          <td>[% L.select_tag('order_probability', ORDER_PROBABILITIES, title='title', default=order_probability, class='wi-small') %]%</td>
+        </tr>
+        <tr>
+          <th>[% 'Expected billing date' | $T8 %]</th>
+          <td>[% L.date_tag('expected_billing_date', expected_billing_date, class='wi-date') %]</td>
+        </tr>
+      [% END %]
+    </tbody>
+  </table>
+
+
+</div><!-- /.wrapper -->
diff --git a/templates/webpages/oe/orders_bottom.html b/templates/webpages/oe/orders_bottom.html
index 96ef86f66..8ef81cd1f 100644
--- a/templates/webpages/oe/orders_bottom.html
+++ b/templates/webpages/oe/orders_bottom.html
@@ -1,7 +1,8 @@
 [% USE T8 %]
 [% USE HTML %]
- <input type="hidden" name="type" value="[% HTML.escape(type) %]">
- <input type="hidden" name="vc" value="[% HTML.escape(vc) %]">
- <input type="hidden" name="callback" value="[% HTML.escape(callback) %]">
- <input type="hidden" name="rowcount" value="[% HTML.escape(rowcount) %]">
-</form>
+
+<input type="hidden" name="type" value="[% HTML.escape(type) %]">
+<input type="hidden" name="vc" value="[% HTML.escape(vc) %]">
+<input type="hidden" name="callback" value="[% HTML.escape(callback) %]">
+<input type="hidden" name="rowcount" value="[% HTML.escape(rowcount) %]">
+
diff --git a/templates/webpages/oe/price_sources_dialog.html b/templates/webpages/oe/price_sources_dialog.html
index 46ead27a9..0238d6c0c 100644
--- a/templates/webpages/oe/price_sources_dialog.html
+++ b/templates/webpages/oe/price_sources_dialog.html
@@ -4,86 +4,106 @@
 [% USE LxERP %]
 [% SET best_price = price_source.best_price %]
 [% SET best_discount = price_source.best_discount %]
-  <h2>[% 'Prices' | $T8 %]</h2>
 
-  <table>
-   <tr class='listheading'>
-    <th></th>
-    <th>[% 'Price Source' | $T8 %]</th>
-    <th>[% 'Price' | $T8 %]</th>
-    <th>[% 'Best Price' | $T8 %]</th>
-    <th>[% 'Details' | $T8 %]</th>
-   </tr>
-   <tr class='listrow'>
-[%- IF price_source.record_item.active_price_source %]
-    <td>[% L.button_tag('kivi.io.update_price_source(' _ FORM.row _ ', \'\')', LxERP.t8('Select')) %]</td>
-[%- ELSE %]
-    <td><b>[% 'Selected' | $T8 %]</b></td>
-[%- END %]
-    <td>[% 'None (PriceSource)' | $T8 %]</td>
-    <td>-</td>
-    <td></td>
-    <td></td>
-   </tr>
-   [%- FOREACH price IN price_source.available_prices %]
-    <tr class='listrow'>
-[%- IF price_source.record_item.active_price_source != price.source %]
-     <td>[% L.button_tag('kivi.io.update_price_source(' _ FORM.row _ ', \'' _ price.source _ '\', \'' _ LxERP.format_amount(price.price, -2) _ '\')', LxERP.t8('Select')) %]</td>
-[%- ELSIF price_source.record_item.sellprice * 1 != price.price * 1 %]
-     <td>[% L.button_tag('kivi.io.update_price_source(' _ FORM.row _ ', \'' _ price.source _ '\', \'' _ LxERP.format_amount(price.price, -2) _ '\')', LxERP.t8('Update Price')) %]</td>
-[%- ELSE %]
-    <td><b>[% 'Selected' | $T8 %]</b></td>
-[% END %]
-     <td>[% price.source_description | html %]</td>
-     <td class="numeric">[% price.price_as_number %]</td>
-[% IF price.source == best_price.source %]
-     <td align='center'>&#x2022;</td>
-[% ELSE %]
-     <td></td>
-[% END %]
-     <td>[% price.description | html %]</td>
+
+<table class="tbl-plain full-width lined">
+  <caption>[% 'Prices' | $T8 %]</caption>
+  <colgroup> <col class="wi-small"><col class="wi-small"><col class="wi-small"><col class="wi-small"><col class="wi-mediumsmall"> </colgroup>
+  <thead>
+    <tr>
+      <th></th>
+      <th>[% 'Price Source' | $T8 %]</th>
+      <th class="right">[% 'Price' | $T8 %]</th>
+      <th class="right">[% 'Best Price' | $T8 %]</th>
+      <th>[% 'Details' | $T8 %]</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      [% IF price_source.record_item.active_price_source %]
+        <td><!-- PENDENT: a.buttons komplett ueberpruefen, L.button_tag()-Funktionen deaktivieren oder loeschen -->
+          <a class="button neutral" onclick="kivi.io.update_price_source('[% FORM.row %]', '')">[% LxERP.t8('Select') %]</a>
+          [% #L.button_tag('kivi.io.update_price_source(' _ FORM.row _ ', \'\')', LxERP.t8('Select'), class='button neutral') %]
+        </td>
+      [% ELSE %]
+        <td>[% 'Selected' | $T8 %]</td>
+      [% END %]
+      <td>[% 'None (PriceSource)' | $T8 %]</td>
+      <td class="right">-</td>
+      <td></td>
+      <td></td>
+    </tr>
+    [% FOREACH price IN price_source.available_prices %]
+    <tr>
+      [% IF price_source.record_item.active_price_source != price.source %]
+        <td>
+          <a class="button neutral" onclick="kivi.io.update_price_source([% FORM.row %], '[% price.source %]', '[% LxERP.format_amount(price.price, -2) %]')">[% LxERP.t8('Select') %]</a>
+          [% #L.button_tag('kivi.io.update_price_source(' _ FORM.row _ ', \'' _ price.source _ '\', \'' _ LxERP.format_amount(price.price, -2) _ '\')', LxERP.t8('Select')) %]
+        </td>
+      [% ELSIF price_source.record_item.sellprice * 1 != price.price * 1 %]
+        <td>
+          <a class="button" onclick="kivi.io.update_price_source([% FORM.row %], '[% price.source %]', '[% LxERP.format_amount(price.price, -2) %]')">[% LxERP.t8('Update Price') %]</a>
+          [% #L.button_tag('kivi.io.update_price_source(' _ FORM.row _ ', \'' _ price.source _ '\', \'' _ LxERP.format_amount(price.price, -2) _ '\')', LxERP.t8('Update Price')) %]
+        </td>
+      [% ELSE %]
+        <td>[% 'Selected' | $T8 %]</td>
+      [% END %]
+      <td>[% price.source_description | html %]</td>
+      <td class="numeric">[% price.price_as_number %]</td>
+      [% IF price.source == best_price.source %]
+        <td class="right">-</td>
+      [% ELSE %]
+        <td></td>
+      [% END %]
+      <td>[% price.description | html %]</td>
     </tr>
-   [%- END %]
-  </table>
+    [% END %]
+  </tbody>
+</table>
 
-  <h2>[% 'Discounts' | $T8 %]</h2>
 
-  <table>
-   <tr class='listheading'>
-    <th></th>
-    <th>[% 'Price Source' | $T8 %]</th>
-    <th>[% 'Discount' | $T8 %]</th>
-    <th>[% 'Best Discount' | $T8 %]</th>
-    <th>[% 'Details' | $T8 %]</th>
-   </tr>
-   <tr class='listrow'>
-[%- IF price_source.record_item.active_discount_source %]
-    <td>[% L.button_tag('kivi.io.update_discount_source(' _ FORM.row _ ', \'\')', LxERP.t8('Select')) %]</td>
-[%- ELSE %]
-    <td><b>[% 'Selected' | $T8 %]</b></td>
-[%- END %]
-    <td>[% 'None (PriceSource Discount)' | $T8 %]</td>
-    <td>-</td>
-    <td></td>
-    <td></td>
-   </tr>
-   [%- FOREACH price IN price_source.available_discounts %]
-    <tr class='listrow'>
-[%- IF price_source.record_item.active_discount_source != price.source %]
-     <td>[% L.button_tag('kivi.io.update_discount_source(' _ FORM.row _ ', \'' _ price.source _ '\', \'' _ price.discount_as_percent _ '\')', LxERP.t8('Select')) %]</td>
-[%- ELSIF price_source.record_item.discount * 1 != price.discount * 100 %]
-     <td>[% L.button_tag('kivi.io.update_discount_source(' _ FORM.row _ ', \'' _ price.source _ '\', \'' _ price.discount_as_percent  _ '\')', LxERP.t8('Update Discount')) %]</td>
-[%- ELSE %]
-    <td><b>[% 'Selected' | $T8 %]</b></td>
-[% END %]
-     <td>[% price.source_description | html %]</td>
-     <td>[% price.discount_as_percent %] %</td>
-[% IF price.source == best_discount.source %]
-     <td align='center'>&#x2022;</td>
-[% ELSE %]
-     <td></td>
-[% END %]
-     <td>[% price.description | html %]</td>
+<table class="tbl-plain full-width lined">
+  <caption>[% 'Discounts' | $T8 %]</caption>
+  <colgroup> <col class="wi-small"><col class="wi-small"><col class="wi-small"><col class="wi-small"><col class="wi-mediumsmall"> </colgroup>  <thead>
+    <tr>
+      <th></th>
+      <th>[% 'Price Source' | $T8 %]</th>
+      <th class="right">[% 'Discount' | $T8 %]</th>
+      <th class="right">[% 'Best Discount' | $T8 %]</th>
+      <th>[% 'Details' | $T8 %]</th>
     </tr>
-   [%- END %]
-  </table>
+  </thead>
+  <tbody>
+    <tr>
+      [% IF price_source.record_item.active_discount_source %]
+      <td>[% L.button_tag('kivi.io.update_discount_source(' _ FORM.row _ ', \'\')', LxERP.t8('Select'), class='neutral') %]</td>
+      [% ELSE %]
+      <td><b>[% 'Selected' | $T8 %]</b></td>
+      [% END %]
+      <td>[% 'None (PriceSource Discount)' | $T8 %]</td>
+      <td class="right">-</td>
+      <td class="right"></td>
+      <td></td>
+    </tr>
+    [% FOREACH price IN price_source.available_discounts %]
+    <tr>
+      [% IF price_source.record_item.active_discount_source != price.source %]
+        <td>[% L.button_tag('kivi.io.update_discount_source(' _ FORM.row _ ', \'' _ price.source _ '\', \'' _ price.discount_as_percent _ '\')', LxERP.t8('Select')) %]</td>
+      [% ELSIF price_source.record_item.discount * 1 != price.discount * 100 %]
+        <td>[% L.button_tag('kivi.io.update_discount_source(' _ FORM.row _ ', \'' _ price.source _ '\', \'' _ price.discount_as_percent _ '\')', LxERP.t8('Update Discount')) %]</td>
+      [% ELSE %]
+        <td><b>[% 'Selected' | $T8 %]</b></td>
+      [% END %]
+      <td>[% price.source_description | html %]</td>
+      <td class="right">[% price.discount_as_percent %] %</td>
+      [% IF price.source == best_discount.source %]
+        <td class="right">&#x2022;</td>
+      [% ELSE %]
+        <td></td>
+      [% END %]
+      <td>[% price.description | html %]</td>
+    </tr>
+    [% END %]
+  </tbody>
+</table>
+
diff --git a/templates/webpages/oe/report_for_todo_list.html b/templates/webpages/oe/report_for_todo_list.html
index 18d6a20cd..08eb1eac0 100644
--- a/templates/webpages/oe/report_for_todo_list.html
+++ b/templates/webpages/oe/report_for_todo_list.html
@@ -1,43 +1,50 @@
-<h1>[% 'Overdue sales quotations and requests for quotations' | $T8 %]</h1>
 [% USE T8 %]
 [% USE HTML %]
 [% USE LxERP %]
 
- <table width="100%">
-  <tr>
-   <td class="listheading">[% 'Date' | $T8 %]</td>
-   <td class="listheading">[% 'Valid until' | $T8 %]</td>
-   <td class="listheading">[% 'Sales quotation' | $T8 %] / [% 'Request quotation' | $T8 %]</td>
-   <td class="listheading">[% 'Customer' | $T8 %] / [% 'Vendor' | $T8 %]</td>
-   <td class="listheading">[% 'Transaction description' | $T8 %]</td>
-   <td class="listheading">[% 'Amount' | $T8 %]</td>
-   <td class="listheading">[% 'Employee' | $T8 %]</td>
-  </tr>
+<div class="wrapper center">
 
-  [%- FOREACH row = QUOTATIONS %]
-  <tr class="listrow[% loop.count % 2 %]">
-   <td>[% HTML.escape(row.transdate) %]</td>
-   <td>[% HTML.escape(row.reqdate) %]</td>
-   <td>
-    <a href="[% edit_url | html %]&amp;vc=[% row.vc | html %]&amp;type=[% IF row.vc == 'customer' %]sales_quotation[% ELSE %]request_quotation[% END %]&amp;id=[% row.id | html %]">
-     [% IF row.vc == 'customer' %]
-     [% 'Sales quotation' | $T8 %]
-     [% ELSE %]
-     [% 'Request quotation' | $T8 %]
-     [% END %]
-     [% HTML.escape(row.quonumber) %]
-    </a>
-   </td>
-   <td>
-    [% IF row.vc == 'customer' %]
-    [% HTML.escape(row.customer) %]
-    [% ELSE %]
-    [% HTML.escape(row.vendor) %]
+<table class="tbl-list wi-moderate">
+  <caption>[% 'Overdue sales quotations and requests for quotations' | $T8 %]</caption>
+  <thead>
+    <tr>
+     <th>[% 'Date' | $T8 %]</th>
+     <th>[% 'Valid until' | $T8 %]</th>
+     <th>[% 'Sales quotation' | $T8 %] / [% 'Request quotation' | $T8 %]</th>
+     <th>[% 'Customer' | $T8 %] / [% 'Vendor' | $T8 %]</th>
+     <th>[% 'Transaction description' | $T8 %]</th>
+     <th>[% 'Amount' | $T8 %]</th>
+     <th>[% 'Employee' | $T8 %]</th>
+    </tr>
+  </thead>
+  <tbody>
+    [% FOREACH row = QUOTATIONS %]
+    <tr>
+     <td>[% HTML.escape(row.transdate) %]</td>
+     <td>[% HTML.escape(row.reqdate) %]</td>
+     <td>
+      <a href="[% edit_url | html %]&amp;vc=[% row.vc | html %]&amp;type=[% IF row.vc == 'customer' %]sales_quotation[% ELSE %]request_quotation[% END %]&amp;id=[% row.id | html %]">
+       [% IF row.vc == 'customer' %]
+         [% 'Sales quotation' | $T8 %]
+       [% ELSE %]
+         [% 'Request quotation' | $T8 %]
+       [% END %]
+       [% HTML.escape(row.quonumber) %]
+      </a>
+     </td>
+     <td>
+      [% IF row.vc == 'customer' %]
+        [% HTML.escape(row.customer) %]
+      [% ELSE %]
+        [% HTML.escape(row.vendor) %]
+      [% END %]
+     </td>
+     <td>[% HTML.escape(row.transaction_description) %]</td>
+     <td>[% HTML.escape(LxERP.format_amount(row.amount, 2)) %]</td>
+     <td>[% HTML.escape(row.employee) %]</td>
+    </tr>
     [% END %]
-   </td>
-   <td>[% HTML.escape(row.transaction_description) %]</td>
-   <td>[% HTML.escape(LxERP.format_amount(row.amount, 2)) %]</td>
-   <td>[% HTML.escape(row.employee) %]</td>
-  </tr>
-  [%- END %]
- </table>
+  </tbody>
+</table>
+
+</div><!-- /.wrapper -->
diff --git a/templates/webpages/oe/sales_order.html b/templates/webpages/oe/sales_order.html
index 780ca8d54..57b58fc4e 100644
--- a/templates/webpages/oe/sales_order.html
+++ b/templates/webpages/oe/sales_order.html
@@ -1,87 +1,126 @@
-[%- PROCESS 'amcvar/render_inputs_block.html' %]
-<tr>
- <td>
-  <input type="button" id="cb_show_details" name="show_details_button" value='[% 'Show details' | $T8 %]'[% IF  show_details %] style="display:none"[% END %]>
-  <input type="button" id="cb_hide_details" name="hide_details_button" value='[% 'Hide details' | $T8 %]'[% IF !show_details %] style="display:none"[% END %]>
-  <script type="text/javascript">
-   $('#cb_show_details,#cb_hide_details').click(function(){
-     $('[id^="row2"],#cb_show_details,#cb_hide_details').toggle();
-     if ( $('[id^="row2"]').is(":visible") ) {
-      $("[name='show_details']").val(1);
-     } else {
-      $("[name='show_details']").val(0);
-     }}
-   );
-  </script>
-  <table id='display_row' width="100%">
-   <tr class="listheading">
-[%- FOREACH header = HEADER %]
- [%- IF header.display %]
-    <th align="left" nowrap width="[% header.width %]" class="listheading">[% header.value %]</th>
- [%- END %]
-[%- END %]
-   </tr>
-[%- FOREACH row = ROWS %]
-     <tr valign="top" class="row [% IF row.error %]error_message[% ELSE %]listrow[% loop.count % 2 %][% END %]">
- [%- FOREACH row1 = row.ROW1 %]
-      <td[% IF row1.align %] align="[% row1.align %]"[% END %][% IF row1.nowrap %] nowrap[% END %][% IF row1.class %] class="[% row1.class %]"[% END %]>[% row1.value %]</td>
- [%- END %]
-     </tr>
-     <tr style='display:none'>
-      <td>
- [%- FOREACH hidden = row.HIDDENS %]
-      [% hidden.value %]
- [%- END %]
-      </td>
-     </tr>
-     <tr class="listrow[% loop.count % 2 %]" id="row2.[% loop.count %]" [% UNLESS show_details %]style="display:none;"[% END %]>
-      <td colspan="[% row.colspan %]">
 [% USE T8 %]
 [% USE HTML %]
 [% USE L %]
 [% USE LxERP %]
 [% USE Math %]
 
- [%# render all row2 entries except cvars  %]
- [%- FOREACH row2 = row.ROW2 %]
-   [%- IF !row2.cvar %]
-     [% row2.value %]
-   [%- END %]
- [%- END %]
 [% PROCESS 'amcvar/render_inputs_block.html' %]
 
- [%# process editable cvars  %]
- <table class='row2-cvars-table'>
-   <tr>
-   [%- FOREACH row2 = row.ROW2 %]
-     [%- SET show = ((row2.render_options.var.flag_editable || !row2.render_options.hide_non_editable ) && row2.render_options.valid && !row2.render_options.partsgroup_filtered) %]
-     [%- IF row2.cvar && show %]
-       [%- IF row2.line_break %]
-         </tr><tr>
-       [%- END %]
-     <th>
-       [% row2.description %]
-     </th>
-     <td>
-       [% PROCESS cvar_inputs cvar = row2.render_options %]
-     </td>
-     [%- END %]
-   [%- END %]
-   </tr>
- </table>
 
- [%# process non editable cvars extra to not disturb the table layout (this will be hidden inputs) %]
- [%- FOREACH row2 = row.ROW2 %]
-   [%- SET hide = (!row2.render_options.var.flag_editable && row2.render_options.hide_non_editable) %]
-   [%- IF row2.cvar && hide %]
-     [% PROCESS cvar_inputs cvar = row2.render_options %]
-   [%- END %]
- [%- END %]
+<div class="buttons positions">
+  <input type="button" id="cb_show_details" name="show_details_button" class="positions neutral" value="[% 'Show details' | $T8 %]"[% IF  show_details %] style="display:none"[% END %]>
+  <input type="button" id="cb_hide_details" name="hide_details_button" class="positions neutral" value="[% 'Hide details' | $T8 %]"[% IF !show_details %] style="display:none"[% END %]>
+</div>
 
-      </td>
-     </tr>
-[%- END %]
+<script type="text/javascript">
+ $('#cb_show_details,#cb_hide_details').click(function(){
+   $('[id^="row2"],#cb_show_details,#cb_hide_details').toggle();
+   if ( $('[id^="row2"]').is(":visible") ) {
+    $("[name='show_details']").val(1);
+   } else {
+    $("[name='show_details']").val(0);
+   }}
+ );
+</script>
+[% SET cols = 0; SET colst = 0; %]
+<table id="display_row" class="tbl-list full-width" style="margin-bottom:0;">
+  <caption>[% 'Invoice items' | $T8 %]</caption>
+  <thead>
+    <tr>
+      [% FOREACH header = HEADER %]
+        [% IF header.display %]
+          <th>[% header.value %]</th>
+        [% END %]
+      [% END %]
+    </tr>
+  </thead>
+  <tbody>
+    [% FOREACH row = ROWS %]
+      <tr>
+        [% FOREACH row1 = row.ROW1 %]
+          <td style="[% IF row1.align %]text-align:[% row1.align %];[% END %][% IF row1.nowrap %]white-space:nowrap;[% END %]"[% IF row1.class %] class="[% row1.class %]"[% END %]>
+            [% row1.value %]
+          </td>
+        [% END %]
+      </tr>
+      <tr style="display:none">
+        <td>
+          [% FOREACH hidden = row.HIDDENS %]
+            [% hidden.value %]
+          [% END %]
+        </td>
+      </tr>
+      <tr id="row2.[% loop.count %]" [% UNLESS show_details %]style="display:none;"[% END %]>
+        [% SET colspan1 = 3 ; SET colspan2 = (row.colspan - colspan1) ; %]
+        <td colspan="[% colspan1 %]"></td>
+        <td colspan="[% colspan2 %]" class="row-position-detail">
+          [% # Render all row2 entries except cvars  %]
+          [% SET row2_size = row.ROW2.size ; %]
+          <!-- <h4>Size of row.ROW2: [% row2_size %] / [% row2_half_size %]  / [%  (row.ROW2.size); %] </h4> -->
+          [%
 
+            # PENDENT: ICH WEISS, DAS NACHFOLGENDE IST SCHEISSE, ABER WIE KRIEGE ICH EINEN KORREKTEN ZWEISPALTER HIN????? Hanspi
+            # Es muessen auch noch MATH-Bibliotheken fuer Template-Toolkit geladen werden, die bei der Revamp aber nicht zur Verfuegung stehen.
+            # Zuerich, 2. September 2018
+
+          %]
+          [% SET cvars_count = 0 %]
+          [% FOREACH row2 = row.ROW2 %]
+            [% IF row2.cvar %]
+              [% SET row2_size = row2_size - 1 ; %]
+              [% SET cvars_count = cvars_count + 1 ; %]
+            [% END %]
+          [% END %]
+          [% IF (row2_size % 2) == 0 ; SET row2_half_size = (row2_size / 2); ELSE; SET row2_half_size = ((row2_size / 2) + 0.5) ; END ; %]
+          [%  SET row2_counter = 1; %]
+          [%  SET row2_counter_items = 1; %]
+          <div class="rowspan-table table">
+            [% FOREACH row2 = row.ROW2 %]
+              [% IF row2_counter > row2_half_size %]
+                </div>
+                <div class="rowspan-table table">
+                [% SET row2_half_size = row2_size - row2_half_size ;  %]
+                [% SET row2_counter = 1 ; %]
+              [% END %]
+              [% IF !row2.cvar %]
+                <div class="label-n-value field" title="[% row2_counter %]">[% row2.value %]</div>
+              [% ELSE %]
+                [% SET row2_half_size = row2_half_size - 1 %]
+              [% END %]
+              [% SET row2_counter = row2_counter + 1 %]
+              [% SET row2_counter_items = row2_counter_items + 1 %]
+              [% LAST IF row2_counter_items > row2_size %]
+            [% END %]
+          </div>
+
+          [% # process editable cvars  %]
+            [% IF cvars_count > 0 %]
+            <!-- <table class="row2-cvars-table"> -->
+            <div class="rowspan-table table">
+                [% FOREACH row2 = row.ROW2 %]
+                  [% SET show = ((row2.render_options.var.flag_editable || !row2.render_options.hide_non_editable ) && row2.render_options.valid && !row2.render_options.partsgroup_filtered) %]
+                  [% IF row2.cvar && show %]
+                    [% # IF row2.line_break %]<!-- </tr><tr> -->[% #END %]
+                    <div class="label-n-value field"><!-- <tr> -->
+                      <span class="label horizontal"><!-- <th> -->[% row2.description %]<!-- </th> --></span>
+                      <span class="value"><!-- <td> -->[% PROCESS cvar_inputs cvar = row2.render_options %]<!-- </td> --></span>
+                    <!-- </tr> --></div>
+                  [% END %]
+                [% END %]
+            <!-- </table> -->
+            </div>
+          [% END %]
+          [%# process non editable cvars extra to not disturb the table layout (this will be hidden inputs) %]
+          [% FOREACH row2 = row.ROW2 %]
+            [% SET hide = (!row2.render_options.var.flag_editable && row2.render_options.hide_non_editable) %]
+            [% IF row2.cvar && hide %]
+              [% PROCESS cvar_inputs cvar = row2.render_options %]
+            [% END %]
+          [% END %]
+        </td>
+      </tr>
+    [% END # /FOREACH row = ROWS %]
+    </tbody>
   </table>
- </td>
-</tr>
+
+
diff --git a/templates/webpages/oe/search.html b/templates/webpages/oe/search.html
index e8153de9b..275f4ee76 100644
--- a/templates/webpages/oe/search.html
+++ b/templates/webpages/oe/search.html
@@ -6,319 +6,314 @@
 
 <h1>[% HTML.escape(title) %]</h1>
 
-[%- SET vclabel = vc == 'customer' ? LxERP.t8('Customer') : LxERP.t8('Vendor') %]
-[%- SET vcnumberlabel = vc == 'customer' ? LxERP.t8('Customer Number') : LxERP.t8('Vendor Number') %]
-[%- SET vctypelabel = vc == 'customer' ? LxERP.t8('Customer type') : LxERP.t8('Vendor type') %]
-[%- SET vcdefault = 'old' _ vc %]
-[%- SET style="width: 250px" %]
+[% SET vclabel = vc == 'customer' ? LxERP.t8('Customer') : LxERP.t8('Vendor') %]
+[% SET vcnumberlabel = vc == 'customer' ? LxERP.t8('Customer Number') : LxERP.t8('Vendor Number') %]
+[% SET vctypelabel = vc == 'customer' ? LxERP.t8('Customer type') : LxERP.t8('Vendor type') %]
+[% SET vcdefault = 'old' _ vc %]
+[% SET style="width: 250px" %]
 
 <form method="post" action="oe.pl" id="form">
 
-<table width="100%">
- <tr>
-  <td>
-   <table>
+<div class="wrapper">
+
+<table class="tbl-horizontal">
+  <caption>[% HTML.escape(vclabel) %]</caption>
+  <tbody>
     <tr>
-     <th align="right">[% HTML.escape(vclabel) %]</th>
-     <td>[% L.input_tag(vc, $vcdefault, style=style, class="initial_focus") %]</td>
+      <th>[% HTML.escape(vclabel) %]</th>
+      <td>[% L.input_tag(vc, $vcdefault, class="initial_focus wi-normal") %]</td>
     </tr>
     <tr>
-     <th align="right" nowrap>[% 'Contact Person' | $T8 %]</th>
-     <td>[% L.input_tag("cp_name", '', style=style) %]</td>
+      <th>[% 'Contact Person' | $T8 %]</th>
+      <td>[% L.input_tag("cp_name", '', class="wi-normal") %]</td>
     </tr>
-[%- IF ALL_DEPARTMENTS.size %]
+    [% UNLESS ALL_BUSINESS_TYPES.size == 0 %]
     <tr>
-     <th align="right" nowrap>[% 'Department' | $T8 %]</th>
-     <td colspan=3>[% L.select_tag('department_id', ALL_DEPARTMENTS, default = department_id, title_key = 'description', with_empty = 1, style=style) %]</td>
+      <th>[% vctypelabel %]</th>
+      <td> [% L.select_tag('business_id', ALL_BUSINESS_TYPES, title_key = 'description', with_empty = 1, class="wi-normal") %]</td>
     </tr>
-[%- END %]
+    [% END %]
+  </tbody>
+</table>
+
+<table class="tbl-horizontal">
+  <caption>[% 'Request Quotation' | $T8 %]</caption>
+  <colgroup> <col class="wi-mediumsmall"><col class="wi-wide"> </colgroup>
+  <tbody>
     <tr>
-     <th align="right">[% HTML.escape(ordlabel) %]</th>
-     <td>[% L.input_tag(ordnrname, "", style=style) %]</td>
+      <th>[% HTML.escape(ordlabel) %]</th>
+      <td>[% L.input_tag(ordnrname, "", class="wi-lightwide") %]</td>
     </tr>
-[% IF is_order %]
+    [% IF is_order %]
     <tr>
-     <th align="right">[% LxERP.t8("Customer Order Number") %]</th>
-     <td>[% L.input_tag("cusordnumber", '', style=style) %]</td>
+      <th>[% LxERP.t8("Customer Order Number") %]</th>
+      <td>[% L.input_tag("cusordnumber", '', class="wi-lightwide") %]</td>
     </tr>
-[% END %]
+    [% END %]
     <tr>
-     <th align="right">[% 'Employee' | $T8 %]</th>
-     <td>[% L.select_tag('employee_id', ALL_EMPLOYEES, title_key='safe_name', with_empty=1, style=style) %]</td>
+      <th>[% 'Steuersatz' | $T8 %]</th>
+      <td>[% L.select_tag('taxzone_id', ALL_TAXZONES, with_empty=1, title_key='description', class="wi-lightwide") %]</td>
     </tr>
     <tr>
-     <th align="right">[% 'Salesman' | $T8 %]</th>
-     <td>[% L.select_tag('salesman_id', ALL_EMPLOYEES, title_key='safe_name', with_empty=1, style=style) %]</td>
+      <th>[% 'Shipping Point' | $T8 %]</th>
+      <td>[% L.input_tag('shippingpoint', '', class="wi-lightwide") %]</td>
     </tr>
     <tr>
-     <th align="right">[% 'Steuersatz' | $T8 %]</th>
-     <td>[% L.select_tag('taxzone_id', ALL_TAXZONES, with_empty=1, title_key='description', style=style) %]</td>
+      <th>[% 'Transaction description' | $T8 %]</th>
+      <td>[% L.input_tag("transaction_description", "", class="wi-lightwide") %]</td>
     </tr>
     <tr>
-     <th align="right">[% 'Shipping Point' | $T8 %]</th>
-     <td>[% L.input_tag('shippingpoint', '', style=style) %]</td>
+      <th>[% 'Project' | $T8 %]</th>
+      <td>[% P.project.picker("project_id", '', class="wi-lightwide") %]</td>
     </tr>
     <tr>
-     <th align="right">[% 'Transaction description' | $T8 %]</th>
-     <td>[% L.input_tag("transaction_description", "", style=style) %]</td>
-     <th align="right">[% 'Part Description' | $T8 %]</th>
-     <td>[% L.input_tag("parts_description", "", style=style) %]</td>
+      <th>[% IF is_order %][% 'Order Date' | $T8 %][% ELSE %][% 'Quotation Date' | $T8 %][% END %] [% 'From' | $T8 %]</th>
+      <td>[% L.date_tag('transdatefrom','', class='wi-date') %] [% 'Bis' | $T8 %] [% L.date_tag('transdateto','', class='wi-date') %]</td>
     </tr>
     <tr>
-     <th align="right">[% 'Project' | $T8 %]</th>
-     <td>[% P.project.picker("project_id", '', style=style) %]</td>
-     <th align="right">[% 'Part Number' | $T8 %]</th>
-     <td>[% L.input_tag("parts_partnumber", "", style=style) %]</td>
+      <th>[% IF is_order %][% 'Delivery Date' | $T8 %][% ELSE %][% 'Valid until' | $T8 %][% END %] [% 'From' | $T8 %]</th>
+      <td>[% L.date_tag('reqdatefrom','', class='wi-date') %] [% 'Bis' | $T8 %] [% L.date_tag('reqdateto','', class='wi-date') %]</td>
     </tr>
-    [%- UNLESS ALL_BUSINESS_TYPES.size == 0 %]
+    [% IF type == 'sales_order' %]
     <tr>
-     <th align="right" nowrap>[% vctypelabel %]</th>
-     <td>
-      [% L.select_tag('business_id', ALL_BUSINESS_TYPES, title_key = 'description', with_empty = 1, style=style) %]
-     </td>
+      <th>[% 'Insert Date' | $T8 %] [% 'From' | $T8 %]</th>
+      <td>[% L.date_tag('insertdatefrom','', class='wi-date') %] [% 'Bis' | $T8 %] [% L.date_tag('insertdateto','', class='wi-date') %]</td>
     </tr>
-    [%- END %]
+    [% END %]
+    [% IF type == 'sales_quotation' %]
     <tr>
-     <th align="right">[% IF is_order %][% 'Order Date' | $T8 %][% ELSE %][% 'Quotation Date' | $T8 %][% END %] [% 'From' | $T8 %]</th>
-     <td>
-       [% L.date_tag('transdatefrom') %]
-       [% 'Bis' | $T8 %]
-      [% L.date_tag('transdateto') %]
-     </td>
+      <th>[% 'Expected billing date' | $T8 %] [% 'From' | $T8 %]</th>
+      <td>[% L.date_tag('expected_billing_date_from', '', class='wi-date') %] [% 'Bis' | $T8 %] [% L.date_tag('expected_billing_date_to', '', class='wi-date') %]</td>
     </tr>
     <tr>
-     <th align="right">[% IF is_order %][% 'Delivery Date' | $T8 %][% ELSE %][% 'Valid until' | $T8 %][% END %] [% 'From' | $T8 %]</th>
-     <td>
-       [% L.date_tag('reqdatefrom') %]
-       [% 'Bis' | $T8 %]
-       [% L.date_tag('reqdateto') %]
-     </td>
+      <th>[% 'Order probability' | $T8 %]</th>
+      <td>[% L.select_tag('order_probability_op', [[ 'ge', '>=' ], [ 'le', '<=' ]]) %] [% L.select_tag('order_probability_value', ORDER_PROBABILITIES, title='title', with_empty=1) %]</td>
     </tr>
+    [% END %]
+    [% IF CT_CUSTOM_VARIABLES.size %]
+      <tr>
+        <th class="caption" colspan="2">[% 'Custom variables for module' | $T8 %]: [%'Customers and vendors' | $T8 %]</th>
+      </tr>
+      [% CT_CUSTOM_VARIABLES_FILTER_CODE %]
+    [% END %]
+  </tbody>
+</table>
 
-    [%- IF type == 'sales_order' %]
+
+<table class="tbl-horizontal">
+  <caption>[% 'Article' | $T8 %]</caption>
+  <tbody>
     <tr>
-     <th align="right">[% 'Insert Date' | $T8 %] [% 'From' | $T8 %]</th>
-     <td>
-       [% L.date_tag('insertdatefrom') %]
-       [% 'Bis' | $T8 %]
-       [% L.date_tag('insertdateto') %]
-     </td>
+      <th>[% 'Part Description' | $T8 %]</th>
+      <td>[% L.input_tag("parts_description", "", class="wi-normal") %]</td>
     </tr>
-    [%- END %]
-
-[%- IF type == 'sales_quotation' %]
     <tr>
-     <th align="right">[% 'Expected billing date' | $T8 %] [% 'From' | $T8 %]</th>
-     <td>
-      [% L.date_tag('expected_billing_date_from', '') %]
-      [% 'Bis' | $T8 %]
-      [% L.date_tag('expected_billing_date_to', '') %]
-     </td>
+      <th>[% 'Part Number' | $T8 %]</th>
+      <td>[% L.input_tag("parts_partnumber", "", class="wi-normal") %]</td>
     </tr>
     <tr>
-     <th align="right">[% 'Order probability' | $T8 %]</th>
-     <td>
-      [% L.select_tag('order_probability_op', [[ 'ge', '>=' ], [ 'le', '<=' ]]) %]
-      [% L.select_tag('order_probability_value', ORDER_PROBABILITIES, title='title', with_empty=1) %]
-     </td>
+      <th class="caption" colspan="2"> [% 'Handling' | $T8 %] </th>
     </tr>
-[%- END %]
-
-[%- IF CT_CUSTOM_VARIABLES.size %]
     <tr>
-      <td></td>
-      <td colspan=4 align=left><b>[% 'Custom variables for module' | $T8 %]: [%'Customers and vendors' | $T8 %]</td>
+      <th>[% 'Employee' | $T8 %]</th>
+      <td>[% L.select_tag('employee_id', ALL_EMPLOYEES, title_key='safe_name', with_empty=1, class="wi-normal") %]</td>
     </tr>
-    [% CT_CUSTOM_VARIABLES_FILTER_CODE %]
-[%- END %]
+    <tr>
+      <th>[% 'Salesman' | $T8 %]</th>
+      <td>[% L.select_tag('salesman_id', ALL_EMPLOYEES, title_key='safe_name', with_empty=1, class="wi-normal") %]</td>
+    </tr>
+    [% IF ALL_DEPARTMENTS.size %]
+    <tr>
+      <th>[% 'Department' | $T8 %]</th>
+      <td>[% L.select_tag('department_id', ALL_DEPARTMENTS, default = department_id, title_key = 'description', with_empty = 1, class="wi-normal") %]</td>
+    </tr>
+    [% END %]
+  </tbody>
+</table>
 
+<table class="tbl-horizontal">
+  <caption>[% 'State' | $T8 %]</caption>
+  <tbody>
     <tr>
-     <th align="right">[% 'Include in Report' | $T8 %]</th>
-     <td colspan="5">
-      <table>
-       <tr>
-        <td>
-         <input type="checkbox" name="open" value="1" id="open" checked>
-         <label for="open">[% 'Open' | $T8 %]</label>
-        </td>
-        <td>
-         <input type="checkbox" name="closed" value="1" id="closed">
-         <label for="closed">[% 'Closed' | $T8 %]</label>
-        </td>
-       </tr>
-[%- IF type == 'sales_order' OR type == 'purchase_order' %]
-       <tr>
-        <td>
-         <input name="notdelivered" id="notdelivered" class="checkbox" type="checkbox" value="1" checked>
-         <label for="notdelivered">[% 'Not delivered' | $T8 %]</label>
-        </td>
-        <td>
-         <input name="delivered" id="delivered" class="checkbox" type="checkbox" value="1" checked>
-         <label for="delivered">[% 'Delivery Order(s) for full qty created' | $T8 %]</label>
-        </td>
-       </tr>
-[%- END %]
-[%- IF type == 'sales_order' %]
-       <tr>
-        <td>
-         [% L.checkbox_tag("periodic_invoices_active", label => LxERP.t8("Periodic invoices active")) %]
-        </td>
-        <td>
-         [% L.checkbox_tag("periodic_invoices_inactive", label => LxERP.t8("Periodic invoices inactive")) %]
-        </td>
-       </tr>
-[%- END %]
-       <tr>
-        <td>
-         <input name="l_id" id="l_id" class="checkbox" type="checkbox" value="Y">
-         <label for="l_id">[% 'ID' | $T8 %]</label>
-        </td>
-        <td>
-         <input name="l_[% HTML.escape(ordnrname) %]" id="l_[% HTML.escape(ordnrname) %]" class="checkbox" type="checkbox" value="Y" checked>
-         <label for="l_[% HTML.escape(ordnrname) %]">[% HTML.escape(ordlabel) %]</label>
-        </td>
-[% IF is_order %]
-        <td>
-         <input name="l_cusordnumber" id="l_cusordnumber" class="checkbox" type="checkbox" value="Y" checked>
-         <label for="l_cusordnumber">[% LxERP.t8("Customer Order Number") %]</label>
-        </td>
-[% END %]
-       </tr>
-       <tr>
-        <td>
-         <input name="l_transdate" id="l_transdate" class="checkbox" type="checkbox" value="Y" checked>
-         <label for="l_transdate">[% 'Date' | $T8 %]</label>
-        </td>
-        <td>
-         <input name="l_reqdate" id="l_reqdate" class="checkbox" type="checkbox" value="Y" checked>
-         <label for="l_reqdate">[% IF is_order %][% 'Required by' | $T8 %][% ELSE %][% 'Valid until' | $T8 %][% END %]</label>
-        </td>
-        [%- IF type == 'sales_order' %]
-        <td>
-          <input name="l_insertdate" id="l_insertdate" class="checkbox" type="checkbox" value="Y">
-          <label for="l_insertdate">[% 'Insert Date' | $T8 %]</label>
-        </td>
-        [%- END %]
-       </tr>
-       <tr>
-        <td>
-         <input name="l_name" id="l_name" class="checkbox" type="checkbox" value="Y" checked>
-         <label for="l_name">[% HTML.escape(vclabel) %]
-        </td>
-        <td>
-         <input name="l_employee" id="l_employee" class="checkbox" type="checkbox" value="Y" checked>
-         <label for="l_employee">[% 'Employee' | $T8 %]</label>
-        </td>
-        <td>
-         <input name="l_shipvia" id="l_shipvia" class="checkbox" type="checkbox" value="Y">
-         <label for="l_shipvia">[% 'Ship via' | $T8 %]</label>
-        </td>
-       </tr>
-       <tr>
-        <td>
-         <input name="l_customernumber" id="l_customernumber" class="checkbox" type="checkbox" value="Y">
-         <label for="l_customernumber">[% 'Customer Number' | $T8 %]</label>
-        </td>
-        <td>[%- L.checkbox_tag('l_taxzone',       label => LxERP.t8('Steuersatz'))     %]</td>
-        <td>[%- L.checkbox_tag('l_shippingpoint', label => LxERP.t8('Shipping Point')) %]</td>
-       </tr>
-       <tr>
-        <td>
-         <input name="l_netamount" id="l_netamount" class="checkbox" type="checkbox" value="Y">
-         <label for="l_netamount">[% 'Amount' | $T8 %]</label>
-        </td>
-        <td>
-         <input name="l_tax" id="l_tax" class="checkbox" type="checkbox" value="Y">
-         <label for="l_tax">[% 'Tax' | $T8 %]</label>
-        </td>
-        <td>
-         <input name="l_amount" id="l_amount" class="checkbox" type="checkbox" value="Y" checked>
-         <label for="l_amount">[% 'Total' | $T8 %]</label>
-        </td>
-       </tr>
-       <tr>
-        <td>
-         <input name="l_marge_total" id="l_marge_total" class="checkbox" type="checkbox" value="Y">
-         <label for="l_marge_total">[% 'Ertrag' | $T8 %]</label>
-        </td>
-        <td>
-         <input name="l_marge_percent" id="l_marge_percent" class="checkbox" type="checkbox" value="Y">
-         <label for="l_marge_percent">[% 'Ertrag prozentual' | $T8 %]</label>
-        </td>
-        <td>
-         <input name="l_payment_terms" id="l_payment_terms" class="checkbox" type="checkbox" value="Y">
-         <label for="l_payment_terms">[% 'Payment Terms' | $T8 %]</label>
-        </td>
-       </tr>
-       <tr>
-        <td>
-         <input name="l_globalprojectnumber" id="l_globalprojectnumber" class="checkbox" type="checkbox" value="Y">
-         <label for="l_globalprojectnumber">[% 'Project Number' | $T8 %]</label>
-        </td>
-        <td>
-         <input name="l_transaction_description" id="l_transaction_description" class="checkbox" type="checkbox" value="Y"[% IF INSTANCE_CONF.get_require_transaction_description_ps %] checked[% END %]>
-         <label for="l_transaction_description">[% 'Transaction description' | $T8 %]</label>
-        </td>
-        <td>
-         [%- L.checkbox_tag('l_department', label => LxERP.t8('Department')) %]</td>
-        </td>
+      <th>[% 'Open' | $T8 %]</th>
+      <td><input type="checkbox" name="open" value="1" id="open" checked></td>
+    </tr>
+    <tr>
+      <th>[% 'Closed' | $T8 %]</th>
+      <td><input type="checkbox" name="closed" value="1" id="closed"></td>
+    </tr>
+    [% IF type == 'sales_order' OR type == 'purchase_order' %]
+    <tr>
+      <th>[% 'Not delivered' | $T8 %]</th>
+      <td><input name="notdelivered" id="notdelivered" type="checkbox" value="1" checked></td>
+    </tr>
+    <tr>
+      <th>[% 'Delivery Order(s) for full qty created' | $T8 %]</th>
+      <td><input name="delivered" id="delivered" type="checkbox" value="1" checked></td>
+    </tr>
+    [% END %] [% IF type == 'sales_order' %]
+    <tr>
+      <th>[% 'Periodic invoices active' | $T8 %]</th>
+      <td>[% L.checkbox_tag("periodic_invoices_active") %]</td>
+    </tr>
+    <tr>
+      <th>[% 'Periodic invoices inactive' | $T8 %]</th>
+      <td>[% L.checkbox_tag("periodic_invoices_inactive") %]</td>
+    </tr>
+    [% END %]
+  </tbody>
+</table>  
+</div><!-- /.wrapper -->
 
-       </tr>
-       <tr>
-        <td>
-         <input name="l_subtotal" id="l_subtotal" class="checkbox" type="checkbox" value="Y">
-         <label for="l_subtotal">[% 'Subtotal' | $T8 %]</label>
-        </td>
-        <td>
-         <input name="l_salesman" id="l_salesman" class="checkbox" type="checkbox" value="Y">
-         <label for="l_salesman">[% 'Salesman' | $T8 %]</label>
-        </td>
-       </tr>
-[% IF type == 'sales_quotation' %]
-       <tr>
-        <td colspan="2">
-         <input name="l_order_probability_expected_billing_date" id="l_order_probability_expected_billing_date" class="checkbox" type="checkbox" value="Y">
-         <label for="l_order_probability_expected_billing_date">[% 'Order probability & expected billing date' | $T8 %]</label>
-        </td>
-       </tr>
-[%- END %]
-       <tr>
-        <td>
-         <input name="l_remaining_amount" id="l_remaining_amount" class="checkbox" type="checkbox" value="Y">
-         <label for="l_remaining_amount">[% 'Remaining Amount' | $T8 %]</label>
-        </td>
-        <td>
-         <input name="l_remaining_netamount" id="l_remaining_netamount" class="checkbox" type="checkbox" value="Y">
-         <label for="l_remaining_netamount">[% 'Remaining Net Amount' | $T8 %]</label>
-        </td>
-       </tr>
-       <tr>
-        <td colspan=4 align=left><b>[% HTML.escape(vclabel) %]</td>
-       </tr>
-       <tr>
-        <td>
-         <input name="l_vcnumber" id="l_vcnumber" class="checkbox" type="checkbox" value="Y">
-         <label for="l_vcnumber">[% HTML.escape(vcnumberlabel) %]</label>
-        </td>
-        <td>
-         <input name="l_country" id="l_country" class="checkbox" type="checkbox" value="Y">
-         <label for="l_country">[% 'Country' | $T8 %]</label>
-        </td>
-        <td>
-         <input name="l_ustid"  id="l_ustid" class="checkbox" type="checkbox" value="Y">
-         <label for="l_ustid">[% 'USt-IdNr.' | $T8 %]</label>
-        </td>
-       </tr>
 
-      [% CT_CUSTOM_VARIABLES_INCLUSION_CODE %]
+<div class="wrapper form-addition control-panel">
 
-      </table>
-     </td>
-    </tr>
-   </table>
-  </td>
- </tr>
-</table>
+<h3>[% 'Include in Report' | $T8 %]</h3>
+
+<div class="list col">
+  <h4>[% 'Numbers & IDs' | $T8 %]</h4>
+  <div>
+    <input name="l_[% HTML.escape(ordnrname) %]" id="l_[% HTML.escape(ordnrname) %]" type="checkbox" value="Y" checked>
+    <label for="l_[% HTML.escape(ordnrname) %]">[% HTML.escape(ordlabel) %]</label>
+  </div>
+  <div>
+    <input name="l_id" id="l_id" type="checkbox" value="Y">
+    <label for="l_id">[% 'ID' | $T8 %]</label>
+  </div>
+  <div>
+    <input name="l_globalprojectnumber" id="l_globalprojectnumber" type="checkbox" value="Y">
+    <label for="l_globalprojectnumber">[% 'Project Number' | $T8 %]</label>
+  </div>
+  [% IF is_order %]
+  <div>
+    <input name="l_cusordnumber" id="l_cusordnumber" type="checkbox" value="Y" checked>
+    <label for="l_cusordnumber">[% LxERP.t8("Customer Order Number") %]</label>
+  </div>
+  [% END %]
+</div>
+<div class="list col">
+    <h4> [% 'Handling' | $T8 %] </h4>
+  <div>
+    <input name="l_employee" id="l_employee" type="checkbox" value="Y" checked>
+    <label for="l_employee">[% 'Employee' | $T8 %]</label>
+  </div>
+  <div>
+    <input name="l_salesman" id="l_salesman" type="checkbox" value="Y">
+    <label for="l_salesman">[% 'Salesman' | $T8 %]</label>
+  </div></div>
+
+<div class="list col">
+  <h4>[% 'Amounts' | $T8 %]</h4>
+  <div>
+    <input name="l_amount" id="l_amount" type="checkbox" value="Y" checked>
+    <label for="l_amount">[% 'Total' | $T8 %]</label>
+  </div>
+  <div>
+    <input name="l_marge_total" id="l_marge_total" type="checkbox" value="Y">
+    <label for="l_marge_total">[% 'Ertrag' | $T8 %]</label>
+  </div>
+  <div>
+    <input name="l_marge_percent" id="l_marge_percent" type="checkbox" value="Y">
+    <label for="l_marge_percent">[% 'Ertrag prozentual' | $T8 %]</label>
+  </div>
+  <div>
+    <input name="l_netamount" id="l_netamount" type="checkbox" value="Y">
+    <label for="l_netamount">[% 'Amount' | $T8 %]</label>
+  </div>
+  <div>
+    <input name="l_subtotal" id="l_subtotal" type="checkbox" value="Y">
+    <label for="l_subtotal">[% 'Subtotal' | $T8 %]</label>
+  </div>
+  <div>
+    <input name="l_remaining_amount" id="l_remaining_amount" type="checkbox" value="Y">
+    <label for="l_remaining_amount">[% 'Remaining Amount' | $T8 %]</label>
+  </div>
+  <div>
+    <input name="l_remaining_netamount" id="l_remaining_netamount" type="checkbox" value="Y">
+    <label for="l_remaining_netamount">[% 'Remaining Net Amount' | $T8 %]</label>
+  </div>
+</div>
+<div class="list col">
+  <h4>[% HTML.escape(vclabel) %]</h4>
+  <div>
+    <input name="l_name" id="l_name" type="checkbox" value="Y" checked>
+    <label for="l_name">[% HTML.escape(vclabel) %]</label>
+  </div>
+  <div>
+    <input name="l_vcnumber" id="l_vcnumber" type="checkbox" value="Y">
+    <label for="l_vcnumber">[% HTML.escape(vcnumberlabel) %]</label>
+  </div>
+  <div>
+    <input name="l_country" id="l_country" type="checkbox" value="Y">
+    <label for="l_country">[% 'Country' | $T8 %]</label>
+  </div>
+  <div>
+    <input name="l_ustid" id="l_ustid" type="checkbox" value="Y">
+    <label for="l_ustid">[% 'USt-IdNr.' | $T8 %]</label>
+  </div>
+</div>
+<div class="list col">
+  <h4>[% 'Taxes' | $T8 %]</h4>
+  <div>
+    <input name="l_tax" id="l_tax" type="checkbox" value="Y">
+    <label for="l_tax"> [% 'Tax' | $T8 %] </label>
+  </div>
+  <div>
+    [% L.checkbox_tag('l_taxzone', label => LxERP.t8('Steuersatz')) %]
+  </div>
+  <div>
+    <h4>[% 'Date' | $T8 %]</h4>
+  </div>
+  <div>
+    <input name="l_transdate" id="l_transdate" type="checkbox" value="Y" checked>
+    <label for="l_transdate"> [% 'Date' | $T8 %] </label>
+  </div>
+  <div>
+    <input name="l_reqdate" id="l_reqdate" type="checkbox" value="Y" checked>
+    <label for="l_reqdate"> [% IF is_order %][% 'Required by' | $T8 %][% ELSE %][% 'Valid until' | $T8 %][% END %] </label>
+  </div>
+  [% IF type == 'sales_order' %]
+  <div>
+    <input name="l_insertdate" id="l_insertdate" type="checkbox" value="Y">
+    <label for="l_insertdate">[% 'Insert Date' | $T8 %]</label>
+  </div>
+  [% END %]
+</div>
+<div class="list col">
+  <h4>Order info</h4>
+  <div>
+    <input name="l_department" id="l_department" type="checkbox" value="Y">
+    <label for="l_department"> [% 'Department' | $T8 %] </label>
+  </div>
+  <div>
+    <input name="l_shipvia" id="l_shipvia" type="checkbox" value="Y">
+    <label for="l_shipvia"> [% 'Ship via' | $T8 %] </label>
+  </div>
+  <div>
+    [% L.checkbox_tag('l_shippingpoint', label => LxERP.t8('Shipping Point')) %]
+  </div>
+  <div>
+    <input name="l_payment_terms" id="l_payment_terms" type="checkbox" value="Y">
+    <label for="l_payment_terms">[% 'Payment Terms' | $T8 %]</label>
+  </div>
+  <div>
+    <input name="l_transaction_description" id="l_transaction_description" type="checkbox" value="Y" [% IF INSTANCE_CONF.get_require_transaction_description_ps %] checked[% END %]>
+    <label for="l_transaction_description">[% 'Transaction description' | $T8 %]</label>
+  </div>
+  [% IF type == 'sales_quotation' %]
+  <div>
+    <input name="l_order_probability_expected_billing_date" id="l_order_probability_expected_billing_date" type="checkbox" value="Y">
+    <label for="l_order_probability_expected_billing_date"> [% 'Order probability &amp; expected billing date' | $T8 %] </label>
+  </div>
+  [% END %]
+</div>
+<div class="list col">
+  <h4>Custom Variables</h4><!-- PENDENT: Perl-Code anpassen (es werden keine DIVs gesetzt) -->
+  [% CT_CUSTOM_VARIABLES_INCLUSION_CODE %]
+</div>
+
+
+</div>
 
 <input type="hidden" name="vc" value="[% HTML.escape(vc) %]">
 <input type="hidden" name="type" value="[% HTML.escape(type) %]">
