diff --git a/app/assets/javascripts/controllers/calendar.coffee b/app/assets/javascripts/controllers/calendar.coffee
index bce871326..008b7e703 100644
--- a/app/assets/javascripts/controllers/calendar.coffee
+++ b/app/assets/javascripts/controllers/calendar.coffee
@@ -47,6 +47,9 @@ Application.Controllers.controller "CalendarController", ["$scope", "$state", "$
     availabilitySource.url = "/api/availabilities/public?#{$.param({available_type: availableTypes})}"
     $scope.calendarConfig.events = availabilitySource.url
 
+  $scope.isAvailableTypeInactive = (type) ->
+    index = availableTypes.indexOf(type)
+    index == -1 ? true : false
 
   ### PRIVATE SCOPE ###
 
diff --git a/app/assets/stylesheets/app.plugins.scss b/app/assets/stylesheets/app.plugins.scss
index 0032e8a7a..c4f57ebbf 100644
--- a/app/assets/stylesheets/app.plugins.scss
+++ b/app/assets/stylesheets/app.plugins.scss
@@ -102,6 +102,15 @@
   display: none !important;
 }
 
+.calendar-filter {
+  .badge {
+    cursor: pointer;
+
+    &.inactive {
+      opacity: 0.2;
+    }
+  }
+}
 
 
 
diff --git a/app/assets/templates/calendar/calendar.html.erb b/app/assets/templates/calendar/calendar.html.erb
index 5d1de8659..b7e3696e4 100644
--- a/app/assets/templates/calendar/calendar.html.erb
+++ b/app/assets/templates/calendar/calendar.html.erb
@@ -12,10 +12,14 @@
     </div>
 
     <div class="col-xs-12 col-sm-12 col-md-3 b-t hide-b-md">
-      <section class="heading-actions wrapper">
-       <span class="badge text-sm bg-formation m-t-md" translate ng-click="filterAvailableType('training')">{{ 'trainings' }}</span>
-       <span class="badge text-sm bg-machine" translate ng-click="filterAvailableType('machines')">{{ 'machines' }}</span>
-       <span class="badge text-sm bg-event" translate ng-click="filterAvailableType('event')">{{ 'events' }}</span>
+      <section class="heading-actions wrapper calendar-filter">
+        <div>
+          <i class="fa fa-filter"></i>
+          <span translate>{{ 'filter' }}</span>
+        </div>
+        <span class="badge text-sm bg-formation" ng-class="{'inactive': isAvailableTypeInactive('training')}" translate ng-click="filterAvailableType('training')">{{ 'trainings' }}</span>
+        <span class="badge text-sm bg-machine" ng-class="{'inactive': isAvailableTypeInactive('machines')}" translate ng-click="filterAvailableType('machines')">{{ 'machines' }}</span>
+        <span class="badge text-sm bg-event" ng-class="{'inactive': isAvailableTypeInactive('event')}" translate ng-click="filterAvailableType('event')">{{ 'events' }}</span>
       </section>
     </div>
 
@@ -25,7 +29,7 @@
 
 <section class="row no-gutter">
 
-  <div class="col-sm-12 col-md-12 col-lg-9">
+  <div class="col-sm-12 col-md-12 col-lg-12">
     <div ui-calendar="calendarConfig" ng-model="eventSources" calendar="calendar" class="wrapper-lg public-calendar"></div>
   </div>
 
diff --git a/config/locales/app.shared.en.yml b/config/locales/app.shared.en.yml
index 085df0b1a..b3fa419fe 100644
--- a/config/locales/app.shared.en.yml
+++ b/config/locales/app.shared.en.yml
@@ -95,6 +95,7 @@ en:
         description_is_required: "Description is required."
         name_is_required: "Name is required."
         all_themes: "All themes"
+        filter: 'Filter'
 
       messages:
         you_will_lose_any_unsaved_modification_if_you_quit_this_page: "You will lose any unsaved modification if you quit this page"
diff --git a/config/locales/app.shared.fr.yml b/config/locales/app.shared.fr.yml
index 49372cdde..74b1dfe45 100644
--- a/config/locales/app.shared.fr.yml
+++ b/config/locales/app.shared.fr.yml
@@ -29,7 +29,7 @@ fr:
         confirmation_required: "Confirmation requise"
         description: "Description"
         machines: "Machines"
-        events: "Events"
+        events: "Évènements"
         materials: "Matériaux"
         date: "Date"
         price: "Prix"
@@ -95,6 +95,7 @@ fr:
         description_is_required: "La description est requise."
         name_is_required: "Le nom est requis."
         all_themes: "Toutes les thématiques"
+        filter: 'Filtre'
 
       messages:
         you_will_lose_any_unsaved_modification_if_you_quit_this_page: "Vous perdrez les modifications non enregistrées si vous quittez cette page"