diff --git a/src/Bundle/ChillPersonBundle/Resources/public/chill/scss/badge.scss b/src/Bundle/ChillPersonBundle/Resources/public/chill/scss/badge.scss
index 6ffe0ac9d..7880e6571 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/chill/scss/badge.scss
+++ b/src/Bundle/ChillPersonBundle/Resources/public/chill/scss/badge.scss
@@ -115,18 +115,18 @@ a.badge-link {
 }
 
 /// badge_title in AccompanyingCourse Work list Page
-div.accompanying_course_work-list {
-    h2.badge-title {
-        span.title_label {
-            // Calculate same color then border:groove
-            background-color: shade-color($social-action-color, 34%);
-        }
-        span.title_action {
-            @include badge_title($social-action-color);
-        }
+
+h2.badge-title {
+    span.title_label {
+        // Calculate same color then border:groove
+        background-color: shade-color($social-action-color, 34%);
+    }
+    span.title_action {
+        @include badge_title($social-action-color);
     }
 }
 
+
 /// badge_title in Activities on resume page
 div.activity-list {
     h2.badge-title {
diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Resources.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Resources.vue
index 87021850e..f187e9745 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Resources.vue
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Resources.vue
@@ -22,19 +22,19 @@
    <div v-if="suggestedEntities.length > 0">
       <ul class="list-suggest add-items">
          <li v-for="p in suggestedEntities" :key="uniqueId(p)" @click="addSuggestedEntity(p)">
-             <span>{{ p.text }}</span>
-          </li>
-        </ul>
+            <span>{{ p.text }}</span>
+         </li>
+      </ul>
    </div>
 
    <div>
       <add-persons
-        buttonTitle="resources.add_resources"
-        modalTitle="resources.add_resources"
-        v-bind:key="addPersons.key"
-        v-bind:options="addPersons.options"
-        @addNewPersons="addNewPersons"
-        ref="addPersons"> <!-- to cast child method -->
+      buttonTitle="resources.add_resources"
+      modalTitle="resources.add_resources"
+      v-bind:key="addPersons.key"
+      v-bind:options="addPersons.options"
+      @addNewPersons="addNewPersons"
+      ref="addPersons"> <!-- to cast child method -->
       </add-persons>
    </div>
 
@@ -87,17 +87,17 @@ export default {
             }
          )
           // filter persons appearing twice in requestor and resources
-          .filter(
-              (e, index, suggested) => {
-                for (let i = 0; i < suggested.length; i = i+1) {
-                  if (i < index && e.id === suggested[i].id) {
-                    return false
-                  }
-                }
+         .filter(
+            (e, index, suggested) => {
+               for (let i = 0; i < suggested.length; i = i+1) {
+               if (i < index && e.id === suggested[i].id) {
+                  return false
+               }
+               }
 
-                return true;
-              }
-          )
+               return true;
+            }
+         )
    }),
    methods: {
       removeResource(item) {
diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourseWorkEdit/App.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourseWorkEdit/App.vue
index 2a3489fce..1754dee4e 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourseWorkEdit/App.vue
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourseWorkEdit/App.vue
@@ -2,18 +2,20 @@
    <div id="workEditor" class="my-4">
 
       <div id="title" class="action-row">
-         <label>{{ $t('action_title') }}</label>
-         <p>{{ work.socialAction.text }}</p>
+         <h2 class="badge-title">
+            <span class="title_label">Action</span>
+            <span class="title_action">{{ work.socialAction.text }}</span>
+         </h2>
       </div>
 
       <div id="startDate" class="action-row">
-         <label>{{ $t('startDate') }}</label>
-         <input v-model="startDate" type="date" required="true"/>
+         <label class="col-form-label col-sm-4">{{ $t('startDate') }}</label>
+         <input v-model="startDate" type="date" required="true" class="form-control" v-once/>
       </div>
 
       <div id="endDate" class="action-row">
-         <label>{{ $t('endDate') }}</label>
-         <input v-model="endDate" type="date"/>
+         <label class="col-form-label col-sm-4">{{ $t('endDate') }}</label>
+         <input v-model="endDate" type="date" class="form-control" />
       </div>
 
       <div id="comment" class="action-row">
@@ -146,14 +148,24 @@
                </li>
             </ul>
          </div>
-         <div v-else>
-            <p>{{ handlingThirdParty.text }}</p>
-            <address-render-box :address="handlingThirdParty.address"></address-render-box>
-
+         <div v-else class="flex-table"> 
+            <!-- <p>{{ handlingThirdParty.text }}</p>
+            <address-render-box :address="handlingThirdParty.address"></address-render-box> -->
+               <third-party-render-box
+                  :thirdparty="handlingThirdParty"
+                  :options="{
+                     addLink: false,
+                     addId: false,
+                     addEntity: true,
+                     addInfo: false,
+                     hLevel: 3,
+                     isMultiline: true,
+                     isConfidential: false
+                     }"></third-party-render-box>
             <ul class="record_actions">
                <li>
                   <button :title="$t('remove_handling_thirdparty')" class="btn btn-remove"
-                          @click="removeHandlingThirdParty"></button>
+                        @click="removeHandlingThirdParty"></button>
                </li>
             </ul>
          </div>
@@ -168,6 +180,21 @@
          </div>
 
          <div v-else>
+            <!-- <div class="flex-bloc mb-3">
+                  <third-party-render-box
+                     :v-for="t in thirdParties"
+                     :thirdparty="t"
+                     :options="{ addLink : false, addId : false, addEntity: true, addInfo: false, hLevel: 3 }"
+                     >
+                     <template v-slot:record-actions>
+                        <ul class="record_actions">
+                           <li><on-the-fly :id="t.id" action="show"></on-the-fly></li>
+                           <li><on-the-fly :id="t.id" action="edit" @saveFormOnTheFly="saveFormOnTheFly"></on-the-fly></li>
+                           <li><button class="btn btn-sm btn-remove" :title="$t('action.remove')" @click.prevent="$emit('remove', resource)"></button></li>
+                        </ul>
+                     </template>
+                  </third-party-render-box>
+            </div> -->
             <ul>
                <li v-for="t in thirdParties">
                   <p>{{ t.text }}</p>
@@ -230,6 +257,7 @@ import AddEvaluation from './components/AddEvaluation.vue';
 import PersonRenderBox from 'ChillPersonAssets/vuejs/_components/Entity/PersonRenderBox.vue';
 import AddPersons from 'ChillPersonAssets/vuejs/_components/AddPersons.vue';
 import AddressRenderBox from 'ChillMainAssets/vuejs/_components/Entity/AddressRenderBox.vue';
+import ThirdPartyRenderBox from 'ChillThirdPartyAssets/vuejs/_components/Entity/ThirdPartyRenderBox.vue';
 
 const i18n = {
    messages: {
@@ -276,6 +304,7 @@ export default {
       AddPersons,
       PersonRenderBox,
       AddressRenderBox,
+      ThirdPartyRenderBox,
    },
    i18n,
    data() {