diff --git a/maraudes/templates/maraudes/index.html b/maraudes/templates/maraudes/index.html
index 665289a..afb35e6 100644
--- a/maraudes/templates/maraudes/index.html
+++ b/maraudes/templates/maraudes/index.html
@@ -26,8 +26,12 @@
           Aucune maraude prévue.
         {% endif %}
         </p>
-        <a href="{% url 'maraudes:planning' %}" class="card-link text-primary">Voir le planning</a>
-        <a href="{% url 'notes:liste-maraude' %}" class="card-link text-primary">Toutes les maraudes</a>
+        <a href="{% url 'maraudes:planning' %}" class="card-link text-primary">
+            <span class="oi oi-calendar" title="Calendar" aria-hidden="true"></span> 
+            Voir le planning</a>
+        <a href="{% url 'notes:liste-maraude' %}" class="card-link text-primary">
+            <span class="oi oi-list" title="Liste" aria-hidden="true"></span> 
+            Toutes les maraudes</a>
       </div>
     </div>
     <div class="row">
@@ -71,11 +75,21 @@
   <div class="card shadow">
     <div class="card-header bg-dark text-white">
         <ul class="nav nav-tabs card-header-tabs" id="addNote" role="tablist">
-            <li class="nav-item my-2"><strong class="nav-text pr-2">Ajouter </strong></li>
+            <li class="nav-item my-2">
+                <strong class="nav-text pr-2">
+                <span class="oi oi-plus" title="+" aria-hidden="true"></span>
+                Ajouter</strong></li>
             <li class="nav-item">
-              <a class="nav-link" role="tab" data-toggle="tab" href="#noteNote" aria-expanded="false" aria-controls="noteNote">Note</a></li>
-            <li class="nav-item"><a class="nav-link active" role="tab" data-toggle="tab" href="#noteAppel" aria-expanded="false" aria-controls="noteAppel">Appel</a></li>
-            <li class="nav-item"><a class="nav-link" role="tab" data-toggle="tab" href="#noteSignalement" aria-expanded="false" aria-controls="noteSignalement">Signalement</a></li>
+              <a class="nav-link" role="tab" data-toggle="tab" href="#noteNote" aria-expanded="false" aria-controls="noteNote">
+                  <span class="oi oi-file" title="Phone" aria-hidden="true"></span>
+                  Note</a>
+            </li>
+            <li class="nav-item"><a class="nav-link active" role="tab" data-toggle="tab" href="#noteAppel" aria-expanded="false" aria-controls="noteAppel">
+                  <span class="oi oi-phone" title="Phone" aria-hidden="true"></span>
+                  Appel</a></li>
+            <li class="nav-item"><a class="nav-link" role="tab" data-toggle="tab" href="#noteSignalement" aria-expanded="false" aria-controls="noteSignalement">
+                  <span class="oi oi-warning" title="Phone" aria-hidden="true"></span>
+                  Signalement</a></li>
         </ul>
     </div>
     <div class="card-body tab-content">
diff --git a/notes/templates/notes/base.html b/notes/templates/notes/base.html
index 3cc66a3..f6d86be 100644
--- a/notes/templates/notes/base.html
+++ b/notes/templates/notes/base.html
@@ -3,7 +3,6 @@
 {% block title %}Notes >{% endblock %}
 
 {% block breadcrumbs %}
-  <li>Notes</li>
 {% endblock %}
 
 {% block sidebar %}
diff --git a/notes/templates/notes/details.html b/notes/templates/notes/details.html
index c3fceaa..c2b6d87 100644
--- a/notes/templates/notes/details.html
+++ b/notes/templates/notes/details.html
@@ -2,7 +2,7 @@
 {% load bootstrap4 notes %}
 
 {% block page_content %}
-<div class="col-lg-8 col-md-12">
+<div class="col-lg-7 col-md-12">
   <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
     <div class="panel panel-primary">
       <div class="panel-heading" role="tab" id="notesHeading">
@@ -26,7 +26,7 @@
   </div>
 </div>
 
-<div class="col-lg-4 col-md-12">
+<div class="col-lg-5 col-md-12">
   {% block right_column %}{% endblock %}
 </div>
 {% endblock %}
diff --git a/notes/templates/notes/details_maraude.html b/notes/templates/notes/details_maraude.html
index 39248bb..e31da54 100644
--- a/notes/templates/notes/details_maraude.html
+++ b/notes/templates/notes/details_maraude.html
@@ -5,24 +5,23 @@
 {% endblock %}
 
 {% block breadcrumbs %}
-  {{ block.super }}
-  <li><a href="{% url "notes:liste-maraude" %}">Maraudes</a></li>
-  <li>{{ maraude }}</li>
+  <h6 class="navbar-text text-white my-2">Compte-rendu</h6>
+  <p class="navbar-text my-2 ml-2">{{ maraude }}</p>
 {% endblock %}
 
 {% block sidebar %}
     <h6 class="sidebar-heading mt-4 px-3">Navigation</h6>
-    <nav class="d-flex px-3 justify-content-center" aria-label="Maraudes navigation">
+    <nav class="d-flex px-3 justify-content-left" aria-label="Maraudes navigation">
     <ul class="pagination">
     <li class="page-item {% if not prev_maraude %}disabled{% endif %}">
-      <a class="page-link" href="{% if prev_maraude %}{% url "notes:details-maraude" prev_maraude.pk %}{% else %}#{% endif %}" aria-label="Previous">
-        <span aria-hidden="true">&laquo;</span>
+      <a class="page-link px-4" href="{% if prev_maraude %}{% url "notes:details-maraude" prev_maraude.pk %}{% else %}#{% endif %}" aria-label="Previous">
+        <span class="oi oi-chevron-left" aria-hidden="true"></span>
         <span class="sr-only">Previous</span>
       </a>
     </li>
     <li class="page-item {% if not next_maraude %}disabled{% endif %}">
-      <a class="page-link" href="{% if next_maraude %}{% url "notes:details-maraude" next_maraude.pk %}{%else%}#{% endif %}" aria-label="Next">
-        <span aria-hidden="true">&raquo;</span>
+      <a class="page-link px-4" href="{% if next_maraude %}{% url "notes:details-maraude" next_maraude.pk %}{%else%}#{% endif %}" aria-label="Next">
+        <span class="oi oi-chevron-right" aria-hidden="true"></span>
         <span class="sr-only">Next</span>
       </a>
     </li>
@@ -31,7 +30,7 @@
 {% endblock %}
 
 {% block right_column %}
-<div class="card sticky-top mt-4">
+<div class="card position-fixed">
   <h6 class="card-header">Informations</h6>
   <div class="card-body">
     <p><strong>Maraudeurs :</strong>&nbsp; {{ maraude.binome }} & {{ maraude.referent }}</p>
diff --git a/notes/templates/notes/liste.html b/notes/templates/notes/liste.html
index 5b219de..f9914bd 100644
--- a/notes/templates/notes/liste.html
+++ b/notes/templates/notes/liste.html
@@ -21,15 +21,19 @@
 
 {% block page_content %}
   {% block search %}{% endblock %}
-  <!-- Table -->
-  {% table object_list cols=3 cell_template=table_cell_template header=table_header %}
   {% if is_paginated %}
-    <div class="text-center">
+    <div class="d-flex flex-fill justify-content-center">
       <ul class="pagination">{% with request.GET.filter as filter %}
       {% for num in page_obj.paginator.page_range %}
-        <li {% if page_obj.number == num %} class="active" {%endif%}><a href="?{% if filter %}filter={{ filter }}&{%endif%}page={{num}}">{{num}}</a></li>
+        <li class="page-item {% if page_obj.number == num %}active{%endif%}">
+            <a class="page-link" href="?{% if filter %}filter={{ filter }}&{%endif%}page={{num}}">{{num}}</a>
+        </li>
       {%endfor%}{% endwith %}
       </ul>
     </div>
   {% endif %}
+  <!-- Table -->
+  <div class="card card-body">
+  {% table object_list cols=3 cell_template=table_cell_template header=table_header %}
+  </div>
 {% endblock %}
diff --git a/notes/templates/notes/liste_maraudes.html b/notes/templates/notes/liste_maraudes.html
index 861e546..d573e0e 100644
--- a/notes/templates/notes/liste_maraudes.html
+++ b/notes/templates/notes/liste_maraudes.html
@@ -5,8 +5,7 @@
 {% endblock %}
 
 {% block breadcrumbs %}
-  {{block.super}}
-  <li><a href="{% url "notes:liste-maraude" %}">Maraudes</a></li>
+  <h6 class="navbar-text my-2 text-white">Liste des maraudes</h6>
 {% endblock %}
 
 
diff --git a/notes/templates/notes/liste_sujets.html b/notes/templates/notes/liste_sujets.html
index 49365c2..d4f22a4 100644
--- a/notes/templates/notes/liste_sujets.html
+++ b/notes/templates/notes/liste_sujets.html
@@ -3,9 +3,7 @@
 {% block title %}{{block.super}} Liste des sujets {% endblock %}
 
 {% block breadcrumbs %}
-  {{ block.super }}
-  <li><a href="{% url "notes:liste-sujet" %}">Sujets</a></li>
-  {% if query_text %}<li>'{{query_text}}'</li>{% endif %}
+    <h6 class="navbar-text text-white my-2">Liste des sujets</h6>
 {% endblock %}
 
 {% block sidebar_insert %}