--- a/cms/app-client/app/components/sorting-component.js	Fri Jun 10 18:37:26 2016 +0200
+++ b/cms/app-client/app/components/sorting-component.js	Fri Jun 10 23:42:11 2016 +0200
@@ -2,6 +2,7 @@
 
 export default Ember.Component.extend({
 
+    classNames: ['sorting-component'],
     sorting: [],
     sortedThemes: Ember.computed.sort('themes', 'sorting'),
 

--- a/cms/app-client/app/styles/app.scss	Fri Jun 10 18:37:26 2016 +0200
+++ b/cms/app-client/app/styles/app.scss	Fri Jun 10 23:42:11 2016 +0200
@@ -13,6 +13,13 @@
   @import 'tabs/discours';
   @import 'tabs/thematiques';
   @import 'tabs/detail';
+
+  @import 'components/sorting-component';
+  @import 'components/filtering-component';
+}
+
+.corpus-app-container {
+    overflow: hidden;
 }
 
 .mapdiv{

--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/cms/app-client/app/styles/components/filtering-component.scss	Fri Jun 10 23:42:11 2016 +0200
@@ -0,0 +1,3 @@
+ul.filtering {
+	margin: 0;
+}
\ No newline at end of file

--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/cms/app-client/app/styles/components/sorting-component.scss	Fri Jun 10 23:42:11 2016 +0200
@@ -0,0 +1,50 @@
+.sorting-component {
+    position: relative;
+    height: calc(100% - 45px);
+}
+
+ul.options,
+ul.tags {
+    list-style: none;
+    padding: 0;
+}
+
+ul.options {
+    margin: 0;
+    display: inline-block;
+}
+
+ul.tags {
+    text-align: justify;
+    position: absolute;
+    overflow-y: scroll;
+    bottom: 0px;
+    top: 18px;
+    margin: 10px 0;
+}
+
+ul.options li,
+ul.tags li {
+    display: inline;
+    cursor: pointer;
+}
+
+ul.tags li {
+    line-height: 24px;
+}
+
+ul.options li:not(:first-child)::before {
+    content: '|';
+}
+
+ul.tags li.not-popular{
+  font-size: 16px;
+}
+
+ul.tags li.popular{
+  font-size: 20px;
+}
+
+ul.tags li.very-popular{
+  font-size: 24px;
+}

--- a/cms/app-client/app/styles/tabs/thematiques.scss	Fri Jun 10 18:37:26 2016 +0200
+++ b/cms/app-client/app/styles/tabs/thematiques.scss	Fri Jun 10 23:42:11 2016 +0200
@@ -29,23 +29,4 @@
 .search-box input[type="text"]:focus,
 .search-box input[type="text"].focus {
   border-bottom: solid 2px #969696;
-}
-
-.tag-cloud{
-  margin: 15px;
-  text-align: justify;
-}
-
-.tag-cloud span{
-  cursor: pointer;
-}
-
-.not-popular{
-  font-size: 1em;
-}
-.popular{
-  font-size: 1.3em;
-}
-.very-popular{
-  font-size: 1.6em;
-}
+}
\ No newline at end of file

--- a/cms/app-client/app/templates/components/sorting-component.hbs	Fri Jun 10 18:37:26 2016 +0200
+++ b/cms/app-client/app/templates/components/sorting-component.hbs	Fri Jun 10 23:42:11 2016 +0200
@@ -2,21 +2,21 @@
 
 <div>
 
-    <header>Trier par :</header>
+    Trier par :
 
-    <ul>
+    <ul class="options">
         <li {{ action 'sortBy' 'alphabetical' }}>Ordre alphabétique</li>
         <li {{ action 'sortBy' 'popularity' }}>Popularité</li>
     </ul>
 
 </div>
 
-<ul class="sorting">
+<ul class="tags">
 
     {{#each sortedThemes as |theme| }}
         
         {{#if theme.label}}
-        <span {{ action 'setQueryParameters' theme.id }} class="{{ popularity theme.count minimum maximum }}">{{ theme.label }} ({{ theme.count }})</span>
+        <li {{ action 'setQueryParameters' theme.id }} class="{{ popularity theme.count minimum maximum }}">{{ theme.label }} ({{ theme.count }})</li>
         {{/if}}
     
     {{/each }}