diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Scopes.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Scopes.vue
index 903f85a86..1feb514db 100644
--- a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Scopes.vue
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/AccompanyingCourse/components/Scopes.vue
@@ -1,18 +1,20 @@
 <template>
   <div class="vue-component">
-    <h2><a id="section-60"></a>{{ $t('scopes.title') }}</h2>
+     <h2><a id="section-60"></a>{{ $t('scopes.title') }}</h2>
 
-    <ul>
-      <li v-for="s in scopes">
-        <input type="checkbox" v-model="checkedScopes" :value="s" />
-        {{ s.name.fr }}
-      </li>
-    </ul>
+     <div class="mb-4">
+        <div class="form-check" v-for="s in scopes">
+          <input class="form-check-input" type="checkbox" v-model="checkedScopes" :value="s" />
+          <label class="form-check-label">
+             {{ s.name.fr }}
+          </label>
+        </div>
+     </div>
 
     <div v-if="!isScopeValid" class="alert alert-warning separator">
       {{ $t('scopes.add_at_least_one') }}
-
     </div>
+
   </div>
 </template>