Index: ow/templates/workout.pt
===================================================================
--- ow/templates/workout.pt	(revision 67fc2ed5218a57e5e3dddc275aca9163b7c3f8a4)
+++ ow/templates/workout.pt	(revision 10c8e6e522abc03b669c720119a7733c881170d5)
@@ -26,4 +26,88 @@
   <metal:content metal:fill-slot="content">
 
+
+    <div class="workout-detail" id="workout">
+      <div class="workout-detail-resume">
+        <h3 tal:content="context.title"></h3>
+        <div id="" tal:content="context.notes"
+             tal:attributes="id 'workout-' + context.workout_id + '-notes'">
+        </div>
+        <ul class="workout-options">
+          <li>
+            <a href="" i18n:translate=""
+             tal:attributes="href request.resource_url(context, 'edit')">
+            edit workout
+            </a>
+          </li>
+          <li>
+            <a href="" i18n:translate=""
+             tal:attributes="href request.resource_url(context, 'update-from-file')">
+            update with tracking file
+            </a>
+          </li>
+          <li class="owo-del"><a href="" i18n:translate=""
+             tal:attributes="href request.resource_url(context, 'delete')">
+            delete
+            </a>
+          </li>
+        </ul>
+      </div>
+      <div class="workout-detail-info">
+        <ul id="" tal:attributes="id 'workout-' + context.workout_id + '-details'"
+            tal:define="hr context.hr; cad context.cad; atemp context.atemp; timezone context.owner.timezone">
+          <li tal:condition="context.distance">
+            <span><tal:t i18n:translate="">Distance</tal:t></span>
+            <tal:c tal:content="context.rounded_distance"></tal:c> km
+          </li>
+          <li>
+            <span><tal:t i18n:translate="">Start</tal:t></span>
+            <tal:c tal:content="context.start_in_timezone(timezone)"></tal:c>
+          </li>
+          <li>
+            <span><tal:t i18n:translate="">End</tal:t></span>
+            <tal:c tal:content="context.end_in_timezone(timezone)"></tal:c>
+          </li>
+          <li>
+            <span><tal:t i18n:translate="">Duration</tal:t></span>
+            <!--! use the properly formatted duration instead of the timedelta object -->
+            <tal:c tal:content="context._duration"></tal:c>
+          </li>
+          <li tal:condition="context.speed">
+            <span><tal:t i18n:translate="">Speed</tal:t></span>
+            <tal:t i18n:translate="">Avg.</tal:t>
+            <tal:c tal:content="round(context.speed['avg'], 1)"></tal:c> km/h |
+            <tal:t i18n:translate="">Max.</tal:t>
+            <tal:c tal:content="round(context.speed['max'], 1)"></tal:c> km/h
+          </li>
+          <li tal:condition="hr">
+            <span><tal:t i18n:translate="">Heart Rate</tal:t></span>
+            <tal:t i18n:translate="">Min.</tal:t>
+            <tal:c tal:content="hr['min']"></tal:c> bpm |
+            <tal:t i18n:translate="">Avg.</tal:t>
+            <tal:c tal:content="hr['avg']"></tal:c> bpm |
+            <tal:t i18n:translate="">Max.</tal:t>
+            <tal:c tal:content="hr['max']"></tal:c> bpm
+          </li>
+          <li tal:condition="cad">
+            <span><tal:t i18n:translate="">Cadence</tal:t></span>
+            <tal:t i18n:translate="">Min.</tal:t>
+            <tal:c tal:content="cad['min']"></tal:c> |
+            <tal:t i18n:translate="">Avg.</tal:t>
+            <tal:c tal:content="cad['avg']"></tal:c> |
+            <tal:t i18n:translate="">Max.</tal:t>
+            <tal:c tal:content="cad['max']"></tal:c>
+          </li>
+          <li tal:condition="atemp">
+            <span><tal:t i18n:translate="">Temperature</tal:t></span>
+            <tal:t i18n:translate="">Min.</tal:t>
+            <tal:c tal:content="atemp['min']"></tal:c> |
+            <tal:t i18n:translate="">Avg.</tal:t>
+            <tal:c tal:content="atemp['avg']"></tal:c> |
+            <tal:t i18n:translate="">Max.</tal:t>
+            <tal:c tal:content="atemp['max']"></tal:c>
+          </li>
+        </ul>
+      </div>
+    </div>
     <!--! Track map -->
     <div id="map" tal:condition="context.has_gpx"></div>
@@ -49,81 +133,4 @@
       </tal:r>
 
-    </div>
-
-    <div id="workout">
-      <h3 tal:content="context.title"></h3>
-      <h4>
-        <a href="" i18n:translate=""
-           tal:attributes="href request.resource_url(context, 'edit')">
-          (edit workout)
-        </a> |
-        <a href="" i18n:translate=""
-           tal:attributes="href request.resource_url(context, 'update-from-file')">
-          (update with tracking file)
-        </a> |
-        <a href="" i18n:translate=""
-           tal:attributes="href request.resource_url(context, 'delete')">
-          (delete)
-        </a>
-      </h4>
-
-      <ul id="" tal:attributes="id 'workout-' + context.workout_id + '-details'"
-          tal:define="hr context.hr; cad context.cad; atemp context.atemp; timezone context.owner.timezone">
-        <li>
-          <tal:t i18n:translate="">Start:</tal:t>
-          <tal:c tal:content="context.start_in_timezone(timezone)"></tal:c>
-        </li>
-        <li>
-          <tal:t i18n:translate="">End:</tal:t>
-          <tal:c tal:content="context.end_in_timezone(timezone)"></tal:c>
-        </li>
-        <li>
-          <tal:t i18n:translate="">Duration:</tal:t>
-          <!--! use the properly formatted duration instead of the timedelta object -->
-          <tal:c tal:content="context._duration"></tal:c>
-        </li>
-        <li tal:condition="context.distance">
-          <tal:t i18n:translate="">Distance:</tal:t>
-          <tal:c tal:content="context.rounded_distance"></tal:c> km
-        </li>
-        <li tal:condition="context.speed">
-          <tal:t i18n:translate="">Speed:</tal:t>
-          <tal:t i18n:translate="">Avg.</tal:t>
-          <tal:c tal:content="round(context.speed['avg'], 1)"></tal:c> km/h |
-          <tal:t i18n:translate="">Max.</tal:t>
-          <tal:c tal:content="round(context.speed['max'], 1)"></tal:c> km/h
-        </li>
-        <li tal:condition="hr">
-          <tal:t i18n:translate="">Heart Rate:</tal:t>
-          <tal:t i18n:translate="">Min.</tal:t>
-          <tal:c tal:content="hr['min']"></tal:c> bpm |
-          <tal:t i18n:translate="">Avg.</tal:t>
-          <tal:c tal:content="hr['avg']"></tal:c> bpm |
-          <tal:t i18n:translate="">Max.</tal:t>
-          <tal:c tal:content="hr['max']"></tal:c> bpm
-        </li>
-        <li tal:condition="cad">
-          <tal:t i18n:translate="">Cadence:</tal:t>
-          <tal:t i18n:translate="">Min.</tal:t>
-          <tal:c tal:content="cad['min']"></tal:c> |
-          <tal:t i18n:translate="">Avg.</tal:t>
-          <tal:c tal:content="cad['avg']"></tal:c> |
-          <tal:t i18n:translate="">Max.</tal:t>
-          <tal:c tal:content="cad['max']"></tal:c>
-        </li>
-        <li tal:condition="atemp">
-          <tal:t i18n:translate="">Temperature:</tal:t>
-          <tal:t i18n:translate="">Min.</tal:t>
-          <tal:c tal:content="atemp['min']"></tal:c> |
-          <tal:t i18n:translate="">Avg.</tal:t>
-          <tal:c tal:content="atemp['avg']"></tal:c> |
-          <tal:t i18n:translate="">Max.</tal:t>
-          <tal:c tal:content="atemp['max']"></tal:c>
-        </li>
-
-      </ul>
-      <div id="" tal:content="context.notes"
-           tal:attributes="id 'workout-' + context.workout_id + '-notes'">
-      </div>
     </div>
   </metal:content>
