diff --git a/Vue/Ajaxtbajouterintermediaires/index.php b/Vue/Ajaxtbajouterintermediaires/index.php
index 63f79eba..0f8bb5fa 100755
--- a/Vue/Ajaxtbajouterintermediaires/index.php
+++ b/Vue/Ajaxtbajouterintermediaires/index.php
@@ -1,51 +1,103 @@
-<form id="formData">
-<legend id="titre_formData"><?= _("Ajouter des données") ?></legend>
-<table class="table table-responsive table-condensed">
-	<tbody>	
-		<tr> 
-            <td width="5%" align="center" class="required">Type</td>
-            <td width="20%">
-                <select name="codeTypeApporteur" id="codeTypeApporteur" class="form-select" required>
-                    <?= liste_options($typeinter,'',false) ?>
-                </select>
-            </td>
-			<td width="5%" align="center" class="required"><?= _("Raison Sociale") ?></td>
-            <td width="30%" ><INPUT class="form-control majuscule" TYPE="text" id="libelle" NAME="libelle" required></td>
-            
-            <td width="5%" align="center"><?= _("Responsable") ?></td>
-            <td colspan="3" ><INPUT class="form-control majuscule" TYPE="text" id="nomResponsable" NAME="nomResponsable"></td>
-        </tr>
-        <tr>
-            <td width="5%" align="center"><?= _("Téléphone") ?></td>
-            <td width="20%" ><INPUT class="form-control" TYPE="tel" id="telephone" NAME="telephone"></td>
+<form id="formData" class="container-fluid p-0">
+    <div class="card border-0 shadow-sm border-start border-4 border-primary" style="border-radius: var(--radius-md);">
+        <div class="card-header bg-white py-3 border-bottom">
+            <h6 class="mb-0 fw-bold text-uppercase text-primary small">
+                <i class="fas fa-plus-circle me-2"></i><?= _("Ajouter un nouvel intermédiaire / courtier") ?>
+            </h6>
+        </div>
+        
+        <div class="card-body bg-light-50 p-4">
+            <div class="row g-3 mb-4">
+                <div class="col-md-3">
+                    <label class="form-label small fw-bold text-muted required"><?= _("Type Intermédiaire") ?></label>
+                    <div class="input-group shadow-xs">
+                        <span class="input-group-text bg-white border-2 border-end-0"><i class="fas fa-user-tie text-muted"></i></span>
+                        <select name="codeTypeApporteur" id="codeTypeApporteur" class="form-control selectpicker border-2 border-start-0" required>
+                            <?= liste_options($typeinter, '', true) ?>
+                        </select>
+                    </div>
+                </div>
 
-            <td width="5%" align="center">E-mail</td>
-            <td width="20%" ><INPUT class="form-control" TYPE="email" id="email" NAME="email"></td>
-            
-            <td width="5%" align="center"><?= _("Bureau") ?></td>
-            <td width="20%">
-                <select name="codeBureau" id="codeBureau" class="form-select">
-                    <?= liste_options($bureau,'',false) ?>
-                </select>
-            </td>
-            <td width="5%" align="center"><?= _("Déduire Com") ?></td>
-			<td >			
-					<select name="deduireComm" id="deduireComm" class="form-select">
-                    <?= liste_options($ouinonoptionnelle,'1',true) ?>
-                </select>
-            </td>
-        </tr>
-        <tr>
-			<td width="5%" align="center"><?= _("Mobile Payer") ?></td>
-            <td ><INPUT class="form-control" TYPE="number" id="mobilePaiement" NAME="mobilePaiement" value="0" title="<?= _("L'indicatif est obligatoire")?>"></td>
-            
-			<td width="5%" align="center"><?= _("Adresse Géo.") ?></td>
-            <td ><INPUT class="form-control majuscule" TYPE="text" id="adresseGeo" NAME="adresseGeo" value=""></td>
-            
-			
-            <td width="5%" align="center"><?= _("Adresse Post.") ?></td>
-            <td colspan="3" ><INPUT class="form-control majuscule" TYPE="text" id="adressePost" NAME="adressePost" value=""></td>
-        </tr>
-	</tbody>
-</table>	
+                <div class="col-md-5">
+                    <label class="form-label small fw-bold text-muted required"><?= _("Raison Sociale") ?></label>
+                    <div class="input-group shadow-xs">
+                        <span class="input-group-text bg-white border-2 border-end-0"><i class="fas fa-building text-muted"></i></span>
+                        <input type="text" class="form-control border-2 border-start-0 majuscule" id="libelle" name="libelle" required autocomplete="off">
+                    </div>
+                </div>
+
+                <div class="col-md-4">
+                    <label class="form-label small fw-bold text-muted"><?= _("Responsable") ?></label>
+                    <div class="input-group shadow-xs">
+                        <span class="input-group-text bg-white border-2 border-end-0"><i class="fas fa-user text-muted"></i></span>
+                        <input type="text" class="form-control border-2 border-start-0 majuscule" id="nomResponsable" name="nomResponsable" autocomplete="off">
+                    </div>
+                </div>
+            </div>
+
+            <div class="row g-3 mb-4">
+                <div class="col-md-3">
+                    <label class="form-label small fw-bold text-muted"><?= _("Téléphone") ?></label>
+                    <div class="input-group shadow-xs">
+                        <span class="input-group-text bg-white border-2 border-end-0"><i class="fas fa-phone text-muted"></i></span>
+                        <input type="tel" class="form-control border-2 border-start-0" id="telephone" name="telephone">
+                    </div>
+                </div>
+
+                <div class="col-md-3">
+                    <label class="form-label small fw-bold text-muted"><?= _("E-mail") ?></label>
+                    <div class="input-group shadow-xs">
+                        <span class="input-group-text bg-white border-2 border-end-0"><i class="fas fa-envelope text-muted"></i></span>
+                        <input type="email" class="form-control border-2 border-start-0" id="email" name="email">
+                    </div>
+                </div>
+
+                <div class="col-md-3">
+                    <label class="form-label small fw-bold text-muted"><?= _("Bureau") ?></label>
+                    <div class="input-group shadow-xs">
+                        <span class="input-group-text bg-white border-2 border-end-0"><i class="fas fa-map-marked-alt text-muted"></i></span>
+                        <select name="codeBureau" id="codeBureau" class="form-control selectpicker border-2 border-start-0">
+                            <?= liste_options($bureau, '', true) ?>
+                        </select>
+                    </div>
+                </div>
+
+                <div class="col-md-3">
+                    <label class="form-label small fw-bold text-muted"><?= _("Déduire Com.") ?></label>
+                    <div class="input-group shadow-xs">
+                        <span class="input-group-text bg-white border-2 border-end-0"><i class="fas fa-percent text-muted"></i></span>
+                        <select name="deduireComm" id="deduireComm" class="form-control selectpicker border-2 border-start-0">
+                            <?= liste_options($ouinonoptionnelle, '1', true) ?>
+                        </select>
+                    </div>
+                </div>
+            </div>
+
+            <div class="row g-3">
+                <div class="col-md-3">
+                    <label class="form-label small fw-bold text-muted"><?= _("Mobile Payer") ?></label>
+                    <div class="input-group shadow-xs">
+                        <span class="input-group-text bg-white border-2 border-end-0"><i class="fas fa-mobile-alt text-muted"></i></span>
+                        <input type="number" class="form-control border-2 border-start-0" id="mobilePaiement" name="mobilePaiement" value="0" title="<?= _("L'indicatif est obligatoire")?>">
+                    </div>
+                </div>
+
+                <div class="col-md-4">
+                    <label class="form-label small fw-bold text-muted"><?= _("Adresse Géo.") ?></label>
+                    <div class="input-group shadow-xs">
+                        <span class="input-group-text bg-white border-2 border-end-0"><i class="fas fa-map-marker-alt text-muted"></i></span>
+                        <input type="text" class="form-control border-2 border-start-0 majuscule" id="adresseGeo" name="adresseGeo">
+                    </div>
+                </div>
+
+                <div class="col-md-5">
+                    <label class="form-label small fw-bold text-muted"><?= _("Adresse Postale") ?></label>
+                    <div class="input-group shadow-xs">
+                        <span class="input-group-text bg-white border-2 border-end-0"><i class="fas fa-mailbox text-muted"></i></span>
+                        <input type="text" class="form-control border-2 border-start-0 majuscule" id="adressePost" name="adressePost">
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
 </form>
\ No newline at end of file