diff --git a/settings/templates/settings/settings.html b/settings/templates/settings/settings.html
index ea7918e..c2be7b6 100644
--- a/settings/templates/settings/settings.html
+++ b/settings/templates/settings/settings.html
@@ -2,10 +2,12 @@
 {% block content %}
 <h1>Page d'administration du site</h1>
 <h2>Liste des catégories</h2>
-<a class="btn btn-primary btn-sm" role="button" href="{% url 'content:category-new' %}">
-    <i class="glyphicon glyphicon-plus"></i>
+<a class="btn btn-success btn-sm" role="button" href="{% url 'content:category-new' %}">
+    <i class="fas fa-plus"></i>
     Créer une nouvelle catégorie
 </a>
+<br/>
+<br/>
 <table class="table table-striped">
     <tr>
         <th>Nom de la catégorie</th>
@@ -16,12 +18,13 @@
     <tr>
         <td><a href="{{c.get_absolute_url}}">{{c.name}}</a></td>
         <td>{{c.content_set.count}}</td>
-        <td><a class="btn btn-primary btn-sm" href="{% url "content:category-edit" c.pk %}">
-            <i class="glyphicon glyphicon-edit"></i>
+        <td><a class="btn  btn-outline-primary btn-sm" href="{% url "content:category-edit" c.pk %}">
+            <i class="fas fa-edit"></i>
             Éditer
         </a>
-        <a class="btn btn-danger btn-sm" title="Supprimer" href="{% url "content:category-delete" c.pk %}">
-            <i class="glyphicon glyphicon-trash"></i>
+        <a class="btn btn-outline-danger btn-sm" title="Supprimer" href="{% url "content:category-delete" c.pk %}">
+            <i class="fas fa-trash-alt"></i>
+            Supprimer
         </a>
         </td>
 
@@ -30,10 +33,12 @@
 </table>
 
 <h2>Écoles</h2>
-<a class="btn btn-primary btn-sm" role="button" href="{% url 'users:new-school' %}">
-    <i class="glyphicon glyphicon-plus"></i>
+<a class="btn btn-success btn-sm" role="button" href="{% url 'users:new-school' %}">
+    <i class="fas fa-plus"></i>
     Inscrire une nouvelle école
 </a>
+<br/>
+<br/>
 <table class="table table-striped">
     <tr>
         <th>Nom</th>
@@ -43,12 +48,13 @@
     <tr>
         <th>{{school.group.name}}</th>
         <td>{{school.group.user_set.count}}</td>
-        <td><a class="btn btn-primary btn-sm" href="{% url "users:edit-school" pk=school.pk%}">
-            <i class="glyphicon glyphicon-edit"></i>
+        <td><a class="btn btn-outline-primary btn-sm" href="{% url "users:edit-school" pk=school.pk%}">
+            <i class="fas fa-edit"></i>
             Éditer
         </a>
-        <a class="btn btn-danger btn-sm" title="Supprimer" href="">
-            <i class="glyphicon glyphicon-trash"></i>
+        <a class="btn btn-outline-danger btn-sm" title="Supprimer" href="">
+            <i class="fas fa-trash-alt"></i>
+            Supprimer
         </a>
         </td>
     </tr>
@@ -57,9 +63,11 @@
 <h2>Réglages</h2>
 <h3>Réglages du site</h3>
 <a class="btn btn-primary btn-sm" href="">
-    <i class="glyphicon glyphicon-edit"></i>
+    <i class="fas fa-edit"></i>
     Éditer
 </a>
+<br/>
+<br/>
 <table class="table table-striped">
     <tr>
         <th>Upload</th>
@@ -77,11 +85,13 @@
     </tr>
 </table>
 
-<h3>Réglage du contenu</h3>
+<h3>Réglages du contenu</h3>
 <a class="btn btn-primary btn-sm" href="">
-    <i class="glyphicon glyphicon-edit"></i>
+    <i class="fas fa-edit"></i>
     Éditer
 </a>
+<br/>
+<br/>
 <table class="table table-striped">
     <tr>
         <th>URL du FTP</th>
diff --git a/templates/base.html b/templates/base.html
index acbbf5f..25f9b95 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -4,8 +4,8 @@
         <meta charset='utf-8'>
         <title>Il était une fois à l'est</title>
         <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
-		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
+		<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
+        <script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>
     </head>
     <body>
         {% include 'nav_bar.html' %}
@@ -13,7 +13,7 @@
         {% block content %}{% endblock %}
         </div>
         <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
-        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
-        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/js/bootstrap.min.js" integrity="sha384-a5N7Y/aK3qNeh15eJKGWxsqtnX/wWdSZSKp+81YjTmS15nvnvxKHuzaWwXHDli+4" crossorigin="anonymous"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
+<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
     </body>
 </html>
diff --git a/templates/edit.html b/templates/edit.html
index feb69a4..106fa6a 100644
--- a/templates/edit.html
+++ b/templates/edit.html
@@ -1,14 +1,18 @@
 {% extends 'base.html' %}
+{% load bootstrap3 %}
 {% block content %}
 {% if title %}
 <h1>{{title}}</h1>
 {% endif %}
 <form action="" method="post">{% csrf_token %}
-    {{ form.as_p }}
-    {% if validate %}
-    <input type="submit" value="{{validate}}" />
-    {% else %}
-    <input type="submit" value="Mettre à jour" />
-    {% endif %}
+    {% bootstrap_form form %}
+    <button type="submit" class="btn btn-primary">
+        {% bootstrap_icon "star" %}
+        {% if validate %}
+            {{validate}}
+        {% else %}
+            Mettre à jour
+        {% endif %}
+    </button>
 </form>
 {% endblock %}
diff --git a/templates/nav_bar.html b/templates/nav_bar.html
index e0aeacf..e8956f0 100644
--- a/templates/nav_bar.html
+++ b/templates/nav_bar.html
@@ -1,33 +1,19 @@
 {% load categories %}
 {% load_categories %}
-<nav class="navbar navbar-default navbar-inverse">
-  <div class="container-fluid">
-    <!-- Brand and toggle get grouped for better mobile display -->
-    <div class="navbar-header">
-      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
-        <span class="sr-only">Toggle navigation</span>
-        <span class="icon-bar"></span>
-        <span class="icon-bar"></span>
-        <span class="icon-bar"></span>
-      </button>
-      <a class="navbar-brand" href="#">Brand</a>
-    </div>
-
-    <!-- Collect the nav links, forms, and other content for toggling -->
-    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
-      <ul class="nav navbar-nav">
+<nav class="navbar navbar-expand-lg navbar-light bg-light">
+    <a class="navbar-brand" href="{% url "home"%}">Il était une fois à l'est</a>
+    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarText" aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation">
+    <span class="navbar-toggler-icon"></span>
+    </button>
+    <div class="collapse navbar-collapse" id="navbarText">
+    <ul class="navbar-nav mr-auto">
         {% for c in categories %}
-        {% if category.pk == c.pk %}
-        <li class="active">
-        {%else%}
-        <li>
-        {%endif%}
-            <a href="{% url 'content:category-list' c.pk %}">{{c.name}}
+        <li class="nav-item
+        {% if category.pk == c.pk %}active{%endif%}">
+        <a class="nav-link" href="{% url 'content:category-list' c.pk %}">{{c.name}}
         </a></li>
         {% endfor %}
-		<li><a href="{% url 'vote:home' %}">Vote</a></li>
-		<li><a href="{% url 'settings:index' %}">Administration</a></li>
-      </ul>
-    </div><!-- /.navbar-collapse -->
-  </div><!-- /.container-fluid -->
+
+        <li class="nav-item {% if vote %}active{% endif %}"><a class="nav-link" href="{% url 'vote:home' %}">Vote</a></li>
+        <li class="nav-item {% if settings %}active{% endif %}"><a class="nav-link" href="{% url 'settings:index' %}">Administration</a></li>
 </nav>