diff --git a/assets/styles/app.css b/assets/styles/app.css
index cb33b13..e69de29 100644
--- a/assets/styles/app.css
+++ b/assets/styles/app.css
@@ -1,3 +0,0 @@
-body {
-    background-color: lightgray;
-}
diff --git a/src/Controller/PagesController.php b/src/Controller/PagesController.php
index bbed3df..277b38c 100644
--- a/src/Controller/PagesController.php
+++ b/src/Controller/PagesController.php
@@ -8,7 +8,7 @@ use Symfony\Component\Routing\Annotation\Route;
 
 class PagesController extends AbstractController
 {
-    #[Route('/pages', name: 'app_pages')]
+    #[Route('/', name: 'app_index')]
     public function index(): Response
     {
         return $this->render('pages/index.html.twig', [
diff --git a/templates/atelier/_delete_form.html.twig b/templates/atelier/_delete_form.html.twig
index 4eb7ce9..16a3c06 100644
--- a/templates/atelier/_delete_form.html.twig
+++ b/templates/atelier/_delete_form.html.twig
@@ -1,4 +1,4 @@
 <form method="post" action="{{ path('app_atelier_delete', {'id': atelier.id}) }}" onsubmit="return confirm('Are you sure you want to delete this item?');">
     <input type="hidden" name="_token" value="{{ csrf_token('delete' ~ atelier.id) }}">
-    <button class="btn">Delete</button>
+    <button class="btn btn-outline-danger" >Delete</button>
 </form>
diff --git a/templates/atelier/_form.html.twig b/templates/atelier/_form.html.twig
index bf20b98..1e6b21a 100644
--- a/templates/atelier/_form.html.twig
+++ b/templates/atelier/_form.html.twig
@@ -1,4 +1,4 @@
 {{ form_start(form) }}
     {{ form_widget(form) }}
-    <button class="btn">{{ button_label|default('Save') }}</button>
+    <button class="btn btn-outline-primary" >{{ button_label|default('Save') }}</button>
 {{ form_end(form) }}
diff --git a/templates/atelier/edit.html.twig b/templates/atelier/edit.html.twig
index c844be6..a302ccc 100644
--- a/templates/atelier/edit.html.twig
+++ b/templates/atelier/edit.html.twig
@@ -7,7 +7,7 @@
 
     {{ include('atelier/_form.html.twig', {'button_label': 'Update'}) }}
 
-    <a href="{{ path('app_atelier_index') }}">back to list</a>
+    <a class="btn btn-outline-primary"  href="{{ path('app_atelier_index') }}">back to list</a>
 
     {{ include('atelier/_delete_form.html.twig') }}
 {% endblock %}
diff --git a/templates/atelier/index.html.twig b/templates/atelier/index.html.twig
index f243327..281f6d9 100644
--- a/templates/atelier/index.html.twig
+++ b/templates/atelier/index.html.twig
@@ -8,10 +8,10 @@
     <table class="table">
         <thead>
             <tr>
-                <th>Id</th>
-                <th>Nom</th>
-                <th>Description</th>
-                <th>actions</th>
+                <th scope="row">Id</th>
+                <th scope="col">Nom</th>
+                <th class="" scope="col">Description</th>
+                <th scope="col">Actions</th>
             </tr>
         </thead>
         <tbody>
@@ -19,10 +19,13 @@
             <tr>
                 <td>{{ atelier.id }}</td>
                 <td>{{ atelier.nom }}</td>
-                <td>{{ atelier.description }}</td>
+                <td class="w-75">{{ atelier.description }}</td>
                 <td>
-                    <a href="{{ path('app_atelier_show', {'id': atelier.id}) }}">show</a>
-                    <a href="{{ path('app_atelier_edit', {'id': atelier.id}) }}">edit</a>
+                    <div>
+                        <a class="btn btn-outline-primary" href="{{ path('app_atelier_show', {'id': atelier.id}) }}">show</a>
+                        <a class="btn btn-outline-primary" href="{{ path('app_atelier_edit', {'id': atelier.id}) }}">edit</a>
+                    </div>
+
                 </td>
             </tr>
         {% else %}
@@ -33,5 +36,5 @@
         </tbody>
     </table>
 
-    <a href="{{ path('app_atelier_new') }}">Create new</a>
+    <a class="btn btn-outline-primary" href="{{ path('app_atelier_new') }}">Create new</a>
 {% endblock %}
diff --git a/templates/atelier/new.html.twig b/templates/atelier/new.html.twig
index 72b08fe..baa6f72 100644
--- a/templates/atelier/new.html.twig
+++ b/templates/atelier/new.html.twig
@@ -7,5 +7,5 @@
 
     {{ include('atelier/_form.html.twig') }}
 
-    <a href="{{ path('app_atelier_index') }}">back to list</a>
+    <a class="btn btn-outline-primary"  href="{{ path('app_atelier_index') }}">back to list</a>
 {% endblock %}
diff --git a/templates/atelier/show.html.twig b/templates/atelier/show.html.twig
index 5b0e05f..7bf0f31 100644
--- a/templates/atelier/show.html.twig
+++ b/templates/atelier/show.html.twig
@@ -22,9 +22,13 @@
         </tbody>
     </table>
 
-    <a href="{{ path('app_atelier_index') }}">back to list</a>
+    <div class="btn-group " role="group">
+
+     <a class="btn btn-outline-primary"  href="{{ path('app_atelier_index') }}">back to list</a>
+        <a class="btn btn-outline-primary"  href="{{ path('app_atelier_edit', {'id': atelier.id}) }}">edit</a>
+     {{ include('atelier/_delete_form.html.twig') }}
+
+    </div>
 
-    <a href="{{ path('app_atelier_edit', {'id': atelier.id}) }}">edit</a>
 
-    {{ include('atelier/_delete_form.html.twig') }}
 {% endblock %}
diff --git a/templates/base.html.twig b/templates/base.html.twig
index 1576ae0..7c62423 100644
--- a/templates/base.html.twig
+++ b/templates/base.html.twig
@@ -1,20 +1,43 @@
 <!DOCTYPE html>
 <html>
-    <head>
-        <meta charset="UTF-8">
-        <title>{% block title %}Welcome!{% endblock %}</title>
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-        <link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 128 128%22><text y=%221.2em%22 font-size=%2296%22>⚫️</text></svg>">
-        {# Run `composer require symfony/webpack-encore-bundle` to start using Symfony UX #}
-        {% block stylesheets %}
-            {{ encore_entry_link_tags('app') }}
-        {% endblock %}
+<head>
+    <meta charset="UTF-8">
+    <title>{% block title %}Welcome!{% endblock %}</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="icon"
+          href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 128 128%22><text y=%221.2em%22 font-size=%2296%22>⚫️</text></svg>">
+    {# Run `composer require symfony/webpack-encore-bundle` to start using Symfony UX #}
+    {% block stylesheets %}
+        {{ encore_entry_link_tags('app') }}
+    {% endblock %}
 
-        {% block javascripts %}
-            {{ encore_entry_script_tags('app') }}
-        {% endblock %}
-    </head>
-    <body>
-        {% block body %}{% endblock %}
-    </body>
+    {% block javascripts %}
+        {{ encore_entry_script_tags('app') }}
+    {% endblock %}
+</head>
+<body>
+<nav class="navbar navbar-expand-lg navbar-light bg-light">
+    <div class="container-fluid">
+        <a class="navbar-brand" href="#">CC34</a>
+        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+            <span class="navbar-toggler-icon"></span>
+        </button>
+        <div class="collapse navbar-collapse" id="navbarSupportedContent">
+            <ul class="navbar-nav me-auto mb-2 mb-lg-0">
+                <li class="nav-item">
+                    <a class="nav-link active" aria-current="page" href="{{ path('app_index') }}">Home</a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link" href="{{ path('app_atelier_index') }}">Atelier</a>
+                </li>
+
+            </ul>
+
+        </div>
+    </div>
+</nav>
+<div class="container">{% block body %}{% endblock %}</div>
+
+
+</body>
 </html>