commit e9c895f9cce608181d7e9288b533fccb1f40c5d6
Author: Hans Peter Schlaepfer <hanspeter.schlaepfer@revamp-it.ch>
Date:   Fri Jan 4 06:13:15 2019 +0100

    Neues kivitendo Design Aenderungen in templates/webpages/order/..

diff --git a/templates/webpages/order/form.html b/templates/webpages/order/form.html
index 6020fd7b7..2ab8ac554 100644
--- a/templates/webpages/order/form.html
+++ b/templates/webpages/order/form.html
@@ -1,15 +1,15 @@
-[%- USE T8 %]
-[%- USE LxERP %]
-[%- USE L %]
-[%- USE HTML %]
-<h1>[% FORM.title %] <span id='nr_in_title'>[%- SELF.order.number -%]</span></h1>
+[% USE T8 %]
+[% USE LxERP %]
+[% USE L %]
+[% USE HTML %]
+<h1>[% FORM.title %] <span id='nr_in_title'>[% SELF.order.number %]</span></h1>
 
 <div id="print_options" style="display:none">
   <form method="post" action="controller.pl" id="print_options_form">
     [% SELF.print_options %]
     <br>
     [% L.button_tag('kivi.Order.print()', LxERP.t8('Print')) %]
-    <a href="#" onclick="$('#print_options').dialog('close');">[% LxERP.t8("Cancel") %]</a>
+    <a href="#" onclick="$('#print_options').dialog('close');" class="button neutral">[% LxERP.t8("Cancel") %]</a>
   </form>
 </div>
 
@@ -19,27 +19,29 @@
   [% L.hidden_tag('id',                   SELF.order.id) %]
   [% L.hidden_tag('converted_from_oe_id', SELF.converted_from_oe_id) %]
 
-  [%- INCLUDE 'common/flash.html' %]
+  [% INCLUDE 'common/flash.html' %]
 
-  <div class="tabwidget" id="order_tabs">
-    <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 SELF.order.id AND INSTANCE_CONF.get_doc_storage %]
-      <li><a href="controller.pl?action=File/list&file_type=document&object_type=[% HTML.escape(FORM.type) %]&object_id=[% HTML.url(SELF.order.id) %]">[% 'Documents' | $T8 %]</a></li>
-      <li><a href="controller.pl?action=File/list&file_type=attachment&object_type=[% HTML.escape(FORM.type) %]&object_id=[% HTML.url(SELF.order.id) %]">[% 'Attachments' | $T8 %]</a></li>
-[%- END %]
-[%- IF SELF.order.id %]
-      <li><a href="controller.pl?action=RecordLinks/ajax_list&object_model=Order&object_id=[% HTML.url(SELF.order.id) %]">[% 'Linked Records' | $T8 %]</a></li>
-[%- END %]
-    </ul>
+<div class="tabwidget" id="order_tabs">
 
-    [% PROCESS "order/tabs/basic_data.html" %]
-    [% PROCESS 'webdav/_list.html' %]
-    <div id="ui-tabs-1">
-      [%- LxERP.t8("Loading...") %]
-    </div>
-  </div>
+<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 SELF.order.id AND INSTANCE_CONF.get_doc_storage %]
+    <li><a href="controller.pl?action=File/list&file_type=document&object_type=[% HTML.escape(FORM.type) %]&object_id=[% HTML.url(SELF.order.id) %]">[% 'Documents' | $T8 %]</a></li>
+    <li><a href="controller.pl?action=File/list&file_type=attachment&object_type=[% HTML.escape(FORM.type) %]&object_id=[% HTML.url(SELF.order.id) %]">[% 'Attachments' | $T8 %]</a></li>
+  [% END %]
+  [% IF SELF.order.id %]
+    <li><a href="controller.pl?action=RecordLinks/ajax_list&object_model=Order&object_id=[% HTML.url(SELF.order.id) %]">[% 'Linked Records' | $T8 %]</a></li>
+  [% END %]
+</ul>
+
+[% PROCESS "order/tabs/basic_data.html" %]
+[% PROCESS 'webdav/_list.html' %]
+<div id="ui-tabs-1">
+  [% LxERP.t8("Loading...") %]
+</div>
+
+</div><!-- /.tabwidget -->
 </form>
diff --git a/templates/webpages/order/tabs/_business_info_row.html b/templates/webpages/order/tabs/_business_info_row.html
index cdd61a6d9..9fbd9225a 100644
--- a/templates/webpages/order/tabs/_business_info_row.html
+++ b/templates/webpages/order/tabs/_business_info_row.html
@@ -1,10 +1,13 @@
-[%- USE T8 %][%- USE HTML %]
+[% USE T8 %]
+[% USE HTML %]
 
-<tr id='business_info_row' [%- IF !SELF.order.customervendor.business_id %]style='display:none'[%- END %]>
-  <th align="right">[%- IF SELF.cv == 'customer' -%]
-                      [%- 'Customer type' | $T8 -%]
-                    [%- ELSE -%]
-                      [%- 'Vendor type' | $T8 -%]
-                    [%- END -%]</th>
-  <td>[% HTML.escape(SELF.order.customervendor.business.description) %]; [% 'Trade Discount' | $T8 %] [% SELF.order.customervendor.business.discount_as_percent %] %</td>
+<tr id='business_info_row' [% IF !SELF.order.customervendor.business_id %]style='display:none'[% END %]>
+  <th>
+    [% IF SELF.cv == 'customer' %]
+      [% 'Customer type' | $T8 %]
+    [% ELSE %]
+      [% 'Vendor type' | $T8 %]
+    [% END %]
+  </th>
+  <td><span class="plain-data wi-lightwide">[% HTML.escape(SELF.order.customervendor.business.description) %] ([% 'Trade Discount' | $T8 %] [% SELF.order.customervendor.business.discount_as_percent %]%)</span></td>
 </tr>
diff --git a/templates/webpages/order/tabs/_item_input.html b/templates/webpages/order/tabs/_item_input.html
index 9c6b5725f..d388613d1 100644
--- a/templates/webpages/order/tabs/_item_input.html
+++ b/templates/webpages/order/tabs/_item_input.html
@@ -1,29 +1,42 @@
-[%- USE T8 %][%- USE HTML %][%- USE LxERP %][%- USE L %][%- USE P %]
+[% USE T8 %]
+[% USE HTML %]
+[% USE LxERP %]
+[% USE L %]
+[% USE P %]
 
- <div>
-  <table id="input_row_table_id">
-    <thead>
-      <tr class="listheading">
-        <th class="listheading" nowrap >[%- 'Part'         | $T8 %] </th>
-        <th class="listheading" nowrap >[%- 'Description'  | $T8 %] </th>
-        <th class="listheading" nowrap width="5" >[%- 'Qty'          | $T8 %] </th>
-        <th class="listheading" nowrap width="15">[%- 'Price'        | $T8 %] </th>
-        <th class="listheading" nowrap width="5" >[%- 'Discount'     | $T8 %] </th>
-        <th></th>
-      </tr>
-    </thead>
+<div class="wrapper">
+<div class="input-panel control-panel">
+  <table id="input_row_table_id" class="tbl-plain condensed">
+    <caption>[% 'Add Parts here!' | $T8 %]</caption>
     <tbody>
-      <tr valign="top" class="listrow">
-        <td>[% P.part.picker('add_item.parts_id', '', fat_set_item=1, style='width: 300px', class="add_item_input") %]</td>
-        <td>[% L.input_tag('add_item.description', '', class="add_item_input") %]</td>
+      <tr>
+        <td>
+          <span class="label above">[% 'Part' | $T8 %] </span>
+          [% P.part.picker('add_item.parts_id', '', fat_set_item=1, class="add_item_input wi-normal") %]
+        </td>
         <td>
-          [% L.input_tag('add_item.qty_as_number', '', size = 5, class="add_item_input numeric") %]
+          <span class="label above">[% 'Description' | $T8 %] </span>
+          [% L.input_tag('add_item.description', '', class="add_item_input wi-normal") %]
+        </td>
+        <td>
+          <span class="label above">[% 'Qty' | $T8 %]</span>
+          [% L.input_tag('add_item.qty_as_number', '', class="add_item_input numeric wi-verysmall") %]
           [% L.hidden_tag('add_item.unit', '', class="add_item_input") %]
         </td>
-        <td>[% L.input_tag('add_item.sellprice_as_number', '', size = 10, class="add_item_input numeric") %]</td>
-        <td>[% L.input_tag('add_item.discount_as_percent', '', size = 5, class="add_item_input numeric") %]</td>
-        <td>[% L.button_tag('kivi.Order.add_item()', LxERP.t8('Add part')) %]</td>
+        <td>
+          <span class="label above">[% 'Price' | $T8 %]</span>
+          [% L.input_tag('add_item.sellprice_as_number', '', class="add_item_input numeric wi-verysmall") %]
+        </td>
+        <td>
+          <span class="label above">[% 'Discount' | $T8 %]</span>
+          [% L.input_tag('add_item.discount_as_percent', '', class="add_item_input numeric wi-smallest") %]
+        </td>
+        <td style="vertical-align:bottom;">[% L.button_tag('kivi.Order.add_item()', LxERP.t8('Add part'), style='margin:0;') %]</td>
       </tr>
     </tbody>
   </table>
- </div>
+  <div style="clear:both">[% L.button_tag('kivi.Order.show_multi_items_dialog()', LxERP.t8('Add multiple items'), class='neutral') %]</div>
+
+</div><!-- /.entry-panel -->
+</div><!-- /.wrapper -->
+
diff --git a/templates/webpages/order/tabs/_multi_items_dialog.html b/templates/webpages/order/tabs/_multi_items_dialog.html
index 3719a93ae..f3bd84390 100644
--- a/templates/webpages/order/tabs/_multi_items_dialog.html
+++ b/templates/webpages/order/tabs/_multi_items_dialog.html
@@ -1,25 +1,35 @@
-[%- USE T8 %][%- USE HTML %][%- USE L %][%- USE LxERP %]
+[% USE T8 %]
+[% USE HTML %]
+[% USE L %]
+[% USE LxERP %]
 
 <form method="post" id="multi_items_form" method="POST">
 
-<table id='multi_items_filter_table'>
-  <tr>
-    <th>[%- LxERP.t8("Description") %]/[%- LxERP.t8("Partnumber") %]:</th>
-    <td>[%- L.input_tag('multi_items.filter.all:substr:multi::ilike', '') %]</td>
-    <th>[%- LxERP.t8("Partsgroup") %]</th>
-    <td>[%- L.select_tag('multi_items.filter.partsgroup_id', all_partsgroups, title_key='displayable_name', value_key='id', with_empty=1) %]</td>
-  <tr>
-</table>
+<div class="select-item control-panel">
+  <table id='multi_items_filter_table' class="tbl-plain">
+    <tr>
+      <th>
+        <span class="label above">[% LxERP.t8("Description") %]/[% LxERP.t8("Partnumber") %]:</span><br>
+        [% L.input_tag('multi_items.filter.all:substr:multi::ilike', '', class='wi-mediumsmall') %]
+      </th>
+      <th>
+        <span class="label above">[% LxERP.t8("Partsgroup") %]:</span><br>
+        [% L.select_tag('multi_items.filter.partsgroup_id', all_partsgroups, title_key='displayable_name', value_key='id', with_empty=1, class='wi-mediumsmall') %]
+      </th>
+    <tr>
+  </table>
+</div>
 
-[% L.button_tag('kivi.Order.multi_items_dialog_update_result()', LxERP.t8('Filter')) %]
-[% L.button_tag('$("#multi_items_form").resetForm()', LxERP.t8('Reset')) %]
+<div class="buttons">
+  [% L.button_tag('kivi.Order.multi_items_dialog_update_result()', LxERP.t8('Filter'), class='neutral') %]
+  [% L.button_tag('$("#multi_items_form").resetForm()', LxERP.t8('Reset'), class='neutral') %]
+</div>
 
-<hr>
-<div id='multi_items_result'></div>
-<hr>
-
-[% L.button_tag('kivi.Order.add_multi_items()', LxERP.t8('Continue'), id='multi_items_dialog_continue_button') %]
-<a href="#" onclick="kivi.Order.close_multi_items_dialog();">[%- LxERP.t8("Cancel") %]</a>
+<div id='multi_items_result' class="wrapper"></div>
 
+<div class="buttons">
+  [% L.button_tag('kivi.Order.add_multi_items()', LxERP.t8('Continue'), id='multi_items_dialog_continue_button', class="button") %]
+  <a href="#" onclick="kivi.Order.close_multi_items_dialog();" class="button neutral">[% LxERP.t8("Cancel") %]</a>
+</div>
 
 </form>
diff --git a/templates/webpages/order/tabs/_multi_items_result.html b/templates/webpages/order/tabs/_multi_items_result.html
index 527328a1c..d693b8ebb 100644
--- a/templates/webpages/order/tabs/_multi_items_result.html
+++ b/templates/webpages/order/tabs/_multi_items_result.html
@@ -1,24 +1,43 @@
-[%- USE T8 %][%- USE HTML %][%- USE L %][%- USE LxERP %]
+[% USE T8 %]
+[% USE HTML %]
+[% USE L %]
+[% USE LxERP %]
 
-<table width="100%">
+<table class="tbl-list wi-moderate">
+  <thead>
     <tr>
-      <td>[% 'for all' | $T8 %]
-      <td>[% L.input_tag("multi_items.all_qty", '', size = 5, class='numeric') %]</td>
+      <th>[% 'for all' | $T8 %]</th>
+      <th>[% L.input_tag("multi_items.all_qty", '', size = 5, class='numeric') %]</td>
+      <th></th>
+      <th>[% 'Article No.' | $T8 %]</th>
+      <th>[% 'Article Name' | $T8 %]</th>
     </tr>
-    <tr>
-      <td colspan="5"><hr></td>
-    </tr>
-  [%- FOREACH item = multi_items %]
-    <tr>
-      <td></td>
-      <td>
-        [% L.hidden_tag("add_multi_items[+].parts_id", item.id) %]
-        [% L.input_tag("add_multi_items[].qty_as_number", '', size = 5,
-                       class = 'multi_items_qty numeric', onclick = 'kivi.Order.set_input_to_one(this)') %]
-      </td>
-      <td>[% HTML.escape(item.unit) %]</td>
-      <td>[% HTML.escape(item.partnumber) %]</td>
-      <td>[% HTML.escape(item.description) %]</td>
-    </tr>
-  [%- END %]
+  </thead>
+  <tbody>
+    [% FOREACH item = multi_items %]
+      <tr>
+        <td></td>
+        <td>
+          [% L.hidden_tag("add_multi_items[+].parts_id", item.id) %]
+          [% L.input_tag("add_multi_items[].qty_as_number", '', class = 'multi_items_qty numeric wi-verysmall', onclick = 'kivi.Order.set_input_to_one(this)') %]
+        </td>
+        <td>[% HTML.escape(item.unit) %]</td>
+        <td>[% HTML.escape(item.partnumber) %]</td>
+        <td>[% HTML.escape(item.description) %]</td>
+      </tr>
+    [% END %]
+  </tbody>
 </table>
+
+<script type='text/javascript'>
+  function set_qty_to_one(clicked) {
+    if ($(clicked).val() == '') {
+      $(clicked).val('[% LxERP.format_amount(1.00, -2) %]');
+    }
+    $(clicked).select();
+  }
+
+  $('#multi_items_all_qty').change(function(event){
+    $('.multi_items_qty').val($(event.target).val());
+  });
+</script>
diff --git a/templates/webpages/order/tabs/_price_sources_dialog.html b/templates/webpages/order/tabs/_price_sources_dialog.html
index be05c6209..2ded877e5 100644
--- a/templates/webpages/order/tabs/_price_sources_dialog.html
+++ b/templates/webpages/order/tabs/_price_sources_dialog.html
@@ -1,90 +1,112 @@
-[%- USE T8 %]
-[%- USE HTML %]
-[%- USE L %]
-[%- USE LxERP %]
+[% USE T8 %]
+[% USE HTML %]
+[% USE L %]
+[% USE LxERP %]
 [% SET best_price = price_source.best_price %]
 [% SET best_discount = price_source.best_discount %]
 [% SET price_editable = AUTH.assert('edit_prices', 1) %]
-  <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.Order.update_price_source(\'' _ FORM.item_id _ '\', \'\', \'' _ LxERP.t8('None (PriceSource)') _ '\', \'\', ' _ price_editable _ ')', 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.Order.update_price_source(\'' _ FORM.item_id _ '\', \'' _ price.source _ '\', \'' _ price.source_description _ '\', \'' _ LxERP.format_amount(price.price, -2) _ '\', ' _ price_editable _ ')', LxERP.t8('Select')) %]</td>
-[%- ELSIF price_source.record_item.sellprice * 1 != price.price * 1 %]
-     <td>[% L.button_tag('kivi.Order.update_price_source(\'' _ FORM.item_id _ '\', \'' _ price.source _ '\', \'' _ price.source_description _ '\', \'' _ LxERP.format_amount(price.price, -2) _ '\', ' _ price_editable _ ')', LxERP.t8('Update Price')) %]</td>
-[%- ELSE %]
-    <td><b>[% 'Selected' | $T8 %]</b></td>
-[% END %]
-     <td>[% price.source_description | html %]</td>
-     <td>[% 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>
+<h2>[% 'Prices' | $T8 %]</h2>
+
+
+<table class="tbl-list">
+  <thead>
+    <tr>
+      <th></th>
+      <th>[% 'Price Source' | $T8 %]</th>
+      <th>[% 'Price' | $T8 %]</th>
+      <th>[% '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 und L.button_tag() deaktivieren oder loeschen (3 Stueck hier, siehe weiter unten) -->
+        <a class="button neutral" onclick="kivi.Order.update_price_source('[% FORM.item_id %]', '', '[% LxERP.t8('None (PriceSource)') %]' , '', [% price_editable %])">[% LxERP.t8('Select') %] </a>
+        [% #L.button_tag('kivi.Order.update_price_source(\'' _ FORM.item_id _ '\', \'\', \'' _ LxERP.t8('None (PriceSource)') _ '\', \'\', ' _ price_editable _ ')', LxERP.t8('Select')) %]
+        </td>
+      [% ELSE %]
+        <td><b>[% 'Selected' | $T8 %]</b></td>
+      [% END %]
+      <td>[% 'None (PriceSource)' | $T8 %]</td>
+      <td>-</td>
+      <td></td>
+      <td></td>
     </tr>
-   [%- END %]
-  </table>
+    [% 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.Order.update_price_source('[% FORM.item_id %]', '[% price.source %]', '[% price.source_description %]', '[% LxERP.format_amount(price.price, -2) %]', [% price_editable %])">[% LxERP.t8('Select') %] </a>
+          [% #L.button_tag('kivi.Order.update_price_source(\'' _ FORM.item_id _ '\', \'' _ price.source _ '\', \'' _ price.source_description _ '\', \'' _ LxERP.format_amount(price.price, -2) _ '\', ' _ price_editable _ ')', ) %]
+        </td>
+      [% ELSIF price_source.record_item.sellprice * 1 != price.price * 1 %]
+        <td>
+          <a class="button neutral" onclick="kivi.Order.update_price_source('[% FORM.item_id %]', '[% price.source %]', '[% price.source_description %]', '[% LxERP.format_amount(price.price, -2) %]', [% price_editable %])">[% LxERP.t8('Update Price') %] </a>
+          [% #L.button_tag('kivi.Order.update_price_source(\'' _ FORM.item_id _ '\', \'' _ price.source _ '\', \'' _ price.source_description _ '\', \'' _ LxERP.format_amount(price.price, -2) _ '\', ' _ price_editable _ ')', LxERP.t8('Update Price')) %]
+        </td>
+      [% ELSE %]
+        <td><b>[% 'Selected' | $T8 %]</b></td>
+      [% END %]
+      <td>[% price.source_description | html %]</td>
+      <td>[% price.price_as_number %]</td>
+      [% IF price.source == best_price.source %]
+        <td>&#x2022;</td>
+      [% ELSE %]
+        <td></td>
+      [% END %]
+      <td>[% price.description | html %]</td>
+    </tr>
+    [% END %]
+  </tbody>
+</table>
+
 
-  <h2>[% 'Discounts' | $T8 %]</h2>
+<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.Order.update_discount_source(\'' _ FORM.item_id _ '\', \'\', \'' _ LxERP.t8('None (PriceSource Discount)') _ '\', \'\', ' _ price_editable _ ')', 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.Order.update_discount_source(\'' _ FORM.item_id _ '\', \'' _ price.source _ '\', \'' _ price.source_description _ '\', \'' _ price.discount_as_percent _ '\', ' _ price_editable _ ')', LxERP.t8('Select')) %]</td>
-[%- ELSIF price_source.record_item.discount * 1 != price.discount * 1 %]
-     <td>[% L.button_tag('kivi.Order.update_discount_source(\'' _ FORM.item_id _ '\', \'' _ price.source _ '\', \'' _ price.source_description _ '\', \'' _ price.discount_as_percent  _ '\', ' _ price_editable _ ')', 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-list">
+  <thead>
+    <tr>
+      <th></th>
+      <th>[% 'Price Source' | $T8 %]</th>
+      <th>[% 'Discount' | $T8 %]</th>
+      <th>[% 'Best Discount' | $T8 %]</th>
+      <th>[% 'Details' | $T8 %]</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      [% IF price_source.record_item.active_discount_source %]
+        <td>[% L.button_tag('kivi.Order.update_discount_source(\'' _ FORM.item_id _ '\', \'\', \'' _ LxERP.t8('None (PriceSource Discount)') _ '\', \'\', ' _ price_editable _ ')', 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>
-   [%- END %]
-  </table>
+    [% FOREACH price IN price_source.available_discounts %]
+    <tr >
+      [% IF price_source.record_item.active_discount_source != price.source %]
+        <td>[% L.button_tag('kivi.Order.update_discount_source(\'' _ FORM.item_id _ '\', \'' _ price.source _ '\', \'' _ price.source_description _ '\', \'' _ price.discount_as_percent _ '\', ' _ price_editable _ ')', LxERP.t8('Select')) %]</td>
+      [% ELSIF price_source.record_item.discount * 1 != price.discount * 1 %]
+        <td>[% L.button_tag('kivi.Order.update_discount_source(\'' _ FORM.item_id _ '\', \'' _ price.source _ '\', \'' _ price.source_description _ '\', \'' _ price.discount_as_percent _ '\', ' _ price_editable _ ')', 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>&#x2022;</td>
+      [% ELSE %]
+        <td></td>
+      [% END %]
+      <td>[% price.description | html %]</td>
+    </tr>
+    [% END %]
+  </tbody>
+</table>
+
diff --git a/templates/webpages/order/tabs/_row.html b/templates/webpages/order/tabs/_row.html
index 967c94ba9..604aa2b27 100644
--- a/templates/webpages/order/tabs/_row.html
+++ b/templates/webpages/order/tabs/_row.html
@@ -1,141 +1,137 @@
-[%- USE T8 %]
-[%- USE HTML %]
-[%- USE LxERP %]
-[%- USE L %]
-[%- USE P %]
+[% USE T8 %]
+[% USE HTML %]
+[% USE LxERP %]
+[% USE L %]
+[% USE P %]
 
-<tbody class="row_entry listrow"[%- IF MYCONFIG.show_form_details -%] data-expanded="1"[%- END -%]>
+<tbody class="row_entry listrow"[% IF MYCONFIG.show_form_details %] data-expanded="1"[% END %]>
   <tr>
-    <td align="center">
-      [%- IF MYCONFIG.show_form_details %]
+    <td>
+      [% IF MYCONFIG.show_form_details %]
         [% L.img_tag(src="image/collapse.svg",
                      alt=LxERP.t8('Hide details'), title=LxERP.t8('Hide details'), class="expand") %]
-      [%- ELSE %]
+      [% ELSE %]
         [% L.img_tag(src="image/expand.svg",
                      alt=LxERP.t8('Show details'), title=LxERP.t8('Show details'), class="expand") %]
-      [%- END %]
+      [% END %]
       [% L.hidden_tag("orderitem_ids[+]", ID) %]
       [% L.hidden_tag("converted_from_orderitems_ids[+]", ITEM.converted_from_orderitems_id) %]
       [% L.hidden_tag("order.orderitems[+].id", ITEM.id, id='item_' _ ID) %]
       [% L.hidden_tag("order.orderitems[].parts_id", ITEM.parts_id) %]
     </td>
+    <td class="center"><div name="position">[% HTML.escape(ITEM.position) %]</div></td>
+    <td><img src="image/updown.png" alt="[% LxERP.t8('reorder item') %]" class="dragdrop"></td>
     <td>
-      <div name="position" class="numeric">
-        [% HTML.escape(ITEM.position) %]
-      </div>
-    </td>
-    <td align="center">
-      <img src="image/updown.png" alt="[%- LxERP.t8('reorder item') %]" class="dragdrop">
-    </td>
-    <td align="center">
-      [%- L.button_tag("kivi.Order.delete_order_item_row(this)",
-                       LxERP.t8("X"),
-                       confirm=LxERP.t8("Are you sure?")) %]
-    </td>
-    <td>
-      <div name="partnumber">[% HTML.escape(ITEM.part.partnumber) %]</div>
-    </td>
-    <td>
-      <div name="partclassification">[% ITEM.part.presenter.typeclass_abbreviation %]</div>
-    </td>
+      [% # L.button_tag("kivi.Order.delete_order_item_row(this)",
+      #                "", #LxERP.t8("X"),
+      #                confirm=LxERP.t8("Are you sure?"),
+      #                class='button-image delete') %]
+      [%  L.button_tag("kivi.Order.delete_order_item_row(this)",
+                      " ", #LxERP.t8("X"),
+                      confirm=LxERP.t8("Are you sure?"),
+                      class='button_image delete',
+                      tag='button') %]
+      [% #L.link_tag( 'javascript:kivi.Order.delete_order_item_row(this)', '<img src="image/cross.png" alt="Delete">', confirm=>LxERP.t8('Are you sure?'), class=>'button-image delete' ) %]
+      [% #L.link_tag( "http://google.com", "Go to Google", class=>"button-image delete", target=>"_blank" ) %]X
+    </td>
+    <td><div name="partnumber">[% HTML.escape(ITEM.part.partnumber) %]</div></td>
+    <td><div name="partclassification">[% ITEM.part.presenter.typeclass_abbreviation %]</div></td>
     <td>
       [% L.areainput_tag("order.orderitems[].description",
                      ITEM.description,
                      size='40',
-                     style='width: 300px') %]
-      [%- IF ITEM.render_longdescription -%]
-        [%- L.hidden_tag("order.orderitems[].longdescription", ITEM.longdescription) %]
-      [%- END -%]
-      [%- L.button_tag("kivi.Order.show_longdescription_dialog(this)", LxERP.t8("L")) %]
+                     class='wi-lightwide') %]
+      [% IF ITEM.render_longdescription %]
+        [% L.hidden_tag("order.orderitems[].longdescription", ITEM.longdescription) %]
+      [% END %]
+      [% L.button_tag("kivi.Order.show_longdescription_dialog(this)", LxERP.t8("L"), class="wi-tiny neutral") %]
     </td>
     [%- IF (TYPE == "sales_order" || TYPE == "purchase_order") -%]
-    <td nowrap>
+    <td>
       [%- L.div_tag(LxERP.format_amount(ITEM.shipped_qty, 2, 0) _ ' ' _ ITEM.unit, name="shipped_qty", class="numeric") %]
     </td>
     [%- END -%]
-    <td nowrap>
-      [%- L.input_tag("order.orderitems[].qty_as_number",
+    <td>
+      [% L.input_tag("order.orderitems[].qty_as_number",
                       ITEM.qty_as_number,
                       size = 5,
-                      class="recalc reformat_number numeric") %]
-      [%- IF ITEM.part.formel -%]
-        [%- L.button_tag("kivi.Order.show_calculate_qty_dialog(this)", LxERP.t8("*/")) %]
-        [%- L.hidden_tag("formula[+]", ITEM.part.formel) -%]
-      [%- END -%]
+                      class="recalc reformat_number numeric wi-verysmall") %]
+      [% IF ITEM.part.formel %]
+        [% L.button_tag("kivi.Order.show_calculate_qty_dialog(this)", LxERP.t8("*/"), class="neutral") %]
+        [% L.hidden_tag("formula[+]", ITEM.part.formel) %]
+      [% END %]
     </td>
     <td>
-      [%- L.select_tag("order.orderitems[].price_factor_id",
+      [% L.select_tag("order.orderitems[].price_factor_id",
                        ALL_PRICE_FACTORS,
                        default = ITEM.price_factor_id,
                        title_key = 'description',
                        with_empty = 1,
-                       class="recalc") %]
+                       class="recalc wi-mediumsmall") %]
     </td>
-    <td nowrap>
-      [%- L.select_tag("order.orderitems[].unit",
+    <td>
+      [% L.select_tag("order.orderitems[].unit",
                       ITEM.part.available_units,
                       default = ITEM.unit,
                       title_key = 'name',
                       value_key = 'name',
-                      class = 'unitselect') %]
+                      class = 'unitselect wi-mediumsmall') %]
     </td>
     <td>
-      [%- L.button_tag("kivi.Order.price_chooser_item_row(this)",
+      [% L.button_tag("kivi.Order.price_chooser_item_row(this)",
                        ITEM.active_price_source.source_description _ ' | ' _ ITEM.active_discount_source.source_description,
-                       name = "price_chooser_button") %]
+                       name = "price_chooser_button",
+                       class = "neutral") %]
     </td>
     <td>
-      [%- L.hidden_tag("order.orderitems[].active_price_source", ITEM.active_price_source.source) %]
-      [%- SET EDIT_PRICE = (AUTH.assert('edit_prices', 1) && ITEM.active_price_source.source == '') %]
-      <div name="editable_price" [%- IF !EDIT_PRICE %]style="display:none"[%- END %] class="numeric">
-        [%- L.input_tag("order.orderitems[].sellprice_as_number",
+      [% L.hidden_tag("order.orderitems[].active_price_source", ITEM.active_price_source.source) %]
+      [% SET EDIT_PRICE = (AUTH.assert('edit_prices', 1) && ITEM.active_price_source.source == '') %]
+      <div name="editable_price" [% IF !EDIT_PRICE %]style="display:none"[% END %] class="numeric">
+        [% L.input_tag("order.orderitems[].sellprice_as_number",
                         ITEM.sellprice_as_number,
                         size = 10,
                         disabled=(EDIT_PRICE? '' : 1),
-                        class="recalc reformat_number numeric") %]
+                        class="recalc reformat_number numeric wi-verysmall") %]
       </div>
-      <div name="not_editable_price" [%- IF EDIT_PRICE %]style="display:none"[%- END %]>
-        [%- L.div_tag(ITEM.sellprice_as_number, name="sellprice_text", class="numeric") %]
-        [%- L.hidden_tag("order.orderitems[].sellprice_as_number",
+      <div name="not_editable_price" [% IF EDIT_PRICE %]style="display:none"[% END %]>
+        [% L.div_tag(ITEM.sellprice_as_number, name="sellprice_text", class="numeric plain-data") %]  <!-- PENDENT: plain-data in DIV noch dem CSS hinzufuegen -->
+        [% L.hidden_tag("order.orderitems[].sellprice_as_number",
                          ITEM.sellprice_as_number,
+
                          disabled=(EDIT_PRICE? 1 : '')) %]
       </div>
     </td>
     <td>
-      [%- L.hidden_tag("order.orderitems[].active_discount_source", ITEM.active_discount_source.source) %]
-      [%- SET EDIT_DISCOUNT = (AUTH.assert('edit_prices', 1) && ITEM.active_discount_source.source == '') %]
-      <div name="editable_discount" [%- IF !EDIT_DISCOUNT %]style="display:none"[%- END %] class="numeric">
-        [%- L.input_tag("order.orderitems[].discount_as_percent",
+      [% L.hidden_tag("order.orderitems[].active_discount_source", ITEM.active_discount_source.source) %]
+      [% SET EDIT_DISCOUNT = (AUTH.assert('edit_prices', 1) && ITEM.active_discount_source.source == '') %]
+      <div name="editable_discount" [% IF !EDIT_DISCOUNT %]style="display:none"[% END %] class="numeric">
+        [% L.input_tag("order.orderitems[].discount_as_percent",
                         ITEM.discount_as_percent,
                         size = 5,
                         disabled=(EDIT_DISCOUNT? '' : 1),
                         class="recalc reformat_number numeric") %]
       </div>
-      <div name="not_editable_discount" [%- IF EDIT_DISCOUNT %]style="display:none"[%- END %]>
-        [%- L.div_tag(ITEM.discount_as_percent, name="discount_text", class="numeric") %]
-        [%- L.hidden_tag("order.orderitems[].discount_as_percent",
+      <div name="not_editable_discount" [% IF EDIT_DISCOUNT %]style="display:none"[% END %]>
+        [% L.div_tag(ITEM.discount_as_percent, name="discount_text", class="numeric") %]
+        [% L.hidden_tag("order.orderitems[].discount_as_percent",
                          ITEM.discount_as_percent,
                          disabled=(EDIT_DISCOUNT? 1 : '')) %]
       </div>
     </td>
-    <td align="right">
-      [%- L.div_tag(LxERP.format_amount(ITEM.linetotal, 2, 0), name="linetotal") %]
-    </td>
-
+    <td>[% L.div_tag(LxERP.format_amount(ITEM.linetotal, 2, 0), name="linetotal") %]</td>
   </tr>
-
-  <tr [%- IF !MYCONFIG.show_form_details -%]style="display:none"[%- END -%]>
+  <tr [% IF !MYCONFIG.show_form_details %]style="display:none"[% END %]>
     <td colspan="100%">
-      [%- IF MYCONFIG.show_form_details || ITEM.render_second_row %]
+      [% IF MYCONFIG.show_form_details || ITEM.render_second_row %]
         <div name="second_row" data-loaded="1">
-          [%- PROCESS order/tabs/_second_row.html ITEM=ITEM TYPE=TYPE %]
+          [% PROCESS order/tabs/_second_row.html ITEM=ITEM TYPE=TYPE %]
         </div>
-      [%- ELSE %]
+      [% ELSE %]
         <div name="second_row">
-          [%- LxERP.t8("Loading...") %]
+          [% LxERP.t8("Loading...") %]
         </div>
-      [%- END %]
+      [% END %]
     </td>
   </tr>
-
 </tbody>
+
diff --git a/templates/webpages/order/tabs/_second_row.html b/templates/webpages/order/tabs/_second_row.html
index 046224fa1..fc162bfe8 100644
--- a/templates/webpages/order/tabs/_second_row.html
+++ b/templates/webpages/order/tabs/_second_row.html
@@ -1,63 +1,56 @@
-[%- USE T8 %]
-[%- USE HTML %]
-[%- USE LxERP %]
-[%- USE L %]
-[%- USE P %]
+[% USE T8 %]
+[% USE HTML %]
+[% USE LxERP %]
+[% USE L %]
+[% USE P %]
 
 <table>
-  <tr><td colspan="100%">
-    [%- IF (TYPE == "sales_order" || TYPE == "purchase_order") %]
-      <b>[%- 'Serial No.' | $T8 %]</b>&nbsp;
-      [%- L.input_tag("order.orderitems[].serialnumber", ITEM.serialnumber, size = 15) %]&nbsp;
-    [%- END %]
-    <b>[%- 'Project' | $T8 %]</b>&nbsp;
-    [% P.project.picker("order.orderitems[].project_id", ITEM.project_id, size = 15) %]&nbsp;
-    [%- IF (TYPE == "sales_order" || TYPE == "purchase_order") %]
-      <b>[%- 'Reqdate' | $T8 %]</b>&nbsp;
-      [% L.date_tag("order.orderitems[].reqdate_as_date", ITEM.reqdate_as_date) %]&nbsp;
-    [%- END %]
-    <b>[%- 'Subtotal' | $T8 %]</b>&nbsp;
-    [% L.yes_no_tag("order.orderitems[].subtotal", ITEM.subtotal) %]&nbsp;
-    [%- IF (TYPE == "sales_order" || TYPE == "sales_quotation") %]
-      <b>[%- 'Ertrag' | $T8 %]</b>&nbsp;
-        <span name="linemargin">
-          <span[%- IF ITEM.marge_total < 0 -%] class="plus0"[%- END -%]>
-            [%- LxERP.format_amount(ITEM.marge_total, 2, 0) %]&nbsp;&nbsp;
-            [%- LxERP.format_amount(ITEM.marge_percent, 2, 0) %]%
-          </span>
-       </span>&nbsp;
-      <b>[%- 'LP' | $T8 %]</b>&nbsp;
-      [%- LxERP.format_amount(ITEM.part.listprice, 2, 0) %]&nbsp;
-      <b>[%- 'EK' | $T8 %]</b>&nbsp;
-        [%- L.input_tag("order.orderitems[].lastcost_as_number",
-                        ITEM.lastcost_as_number,
-                        size = 5,
-                        class="recalc reformat_number numeric") %]&nbsp;
-    [%- END %]
-    <b>[%- 'On Hand' | $T8 %]</b>&nbsp;
-      <span[%- IF ITEM.part.onhand < ITEM.part.rop -%] class="plus0"[%- END -%]>
-        [%- LxERP.format_amount(ITEM.part.onhand_as_number, 2, 0) -%]&nbsp;[%- ITEM.part.unit -%]
-      </span>&nbsp;
-  </td></tr>
-
   <tr>
-    [%- SET n = 0 %]
-    [%- FOREACH var = ITEM.cvars_by_config %]
-    [%- NEXT UNLESS (var.config.processed_flags.editable && ITEM.part.cvar_by_name(var.config.name).is_valid) %]
-    [%- SET n = n + 1 %]
-    <th>
-      [% var.config.description %]
-    </th>
     <td>
-      [% L.hidden_tag('order.orderitems[].custom_variables[+].config_id', var.config.id) %]
-      [% L.hidden_tag('order.orderitems[].custom_variables[].id', var.id) %]
-      [% L.hidden_tag('order.orderitems[].custom_variables[].sub_module', var.sub_module) %]
-      [% INCLUDE 'common/render_cvar_input.html' var_name='order.orderitems[].custom_variables[].unparsed_value' %]
+      [% IF (TYPE == "sales_order" || TYPE == "purchase_order") %]
+        <b>[% 'Serial No.' | $T8 %]</b> [% L.input_tag("order.orderitems[].serialnumber", ITEM.serialnumber, size = 15) %]
+      [% END %]
+      <b>[% 'Project' | $T8 %]</b> [% P.project.picker("order.orderitems[].project_id", ITEM.project_id, size = 15) %]
+      [% IF (TYPE == "sales_order" || TYPE == "purchase_order") %]
+        <b>[% 'Reqdate' | $T8 %]</b> [% L.date_tag("order.orderitems[].reqdate_as_date", ITEM.reqdate_as_date) %] 
+      [% END %]
+      <b>[% 'Subtotal' | $T8 %]</b> [% L.yes_no_tag("order.orderitems[].subtotal", ITEM.subtotal) %] 
+      [% IF (TYPE == "sales_order" || TYPE == "sales_quotation") %]
+        <b>[% 'Ertrag' | $T8 %]</b> 
+          <span name="linemargin">
+            <span[% IF ITEM.marge_total < 0 %] class="plus0"[% END %]>
+              [% LxERP.format_amount(ITEM.marge_total, 2, 0) %]  
+              [% LxERP.format_amount(ITEM.marge_percent, 2, 0) %]%
+            </span>
+         </span> 
+        <b> [% 'LP' | $T8 %]</b> 
+        [% LxERP.format_amount(ITEM.part.listprice, 2, 0) %] 
+        <b>[% 'EK' | $T8 %]</b> 
+          [% L.input_tag("order.orderitems[].lastcost_as_number",
+                          ITEM.lastcost_as_number,
+                          size = 5,
+                          class="recalc reformat_number numeric") %] 
+      [% END %]
+      <b>[% 'On Hand' | $T8 %]</b> 
+        <span[% IF ITEM.part.onhand < ITEM.part.rop %] class="plus0"[% END %]>
+          [% LxERP.format_amount(ITEM.part.onhand_as_number, 2, 0) %] [% ITEM.part.unit %]
+        </span> 
     </td>
-    [%- IF (n % (MYCONFIG.form_cvars_nr_cols || 3)) == 0 %]
-
-  </tr><tr>
-    [%- END %]
-    [%- END %]
+  </tr>
+  <tr>
+    [% SET n = 0 %]
+    [% FOREACH var = ITEM.cvars_by_config %]
+      [% NEXT UNLESS (var.config.processed_flags.editable && ITEM.part.cvar_by_name(var.config.name).is_valid) %]
+      [% SET n = n + 1 %]
+      <td>
+        [% L.hidden_tag('order.orderitems[].custom_variables[+].config_id', var.config.id) %]
+        [% L.hidden_tag('order.orderitems[].custom_variables[].id', var.id) %]
+        [% L.hidden_tag('order.orderitems[].custom_variables[].sub_module', var.sub_module) %]
+        [% INCLUDE 'common/render_cvar_input.html' var_name='order.orderitems[].custom_variables[].unparsed_value' %]
+      </td>
+      [% IF (n % (MYCONFIG.form_cvars_nr_cols || 3)) == 0 %]
+        </tr><tr>
+      [% END %]
+    [% END %]
   </tr>
 </table>
diff --git a/templates/webpages/order/tabs/_tax_row.html b/templates/webpages/order/tabs/_tax_row.html
index aa09a3a86..53f6fdb4b 100644
--- a/templates/webpages/order/tabs/_tax_row.html
+++ b/templates/webpages/order/tabs/_tax_row.html
@@ -1,15 +1,17 @@
-[%- USE T8 %]
-[%- USE HTML %]
-[%- USE LxERP %]
-[%- USE L %]
+[% USE T8 %]
+[% USE HTML %]
+[% USE LxERP %]
+[% USE L %]
 
 <tr class="tax_row">
-  <th align="right">[%- IF TAXINCLUDED %][%- 'Including' | $T8 %]&nbsp;[%- END %][%- TAX.tax.taxdescription %] [% TAX.tax.rate_as_percent %]%</th>
-  <td align="right">[%- LxERP.format_amount(TAX.amount, 2, 0) %]</td>
+  <td colspan="10"></td>
+  <th colspan="3">[% IF TAXINCLUDED %][% 'Including' | $T8 %]&nbsp;[% END %][% TAX.tax.taxdescription %] [% TAX.tax.rate_as_percent %]%</th>
+  <td class="numeric">[% LxERP.format_amount(TAX.amount, 2, 0) %]</td>
 </tr>
-[%- IF TAXINCLUDED %]
+[% IF TAXINCLUDED %]
 <tr class="tax_row">
-  <th align="right">[%- 'Net amount' | $T8 %]</th>
-  <td align="right">[%- LxERP.format_amount(TAX.netamount, 2, 0) %]</td>
+  <td colspan="10"></td>
+  <th colspan="3">[% 'Net amount' | $T8 %]</th>
+  <td class="numeric">[% LxERP.format_amount(TAX.netamount, 2, 0) %]</td>
 </tr>
-[%- END%]
+[% END%]
diff --git a/templates/webpages/order/tabs/basic_data.html b/templates/webpages/order/tabs/basic_data.html
index a3fa939d2..05d47f462 100644
--- a/templates/webpages/order/tabs/basic_data.html
+++ b/templates/webpages/order/tabs/basic_data.html
@@ -1,351 +1,307 @@
-[%- USE T8 %]
-[%- USE HTML %]
-[%- USE LxERP %]
-[%- USE L %]
-[%- USE P %]
+[% USE T8 %]
+[% USE HTML %]
+[% USE LxERP %]
+[% USE L %]
+[% USE P %]
 
-[%- INCLUDE 'generic/set_longdescription.html' %]
+[% INCLUDE 'generic/set_longdescription.html' %]
 
 <div id="ui-tabs-basic-data">
-  <table width="100%">
-    <tr valign="top">
-      <td>
-        <table width="100%">
-          <tr>
-            <th align="right">[%- SELF.cv == "customer" ? LxERP.t8('Customer') : LxERP.t8('Vendor') -%]</th>
-            [% SET cv_id = SELF.cv _ '_id' %]
-            <td>
-              [% P.customer_vendor.picker("order.${SELF.cv}" _ '_id', SELF.order.$cv_id, type=SELF.cv, style='width: 300px') %]
-              [% P.button_tag("kivi.Order.show_vc_details_dialog()", LxERP.t8("Details (one letter abbreviation)")) %]
-            </td>
-          </tr>
-
-          <tr id='cp_row' [%- IF !SELF.order.${SELF.cv}.contacts.size %]style='display:none'[%- END %]>
-            <th align="right">[% 'Contact Person' | $T8 %]</th>
-            <td>[% L.select_tag('order.cp_id',
-                                SELF.order.${SELF.cv}.contacts,
-                                default=SELF.order.cp_id,
-                                title_key='full_name_dep',
-                                value_key='cp_id',
-                                with_empty=1,
-                                style='width: 300px') %]</td>
-          </tr>
-
-          <tr id='shipto_row' [%- IF !SELF.order.${SELF.cv}.shipto.size %]style='display:none'[%- END %]>
-            <th align="right">[% 'Shipping Address' | $T8 %]</th>
-            <td>[% L.select_tag('order.shipto_id',
-                                SELF.order.${SELF.cv}.shipto,
-                                default=SELF.order.shipto_id,
-                                title_key='displayable_id',
-                                value_key='shipto_id',
-                                with_empty=1,
-                                style='width: 300px') %]</td>
-          </tr>
-
-          [%- PROCESS order/tabs/_business_info_row.html SELF=SELF %]
-
-          <tr>
-            <th align="right">[% 'Steuersatz' | $T8 %]</th>
-            <td>[% L.select_tag('order.taxzone_id', SELF.all_taxzones, default=SELF.order.taxzone_id, title_key='description', style='width: 300px', class='recalc') %]</td>
-          </tr>
-
-[%- IF SELF.all_departments.size %]
-          <tr>
-            <th align="right">[% 'Department' | $T8 %]</th>
-            <td>
-              [% L.select_tag('order.department_id', SELF.all_departments, default=SELF.order.department_id, title_key='description', with_empty=1, style='width:300px') %]
-            </td>
-          </tr>
-[%- END %]
-
-          <tr>
-            <th align="right">[% 'Shipping Point' | $T8 %]</th>
-            <td>[% L.input_tag('order.shippingpoint', SELF.order.shippingpoint, style='width: 300px') %]</td>
-          </tr>
-
-          <tr>
-            <th align="right">[% 'Ship via' | $T8 %]</th>
-            <td>[% L.input_tag('order.shipvia', SELF.order.shipvia, style='width: 300px') %]</td>
-          </tr>
-
-          <tr>
-            <th align="right">[% 'Transaction description' | $T8 %]</th>
-            <td>[% L.input_tag('order.transaction_description', SELF.order.transaction_description, style='width: 300px') %]</td>
-          </tr>
-
-          <tr>
-            <th align="right">[% 'Project Number' | $T8 %]</th>
-            <td>[% P.project.picker('order.globalproject_id', SELF.order.globalproject_id, style='width: 300px') %]</td>
-          </tr>
-
-        </table>
-      </td>
-
-      <td align="right">
-        <table>
-
-          <tr>
-            <td colspan="2" align="center">
-              [%- IF SELF.order.id %]
-                <label for="order.delivered">[% 'Delivery Order(s) for full qty created' | $T8 %]</label>
-                [% L.yes_no_tag('order.delivered', SELF.order.delivered) %]
-                <label for="order.closed">[% 'Closed' | $T8 %]</label>
-                [% L.yes_no_tag('order.closed', SELF.order.closed) %]
-              [%- END %]
-            </td>
-          </tr>
-
-          <tr>
-            <th align="right">[% 'Employee' | $T8 %]</th>
-            <td>[% L.select_tag('order.employee_id',
-              SELF.all_employees,
-              default=(SELF.order.employee_id ? SELF.order.employee_id : SELF.current_employee_id),
-              title_key='safe_name') %]</td>
-          </tr>
-
-          [% IF SELF.cv == 'customer' %]
-          <tr>
-            <th align="right">[% 'Salesman' | $T8 %]</th>
-            <td>[% L.select_tag('order.salesman_id',
-              SELF.all_salesmen,
-              default=(SELF.order.salesman_id ? SELF.order.salesman_id : SELF.current_employee_id),
-              title_key='safe_name') %]</td>
-          </tr>
-          [% END %]
-
-          [%- IF (SELF.type == "sales_order" || SELF.type == "purchase_order") -%]
-          <tr>
-            <th width="70%" align="right" nowrap>[% 'Order Number' | $T8 %]</th>
-            <td>[% L.input_tag('order.ordnumber', SELF.order.ordnumber, size = 11, onchange='kivi.Order.set_number_in_title(this)') %]</td>
-          </tr>
-          [%- END -%]
-
-          [%- IF (SELF.type == "sales_order" || SELF.type == "sales_quotation") -%]
-            [%- SET quo_nr_txt = 'Quotation Number' -%]
-          [%- ELSE -%]
-            [%- SET quo_nr_txt = 'RFQ Number' -%]
-          [%- END -%]
-          <tr>
-            <th width="70%" align="right" nowrap>[% quo_nr_txt | $T8 %]</th>
-            [%- IF (SELF.type == "sales_order" || SELF.type == "purchase_order") -%]
-              <td>[% L.input_tag('order.quonumber', SELF.order.quonumber, size = 11) %]</td>
-            [%- ELSE -%]
-              <td>[% L.input_tag('order.quonumber', SELF.order.quonumber, size = 11, onchange='kivi.Order.set_number_in_title(this)') %]</td>
-            [%- END -%]
-          </tr>
-
-          [%- IF (SELF.type == "sales_order" || SELF.type == "purchase_order") -%]
-          <tr>
-            <th width="70%" align="right" nowrap>[% 'Customer Order Number' | $T8 %]</th>
-            <td>[% L.input_tag('order.cusordnumber', SELF.order.cusordnumber, size = 11) %]</td>
-          </tr>
-          [%- END -%]
-
-          [%- IF (SELF.type == "sales_order" || SELF.type == "purchase_order") -%]
-            [%- SET transdate_txt = 'Order Date' -%]
-          [%- ELSIF SELF.type == "sales_quotation" -%]
-            [%- SET transdate_txt = 'Quotation Date' -%]
-          [%- ELSE -%]
-            [%- SET transdate_txt = 'RFQ Date' -%]
-          [%- END -%]
-          <tr>
-            <th width="70%" align="right" nowrap>[% transdate_txt | $T8 %]</th>
-            <td>[% L.date_tag('order.transdate_as_date', SELF.order.transdate_as_date) %]</td>
-          </tr>
-
-          [%- IF (SELF.type == "sales_order" || SELF.type == "purchase_order") -%]
-            [%- SET reqdate_txt = 'Reqdate' -%]
-          [%- ELSIF SELF.type == "sales_quotation" -%]
-            [%- SET reqdate_txt = 'Valid until' -%]
-          [%- ELSE -%]
-            [%- SET reqdate_txt = 'Required by' -%]
-          [%- END -%]
-          <tr>
-            <th width="70%" align="right" nowrap>[% reqdate_txt | $T8 %]</th>
-            <td>[% L.date_tag('order.reqdate_as_date', SELF.order.reqdate_as_date) %]</td>
-          </tr>
-
-          [%- IF SELF.type == "sales_quotation" -%]
-          <tr>
-            <th width="70%" align="right" nowrap>[% 'Order probability' | $T8 %]</th>
-            <td>[%- L.select_tag('order.order_probability', SELF.order_probabilities, title='title', default=SELF.order.order_probability) %]%</td>
-          </tr>
-          <tr>
-            <th width="70%" align="right" nowrap>[% 'Expected billing date' | $T8 %]</th>
-            <td>[%- L.date_tag('order.expected_billing_date_as_date', SELF.order.expected_billing_date_sa_date) %]</td>
-          </tr>
-          [%- END %]
-
-          <tr>
-            <th width="70%" align="right" nowrap>[% 'Insert Date' | $T8 %]</th>
-            <td>[% SELF.order.itime_as_date %]</td>
-          </tr>
-
-        </table>
+<!-- PENDENT: EXPERIMENTELL -->
+
+
+<div class="wrapper" id="wrapper-1">
+[% INCLUDE 'generic/toggle_wrapper.html' %]
+
+<div class="col">
+
+  <table class="tbl-horizontal col">
+    <caption>[% 'Customer & Order info' | $T8 %]</caption>
+    <colgroup><col class="wi-mediumsmall"><col class="wi-lightwide"></colgroup>
+    <tbody>
+      <tr>
+        <th>[%- SELF.cv == "customer" ? LxERP.t8('Customer') : LxERP.t8('Vendor') -%]</th>
+        [% SET cv_id = SELF.cv _ '_id' %]
+        <td class="wi-lightwide">
+          [% P.customer_vendor.picker("order.${SELF.cv}" _ '_id', SELF.order.$cv_id, type=SELF.cv, class='wi-lightwide') %]
+          [% #P.button_tag("kivi.Order.show_vc_details_dialog()", LxERP.t8("Details (one letter abbreviation)"), class='wi-tiny neutral') %]
+          <a href="javascript:kivi.Order.show_vc_details_dialog();" title="[% 'Show detail informationen' | $T8 %]" class="button-image info"><img src="image/detail.png"></a>
+        </td>
+      </tr>
+      <tr id='cp_row' [% IF !SELF.order.${SELF.cv}.contacts.size %]style='display:none'[% END %]>
+        <th>[% 'Contact Person' | $T8 %]</th>
+        <td>[% L.select_tag('order.cp_id',
+                            SELF.order.${SELF.cv}.contacts,
+                            default=SELF.order.cp_id,
+                            title_key='full_name_dep',
+                            value_key='cp_id',
+                            with_empty=1,
+                            class='wi-lightwide') %]</td>
+      </tr>
+      <tr id='shipto_row' [% IF !SELF.order.${SELF.cv}.shipto.size %]style='display:none'[% END %]>
+        <th>[% 'Shipping Address' | $T8 %]</th>
+        <td>[% L.select_tag('order.shipto_id',
+                            SELF.order.${SELF.cv}.shipto,
+                            default=SELF.order.shipto_id,
+                            title_key='displayable_id',
+                            value_key='shipto_id',
+                            with_empty=1,
+                            class='wi-lightwide') %]</td>
+      </tr>
+      [% PROCESS order/tabs/_business_info_row.html SELF=SELF %]
+      <tr>
+        <th>[% 'Steuersatz' | $T8 %]</th>
+        <td>[% L.select_tag('order.taxzone_id', SELF.all_taxzones, default=SELF.order.taxzone_id, title_key='description', class='recalc wi-lightwide') %]</td>
+      </tr>
+      [% IF SELF.all_departments.size %]
+        <tr>
+          <th>[% 'Department' | $T8 %]</th>
+          <td>
+            [% L.select_tag('order.department_id', SELF.all_departments, default=SELF.order.department_id, title_key='description', with_empty=1, class='wi-lightwide') %]
+          </td>
+        </tr>
+      [% END %]
+      <tr>
+        <th>[% 'Shipping Point' | $T8 %]</th>
+        <td>[% L.input_tag('order.shippingpoint', SELF.order.shippingpoint, class='wi-lightwide') %]</td>
+      </tr>
+      <tr>
+        <th>[% 'Ship via' | $T8 %]</th>
+        <td>[% L.input_tag('order.shipvia', SELF.order.shipvia, class='wi-lightwide') %]</td>
+      </tr>
+      <tr>
+        <th>[% 'Transaction description' | $T8 %]</th>
+        <td>[% L.input_tag('order.transaction_description', SELF.order.transaction_description, class='wi-lightwide') %]</td>
+      </tr>
+      <tr>
+        <th>[% 'Project Number' | $T8 %]</th>
+        <td>[% P.project.picker('order.globalproject_id', SELF.order.globalproject_id, class='wi-lightwide') %]</td>
+      </tr>
+    </tbody>
+  </table>
 
-      </td>
-    </tr>
+  <table class="tbl-horizontal col">
+    <caption>[% 'Terms' | $T8 %]</caption>
+    <colgroup><col class="wi-mediumsmall"><col class="wi-lightwide"></colgroup>
+    <tbody>
+      <tr>
+        <td colspan="2">
+          <span class="label above">[% 'Payment Terms' | $T8 %]</span>
+          [% L.select_tag('order.payment_id',
+                            SELF.all_payment_terms,
+                            default = SELF.order.payment_id,
+                            with_empty = 1,
+                            title_key = 'description',
+                            class = 'wi-mediumsmall-lightwide') %]
+        </td>
+      </tr>
+      <tr>
+        <td colspan="2">
+          <span class="label above">[% 'Delivery Terms' | $T8 %]</span>
+          [% L.select_tag('order.delivery_term_id',
+                            SELF.all_delivery_terms,
+                            default = SELF.order.delivery_term_id,
+                            with_empty = 1,
+                            title_key = 'description',
+                            class = 'wi-mediumsmall-lightwide') %]
+        </td>
+      </tr>
+      <tr id="taxincluded_row_id">
+        <th>[% IF !SELF.taxes.size %]<label for="order.taxincluded">[% 'Tax Included' | $T8 %]</label> [% END %]</th>
+        <td>[% IF !SELF.taxes.size %][% L.yes_no_tag('order.taxincluded', SELF.order.taxincluded, class='recalc') %][% END %]</td>
+      </tr>
+      [% IF SELF.type == "sales_order" %]
+        <tr>
+          <th>[% 'Periodic Invoices' | $T8 %]</th>
+          <td>
+            <span id='periodic_invoices_status' class="data wi-normal wi-lightwide">[% SELF.periodic_invoices_status %]</span>
+            <span class="button-inline">
+              [% L.button_tag('kivi.Order.show_periodic_invoices_config_dialog()', LxERP.t8('Configure'), class='neutral inline below') %]
+              <a href="doc/html/ch03.html#features.periodic-invoices.variables" target="_blank" class="button wi-tiny neutral" title="[% 'Documentation about periodic invoices in a new window' | $T8 %]">?</a>
+            </span>
+          </td>
+        </tr>
+      [% END %]
+    </tbody>
   </table>
 
-  [%- PROCESS order/tabs/_item_input.html %]
+</div><!-- /.col -->
 
-  [% L.button_tag('kivi.Order.show_multi_items_dialog()', LxERP.t8('Add multiple items')) %]
 
-  <table width="100%">
+<table class="tbl-horizontal col">
+  <caption>[% 'Notes' | $T8 %]</caption>
+  <colgroup><col class="wi-wide"></colgroup>
+  <tbody>
     <tr>
-      <td>
-
-        <div id="row_table_scroll_id" style="overflow-y: auto; height: 25vh">
-          <table id="row_table_id" width="100%">
-            <thead>
-              <tr class="listheading">
-                <th class="listheading" style='text-align:center' nowrap width="1">
-                  [%- IF MYCONFIG.show_form_details %]
-                    [%- L.img_tag(src="image/collapse.svg", alt=LxERP.t8('Hide all details'), title=LxERP.t8('Hide all details'), id='expand_all', "data-expanded"="1") %]
-                  [%- ELSE %]
-                    [%- L.img_tag(src="image/expand.svg", alt=LxERP.t8('Show all details'), title=LxERP.t8('Show all details'), id='expand_all') %]
-                  [%- END %]
-                </th>
-                <th class="listheading" nowrap width="3" >[%- 'position'     | $T8 %] </th>
-                <th class="listheading" style='text-align:center' nowrap width="1"><img src="image/updown.png" alt="[%- LxERP.t8('reorder item') %]"></th>
-                <th class="listheading" style='text-align:center' nowrap width="1"><img src="image/close.png" alt="[%- LxERP.t8('delete item') %]"></th>
-                <th id="partnumber_header_id"  class="listheading" nowrap width="15"><a href='#' onClick='javascript:kivi.Order.reorder_items("partnumber")'> [%- 'Partnumber'  | $T8 %]</a></th>
-                <th id="partclass_header_id"   class="listheading" nowrap width="2">[%- 'Type'  | $T8 %]</th>
-                <th id="description_header_id" class="listheading" nowrap           ><a href='#' onClick='javascript:kivi.Order.reorder_items("description")'>[%- 'Description' | $T8 %]</a></th>
-                [%- IF (SELF.type == "sales_order" || SELF.type == "purchase_order") -%]
-                <th id="shipped_qty_header_id" class="listheading" nowrap width="5" ><a href='#' onClick='javascript:kivi.Order.reorder_items("shipped_qty")'>[%- 'Delivered'   | $T8 %]</a></th>
-                [%- END -%]
-                <th id="qty_header_id"         class="listheading" nowrap width="5" ><a href='#' onClick='javascript:kivi.Order.reorder_items("qty")'>        [%- 'Qty'         | $T8 %]</a></th>
-                <th class="listheading" nowrap width="5" >[%- 'Price Factor' | $T8 %] </th>
-                <th class="listheading" nowrap width="5" >[%- 'Unit'         | $T8 %] </th>
-                <th class="listheading" nowrap width="5" >[%- 'Price Source' | $T8 %] </th>
-                <th id="sellprice_header_id"   class="listheading" nowrap width="15" ><a href='#' onClick='javascript:kivi.Order.reorder_items("sellprice")'> [%- 'Price'       | $T8 %]</a></th>
-                <th id="discount_header_id"    class="listheading" nowrap width="15" ><a href='#' onClick='javascript:kivi.Order.reorder_items("discount")'>  [%- 'Discount'    | $T8 %]</a></th>
-                <th class="listheading" nowrap width="10">[%- 'Extended'     | $T8 %] </th>
-              </tr>
-            </thead>
-
-            [%- FOREACH item = SELF.order.items_sorted %]
-              [%- PROCESS order/tabs/_row.html ITEM=item ID=(item.id||item.new_fake_id) TYPE=SELF.type ALL_PRICE_FACTORS=SELF.all_price_factors %]
-            [%- END %]
-
-          </table>
-        </div>
-
-      </td>
+      <td class="wi-wide">[% L.textarea_tag('order.notes', SELF.order.notes, wrap="soft",rows=7, class="texteditor wi-wide") %]</td>
     </tr>
-
     <tr>
+      <td><span class="label above">[% 'Internal Notes' | $T8 %]</span>[% L.textarea_tag('order.intnotes', SELF.order.intnotes, wrap="soft", style="height: 150px", class="wi-wide") %]</td>
     </tr>
-
+  </tbody>
+</table>
+
+<table class="tbl-horizontal col">
+  <caption>[% 'Handling, Dates & Numbers' | $T8 %]</caption>
+  <colgroup> <col class="wi-mediumsmall"><col class="wi-lightwide"> </colgroup>
+  <tbody>
+    [% IF SELF.order.id %]
     <tr>
-      <td colspan="100%" width="100%">
-        <table width="100%">
-          <tr>
-            <td>
-              <table>
-                <tr>
-                  <th align="left">[% 'Notes' | $T8 %]</th>
-                  <th align="left">[% 'Internal Notes' | $T8 %]</th>
-                </tr>
-                <tr valign="top">
-                  <td>
-                    [% L.textarea_tag('order.notes', SELF.order.notes, wrap="soft", style="width: 350px; height: 150px", class="texteditor") %]
-                  </td>
-                  <td>
-                    [% L.textarea_tag('order.intnotes', SELF.order.intnotes, wrap="soft", style="width: 350px; height: 150px") %]
-                  </td>
-                </tr>
-              </table>
-            </td>
-
-            <td>
-              <table>
-                <tr>
-                  <th align="right">[% 'Payment Terms' | $T8 %]</th>
-                  <td>[% L.select_tag('order.payment_id',
-                                      SELF.all_payment_terms,
-                                      default = SELF.order.payment_id,
-                                      with_empty = 1,
-                                      title_key = 'description',
-                                      style = 'width: 250px') %]</td>
-                </tr>
-                <tr>
-                  <th align="right">[% 'Delivery Terms' | $T8 %]</th>
-                  <td>[% L.select_tag('order.delivery_term_id',
-                                      SELF.all_delivery_terms,
-                                      default = SELF.order.delivery_term_id,
-                                      with_empty = 1,
-                                      title_key = 'description',
-                                      style = 'width: 250px') %]</td>
-                </tr>
-                [%- IF SELF.type == "sales_order" %]
-                <tr>
-                  <th align="right">[%- 'Periodic Invoices' | $T8 %]</th>
-                  <td>[% L.button_tag('kivi.Order.show_periodic_invoices_config_dialog()', LxERP.t8('Configure')) %]
-                    (<span id='periodic_invoices_status'>[%- SELF.periodic_invoices_status -%]</span>)
-                    <a href="doc/html/ch03.html#features.periodic-invoices.variables" target="_blank">?</a>
-                  </td>
-                </tr>
-                [%- END %]
-              </table>
-            </td>
+    <th><label for="order.delivered">[% 'Delivery Order(s) for full qty created' | $T8 %]</label></th>
+    <td>[% L.yes_no_tag('order.delivered', SELF.order.delivered, class='wi-small') %]</td>
+    </tr>
+    <tr>
+      <th><label for="order.closed">[% 'Closed' | $T8 %]</label></th>
+      <td>[% L.yes_no_tag('order.closed', SELF.order.closed, class='wi-small') %]</td>
+    </tr>
+    [% END %]
+    <tr>
+      <th>[% 'Employee' | $T8 %]</th>
+      <td>[% L.select_tag('order.employee_id',
+        SELF.all_employees,
+        default=(SELF.order.employee_id ? SELF.order.employee_id : SELF.current_employee_id),
+        title_key='safe_name') %]</td>
+    </tr>
+    [% IF SELF.cv == 'customer' %]
+      <tr>
+        <th>[% 'Salesman' | $T8 %]</th>
+        <td>[% L.select_tag('order.salesman_id',
+          SELF.all_salesmen,
+          default=(SELF.order.salesman_id ? SELF.order.salesman_id : SELF.current_employee_id),
+          title_key='safe_name') %]</td>
+      </tr>
+    [% END %]
+    [% IF (SELF.type == "sales_order" || SELF.type == "purchase_order") %]
+      <tr>
+        <th>[% 'Order Number' | $T8 %]</th>
+        <td>[% L.input_tag('order.ordnumber', SELF.order.ordnumber, size = 11, onchange='kivi.Order.set_number_in_title(this)', class='wi-small numeric') %]</td>
+      </tr>
+    [% END %]
+    [% IF (SELF.type == "sales_order" || SELF.type == "sales_quotation") %]
+      [% SET quo_nr_txt = 'Quotation Number' %]
+    [% ELSE %]
+      [% SET quo_nr_txt = 'RFQ Number' %]
+    [% END %]
+    <tr>
+      <th>[% quo_nr_txt | $T8 %]</th>
+      [% IF (SELF.type == "sales_order" || SELF.type == "purchase_order") %]
+        <td>[% L.input_tag('order.quonumber', SELF.order.quonumber, size=5, class='wi-small') %]</td>
+      [% ELSE %]
+        <td>[% L.input_tag('order.quonumber', SELF.order.quonumber, class='wi-small numeric', size=5, class='wi-small', onchange='kivi.Order.set_number_in_title(this)') %]</td>
+      [% END %]
+    </tr>
+    [% IF (SELF.type == "sales_order" || SELF.type == "purchase_order") %]
+      <tr>
+        <th>[% 'Customer Order Number' | $T8 %]</th>
+        <td>[% L.input_tag('order.cusordnumber', SELF.order.cusordnumber, size=5, class='wi-small numeric') %]</td>
+      </tr>
+    [% END %]
+    [% IF (SELF.type == "sales_order" || SELF.type == "purchase_order") %]
+      [% SET transdate_txt = 'Order Date' %]
+    [% ELSIF SELF.type == "sales_quotation" %]
+      [% SET transdate_txt = 'Quotation Date' %]
+    [% ELSE %]
+      [% SET transdate_txt = 'RFQ Date' %]
+    [% END %]
+    <tr>
+      <th>[% transdate_txt | $T8 %]</th>
+      <td>[% L.date_tag('order.transdate_as_date', SELF.order.transdate_as_date, class='wi-date') %]</td>
+    </tr>
+    [% IF (SELF.type == "sales_order" || SELF.type == "purchase_order") %]
+      [% SET reqdate_txt = 'Reqdate' %]
+    [% ELSIF SELF.type == "sales_quotation" %]
+      [% SET reqdate_txt = 'Valid until' %]
+    [% ELSE %]
+      [% SET reqdate_txt = 'Required by' %]
+    [% END %]
+    <tr>
+      <th>[% reqdate_txt | $T8 %]</th>
+      <td>[% L.date_tag('order.reqdate_as_date', SELF.order.reqdate_as_date, class='wi-date') %]</td>
+    </tr>
+    [% IF SELF.type == "sales_quotation" %]
+      <tr>
+        <th>[% 'Order probability' | $T8 %]</th>
+        <td>[% L.select_tag('order.order_probability', SELF.order_probabilities, title='title', default=SELF.order.order_probability) %]%</td>
+      </tr>
+      <tr>
+        <th>[% 'Expected billing date' | $T8 %]</th>
+        <td>[% L.date_tag('order.expected_billing_date_as_date', SELF.order.expected_billing_date_as_date) %]</td>
+      </tr>
+    [% END %]
+    <tr>
+      <th>[% 'Insert Date' | $T8 %]</th>
+      <td><span class="data wi-small">[% SELF.order.itime_as_date %]</span></td>
+    </tr>
+  </tbody>
+</table>
 
-            [%- IF (SELF.type == "sales_order" || SELF.type == "sales_quotation") -%]
-            [%- SET marge_class = (SELF.order.marge_total < 0) ? 'plus0' : '' -%]
-            <td>
-              <table>
-                <tr>
-                  <th  align="left">[% 'Ertrag' | $T8 %]</th>
-                  <td align="right">
-                    [%- L.div_tag(SELF.order.marge_total_as_number, id='marge_total_id', class=marge_class) %]
-                  </td>
-                </tr>
-                <tr>
-                  <th  align="left">[% 'Ertrag prozentual' | $T8 %]</th>
-                  <td align="right">
-                    [%- L.div_tag(LxERP.format_amount(SELF.order.marge_percent, 2), id='marge_percent_id', class=marge_class) %]
-                  </td>
-                  <td>[%- L.div_tag('%', id='marge_percent_sign_id', class=marge_class) %]</td>
-                </tr>
-              </table>
-            </td>
-            [%- END %]
+</div><!-- /.wrapper -->
 
-            <td align="right">
-              <table>
-                <tr id="taxincluded_row_id" [%- IF !SELF.taxes.size %]style="display:none"[%- END %]>
-                  <td align=right colspan="2">
-                    <label for="order.taxincluded"><b>[% 'Tax Included' | $T8 %]</b></label>
-                    [% L.yes_no_tag('order.taxincluded', SELF.order.taxincluded, class='recalc') %]
-                  </td>
-                </tr>
+[% PROCESS order/tabs/_item_input.html %]
 
-                <tr id="subtotal_row_id" [%- IF SELF.order.taxincluded %]style="display:none"[%- END %]>
-                  <th align="right">[%- 'Subtotal' | $T8 %]</th>
-                  <td align="right">
-                    [%- L.div_tag(SELF.order.netamount_as_number, id='netamount_id') %]
-                  </td>
-                </tr>
-                [%- FOREACH tax = SELF.taxes %]
-                  [%- PROCESS order/tabs/_tax_row.html TAX=tax TAXINCLUDED=SELF.order.taxincluded %]
-                [%- END %]
-                <tr id="amount_row_id">
-                  <th align="right">[%- 'Total' | $T8 %]</th>
-                  <td align="right">
-                    [%- L.div_tag(SELF.order.amount_as_number, id='amount_id') %]
-                  </td>
-                </tr>
-              </table>
-            </td>
+<div id="row_table_scroll_id" class="wrapper">
 
-          </tr>
-        </table>
-      </td>
+<table id="row_table_id" class="tbl-list">
+  <caption>[% 'Articles' | $T8 %]</caption>
+  <thead>
+    <tr>
+      <th class="center">
+        [% IF MYCONFIG.show_form_details %]
+          [% L.img_tag(src="image/collapse.svg", alt=LxERP.t8('Hide all details'), title=LxERP.t8('Hide all details'), id='expand_all', "data-expanded"="1") %]
+        [% ELSE %]
+          [% L.img_tag(src="image/expand.svg", alt=LxERP.t8('Show all details'), title=LxERP.t8('Show all details'), id='expand_all') %]
+        [% END %]
+      </th>
+      <th>[% 'position'     | $T8 %] </th>
+      <th style='text-align:center'><img src="image/updown.png" alt="[% LxERP.t8('reorder item') %]"></th>
+      <th style='text-align:center'><img src="image/close.png" alt="[% LxERP.t8('delete item') %]"></th>
+      <th id="partnumber_header_id"><a href='#' onClick='javascript:kivi.Order.reorder_items("partnumber")'> [% 'Partnumber'  | $T8 %]</a></th>
+      <th id="partclass_header_id">[% 'Type'  | $T8 %]</th>
+      <th id="description_header_id"><a href='#' onClick='javascript:kivi.Order.reorder_items("description")'>[% 'Description' | $T8 %]</a></th>
+      [%- IF (SELF.type == "sales_order" || SELF.type == "purchase_order") -%]
+      <th id="shipped_qty_header_id"><a href='#' onClick='javascript:kivi.Order.reorder_items("shipped_qty")'>[% 'Delivered' | $T8 %]</a></th>
+      [%- END -%]
+      <th id="qty_header_id"><a href='#' onClick='javascript:kivi.Order.reorder_items("qty")'>        [% 'Qty'         | $T8 %]</a></th>
+      <th >[% 'Price Factor' | $T8 %]</th>
+      <th >[% 'Unit'         | $T8 %]</th>
+      <th >[% 'Price Source' | $T8 %]</th>
+      <th id="sellprice_header_id"><a href='#' onClick='javascript:kivi.Order.reorder_items("sellprice")'> [% 'Price'       | $T8 %]</a></th>
+      <th id="discount_header_id" ><a href='#' onClick='javascript:kivi.Order.reorder_items("discount")'>  [% 'Discount'    | $T8 %]</a></th>
+      <th>[% 'Extended'     | $T8 %]</th>
+    </tr>
+  </thead>
+  [% FOREACH item = SELF.order.items_sorted %]
+    [% PROCESS order/tabs/_row.html ITEM=item ID=(item.id||item.new_fake_id) TYPE=SELF.type ALL_PRICE_FACTORS=SELF.all_price_factors %]
+  [% END %]
+  <tfoot>
+    <tr id="subtotal_row_id">
+      <td colspan="11"></td>
+      <th colspan="3">[% IF SELF.order.taxincluded %][% 'Subtotal' | $T8 %][% END %]</th>
+      <td>[% IF SELF.order.taxincluded %][% L.div_tag(SELF.order.netamount_as_number, id='netamount_id') %][% END %]</td>
     </tr>
+    [% FOREACH tax = SELF.taxes %]
+      [% PROCESS order/tabs/_tax_row.html TAX=tax TAXINCLUDED=SELF.order.taxincluded %]
+    [% END %]
+    <tr id="amount_row_id">
+      [%- IF (SELF.type == "sales_order" || SELF.type == "sales_quotation") -%]
+      [%- SET marge_class = (SELF.order.marge_total < 0) ? 'plus0' : '' -%]
+      <th colspan="2">[% 'Ertrag' | $T8 %]</th>
+      <td colspan="2" class="numeric">[%- L.div_tag(SELF.order.marge_total_as_number, id='marge_total_id', class=marge_class) %]</td>
+      <th colspan="2">[% 'Ertrag prozentual' | $T8 %]</th>
+      <td class="numeric">[%- LxERP.format_amount(SELF.order.marge_percent, 2) %] %</td>
+      [%- ELSE -%]
+      <td colspan="7">
+      [%- END -%]
+      <td colspan="4">
+      <th colspan="3">[% 'Total' | $T8 %]</th>
+      <td class="numeric">[% L.div_tag(SELF.order.amount_as_number, id='amount_id') %]</td>
+    </tr>
+  </tfoot>
+</table>
 
-  </table>
+</div><!-- /#row_table_scroll_id /.wrapper -->
 
-</div>
+</div><!-- /#ui-tabs-basic-data -->
 
 [% L.sortable_element('#row_table_id') %]
+
