diff --git a/.idea/HegreEtConfort.iml b/.idea/HegreEtConfort.iml
index af6cce8..f4221e4 100644
--- a/.idea/HegreEtConfort.iml
+++ b/.idea/HegreEtConfort.iml
@@ -3,7 +3,6 @@
   <component name="NewModuleRootManager">
     <content url="file://$MODULE_DIR$">
       <sourceFolder url="file://$MODULE_DIR$/src" isTestSource="false" packagePrefix="App\" />
-      <sourceFolder url="file://$MODULE_DIR$/tests" isTestSource="true" />
       <sourceFolder url="file://$MODULE_DIR$/tests" isTestSource="true" packagePrefix="App\Tests\" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/composer" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/doctrine/cache" />
diff --git a/.idea/inspectionProfiles/Project_Default.xml b/.idea/inspectionProfiles/Project_Default.xml
new file mode 100644
index 0000000..5584008
--- /dev/null
+++ b/.idea/inspectionProfiles/Project_Default.xml
@@ -0,0 +1,16 @@
+<component name="InspectionProjectProfileManager">
+  <profile version="1.0">
+    <option name="myName" value="Project Default" />
+    <inspection_tool class="HtmlUnknownAttribute" enabled="true" level="WARNING" enabled_by_default="true">
+      <option name="myValues">
+        <value>
+          <list size="2">
+            <item index="0" class="java.lang.String" itemvalue="placeholder" />
+            <item index="1" class="java.lang.String" itemvalue="type" />
+          </list>
+        </value>
+      </option>
+      <option name="myCustomValuesEnabled" value="true" />
+    </inspection_tool>
+  </profile>
+</component>
\ No newline at end of file
diff --git a/assets/styles/css/intervention.css b/assets/styles/css/intervention.css
index 07e7e76..100a4ac 100644
--- a/assets/styles/css/intervention.css
+++ b/assets/styles/css/intervention.css
@@ -2,83 +2,175 @@ body {
     background: #A6CD9E !important;
 }
 
+
 .background {
     background-color: #7D9599;
     position: absolute;
-    width: 100%;
-    height: 87%;
+    width: 23%;
+    height: 100%;
 }
 .background-intervention {
-    background-color: #A0C2C8;
+    background-color: #7D9599;
     position: absolute;
-    box-shadow: 0 0 15px 0 black;
-    border-radius: 5%;
+    box-shadow: 0 0 8px 0 black;
 
-    margin: 7% 0 0 15%;
+    margin: 7% 0 0 26.5%;
     width: 70%;
     height: 70%;
 }
 
+
 .logoCalendar {
     position: absolute;
-    margin: 1% 0 0 5%;
-    width: 5%;
+    margin: 5% 0 0 2%;
+    width: 4.5%;
 }
-.titre {
+.intervention {
     position: absolute;
-    margin: 2% 0 0 11%;
+    margin: 10.5% 0 0 2%;
+    font-size: 175%;
+    width: 50%;
     color: white;
 }
+.logoChauffagiste {
+    position: absolute;
+    margin: 15% 0 0 2%;
+    width: 4.5%;
+}
+.chauffagiste {
+    position: absolute;
+    margin: 20% 0 0 2%;
+    font-size: 175%;
+    width: 20%;
+    color: white;
+}
+.logoModifier {
+    position: absolute;
+    margin: 25% 0 0 2%;
+    width: 4.5%;
+}
+.modifier {
+    position: absolute;
+    margin: 30% 0 0 2%;
+    font-size: 175%;
+    width: 20%;
+    color: white;
+}
+.logoHegre {
+    position: absolute;
+    margin: 41% 0 0 0;
+    width: 10%;
+}
+
+
 
 #nom {
     position: absolute;
     margin: 2% 0 0 5%;
-    width: 45%;
+    font-size: 160%;
+    width: 90%;
+    height: 10%;
 }
-#echecs {
+
+
+#adresse {
     position: absolute;
-    margin: 6% 0 0 5%;
+    margin: 10% 0 0 3%;
+    width: 65%;
 }
+
+
+#pannes {
+    position: absolute;
+    margin: 15% 0 0 3%;
+    width: 65%;
+}
+
 #employesCompetences {
     position: absolute;
-    margin: 10% 0 0 5%;
+    margin: 20% 0 0 3%;
+    width: 65%;
 }
+
 #piece {
     position: absolute;
-    margin: 14% 0 0 5%;
+    margin: 25% 0 0 3%;
+    width: 65%;
 }
 
+
 #vehicule {
     position: absolute;
-    margin: 18.5% 0 0 5%;
+    margin: 30% 0 0 3%;
+    width: 20%;
+    height: 5%;
+
+    text-align: center;
+    background-color: white;
 }
 #vehicule1 {
     position: absolute;
-    margin: 19% 0 0 21.5%;
+    margin: 30.7% 0 0 25%;
 }
 #oui {
     position: absolute;
-    margin: 18.5% 0 0 24%;
+    margin: 30.3% 0 0 27%;
 }
 #vehicule2 {
     position: absolute;
-    margin: 19% 0 0 30%;
+    margin: 30.7% 0 0 32%;
 }
 #non {
     position: absolute;
-    margin: 18.5% 0 0 33%;
+    margin: 30.3% 0 0 34%;
+}
+
+
+#description {
+    position: absolute;
+    margin: 35% 0 0 3%;
+    width: 40%;
+    height: 25%;
+}
+#liste {
+    position: absolute;
+    margin: 45% 0 0 44%;
 }
 
 #date {
     position: absolute;
-    margin: 2% 0 0 70%;
+    margin: 10% 0 0 75%;
+    width: 20%;
+    height: 5%;
+
+    text-align: center;
+    border-radius: 3%;
+    background-color: white;
 }
 #calendar {
     position: absolute;
-    margin: 18.5% 0 0 33%;
+    margin: 15% 0 0 75%;
 }
 
-.from {
+
+
+
+
+.applique {
     position: absolute;
-    margin: 65% 15% 15% 15%;
+    margin: 40% 0 0 80%;
+    width: 15%;
+    height: 15%;
+
+    border-radius: 3%;
+    background-color: white;
+}
+.supprimer {
+    position: absolute;
+    margin: 40% 0 0 62%;
+    width: 15%;
+    height: 15%;
+
+    border-radius: 3%;
+    background-color: white;
 }
\ No newline at end of file
diff --git a/assets/styles/image/chauffagiste.png b/assets/styles/image/chauffagiste.png
new file mode 100644
index 0000000..d9e321c
Binary files /dev/null and b/assets/styles/image/chauffagiste.png differ
diff --git a/assets/styles/image/modifier.png b/assets/styles/image/modifier.png
new file mode 100644
index 0000000..afa3e78
Binary files /dev/null and b/assets/styles/image/modifier.png differ
diff --git a/templates/intervention/new.html.twig b/templates/intervention/new.html.twig
index f1ff396..bb564a5 100644
--- a/templates/intervention/new.html.twig
+++ b/templates/intervention/new.html.twig
@@ -1,11 +1,79 @@
-{% extends 'base.html.twig' %}
+<!DOCTYPE html>
+<html lang="fr, en">
+    <head>
+        <meta charset="UTF-8">
+        <title>Créer une intervention</title>
+        <link href="{{ asset('styles/css/intervention.css') }}" rel='stylesheet'>
+        <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><text y=%221.3em%22 x=%220.2em%22 font-size=%2276%22 fill=%22%23fff%22>sf</text></svg>">
+        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
+              integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
 
-{% block title %}New Intervention{% endblock %}
+        <meta name="viewport" content="width=device-width, initial-scale=1">
 
-{% block body %}
-    <h1>Create new Intervention</h1>
+    </head>
+    <body>
+        <div class="background"></div>
+        <img class="logoCalendar" src="{{ asset('styles/image/calendar.png') }}" alt="Logo Calendrier">
+        <a href="{{ path('app_intervention_index') }}" class="intervention">Créer une intervention</a>
+        <img class="logoChauffagiste" src="{{ asset('styles/image/chauffagiste.png') }}" alt="Logo Chauffagiste">
+        <h1 class="chauffagiste">Choisissez un chauffagiste</h1>
+        <img class="logoModifier" src="{{ asset('styles/image/modifier.png') }}">
+        <h1 class="modifier">Modifier l'intervention</h1>
+        <img class="logoHegre" src="{{ asset('styles/image/LogoHegreConfort_SansFond.png') }}">
 
-    {{ include('intervention/_form.html.twig') }}
 
-    <a href="{{ path('app_intervention_index') }}">back to list</a>
-{% endblock %}
+        <div class="background-intervention">
+            <input required id="nom" placeholder="Nom de l'intervention">
+
+            <select required type="select" name="pannes" id="pannes">
+                <option value="pan1">pan1</option>
+                <option value="pan2">pan2</option>
+                <option value="pan3">pan3</option>
+                <option value="pan4">pan4</option>
+                <option value="pan5">pan5</option>
+                <option value="pan6">pan6</option>
+            </select>
+
+            <select required type="select" name="pannes" id="employesCompetences">
+                <option value="emp1">employé1 - sa compétence</option>
+                <option value="emp2">employé2 - sa compétence</option>
+                <option value="emp3">employé3 - sa compétence</option>
+                <option value="emp4">employé4 - sa compétence</option>
+                <option value="emp5">employé5 - sa compétence</option>
+                <option value="emp6">employé6 - sa compétence</option>
+            </select>
+
+            <!--  <input required id="employesCompetences" placeholder="Liste des employés et de leurs compétences"> -->
+            <select required type="select" name="piece" id="piece">
+                <option value="pièce1">Pièce affecter 1</option>
+                <option value="pièce2">Pièce affecter 2</option>
+                <option value="pièce3">Pièce affecter 3</option>
+                <option value="pièce4">Pièce affecter 4</option>
+                <option value="pièce5">Pièce affecter 5</option>
+                <option value="pièce6">Pièce affecter 6</option>
+            </select>
+
+            <p id="vehicule">Véhicule nécessaire</p>
+            <input type="checkbox" name="vehicule1" id="vehicule1">
+            <label for=”vehicule1” id="oui"> Oui </label>
+            <input type="checkbox" name="vehicule2" id="vehicule2">
+            <label for=”vehicule2” id="non"> Non </label>
+
+            <p id="date">Jour de l'intervention</p>
+            <input type="date" id="calendar">
+
+            <input type="text" id="description" placeholder="Description">
+            <input type="text" id="adresse" placeholder="Adresse">
+
+            <button type="submit" class="applique"> Appliquée </button>
+            <button type="reset" class="supprimer"> Supprimer </button>
+
+
+
+            <!-- {{ include('intervention/_form.html.twig') }} -->
+
+            <a href="{{ path('app_intervention_index') }}" id="liste">Retour à la liste</a>
+        </div>
+    </body>
+</html>