diff --git a/avisstage/sass/screen.scss b/avisstage/sass/screen.scss
index 2558c89..e995fb7 100644
--- a/avisstage/sass/screen.scss
+++ b/avisstage/sass/screen.scss
@@ -103,7 +103,6 @@ p {
     }
 }
 
-
 // Index
 
 .homeh1 {
@@ -178,13 +177,13 @@ article.stage {
         text-shadow: -3px 3px 0 rgba(#000, 0.3);
     }
     h3 {
-        background: desaturate($compl, 40%);
+        border-bottom: 2px solid desaturate($compl, 40%);
         margin-left: -25px;
         margin-top: 30px;
         padding: 5px;
         padding-left: 20px;
-        color: #fff;
-        text-shadow: -3px 3px 0 rgba(#000, 0.3);
+        color: #000;
+        text-shadow: -3px 3px 0 rgba(#000, 0.1);
         //margin-right: 25px;
     }
     section {
@@ -193,7 +192,15 @@ article.stage {
         max-width: 600px;
         margin: 30px auto;
 
+        &:first-child {
+            margin-top: 0;
+            h3 {
+                margin-top: 0;
+            }
+        }
+        
         &.misc {
+            padding-top: 0;
             ul.infos {
                 margin: 0 -3px;
                 
@@ -291,3 +298,34 @@ article.stage {
         }
     }
 }
+
+.article-wrapper {
+    display: table;
+    .toc-wrapper, article {
+        display: table-cell;
+        vertical-align: top;
+    }
+    .toc-wrapper {
+        max-width: 250px;
+        width: 25%;
+    }
+    .toc {
+        position: -webkit-sticky;
+        position: sticky;
+        top: 0;
+        a {
+            color: inherit;
+            font-weight: normal;
+        }
+        .toc-h1 {
+            
+        }
+        .toc-h3 a {
+            font-weight: 300;
+        }
+        .toc-active a {
+            color: $fond;
+        }
+    }
+
+}
diff --git a/avisstage/static/css/screen.css b/avisstage/static/css/screen.css
index f075a7e..ab41fd4 100644
--- a/avisstage/static/css/screen.css
+++ b/avisstage/static/css/screen.css
@@ -165,7 +165,7 @@ header h1 {
   margin: 0.5em 0;
 }
 
-/* line 109, ../../sass/screen.scss */
+/* line 108, ../../sass/screen.scss */
 .homeh1 {
   display: flex;
   justify-content: space-between;
@@ -175,33 +175,33 @@ header h1 {
   border-bottom: 3px solid #000;
   margin-bottom: 15px;
 }
-/* line 118, ../../sass/screen.scss */
+/* line 117, ../../sass/screen.scss */
 .homeh1 > * {
   display: inline-block;
 }
 
-/* line 128, ../../sass/screen.scss */
+/* line 127, ../../sass/screen.scss */
 .stagelist li {
   display: table;
   width: 100%;
   background: #fff;
   margin: 12px;
 }
-/* line 135, ../../sass/screen.scss */
+/* line 134, ../../sass/screen.scss */
 .stagelist li > *, .stagelist li:before {
   display: table-cell;
   vertical-align: middle;
   padding: 15px;
 }
-/* line 140, ../../sass/screen.scss */
+/* line 139, ../../sass/screen.scss */
 .stagelist li a {
   width: auto;
 }
-/* line 142, ../../sass/screen.scss */
+/* line 141, ../../sass/screen.scss */
 .stagelist li a:hover {
   background: #ccc;
 }
-/* line 146, ../../sass/screen.scss */
+/* line 145, ../../sass/screen.scss */
 .stagelist li:before {
   content: "&nbsp";
   text-align: right;
@@ -209,27 +209,27 @@ header h1 {
   opacity: 0.8;
   color: #fff;
 }
-/* line 153, ../../sass/screen.scss */
+/* line 152, ../../sass/screen.scss */
 .stagelist li.stage-brouillon:before {
   content: "Brouillon";
   background: #C21B26;
 }
-/* line 157, ../../sass/screen.scss */
+/* line 156, ../../sass/screen.scss */
 .stagelist li.stage-publie:before {
   content: "Publié";
   background: #27E35F;
 }
-/* line 161, ../../sass/screen.scss */
+/* line 160, ../../sass/screen.scss */
 .stagelist li.stage-ajout:before {
   content: "+";
   color: #000;
 }
 
-/* line 170, ../../sass/screen.scss */
+/* line 169, ../../sass/screen.scss */
 article.stage {
   font-weight: normal;
 }
-/* line 173, ../../sass/screen.scss */
+/* line 172, ../../sass/screen.scss */
 article.stage h2 {
   background: #d8d864;
   padding: 10px 20px;
@@ -237,28 +237,40 @@ article.stage h2 {
   margin-bottom: 25px;
   text-shadow: -3px 3px 0 rgba(0, 0, 0, 0.3);
 }
-/* line 180, ../../sass/screen.scss */
+/* line 179, ../../sass/screen.scss */
 article.stage h3 {
-  background: #56917c;
+  border-bottom: 2px solid #56917c;
   margin-left: -25px;
   margin-top: 30px;
   padding: 5px;
   padding-left: 20px;
-  color: #fff;
-  text-shadow: -3px 3px 0 rgba(0, 0, 0, 0.3);
+  color: #000;
+  text-shadow: -3px 3px 0 rgba(0, 0, 0, 0.1);
 }
-/* line 190, ../../sass/screen.scss */
+/* line 189, ../../sass/screen.scss */
 article.stage section {
   background: #eee;
   padding: 14px;
   max-width: 600px;
   margin: 30px auto;
 }
+/* line 195, ../../sass/screen.scss */
+article.stage section:first-child {
+  margin-top: 0;
+}
 /* line 197, ../../sass/screen.scss */
+article.stage section:first-child h3 {
+  margin-top: 0;
+}
+/* line 202, ../../sass/screen.scss */
+article.stage section.misc {
+  padding-top: 0;
+}
+/* line 204, ../../sass/screen.scss */
 article.stage section.misc ul.infos {
   margin: 0 -3px;
 }
-/* line 200, ../../sass/screen.scss */
+/* line 207, ../../sass/screen.scss */
 article.stage section.misc ul.infos li {
   display: inline-block;
   padding: 5px;
@@ -268,42 +280,42 @@ article.stage section.misc ul.infos li {
   font-size: 0.9em;
   border-radius: 4px;
 }
-/* line 209, ../../sass/screen.scss */
+/* line 216, ../../sass/screen.scss */
 article.stage section.misc ul.infos li.thematique {
   background-color: #28BF8A;
 }
-/* line 212, ../../sass/screen.scss */
+/* line 219, ../../sass/screen.scss */
 article.stage section.misc ul.infos li.matiere {
   background-color: #E80051;
 }
-/* line 219, ../../sass/screen.scss */
+/* line 226, ../../sass/screen.scss */
 article.stage section .chapo, article.stage section .avis-texte {
   margin-bottom: 15px;
   background: #fff;
   padding: 20px;
 }
-/* line 224, ../../sass/screen.scss */
+/* line 231, ../../sass/screen.scss */
 article.stage section .chapo {
   font-size: 1.1em;
   font-weight: 500;
   font-variant: small-caps;
 }
-/* line 229, ../../sass/screen.scss */
+/* line 236, ../../sass/screen.scss */
 article.stage section .avis-texte {
   border-left: 1px solid #ccc;
   padding-left: 15px;
 }
-/* line 234, ../../sass/screen.scss */
+/* line 241, ../../sass/screen.scss */
 article.stage section .plusmoins {
   max-width: 600px;
   margin: 15px auto;
 }
-/* line 238, ../../sass/screen.scss */
+/* line 245, ../../sass/screen.scss */
 article.stage section .plusmoins > div {
   display: table;
   width: 100%;
 }
-/* line 242, ../../sass/screen.scss */
+/* line 249, ../../sass/screen.scss */
 article.stage section .plusmoins > div:before {
   content: "&nbsp";
   width: 100px;
@@ -312,44 +324,78 @@ article.stage section .plusmoins > div:before {
   text-align: right;
   padding-right: 12px;
 }
-/* line 251, ../../sass/screen.scss */
+/* line 258, ../../sass/screen.scss */
 article.stage section .plusmoins > div > *, article.stage section .plusmoins > div:before {
   display: table-cell;
 }
-/* line 255, ../../sass/screen.scss */
+/* line 262, ../../sass/screen.scss */
 article.stage section .plusmoins > div > div {
   padding: 15px;
   color: #fff;
 }
-/* line 258, ../../sass/screen.scss */
+/* line 265, ../../sass/screen.scss */
 article.stage section .plusmoins > div > div h4 {
   font-weight: normal;
   margin-left: -5px;
   font-size: 0.9em;
   opacity: 0.9;
 }
-/* line 264, ../../sass/screen.scss */
+/* line 271, ../../sass/screen.scss */
 article.stage section .plusmoins > div > div p {
   font-weight: bold;
   margin: 2px;
 }
-/* line 272, ../../sass/screen.scss */
+/* line 279, ../../sass/screen.scss */
 article.stage section .plusmoins .plus > div {
   background: #23cc56;
 }
-/* line 275, ../../sass/screen.scss */
+/* line 282, ../../sass/screen.scss */
 article.stage section .plusmoins .plus:before {
   content: "Les +";
   vertical-align: bottom;
   color: #1b9f43;
 }
-/* line 282, ../../sass/screen.scss */
+/* line 289, ../../sass/screen.scss */
 article.stage section .plusmoins .moins > div {
   background: #af1822;
 }
-/* line 285, ../../sass/screen.scss */
+/* line 292, ../../sass/screen.scss */
 article.stage section .plusmoins .moins:before {
   content: "Les -";
   vertical-align: top;
   color: #88131b;
 }
+
+/* line 302, ../../sass/screen.scss */
+.article-wrapper {
+  display: table;
+}
+/* line 304, ../../sass/screen.scss */
+.article-wrapper .toc-wrapper, .article-wrapper article {
+  display: table-cell;
+  vertical-align: top;
+}
+/* line 308, ../../sass/screen.scss */
+.article-wrapper .toc-wrapper {
+  max-width: 250px;
+  width: 25%;
+}
+/* line 312, ../../sass/screen.scss */
+.article-wrapper .toc {
+  position: -webkit-sticky;
+  position: sticky;
+  top: 0;
+}
+/* line 316, ../../sass/screen.scss */
+.article-wrapper .toc a {
+  color: inherit;
+  font-weight: normal;
+}
+/* line 323, ../../sass/screen.scss */
+.article-wrapper .toc .toc-h3 a {
+  font-weight: 300;
+}
+/* line 326, ../../sass/screen.scss */
+.article-wrapper .toc .toc-active a {
+  color: #E80051;
+}
diff --git a/avisstage/static/js/toc.min.js b/avisstage/static/js/toc.min.js
new file mode 100644
index 0000000..8cfde52
--- /dev/null
+++ b/avisstage/static/js/toc.min.js
@@ -0,0 +1,8 @@
+/*!
+ * toc - jQuery Table of Contents Plugin
+ * v0.3.2
+ * http://projects.jga.me/toc/
+ * copyright Greg Allen 2014
+ * MIT License
+*/
+!function(a){a.fn.smoothScroller=function(b){b=a.extend({},a.fn.smoothScroller.defaults,b);var c=a(this);return a(b.scrollEl).animate({scrollTop:c.offset().top-a(b.scrollEl).offset().top-b.offset},b.speed,b.ease,function(){var a=c.attr("id");a.length&&(history.pushState?history.pushState(null,null,"#"+a):document.location.hash=a),c.trigger("smoothScrollerComplete")}),this},a.fn.smoothScroller.defaults={speed:400,ease:"swing",scrollEl:"body,html",offset:0},a("body").on("click","[data-smoothscroller]",function(b){b.preventDefault();var c=a(this).attr("href");0===c.indexOf("#")&&a(c).smoothScroller()})}(jQuery),function(a){var b={};a.fn.toc=function(b){var c,d=this,e=a.extend({},jQuery.fn.toc.defaults,b),f=a(e.container),g=a(e.selectors,f),h=[],i=e.activeClass,j=function(b,c){if(e.smoothScrolling&&"function"==typeof e.smoothScrolling){b.preventDefault();var f=a(b.target).attr("href");e.smoothScrolling(f,e,c)}a("li",d).removeClass(i),a(b.target).parent().addClass(i)},k=function(){c&&clearTimeout(c),c=setTimeout(function(){for(var b,c=a(window).scrollTop(),f=Number.MAX_VALUE,g=0,j=0,k=h.length;k>j;j++){var l=Math.abs(h[j]-c);f>l&&(g=j,f=l)}a("li",d).removeClass(i),b=a("li:eq("+g+")",d).addClass(i),e.onHighlight(b)},50)};return e.highlightOnScroll&&(a(window).bind("scroll",k),k()),this.each(function(){var b=a(this),c=a(e.listType);g.each(function(d,f){var g=a(f);h.push(g.offset().top-e.highlightOffset);var i=e.anchorName(d,f,e.prefix);if(f.id!==i){a("<span/>").attr("id",i).insertBefore(g)}var l=a("<a/>").text(e.headerText(d,f,g)).attr("href","#"+i).bind("click",function(c){a(window).unbind("scroll",k),j(c,function(){a(window).bind("scroll",k)}),b.trigger("selected",a(this).attr("href"))}),m=a("<li/>").addClass(e.itemClass(d,f,g,e.prefix)).append(l);c.append(m)}),b.html(c)})},jQuery.fn.toc.defaults={container:"body",listType:"<ul/>",selectors:"h1,h2,h3",smoothScrolling:function(b,c,d){a(b).smoothScroller({offset:c.scrollToOffset}).on("smoothScrollerComplete",function(){d()})},scrollToOffset:0,prefix:"toc",activeClass:"toc-active",onHighlight:function(){},highlightOnScroll:!0,highlightOffset:100,anchorName:function(c,d,e){if(d.id.length)return d.id;var f=a(d).text().replace(/[^a-z0-9]/gi," ").replace(/\s+/g,"-").toLowerCase();if(b[f]){for(var g=2;b[f+g];)g++;f=f+"-"+g}return b[f]=!0,e+"-"+f},headerText:function(a,b,c){return c.text()},itemClass:function(a,b,c,d){return d+"-"+c[0].tagName.toLowerCase()}}}(jQuery);
\ No newline at end of file
diff --git a/avisstage/templates/avisstage/detail/stage.html b/avisstage/templates/avisstage/detail/stage.html
index cbdc14b..2662da7 100644
--- a/avisstage/templates/avisstage/detail/stage.html
+++ b/avisstage/templates/avisstage/detail/stage.html
@@ -1,29 +1,42 @@
 {% extends "avisstage/base.html" %}
 {% load staticfiles %}
 
+{% block extra_head %}
+    <script src="{% static 'js/toc.min.js' %}" type="text/javascript"></script>
+    <script type="text/javascript">
+     $(function(){$(".toc").toc({container:'.content'});});
+    </script>
+{% endblock %}
+    
 {% block content %}
     <h1>{{ object.sujet }}</h1>
     {% if object.auteur == user.profil %}
         <p><a href="{% url "avisstage:stage_edit" object.id %}">Modifier ce stage</a></p>
     {% endif %}
-    <article class="stage">
-        <section class="misc">
-            <h3>À propos du stage</h3>
-            <p>{{ object.auteur.nom }} a fait ce stage du {{ object.date_debut }} au {{ object.date_fin }}, supervisé par {{ object.encadrants }}</p>
-            <ul class="infos">
-                {% for matiere in object.matieres.all %}
-                    <li class="matiere">{{ matiere.nom }}</li>
-                {% endfor %}
-                {% for thematique in object.thematiques.all %}
-                    <li class="thematique">{{ thematique.name }}</li>
-                {% endfor %}
-            </ul>
-        </section>
+    <div class="article-wrapper">
+        <div class="toc-wrapper">
+            <div class="toc">
+            </div>
+        </div>
+        <article class="stage">
+            <section class="misc">
+                <h3>À propos du stage</h3>
+                <p>{{ object.auteur.nom }} a fait ce stage du {{ object.date_debut }} au {{ object.date_fin }}, supervisé par {{ object.encadrants }}</p>
+                <ul class="infos">
+                    {% for matiere in object.matieres.all %}
+                        <li class="matiere">{{ matiere.nom }}</li>
+                    {% endfor %}
+                    {% for thematique in object.thematiques.all %}
+                        <li class="thematique">{{ thematique.name }}</li>
+                    {% endfor %}
+                </ul>
+            </section>
 
-        {% include "avisstage/detail/avis.html" with avis=object.avis_stage titre="Avis sur le stage" %}
+            {% include "avisstage/detail/avis.html" with avis=object.avis_stage titre="Avis sur le stage" %}
 
-        {% for avis in object.avislieu_set.all %}
-            {% include "avisstage/detail/avis.html" with avis=avis titre="Avis sur le lieu" %}
-        {% endfor %}
-    </article>
+            {% for avis in object.avislieu_set.all %}
+                {% include "avisstage/detail/avis.html" with avis=avis titre="Avis sur le lieu" %}
+            {% endfor %}
+        </article>
+    </div>
 {% endblock %}