diff --git a/src/Bundle/ChillActivityBundle/Resources/public/scss/chillactivity.scss b/src/Bundle/ChillActivityBundle/Resources/public/scss/chillactivity.scss
index 64fd1cb18..ed54ce27a 100644
--- a/src/Bundle/ChillActivityBundle/Resources/public/scss/chillactivity.scss
+++ b/src/Bundle/ChillActivityBundle/Resources/public/scss/chillactivity.scss
@@ -112,3 +112,19 @@ div.flex-table.list-records {
       margin-top: 1em;
    }
 }
+
+div.activity-row {
+   display: flex;
+   flex-direction: row;
+   flex-wrap: wrap;
+   justify-content: center;
+   gap: 12px;
+   div.bloc {
+      width: 200px;
+      align-self: flex-end;
+      height: 140px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+   }
+}
diff --git a/src/Bundle/ChillActivityBundle/Resources/views/Activity/selectType.html.twig b/src/Bundle/ChillActivityBundle/Resources/views/Activity/selectType.html.twig
index 76e3f25ad..484deb55a 100644
--- a/src/Bundle/ChillActivityBundle/Resources/views/Activity/selectType.html.twig
+++ b/src/Bundle/ChillActivityBundle/Resources/views/Activity/selectType.html.twig
@@ -4,7 +4,7 @@
 
 {% for row in data %}
     <h3>{{ row.activityTypeCategory.name|localize_translatable_string }}</h3>
-    <div style="display:flex;justify-content:center;gap:12px;flex-wrap:wrap;">
+    <div class="activity-row">
         {% for activityType in row.activityTypes %}
 
             {% set person_id = null %}
@@ -19,7 +19,7 @@
 
             <a href="{{ path('chill_activity_activity_new', {'person_id': person_id, 'activityType_id': activityType.id, 'accompanying_period_id': accompanying_course_id }) }}">
 
-                <div style="width:200px;height:200px;border:1px dotted red;display:flex;justify-content:center;align-items:center;align-content:center;">
+                <div class="bloc btn btn-primary btn-lg btn-block">
                     {{ activityType.name|localize_translatable_string }}
                 </div>
             </a>