/* MODIFIE LE 16.03.2024 */
/* MODIFIE LE 09.11.2024 */
/* MODIFIE LE 11.11.2024 */

/* module_gestionnaire_archivages.php */
/* ════════════════════════════════════════════════════════════════════════════
   LeTrocRoyal — Archives Propositions — Pagination Variante C
   À intégrer dans : CSS/trocannonce_save.css
   Préfixe        : Arch_prp_
   Thème          : light (défaut) / dark ([data-theme="dark"])
   Palette        : or #c8a96e · accent #e8930a · bleu nuit (dark mode)
   ════════════════════════════════════════════════════════════════════════════ */
 
 
/* ── Conteneur principal ─────────────────────────────────────────────────── */
 
.Arch_prp_pagination {
  display:        flex;
  flex-direction: column;
  align-items:    flex-start;
  gap:            10px;
  margin-top:     0.8rem;
  padding:        0 2px;
}
 
 
/* ── Ligne 1 : flèches + compteur Page X/N + numéros ────────────────────── */
 
.Arch_prp_pag-row {
  display:     flex;
  align-items: center;
  gap:         6px;
  flex-wrap:   wrap;
}
 
 
/* ── Boutons flèches ← → ─────────────────────────────────────────────────── */
 
.Arch_prp_pag-btn {
  width:           34px;
  height:          34px;
  border-radius:   8px;
  border:          0.5px solid #253452;
  background:      #162035;
  color:           #c8a96e;
  display:         flex;
  align-items:     center;
  justify-content: center;
  cursor:          pointer;
  flex-shrink:     0;
  transition:      border-color .15s, background .15s, color .15s;
}
 
.Arch_prp_pag-btn:hover {
  border-color: #c8a96e;
  background:   #1d2d45;
}
 
/* Mode clair */
:root .Arch_prp_pag-btn {
  background: #e8edf8;
  border-color: #dde3ef;
  color: #c8a96e;
}
:root .Arch_prp_pag-btn:hover {
  background: #dde3ef;
  border-color: #c8a96e;
}
 
/* État inactif (sans disabled — géré par classe CSS uniquement) */
.Arch_prp_pag-btn--disabled {
  color:        #3a4a6a;
  border-color: #1e2d42;
  cursor:       default;
  pointer-events: none;
}
 
:root .Arch_prp_pag-btn--disabled {
  color:        #aab8d0;
  border-color: #dde3ef;
  pointer-events: none;
}
 
 
/* ── Compteur "Page X / N" ───────────────────────────────────────────────── */
 
.Arch_prp_pag-counter {
  height:          34px;
  display:         flex;
  align-items:     center;
  gap:             5px;
  padding:         0 14px;
  background:      #162035;
  border:          0.5px solid #253452;
  border-radius:   8px;
  font-size:       13px;
  font-weight:     400;
  color:           #7a90b8;
  white-space:     nowrap;
  flex-shrink:     0;
}
 
:root .Arch_prp_pag-counter {
  background:  #e8edf8;
  border-color: #dde3ef;
  color:       #6b7a99;
}
 
/* Numéro de page courante — mis en valeur en or */
.Arch_prp_pag-cur {
  color:       #c8a96e;
  font-weight: 500;
}
 
/* Séparateur "/" */
.Arch_prp_pag-sep {
  color:     #3a4a6a;
  font-size: 12px;
}
 
:root .Arch_prp_pag-sep {
  color: #aab8d0;
}
 
 
/* ── Chips de numéros de page ────────────────────────────────────────────── */
 
.Arch_prp_pag-pages {
  display:     flex;
  align-items: center;
  gap:         4px;
  flex-wrap:   wrap;
}
 
.Arch_prp_pag-num {
  width:           34px;
  height:          34px;
  border-radius:   8px;
  border:          0.5px solid #253452;
  background:      #162035;
  color:           #7a90b8;
  font-size:       13px;
  font-weight:     400;
  display:         flex;
  align-items:     center;
  justify-content: center;
  cursor:          pointer;
  flex-shrink:     0;
  transition:      border-color .12s, color .12s, background .12s;
}
 
.Arch_prp_pag-num:hover {
  border-color: #c8a96e;
  color:        #c8a96e;
  background:   #1d2d45;
}
 
:root .Arch_prp_pag-num {
  background:  #e8edf8;
  border-color: #dde3ef;
  color:       #6b7a99;
}
 
:root .Arch_prp_pag-num:hover {
  border-color: #c8a96e;
  color:        #c8a96e;
  background:   #dde3ef;
}
 
/* Page active */
.Arch_prp_pag-num--active {
  background:   #c8a96e !important;
  border-color: #c8a96e !important;
  color:        #0d1524 !important;
  font-weight:  500 !important;
  cursor:       default;
}
 
/* Ellipse … */
.Arch_prp_pag-ellipsis {
  color:     #3a4a6a;
  font-size: 13px;
  padding:   0 3px;
  user-select: none;
}
 
:root .Arch_prp_pag-ellipsis {
  color: #aab8d0;
}
 
 
/* ── Ligne 2 : barre de progression + compteur X–Y sur N ────────────────── */
 
.Arch_prp_pag-progress-row {
  display:     flex;
  align-items: center;
  gap:         12px;
  width:       100%;
  max-width:   360px;
}
 
/* Piste de la barre */
.Arch_prp_pag-track {
  flex:          1;
  height:        4px;
  background:    #253452;
  border-radius: 2px;
  overflow:      hidden;
}
 
:root .Arch_prp_pag-track {
  background: #dde3ef;
}
 
/* Remplissage doré */
.Arch_prp_pag-fill {
  height:        4px;
  background:    #c8a96e;
  border-radius: 2px;
  transition:    width .3s ease;
  min-width:     6px;
}
 
/* Compteur "X–Y sur N" */
.Arch_prp_pag-info {
  font-size:   12px;
  color:       #7a90b8;
  white-space: nowrap;
  flex-shrink: 0;
}
 
:root .Arch_prp_pag-info {
  color: #6b7a99;
}
 
 
/* ── Responsive ──────────────────────────────────────────────────────────── */
 
@media (max-width: 480px) {
  .Arch_prp_pag-counter { padding: 0 10px; font-size: 12px; }
  .Arch_prp_pag-num,
  .Arch_prp_pag-btn     { width: 30px; height: 30px; font-size: 12px; }
  .Arch_prp_pag-progress-row { max-width: 100%; }
}

/* ═══════════════════════════════════════════════════════════
    LeTrocRoyal — Archives Propositions — v1.0
    Thème  : light (défaut) / dark (toggle utilisateur)
    Palette: or #c8a96e · accent #e8930a · fond bleu nuit (dark)
═══════════════════════════════════════════════════════════ */
/* ── Variables — mode clair ── */
    :root {
      --Arch_prp_bg:       #f2f5fb;
      --Arch_prp_card:     #ffffff;
      --Arch_prp_border:   #dde3ef;
      --Arch_prp_text:     #1a2035;
      --Arch_prp_muted:    #6b7a99;
      --Arch_prp_chip-bg:  #e8edf8;
      --Arch_prp_gold:     #c8a96e;
      --Arch_prp_accent:   #e8930a;
      --Arch_prp_radius:   12px;
      --Arch_prp_font:     'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
      /* Statuts */
      --Arch_prp_expiree-bg:   #f1f5f9; --Arch_prp_expiree-color:   #475569; --Arch_prp_expiree-border:   #94a3b8;
      --Arch_prp_refusee-bg:   #fee2e2; --Arch_prp_refusee-color:   #991b1b; --Arch_prp_refusee-border:   #ef4444;
      --Arch_prp_acceptee-bg:  #dcfce7; --Arch_prp_acceptee-color:  #166534; --Arch_prp_acceptee-border:  #22c55e;
      --Arch_prp_annulee-bg:   #fef3c7; --Arch_prp_annulee-color:   #92400e; --Arch_prp_annulee-border:   #f59e0b;

      /* Priorités */
      --Arch_prp_haute-bg:    #fee2e2; --Arch_prp_haute-color:    #991b1b; --Arch_prp_haute-border:    #ef4444;
      --Arch_prp_moyenne-bg:  #fef3c7; --Arch_prp_moyenne-color:  #92400e; --Arch_prp_moyenne-border:  #f59e0b;
      --Arch_prp_basse-bg:    #dbeafe; --Arch_prp_basse-color:    #1e40af; --Arch_prp_basse-border:    #3b82f6;
      --Arch_prp_aucune-bg:   #f1f5f9; --Arch_prp_aucune-color:   #475569; --Arch_prp_aucune-border:   #94a3b8;
    }

    /* ── Variables — mode sombre ── */
	
    [data-theme="dark"] {
      --Arch_prp_bg:      #0d1524;
      --Arch_prp_card:    #162035;
      --Arch_prp_border:  #253452;
      --Arch_prp_text:    #dde4f0;
      --Arch_prp_muted:   #7a90b8;
      --Arch_prp_chip-bg: #1a2d4a;

      --Arch_prp_expiree-bg:   #1e2d4a; --Arch_prp_expiree-color:   #8896b0; --Arch_prp_expiree-border:   #4a5a72;
      --Arch_prp_refusee-bg:   #3f1515; --Arch_prp_refusee-color:   #fca5a5; --Arch_prp_refusee-border:   #ef4444;
      --Arch_prp_acceptee-bg:  #14391f; --Arch_prp_acceptee-color:  #86efac; --Arch_prp_acceptee-border:  #22c55e;
      --Arch_prp_annulee-bg:   #3f2a00; --Arch_prp_annulee-color:   #fcd34d; --Arch_prp_annulee-border:   #f59e0b;

      --Arch_prp_haute-bg:    #3f1515; --Arch_prp_haute-color:    #fca5a5; --Arch_prp_haute-border:    #ef4444;
      --Arch_prp_moyenne-bg:  #3f2a00; --Arch_prp_moyenne-color:  #fcd34d; --Arch_prp_moyenne-border:  #f59e0b;
      --Arch_prp_basse-bg:    #1a2d4a; --Arch_prp_basse-color:    #93c5fd; --Arch_prp_basse-border:    #3b82f6;
      --Arch_prp_aucune-bg:   #1e2d4a; --Arch_prp_aucune-color:   #8896b0; --Arch_prp_aucune-border:   #4a5a72;
    }

    /* ── Reset minimal ── */
	/*
    *, *::before, *::after {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }
	*/
	/*
    body {
      font-family:      var(--Arch_prp_font);
      background-color: var(--Arch_prp_bg);
      color:            var(--Arch_prp_text);
      min-height:       100vh;
      transition:       background-color .2s ease, color .2s ease;
      -webkit-font-smoothing: antialiased;
    }
	*/
    /* ── Conteneur de page ── */
    .Arch_prp_page {
      /*max-width: 920px;*/
	  max-width: 790px;
      margin:    0 auto;
      /*padding:   2rem 1.25rem 4rem;*/
	  max-height: 762px;
	  box-shadow: -6px 7px 4px rgba(0, 0, 0, 0.25), inset 4px -1px 6px rgba(215, 210, 210, 0.5);
	  border-bottom-right-radius: 10px;
      border-bottom-left-radius: 10px;
      border: 0px solid gray;
    }
	#soulteIdTerme{
		width:272px;
	}
	#soulteminprix, #soultemaxprix{
		width:150px;
	}

	#formcolumn {
		min-width: 0;
    	max-width: 790px;
    	width: 780px;
	}
    /* ════════════════════════════════════════
       EN-TÊTE
       ════════════════════════════════════════ */

    .Arch_prp_header {
      display:     flex;
      align-items: center;
      gap:         12px;
      flex-wrap:   wrap;
      margin-bottom: 1.75rem;
    }

    .Arch_prp_back-btn {
      display:        inline-flex;
      align-items:    center;
      gap:            6px;
      font-size:      12px;
      color:          var(--Arch_prp_muted);
      text-decoration: none;
      padding:        5px 12px;
      border:         0.5px solid var(--Arch_prp_border);
      border-radius:  8px;
      background:     var(--Arch_prp_chip-bg);
      transition:     color .15s, border-color .15s;
      white-space:    nowrap;
    }
    .Arch_prp_back-btn:hover {
      color:        var(--Arch_prp_gold);
      border-color: var(--Arch_prp_gold);
    }

    .Arch_prp_title {
      font-size:      20px;
      font-weight:    500;
      color:          var(--Arch_prp_gold);
      flex:           1;
      letter-spacing: .02em;
      min-width:      160px;
    }

    .Arch_prp_annonce-meta {
      font-size: 12px;
      color:     var(--Arch_prp_muted);
    }

    .Arch_prp_count-badge {
      background:    var(--Arch_prp_accent);
      color:         #fff;
      font-size:     11px;
      font-weight:   500;
      padding:       3px 11px;
      border-radius: 20px;
    }

    .Arch_prp_theme-toggle {
      background:   var(--Arch_prp_chip-bg);
      border:       0.5px solid var(--Arch_prp_border);
      color:        var(--Arch_prp_text);
      font-family:  var(--Arch_prp_font);
      font-size:    12px;
      padding:      6px 14px;
      border-radius: 8px;
      cursor:       pointer;
      transition:   border-color .15s, color .15s;
    }
    .Arch_prp_theme-toggle:hover {
      border-color: var(--Arch_prp_gold);
      color:        var(--Arch_prp_gold);
    }

	/* PAGINATION 
	.Arch_prp_pagination{
		margin-top: 10px;
		color:#9f8006c2;
		font-weight: 500;
		font-size: 14px;
		background-color: #ffffff;
		text-align: center;
	}*/
    /* ════════════════════════════════════════
       STATISTIQUES
       ════════════════════════════════════════ */

    .Arch_prp_stats {
      display:               grid;
      grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
      gap:                   8px;
      margin-bottom:         1.75rem;
	  margin-left: 			 30px;
    }

    .Arch_prp_stat-card {
      background:    var(--Arch_prp_card);
      border:        0.5px solid var(--Arch_prp_border);
      border-radius: 8px;
      padding:       12px 8px;
      text-align:    center;
      transition:    background-color .2s;
	  width: 		 100px;
	  box-shadow: rgba(0, 0, 0, 0.25) -5px 7px 3px, rgba(215, 210, 210, 0.5) 4px -1px 6px inset;
	  margin-top: 10px;
	  height:34px;
    }

    .Arch_prp_stat-num {
      font-size:   22px;
      font-weight: 500;
      line-height: 1;
    }

    .Arch_prp_stat-label {
      font-size:      10px;
      color:          var(--Arch_prp_muted);
      margin-top:     5px;
      text-transform: uppercase;
      letter-spacing: .07em;
    }

    /* ════════════════════════════════════════
       FILTRES
       ════════════════════════════════════════ */

    .Arch_prp_filters {
      background:    var(--Arch_prp_card);
      border:        0.5px solid var(--Arch_prp_border);
      border-radius: var(--Arch_prp_radius);
      padding:       16px 18px;
      margin-bottom: 1.25rem;
      transition:    background-color .2s;
	  margin: 		 30px;
	  box-shadow: rgba(0, 0, 0, 0.25) -5px 7px 3px, rgba(215, 210, 210, 0.5) 4px -1px 6px inset;
    }

    .Arch_prp_filter-row {
      display:       flex;
      align-items:   center;
      gap:           8px;
      flex-wrap:     wrap;
      margin-bottom: 10px;
    }
    .Arch_prp_filter-row:last-child { margin-bottom: 0; }

    .Arch_prp_filter-label {
      font-size:      11px;
      font-weight:    500;
      color:          var(--Arch_prp_muted);
      min-width:      58px;
      flex-shrink:    0;
      text-transform: uppercase;
      letter-spacing: .07em;
    }

    /* Chips génériques */
    .Arch_prp_chip {
      background:    var(--Arch_prp_chip-bg);
      border:        0.5px solid var(--Arch_prp_border);
      color:         var(--Arch_prp_muted);
      font-family:   var(--Arch_prp_font);
      font-size:     12px;
      padding:       5px 12px;
      border-radius: 20px;
      cursor:        pointer;
      transition:    border-color .12s, color .12s, background .12s;
    }

    /* Chip actif — variante or (Toutes, Aucune, Période) */
    .Arch_prp_chip.active {
      font-weight:  500;
      border-width: 1.5px;
	  font-weight: 500;
    border-width: 1.5px;
    font-size: 16px;
    left: 0px;
    line-height: 22px;

    }
    .Arch_prp_chip.active.gold {
      border-color: var(--Arch_prp_gold);
      color:        var(--Arch_prp_gold);
    }

    /* Chips priorité actifs */
    .Arch_prp_chip.active.prio-haute {
      background:   var(--Arch_prp_haute-bg);
      border-color: var(--Arch_prp_haute-border);
      color:        var(--Arch_prp_haute-color);
    }
    .Arch_prp_chip.active.prio-moyenne {
      background:   var(--Arch_prp_moyenne-bg);
      border-color: var(--Arch_prp_moyenne-border);
      color:        var(--Arch_prp_moyenne-color);
    }
    .Arch_prp_chip.active.prio-basse {
      background:   var(--Arch_prp_basse-bg);
      border-color: var(--Arch_prp_basse-border);
      color:        var(--Arch_prp_basse-color);
    }

    /* Barre de recherche */
    .Arch_prp_search {
      background:    var(--Arch_prp_chip-bg);
      border:        0.5px solid var(--Arch_prp_border);
      color:         var(--Arch_prp_text);
      font-family:   var(--Arch_prp_font);
      font-size:     13px;
      padding:       7px 12px;
      border-radius: 8px;
      flex:          1;
      min-width:     160px;
      outline:       none;
      transition:    border-color .15s;
      appearance:    none;
    }
    .Arch_prp_search::placeholder { color: var(--Arch_prp_muted); }
    .Arch_prp_search:focus        { border-color: var(--Arch_prp_gold); }

    /* Sélecteur de tri */
    .Arch_prp_sort-select {
      background:    var(--Arch_prp_chip-bg);
      border:        0.5px solid var(--Arch_prp_border);
      color:         var(--Arch_prp_text);
      font-family:   var(--Arch_prp_font);
      font-size:     12px;
      padding:       7px 10px;
      border-radius: 8px;
      cursor:        pointer;
      outline:       none;
    }

    /* ════════════════════════════════════════
       RÉSULTAT & GRILLE
       ════════════════════════════════════════ */

    .Arch_prp_result-info {
      font-size:     12px;
      color:         var(--Arch_prp_muted);
      margin-bottom: 10px;
      padding-left:  20px;
	  font-size: 	 18px;
	  font-weight:   900;
    }

    .Arch_prp_cards-grid {
      display:        flex;
      flex-direction: column;
      gap:            10px;
    }

    /* ════════════════════════════════════════
       CARTE ARCHIVE
       ════════════════════════════════════════ */

    .Arch_prp_archive-card {
      /*background:    var(--Arch_prp_card);*/
	  background-color: #b6b9c770;
      border:        0.5px solid var(--Arch_prp_border);
      border-radius: var(--Arch_prp_radius);
      padding:       16px;
      transition:    border-color .15s, background-color .2s;
	  margin-left: 	 20px;
      margin-right:  20px;
    }
    .Arch_prp_archive-card:hover { border-color: var(--Arch_prp_gold); }

    /* Ligne supérieure : avatar + infos + badges */
    .Arch_prp_card-top {
      display:     flex;
      align-items: flex-start;
      gap:         12px;
      flex-wrap:   wrap;
      margin-bottom: 12px;
    }

    .Arch_prp_avatar {
      width:           40px;
      height:          40px;
      border-radius:   50%;
      display:         flex;
      align-items:     center;
      justify-content: center;
      font-size:       15px;
      font-weight:     500;
      flex-shrink:     0;
      color:           #fff;
    }

    .Arch_prp_card-info { flex: 1; min-width: 140px; }

    .Arch_prp_card-name {
      font-size:   14px;
      font-weight: 500;
      line-height: 1.3;
	  color:#aea06c;
	  font-weight: 800;
    }
    .Arch_prp_card-name .Arch_prp_ville {
      font-size:   11px;
      font-weight: 400;
      color:       var(--Arch_prp_muted);
    }

    .Arch_prp_card-meta {
      font-size:   11px;
      color:       var(--Arch_prp_muted);
      margin-top:  4px;
      line-height: 1.5;
    }

    .Arch_prp_card-badges {
      display:     flex;
      gap:         6px;
      flex-wrap:   wrap;
      flex-shrink: 0;
      align-items: flex-start;
      margin-top:  2px;
    }

    /* ── Badges statut & priorité ── */
    .Arch_prp_badge {
      font-size:     10px;
      font-weight:   500;
      padding:       3px 10px;
      border-radius: 20px;
      border:        0.5px solid;
      white-space:   nowrap;
    }

    .Arch_prp_badge-expiree  { background: var(--Arch_prp_expiree-bg);  color: var(--Arch_prp_expiree-color);  border-color: var(--Arch_prp_expiree-border); }
    .Arch_prp_badge-refusee  { background: var(--Arch_prp_refusee-bg);  color: var(--Arch_prp_refusee-color);  border-color: var(--Arch_prp_refusee-border); }
    .Arch_prp_badge-acceptee { background: var(--Arch_prp_acceptee-bg); color: var(--Arch_prp_acceptee-color); border-color: var(--Arch_prp_acceptee-border); }
    .Arch_prp_badge-annulee  { background: var(--Arch_prp_annulee-bg);  color: var(--Arch_prp_annulee-color);  border-color: var(--Arch_prp_annulee-border); }

    .Arch_prp_badge-prio-haute   { background: var(--Arch_prp_haute-bg);   color: var(--Arch_prp_haute-color);   border-color: var(--Arch_prp_haute-border); }
    .Arch_prp_badge-prio-moyenne { background: var(--Arch_prp_moyenne-bg); color: var(--Arch_prp_moyenne-color); border-color: var(--Arch_prp_moyenne-border); }
    .Arch_prp_badge-prio-basse   { background: var(--Arch_prp_basse-bg);   color: var(--Arch_prp_basse-color);   border-color: var(--Arch_prp_basse-border); }
    .Arch_prp_badge-prio-aucune  { background: var(--Arch_prp_aucune-bg);  color: var(--Arch_prp_aucune-color);  border-color: var(--Arch_prp_aucune-border); }

    /* ── Échange & description ── */
    .Arch_prp_exchange-type {
      display:     flex;
      align-items: center;
      gap:         7px;
      font-size:   13px;
      font-weight: 500;
      color:       var(--Arch_prp_accent);
      margin-bottom: 6px;
    }

    .Arch_prp_description {
      font-size:     12px;
      color:         var(--Arch_prp_muted);
      font-style:    italic;
      line-height:   1.65;
      margin-bottom: 10px;
    }

    /* ── Séparateur ── */
    .Arch_prp_divider {
      border:     none;
      border-top: 0.5px solid var(--Arch_prp_border);
      margin:     10px 0;
    }

    /* ── Photos ── */
    .Arch_prp_photos {
      display:  flex;
      gap:      6px;
      flex-wrap: wrap;
    }

    .Arch_prp_photo-thumb {
      width:         54px;
      height:        54px;
      border-radius: 6px;
      border:        0.5px solid var(--Arch_prp_border);
      object-fit:    cover;
      flex-shrink:   0;
      background:    var(--Arch_prp_chip-bg);
      display:       block;
    }

    .Arch_prp_photo-more {
      width:           54px;
      height:          54px;
      border-radius:   6px;
      border:          0.5px solid var(--Arch_prp_border);
      background:      var(--Arch_prp_chip-bg);
      display:         flex;
      align-items:     center;
      justify-content: center;
      font-size:       12px;
      font-weight:     500;
      color:           var(--Arch_prp_muted);
      flex-shrink:     0;
    }

    /* ════════════════════════════════════════
       ÉTAT VIDE
       ════════════════════════════════════════ */

    .Arch_prp_empty-state {
      text-align: center;
      padding:    3.5rem 1rem;
      color:      var(--Arch_prp_muted);
    }
    .Arch_prp_empty-state svg { margin: 0 auto 14px; display: block; }
    .Arch_prp_empty-state p   { font-size: 14px; }

    /* ════════════════════════════════════════
       RESPONSIVE
       ════════════════════════════════════════ */

    @media (max-width: 560px) {
      .Arch_prp_header { gap: 8px; }
      .Arch_prp_title  { font-size: 17px; }

      .Arch_prp_card-top {
        flex-direction: column;
        gap:            8px;
      }

      .Arch_prp_card-badges {
        flex-direction: row;
        margin-top:     0;
      }

      .Arch_prp_stats { grid-template-columns: repeat(3, 1fr); }
    }

    @media (max-width: 380px) {
      .Arch_prp_page   { padding: 1.25rem .75rem 3rem; }
      .Arch_prp_stats  { grid-template-columns: repeat(2, 1fr); }
      .Arch_prp_filter-label { display: none; }
    }

/* fin module_gestionnaire_archivages.php */	

/*
.Reponsetroc-msg{
	overflow-y: auto;
    overflow-x: hidden;
    flex-direction: column;
	height:70px;
	padding:10px;
	width:490px;
}*/

.galerie-main {

	flex-shrink: 0;
	border-radius: 10px;
	overflow: hidden;
	border: 1.5px solid rgba(201, 168, 76, 0.4);
	background: #0d1b2e;
	cursor: pointer;
	position: relative;
	/* ← clé pour l'icône ⛶ */
}

/* ⛶ visible grâce à position:relative sur le parent + z-index */
.galerie-zoom-icon {
	position: absolute;
	bottom: 6px;
	right: 6px;
	z-index: 10;
	background: rgba(0, 0, 0, 0.62);
	border: 1px solid rgba(201, 168, 76, 0.5);
	border-radius: 5px;
	padding: 3px 6px;
	font-size: 13px;
	color: #e8c96a;
	pointer-events: none;
	line-height: 1.4;
	backdrop-filter: blur(2px);
}

:root {
	--gold: #c9a84c;
	--gold-light: #e8c96a;
	--gold-dark: #9a7a2e;
	--navy: #0d1b2e;
	--navy-mid: #162437;
	--navy-soft: #1e3450;
	--cream: #fdf6e3;
	--text: #e8dfc8;
	--text-muted: #8fa3b8;
	--glass: rgba(255, 255, 255, 0.05);
	--glass-border: rgba(201, 168, 76, 0.25);
}

/* === CARD DE PROPOSITION === */
.proposition-cardFiche {
	background: var(--navy-mid);
	border: 1px solid var(--glass-border);
	border-radius: 16px;
	padding: 24px;

	width: 100%;
	position: relative;
	/*
	padding-top:10px; 
	padding-bottom:10px;
	*/
	/*
	box-shadow: 0 24px 60px rgba(0,0,0,0.5);
	*/
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 15px;
	max-width: 756px;
}

.prop-header {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 18px;
	padding-left: 15px;
}

.prop-avatar {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--gold-dark), var(--gold));
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: 'Playfair Display', serif;
	font-size: 24px;
	color: var(--navy);
	font-weight: 700;
	flex-shrink: 0;
}

.prop-meta {
	flex: 1;
}

.prop-name {
	font-family: 'Playfair Display', serif;
	color: var(--gold);
	font-size: 20px;
	display: flex;
	align-items: center;
	gap: 8px;
}

.prop-location {
	font-size: 11px;
	color: var(--text-muted);
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.prop-badge {
	background: rgba(201, 168, 76, 0.15);
	border: 1px solid var(--glass-border);
	border-radius: 20px;
	padding: 4px 12px;
	font-size: 11px;
	color: var(--gold);
	letter-spacing: 0.05em;
}

.prop-offer-title {
	background: rgba(255, 255, 255, 0.03);
	border-left: 3px solid var(--gold);
	border-radius: 0 8px 8px 0;
	margin-bottom: 18px;
}


.prop-offer-picture {
	background: rgba(255, 255, 255, 0.03);
	border-left: 3px solid var(--gold);
	border-radius: 0 8px 8px 0;

}

.prop-offer-message {
	background: rgba(255, 255, 255, 0.03);
	border-radius: 0 8px 8px 0;

}


/* ----------------DEBUT ----------------*/

.rep-modal-overlay {
	display: none;
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	width: 100vw !important;
	height: 100vh !important;
	background: rgba(0, 0, 0, 0.6);
	backdrop-filter: blur(4px);
	z-index: 999999;
	animation: rep-fadeIn 0.3s ease;
	overflow-y: auto;
	padding: 40px 20px;
}

.rep-modal-overlay.rep-active {
	display: block;
}

.rep-modal {
	background: white;
	border-radius: 12px;
	width: 90%;
	max-width: 550px;
	max-height: calc(100vh - 80px);
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
	animation: rep-slideUp 0.4s ease;
	overflow-y: auto;
	margin: 0 auto;
	position: relative;
}

.rep-modal-header {
	/*background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
	background: linear-gradient(135deg, rgb(214, 192, 124) 0%, rgb(175, 136, 18) 100%);
	color: white;
	padding: 24px 28px;
	position: relative;
	border-bottom: 4px solid #f6d980b8;
}

.rep-modal-header h2 {
	font-size: 20px;
	font-weight: 600;
	margin: 0;
}

.rep-close-button {
	position: absolute;
	top: 20px;
	right: 20px;
	background: rgba(255, 255, 255, 0.2);
	border: none;
	color: white;
	font-size: 24px;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.2s ease;
	line-height: 1;
}

.rep-close-button:hover {
	background: rgba(255, 255, 255, 0.3);
	transform: rotate(90deg);
}

.rep-modal-body {
	padding: 28px;
}

.rep-form-group {
	margin-bottom: 24px;
}

.rep-form-group label {
	display: block;
	color: #2d3748;
	font-weight: 600;
	margin-bottom: 10px;
	font-size: 14px;
}

.rep-form-group select {
	width: 100%;
	padding: 12px 14px;
	border: 2px solid #e2e8f0;
	border-radius: 8px;
	font-family: inherit;
	font-size: 14px;
	background: white;
	cursor: pointer;
	transition: all 0.3s ease;
	appearance: none;
	background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23667eea' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
	background-repeat: no-repeat;
	background-position: right 12px center;
	background-size: 18px;
	padding-right: 40px;
	color: #2d3748;
	box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.25), inset 2px -1px 8px rgba(255, 255, 255, 0.5);
}

.rep-form-group select:focus {
	outline: none;
	border-color: #667eea;
	box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}

.StatusReponse {
	margin-bottom: 24px;
}

.MessageReponse {
	width: 100%;
	min-height: 140px;
	padding: 12px 14px;
	border: 2px solid #e2e8f0;
	border-radius: 8px;
	font-family: inherit;
	font-size: 14px;
	resize: vertical;
	transition: all 0.3s ease;
	color: #2d3748;
	line-height: 1.6;
}

.MessageReponse:focus {
	outline: none;
	border-color: #667eea;
	box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}

.MessageReponse::placeholder {
	color: #a0aec0;
}

.rep-char-counter {
	text-align: right;
	font-size: 12px;
	color: #718096;
	margin-top: 6px;
}

.rep-modal-footer {
	padding: 0 28px 28px 28px;
	display: flex;
	gap: 12px;
	justify-content: flex-end;
}

.rep-btn {
	padding: 12px 32px;
	border: none;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.3s ease;
}

.rep-btn-cancel {
	background: #f7fafc;
	color: #4a5568;
	border: 2px solid #e2e8f0;
}

.rep-btn-cancel:hover {
	background: #edf2f7;
	border-color: #cbd5e0;
}

.rep-btn-submit {
	/*background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);*/
	background: linear-gradient(135deg, rgb(214, 192, 124) 0%, rgb(175, 136, 18) 100%);
	color: white;
	box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
}

.rep-btn-submit:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 16px rgba(102, 126, 234, 0.5);
}

.rep-btn-submit:disabled {
	opacity: 0.5;
	cursor: not-allowed;
	transform: none;
	box-shadow: 0 4px 12px rgba(102, 126, 234, 0.2);
}

.ReponseBoutonProposal {
	/* background-color: rgb(8, 129, 206);*/
	background-color: rgb(214, 192, 124);
	text-decoration: none;
	color: white;
	border: none;
	padding: 12px 32px;
	font-size: 15px;
	border-radius: 8px;
	cursor: pointer;
	font-weight: 600;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
	transition: all 0.3s ease;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	margin-right: 10px;
}

@keyframes rep-fadeIn {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@keyframes rep-slideUp {
	from {
		transform: translateY(30px);
		opacity: 0;
	}

	to {
		transform: translateY(0);
		opacity: 1;
	}
}

.rep-success-message {
	display: none;
	background: linear-gradient(135deg, #48bb78 0%, #38a169 100%);
	color: white;
	padding: 16px 24px;
	border-radius: 8px;
	position: fixed;
	top: 20px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 1001;
	text-align: center;
	font-weight: 600;
	animation: rep-slideUp 0.4s ease;
	box-shadow: 0 4px 12px rgba(72, 187, 120, 0.4);
}

.rep-success-message.rep-show {
	display: block;
}

/* -----------------FIN ----------------*/

.td-flex-column {
	display: flex;
	flex-direction: column;

}

.push-bottom {
	margin-top: auto;
	margin-bottom: -50px;
	/* ajuste 4px, 6px, 8px selon ton goût */

	display: flex;
	justify-content: center;
	/* centre horizontalement */
	gap: 10px;
	/* espace entre les boutons */
}

/* ------ DEBUT --------------------- */

.proposition-receve-status {
	background: rgba(212, 175, 55, 0.2);
	color: #D4AF37;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 5px;
	font-size: 0.85rem;
	font-weight: 500;
	/*border-top:0.05em solid rgb(150, 214, 246);*/
	border-top: 2px solid rgb(138 135 71);
	border-radius: 0px 0px 10px 10px;
	box-shadow: rgb(188, 187, 184) 0px 0px 0px 0px, inset 0px -3px 3px rgba(215, 210, 210, 0.5);
	/*box-shadow: 1px 4px 3px 4px rgba(215, 210, 210, 0.5);*/

	position: absolute;
	top: 94px;
	left: 370px;
}

/* Container principal du placeholder */
.letrocroyal-placeholder-exchange {
	aspect-ratio: 4/3;
	/*background: #f7fcff26;*/
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	position: relative;
	overflow: hidden;
	border-radius: 8px;
	/* Ajustez selon votre design existant */
	/*padding:50px;*/

}

/* Effet de fond avec gradients radiaux subtils */
.letrocroyal-placeholder-exchange::before {
	content: '';
	position: absolute;
	inset: 0;
	background:
		radial-gradient(circle at 20% 30%, rgba(212, 175, 55, 0.08) 0%, transparent 50%),
		radial-gradient(circle at 80% 70%, rgba(212, 175, 55, 0.06) 0%, transparent 50%);
	pointer-events: none;
}

/* Cercle central avec bordure dorée animée */
.exchange-circle {
	/*width: 140px;
    height: 140px;*/
	border: 2px solid rgba(212, 175, 55, 0.4);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	animation: pulse-border 3s ease-in-out infinite;
	top: 10px;
}

/* Animation de pulsation du cercle */
@keyframes pulse-border {

	0%,
	100% {
		border-color: rgba(212, 175, 55, 0.4);
		box-shadow: 0 0 0 0 rgba(212, 175, 55, 0.4);
	}

	50% {
		border-color: rgba(212, 175, 55, 0.7);
		box-shadow: 0 0 0 12px rgba(212, 175, 55, 0);
	}
}

/* Container des flèches */
.arrows-icon {
	position: relative;
	width: 80px;
	height: 80px;
}

/* Style de base pour les flèches */
.arrow {
	position: absolute;
	width: 40px;
	height: 40px;
}

/* Flèche droite (vers la droite) */
.arrow-right {
	top: 0;
	right: 0;
	animation: slide-right 2s ease-in-out infinite;
}

/* Flèche gauche (vers la gauche) */
.arrow-left {
	bottom: 0;
	left: 0;
	animation: slide-left 2s ease-in-out infinite;
}

/* Animation de la flèche droite */
@keyframes slide-right {

	0%,
	100% {
		transform: translateX(0);
		opacity: 1;
	}

	50% {
		transform: translateX(8px);
		opacity: 0.7;
	}
}

/* Animation de la flèche gauche */
@keyframes slide-left {

	0%,
	100% {
		transform: translateX(0);
		opacity: 1;
	}

	50% {
		transform: translateX(-8px);
		opacity: 0.7;
	}
}

/* Texte principal */
.placeholder-text {
	margin-top: 24px;
	color: #D4AF37;
	font-family: 'Cinzel', serif;
	/* Utilisez votre police LeTrocRoyal */
	font-size: 1rem;
	letter-spacing: 2px;
	text-transform: uppercase;
	position: relative;
	z-index: 1;
}

/* Sous-texte */
.placeholder-subtext {
	margin-top: 8px;
	color: #F4E4B0;
	font-size: 0.85rem;
	opacity: 0.7;
	position: relative;
	z-index: 1;
}

/* Responsive - Tablette */
@media (max-width: 768px) {
	.exchange-circle {
		width: 120px;
		height: 120px;
	}

	.arrows-icon {
		width: 70px;
		height: 70px;
	}

	.arrow {
		width: 35px;
		height: 35px;
	}

	.placeholder-text {
		font-size: 0.9rem;
	}
}

/* Responsive - Mobile */
@media (max-width: 480px) {
	.exchange-circle {
		width: 100px;
		height: 100px;
	}

	.arrows-icon {
		width: 60px;
		height: 60px;
	}

	.arrow {
		width: 30px;
		height: 30px;
	}

	.placeholder-text {
		font-size: 0.85rem;
		letter-spacing: 1.5px;
	}

	.placeholder-subtext {
		font-size: 0.8rem;
	}
}

/* ----------------------------------- */


.alert-container {
	width: 520px;
	height: 240px;
	background: white;
	border-radius: 12px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
	overflow: hidden;
	display: flex;
	animation: slideIn 0.4s ease-out;
}

@keyframes slideIn {
	from {
		opacity: 0;
		transform: scale(0.95);
	}

	to {
		opacity: 1;
		transform: scale(1);
	}
}

.alert-left {
	width: 160px;
	background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.alert-icon {
	width: 70px;
	height: 70px;
	background: white;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
	animation: pulse 2s infinite;
	margin-bottom: 15px;
}

@keyframes pulse {

	0%,
	100% {
		transform: scale(1);
	}

	50% {
		transform: scale(1.05);
	}
}

.alert-icon svg {
	width: 38px;
	height: 38px;
	fill: #ff6b6b;
}

.credit-display {
	text-align: center;
}

.credit-label {
	color: rgba(255, 255, 255, 0.9);
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	margin-bottom: 5px;
}

.credit-value {
	color: white;
	font-size: 36px;
	font-weight: 700;
	line-height: 1;
}

.alert-right {
	flex: 1;
	padding: 30px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.alert-content {
	flex: 1;
}

.alert-title {
	color: #2d3748;
	font-size: 22px;
	font-weight: 700;
	margin-bottom: 10px;
}

.alert-message {
	color: #718096;
	font-size: 13px;
	line-height: 1.5;
}

.alert-actions {
	display: flex;
	gap: 10px;
}

.btn {
	flex: 1;
	padding: 10px 16px;
	border: none;
	border-radius: 8px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.3s ease;
	text-align: center;
}

.btn-primary {
	background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
	color: white;
	box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

.btn-primary:hover {
	transform: translateY(-1px);
	box-shadow: 0 6px 16px rgba(102, 126, 234, 0.4);
}

.btn-secondary {
	background: white;
	color: #667eea;
	border: 2px solid #e2e8f0;
}

.btn-secondary:hover {
	background: #f7fafc;
	border-color: #cbd5e0;
	transform: translateY(-1px);
}

.sans-credit-container {
	background: white;
	border-radius: 00px;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);

	width: 100%;
	overflow: hidden;
	animation: slideIn 0.5s ease-out;
}

@keyframes slideIn {
	from {
		opacity: 0;
		transform: translateY(-30px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.sans-credit-header {
	background: linear-gradient(135deg, #FF6B6B 0%, #FF8E53 100%);
	padding: 30px;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.sans-credit-header::before {
	content: '';
	position: absolute;
	top: -50%;
	right: -50%;
	width: 200%;
	height: 200%;
	background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);
	animation: pulse 3s ease-in-out infinite;
}

@keyframes pulse {

	0%,
	100% {
		transform: scale(1);
	}

	50% {
		transform: scale(1.1);
	}
}

.sans-credit-icon-wrapper {
	background: rgba(255, 255, 255, 0.2);
	width: 80px;
	height: 80px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 20px;
	backdrop-filter: blur(10px);
	position: relative;
	z-index: 1;
}

.sans-credit-icon {
	font-size: 40px;
}

.sans-credit-header h1 {
	color: white;
	font-size: 24px;
	font-weight: 600;
	margin-bottom: 10px;
	position: relative;
	z-index: 1;
}

.sans-credit-offer-count {
	background: rgba(255, 255, 255, 0.25);
	color: white;
	padding: 8px 20px;
	border-radius: 25px;
	display: inline-block;
	font-size: 16px;
	font-weight: 500;
	backdrop-filter: blur(10px);
	position: relative;
	z-index: 1;
}

.sans-credit-content {
	padding: 40px 30px;
	text-align: center;
}

.sans-credit-message {
	font-size: 18px;
	color: #333;
	margin-bottom: 30px;
	line-height: 1.6;
}

.sans-credit-message strong {
	color: #FF6B6B;
	font-weight: 600;
}

.sans-credit-credit-info {
	background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
	padding: 25px;
	border-radius: 15px;
	margin-bottom: 30px;
}

.sans-credit-credit-balance {
	font-size: 16px;
	color: #555;
	margin-bottom: 15px;
}

.sans-credit-balance-display {
	background: white;
	padding: 15px 30px;
	border-radius: 10px;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.sans-credit-star-icon {
	font-size: 24px;
	animation: rotate 3s linear infinite;
}

@keyframes rotate {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

.sans-credit-balance-amount {
	font-size: 32px;
	font-weight: bold;
	color: #FF6B6B;
}

.sans-credit-cta-button {
	background: linear-gradient(135deg, #0c0c3c 0%, #2c87c4 100%);
	color: white;
	border: none;
	padding: 15px 40px;
	border-radius: 50px;
	font-size: 18px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.3s ease;
	box-shadow: 0 4px 15px rgba(102, 126, 234, 0.4);
	text-decoration: none;
	display: inline-block;
}

.sans-credit-cta-button:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(102, 126, 234, 0.6);
}

.sans-credit-cta-button:active {
	transform: translateY(0);
}

.sans-credit-info-text {
	margin-top: 20px;
	font-size: 14px;
	color: #777;
}

@media (max-width: 600px) {
	.sans-credit-header h1 {
		font-size: 20px;
	}

	.sans-credit-content {
		padding: 30px 20px;
	}

	.sans-credit-message {
		font-size: 16px;
	}
}

/* Note informative */
.info-note {
	background: #f0f7ff;
	border-left: 4px solid #4a90e2;
	padding: 15px 20px;
	border-radius: 8px;
	margin-top: 25px;
	font-size: 14px;
	color: #555;
	line-height: 1.6;
}

.info-note strong {
	color: #4a90e2;
}

/* Credit Badge avec dropdown */
.credit-badge-container {
	position: relative;
}

/*
.credit-badge-etoile {
    background: linear-gradient(135deg, #4a90e2 0%, #357abd 100%);
    color: white;
    padding: 12px 24px;
    border-radius: 25px;
    cursor: pointer;
    font-size: 16px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(74, 144, 226, 0.3);
	margin-left: 40px;
	margin-right: 40px;
	margin-top: 10px;
	margin-bottom: 10px;
	text-align: right;
}

.credit-badge-etoile:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(74, 144, 226, 0.5);
    border-color: rgba(255, 255, 255, 0.5);
}
*/
/* Couleur bleue quand le dropdown est ouvert */
.credit-badge-etoile.dropdown-open {
	background: #177ec3d4;
	/* ← Bleu clair */
	box-shadow: 0 0 12px rgba(255, 215, 0, 0.6);
	transform: scale(1.05);
}

/* Dropdown Menu */
.credit-dropdown {
	position: absolute;
	top: calc(100% + (-15px));
	right: 50px;
	background: white;
	border-radius: 15px;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
	min-width: 400px;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-10px);
	transition: all 0.3s ease;
	z-index: 1000;
	border: 1px solid #e0e0e0;
	width: 360px;
}

.credit-dropdown.active {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* Arrow pointer */
.credit-dropdown::before {
	content: '';
	position: absolute;
	top: -8px;
	right: 30px;
	width: 16px;
	height: 16px;
	background: white;
	border-left: 1px solid #e0e0e0;
	border-top: 1px solid #e0e0e0;
	transform: rotate(45deg);
}

.dropdown-content {
	padding: 25px;
}

.dropdown-title {
	font-size: 20px;
	font-weight: 700;
	color: #1a1a2e;
	margin-bottom: 20px;
	padding-bottom: 15px;
	border-bottom: 2px solid #f0f0f0;
}

.credit-info {
	margin-bottom: 15px;
}

.credit-info-label {
	color: #666;
	font-size: 14px;
	margin-bottom: 5px;
}

.credit-info-value {
	color: #1a1a2e;
	font-size: 16px;
	font-weight: 600;
}

.credit-info-value.highlight {
	color: #d4a017;
	font-size: 24px;
}

.credit-info-value.subscription {
	color: #4a90e2;
	font-weight: 700;
}

.recharge-button {
	width: 100%;
	background: linear-gradient(135deg, #d4a017 0%, #b8860b 100%);
	color: white;
	border: none;
	padding: 14px 20px;
	border-radius: 25px;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	margin-top: 20px;
	transition: all 0.3s ease;
	box-shadow: 0 4px 15px rgba(212, 160, 23, 0.3);
}

.recharge-button:hover {
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(212, 160, 23, 0.5);
}

/* Overlay */
.dropdown-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	display: none;
	z-index: 999;
}

.dropdown-overlay.active {
	display: block;
}


#propose_ConsultationCredit {
	transition: height 0.45s ease, opacity 0.3s ease, transform 0.35s ease;
	opacity: 0;
	height: 0px;
	transform: translateY(-12px);
	border-radius: 0px;
	overflow: hidden;
	display: none;
	background: white;
}


/* barre de progression : CTA répondre */
/* ----------------------------------- */
.ltr-countdown {
	font-size: 14px;
}

/* Texte expiration */
.ltr-expire-label {
	font-size: 12px;
	margin-bottom: 12px;
}

.ltr-expiration-box {

	/*background: rgba(201, 168, 76, 0.15);
    border: 1px solid var(--glass-border);
    border-radius: 20px;
	*/
	margin-top: 10px;
	padding: 4px 12px;
	font-size: 11px;
	color: var(--gold);
	letter-spacing: 0.05em;

	/*
    background: linear-gradient(180deg,#f5f7fa,#e9edf2);
    padding:6px;
    border-radius:14px;
	*/
	/*box-shadow:0 4px 12px rgba(0,0,0,0.08);*/
	/*
	box-shadow: 0 4px 12px rgb(24 21 103 / 76%);
    text-align:center;
    max-width:330px;
    float:right;
    height: 40px;
    width: auto;
    padding-left: 10px;
    padding-right: 10px;
	*/
}

.ltr-expire-label {

	font-size: 10px;
	margin-bottom: 10px;
	font-weight: 100;
}

.ltr-progress-container {

	width: 100%;
	height: 10px;
	background: #ddd;
	border-radius: 20px;
	overflow: hidden;
	margin-bottom: 20px;
}

.ltr-progress-bar {

	height: 100%;
	width: 0%;
	transition: width 1s linear, background 0.5s;
	border-radius: 20px;
}

.ltr-urgency-blue {
	background: linear-gradient(90deg, #007bff, #4db8ff);
}

.ltr-urgency-orange {
	background: linear-gradient(90deg, #ff8800, #ffb347);
}

.ltr-urgency-red {
	background: linear-gradient(90deg, #ff6b6b, #ff9b9b);
}

/* Badge crédits */
/*
.credit-badge {
    position: fixed;
    top: 290px;
    right: 20px;
    background: #0A1A2A;
    color: #D9B16F;
    border: 2px solid #D5A44A;
    padding: 10px 18px;
    border-radius: 14px;
    font-size: 15px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.25);
    cursor: pointer;
    z-index: 999;
}*/
/*
.credit-badge-etoile {
	position: fixed;
    top: 290px;
    right: 20px;
    cursor: pointer;
    display: inline-block;
    padding: 10px 16px;
    border-radius: 14px;
    background: #2a2a2a;
    color: white;
    font-weight: 600;
    transition: all .3s ease;
    box-shadow: 0 0 0 rgba(255, 215, 0, 0);
	border: 2px solid #D5A44A;
}*/
.credit-badge-etoile {
	position: fixed;
	top: 290px;
	right: 20px;
	cursor: pointer;
	display: inline-flex;
	/* ← CHANGÉ de inline-block à inline-flex */
	align-items: center;
	gap: 8px;
	/* ← Espacement entre l'étoile et le texte */
	padding: 10px 16px;
	border-radius: 14px;
	background: #2a2a2a;
	color: white;
	font-weight: 600;
	transition: all .3s ease;
	box-shadow: 0 0 0 rgba(255, 215, 0, 0);
	border: 2px solid #D5A44A;
	z-index: 1000;
	margin-right: 22px;
}

.credit-badge-etoile:hover {
	transform: translateY(-2px);
}

/* 🌟 État actif */
.credit-badge-etoile.active {
	/*background: #3b3b3b;*/
	background: #177ec3d4;
	box-shadow: 0 0 12px rgba(255, 215, 0, 0.6);
	transform: scale(1.05);
}

/* Animation de l’étoile lorsque actif */
/*
.credit-badge-etoile.active span {
    display: inline-block;
    animation: spinStar .8s ease-out forwards;
}

@keyframes spinStar {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
*/

/* L'étoile UNIQUEMENT - élément séparé */
.star-icon {
	display: inline-block;
	font-size: 18px;
	line-height: 1;
}

/* Animation de l'étoile lorsque actif */
.credit-badge-etoile.active .star-icon {
	animation: spinStar 0.8s ease-out forwards;
}

@keyframes spinStar {
	from {
		transform: rotate(0deg) scale(1);
	}

	50% {
		transform: rotate(180deg) scale(1.3);
		/* Zoom à mi-parcours */
	}

	to {
		transform: rotate(360deg) scale(1);
	}
}


#frame-consult-box {
	opacity: 0;
	transform: scale(0.92);
	transition: opacity 0.35s ease, transform 0.35s ease;
}

.lr-modal_old {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.5);
	display: none;
	/* cachée par défaut */
	align-items: center;
	justify-content: center;
	z-index: 9999;
}

.lr-modal {
	inset: 0;
	position: fixed;
	/* reste centré même quand ça scroll */
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	z-index: 9999;
	display: flex;
	justify-content: center;
	align-items: center;
	/* centrer verticalement */
	z-index: 9999;
	background: rgba(0, 0, 0, 0.5);
	display: none;
	/* cachée par défaut */

}

.lr-modal-content {
	background: #fff;
	padding: 20px;
	border-radius: 8px;
	max-width: 720px;
	width: 95%;
	position: relative;
}

.lr-modal-content-old {
	background: #fff;
	padding: 20px;
	border-radius: 8px;
	max-width: 720px;
	width: 95%;
	position: relative;
	top: auto;
	bottom: auto;
	margin-left: auto;
	margin-right: auto;
}

.lr-modal-close {
	position: absolute;
	right: 12px;
	top: 8px;
	border: none;
	background: transparent;
	font-size: 24px;
	cursor: pointer;
}

.lr-options {
	display: flex;
	gap: 12px;
}

.lr-buy {
	background: #7b0b1d;
	color: #fff;
	padding: 10px 16px;
	border: none;
	border-radius: 6px;
	cursor: pointer;
}

.lr-card {
	flex: 1;
	background: #ffffff;
	border: 1px solid #ddd;
	padding: 25px;
	border-radius: 15px;
	width: 320px;
	text-align: center;
	transition: 0.3s;
}

.lr-card:hover {
	border-color: #800020;
	box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.15);
	transform: translateY(-3px);
}

.premium-modal {
	text-align: center;
	padding: 10px 20px;
}

.premium-modal .warning {
	color: red;
	font-weight: bold;
}

.plans-container {
	display: flex;
	gap: 20px;
	justify-content: center;
	margin-top: 20px;
	flex-wrap: wrap;
}

.plan {
	width: 120px;
	background: #ffffff;
	border-radius: 10px;
	padding: 15px;
	box-shadow: 0 0 10px #00000015;
	border: 2px solid #eee;
	position: relative;
	transition: transform .2s ease;
	text-align: center;
}

.plan.small {
	opacity: 0.85;
}

.plan:hover {
	transform: scale(1.05);
}

/* 🔥 SECTION PREMIUM MISE EN AVANT */
.plan.premium {
	border: 2px solid #B8860B;
	background: linear-gradient(to bottom, #fff9e6, #fff);
	box-shadow: 0 0 15px rgba(184, 134, 11, .4);
}

.plan.highlighted {
	/*transform: scale(1.08);*/
	box-shadow: 0 0 20px rgba(184, 134, 11, .6);
}

/* ⭐ Badge Best Seller */
.badge {
	position: absolute;
	top: -10px;
	left: 50%;
	transform: translateX(-50%);
	background: #B8860B;
	color: white;
	padding: 4px 10px;
	border-radius: 20px;
	font-size: 12px;
	font-weight: bold;
	width: 110px;
}

/* Boutons */
.btn-red,
.btn-gold {
	border: none;
	padding: 10px;
	width: 100%;
	border-radius: 8px;
	font-weight: bold;
	cursor: pointer;
}

.btn-red {
	background: #8B0A1A;
	/* Bordeaux */
	color: white;
}

.btn-gold {
	background: #B8860B;
	color: white;
}




.Schema-Processus-Troc {
	left: 50%;
	margin-left: -360px;
	height: 82px;
	width: 800px;
	top: 2px;
	z-index: 999;
	position: fixed;
}

.title-cardFiche {
	font-family: 'Playfair Display', serif;
	color: var(--text);
	font-size: 14px;
	margin-bottom: 6px;
	margin-left: 14px;
}

.Reponsetroc-msg {
	overflow-y: auto;
	overflow-x: hidden;
	flex-direction: column;
	height: auto;
	padding-right: 15px;
	padding-left: 0px;
	width: 490px;
	border: 0px solid red;
	min-height: 40px;
	max-height: 140px;
	margin-bottom: 5px;
	margin-top: 0px;
}

.Reponsetroc-msg span {
	/*
    font-weight:normal; 
    color:#333333; 
    font-family:verdana; 
    font-size:14px; 
    line-height:18px;
	*/
	color: var(--text-muted);
	font-size: 13px;
	line-height: 1.6;

}

.troc-see-more {
	color: #007bff;
	cursor: pointer;
	text-decoration: underline;
}

.troc-see-more:hover {
	color: rgb(0, 98, 204);
	cursor: pointer;
	text-decoration: none;
}

/*
.ReponseBoutonProposal{
	font-weight:bold; 
	text-align:center; 
	font-family:verdana; 
	font-size:10px; 
	color:white; 
	cursor:hand; 
	background-color:rgb(8, 129, 206);
	height: 25px;
  	border-radius: 8px;
	cursor:pointer;
}
	*/
.NbProposalReceive {
	width: 100%;
	text-align: center;
	height: 40px;
	border: 0px solid red;
	vertical-align: middle;
	display: grid;
	position: relative;
	margin-top: 5px;
	font-size: 14px;
	font-family: verdana;
}

.BanniereTitleProposal {
	/*width: 730px;*/
	height: 50px;
	color: #0B0B3B;
	font-family: arial, verdana;
	font-size: 12px;
	padding-top: 8px;
	padding-bottom: 5px;
	/*border: 1px solid #23314e57;*/
	/*border-radius: 10px;*/
	/*margin-bottom: 10px;*/
	margin-left: auto;
	margin-right: auto;
	/*background-color: #0c0c3c;*/
	/* aliceblue;*/
	padding-top: 25px;
	/*background: linear-gradient(to bottom, #0b0b3b 0%, #1f2b4d 65%, #2c3e50 80%, #2980b9 90%, #97d2ff 100%);*/

}

.ChildBanniereTitleProposal {
	display: inline-block;
	position: relative;
	width: 730px;
	height: 30px;
	text-align: center;
	padding-top: 0px;
}
#GrpPropositionSansReponse {
	 border-top:5px solid #97d2ff; overflow-y: auto; height: 750px;
}

.SpanChildBanniereTitleProposal {
	background-color: transparent;
	font-weight: bold;
	color: #ceaa46;
	font-size: 1.0rem;
	font-family: arial;
	padding-left: 5px;
	padding-right: 5px;
	width: 80%;
    display: block;
    border: 0px solid red;
    height: 50px;
    top: -10px;
    position: absolute;

	/*
	border: 1px solid #ccc;
	border-radius: 5px;
	box-shadow: 0px 1px 3px rgba(0,0,0,0.25), inset 4px -1px 6px rgba(215, 210, 210, 0.5);
	*/
}

.AlerteReponse {
	position: absolute;
	text-align: center;
	width: 320px;
	border: 0px solid red;
	right: 22px;
	margin-top: 8px;
	height: 40px;
	padding: 5px;
	font-size: 12px;
}

.MessageReponse {
	width: 100%;
	max-width: 470px;
	font-family: inherit;
	font-size: 14px;
	background-color: #e0dddd91;
	border: 1px solid rgb(226, 232, 240);
	color: #0c0c3c;
	font-weight: normal;
	padding-top: 5px;
	padding-left: 5px;
	overflow: auto;
	border-radius: 10px;
	box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.25), inset 2px -1px 8px rgba(255, 255, 255, 0.5);
}

.TexteMsgReponse {
	display: none;
	border-radius: 10px;
}

.PayanteProposition {
	background-color: #f6f6f6d1;
	display: none;
	overflow: hidden;
	font-size: 30px;
	width: 300px;
	margin-left: auto;
	margin-right: auto;
	height: 100px;
	margin-top: 20px;
	border-radius: 30px;
	border: 4px solid #fdfdfd;
	text-align: center;
	justify-content: center;
	/* Centrage horizontal */
	align-items: center;
	/* Centrage vertical */
	line-height: 40px;
}

.StatusReponse {
	font-weight: bold;
	color: #01a2e1;
	font-size: 18px;
	/*
	width: 520px;
	*/
	width: 100%;
	height: 230px;
	margin-top: 30px;

	text-align: center;

	/*
	padding-top: 10px;
	background: #e2be7a36;
	border: 1px solid gray;
	margin-left: 40px;
	height:194px;
	width: 88%;
	border-radius: 20px;


	background:#e2be7a;
	position: relative;
	bottom: 80px;
	*/

}

.BouttonMsgReponse {
	display: none;
	/*padding-left:20px;
	float: right;*/
	width: 400px;
	text-align: left;
}


/* Empêche le défilement lorsque le rideau est affiche*/
.no-scroll-rideau {
	overflow: hidden;
	height: 100vh;
}

#ListePropositionMembre {
	scroll-margin-top: 500px;
	/* Ajustez la valeur selon vos besoins */
}

.idPropDescrib {
	font-style: italic;
	font-size: 14px;
	font-family: arial;
	font-weight: normal;
	margin-bottom: 10px;
	padding: 5px;
	/*
	box-shadow: 2px 3px 2px 3px #afafaf; 
	background-color:white; 
	*/
	max-width: 325px;
	overflow: hidden;
	word-wrap: break-word;
	overflow-y: auto;
	padding-right: 15px;
	border-radius: 5px;
	min-height: 60px;
	max-height: 150px;

}

#PropPhoto,
#PropDescription {
	height: auto;
	/* Ajuste dynamiquement */
}

.image-container {
	background-color: white;
	border-radius: 10px;
	/*border: 1px solid gray;*/
	font-size: 14px;
	font-weight: bold;
	text-align: center;
	/*height: 200px;*/
	overflow: hidden;
	/* Masque tout débordement */
}

.image-container img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	/* Respecte les proportions */
	object-position: center;
	/* Centre l'image */
}

/* DEBUT EFFET RIDEAU */
.ImageIA50-VIDE {
	background-repeat: no-repeat;
	display: inline-block;
	background-position: top;
	height: 810px;
	top: 300px;
	background-origin: content-box;
	position: absolute;
	z-index: 9;
	background-size: auto 100%;
	background-image: url('../images/IA50/ia50.jfif');
	width: 225px;
	border-bottom-left-radius: 20px;
	margin-left: 5px;
}

.EmojiCategorie {
	font-size: 80px;
	position: absolute;
	top: 280px;
	left: 66px;
	background-color: white;
	width: 206px;
	left: 29px;
	height: 122px;
	margin-top: -10px;
	z-index: 99;
	border-bottom-width: 3px;

	border-bottom-width: 3px;
	border-bottom-left-radius: 30%;
	border-bottom-style: inset;
	border-bottom-color: #bf9b30;
	border-bottom-right-radius: 30%;
	box-shadow: -1px 6px 5px 0px rgba(0, 0, 0, 0.2);
}

.BoutonGoogleIdent {
	font-size: 8px;
	font-family: verdana;
	color: #a68c14;
	font-weight: bold;
}

.preload {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: white;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 999;
}

.loader {
	display: none;
	border: 10px solid #f3f3f3;
	border-top: 10px solid #f39c12;
	border-radius: 50%;
	width: 80px;
	height: 80px;
	animation: spin 2s linear infinite;
}

@keyframes spin {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

/* Rideau */
.curtain {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: white;
	/* #f9ca30d8;*/
	background-image: url('../images/IA50/ia50_17.jfif');
	/*background-size: cover;*/
	background-position: center;
	transition: transform 1.5s ease-in-out;
	z-index: 2;
	display: flex;
	justify-content: center;
	align-items: center;
	color: gold;
	font-family: 'Georgia', serif;
	text-align: center;
	background-repeat: no-repeat;
}

/* Bouton curtain-button */
.curtain-button {
	font-size: 1.5rem;
	/* Texte plus grand pour attirer l'attention */
	padding: 15px 30px;
	/* Ajout d'espace autour du texte */
	border: 2px solid #fff;
	/* Bordure blanche visible */
	background-color: rgba(0, 0, 0, 0.7);
	/* Fond semi-transparent pour le contraste */
	color: #fff;
	/* Texte blanc */
	border-radius: 5px;
	/* Coins arrondis */
	cursor: pointer;
	/* Curseur en main pour indiquer l'action */
	transition: all 0.3s ease;
	/* Animation fluide pour les interactions */
}

/* Effets hover */
.curtain-button:hover {
	background-color: #b22222;
	/* Rouge Bordeaux pour attirer l'attention */
	border-color: #b22222;
	color: #fff;
}


.curtain.open {
	transform: translateY(-100%);
	/* Le rideau se lève vers le haut */
}

.curtain-message {
	font-size: 2em;
	line-height: 1.4;
	padding: 20px;
	background-color: rgba(0, 0, 0, 0.6);
	border-radius: 10px;
	max-width: 80%;
}

/* Si vous voulez rendre le bouton fixe même avec des animations de rideau */
#curtain.open #curtain-message {
	display: block;
	opacity: 1;
}

/* Effet de révélation progressive du contenu */
.content-Master {
	position: relative;
	z-index: 1;
	/*opacity: 0;
	transition: opacity 1.5s ease-in-out;*/
}

.content-Master.fade-in {
	opacity: 1;
}

#openCurtain {
	position: relative;
	top: -10px;
	font-size: 18px;
	cursor: pointer;
	background-color: #B22222;
	color: white;
	border: none;
	border-radius: 8px;
	transition: background-color 0.3s ease;
	z-index: 4;
}

/*
#openCurtain {
	position: absolute;
	bottom: 15%;
	left: 50%;
	transform: translateX(-50%);
	padding: 15px 30px;
	font-size: 18px;
	cursor: pointer;
	background-color: #B22222;
	color: white;
	border: none;
	border-radius: 8px;
	transition: background-color 0.3s ease;
	z-index: 4;
}
*/

#openCurtain:hover {
	background-color: #8B0000;
}

/* FIN EFFET RIDEAU */


.DivBlocTrocTagAnnonce {
	padding: 10 10 10 10;
	padding-bottom: 10px;
	margin-left: 28px;
	height: 1045px;
	overflow-y: scroll;
}

.DivBtransition {
	transform: translate(-50%, -50%);
	position: absolute;
	z-index: 9;
	left: 94%;
}

.ViewPrice {
	line-height: 1.7em;
	text-align: center;
	justify-content: center;
	color: #bf9b30;
	font-family: verdana;
	font-size: 10px;
	font-weight: normal;
	font-style: normal;
	text-transform: lowercase;
	width: 132px;
	height: 40px;
	box-shadow: 1px 4px 3px 4px rgba(0, 0, 0, 0.5);
	position: relative;
	top: 38px;
	left: 570px;
	z-index: 9;
	overflow: visible;
	/*background-color:#ffffffc7;*/
	border-bottom-right-radius: 15px;
	border-bottom-left-radius: 15px;
	background: linear-gradient(to top, rgba(255, 255, 255, 0.8) 30%, rgb(255, 255, 255) 100%);
}

.TrocRoyalTag {
	background-color: white;
	border: 0px solid gray;
	width: 764px;
	padding-top: 10px;
	padding-bottom: 30px;
	margin-left: 10px;
	/*border-right: 1px solid #d6c07c;
    border-left: 1px solid #d6c07c; */
	/*box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; */
	text-align: center;
}

.ConsulteFicheTrocRoyal {
	overflow-y: auto;
	overflow-x: hidden;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	position: relative;
	height: 1075px;
	padding-left: 10px;
}

.parent-div-Proposition-Revok {
	width: 740px;
	height: 950px;
	overflow-y: scroll;
	position: relative;
	background-image: url('/images/IA50/ia50_29.jfif');
	/* Image de fond par défaut */
	background-repeat: no-repeat;
	background-position: center;
	background-size: 100% 100%;
	transition: background-image 0.5s ease;
}

.DivBlocTrocTagAnnonce,
.containerForm,
#myDiv,
.TrocRoyalAnnonceur,
#IdAllProposition,
.ConsulteFicheTrocRoyal,
.StoryTrocMagazine,
#SousBlocRechercherAnnonces,
.parent-div-Proposition-Revok {
	/* ... autres styles ... */
	scrollbar-color: #98cef2 transparent;
	/* Couleur de fond et de curseur #666*/
	scrollbar-width: thin;
	/* Épaisseur de la barre de défilement */
}

.DivBlocTrocTagAnnonce .containerForm #myDiv .TrocRoyalAnnonceur #IdAllProposition .ConsulteFicheTrocRoyal .StoryTrocMagazine .parent-div-Proposition-Revok #SousBlocRechercherAnnonces::-webkit-scrollbar {
	width: 2px;
	/* Épaisseur de la barre de défilement */
	height: 40px;
	/* Hauteur de la barre de défilement */
	background-color: #fff;
	/* Couleur de fond */
}

.DivBlocTrocTagAnnonce .containerForm #myDiv .TrocRoyalAnnonceur #IdAllProposition .ConsulteFicheTrocRoyal .StoryTrocMagazine .parent-div-Proposition-Revok #SousBlocRechercherAnnonces::-webkit-scrollbar-thumb {
	background-color: #0c0c3c;
	/* Couleur du curseur #666*/
	border-radius: 20px;
	/* Arrondi du curseur */
}

.DivBlocTrocTagAnnonce .containerForm #myDiv .TrocRoyalAnnonceur #IdAllProposition .ConsulteFicheTrocRoyal .StoryTrocMagazine .parent-div-Proposition-Revok #SousBlocRechercherAnnonces::-webkit-scrollbar-thumb:hover {
	background-color: #444;
	/* Couleur du curseur au survol */
}


/* Style de la div enfant */
.child-Revok {
	height: 950px;
	/* Hauteur égale à celle de la div parent */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 24px;
	color: white;
	text-align: center;
}

#google-logout-btn {
	background-image: url(/images/web_neutral_rd_na.png);
	background-repeat: no-repeat;
	background-size: 30%;
	background-position: left;
	background-color: #f0efee;
	transition: background-color 0.3s;
	text-align: center;
	color: #1a0e44;
	width: 120px;
	border-radius: 10px;
	text-align: center;
	font-weight: bolder;
	font-size: 0.7rem;
	cursor: pointer;
	height: 30px;
	padding-left: 28px;
	margin-top: 5px;
}

#google-logout-btn:hover {
	color: red;
	height: 30px;
}

#google-login-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: transparent;
	/* Couleur de fond de Google */
	color: white;
	/* Couleur du texte */
	padding: 10px 10px;
	/* Ajustez les valeurs pour le rembourrage */
	border: none;
	/* Pas de bordure */
	border-radius: 4px;
	font-size: 12px;
	font-weight: bold;
	cursor: pointer;
	/* Curseur pointer au survol */
	transition: background-color 0.3s;
	text-align: center;
	position: absolute;
	top: 150px;
	left: 125px;
	z-index: 99;
	width: 100px;
	/* Largeur du bouton */
	height: 34px;
	/* Hauteur du bouton */
	background-image: url('/images/web_neutral_rd_na.png');
	/* Logo en fond */
	background-repeat: no-repeat;
	/* Ne pas répéter l'image */
	background-size: 30%;
	/* Ajustez la taille de l'image de fond */
	background-position: left center;
	/* Positionner l'image */
	padding-left: 40px;
	border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;
}

#google-login-btn:hover {
	/*background-color: transparent; /* Couleur plus foncée au survol */
	background-color: #fdfeffa6;
	color: #2f65b5;
	border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;
	transition: background-color 0.3s;
	font-size: 12px;
	font-weight: bold;
	/*border-top-left-radius: 20px;
  	border-bottom-left-radius: 20px;
	*/
}

.ContratPdf {
	color: #f1d692;
	text-decoration: underline;
}

.ContratPdf:hover {
	text-decoration: none;
}

#LogoWebSite {
	width: 230px;
	height: 80px;
	padding-bottom: 0px;
	background-color: white;
	text-align: center;
	border: 0px solid cyan;
	position: relative;
	/*color:#920808;*/
}

.EspaceCelluleTropTopEssai {
	color: black;
	background-color: rgba(208, 240, 192, 0.3);
	font-family: Arial;
	font-size: 10px;
	border: 01px solid #99FF33;
	text-align: center;
	border-radius: 90% 10% 90% 10% / 90% 10% 90% 10%;
	z-index: 999;
	position: absolute;
	top: 300px;
}

.PiloteEspaceTroqueur {
	position: absolute;
	top: 10px;
	left: 24px;
	height: 95%;
	overflow: hidden;
	background-image: url("../images/IA50/ia50_10.jfif");
	background-size: cover;
	/* Ajuste l’image pour couvrir la div sans déformation */
	background-position: center;
	/* Centre l’image dans la div */
	background-repeat: no-repeat;
	/* Empêche la répétition de l’image */
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	text-align: center;
}

.centered-principal {
	background-color: white;
	display: inline-block;
	/*
	background-image: url("../images/IA50/ia50.jfif");
	*/

	/*
	background-position: right 10px;
	background-size:100% 80%;
	*/
	height: 1128px;
	width: 230px;
	background-color: transparent;
	border-bottom-left-radius: 40px;
	background-size: cover;
	background-position: center 5px;
	background-repeat: no-repeat;

	/* Image de fond principale */
	/* linear-gradient(to right, rgba(52, 6, 234, 0.1) 0%, rgba(52, 6, 234, 0.1) 15%, rgba(225, 228, 35, 0.0) 15%),  /* Dégradé à gauche */
	/* Dégradé à gauch
	/* linear-gradient(to right, rgba(52, 6, 234, 0.1) 0%, rgba(52, 6, 234, 0.1) 15%, rgba(225, 228, 35, 0.0) 15%) */
	/* Force the background image to start after the gradient */
	/* background-position: left top, right 170px; */
	/* background-size: 100% auto, 85% 100%; */
	/* Empêche la répétition de l'image */
	/* background-repeat: no-repeat; */
	/* Propriétés supplémentaires pour éviter les chevauchements */
	/* background-origin: padding-box; */
	/* background-clip: border-box; */
}

#principal {
	position: absolute;
	top: 20px;
	left: 50%;
	transform: translateX(-50%);
	width: 1020px;
	height: auto;
	padding: 5px;
	background-color: white;
	border-radius: 20px;
}

.DivMap {
	border: 0px solid gray;
	width: 764px;
	padding-top: 20px;
	/* padding-top:20px; Mustapha 29.10.2024 */
	padding-bottom: 10px;
	/*margin-left:10px; */
	border-right: 0px solid #d6c07c;
	border-left: 0px solid #d6c07c;
	/*box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; */
	background-color: transparent;
}

#principal_scroll {
	position: absolute;
	top: 125px;
	left: 50%;
	transform: translateX(-50%);
	width: 1020px;
	padding: 5px;
	background-color: white;
	border-bottom-right-radius: 20px;
	border-bottom-left-radius: 20px;
	padding-top: 0px;
	/* 29.10.2024 - Mustapha
	
	overflow-y: hidden;
	height: calc(100vh - 60px);
	*/
	scrollbar-width: thin;
	scrollbar-color: #c8c2c2 rgba(255, 255, 255, 0.5);

	/*scrollbar-width: thin;*/
	/* Définir la largeur de la barre de défilement */
	/*scrollbar-color: transparent white;*/
	/* Définir la couleur de la barre de défilement */
	scrollbar-gutter: stable;
	box-shadow: -1px 30px 20px 10px #8a8987;
	height: 1330px;
}

#principal_scroll::-webkit-scrollbar {
	width: 1px;
	/* Largeur de la barre de défilement */
}

#principal_scroll::-webkit-scrollbar-thumb {
	background-color: white;
	/* Couleur de la barre de défilement (transparente) */
}

#principal_scroll:hover {
	/*overflow-y:auto; Mustapha 29.10.2024 /* Afficher la barre de défilement au survol de la souris */
}

.BandeauMaster {
	position: fixed;
	z-index: 99;
	/*top: 20px; */
	left: 50%;
	transform: translateX(-50%);
	width: 1020px;
	padding: 5px;
	background-color: white;
	height: 118px;
	border-top-right-radius: 20px;
	border-top-left-radius: 20px;
	overflow: hidden;
	margin-left: auto;
	margin-right: auto;
}

@keyframes clignotement {
	from {
		opacity: 0;
		/* Commence avec une opacité de 0 */
	}

	to {
		opacity: 1;
		/* Finit avec une opacité de 1 */
	}
}

@keyframes vaguedecouleur {
	0% {
		background-color: #f9dd0e;
		/* Couleur de départ */
	}

	50% {
		background-color: rgb(55, 212, 233);
		/* Couleur intermédiaire */
	}

	100% {
		background-color: #33339390;
		/* Couleur de retour */
	}
}

.BandeauMaster::after {
	content: '';
	position: absolute;
	margin-left: 0px;
	bottom: 0;
	left: 0;
	top: 122px;
	left: 50%;
	transform: translateX(-50%);
	width: 1020px;
	/* Largeur de la ligne d'ombre */
	height: 8px;
	/* Hauteur de la ligne d'ombre */
	/*background: linear-gradient(to top,#00aef1, #33339390); /* Dégradé pour créer l'ombre */
	background: linear-gradient(to top, #f9dd0e, #33339390);
	/* Dégradé pour créer l'ombre */
	/*background: linear-gradient(to top, transparent, rgba(0, 0, 0, 0.3)); /* Dégradé inversé pour créer l'ombre */
	opacity: 0;
	/*Masquer la ligne d'ombre par défaut */
	transition: opacity 0.7s;
	/* Transition douce pour l'opacité */
	border-bottom-left-radius: 40px;
	border-bottom-right-radius: 40px;
	/*animation: clignotement 1s infinite alternate; /* Animation de clignotement */
	/*animation: vaguedecouleur 2s infinite alternate; /* Animation de vas et viens */
}

.BandeauMaster.scrolling::after {
	opacity: 1;
	/* Afficher la ligne d'ombre lors du défilement */
}

/*
#principal {
	margin-top: auto;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	padding: 6px;
	background-color:white;
	border-radius: 20px;
	margin-top: 20px;
	width: 1020px;
	position: relative;
}
*/

/* ORIGINALE */
/*#principal {
  margin-top: auto;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  padding: 6px;
  background-color: white;
  border-radius: 20px;
  margin-top: 20px;
  width: 1020px;
  position: relative;
}*/

#idImagQrCodeDemo {
	text-align: right;
}

#idImagQrCodeVehicule {

	position: relative;
	float: left;
	left: 5px;
}

#idImagQrCodeDemo,
#idImagQrCodeVehicule {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	color: rgba(64, 64, 64, 0.769);
}

#IdContour {
	background-repeat: no-repeat;
	height: 28px;
	background-position-y: 20px;
}

/*
#principal {
  margin-top: auto;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  padding: 6px;
  background-color: white;
  border-radius: 20px;
  margin-top: 20px;
  width: 1020px;
  position: relative;
}
*/
.promo-add-ads {
	font-size: 1.8em;
	font-weight: 700;
	display: block;
}

.promo-banner {
	background: linear-gradient(135deg, #d4af37, #2c3e50);
	/* Dégradé du doré au bleu foncé */
	color: white;
	padding: 30px;
	border-radius: 12px;
	text-align: center;
	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
	/* Ombre plus marquée pour un effet 3D */
	margin-top: 20px;
	position: relative;
	width: 70%;
	margin-left: 50px;
}

.MoteurSelectSearchTrade {
	border: 0px solid brown;
	text-align: center;
	margin-left: 65px;
}

.promo-banner h2 {
	font-family: 'Montserrat', sans-serif;
	/* Une police plus moderne */
	font-size: 1em;
	font-weight: 700;
	margin: 0 0 20px 0;
	text-transform: uppercase;
	/* Style en majuscule pour renforcer l'impact */
	letter-spacing: 2px;
}

.promo-banner h2 span {
	color: #f1c40f;
	/* Accentuation dorée pour une partie du texte */
	font-style: italic;
}

.promo-banner .cta-button {
	background-color: #f1c40f;
	/* Bouton doré pour attirer l'œil */
	color: #2c3e50;
	/* Texte bleu foncé pour contraste */
	padding: 12px 24px;
	font-size: 1.2em;
	border-radius: 8px;
	text-transform: uppercase;
	font-weight: 600;
	text-decoration: none;
	transition: background-color 0.3s ease, transform 0.3s ease;
}

.promo-banner .cta-button:hover {
	background-color: #d4af37;
	/* Variation dorée plus foncée au survol */
	transform: translateY(-3px);
	/* Léger effet de soulèvement */
}

/* Mobile-friendly adjustments */
@media (max-width: 768px) {
	.promo-banner {
		padding: 20px;
	}

	.promo-banner h2 {
		font-size: 1.5em;
	}

	.promo-banner .cta-button {
		padding: 10px 20px;
		font-size: 1em;
	}
}

.highlighted-text {
	background-color: #f8f9fa;
	/* Une couleur légère pour contraster avec le fond */
	border: 2px solid #d4af37;
	/* Couleur dorée pour rappeler le luxe */
	border-radius: 8px;
	padding: 15px;
	margin-top: 10px;
	text-align: center;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	/* Légère ombre pour mettre en avant */
	width: 66%;
}

.highlighted-text h2 {
	color: #2c3e50;
	/* Texte foncé pour contraste */
	font-family: 'Arial', sans-serif;
	/* Police simple et lisible */
	font-size: 1.5em;
	font-weight: bold;
	margin: 0;
	letter-spacing: 1px;
	/* Espacement pour aérer le texte */
}

/* SEO Friendly - Mobile responsiveness */
@media (max-width: 768px) {
	.highlighted-text h2 {
		font-size: 1.2em;
	}
}

.goldSlogan,
.goldTitle,
.goldFicheRoyal {
	background: linear-gradient(#cfc09f 0%, #634f2c 10%, #cfc09f 40%, #ffecb3 50%, #3a2c0f 80%);
	background-clip: text;
	position: relative;
	display: flex;
	font-size: 25px;
	font-family: 'Georgia', serif;
	font-weight: bold;
	left: 20px;
	letter-spacing: 2.2px;
	color: #9595950d;
	overflow: visible;
	bottom: 0px;
	line-height: 30px;
	width: auto;
	background-color: white;
}

.goldSlogan {
	bottom: 3px;
}

.goldSlogan::before,
.goldTitle::before,
.goldFicheRoyal::before {
	content: attr(data-gold);
	left: 30px;
	top: 0;
	z-index: -1;
	position: absolute;
	text-shadow: -1px 0 1px #c6bb9f, 0 1px 1px #c6bb9f, 5px 5px 10px rgba(0, 0, 0, 0.4), -5px -5px 10px rgba(0, 0, 0, 0.4);
	letter-spacing: 2px;
}

.goldTitle {
	left: 0px;
	width: 160px;
	background: linear-gradient(#463612 0%, #634f2c 10%, #cfc09f 40%, #806b2c 50%, #3a2c0f 80%);
	background-clip: text;
}

.goldFicheRoyal {
	top: -6px;
	left: 0px;
	width: 600px;
	background: linear-gradient(#463612 0%, #baa682 10%, #cfc09f 40%, #806b2cb3 50%, #dcb25c 80%);
	background-clip: text;
	padding-top: 10px;
	padding-left: 30px;
	/*color:#0c0c3c;*/
}

/* Style spécifique pour les lettres L, T et R */
.ltr-sigle10,
.ltr-sigle11,
.ltr-sigle12 {
	/* L */
	color: #ffcc0040;
	/* Couleur bordeaux pour les lettres L, T, R */
	font-size: 25px;
	/* Augmentation de la taille pour les lettres */
	font-weight: bold;
	/* Gras pour les faire ressortir */
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
	/* Ombre légère pour un effet de relief */
}

.ltr-sigle10,
.ltr-sigle11 {
	text-transform: lowercase;
	/* Mettre en majuscule la première minuscule */
}

.ltr-sigle12 {
	text-transform: capitalize;
	/* Mettre en majuscule la première lettre */
}

/* Style spécifique pour ".com" */
.ltr-sigle13 {
	/* .com */
	color: white;
	font-size: 11px;
	vertical-align: middle;
	/* Centrage vertical de .com */
	padding-bottom: 6px;
	font-weight: normal;
	position: relative;
	top: -5px;
	letter-spacing: 0.120rem;
}

#IdImgLogoMarque {
	border-radius: 100%;
	border: 5px outset rgb(242, 181, 134);
	background-color: #bbb7b7a1;
	width: 70px;
	height: 60px;
	z-index: 99;
	position: relative;
	margin-top: 10px;
	margin-left: 10px;
}

#WebSite {
	width: 950px;
	border: 0px solid red;
	border-radius: 10px;
}

#SloganWebSite {
	width: 255px;
	height: 100%;
	vertical-align: middle;
}

#CssSloganWebSite {
	text-decoration: none;
	color: #f1d692;
	font-size: 14px;
	font-family: arial;
	font-weight: bold;
}

#SousWebSite {
	width: 1070px;
	/* Yaminael */
	/*background-color: white; */
	background-color: transparent;
}

#NagLogoSloganWebSite {
	height: 120px;
	width: 1040px;
	border: 0px solid orange;
	vertical-align: top;
}

/* 08-09-2024 */
#ContentPageRightWebSite_bisbis {
	vertical-align: top;
	width: 100%;
	text-align: left;
	padding-left: 1px;
	background-color: transparent;
	margin-left: 8px;
	padding-top: 2px;
}

#GrpCochePanier {
	border-radius: 20px;
	width: 100%;
	text-align: center;
	max-height: 860px;
}

#SousBlocRechercherAnnonces {
	overflow-y: auto;
	width: 720px;
	height: 580px;
	border-bottom: 0px dotted gray;
	border-top: 1px dotted gray;
}

#ContentPageRightWebSite {
	vertical-align: top;
	width: 100%;
	text-align: left;
	background-color: transparent;
	margin-left: 8px;
	/*
	width: 100%;
    height: 400px;
    overflow-y: scroll; 
	*/
}

#SearchFindWebSite {
	width: 100%;
	height: 895px;
	text-align: right;
	vertical-align: top;
	background-color: white;
}

/* 08-09-2024 */
#TablePrincipalWebSite_bisbis {
	height: 600px;
	width: 1010px;
	border-top: 0px solid white;
	border-bottom: 0px solid white;
	text-align: center;
	background-color: white;
	border: 0px solid red;
}

#TablePrincipalWebSite {
	height: 600px;
	width: 1028px;
	border-top: 0px solid white;
	border-bottom: 0px solid white;
	text-align: center;
	background-color: white;
	display: contents;
}

#BandeauHautLogoSlogan {
	width: 100%;
	height: 120px;
}

/* 14.09.2024 */
.EspaceCelluleTrocTopBordure {

	z-index: 999;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
	border: 4px solid rgba(184, 157, 20, 0.6);
	border-radius: 20px;
	height: 98px;
	width: 95px;
	transition: box-shadow 0.3s ease, transform 0.3s ease;
	font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
	background-color: #e4e4e0;
}

.EspaceCelluleTropTop {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
}

.EspaceCelluleTropTop:hover {
	font-style: italic;
}

.EspacePhotosTrocTopLibelle {
	font-size: 18px;
	font-weight: bold;
	color: #7b7736ed;
	text-align: center;
}

.EspacePhotosTrocTopNote {
	font-size: 12px;
	color: #9d9a9ac2;
	text-align: center;
	margin-top: 10px;
}

/************************************/

.EspacePhotosTrocTopNote_Old {
	font-size: 8px;
	font-family: Arial, Helvetica, sans-serif;
	color: rgba(30, 28, 28, 0.3);
	text-align: center;
	position: relative;
	border: 0px solid red;
	position: relative;
	bottom: 5px;
	z-index: 999;
	left: auto;
	text-align: left;
	padding-left: 10px;
}

.EspacePhotosTrocTopLibelle_Old {
	width: auto;
	border: 0px solid orange;
	color: #0b0b3b;
	font-weight: bold;
	font-family: Arial;
	font-size: 12px;
	padding-left: 5px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top: 20px;
}

.EspaceCelluleTrocTopBordure_Old {
	z-index: 999;
	box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.5);
	/*border:4px outset #1C6EA4; */
	border: 4px outset #b89d149d;
	border-radius: 10px 10px 10px 10px;
	height: 98px;
	width: 95px;
}

.EspaceCelluleTropTop_Old {
	color: black;
	background-color: rgba(208, 240, 192, 0.3);
	font-family: Arial;
	font-size: 10px;
	border: 02px solid #EEEEEE;
	text-align: center;
	border-radius: 100% 20% 100% 20% / 100% 20% 100% 20%;
	z-index: 0;
	height: 94px;
}

#TrocTopHaut {
	vertical-align: top;
	width: 100%;
	height: 50%;
	background-color: white;
}

.RaccordIdentifiant,
#RaccordIdentifiant {
	width: 20px;
	height: 100%;
	background-color: #0b0b3b;
	/* MAYSSANE */
	border-right: 4px solid #3497da;


}

.FooterHomePage {
	/* 29.10.2024 Mustapha : 125px */
	/*margin-top: 325px;*/
	color: #fff;
	padding: 10px;
	text-align: center;
}

.RubanDesignGauche,
#RubanDesignGauche {
	width: 20px;
	background-color: #0b0b3b;
	box-sizing: border-box;
	display: inline;
	position: absolute;
	/* Fixé pour que le ruban reste en place */
	z-index: 999999;
	/* 
	29.10.2024 Mustapha
	height: 100%;
	*/
	height: 830px;
	overflow: hidden;
	left: 5px;
	top: 300px;
	border-radius: 0 0 0 100%/50px;
	/* Mayssane */
	border-right: 4px solid #3497da;
	padding-left: 20px;
}


/* 08-09-2024 #idTxtTrocAnnonce */
#CelluleTexteDescriptionTrocAnnonce_bisbis {
	width: 100%;
	background-color: white;
	padding: 0px 0px 0;
	color: #330000;
	font-size: 16px;
	font-family: Arial;
	font-weight: bold;
	text-align: left;
	height: 100px;
	vertical-align: top;
	padding-bottom: 04px;
}

/*
#CelluleTexteDescriptionTrocAnnonce {
	width: 100%;
	background-color: white;
	padding: 0px 0px 0;
	color: #330000;
	font-size: 16px;
	font-family: Arial;
	font-weight: bold;
	text-align: left;
	height: 100px;
	vertical-align: top;
	padding-bottom: 04px;
}
*/
#CelluleTexteDescriptionTrocAnnonce {
	width: 100%;
	background-color: white;
	padding: 0px 0px 0;
	color: #330000;
	font-size: 16px;
	font-family: Arial;
	font-weight: bold;
	text-align: left;
	height: 100px;
	vertical-align: top;
	border-radius: 0 0 100px 0;
	border-bottom: 4px solid #3497da;
	/*box-shadow: 2px 10px 5px 0px #c4c4c385;*/
}

#TableBandeauHautLogoSlogan {
	width: 1040px;
}

#PanierOngletsWebSite {
	width: 780px;
	height: 80px;
	text-align: center;
	background-color: white;
	border: 0px solid aquamarine;
	vertical-align: bottom;
	margin-left: 30px;
}

#idBlocStickersVehicule {
	display: flex;
	align-items: top;
	float: right;
}

#idBlocStickersVehicule img {
	margin-right: 0px;
}

#idBorneMenu:hover {
	background-color: black;
}

#idBoutonInscription {
	color: #0B0B3B;
	font-size: 20px;
	color: orange;
	font-weight: bold;
	font-family: arial;
	height: 30px;
	cursor: url(images/hand.cur), pointer;
	border-radius: 10px;
	background-color: white;
}

#idBoutonInscription:hover {
	color: #cacfd2;
}

#idDivBoutonInscription {
	padding-top: 5px;
	padding-bottom: 5px;
	width: 100%;
	text-align: center;
	margin-top: 20px;
}

#idFicheProduitAnnonceEncadre {
	border-radius: 20px 20px 20px 20px;
	border-left: 1px solid #bf9b30;
	border-right: 1px solid #bf9b30;
	border-top: 4px solid #bf9b30;
	border-bottom: 4px solid #bf9b30;
	margin: 20px 0px 0px 25px;
	padding: 10px;
	box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}

#fotoperso {
	/*border: 2px solid #d6c07c;*/
	width: 70px;
	height: 60px;
	background-color: white;
	text-align: center;
	/*
	margin-right: 30px;
	margin-top: -13px;
	*/
	border-radius: 10px;
	/*background-image: url("../images/pivert_avatar.jpg");*/
	background-repeat: no-repeat;
	background-clip: content-box;
	background-size: 100%;
	background-position: left 60%;
	position: relative;
	float: right;
	z-index: 99;
	/*box-shadow: 4px 0px 6px rgba(0, 0, 0, 0.5);*/
	box-shadow: -4px -4px 10px rgba(0, 0, 0, 0.5);
	border-bottom: 3px solid #7b5c12;
	left: 706px;
	top: -26px;
	position: absolute;
}

.FooterAddress {
	padding-top: 10px;
	border-top: 1px dotted white;
	padding-left: 10px;
	text-align: left;
	color: #dcdcdc;
	font-family: Arial;
	font-size: 12px;
	font-style: normal;
}

#idTDPanier {
	vertical-align: top;
}


.arrondir {
	display: flex;
	justify-content: space-around;
	align-items: center;
	padding: 1px;
	width: 160px;
	border-bottom: 0px solid white;
	vertical-align: top;
	border-radius: 10px 10px 0px 0px;
	height: 36px;
	margin-top: 5px;
}


.arrondir.active span {
	font-weight: bold;
	color: white;
}

/* Ajustement du dégradé sur chaque bouton */
.arrondir:nth-child(1) {
	background: transparent;
	/*background: linear-gradient(to right, #0b0b3b, #1f3a60); /* Bleu très foncé vers un bleu un peu plus clair */
}

.arrondir:nth-child(2) {
	background: transparent;
	/*background: linear-gradient(to right, #1f3a60, #2979b1); /* Transition d'un bleu moyen vers un bleu plus clair */
}

.arrondir:nth-child(3) {
	background: transparent;
	/*background: linear-gradient(to right, #2979b1, #3498db); /* Bleu plus clair vers votre bleu final #3498db */
}


.Designe_Items {
	display: inline-flex;
	flex: 1;
	justify-content: end;
	align-items: center;
	height: 80px;
	width: 600px;
	position: absolute;

	left: 270px;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	vertical-align: baseline;
	background-color: transparent;
	gap: 5px;
	/* Ajout de l'espacement entre les items */

	/* ONGLETS EN INTERNE */
	z-index: 9;
	bottom: -20px;

	/* ONGLETS EN EXTERNE */
	/* bottom: 25px;	  */
	/* z-index:0; 		  */
}

.DesignMoteurRechercheTrocTop {

	height: 50px;
	border: 0px solid red;
	/*
	position: relative;
  	left: -110px;
	padding-left: 100px;
	*/
	margin-left: auto;
	margin-right: auto;
}

#CustomTdPanier_old {
	background-color: #0B0B3B;
	padding-top: 2px;
	position: absolute;
	float: left;
	margin-left: 432px;
	margin-right: auto;
	top: 115px;
	width: 110px;
	border-right: 1px solid white;
	border-left: 1px solid white;
	border-top: 1px solid white;
	vertical-align: bottom;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

#CocheTrocListe {
	width: 30px;
	height: 25px;
	background-color: #8383ab;
	/*border-right: 1px solid #EEEEEE;*/
	border-top: 1px solid black;
	border-bottom: 1px solid black;
	border-left: 1px solid black;
	text-align: center;
	padding-top: 4px;
	border-radius: 10px 0 0 10px;
	box-shadow: -4px -2px 3px rgba(0, 0, 0, 0.25);
}

#CustomTdPanier {
	top: 82px;
	position: absolute;
	/*
	position: fixed;
	top: 0px;
	*/
	float: left;
	margin-left: 55px;
	margin-right: auto;
	align-content: center;
	text-align: center;
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: white;
	padding-top: 2px;
	left: 671px;
	width: 120px;
	border-right: 1px solid white;
	border-left: 1px solid white;
	border-top: 1px solid white;
	vertical-align: bottom;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	height: 26px;
	z-index: 9999;


	/*box-shadow: 0px 10px 5px 3px #8a8987; */
	/* top: 94px; */
	/* left: 632px; */


	box-shadow: 0px -4px 3px 3px #6f778c;
	transform: rotate(180deg);
}

.PseudoMembre {
	width: 180px;
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	display: block;
	border-radius: 10px;
	border: 2px solid rgb(201, 185, 102);
	height: 30px;
	text-align: center;
}

.RecensementAnnonces {
	width: 100px;
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	border-radius: 10px;
	border: 2px solid rgb(201, 185, 102);
	height: 30px;
	text-align: center;
}

.iframe-container {
	position: relative;
	width: 100%;
	margin: 0;
	padding: 0;
	display: flex;
}

.iframe-container iframe {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 0;
	border: 02;
	margin: 0;
	padding: 0;
}

.DivPanierLibCount {
	transform: rotate(-180deg);
}

#idLienPanier {
	text-decoration: none;
	border: 0px solid #0B0B3B;
	color: #5cacee;
}

#idLienPanier:hover {
	text-decoration: underline;
	color: #f1d692;
}

#idLibPanier {
	/*color:#f1d692;*/
	color: #8383ab;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	font-weight: bolder;
	padding-right: 4px;
	border-radius: 3px;
	letter-spacing: 0.1em;
}

#idLibPanier:hover {
	text-decoration: underline;
	text-decoration-color: #274b72c7;
	text-decoration-line: underline;
	text-decoration-style: solid;
}

#idTrocPanier {
	padding-left: 3px;
	font-family: arial;
	color: #000066;
	font-size: 12px;
	font-weight: bold;
}

#CountPanier {
	font-family: arial;
	/*color:#f6f5f0; */
	/*color:rgb(191, 155, 48);*/
	color: rgb(16, 16, 20);
	font-size: 16px;
	font-weight: bolder;
	padding-right: 4px;
	padding-left: 0px;
}

#main_simple {
	background-color: transparent;
	display: inline-block;
	border: 0px solid white;
	vertical-align: top;
	width: 100%;
	height: 33px;
	margin-bottom: 10px;
}

#shadowbox1 {
	width: 608px;
	height: 30px;
	margin: 03px 00px 0px 0px;
	padding-left: 10px;
	float: left;
	background-color: rgba(17, 17, 115, 0.6);
	-moz-border-radius: 20px;
	-moz-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.2),
		0px 2px 2px 0px rgba(255, 255, 255, 0.5) inset;
	-webkit-border-radius: 20px;
	-webkit-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.5),
		0px 2px 2px 0px rgba(255, 255, 255, 0.5) inset;
	border-radius: 20px;
	box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.5),
		0px 2px 2px 0px rgba(255, 255, 255, 0.5) inset;
}

#shadowbox2 {
	position: relative;
	padding-left: 10px;
	width: 595px;
	height: 22px;
	margin: 8px 00px 00px 7px;
	background-color: rgb(245, 242, 242);
	text-align: center;
	-moz-border-radius: 20px;
	-moz-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.5) inset,
		0px 2px 2px 0px rgba(255, 255, 255, 0.5);
	-webkit-border-radius: 20px;
	-webkit-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.5) inset,
		0px 2px 2px 0px rgba(255, 255, 255, 0.5);
	border-radius: 20px;
	box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.5) inset,
		0px 2px 2px 0px rgba(255, 255, 255, 0.5);
	border-bottom: 1px solid gray;
}

#idTexteDefilant {
	position: absolute;
	top: 0px;
	font-size: 11px;
	border: 0px solid red;
	height: 24px;
	color: #134051;
	width: 100%;
	justify-content: center;
	align-items: center;
	display: flex;
	border-radius: 10px;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-weight: bolder;
}

#PubFinCalqueMozaicPortrait {
	width: 150px;
	height: 150px;
	text-align: center;
	cursor: pointer;
	border-top-right-radius: 10px;
	border-top-left-radius: 10px;
	border: 1px solid gray;
	background-color: #eeeeee;
	text-align: center;
	overflow: hidden;
}

#PubFinCalqueMozaicPaysage {
	width: 300px;
	height: 150px;
	cursor: pointer;
	border-top-right-radius: 10px;
	border-top-left-radius: 10px;
	border: 1px solid gray;
	background-color: #eeeeee;
	text-align: center;
	overflow: hidden;
}

#idBlocDrapeauPays {
	padding: 0px 0px 0px 0px;
	width: 130px;
	background-color: transparent;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 10px;
	height: 34px;
	display: contents;
}

#idBlocAccroche {
	/*background-image: url("../images/pivert_only_barre.jpg");*/
	/*background-position: right 0% bottom 2%;*/
	/*background-repeat: no-repeat;*/
	/*background-size:90%;*/
	width: 230px;
	vertical-align: top;
	text-align: left;
	background-color: white;
	/*border-left: 20px solid #0b0b3b;*/
	border-bottom-left-radius: 40px;
	/*overflow: hidden;  /* Empêche l'enfant de dépasser */
	/*padding-top:50px;*/

	/* 12.11.2024 */
	/*
  overflow: hidden;
  display: block;
  flex: content;
  padding-top: 0px;
  padding-bottom: 5px;
  top: 0px;
  */
	/*opacity:0;*/
}

/* 08-09-2024 */
#DescriptionTexteTrocTop_bisbis {
	padding-top: 15px;
	padding-bottom: 15px;
	font-size: 12px;
	color: rgba(10, 10, 180, 0.489);
	color: #5f5a5ac9;
	font-family: Arial, Helvetica, sans-serif;
	font-style: normal;
}

/*
#DescriptionTexteTrocTop {
	padding-bottom: 15px;
	font-size: 12px;
	color: rgba(10, 10, 180, 0.489);
	color: #5f5a5ac9;
	font-family: Arial, Helvetica, sans-serif;
	font-style: normal;
	height: 47px;
	border-bottom: 4px solid #ebebeb;
	border-radius: 0 0 20px 0;
}
*/
#DescriptionTexteTrocTop {
	padding-bottom: 15px;
	padding-top: 10px;
	font-size: 12px;
	color: rgba(10, 10, 180, 0.489);
	color: #5f5a5ac9;
	font-family: Arial, Helvetica, sans-serif;
	font-style: normal;
	height: 51px;
}


.H1DesignBandeauAccroche {

	font-size: 2.4em;
	font-family: \"Noto Sans JP\", sans-serif;
	font-weight: bold;
	/*background: linear-gradient(to right,  #3498db, #ffe275);	*/
	/* background: linear-gradient(to right, #a68617, #a18c48); */
	background: linear-gradient(to right, #a68617, #a18c48);

	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;

	width: 67%;
	margin-left: auto;
	margin-right: auto;
	letter-spacing: 0.189em;
	line-height: 40px;
	height: 80px;
	top: 55px;
	position: absolute;
}

.DesignBandeauAccroche {
	width: 530px;
	text-align: center;
	border-left: 4px solid #a68617;
	background-color: #eeeeeed2;
	border-right: 4px solid #a68617;
	border-radius: 20px;

	margin-left: auto;
	margin-right: auto;
	height: 100px;
	margin-top: -5px;
	/*	width: 629px;					*/
	/*	background-color:#d9d9d9c2; 	*/
	/*	border:0px solid #0B0B3B; 		*/
	/*	margin-top:35px; 				*/
	/*	margin-left: 60px; 				*/
}

/* Popup Container Styling */
.popupProp {
	position: fixed;
	bottom: 10px;
	left: 50%;
	transform: translateX(-50%);
	width: 90%;
	max-width: 400px;
	/* background: linear-gradient(135deg, #800000, #a00000);*/
	background: linear-gradient(to right,
			#0b0b3b 0%,
			#1f2b4d 25%,
			#2c3e50 50%,
			#2980b9 75%,
			#3498db 100%);
	border-radius: 10px;
	padding: 20px;
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
	color: #fff;
	text-align: center;
	animation: slideUp 0.5s ease-out;
	box-shadow: 0px 10px 5px 3px #8a8987;
	display: none;
	z-index: 99;
	margin-left: 120px;
}

/* Close Button Styling */
.close-btn {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 24px;
	height: 24px;
	background-color: transparent;
	border: none;
	cursor: pointer;
	border: 1px solid white;
	border-radius: 50%;
	padding: 10px;
}

.close-btn::before,
.close-btn::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 80%;
	height: 2px;
	background-color: #fff;
	transform-origin: center;
}

.close-btn::before {
	transform: translate(-50%, -50%) rotate(45deg);
}

.close-btn::after {
	transform: translate(-50%, -50%) rotate(-45deg);
}

.close-btn:hover::before,
.close-btn:hover::after {
	background-color: #ff0000;
}

/* CTA Button Styling */
.cta-btn {
	background-color: #0c0c3c;
	color: goldenrod;
	border: 2px outset white;
	padding: 12px 20px;
	border-radius: 5px;
	cursor: pointer;
	font-size: 16px;
	font-weight: bold;
	margin-top: 10px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	letter-spacing: 1px;
	text-shadow: -1px 0 1px #c6bb9f, 0 1px 1px #c6bb9f, 5px 5px 10px rgba(0, 0, 0, 0.4), -5px -5px 10px rgba(0, 0, 0, 0.4);
	color: #9595950d;
	border-radius: 14px;
}

.cta-btn:hover {
	transform: scale(1.05);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
}

/* Slide Up Animation */
@keyframes slideUp {
	from {
		opacity: 0;
		transform: translate(-50%, 100%);
	}

	to {
		opacity: 1;
		transform: translate(-50%, 0);
	}
}

/*
.popupProp {
	position: fixed;
    bottom: 0;
	width:100%;
	max-width:100%;
    background-color: #f1f1f1;
    border-top: 2px solid #b3b3b3;
    padding: 15px;
    display: none;
    text-align: center;
	box-shadow: 0px 10px 5px 3px #8a8987;
	color:#3396d7;
	z-index: 99;
	padding-left: 125px;
  }
  .popupProp button {
	background-color: #0b81bb;
	border-radius: 12px;
	box-shadow: rgb(33 33 31) -2px 7px 5px 1px, rgba(139, 0, 0, 0.4) 0 10px 30px inset;
    color: white;
    border: none;
    padding: 10px;
    cursor: pointer;
    margin: 5px;
	border-radius: 10px;
  }
  .popupProp button:hover {
    opacity: 0.9;
  }
  .popupProp .close-btn {
	position: relative;
  	top: -85px;
	left: 180px;
    right: 5px;
    width: 20px;
    height: 20px;
    background-color: #fff;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    outline: none;
  }
  .popupProp .close-btn::before,
  .popupProp .close-btn::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 60%;
    height: 2px;
    background-color: white;
    transform-origin: center;
	transition: background-color 0.3s ease;
	
  }
  .popupProp .close-btn::before {
    transform: translate(-50%, -50%) rotate(45deg);
  }
  .popupProp .close-btn::after {
    transform: translate(-50%, -50%) rotate(-45deg);
  }
  .popupProp .close-btn:hover::before,
  .popupProp .close-btn:hover::after {
    background-color: red;
  }
*/
.PositionSLoganLogo {
	position: absolute;
	left: 15px;
	top: 0px;
	height: 75px;
}

.new-banner {
	font-size: 14px;
	height: 20px;
	display: flex;
	width: 110px;
	position: absolute;
	left: -25px;
	background-color: rgba(19, 235, 19, 0.57);
	color: white;
	border-bottom: 0px solid rgb(81, 79, 79);
	padding-top: 4px;
	top: 10px;
	padding-left: 0px;
	transform: rotate(-40deg);
	justify-items: center;
	display: inline-grid;
	font-weight: bold;
	text-align: center;
	/*border-radius: 100% 50% 100% 0%; */
	/*background-image: linear-gradient(to bottom, #73ee73, #1f6f02); */
	/* Dégradé de vert */
	background-image: linear-gradient(to bottom, #f7bd49, #aa801e);
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
	/* Effet de texte bombé */
	box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5);
	/* Petite ombre sous le pied */
	z-index: 9;
}

.new-banner_old {
	font-size: 16px;
	height: 20px;
	display: flex;
	width: 105px;
	position: absolute;
	left: -35px;
	background-color: rgba(19, 235, 19, 0.57);
	color: white;
	border-bottom: 0px solid rgb(81, 79, 79);
	padding-top: 4px;
	top: 5px;
	padding-left: 3px;
	transform: rotate(-40deg);
	justify-items: center;
	display: inline-grid;
	font-weight: bold;
	text-align: center;
	/*border-radius: 100% 50% 100% 0%; */
	background-image: linear-gradient(to bottom, #73ee73, #1f6f02);
	/* Dégradé de vert */
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
	/* Effet de texte bombé */
	box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.5);
	/* Petite ombre sous le pied */
}

#ImpressionTexteTrocAnnonce {
	color: rgba(10, 10, 180, 0.938);
	background: #FFFFFF;
	text-shadow: 1px 0px 1px #CCCCCC, 0px 1px 1px #EEEEEE, 2px 1px 1px #CCCCCC, 1px 2px 1px #EEEEEE, 3px 2px 1px #CCCCCC, 2px 3px 1px #EEEEEE, 4px 3px 1px #CCCCCC, 3px 4px 1px #EEEEEE, 5px 4px 1px #CCCCCC, 4px 5px 1px #EEEEEE, 6px 5px 1px #CCCCCC, 5px 6px 1px #EEEEEE, 7px 6px 1px #CCCCCC;
	color: #0b0b3b;
	background: transparent;
	text-align: center;
	letter-spacing: 2px;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-size: 18px;
	padding-top: 0px;
	padding-bottom: 0px;
	position: fixed;
	z-index: 999;
	left: 55%;
	top: 0px;
	transform: translateX(-50%);
	width: 1020px;
}

/* 08-09-2024 */
#idTxtTrocAnnonce_bisbis {
	padding: 0px;
	color: #066F9A;
	border: 0px dotted black;
	font-size: 12px;
	font-family: sans-serif;
	font-weight: bold;
	text-justify: inter-word;
	text-justify: inter-character;
	text-align: justify;
	width: 100%;
}

/*	
#idTxtTrocAnnonce {
	padding: 0px;
	color: #066F9A;
	border: 0px dotted black;
	font-size: 12px;
	font-family: sans-serif;
	font-weight: bold;
	text-justify: inter-word;
	text-justify: inter-character;
	text-align: justify;
	width: 100%;
    background-color: #0b0b3b;
	border-radius: 0 15px 20px 0;
	margin-top: 3;
}
*/
.BgTrocRoyal {
	background: linear-gradient(to right, #0b0b3b, #3498db);
}

#idTxtTrocAnnonce {
	padding: 0px;
	color: #066F9A;
	border: 0px dotted black;
	font-size: 12px;
	font-family: sans-serif;
	font-weight: bold;
	text-justify: inter-word;
	text-justify: inter-character;
	text-align: justify;
	width: 790px;
	/* background-color: #0b0b3b;*/
	/* background: linear-gradient(to right, #0b0b3b, #066F9A); /* Remplacez #066F9A par la couleur de votre choix */
	/* => background: linear-gradient(to right, #0b0b3b, #3498db); /* Dégradé de #0b0b3b à #3498db */
	border-radius: 0 0px 100px 0;
	/*margin-top: 2;*/
	height: 190px;

	/* ---------------- */
	background-position: center 29%;
	background-size: cover;
	background-repeat: no-repeat;
	overflow: auto;
}

/* 08-09-2024 */
.PrepHomePageHaut {
	text-align: left;
	width: 100%;
	vertical-align: top;
	background-color: white;
	padding-left: 0px;
}

.PrepHomePageHaut_V2 {
	text-align: left;
	vertical-align: top;
	background-color: transparent;
	padding-left: 0px;
}

/* 08-08-2024 */
#CelluleTitreTrocTop_bisbis {
	vertical-align: middle;
	border-bottom: 0px solid #CCCCCC;
	height: 20px;
	color: #0b0b3b;
	font-size: 14px;
	font-family: verdana;
	font-weight: bold;
	background-color: white;
	padding-left: 0px;
	width: 130px;
	padding-bottom: 10px;
}

#CelluleTitreTrocTop {
	vertical-align: middle;
	border-bottom: 0px solid #CCCCCC;
	height: 20px;

	/* MAYSSANE : color: #b3ac45;*/
	color: #0c0c3b;
	/*#3498db;*/
	font-size: 1.2rem;
	font-family: verdana;
	font-weight: bold;
	background-color: transparent;
	padding-left: 0px;
	width: 130px;
	/* ClearHomePage
	padding-bottom: 10px;
	padding-top: 10px;
	*/
	display: block;
	padding-bottom: 15px;
	margin-top: 5px;
}

#DivTitreTrocTop {
	/* padding-bottom:5px;  ClearHomePage */
	/* border-bottom:4px solid #EEEEEE; ClearHomePage */
	margin-left: 70px;
	/* ClearHomePage */
	/*	
  width: 150px;
  background: #0c0c3b;
  border-radius: 10px;
  text-align: center;
  padding: 0em;
  display: block;
  margin-top: 5px;
  height: 32px;
  color: #f4d006c7;
  */
}

#CelluleTitreTrocAnnonce {

	/* MAYSSANE color: #b3ac45;*/
	color: #0c0c3b;
	/* #3498db;*/
	font-size: 1.2rem;
	font-family: verdana;
	font-weight: bold;
	display: contents;
	background-color: #0c0c3b;
}

#CelluleTitreTrocUp {
	vertical-align: middle;
	color: #0b0b3b;
	font-size: 14px;
	font-family: verdana;
	font-weight: bold;
	background-color: white;
	padding-left: 0px;
	width: 130px;
	/* border-bottom: 4px solid #EEEEEE; ClearHomePage */
}


#MsgNotFoundMoteurRechercheTrocTop {
	-webkit-box-shadow: 0px 20px 0px -10px #FFFFFF, 0px -20px 0px -10px #FFFFFF, 20px 0px 0px -10px #FFFFFF, -20px 0px 0px -10px #FFFFFF, 0px 0px 0px 10px #24609c, 5px 5px 15px 5px rgba(0, 0, 0, 0);
	box-shadow: 0px 20px 0px -10px #FFFFFF, 0px -20px 0px -10px #FFFFFF, 20px 0px 0px -10px #FFFFFF, -20px 0px 0px -10px #FFFFFF, 0px 0px 0px 10px #24609c, 5px 5px 15px 5px rgba(0, 0, 0, 0);
	background: #FFFFFF;
	width: 500px;
	height: 200px;
	padding-top: 60px;
	left: auto;
	position: relative;
	right: auto;
	float: right;
	margin-right: 125px;
}

#TableMoteurRechercheTrocTop {
	width: auto;
	clear: both;
	background-color: transparent;
	text-align: center;
	height: 30px;
	border-radius: 0px;
	margin-top: 25px;
}

#CelluleMoteurRechercheTrocTop {
	width: auto;
	padding-top: 8px;
	padding-bottom: 2px;
	text-align: center;
	vertical-align: bottom;
}

#CelluleImagesDefilanteTrocTop {
	width: 100%;
	height: 80px;
	padding-left: 4px;
	padding-top: 0px;
	padding-bottom: 4px;
	padding-right: 4px;
	border: 0px solid #CCCCCC;
	color: #330000;
	font-size: 14px;
	font-family: Arial;
	font-weight: bold;
	background-color: white;
	vertical-align: middle;
	text-align: center;
	padding-top: 10px;
}

.BlocHTMLSearch {
	width: 100%;
	display: flex;
}

.LocaliteHTMLSearch {
	width: auto;
	flex-shrink: 0;
	margin-right: 10px;
	width: 280px;
	height: 13px;
}

.LienPropHTMLSearch {
	flex-shrink: 0;
	margin-right: 37px;
	background-color: whitesmoke;
	border-radius: 5px 5px 0 0px;
	font-family: arial;
	text-align: center;
	font-size: 12px;
	float: right;
	color: #ffffff;
	background-color: #7d7da3;
	box-shadow: -7px 2px 3px rgba(0, 0, 0, 0.25);
	font-weight: bold;
	margin-top: 10px;
	/* Ajuste la position pour qu'il se chevauche avec le conteneur */
	margin-right: 135px;
	/* Ajustez selon vos préférences */

	padding-left: 4px;
	padding-right: 4px;
	padding-top: 1px;
	padding-bottom: 1px;
}

.LienPropHTMLSearchBadge {
	font-size: 0.8em;
	font-weight: bold;
	background-color: #ffba08;
	border-top: 0px solid rgba(73, 67, 67, 0.012);
	border-right: 0px solid rgba(73, 67, 67, 0.012);
	border-left: 0px solid rgba(73, 67, 67, 0.012);
	overflow: visible;
	/* Permet au badge de déborder */
	margin-left: 335px;
	/* Ajustez selon vos préférences */
	float: left;
	box-shadow: -7px 2px 3px rgba(0, 0, 0, 0.25);
}

.TrocRoyal-content {
	background-color: transparent;

}

.BandereauAnnonce {
	display: flex;
	flex-direction: column-reverse;
	/* Place le badge sous le contenu */
	background-color: transparent;
	padding-right: 5px;
	margin-bottom: -10px;
}

.AjoutTropTard {
	color: #FFFFFF;
	font-style: italic;
	font-weight: bold;
}

#ActionPanier {
	padding-left: 35px;
}


#IntituleTroc {
	height: 40px;
	width: 120px;
	text-align: center;
	background-color: white;
	font-size: 12px;
	color: #0B0B3B;
	font-family: verdana;
	font-size: 16px;
	font-weight: bold;
	border-radius: 6px;
}

.EngineSearchPropositionCalendar {
	padding-bottom: 20px;
	width: 100%;
	border: 0px solid red;
	text-align: center;
	color: #00006669;
	font-weight: bold;
	font-family: verdana;
	font-size: 12px;
}

#IdSelectMonthProposition {
	border-radius: 20px;
	text-align: center;
	font-family: verdana;
	font-size: 20px;
	color: #0b0b3b;
	font-weight: bolder;
	cursor: pointer;
	border: 2px solid rgb(201, 185, 102);
	height: 40px;
	width: 300px;
	text-align: center;
	background-color: #EEE;
	font-size: 0.8rem;
	background-image: linear-gradient(rgba(52, 6, 234, 0.1), rgba(225, 228, 35, 0.2));
	background-position: right 100% bottom 100%;
	background-repeat: no-repeat;
}

#myPriority {
	width: 100px;
	color: #330099;
	font-weight: bold;
	font-family: Arial;
	font-size: 11px;
}

#IdColorPriorite {
	box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
	border-right: 2px solid brown;
	color: white;
	margin-left: 150px;
	width: 400px;
	border-bottom: 4px solid brown;
	justify-content: center;
	align-items: center;
	margin-top: 0px;
	padding-top: 10px;
	padding-bottom: 20px;
	text-align: center;
	border-radius: 0 0 10px 10px;
	height: 10px;
	background-color: #C0C0C0;
}

#IdUrlRef {
	color: #007bff;
	text-decoration: none;
}

#IdUrlRef:hover {
	color: #ff5500;
	text-decoration: underline;
}

#maModal {
	display: none;
	position: fixed;
	z-index: 9999;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7);
	border-radius: 10px;
	overflow: hidden;
	padding: 0;
}

/* AUTRE 
#maModalOffreProposition {
	position: fixed;
	z-index: 9999;
	padding-left: 0%;
	padding-right: 20%;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
	overflow: hidden;
}
*/
/* NEW */
#contenuModalOffreProposition {
	left: auto;
	right: auto;
	background-color: transparent;
	margin: 23% auto;
	padding: 20px;
	width: 70%;
	max-width: 765px;
	height: 800px;
	border-radius: 10px;
	transform: translateY(-50%);
	z-index: 99999;
}

/* Style général pour tous les navigateurs */
#maModalOffreProposition {
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	position: fixed;
	z-index: 9999;
	padding-top: 0px;
	padding-bottom: auto;
	padding-left: 0%;
	padding-right: 20%;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7);
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
}

/* Style spécifique pour Safari */
@media all and (-webkit-min-device-pixel-ratio:0) and (min-resolution: .001dpcm) {
	@supports (-webkit-touch-callout: none) {
		#maModalOffreProposition {
			padding-top: 50%;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			position: fixed;
			z-index: 9999;
			padding-bottom: auto;
			padding-left: 0%;
			padding-right: 20%;
			width: 100%;
			height: 100%;
			background-color: rgba(0, 0, 0, 0.7);
			overflow: hidden;
			display: flex;
			justify-content: center;
			align-items: center;
		}
	}
}


/* OLD
#maModalOffreProposition {
    display: none;
	position: fixed;
	z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
	border-radius: 10px;
	overflow: hidden;
	padding: 0 ;
} 
#contenuModalOffreProposition {
	top:-80px;
	left:auto;
	right:auto;
	background-color:transparent;
    margin: 5% 30%;
    padding: 20px;
	width: 70%;
	height:70%;
	max-width: 765px;
	height: 800px;
    position: fixed;
	border-radius: 10px;
}
*/
#contenuModal {
	top: 0px;
	left: auto;
	right: auto;
	background-color: rgba(255, 255, 255, 0.5);
	margin: 5% 30%;
	padding: 20px;
	width: 70%;
	height: 70%;
	max-width: 600px;
	height: 600px;
	position: fixed;
	border: 2px solid rgba(35, 33, 33, 0.5);
	border-radius: 10px;
}

#contenuModal.contenuModalPOP {
	top: 0px;
	left: auto;
	right: auto;
	background-color: rgb(240, 240, 240);
	margin: 15% 30%;
	padding: 20px;
	width: 60%;
	height: 10%;
	max-width: 500px;
	position: fixed;
	border: 15px solid rgba(35, 33, 33, 0.5);
	border-radius: 10px;
	text-align: center;
	font-weight: bolder;
	padding-top: 60px;
}

#contenuModal.contenuModalPOPOffreProposition {
	top: 0px;
	left: auto;
	right: auto;
	background-color: rgb(240, 240, 240);
	margin: 15% 30%;
	padding: 20px;
	width: 60%;
	height: 10%;
	max-width: 500px;
	position: fixed;
	border: 15px solid rgba(35, 33, 33, 0.5);
	border-radius: 10px;
	text-align: center;
	font-weight: bolder;
	padding-top: 60px;
}

.fermerModal {
	position: absolute;
	top: 5px;
	right: 10px;
	cursor: pointer;
	font-size: 20px;
	color: #aaa;
}

.fermerModalOffreProposition {
	position: absolute;
	top: 5px;
	right: 10px;
	cursor: pointer;
	font-size: 20px;
	color: #aaa;
}

#close {
	color: red;
	font-size: 28px;
	font-weight: bold;
	cursor: pointer;
	margin: 5% 28.3%;
	z-index: 999;
	position: fixed;
	left: auto;
	right: 5px;
	top: 10px;
	float: right;
	height: 20px;
	width: 40px;
	border-radius: 4px;
	border: 1px solid white;
	background-color: red;
	color: white;
	justify-content: center;
	align-items: center;
	display: flex;
}

#CptMailPerdu,
#TitreTroc,
#EuroTroc,
#DescriptionTroc,
#RecevoirTroc,
#myframe1,
#myframe2,
#myframe3 {
	border-radius: 20px;
}


#IdMsgNewPwd,
#IdMsgForgetPwd {
	padding: 30 0 20 30;
	width: 550px;
	border: 0px solid red;
	color: #0B0B3B;
	font-family: Arial;
	font-size: 16px;
	font-weight: bold;
	padding-bottom: 20px;
}

#IdMsgForgetPwd {
	margin-left: 40px;
}

#IdTextNewPWD {
	vertical-align: middle;
	display: inline-block;
	min-width: 145px;
	max-width: 210px;

	padding-left: 5px;
	padding-right: 5px;
	padding-top: 10px;
	padding-bottom: 10px;
	border-radius: 10px;
	border: 2px ridge #EEEEEE;
	background-color: #e3f4dc;
	color: #120722;
	text-align: right;
	font-size: 13px;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-weight: bold;
}

#GrpCat,
#SelValGrp,
#ValCat,
#SelValMarque,
#idOptionsAucune {
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}

#IdAnnonce {
	padding-top: 20px;
	display: block;
	margin-left: 10px;
}

#IdPassePerdu {
	background-color: transparent;
	width: 800px;
	padding-top: 5px;
	display: block;
}

#IdAnnoncePerdu {
	background-color: transparent;
	width: 760px;
	padding-top: 5px;
	display: block;
}

#IdNum,
#IdNum_Soulte,
#IdNum_blanc,
#IdNum_2,
#IdNum_other,
#IdNum_blanc_Plus,
#IdNum_gris,
#IdNum_gris_Plus,
#IdNum_3,
#IdNum_4,
#IdNum_4_1,
#IdNum_Plus,
#blanc_photo,
#IdNum_blanc {
	text-align: center;
	font-weight: bold;
	vertical-align: top;
	background-color: #b3980d66;
	color: white;
	font-size: 14px;
	font-family: Arial;
	width: 40px;
}

#blanc_photo {
	text-align: center;
	font-weight: bold;
	color: rgb(209, 205, 205);
	font-size: 14px;
	font-family: Arial;
	width: 40px;
}

#IdNum_2 {
	height: 80px;
}

#IdPhoto1,
#IdPhoto2,
#IdPhoto3,
#IdSouhaite,
#IdEchange {
	font-weight: bold;
	color: #0B0B3B;
	font-size: 14px;
	font-family: Arial;
	text-align: left;
	width: 100%;
}

.TrocRoyalAnnonceur {
	overflow-y: auto;
	overflow-x: hidden;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	width: 100%;
	max-width: 780px;
	position: relative;
	height: 1065px;
}

#IdEchange {
	height: 25px;
}

#IdSouhaite,
#IdEchange {
	font-size: 18px;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-weight: bolder;
	padding-bottom: 4px;
}

#IdSouhaite {
	padding-top: 5px;
}

#IdExplicationPhoto3 {
	color: #0B0B3B;
	font-size: 12px;
	font-family: Arial;
	text-align: center;
	font-weight: normal;
	width: 500px;
	float: right;
	margin-right: 70px;
}

#FondTrocImg1,
#TrocImg2,
#TrocImg3 {
	height: 60px;
}

#IdNum_5_1,
#IdNum_5_2,
#IdNum_5_3,
#IdNum_5,
#IdNum_6 {
	text-align: center;
	font-weight: bold;
	background-color: #b3980d66;
	color: white;
	font-size: 14px;
	font-family: Arial;
	border-left: 1px dotted white;
	border-right: 1px dotted white;
	width: 34px;
}

#IdNum_6,
#blanc_photo {
	border-radius: 0px 0px 0px 15px;
}

#IdNum_5_2,
#IdNum_1 {
	border-radius: 15px 0px 0px 0px;
}

#IdNum_5_3 {
	border-top: 1px dotted white;


}

#IdNum_6 {
	border-bottom: 1px dotted white;
	border-top: 1px dotted white;
}

.BarreNavigation {
	background-color: transparent;
	width: 20%;
	vertical-align: top;
	text-align: center;
	height: auto;
	justify-content: center;
	align-items: center;
	display: block;
}

#conteneurTrocTag {
	position: relative;
	width: 120px;
	height: 70px;
	overflow: hidden;
}

#vignetteTrocTag {
	position: absolute;
	top: 30px;
	/* Position initiale de la vignette */
	transition: top 0.1s ease;
	/* Transition pour une animation douce */
}

#freePalestine {
	position: absolute;
	top: 00px;
	background-image: url("../images/palestine.png");
	border: 0px solid red;
	height: 69px;
	width: 400px;
	left: 140px;
	background-repeat: no-repeat;
	background-size: 10%;
	margin-left: 40px;
}

/* 08-09-2024 */
.BarreTrait_bisbis {
	border-left: 1.0mm groove rgba(255, 255, 255, 0.3);
	width: 100%;
}

.BarreTrait {
	width: 100%;
	vertical-align: top;
}

.annonceTrocList {
	width: 100%;
	display: flex;
	border: 3px solid #ccc;
	padding: 5px;
	margin: 5px;
	border-radius: 10px;
}

.ForeachTrocList {
	max-width: 650px;
	max-height: 200px;
	overflow-y: auto;
	overflow-x: auto;
	display: flex;
	flex-direction: row;
	/*
    align-items: flex-start;
    justify-content: center;
	*/
	width: 100%;
	/*max-width: 700px; /* Ajuster la taille si nécessaire */
	position: relative;
	height: auto;
	background-color: white;
	padding: 10px;
	border: 1px dotted gray;
	border-radius: 20px;
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
	margin-bottom: 10px;
}

/* 14.09.2024 */
.StoryTrocMagazine {
	max-height: 1100px;
	overflow-y: auto;
	overflow-x: hidden;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
	max-width: 700px;
	/* Ajuster la taille si nécessaire */
	position: relative;
	height: 1060px;
}

/* Conteneur Flexbox */
.story-container {
	overflow: visible;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
	max-width: 700px;
	/* Ajuster la taille si nécessaire */
	margin: 0px 0px 20px 0px;
	/* Espace entre les histoires */
	position: relative;
}

.EspaceDivHomePageHaut,
#EspaceDivHomePageHaut {
	margin-top: 5px;
	height: 195px;
	/* Limite la hauteur pour permettre le défilement */
	width: 790px;
	/*background-color: #0b0b3b;*/
	/*
	background: linear-gradient(to right, 
    #0b0b3b 0%, 
    #1f2b4d 25%, 
    #2c3e50 50%, 
    #2980b9 75%, 
    #3498db 100%);
	*/

	border-radius: 0 20px 20px 0;
	/*border-bottom:4px solid #3497da;*/
	border-radius: 0 15px 100px 0;

}

#RubanHomePageHaut {
	/*border-top:04px solid rgb(11, 11, 59);*/
	border-top: 04px solid transparent;
	border-radius: 10px 10px 0px 0px;
	/*background-color: #0B0B3B;*/
	/*background: linear-gradient(to right, #0b0b3b, #3498db);*/
	/*box-shadow: 0px 10px 5px 3px #8a8987;*/
	/*box-shadow: -1px 1px 9px 0px #8a8987;*/

	background: linear-gradient(to right,
			#0b0b3b 0%,
			#1f2b4d 25%,
			#2c3e50 50%,
			#2980b9 75%,
			#3498db 100%);

	color: #000066;
	height: 40px;
	position: relative;
}

.ViewProposition {
	box-shadow: 0px 10px 3px rgba(0, 0, 0, 0.25), inset 4px -1px 6px rgba(35, 33, 33, 0.5);
}

#FlagLanguageWebSite {
	width: 130px;
	display: initial;
	justify-content: center;
	align-items: center;
	float: right;
	vertical-align: middle;
	height: 40px;
	text-align: end;
	margin-top: 6px;
}

#RubanHomePageBas {
	/*border-radius: 10px 10px 0px 0px;*/
	/*background-color: #0B0B3B;*/
	background: linear-gradient(to right, #0b0b3b 0%, #1f2b4d 25%, #2c3e50 50%, #2980b9 75%, #3498db 100%);
	color: #000066;
	height: 100%;
	justify-content: center;
	align-items: center;
	display: flex;
	width: 980px;
	position: relative;
	z-index: 99;
	bottom: 5px;
	left: 5px;
	border-bottom: 2px dotted gray;
	margin-bottom: 80px;
}

.NoteTroc {
	font-style: normal;
}

.LocaliseConsulteAnnonce {
	color: gray;
	font-size: 12px;
	font-weight: bold;
	font-family: verdana;
}

.TitreConsulteAnnonce {
	width: 630px;
	/* color: #0b0b3b; */
	color: #cda42c;
	font-weight: bold;
	font-size: 18px;
	font-family: verdana;
	text-align: center;
}

.OngletFicheRoyal {
	z-index: 1;
	overflow: hidden;
	top: 0px;
	position: relative;
	/*
	background: linear-gradient(#463612 0%, #baa682 10%, #cfc09f 40%, #806b2cb3 50%, #dcb25c 80%);
	*/
	background-color: #fff;
	margin-left: 90px;
	border-radius: 20px 20px 0 0;
	border-top: 2px solid #d6c07c;
	/*
	border-right:2px solid #d6c07c;
	border-left:2px solid #d6c07c;
	*/
	width: 260px;
	padding-bottom: 5px;
	border-bottom: 2px solid #fff;
	text-align: center;
	height: 30px;
}

.TitreParentVueFicheAnnonce {
	padding-left: 7px;
	padding-top: 5px;

	font-family: arial;
	font-size: 10px;
	font-weight: bold;
	float: right;
	position: fixed;
	left: 550px;
	top: 10px;
	font-style: normal;
	color: #af9c46;
	letter-spacing: 0px;
}

#RechercheBoutton {
	font-family: verdana;
	font-weight: bold;
	height: 23px;
	width: 116px;
	color: black;
	background-color: #EEEEEE;
	cursor: pointer;
	font-size: 13px;
}

#ChoixCat,
#RechercherRubrique {
	text-align: auto;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	width: 200px;
	color: gray;
	font-size: 12px;
	background-color: white;
	font-weight: bold;
	border: 2px solid #858788;
	border-radius: 10px;
	height: 32px;
	box-shadow: 0px 10px 3px rgba(0, 0, 0, 0.25), inset 4px -1px 6px rgba(215, 210, 210, 0.5);
}

#IdInsertionPhoto1 {
	border-top: 1px solid #EEEEEE;
}

#IdNum_header_souhait,
#IdLibGrpCat2 {
	border-top: 2px solid rgba(44, 47, 44, 0.162);
}

#IdThemePage {
	color: #bf9b30;
	letter-spacing: 2px;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-size: 20px;
	margin-top: 5px;
	padding-bottom: 20px;
	font-weight: bold;
	text-align: left;
	width: 100%;
	padding-left: 5px;
	padding-top: 5px;
}

#IdAnnonceProposition {
	border-radius: 0px 20px 20px 20px;
	box-shadow: 6px 6px 25px rgba(0, 0, 0, 0.5);
	height: auto;
	width: auto;
	background-color: #d1b47545;
}

#chg_pwd,
#re_chg_pwd,
#CptMailPerdu {
	text-align: left;
	height: 40px;
	color: #5CACEE;
	font-family: arial;
	font-weight: bold;
	font-size: 20px;
	background-color: white;
	width: 280px;
	border: 2px inset gray;
	border-radius: 10px;
	margin-left: 5px;
}

#CptMailPerdu {
	height: 33px;
}

.FrameTrocAnnonce {
	box-shadow: 6px 6px 25px rgba(0, 0, 0, 0.5);
	height: 500px;
	width: 100%;
	background-image: linear-gradient(rgb(32, 45, 77), rgb(221, 184, 107));
	background-size: 10.5%;
	background-position: right 100% bottom 100%;
	background-repeat: no-repeat;
	position: relative;
	/* Nécessaire pour positionner le texte avec ::before */
	overflow: hidden;
	/* Empêche le texte de dépasser les limites */
}

.FrameTrocAnnonce::before {
	color: black;
	content: "P R O P O S I T I O N";
	position: absolute;
	top: 30px;
	left: 10px;
	/*transform: translate(-50%, -50%); /* Centre le texte */
	font-size: 3rem;
	/* Ajustez la taille selon vos préférences */
	font-weight: bold;
	color: rgba(255, 255, 255, 0.2);
	/* Texte semi-transparent */
	white-space: nowrap;
	text-transform: uppercase;
	letter-spacing: 0.2em;
	z-index: 9999;
	/* Assurez-vous que le texte est devant */
	pointer-events: none;
	/* Permet de cliquer à travers le texte */
	writing-mode: vertical-lr;
	text-orientation: mixed;
}

#SousBlocRechercherAnnonces {
	background-clip: padding-box;
}

.IdTrocPropose {
	transition: opacity 0.3s ease-in-out;
}

.IdTrocPropose.visited {
	opacity: 0.4;
}

.IdTrocAnnonce {
	box-shadow: 6px 6px 25px rgba(0, 0, 0, 0.5);
	border-radius: 20px;
	border: 3px solid #A9A9A9;
	z-index: 999;
	background-clip: padding-box;
	background-color: #FFF;
	transition: opacity 0.3s ease-in-out;
}

.IdTrocAnnonce.visited {
	opacity: 0.4;
}

#IdTbTrocAnnonce {
	z-index: 9;
}

.IdTopFiltreSearchPriority {
	border-top: 02px solid #bd8c02ca;
	height: 58px;
	padding-top: 0px;
	margin-left: 10px;
	width: 100%
}

#IdTopFiltreSearch {
	border: 0px solid black;
	/*
	box-shadow: 6px 6px 10px rgba(0, 0, 0, 0.5);
	padding-top:0px; 
	width:100%; 
	border:0px solid black; 
	text-align:right; 
	background-color:#d5f5e3; 
	border-radius:0px 0px 10px 10px; 
	border-right:2px dotted #cacfd2; 
	border-left:2px dotted #cacfd2;
	border-bottom:2px dotted #cacfd2 ;
	margin-left:8px;
	*/
}

.GrpFormDepotAds {
	box-shadow: -8px 0 10px -5px rgba(0, 0, 0, 0.5);
    border-radius: 20px;
}
#GrpForm_2,
#GrpForm_1,
#BodyNewPassePerdu,
#BodyForgetPassePerdu {
	background-image: linear-gradient(rgb(184, 158, 20), rgb(11, 11, 59));
	/*linear-gradient(rgba(58, 241, 92, 0.2), rgba(225, 228, 35, 0.2)) */
	/*,url("../images/pivert_inverse_only_barre.jpg")*/
	;
	background-position: right 0% bottom 77%;
	background-repeat: no-repeat;
	border-radius: 20px;
	width: 780px;
	background-size: 120px;
	box-shadow: 6px 4px 10px rgba(0, 0, 0, 0.5);
}

#GrpForm_1,
#GrpForm_2 {
	margin-left: 25px;
	background-image: linear-gradient(rgba(52, 6, 234, 0.1), rgba(225, 228, 35, 0.2));
}

#BodyForgetPassePerdu {
	height: 200px;
	padding-top: 20px;
	width: 740px;
	margin-left: 20px;
}

#IdAllProposition,
#IdBlocRechercherAnnonce,
#IdBlocTrocTagAnnonce {
	background-image: linear-gradient(rgba(52, 6, 234, 0.1), rgba(225, 228, 35, 0.2));
	/*,url("../images/pivert_only_barre_miroir.jpg");*/
	background-position: right 100% bottom 100%;
	background-repeat: no-repeat;
	border-radius: 20px;
	width: 100%;
	padding-top: 20px;
	border-right: 1px inset #ccc;
	background-size: 10.50%;
	box-shadow: -8px 0 10px -5px rgba(0, 0, 0, 0.5);
	position: relative;
}

#IdBlocRechercherAnnonce {
	padding-top: 0px;
}

#IdAllProposition {
	padding-top: 20px;
	width: 740px;
	text-align: center;
	height: 750px;
	overflow: auto;
	scroll-margin: 20px;
	overflow-x: hidden;
}

/*centered-principal*/

#IdAllProposition_s {
	padding-top: 40px;
	width: 740px;
	text-align: center;
	height: auto;
	overflow: auto;

	/* Dégradé sur la bande à gauche + image de fond */
	background-image:
		linear-gradient(to right, rgba(52, 6, 234, 0.1) 0%, rgba(52, 6, 234, 0.1) 15%, rgba(225, 228, 35, 0.0) 15%),
		/* Dégradé à gauche */
		/* Dégradé à gauche */
		url("../images/IA50/ia50_13.jfif");
	/* Image de fond principale */
	/*linear-gradient(to right, rgba(52, 6, 234, 0.1) 0%, rgba(52, 6, 234, 0.1) 15%, rgba(225, 228, 35, 0.0) 15%) */
	/* Force the background image to start after the gradient */
	background-position: left top, right 170px;
	background-size: 100% auto, 85% 100%;
	/* Empêche la répétition de l'image */
	background-repeat: no-repeat;
	/* Propriétés supplémentaires pour éviter les chevauchements */
	background-origin: padding-box;
	background-clip: border-box;
}

#MaMarque {
	border: 0px solid red;
	width: 100px;
	margin-left: 40px;
	background-color: white;
	position: absolute;
	z-index: 99;
	margin-top: 0px;
	float: left;
	text-align: left;
	left: 40px;
	border-bottom-left-radius: 40px;
	border-bottom-right-radius: 40px;
	box-shadow: -6px 6px 5px 0px rgba(0, 0, 0, 0.2);
}

#IdBlocRechercherAnnonce {
	margin-left: 38px;
	width: 735px;
	height: 865px;

	/*
	margin-left:28px;
	width:745px;
	height:885px;
	*/
}

#IdBlocTrocTagAnnonce {
	margin-left: 28px;
	width: 745px;
}

#IdLibOption_ {
	border-top-right-radius: 20px;
}

.photo-container {
	overflow: hidden;
}

.Libelle-Notification-Revok,
.Espace-Notification-Revok {
	/*background-color: rgb(52, 53, 52);*/
	background-color: #a9934e;

}

.Libelle-Notification-Revok {
	text-align: left;
	padding: 5px 5px;
	font-size: 17px;
}

.Describe-Notification-Revok {
	text-align: left;
	background-color: rgb(52, 53, 52);
	height: 40px;
	border-top-right-radius: 20px;
	color: white;
	width: 300px;
	letter-spacing: 0.03em;
	padding-left: 5px;
	padding-left: 5px;
	background-color: transparent;
}

.Bulle-Notification-Revok {
	border: 1px solid white;
	background-color: #a4282b;
	border-radius: 100%;
	width: 30px;
	height: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-weight: bold;
}

.HeaderProposition {
	background-color: white;
	/* Bordeaux */
	color: white;
	padding: 9px;
	text-align: center;
	margin-bottom: 10px;
}

.H1Proposition {
	font-size: 1.5rem;
	margin-bottom: 1rem;
	color: rgb(11, 11, 59);
}

.PProposition {
	font-size: 0.8rem;
	color: #0b0b3b;
	font-family: verdana;
	width: 560px;
	border: 0px solid gray;
	margin: 10px auto;
	letter-spacing: 0.2px;
	text-align: justify;
}

.Espace-Notification-Revok {
	border-top-left-radius: 20px;
	font-weight: bold;
	font-family: verdana;
	font-size: 18px;
	color: rgba(255, 219, 0, 0.9);
	text-align: center;
	display: table-cell;
	vertical-align: top;
	padding: 5px;
	width: 0px;
	padding-top: 4px;
	border-radius: 0px 30px 0px 30px;
	padding-right: 4px;
	border: 5px solid #98823c;
	padding-left: 4px;
	height: auto;
}

.info-additionnelle {
	display: none;
	/* Masqué par défaut */
	background: #f9f9f9;
	border: 1px solid #ddd;
	padding: 10px;
	position: absolute;
	top: 0;
	/* Positionnez sous l'image */
	left: 0;
	width: 100%;
	z-index: 1;
	transition: max-height 0.5s ease-in-out;

	/* En test */
	opacity: 0;
	/* Masquer par défaut */
	transition: opacity 0.5s ease;
	/* Transition douce de 0.5s */
	height: auto;
	display: block;
	/* Garder le display block pour que l'opacité fonctionne */
	visibility: hidden;
	/* Masquer visuellement en plus de l'opacité */
}

.photo-produit {
	width: 100%;
	height: auto;
	display: block;
	cursor: zoom-in;
}

.photo-container:hover .info-additionnelle {
	display: block;
	/* Affiche les informations lors du survol */
}

.info-additionnelle.visible {
	opacity: 1;
	/* Afficher avec opacité à 1 */
	visibility: visible;
	/* Rendre visible avec la transition */
}

#ItemsChoixCat {
	font-family: verdana;
	width: 200px;
	color: white;
	font-size: 10px;
	background-color: #0b0b3b;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 8px;
	font-weight: bold;
}

.designRechercherRubrique {
	padding-left: 8px;
	background-color: transparent;
}

.designRechercherMotCles {
	text-align: center;
	padding-left: 4px;
	padding-right: 0px;
	background-color: transparent;
}

.designRechercherValider {
	padding-right: 4px;
	padding-left: 4px;
	padding-top: 0px;
	background-color: transparent;
}

#RechercherRubrique {
	background-color: #ffffff;
	/*#ffffff82;*/
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	width: 150px;
	color: #0c0d3c;
	font-size: 12px;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 8px;
	font-weight: normal;
	height: 30px;
}

#q,
#motcles {
	text-align: center;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-weight: normal;
	font-size: 12px;
	color: gray;
	background-color: white;
	height: 19px;
	border-radius: 10px;
	word-spacing: 0.2ch;
	height: 25px;
	width: 200px;
	border: 2px solid #858788;
	box-shadow: 0px 10px 3px rgba(0, 0, 0, 0.25), inset 4px -1px 6px rgba(215, 210, 210, 0.5);
	font-weight: bold;
}

#motcles {
	height: 30px;
	background-color: #fff;
	/*#ffffff82;*/
	color: #0c0d3c;
}

#button,
#ValidEmailTroc,
input[name="Etape"],
#VMail,
.DesignerBouttonVert {
	background-color: #858788;
	border: none;
	font-weight: bolder;
	border-radius: 10px;
	color: white;
	padding: 5px 12px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 14px;
	margin: 4px 2px;
	cursor: pointer;
	font-family: Arial, Helvetica, sans-serif;
	/*
	box-shadow: 0px 1px 3px rgba(0,0,0,0.25), inset 4px -1px 6px rgba(35, 33, 33, 0.5);
	*/
	width: 80px;
	box-shadow: 0px 10px 3px rgba(0, 0, 0, 0.25), inset 4px -1px 6px rgba(35, 33, 33, 0.5);
}

#ValidEmailTroc {
	width: 110px;
	margin: -10px 2px;
	left: -14;
	position: relative;
	float: left;
}

#VMail {
	width: 100px;
	height: 38px;
}

.DesignerBouttonVert {
	width: 80px;
	font-size: 12px;
}

#RechercheBoutton2,
#moteurRecherche,
#IdSoumission {
	background-color: rgb(187, 170, 81);
	border: none;
	font-weight: bolder;
	border-radius: 10px;
	color: white;
	padding: 5px 12px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 14px;
	margin: 4px 2px;
	cursor: pointer;
	font-family: Arial, Helvetica, sans-serif;
	box-shadow: 0px 10px 3px rgba(0, 0, 0, 0.25), inset 4px -1px 6px rgba(35, 33, 33, 0.5);
	width: 110px;
}

#Identification {
	background-color: #14c2df;
	border: none;
	font-weight: bolder;
	color: white;
	text-align: center;
	padding: 10px 5px;
	text-decoration: none;
	font-size: 14px;
	cursor: pointer;
	font-family: Arial, Helvetica, sans-serif;
	box-shadow: 0px 0px 3px rgba(217, 184, 54, 0.25), inset 4px -1px 6px rgba(162, 125, 16, 0.89);
	justify-content: center;
	align-items: center;
	display: flex;
	height: 70px;
	width: 70px;
	border-radius: 100%;
	z-index: 99999;
	position: fixed;
	top: 190px;
	left: 40px;
	display: inline-block;
	border: 5px inset gold;
	line-height: normal;
	letter-spacing: 1px;
}


#IdSoumission {
	width: 300px;
	height: 40px;
	left: auto;
	right: auto;
	margin-left: 200px;
	text-transform: uppercase;
	font-size: 20px;
}

#moteurRecherche,
#RechercheBoutton2 {
	width: 130px;
	height: 30px;
}

#BoxCompteIdentification {
	padding-top: 03px;
	text-align: center;
}

#BoxCompteIdentification_V2 {
	padding-top: 0px;
	text-align: center;
}

#AccesCompteIdentification_bis {
	border: 2px solid #050840;
	border-radius: 10% 10%;
	background-color: #9cd798;
}

#AccesCompteIdentification {
	background-color: #0B0B3B;
	width: 230px;
	border-radius: 10px 0 0 0;
	height: 300px;

}

#AccesCompteIdentification_V2 {
	background-color: transparent;
	width: 230px;
	border-radius: 10px 0 0 0;


}

.TdChampsValidation_Clear {
	vertical-align: bottom;
	height: 120px;
	padding-bottom: 0px;
	float: right;
	overflow: hidden;
}

/* 13.09.2024 */
.TdChampsValidation {
	vertical-align: bottom;
	height: auto;
	padding-bottom: 0px;
	float: right;
	overflow: hidden;
	background-color: #0b0b3b;
}


.TbAccesCptIdentication_bis {
	height: 130px;
	width: 161px;
	margin-left: 10px;
	border: 0px solid gray;
	background-color: transparent;
	vertical-align: top;
}

.TbAccesCptIdentication {
	height: 190px;
	width: 100%;
	border: 0px solid gray;
	background-color: transparent;
	vertical-align: top;
}

.EmailFormConnexion {
	background: white url('../images/username.png') no-repeat 2px 50%;
}

.PwdFormConnexion {
	background: white url('../images/password.png') no-repeat 2px 50%;
}

.EmailFormConnexion,
.PwdFormConnexion {
	border-radius: 10px;
	border-left: 2px solid rgba(255, 215, 0, 0.93);
	border-top: 2px solid rgba(255, 215, 0, 0.93);
	border-bottom: 2px solid rgba(255, 215, 0, 0.93);
	border-right: 2px solid rgba(255, 215, 0, 0.93);
	font-family: arial;
	font-size: 14px;
	color: #0b0b3b;
	font-weight: bold;
	width: 175px;
	height: 30px;
	padding-left: 30px;
	background-color: #ffffffb0;
}

.emailadresse {
	padding-left: 10px;
	padding-bottom: 10px;
	border-top: 0px solid white;
	border-right: 0px solid white;
	font-family: Arial;
	font-size: 10px;
	padding-top: 2px;
	padding-right: 4px;
	text-align: left;
	vertical-align: top;
}

.motdepasse {
	padding-left: 10px;
	border-right: 0px solid white;
	padding-right: 4px;
	padding-top: 2px;
	font-family: Arial;
	font-size: 10px;
	vertical-align: top;
	text-align: left;
}

.identification {
	border-left: 0px solid white;
	padding-top: 15;
	padding-left: 10px;
	font-family: Arial;
	font-size: 12px;
	color: white;
	font-weight: bold;
	text-align: left;
	height: 30px;
}

.ConnectAuto {
	padding-left: 10px;
	color: white;
	font-family: Arial;
	font-size: 12px;
	padding-top: 13px;
	padding-bottom: 10px;
	text-align: left;
	width: 100%;
	height: 0px;
}

#OperationFields {
	height: 30px;
	color: black;
	padding-top: 0px;
	padding-bottom: 0px;
	border-top-right-radius: 5px;
	padding-left: 0px;
	width: auto;
	text-align: left;
	font-weight: bold;
	font-size: 12px;
	font-family: verdana;
	border: 0px solid #0B0B3B;
	background-color: #101e5596;
	color: white;
}

#Identification_bug {
	background-color: #120722;
	color: white;
	height: 30px;
	width: 150px;
	cursor: hand;
	font-size: 20px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	cursor: pointer;
	border-radius: 30px;
}

#Membre_Troqueur {
	font-size: 12px;
	font-weight: bold;
	color: #b32222db;
}

.Etiquette_Priorites:hover {
	border-radius: 6px;
	border: 1px solid black;
}

.Etiquette_Priorites:first-letter {
	font-weight: bold;
}

#idlegende0 {
	border-radius: 6px;
	border: 1px solid black;
	background-color: #8a8987;
	float: right;
	height: 20px;
	width: 56px;
	padding-top: 2px;
	color: white;
	text-align: center;
	cursor: pointer;
	border: 1px solid white;
	font-family: arial;
	font-size: 12px;
}

#idlegende0:hover {
	background-color: #8a8987;
}

.CssPropositionInterneCache {
	display: none;
	float: left;
	visibility: hidden;
}

.CssPropositionInterneVisible {
	display: block;
	float: left;
	visibility: visible;
}

.CssPropositionInterne {
	border: 1px solid #CCCCCC;
}

.NavigationRecherche {
	padding-top: 1px;
	padding-left: 0px;
	font-size: 12px;
	color: #330000;
	font-family: Arial;
	font-weight: bold;
	background-color: white;
	border: 0px ridge white;
	height: 20px;
}

.NavigationCalque {
	padding-left: 0px;
	font-size: 12px;
	color: #330000;
	font-family: Arial;
	font-weight: bold;
	background-color: gray;
	border: 1px ridge white;
	height: 20px;
}

.NavigationDetail {
	padding-left: 0px;
	font-size: 12px;
	color: #330000;
	font-family: Arial;
	font-weight: bold;
	background-color: white;
	border: 1px ridge white;
	height: 20px;
}

.NavigationContre {
	padding-left: 0px;
	font-size: 12px;
	color: #330000;
	font-family: Arial;
	font-weight: bold;
	background-color: #EEEEEE;
	height: 20px;
}

.NavigationMonzaic {
	padding-left: 0px;
	font-size: 12px;
	color: #330000;
	font-family: Arial;
	font-weight: bold;
	background-color: white;
	height: 20px;
}

.TrocDescription {
	padding-top: 5px;
	padding-right: 10px;
	text-transform: lowercase;
	color: gray;
	font-family: arial;
	font-size: 14px;
	font-weight: bold;
	font-style: normal;
}

.TrocContre {
	padding-top: 5px;
	padding-bottom: 4px;
	height: 25px;
	padding-left: 130px;
	padding-right: 10px;
	text-decoration: none;
	color: gray;
	font-family: arial;
	font-size: 14px;
	font-weight: bold;
	text-align: left;
	font-style: normal;
}

.ChampsRecapSaisie {
	color: white;
	font-weight: bold;
	font-size: 14px;
	text-align: center;
	background-color: #000099;
	width: 130px;
	height: 20px;
	padding-top: 10px;
}

.CellRecapSelect {
	font-weight: bold;
	text-align: center;
	width: 126px;
	height: 40px;
	border: 4px solid white;
	background-color: #000099;
	color: #FFFFFF;
	font-size: 14px;
	font-family: Arial;
}

.CellNum {
	font-weight: bold;
	text-align: center;
	width: 16px;
	height: 30px;
	border: 4px solid white;
	background-color: #CCCCCC;
	color: #FFFFFF;
	font-size: 14px;
	font-family: Arial;
}

.NumOne {
	padding-top: 10px;
	font-weight: bold;
	text-align: center;
	width: 16px;
	height: 30px;
	border: 2px solid green;
	background-color: #CCCCCC;
	color: green;
	font-size: 14px;
	font-family: Arial;
}

.SuiviParcours {
	height: 30px;
	color: rgb(209, 205, 205);
	background-color: white;
	font-family: verdana;
	font-size: 16px;
	text-align: center;
	letter-spacing: 0.5px;
	azimuth: center;
	font-weight: bold;
	font-style: normal;
	vertical-align: bottom;
}

#TelephoneTroc,
#EmailTroc,
#PasswordTroc {
	border-radius: 20px;
	border: 1px inset gray;

}

#NomTroc {
	border-radius: 20px;
	border: 1px inset gray;
}

#idPays {
	border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;
	border-left: 1px inset gray;
	border-top: 1px inset gray;
	border-bottom: 1px inset gray;
}

#idRegion {
	border-top: 1px inset gray;
	border-bottom: 1px inset gray;
}

#idCodePostal {
	border-top-right-radius: 20px;
	border-bottom-right-radius: 20px;
	border-right: 1px inset gray;
	border-top: 1px inset gray;
	border-bottom: 1px inset gray;
}

.PhasesParcours {
	padding-top: 5px;
	text-align: center;
	/*
	border-right:4px inset  rgba(110, 236, 98, 0.7);
	border-left:4px inset  rgba(110, 236, 98, 0.7);
	border-top:4px inset  rgba(110, 236, 98, 0.7); 
	*/
	height: 26px;
	width: 140px;
	border-radius: 12px 12px 0 0;
	background-color: #e3f4dc;
}

.SuiviParcoursOk {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #120722;
	font-size: 16px;
	text-align: center;
	letter-spacing: 0.5px;
	azimuth: center;
	background-color: white;
	border-radius: 12px 12px 0 0;
}

#run_1 {
	background-color: #FFFFFF;
}

.CBouton {
	color: #FF0000;
	font-weight: bold;
	cursor: hand;
	font-size: 10px;
}

.COptions {
	width: 80px;
	height: 14px;
	color: #333333;
	background-color: #99CCFF;
	text-align: center;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
}

#CssMonPanier {
	text-decoration: underline;
}

#tet {
	cursor: move;
	background-color: black;
	font: 12px/18px "Comic Sans MS", "Times New Roman", Times, serif;
	color: white;
	padding: 0 20px 0 .5em;
}

#tet img {
	position: absolute;
	right: 0;
	top: 0;
	height: 14px;
	width: 16px;
	cursor: default;
	margin: 2px 1px 1px;
	border: 0
}

#CalqueJeSouhaite {
	border: 1px solid red;
}

#CalqueJePossede {
	border: 1px solid red;
}

input.IdNumTag {
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	khtlm-border-radius: 5px;
	border-color: orange;
}

img.ImgTrocTop {
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	khtlm-border-radius: 5px;
}

a.LogoLebonTroc_save {
	box-shadow: 2px 4px 5px 1px #8a8987;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

a.button_on {
	display: block;
	font-weight: bold;
	height: 32px;
	font-size: 20px;
	line-height: 20px;

	padding-top: 8px;
	margin-bottom: 0px;
	text-decoration: none;
	width: 160px;
	background-color: #0B0B3B;
	color: white;
	border-left: 1px solid gray;
	border-right: 1px solid gray;
	border-top: 1px solid white;

	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	border-radius: 10px 10px 0px 0px;
	-moz-border-radius: 10px 10px 0px 0px;
	-webkit-border-radius: 10px 10px 0px 0px;
	khtlm-border-radius: 5px 5px 0px 0px;
	/*box-shadow: 0px 10px 5px 3px #8a8987;*/
	cursor: default;
}

a:hover.button_on {
	color: white;
	text-decoration: overline;
	text-decoration: none;
	font-size: 22px;
}

a.button {
	display: block;
	font-weight: normal;
	height: 36px;
	font-size: 20px;
	line-height: 22px;
	padding-top: 5px;
	margin-bottom: 0px;
	text-decoration: none;
	width: 160px;
	background-color: #0B0B3B;
	color: white;
	/*
	border-left:1px solid gray;
	border-right:1px solid gray;
	border-top:1px solid gray;
	*/
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	border-radius: 10px 10px 0px 0px;
	-moz-border-radius: 10px 10px 0px 0px;
	-webkit-border-radius: 10px 10px 0px 0px;
	khtlm-border-radius: 5px 5px 0px 0px;
	box-shadow: 0px 10px 5px 3px #8a8987;
	margin-top: 10px;
	/*border: 4px solid #f0e5cc;*/
	/*border: 4px solid #c9b966;*/
	border: 2px solid white;

	/*letter-spacing: 0.03em;*/
	text-align: center;
}

a.button:hover {
	color: #0B0B3B;
	text-decoration: overline;
	text-decoration: none;
	font-size: 24px;
	font-family: Arial, Helvetica, sans-serif;
	/*font-weight: bolder;*/
}

a.cloud1 {
	font-family: Verdana;
	font-size: 24px;
	text-decoration: none;
	color: orange;
}

a.cloud1:hover {
	font-family: Verdana;
	font-size: 24px;
	text-decoration: underline;
	color: #330000;
}

a.cloud2 {
	font-family: Verdana;
	font-size: 16px;
	text-decoration: none;
	color: #5cacee;
}

a.cloud2:hover {
	font-family: Verdana;
	font-size: 16px;
	text-decoration: underline;
	color: #0B0B3B;
}

a.cloud3 {
	font-family: Verdana;
	font-size: 12px;
	text-decoration: none;
	color: gray;
}

a.cloud3:hover {
	font-family: Verdana;
	font-size: 12px;
	text-decoration: underline;
	color: black;
}


.proposition-action-button {
	background-color: #A4282B;
	/* Couleur bordeaux pour donner un effet luxe */
	color: white;
	padding: 10px 20px;
	/* Ajout d'espace interne pour élargir */
	/*border-radius: 5px;*/
	border-bottom-right-radius: 20px;
	border-bottom-left-radius: 20px;
	font-weight: bold;
	font-size: 14px;
	text-transform: uppercase;
	/* Pour plus de lisibilité */
	display: inline-block;
	width: 210px;
	/* auto : Ajuste automatiquement la taille au texte */
	/*box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Effet d'ombre pour donner de la profondeur */
	box-shadow: 0px 4px 4px 0px #333333;
	transition: background-color 0.3s ease;
	/* Transition douce pour un effet au survol */
	cursor: pointer;
	margin-top: 3px;
	margin-bottom: 10px;
}

.proposition-action-button:hover {
	background-color: #50b0e7;
	/* #7B2023; */
	/* Couleur légèrement plus foncée au survol */
	cursor: pointer;
	width: 210px;
	/* auto : Ajuste automatiquement la taille au texte */

}

.action-button {
	background: linear-gradient(135deg, #D4AF37 0%, #B8960F 100%);
	color: #0b0b3b;
	border: none;
	padding: 12px 28px;
	border-radius: 6px;
	font-weight: 600;
	cursor: pointer;
	margin-top: 16px;
	font-family: 'Montserrat', sans-serif;
	transition: all 0.3s ease;
}

.action-button:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(212, 175, 55, 0.4);
}

/*
.proposition-action-button {
    background-color: #800000;
    color: white;
    padding: 0.2rem 0.5rem;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
	width:200px;
	font-size: 16px;
}
.proposition-action-button:hover {
    background-color: #a52a2a;
}
*/
.DivPropGrpTrocRoyal {
	width: 100%;
	padding: 10px;
	border: 1px dotted gray;
	border-radius: 20px;
	background-color: white;
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
	max-width: 650px;
	flex-direction: row;
	height: 500px;
}

.proposition-card {
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	overflow: hidden;
	transition: transform 0.3s ease;
	width: 250px;
	height: auto;
}

.OuvrirPropositionModal {
	border: 1px solid gray;
	font-weight: bold;
	text-align: center;
	font-family: verdana;
	font-size: 16px;
	color: white;
	background-color: rgb(52, 53, 52);
	height: 100%;
	width: 100%;
	border-top-right-radius: 20px;
	cursor: hand;
	cursor: url(images/hand.cur), pointer;
	text-decoration: none;
}

.proposition-card:hover {
	transform: scale(1.05);
}

.TextePropRevoque {
	color: #0a6cd5;
	font-size: 40px;
}

.arrow-navRevok {

	z-index: 99;
	/* -- 12.11.2024 -- */
	position: fixed;
	opacity: 1;
	transition: opacity 0.3s;
	z-index: 99;
	padding: 0;
	border: 0px outset gray;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	width: 40px;
	height: 40px;
	border-radius: 8px;
	background: rgba(255, 255, 255, .75);
	padding: 5px;
}

.arrow-navRevok:hover {
	opacity: 0.8;
}

#scrollUpRevok {
	top: 450px;
	/* Position en haut */
	left: 90%;
	transform: translateX(-50%);
}

#scrollDownRevok {
	bottom: 300px;
	/* Position en bas */
	left: 90%;
	transform: translateX(-50%);
}

.fade-outRevok {
	opacity: 0;
	/* Opacité à zéro pour créer un effet de fondu */
}

.fade-inRevok {
	opacity: 1;
	/* Opacité à un pour revenir à la normale */
}

/* Applique une transition progressive de 1 seconde pour les changements d'image de fond */
#parentPropositionRevok {
	background-size: cover;
	background-position: center;
	transition: opacity 1s ease-in-out, background-image 1s ease-in-out;
	opacity: 1;
	/* Opacité initiale à 1 */
	overflow-x: hidden;
	background-position: center bottom 10%;
}

.BlocPropRevoque {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 165px;
	height: 45px;
	/*margin: 20px auto;*/
	margin-bottom: 20px;
	border: 01px dotted #a4a4ac;
	border-radius: 0px 10px 0px 10px;
	position: relative;
	left: 20px;
	/*top: 10px;*/
	color: #007bff;
	/*background-color: #007bff;*/
	/*background-color: white;*/
	background-color: #eae6fc;
	font-weight: bolder;
	text-align: center;
	padding-left: 0px;
	line-height: 20px;
	letter-spacing: 0.029rem;
	margin-bottom: 20px;
	font-size: 15px;
	padding-left: 5px;
}

.TextImgFlottant {
	filter: Alpha(opacity=50, finishopacity=0, style=2);
	opacity: 0.3;
}

#newAnnonce {
	position: absolute;
	float: left;
	margin-top: 4px;
	left: 15px;
	z-index: 99px;
	color: brown !important;
	font-weight: bold;
	font-size: 12px;
	font-family: Arial;
	font-style: italic;
}

#tabbed_box {
	margin: 0px 0px 0px 0px;
	width: auto;
	height: auto;
	border: 0px solid red;
}

.tabbed_box h3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 20px;
	color: #330000;
	letter-spacing: -1px;
	margin-bottom: 10px;
}

.tabbed_box small {
	color: #e3e9ec;
	font-weight: normal;
	font-size: 8px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	position: relative;
	top: 2px;
	left: 6px;
	letter-spacing: 0px;
	text-align: right;
}

.tabbed_area {
	border: 1px solid #494e52;
	background-color: #EEEEEE;
	padding: 8px;
}

ul.tabs {
	margin: 0px;
	padding: 0px;
}

ul.tabs li {
	list-style: none;
	display: inline;
}

ul.tabs li a {
	background-color: #464c54;
	color: white;
	padding: 8px 14px 8px 14px;
	text-decoration: none;
	font-size: 9px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	border-top: 1px solid #464c54;
}

ul.tabs li a:hover {
	background-color: #2f343a;
	border-color: #2f343a;
}

ul.tabs li a.active {
	background-color: #ffffff;
	color: #282e32;
	border: 1px solid #464c54;
	border-bottom: 1px solid #ffffff;
}

.content {
	background-color: #ffffff;
	padding: 10px;
	border: 1px solid #464c54;
}

#content_2,
#content_3 {
	display: none;
}

ul.tabs {
	margin: 0px;
	padding: 0px;
	margin-top: 5px;
	margin-bottom: 6px;
}

.content ul {
	margin: 0px;
	padding: 0px 20px 0px 20px;
}

.content ul li {
	list-style: none;
	border-bottom: 1px solid #d6dde0;
	padding-top: 15px;
	padding-bottom: 15px;
	font-size: 13px;
}

.content ul li a {
	text-decoration: none;
	color: #3e4346;
}

.content ul li a small {
	color: #8b959c;
	font-size: 9px;
	text-transform: uppercase;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	position: relative;
	left: 4px;
	top: 0px;
}

.content ul li:last-child {
	border-bottom: none;
}

ul.tabs li a {
	background-image: url(../images/tab_off.jpg);
	background-repeat: repeat-x;
	background-position: bottom;
}

ul.tabs li a.active {
	background-image: url(../images/tab_on.jpg);
	background-repeat: repeat-x;
	background-position: top;
}

.content {
	background-image: url(../images/content_bottom.jpg);
	background-repeat: repeat-x;
	background-position: bottom;
}

#boutonTroc {
	float: left;
	background-color: #F6F6F6;
}

#boutonTroc a {
	color: #FFFFFF;
	vertical-align: middle;
	text-align: center;
	text-decoration: none;
}

#boutonTroc a:hover {
	color: #FAEAC8;
	text-decoration: none;
}

#boutonTroc_gauche {
	background: url(../images/BT_gauche_gris.gif) no-repeat;
	width: 14px;
	height: 48px;
	float: left;
	display: block;
}

#boutonTroc_centre {
	background: url(../images/BT_centre_gris.gif) repeat-x;
	float: left;
	height: 48px;
	font: bold 14px Verdana, Arial, Helvetica, sans-serif;
	color: #ffffff;
	padding-top: 14px;
	display: block;
	text-align: center;
	text-decoration: none;
	width: 154px;
}

#boutonTroc_droite {
	background: url(../images/BT_droite_gris.gif) no-repeat;
	width: 16px;
	height: 48px;
	float: left;
	display: block;
}

.frame {
	border: 0px;
	padding: 0px;
	height: 682px;
}

input.bouton_recherche {
	border-width: 1px;
	border-color: #99FF33;
	cursor: hand;
	color: white;
	background-color: #00CC66;
	font-size: 12px;
	font-family: verdana;
	font-weight: bold;
	width: 136px;
	height: 18px;
	margin-left: 3px;
	margin-top: 1px;
	padding-bottom: 2px;
	border-style: outset;
	text-align: center;
}

.bouton_recherche {
	border-width: 1px;
	border-color: #99FF33;
	cursor: hand;
	color: white;
	background-color: #00CC66;
	font-size: 12px;
	font-family: verdana;
	font-weight: bold;
	width: 138px;
	height: 13px;
	margin-left: 3px;
	margin-top: 0px;
	padding-bottom: 2px;
	border-style: outset;
	text-align: center;
}

#MProposition {
	padding-bottom: 20px;
}

#HProposition {
	z-index: 0;
	top: 0px;
	margin: 0px;
	padding-top: 2px;
	padding-bottom: 4px;
	padding-right: 0px;
	width: 100%;
	height: 18px;
	background-color: #CCCCFF;
}

#HHProposition {
	height: 23px;
	bottom: 0px;
	margin: 0px;
	padding: 0;
	border-bottom: 1px solid white;
	background-color: #CCCCFF;
}

#BBProposition {
	height: 23px;
	z-index: 0;
	bottom: 0px;
	margin: 0px;
	padding: 0;
	width: 100%;
	background-color: #CCCCFF;
}

#BProposition {
	height: 23px;
	z-index: 0;
	bottom: 0px;
	margin: 0px;
	padding: 0;
	width: 100%;
	background-color: #CCCCFF;
}

#weak,
#medium {
	border-right: solid 1px #DEDEDE;
}

#sm {
	margin: 0px;
	padding: 0px;
	height: 14px;
	font-family: Tahoma, Arial, sans-serif;
	font-size: 9px;
}

#sm ul {
	border: 0px;
	margin: 0px;
	padding: 0px;
	list-style-type: none;
	text-align: center;
}

#sm ul li {
	display: block;
	float: left;
	text-align: center;
	padding: 0px 0px 0px 0px;
	margin: 0px;
	height: 14px;
}

.nrm {
	width: 60px;
	color: #adadad;
	text-align: center;
	padding: 2px;
	background-color: #F1F1F1;
	display: block;
	vertical-align: middle;
	font-size: 12px;
	height: 60px;
}

.red {
	width: 60px;
	color: #FFFFFF;
	text-align: center;
	padding: 2px;
	background-color: #FF6F6F;
	display: block;
	vertical-align: middle;
}

.yellow {
	width: 60px;
	color: #FFFFFF;
	text-align: center;
	padding: 2px;
	background-color: #FDB14D;
	display: block;
	vertical-align: middle;
}

.green {
	width: 60px;
	color: #FFFFFF;
	text-align: center;
	padding: 2px;
	background-color: #A0DA54;
	display: block;
	vertical-align: middle;
}

.hidden {
	display: none;
}

.error {
	display: block;
	padding-top: 10px;
	margin-left: 0px;
	color: #ff0000;
	text-align: left;
}

.message {
	display: block;
	margin-left: 0px;
	color: #00aa00;
	text-align: left;
}

.DragMoveCursor {
	cursor: move
}

.Trans {
	FONT-SIZE: small;
	FONT-FAMILY: sans-serif;
	background: transparent;
}

.Trans TD {
	FONT-SIZE: xx-small;
	FONT-FAMILY: sans-serif;
	filter: alpha(opacity=100);
	-moz-opacity: .50;
	opacity: .90;
}

#cont table {
	border-collapse: collapse;
}

#cont td {
	border: solid black 0px;
	height: 4px;
	vertical-align: middle;
	font-size: 10px;
	background-image: url(../images/blncs.png);
	background-position: left;
	background-repeat: repeat-x;
}

.AvantagesInternautes {
	padding-left: 0px;
	font-size: 11px;
	font-family: arial;
	padding-top: 05px;
	color: black;
	font-weight: bold;
}

/*.Deconnexion {	border-radius:10px; position:absolute; z-index:99999; top:5px; left:55px; width:120px; background-color:transparent; text-align:center; height:30px; border:0px solid rgb(11, 11, 59); }*/
.Deconnexion {
	position: absolute;
	z-index: 9999;
	top: 4px;
	left: 50px;
	width: 130px;
	text-align: center;
	background-color: #ffffff94;
	height: 36px;
	margin: 5px 0px 0px 0px;
	padding: 0px 2px 4px 2px;
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	box-shadow: 0px 10px 3px rgba(0, 0, 0, 0.25), inset 4px -1px 6px rgba(215, 210, 210, 0.5);
}

.Deconnexion a {
	text-decoration: none;
	font-weight: bolder;
	color: #0d0e3c;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-size: 12px;
}

.Deconnexion a::after {
	content: '';
	/* Nécessaire pour afficher le pseudo-élément */
	background-color: transparent;
	/* Couleur initiale */
	transition: background-color 0.3s;
	/* Ajoute une transition douce */
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: -1;
	/* Pour mettre le fond derrière le texte */
	border-radius: 10px;
}

.Deconnexion:hover {
	border: 0px solid red;
	/* Changer la couleur de la bordure au survol */
}

.Deconnexion a:hover::after {
	background-color: #808080a3;
	/* Couleur de fond au survol */
	border-radius: 10px;
}

.Deconnexion a:hover {
	color: white;
	/* Couleur du texte au survol */
}

.Style1 {
	font-size: 10px;
	color: #FF0000;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}

.Style3 {
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	color: #999999;
	font-weight: bold;
}

.Style5 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: normal;
	font-style: italic;
	margin-left: 10px;
}

.Style5O {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	font-style: italic;
	margin-left: 10px;
	color: #330000;
}

.Style8 {
	color: #009900;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 14px;
}

.style11 {
	color: #000099;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 14px;
}

.MonCompteExpress {
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	color: #330000;
	font-weight: bold;
	font-style: normal
}

#Identitee {
	font-size: 22px;
	color: #5cacee;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}

#pendule {
	position: relatif;
	top: 11px;
	left: 120px;
}

#reste_page {
	position: absolute;
	top: 50px;
	left: 10px;
}

.pendule {
	font-family: Arial;
	font-size: 10px;
	color: red;
	padding-left: 10px;
	font-weight: lighter;
	font-weight: bolder;
	text-decoration: none;
}

.donation {
	font-family: Arial;
	font-size: 12px;
	color: white;
	top: 11px;
	padding-left: 500px;
}

.barre_haut_musinael_ {
	background-color: #330000;
	height: 16px;
	border: 0px solid #330099;
}


.barre_bas_musinael {
	color: #FFFFFF;
	font-family: Arial;
	font-size: 10px;
	font-style: normal;
	font-weight: bold;
	height: 16px;
	text-decoration: none;
}

.ApparenceT {
	filter: alpha(opacity=10);
	height: 1px;
	-moz-opacity: 0.1;
	opacity: 0.1;
}

.ApparenceO {
	filter: alpha(opacity=100);
	height: 0px;
	-moz-opacity: 1;
	opacity: 1;
}


.CssTrocTitreLien {
	padding-top: 1px;
	height: 15px;
	text-align: left;
	padding-left: 2px;
	font-family: Arial;
	font-size: 10px;
	font-weight: bold;
	color: white;
	background-color: #330000
}

.CssTrocTitreMarque {
	height: 15px;
	text-align: left;
	padding-left: 7px;
	font-family: Arial;
	font-size: 10px;
	font-weight: bold;
	color: white;
	background-color: #330000
}

.CssTrocTitreEtat {
	height: 15px;
	text-align: left;
	padding-left: 2px;
	font-family: Arial;
	font-size: 10px;
	font-weight: bold;
	color: white;
	background-color: #330000
}

.CssTrocTitrePossession {
	height: 15px;
	text-align: left;
	padding-left: 2px;
	font-family: Arial;
	font-size: 10px;
	font-weight: bold;
	color: white;
	background-color: #330000
}

.CssTrocTitreGarantie {
	height: 15px;
	text-align: left;
	padding-left: 2px;
	font-family: Arial;
	font-size: 10px;
	font-weight: bold;
	color: white;
	background-color: #330000
}

.CssTrocTitreLien {
	height: 15px;
	text-align: left;
	padding-left: 7px;
	font-family: Arial;
	font-size: 10px;
	font-weight: bold;
	color: white;
	background-color: #330000;
	width: 90px;
}

.CssTrocTitreJustificatif {
	height: 15px;
	text-align: left;
	padding-left: 2px;
	font-family: Arial;
	font-size: 10px;
	font-weight: bold;
	color: white;
	background-color: #330000
}

.CssTrocTitreNote {
	padding-top: 1px;
	height: 15px;
	text-align: left;
	padding-left: 7px;
	font-family: Arial;
	font-size: 10px;
	font-weight: bold;
	color: white;
	background-color: #330000;
	width: 90px;
}

.CssTrocTexteTitre {
	height: 20px;
	font-family: Arial;
	text-align: right;
	padding-left: 2px;
	font-size: 12px;
	font-weight: bold;
	color: #330000;
	background-color: white;
	height: 20px;
}

.CssTrocTexteMarque {
	height: 20px;
	font-family: Arial;
	text-align: left;
	padding-left: 2px;
	font-size: 10px;
	font-weight: normal;
	color: #330000;
	background-color: white
}

.CssTrocTexteEtat {
	height: 20px;
	font-family: Arial;
	text-align: left;
	padding-left: 2px;
	font-size: 10px;
	font-weight: normal;
	color: #330000;
	background-color: white
}

.CssTrocTextePossession {
	height: 20px;
	font-family: Arial;
	text-align: left;
	padding-left: 2px;
	font-size: 10px;
	font-weight: normal;
	color: #330000;
	background-color: white
}

.CssTrocTexteGarantie {
	height: 20px;
	font-family: Arial;
	text-align: left;
	padding-left: 2px;
	font-size: 10px;
	font-weight: normal;
	color: #330000;
	background-color: white
}

.CssTrocTexteJustificatif {
	height: 20px;
	font-family: Arial;
	text-align: left;
	padding-left: 2px;
	font-size: 10px;
	font-weight: normal;
	color: #330000;
	background-color: white
}

.CssMenuTexteLien {
	height: 20px;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 2px;
	padding-left: 4px;
	width: auto;
	color: #FFFFFF;
	text-decoration: underline;
	font-family: arial;
	font-size: 10px;
}

a.CssMenuTexteLien {
	height: auto;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 2px;
	padding-left: 4px;
	width: auto;
	height: 14px;
	color: #FFFFFF;
	text-decoration: underline;
	font-family: arial;
	font-size: 12px;
	font-weight: bold;
}

a.CssMenuTexteLien:hover {
	width: 100%;
	height: 18px;
	border-bottom: 1px solid white;
	background-color: #330000;
	color: #FF0000;
	text-transform: capitalize;
	font-family: arial;
	font-size: 10px;
	font-style: italic
}

.TDCssMenuTexteLien {
	color: red
}

TD.TDCssMenuTexteLien {
	color: green
}

.CssMenuTexteLien1 {
	height: 14px;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 2px;
	padding-left: 4px;
	width: auto;
	color: #FFFFFF;
	text-decoration: underline;
	font-family: arial;
	font-size: 14px;
}

a.CssMenuTexteLien1 {
	height: 14px;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 2px;
	padding-left: 4px;
	width: auto;
	color: #FFFFFF;
	text-decoration: underline;
	font-family: arial;
	font-size: 14px;
}

a.CssMenuTexteLien1:hover {
	width: 100%;
	height: 14px;
	color: white;
	font-family: arial;
	font-size: 12px;
	font-style: normal;
	text-decoration: underline;
	background-image: url(../images/content_bottom.jpg);
	background-repeat: repeat-x;
	background-position: bottom;
	background-color: #e8e8e8;
}

.CssMenuTexteLien2 {
	height: 14px;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 2px;
	padding-left: 4px;
	width: auto;
	color: #FFFFFF;
	text-decoration: underline;
	font-family: arial;
	font-size: 14px;
}

a.CssMenuTexteLien2 {
	height: 14px;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 2px;
	padding-left: 4px;
	width: auto;
	color: #FFFFFF;
	text-decoration: underline;
	font-family: arial;
	font-size: 14px;
}

a.CssMenuTexteLien2:hover {
	width: 100%;
	height: 14px;
	color: white;
	font-family: arial;
	font-size: 14px;
	font-style: normal;
	text-decoration: underline;
}

.CssTrocTexteNote {
	font-family: Arial;
	text-align: left;
	padding-left: 2px;
	font-size: 10px;
	font-weight: normal;
	color: #330000;
	background-color: white
}

.DonationTitre {
	font-weight: bold;
	text-align: left;
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
}

.Titre {
	font-weight: bord;
	text-align: center;
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
}

.Paragraphe {
	text-align: left;
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
}

.Texte1 {
	text-align: left;
	color: white;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
}

.Texte2 {
	text-align: left;
	color: white;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
}

.Texte3 {
	text-align: left;
	color: white;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
}

.TEXTEGRAS_RECHERCHER {
	text-align: left;
	color: white;
	font-family: verdana, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
}

.FormConnexion {
	border-radius: 10px;
	border-left: 2px solid black;
	border-bottom: 2px solid #EEEEEE;
	border-right: 2px solid #E8E8E8;
	font-family: arial;
	font-size: 11px;
	height: 20px;
	width: 100px;
	padding-left: 2px;
	background-color: #FFFFFF;
	color: #333333;
	font-weight: bold;
}

a.lien_status_proposition:hover {
	color: brown;
	text-decoration: underline;
	font-weight: bold;
	font-style: normal;
}

.page_numerotation {
	text-decoration: none;
	cursor: hand;
	color: #0b0b3b;
	font-weight: bold;
	font-size: 12px;
	font-family: Arial;
}

a.page_numerotation:hover {
	color: #0b0b3b;
	text-decoration: underline;
	font-weight: bold;
	font-style: normal;
}

.lien_suivant_precedent {
	text-decoration: none;
	cursor: hand;
	color: #0b0b3b;
	font-weight: bold;
	font-size: 12px;
	font-family: Arial;
}

a.lien_suivant_precedent:hover {
	color: #0b0b3b;
	text-decoration: underline;
	font-weight: bold;
	font-style: normal;
}

.page_numerotation_en_cours {
	text-decoration: none;
	cursor: hand;
	color: #0b0b3b;
	font-weight: bold;
	font-size: 12px;
	font-family: Arial;
}

a.page_numerotation_en_cours:hover {
	color: #0b0b3b;
	text-decoration: underline;
	font-weight: bold;
	font-style: normal;
}

.style1 {
	font-size: large;
}

.style4 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #330000;
}

.style9 {
	font-size: 14px;
	font-weight: bold;
}

.style11 {
	font-size: 14px;
	font-weight: bold;
	color: red;
	font-family: arial;
}

.style12 {
	color: #330000
}

.style13 {
	color: #CCFFCC;
}

.style14 {
	font-size: large;
	color: #CCFFCC;
}

.tab_haut {
	border-top: 1px solid #330000;
	border-bottom: 1px solid #330000;
	height: 30px;
}

.droite_tab {
	border-top: none;
	border-right: 1px solid #330000;
	border-left: 1px solid #330000;
	height: 2px;
}

.angle_gauche_tab {
	border-top: 1px solid #330000;
	border-left: 1px solid #330000;
	height: 2px;
}

.angle_bas_gauche_tab {
	border-right: none #330000;
	border-bottom: 1px solid #330000;
	border-left: 1px solid #330000;
	height: 2px;
}

.angle_bas_droite_tab {
	border-right: 1px solid #330000;
	border-bottom: 1px solid #330000;
	height: 2px;
}

.angle_table_droite_haut {
	border-top: 1px solid #330000;
	border-right: 1px solid #330000;
	height: 2px;
}

#Historique {
	position: fixed;
	behavior: url(Javascript/ie-fixed.htc);
	top: 4px;
	left: 1028px;
	padding: 0px;
	background-color: black;
	color: white;
	width: 70px;
	height: 420px;
}

.Bouton_valider_inscription_bis {
	cursor: hand;
	background-color: #CCCCCC;
	color: #330099;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	border: 1px solid white
}

.Bouton_valider_inscription {
	height: 25px;
	width: 52px;
	cursor: hand;
	background-color: #999999;
	color: white;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	border: 1px solid #CCCCFF
}

.Inscription {
	text-align: center;
	height: 20px;
	border-bottom: 2px solid gray;
	border-top: 2px solid white;
	border-right: 2px solid white;
	border-left: 2px solid white;
	color: black;
	font-family: Arial;
	font-size: 12px;
	font-weight: bold;
}

.Lib_Inscription {
	font-family: Arial;
	font-size: 12px;
	font-weight: bold;
	color: #330000
}

.Gratuit_Inscription {
	font-family: Arial;
	font-size: 12px;
	color: #FF0000;
	font-weight: bold;
	background-color: #FFFFFF;
	padding: 10px 10px
}

.Select_Inscription {
	font-family: Arial;
	font-size: 10px;
	width: 218px;
	color: #333333
}

.Etat_Inscription {
	font-family: Arial;
	font-size: 10px;
	width: 106px;
	color: #333333
}

.Commentaire_Inscription {
	color: #333333;
	background: #FFFFFF;
	font-family: arial, verdana;
	border: 2px solid gray;
	width: 312px;
	height: 60px
}

.Select_Justificatif {
	font-family: Arial;
	font-size: 10px;
	width: auto;
	color: white;
	background-color: #330000;
}

.Add_image_paie {
	text-align: center;
	height: 210px;
	width: 210px;
	font-family: Arial;
	font-size: 12px;
}

.Add_lien_image_paie {
	text-decoration: none;
	cursor: hand;
	color: #FF0000;
	font-weight: bold;
	font-size: 14px
}

input.bouton {
	border: 1px outset #000066;
	font-weight: bold;
	cursor: pointer;
	font-family: Arial;
	font-size: 12px;
	font-weight: bold;
	padding-top: 8px;
}

input.bouton:hover {
	background-color: white;
	color: red;
	font-family: Arial;
	font-size: 12px;
	font-weight: bold;
}

input.bouton:active {
	border: 1px inset #000066;
	background-color: red;
	color: white;
	font-family: Arial;
	font-size: 12px;
	font-weight: bold;
}

.Troc_Echange_Top {
	cursor: hand;
	font-family: Arial;
	font-size: 12px;
	text-decoration: none;
	color: #FF0000;
}

.Troc_Contre_Top {
	cursor: hand;
	font-family: Arial;
	font-size: 12px;
	text-decoration: none;
	color: #FF0000;
}

.Troc_Annonce_Top {
	cursor: hand;
	font-family: Arial;
	font-size: 12px;
	text-decoration: none;
	color: #0033FF;
}

.lien_priorite {
	cursor: hand;
	text-decoration: none;
	color: #FF0000;
	font: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 14px;
}

td.Ident {
	color: #000000;
	background-color: #CCCCCC;
	padding-top: 0px;
	padding-left: 2px;
	padding-right: 2px;
}

#presentation1 {
	display: none;
}

#presentation2 {
	display: none;
}

#presentation3 {
	display: none;
}

#presentation4 {
	display: none;
}

#presentation5 {
	display: none;
}

#civilite {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	border: 1px solid #FFFFFF;
}

#nom {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	border: 1px solid #FFFFFF;
}

#prenom {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#adresse {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#adresse1 {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#naissance {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#cp {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#ville {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#pays {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#departement {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#region {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#mail {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#identifiant {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#password {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#conf_password {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#commentaire {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#news_annonces {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#NbEmail {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#agent {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

#portable {
	color: #330000;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

td.affiche_menu {
	color: #660033;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	border-color: #330000;
}

.Filtre_Ombre {
	filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=10, OffY=5, Color=gray, Positive=true);
}

td.decors_ligne_menu {
	font-weight: bold;
	color: #FFFFFF;
}

.decors_ligne_menu {
	font-weight: bold;
	color: #FFFFFF;
}

a.decors_lien_menu {
	font-family: Arial;
	font-size: 11px;
	color: #FFFFFF;
	text-decoration: none;
	font-weight: bold;
	margin-left: 4px;
}

a.decors_lien_menu:hover {
	color: #FF0000;
	font-style: italic;
	font-family: Arial;
	font-weight: bold;
	margin-left: 4px
}

.TR_Normal {
	background-color: #3399FF;
	color: #000000;
	margin-right: 2px;
}

.TR_Survol {
	background-color: #330000;
	font-style: italic;
	font-size: 10px;
	text-align: center;
	font-family: Arial
}

.TR_Clique {
	background-color: #FFCC00;
	color: #FF0000;
	margin-left: 4px;
}

.decors_lien_inscription {
	text-decoration: none;
	color: #0b0b3b;
	font-family: Arial;
	font-weight: bold;
	font-size: 20px;
	font-weight: bold;
	cursor: hand
}

/* =====================================================
   Boutons LeTrocRoyal : .btn-royal, icon, float
   Couleurs bordeaux / doré
   Isolé pour ne pas perturber le reste du site
   ===================================================== */

/* -------------------------------
   Bouton standard
--------------------------------- */
.btn-royal {
	/* variables locales au bouton */
	--royal-rose: #FF1AE6D6;
	--royal-rouge: #FF0000D5;
	--royal-bordeaux: #7B1E1E;
	--royal-bordeaux-dark: #5f1616;
	--royal-gold: #D4AF37;
	--royal-white: #ffffff;
	--royal-radius: 14px;
	--royal-padding-y: 0.48rem;
	--royal-padding-x: 1rem;
	--royal-shadow: 0 6px 18px rgba(123, 30, 30, 0.18);
	--royal-transition: 220ms cubic-bezier(.2, .9, .2, 1);

	display: inline-flex;
	align-items: center;
	justify-content: right;
	/*gap: .5rem;*/
	background: linear-gradient(135deg, #FFD700, var(--royal-bordeaux-dark));
	/*background: linear-gradient(135deg,var(--royal-rose) 40%, var(--royal-bordeaux-dark));*/
	color: var(--royal-white);
	font-weight: 600;
	font-family: inherit;
	text-decoration: none;
	padding: var(--royal-padding-y) var(--royal-padding-x);
	border-radius: var(--royal-radius);
	box-shadow: var(--royal-shadow);
	border: 1px solid rgba(212, 175, 55, 0.12);
	transition: transform var(--royal-transition), box-shadow var(--royal-transition), background var(--royal-transition);
	cursor: pointer;
	user-select: none;
	position: relative;
	line-height: 1;

	height: 10px;
	width: 100px;
	left: 60px;
	position: absolute;
	top: 16px;
}

/* Hover / Focus */
.btn-royal:hover,
.btn-royal:focus {
	transform: translateX(-3px) scale(1.1);
	box-shadow: 0 10px 30px rgba(123, 30, 30, 0.22), 0 2px 8px rgba(212, 175, 55, 0.08);
	outline: none;
}

/* Subtil effet doré au survol */
.btn-royal::after {
	content: "";
	position: absolute;
	pointer-events: none;
	inset: 0;
	border-radius: inherit;
	box-shadow: inset 0 -2px 40px rgba(212, 175, 55, 0);
	transition: box-shadow var(--royal-transition);
}

.btn-royal:hover::after,
.btn-royal:focus::after {
	box-shadow: inset 0 -6px 40px rgba(212, 175, 55, 0.12);
}

/* Accessibilité : focus visible */
.btn-royal:focus-visible {
	box-shadow: 0 0 0 4px rgba(212, 175, 55, 0.12), 0 8px 24px rgba(123, 30, 30, 0.2);
}

/* -------------------------------
   Variante mini rond icône
--------------------------------- */
.btn-royal--icon {
	width: 44px;
	height: 44px;
	padding: 0;
	justify-content: center;
	border-radius: 999px;
	font-size: 1.15rem;
	box-shadow: 0 6px 16px rgba(123, 30, 30, 0.20);
	display: inline-flex;
	align-items: center;
	/*background: linear-gradient(135deg, #FFD700, var(--royal-bordeaux-dark));*/
	/* background: linear-gradient(135deg,var(--royal-gold) 40%, var(--royal-bordeaux-dark));*/
	background: linear-gradient(135deg, var(--royal-rose) 40%, var(--royal-bordeaux-dark));
	transition: transform 220ms cubic-bezier(.2, .9, .2, 1), box-shadow 220ms;
}

.btn-royal--icon:hover {
	transform: translateY(-2px) scale(1.05);
	box-shadow: 0 8px 20px rgba(123, 30, 30, 0.25);
}

/* -------------------------------
   Variante flottante (mobile)
--------------------------------- */
.btn-royal--float {
	position: fixed;
	right: 18px;
	bottom: 18px;
	z-index: 9999;
	background: linear-gradient(135deg, #7B1E1E, #5f1616);
	color: #fff;
	padding: 0.6rem 1.1rem;
	font-size: 0.98rem;
	font-weight: 600;
	border-radius: 14px;
	box-shadow: 0 6px 18px rgba(123, 30, 30, 0.18);
	border: 1px solid rgba(212, 175, 55, 0.12);
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: transform 220ms cubic-bezier(.2, .9, .2, 1), box-shadow 220ms;
}

.btn-royal--float:hover {
	transform: translateY(-3px) scale(1.03);
	box-shadow: 0 10px 30px rgba(123, 30, 30, 0.22), 0 2px 8px rgba(212, 175, 55, 0.08);
}

/* -------------------------------
   Responsive
--------------------------------- */
@media (max-width: 420px) {
	.btn-royal {
		font-size: 0.95rem;
		padding: .45rem .85rem;
	}

	.btn-royal--float {
		right: 14px;
		bottom: 14px;
		padding: .5rem 1rem;
		font-size: 0.95rem;
	}
}

/* Icône couronne à gauche du texte */
.btn-royal__icon {
	display: inline-flex;
	align-items: center;
	margin-right: 0rem;
	/* espace entre icône et texte */
	font-size: 20px;
}

.btn-royal svg {
	display: block;
	vertical-align: middle;
	font-size: 20px;
	transition: transform 0.25s ease, filter 0.25s ease;
}

.decors_lien_recuperation {
	text-decoration: none;
	color: #0b0b3b;
	font-family: Arial;
	font-weight: bold;
	font-size: 12px;
	font-weight: bold;
	cursor: hand
}

a.decors_lien_rubrique {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	margin-left: 8px;
	text-decoration: none;
	color: #FFFFFF;
	font-size: 12px;
}

a.decors_lien_rubrique:hover {
	color: #E6E6E6;
}

.GrpLienInscriptionOublier {
	margin-bottom: 0px;
	margin-top: 0;
	border-radius: 0px;
	border-bottom-right-radius: 0px;
	border-bottom-left-radius: 0px;
	border-left: 0px solid black;
	border-top: 0px solid #717171;
	border-bottom: 0px solid #EEEEEE;
	border-right: 0px solid #E8E8E8;
	position: relative;
	float: left;
	top: 0;
	vertical-align: top;
	overflow: hidden;
	border-bottom-right-radius: 0px;
	border-bottom-left-radius: 0px;
	padding-top: 10px;
	padding-bottom: 19px;
}

.BoutonValidationIdentification_bis {
	padding-top: 5px;
	padding-bottom: 5px;
	border-top-right-radius: 0px;
	border-top-left-radius: 100%;
}

.BoutonValidationIdentification {
	padding-top: 45px;
	padding-bottom: 0px;
	border-top-right-radius: 0px;
	border-top-left-radius: 100%;
	/* 90% MAYSSANE 100% */
	position: relative;
	bottom: 0;
	right: 0;
	background-color: red;
}

/* MAYSSANE
.BoutonValidationIdentification_V2 {
	padding-top: 45px;
	padding-bottom: 0px;
	border-top-right-radius: 0px;
	border-top-left-radius: 90%;
	position: relative;
	bottom: 0;
	right: 0;
	background-color: red;
}
*/
.BoutonValidationIdentification_V2 {
	padding-top: 0px;
	padding-bottom: 0px;
	border-top-right-radius: 0px;
	border-top-left-radius: 100%;
	position: relative;
	bottom: 0;
	right: 0;
}

.BoutonValidationIdentification_bis,
.GrpLienInscriptionOublier_bis {
	width: 150px;
	background-color: #ffffffd2;
	text-align: center;
}

.BoutonValidationIdentification,
.GrpLienInscriptionOublier {
	width: 190px;
	background-color: #ffffff;
	text-align: center;
	height: 72px;
}

.BoutonValidationIdentification_V2,
#BoutonValidationIdentification_V2,
.GrpLienInscriptionOublier_V2 {
	/* MAYSSANE width: 210px; */
	width: 206px;
	/* 206px */
	background-color: white;
	text-align: center;
	height: 72px;

	/* Mayssane */
	border-left: 4px solid #3497da;
	border-width: 4px;
	margin-left: 0px;
}

.BoutonValidationIdentification {
	border-top: 4px solid #ebebeb;
}

.BoutonValidationIdentification_V2,
#BoutonValidationIdentification_V2 {
	border-top: 4px solid #3497da;
}

.GrpLienInscriptionOublier {
	border-bottom-left-radius: 0px;
}

.GrpLienInscriptionOublier_V2 {
	border-bottom-left-radius: 0px;
}

a.decors_lien_cat_motorisation {
	font-family: Arial;
	font-size: 15px;
	font-weight: bold;
	color: white;
	text-decoration: none;
	cursor: pointer;
}

td.cat_motorisation {
	background-color: #0000a0;
}

a.decors_lien_scat_motorisation {
	border: 1px solid #330099;
	font-family: Arial;
}

a.decors_lien_search_option_motorisation {
	cursor: pointer;
	color: #330099;
}

td.ligne_search_cat_vente {
	border: 100px solid #330099;
	font-family: Arial;
}

.scategorie {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #FFFF00;
	background-color: gray;
}

.categorie {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #FFFF00;
	background-color: gray;
}

table.table_bordure_cat {
	border: 1px solid #FFFF33;
	border-color: #9999CC;
}

table.decors_vente_auto {
	background-color: #CCCCCC;
	color: #000099;
}

.Win_commentaire {
	color: #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	background: gray 0px 0px;
	cursor: hand;
	font-size: 10px;
	font-style: normal;
	font-weight: normal;
	text-transform: uppercase;
	text-decoration: none;
	border: 2px ridge #99CCFF;
	text-align: center;
	white-space: normal;
	height: 4px;
	width: 120px;
	font-weight: bold;
}

.BullOption {
	padding-left: 2px;
	cursor: url(images/hand.cur), pointer;
	color: #333333;
}

.gOptionAuto,
.gOptionWatch {
	border-left: 1px solid transparent;
	border-top: 1px solid transparent;
	padding-left: 0px;
	background-color: transparent;
	height: 20px;
	padding-top: 2px;
	padding-bottom: 2px;
}

.Options_Tous {
	background-color: #FF0000 !important;
	border: 2px solid #FFFFFF;
}

.Options_selection {
	cursor: hand;
}

OnMouseOver.ChangeColorChoixImgOver {
	border: '2px' 'solid' '#B3CE56';
	padding: '0' '0' '0' '0';
	margin: '0' '0' '0' '0'
}

OnMouseOut.ChangeColorChoixImgOut {
	border: '0px' 'solid' 'transparent';
	padding: '0' '0' '0' '0';
	margin: '0' '0' '0' '0'
}

.PetitMemo {
	border: 2px ridge #99CCFF;
	font-family: Arial;
	font-size: 12px;
	color: #330099;
	background-color: #FFFFFF;
	width: 120;
	font-weight: bold;
}

.sModele {
	color: #FF0000;
}

.expandable {
	color: blue;
	cursor: help
}

.expanded {
	color: black;
	font-size: 12px;
	cursor: default
}

.collapsed {
	display: none
}

.titre_annonce_vente {
	height: 30px;
	font-family: Arial;
	font-size: 11px;
	color: #3300CC;
	font-weight: bold
}

.text_accroche {
	font-family: Arial;
	font-size: 11px;
	color: #330099
}

.text_euro {
	font-family: Arial;
	font-size: 12px;
	color: #330099;
	font-weight: bold
}

.text_presentation {
	width: 200px;
	font-family: Arial;
	font-size: 12px;
	color: #330099;
	text-transform: uppercase;
}

.etoile_rouge {
	color: #FF0000 !important;
	font-size: 14px;
	font-family: Arial, Helvetica, sans-serif;
	font-style: normal;
	font-weight: bold;
	font-stretch: extra-expanded;
	cursor: default
}

.Pack_formule {
	color: #330099;
	font-family: Arial, verdana;
	font-size: 10px;
}

.TextParution {
	color: #330099;
	font-family: Arial, verdana;
	font-size: 10px;
	width: 74px;
	text-align: center;
	border: 1px solid #D5D5D5
}

.BoutonPaiement {
	padding-top: 30px;
	padding-left: 20px;
}

.TextPersonnalisee {
	font-size: 10px;
	width: 74px;
	font-family: Arial, verdana;
	color: #330099;
	text-align: center;
}

.PrixTTC {
	border: 1px transparent #000000;
	font: Arial, Helvetica, sans-serif;
	font-size: 15px;
	color: #000066;
	width: 40px;
	font-weight: bold
}

.TEXTPrixTTC {
	font: Arial, Helvetica, sans-serif;
	font-size: 15px;
	color: #000066;
	text-transform: uppercase;
}

.GestionTitre {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #330099;
	font-weight: bold;
}

.GestionTableauAction {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	font-weight: bold;
	border-bottom: 0px solid #330099;
	border-left: 0px solid #330099;
	border-top: 0px solid #330099;
	cursor: hand;
	text-align: left;
}

.GestionTableauSansLien {
	color: white;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-decoration: none;
	font-weight: bold;
}

.GestionTableauAvecLien {
	color: #300;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	text-decoration: none;
	font-weight: bold;
	Cursor: hand;
}

.GestionTableauType {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	font-weight: bold;
	border-bottom: 0px solid #330099;
	border-top: 0px solid #330099;
	text-align: left;
}

.GestionTableauPhotos {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	font-weight: bold;
	border-bottom: 0px solid #330099;
	border-top: 0px solid #330099;
	text-align: left;
}

.GestionTableauTitres {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	font-weight: bold;
	border-bottom: 0px solid #330099;
	border-top: 0px solid #330099;
	height: 20px;
	text-align: left;
}

.GestionTableauPrix {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	font-weight: bold;
	border-bottom: 0px solid #330099;
	border-top: 0px solid #330099;
	text-align: left;
}

.GestionTableauStats {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	font-weight: bold;
	border-bottom: 0px solid #330099;
	border-top: 0px solid #330099;
	text-align: left;
}

.GestionTableauEtats {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	font-weight: bold;
	border-bottom: 0px solid #330099;
	border-top: 0px solid #330099;
	border-right: 0px solid #330099;
	text-align: left;
}

.GestionTableauBouton {
	width: 100px;
	color: #000000;
	background: #F2F4ED;
	font-family: arial, verdana;
	border: 1px solid #FF0000;
	font-size: 10px;
	top: 10px;
	height: 19px;
}

.GestionTableauTEXTESituation {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #330099;
	font-weight: bold;
	cursor: hand;
	text-transform: uppercase;
}

.GestionTableauTEXTEAnnonce {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #330099;
	font-weight: bold;
	cursor: hand;
	text-transform: uppercase;
	text-align: left;
}

.GestionTableauBord {
	border: 1px ridge #FF11AA;
}

.GestionSelectionSituation {
	border-radius: 10px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #660000;
	width: 90px;
	height: 25px;
	font-weight: bold;
}

.GestionLienStatistique {
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #330099;
	font-weight: bold;
	cursor: hand;
}

.GestionTableauTitresModifier {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #FFFFFF;
	font-weight: bold;
	border-bottom: 0px solid #330099;
	border: 1px solid #FFFFFF;
	text-align: center;
}

.titre_gestion_vente_modif {
	width: 239px;
	height: 10px;
	font-family: Arial;
	font-size: 10px;
	font-weight: bold;
	text-align: left;
}

.GestionTexteTitres {
	font-size: 12px;
	font-family: Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	font-weight: bolder;
	padding-left: 10px;
	font-style: normal;
	background-color: #0B0B3B;
}

.GestionTexteReferences {
	color: #FF0000;
	font-style: italic;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	background-color: rgb(232, 232, 232);
}

.GestionTableauTitresModifierBas {
	border: 1px solid #FFFFFF;
	color: #FF99FF;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9px;
	padding-left: 20px;
	margin-right: 18px;

}

.CategorieMultiple {
	color: #FF0000;
	text-transform: uppercase;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	width: 60px;
	background-color: #FFFFCC;
	text-align: center;
}

.Etoile_obligatoire {
	color: #FF0000;
	position: absolute;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
}

.Etoile_Text {
	color: red;
	margin-right: 518px;
	font-size: 10px;
	font-family: Arial, Helvetica, sans-serif;
	background-color: #FFFFFF
}

.Echg_Text {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #330099;
	font-weight: bold;
}

#corps {
	background-color: #efefef;
}

#profile-pic {
	max-width: 100%;
	height: 100%;
}

.profile-pic {
	width: 200px;
	max-height: 200px;
	display: inline-block;
}

.file-upload {
	display: none;
}

.circle_Old {
	border-radius: 100% !important;
	overflow: hidden;
	width: 78px;
	height: 78px;
	border: 2px solid rgba(255, 255, 255, 0.2);
}

.circle-2 {
	border-radius: 100% !important;
	overflow: hidden;
	width: 78px;
	height: 78px;
}

img {
	max-width: 100%;
}

.p-image_Old {
	position: absolute;
	top: 67px;
	left: 30px;
	color: #666666;
	transition: all .3s cubic-bezier(.175, .885, .32, 1.275);
}

.p-image-2 {
	position: relative;
	color: #666666;
	transition: all .3s cubic-bezier(.175, .885, .32, 1.275);
	display: flex;
	align-items: center;
	justify-content: center;
	left: 0px;
	top: -10px;
}

.p-image-2:hover {
	transition: all .3s cubic-bezier(.175, .885, .32, 1.275);
}

.upload-button {
	font-size: 1.2em;
}

.upload-button:hover {
	transition: all .3s cubic-bezier(.175, .885, .32, 1.275);
	color: #999;
	cursor: pointer;
}

#TexteEchange {
	position: relative;
	width: 180px;
	height: 70px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-left: 20px;
	z-index: 20;
	font-family: verdana;
	font-size: 12px;
	color: #080B3B;
	font-weight: normal;
}

#TexteSouhait {
	position: relative;
	width: 120px;
	height: 70px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-left: 20px;
	z-index: 20;
	color: #080B3B;
	font-family: verdana;
	font-weight: normal;
	font-size: 12px;
}

.FiligraneSouhait {
	position: absolute;
	top: 0;
	left: 0;

	height: 100%;
	opacity: 0.4;
	z-index: -1;
	box-sizing: border-box;
	overflow: hidden;
	display: flex;
	align-items: top;
	font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
	writing-mode: vertical-lr;
	text-orientation: mixed;
	justify-content: center;
	background-color: #463e3e;
	;
	color: white;
	width: 15px;
	text-align: center;
	vertical-align: middle;
	border-top: 1px solid white;
	border-bottom: 1px solid white;
	border-radius: 4px;
	letter-spacing: 0.05rem;

}

.FiligraneSouhait span {
	display: block;
	position: relative;
	z-index: 1;
}

.containerParagraphe {
	background-color: #f0f0f0;
	padding: 10px;
	height: auto;
}

#containerDescribe {
	width: 475px;
	max-height: 180px;
	overflow: hidden;
}

#containerDescribe p {
	margin: 0;
}

#elipsisButton {
	color: #89898a;
	font-weight: 600;
	cursor: pointer;
	font-size: 14px;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	display: inline-flex;
	overflow: hidden;
}

#MoreDescribe {
	color: #d6c07c;
	font-weight: bold;
}

#MoreDescribe:hover,
#MoreDescribe a:hover {
	text-decoration: underline;
	color: #bf9b30;
}

#modeText {
	font-size: 12px;
	font-weight: bolder;
	font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-bottom: 3px;
}

#switch {
	left: auto;
	top: 1px;
	position: relative;
	display: inline-block;
	width: 66px;
	height: 22px;
	z-index: 9999;
	margin-right: 2px;
	margin-bottom: 2px;
}

#switch input {
	opacity: 0;
	width: 0;
	height: 0;
}

.sliderLightNight {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	transition: .4s;

}

.sliderLightNight:before {
	position: absolute;
	content: "";
	height: 15px;
	width: 15px;
	opacity: 1;
	left: 2px;
	bottom: 4px;
	background-color: orange;
	transition: .4s;
	box-shadow: -2px 0 2px #0F056B, 0 0px 1px #0F056B;

}

input:checked+.sliderLightNight {
	background-color: var(--tertaire);
	box-shadow: 2px 0 3px white, 0 0px 3px white;
}

input:focus+.sliderLightNight {
	box-shadow: 0 0 1px var(--tertaire);
	box-shadow: 2px 0 3px white, 0 0px 3px white;

}

input:checked+.sliderLightNight:before {
	-webkit-transform: translateX(45px);
	-ms-transform: translateX(45px);
	transform: translateX(45px);
	background-color: #77B5FE;
	box-shadow: 2px 0 3px white, 0 0px 3px white;
}

.sliderLightNight.round {
	border-radius: 34px;

}

.sliderLightNight.round:before {
	border-radius: 50%;
}

body {
	/* --primaire : #f0f0f0;*/
	/* --primaire : #030424; */
	--primaire: #FFFFFF;

	--secondaire: rgb(39, 39, 39);
	--tertaire: rgb(248, 167, 17);
}

body.dark {
	--primaire: #2c2c2c;
	--secondaire: rgb(226, 226, 226);
	--tertaire: rgb(6, 80, 241);
}

body {
	font-family: sans-serif;
	background: var(--primaire);
	color: var(--secondaire);
	margin-bottom: 60px;
	/* Ajoute une marge inférieure pour éviter que le contenu soit masqué */
}

@media (prefers-color-scheme: dark) {
	body {
		--primaire: #2c2c2c;
		--secondaire: rgb(226, 226, 226);
		--tertaire: rgb(6, 80, 241);
	}

	body.light {
		/* --primaire : #f0f0f0;*/
		/* --primaire : #030424; */
		--primaire: #FFFFFF;
		--secondaire: rgb(39, 39, 39);
		--tertaire: rgb(248, 167, 17);
		margin-bottom: 60px;
		/* Ajoute une marge inférieure pour éviter que le contenu soit masqué */

	}
}

/* Assure que la page prend toute la hauteur de la fenêtre */
html,
body {
	height: 100%;
	margin: 0;
	padding: 0;
	left: auto;
	right: auto;
}

.content-Main {
	flex: 1;
	/*Permet au contenu de s'étendre pour remplir l'espace restant */
	padding: 30px;
	/* Ajuster le remplissage selon vos besoins */
}


/* Style pour le pied de page */
.footer-fixed {
	background-color: #0B0B3B;
	/* Couleur de fond (modifiez selon vos besoins) */
	color: #FFFFFF;
	/* Couleur du texte */
	padding: 10px 0;
	/* Espace interne */
	text-align: center;
	/* Centre le texte */
	font-family: Arial, sans-serif;
	/* Police */
	width: 100%;
	/* Prend toute la largeur de la page */
	z-index: 9999;
	margin-left: auto;
	margin-right: auto;
	margin-top: auto;
	/* Force le pied de page à se positionner au bas du conteneur */
	bottom: 0;
	/* Positionne le ruban en bas */
	left: 0;
	position: fixed;
	/* Garder le footer en bas de la page */

	transition: transform 0.1s ease;
	/* Animation de la disparition */
	transform: translateY(100%);
	/* Footer initialement caché */
}

.hidden {
	/* transform: translateY(100%); /* Cache le footer en le faisant sortir par le bas */
}


.footer-fixed.visible {
	transform: translateY(0);
	/* Affiche le footer */
}

.footer-fixed_bug {
	position: absolute;
	left: 0;
	width: 100%;
	background-color: #f1f1f1;
	/* Couleur de fond du pied de page */
	text-align: center;
	padding: 10px 0;
	box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1);
	/* Optionnel : Ombre pour effet visuel */
	z-index: 100;
	/* Pour s'assurer que le pied de page est au-dessus du contenu */
	margin-left: auto;
	margin-right: auto;

}

/* Le conteneur principal prend toute la hauteur et utilise flexbox */
.wrapper {
	/* min-height: 100%; /* Assure que la hauteur minimale est de 100% de la hauteur de la fenêtre */
	display: flex;
	/* Utilisation de Flexbox */
	flex-direction: column;
	/* Alignement en colonne */
	min-height: 138vh;
	/* Mustapha */
}



.container_RS {
	background: transparent;
	display: flex;
	flex-wrap: wrap;
	margin: auto;
	justify-content: space-around;
	position: absolute;
	left: 5px;
	top: 5px;
	z-index: 999;
	width: 50px;
}

.menu-deroulant {
	border: 0px solid yellow;
	opacity: 1;
	/* PAR DEFAUT RESTE AFFICHE */
	height: 0;
	transition: opacity 1s ease-in-out, height 1s ease-in-out, visibility 1s ease-in-out;
}

.menu-deroulant.visible {
	opacity: 1;
	height: auto;

}

.icone {
	background-size: 700px 30px;
	box-shadow: 2px 0 3px #d2d2d2, 0 0px 3px #d2d2d2;
	border-radius: 8px;
	background-image: url(../images/Network/sprite_rd3_blueNight_500x100_fond_invisible_shared_gray_X.png);
	height: 30px;
	width: 30px;
	margin: 3px;
	cursor: pointer;
	background-color: #d5bf7b;
}

.icone:hover {
	box-shadow: 2px 0 6px white, 0 0px 6px white;

}

.share .icone {
	background-position: 0 0;
	background-color: rgba(11, 11, 59, 0.8);
	height: 30px;
	width: 40px;
}

.share::before .icone {
	content: '';
	box-shadow: inset 0 0 20px 10px #d6c07c;
	height: 30px;
	width: 40px;
}

.facebook .icone {
	background-position: -75px 0;
}

.instagram .icone {
	background-position: -155px 0;
}

.twitter .icone {
	background-position: -626px 0;
}

.tiktok .icone {
	background-position: -317px 0;
}

.pinterest .icone {
	background-position: -397px 0;
}

.whatsapp .icone {
	background-position: -478px 0;
}

.youtube .icone {
	background-position: -558px 0;
}

.rs {
	/*min-width: 120px;*/
	margin: 0px;
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	border: 0px solid #dbdbdb;
	border-radius: 20px;
}

.button-33 {
	background-color: #c2fbd7;
	border-radius: 10px;
	box-shadow: rgba(0, 182, 254, .2) 0 -25px 18px -14px inset, rgba(0, 182, 254, .15) 0 1px 2px, rgba(0, 182, 254, .15) 0 2px 4px, rgba(0, 182, 254, .15) 0 4px 8px, rgba(0, 182, 254, .15) 0 8px 16px, rgba(0, 182, 254, .15) 0 16px 32px;
	color: red;
	cursor: pointer;
	display: inline-block;
	font-family: CerebriSans-Regular, -apple-system, system-ui, Roboto, sans-serif;
	padding: 4px 10px;
	text-align: right;
	text-decoration: none;
	transition: all 250ms;
	border: 0;
	font-size: 18px;
	font-weight: bolder;
	user-select: none;
	-webkit-user-select: none;
	touch-action: manipulation;
	width: auto;
}

.button-33:hover {
	color: #0b0b3b;
	box-shadow: rgba(44, 187, 99, .35) 0 -25px 18px -14px inset, rgba(44, 187, 99, .25) 0 1px 2px, rgba(44, 187, 99, .25) 0 2px 4px, rgba(44, 187, 99, .25) 0 4px 8px, rgba(44, 187, 99, .25) 0 8px 16px, rgba(44, 187, 99, .25) 0 16px 32px;
	opacity: 0.6;
}

.button-33:active {
	box-shadow: rgba(44, 04, 99, .55) 0 -5px 9px -6px inset, rgba(44, 04, 99, .35) 0 1px 2px, rgba(44, 04, 99, .35) 0 2px 4px, rgba(44, 04, 99, .35) 0 4px 8px, rgba(44, 04, 99, .35) 0 8px 16px, rgba(44, 04, 99, .35) 0 16px 32px;
	opacity: 0.7;
}

.button-33::before {
	background-image: url('../images/Bt_proposition.png');
	content: "";
	background-size: cover;
	width: 25px;
	height: 25px;
	display: inline-block;
	position: absolute;
}

.button-royal {
	background-color: #0b81bb;
	/* #bdb20a; Or*/
	/* #03a9f4; bleu glace*/
	/*#8B0000; Bordeaux */
	border-radius: 12px;
	box-shadow: rgb(33 33 31) -2px 7px 5px 1px, rgba(139, 0, 0, 0.4) 0 10px 30px inset;
	/* Ombres renforcées pour plus de profondeur */
	color: white;
	cursor: pointer;
	display: inline-block;
	font-family: 'Merriweather', serif;
	/* Police Merriweather pour un style royal */
	padding: 10px 20px;
	/* Padding modéré pour maintenir la taille */
	text-align: center;
	text-decoration: none;
	transition: all 300ms ease-in-out;
	border: none;
	font-size: 20px;
	/* Taille de police conservée */
	font-weight: 600;
	width: auto;
	user-select: none;
	-webkit-user-select: none;
	touch-action: manipulation;
	position: relative;
}

.button-royal:hover {
	background-color: #bdb20a;
	color: #fff;
	box-shadow: rgb(115, 115, 66) -2px 7px 5px 1px, rgba(0, 0, 0, 0.3) 0 10px 30px;
	transform: translateY(-2px);
}

.button-royal:active {
	transform: translateY(1px);
	/* Effet d'enfoncement au clic */
	box-shadow: rgba(0, 0, 0, 0.4) 0 4px 10px inset;
	/* Ombre interne active */
}






/*****************ANNONCEUR : VISITEURS - MEMBRES ****************************/
/* VERSION 1
.cta-section {
	display: flex;
	justify-content: space-around;
	background: linear-gradient(135deg, #f0f4f8, #d9e8f5);
	padding: 40px;
	border-radius: 15px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	margin: 20px auto;
	max-width: 1000px;
	flex-wrap: wrap;
  }
  
  .section-title {
	font-size: 2em;
	color: #00796b;
	margin-bottom: 15px;
	text-align: center;
  }
  
  .cta-list {
	list-style-type: none;
	padding: 0;
	font-size: 1.2em;
	color: #37474f;
	line-height: 1.6em;
  }
  
  .cta-list li {
	margin-bottom: 10px;
  }
  
  .visitor-section,
  .member-section {
	flex: 1;
	margin: 10px;
	padding: 20px;
	background-color: #ffffff;
	border-radius: 10px;
	box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
	text-align: left;
  }
  
  .cta-button {
	display: block;
	background-color: #00796b;
	color: white;
	padding: 15px 30px;
	font-size: 1.2em;
	border-radius: 25px;
	text-decoration: none;
	text-align: center;
	margin: 20px auto;
	max-width: 250px;
	box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
	transition: background-color 0.3s, transform 0.2s;
  }
  
  .cta-button:hover {
	background-color: #004d40;
	transform: translateY(-3px);
  }
  
  @media (max-width: 768px) {
	.cta-section {
	  flex-direction: column;
	}
	
	.section-title {
	  font-size: 1.8em;
	}
	
	.cta-list {
	  font-size: 1.1em;
	}
	
	.cta-button {
	  font-size: 1em;
	}
  }
*/
/* VERSION 2 
.cta-section {
	background: linear-gradient(135deg, #f0f4f8, #d9e8f5);
	padding: 20px;
	border-radius: 15px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	margin: 20px auto;
	width: 200px;
	text-align: center;
  }
  
  .section-title {
	font-size: 1.4em;
	color: #00796b;
	margin-bottom: 10px;
  }
  
  .cta-list {
	list-style-type: none;
	padding: 0;
	font-size: 0.9em;
	color: #37474f;
	line-height: 1.4em;
	margin-bottom: 15px;
	text-align: left; 
  }
  
  .cta-list li {
	margin-bottom: 8px;
  }
  
  .cta-button {
	background-color: #00796b;
	color: white;
	padding: 10px 20px;
	font-size: 1em;
	border-radius: 20px;
	text-decoration: none;
	display: inline-block;
	margin: 10px 0;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
	transition: background-color 0.3s, transform 0.2s;
  }
  
  .cta-button:hover {
	background-color: #004d40;
	transform: translateY(-2px);
  }
  */
/* VERSION 3 */
/*
.cta-section {
	background-color: #d3e5e8; 
	padding: 20px;
	border-radius: 15px;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	margin: 20px auto;
	width: 180px;
	text-align: center;
	border: 0px solid #0b0b3b; 
  }
  
  .cta-heading {
	font-size: 1.4em;
	color: #0b0b3b; 
	margin-bottom: 10px;
  }
  
  .cta-list {
	list-style-type: none;
	padding: 0;
	font-size: 0.9em;
	color: #0b0b3b; 
	line-height: 1.4em;
	margin-bottom: 15px;
	text-align: left;
  }
  
  .cta-list li {
	margin-bottom: 8px;
  }
  
  .cta-button {
	background-color: #d3c26e;
	color: #0b0b3b;
	padding: 10px 20px;
	font-size: 1em;
	border-radius: 20px;
	text-decoration: none;
	display: inline-block;
	margin: 10px 0;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
	transition: background-color 0.3s, transform 0.2s;
	border: 1px solid #0b0b3b;
  }
  
  .cta-button:hover {
	background-color: #0b0b3b; 
	color: #d3c26e; 
	transform: translateY(-2px);
  }
*/
#idBorneMenu {
	color: #7d7d7d;
}

.granite-text span {
	font-family: 'Georgia', serif;
	/* Choix d'une police qui fonctionne bien avec l'effet gravé */
	font-weight: bold;
	font-size: 16px;
	color: #2F4F4F;
	/* Couleur gris foncé pour le texte */
	text-shadow:
		1px 1px 0 #fff,
		/* Ombre blanche pour l'effet de profondeur */
		-1px -1px 0 #555,
		/* Ombre gris foncé pour l'effet de gravure */
		2px 2px 0 #fff,
		/* Double ombre pour plus de profondeur */
		-2px -2px 0 #555;
	/* Ombre supplémentaire pour la gravure */
}

.arrondir-granite {
	border-radius: 10px;
	/* Bordure arrondie */
	overflow: hidden;
	/* Pour s'assurer que le contenu suit les bords arrondis */
}

.button-granite {
	display: inline-block;
	padding: 5px 10px;
	text-decoration: none;
	background-color: #DCDCDC;
	/* Couleur de fond gris clair */
	transition: background-color 0.3s ease;
	/* Transition douce sur le hover */
}

.button-granite:hover {
	background-color: #b0b0b0;
	/* Changement de couleur au survol */
}

.EspaceTroqueur {
	height: 100px;
	width: 172px;
	background-color: #ffffff94;
}

.EncadreModerator {
	color: white;
	font-weight: bold;
	background-color: #d5d5d54d;
	text-align: center;
	font-family: verdana;
	font-size: 13px;
	height: 75px;
	border-radius: 0px;
	border-left: 0px solid #736f6d;
	border-right: 0px solid #736f6d;
	border-top: 0px solid #736f6d;
	border-bottom: 0px solid #736f6d;
	vertical-align: bottom;
	padding-top: 12px;

}

.cta-section {
	/* background-color:#d2d2d2; */
	background-color: #e6dfaaed;

	padding: 10px;
	border-radius: 0 15px 15px 0;
	/*box-shadow: 20px -20px 30px rgba(29, 13, 89, 0.1);*/
	box-shadow: 20px 10px 30px rgba(29, 13, 89, 0.1);
	/*margin: 20px auto;*/
	width: 180px;
	text-align: center;
	margin: 0 0 5px 0;
	/* Espace blanc de 10px entre les sections */
	/*border: 2px solid #0b0b3b; /* Bordure couleur nuit */
	border-left: 2px dotted gray;
	margin-left: 24px;
	/*margin-top: 8px;*/
}

.cta-heading {
	font-size: 1.4em;
	/*color: #496afd; Couleur nuit pour le titre */
	margin-bottom: 10px;
	text-shadow: 1px 0 2px #f9b200, 0 1px 1px #c6bb9f, 5px 5px 10px rgba(0, 0, 0, 0.4), -5px -5px 10px rgba(0, 0, 0, 0.4);
}

.cta-list {
	list-style-type: none;
	padding: 0;
	font-size: 0.9em;
	color: #0b0b3b;
	/* Couleur nuit pour le texte */
	line-height: 1.4em;
	margin-bottom: 15px;
	text-align: left;
	/* Alignement à gauche pour une meilleure lisibilité */
}

.cta-list li {
	margin-bottom: 8px;
	color: #0b0b3b;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-size: 12px;
	font-weight: bold;
}

.cta-button {
	background-color: #d3c26e;
	/* Couleur or pour le bouton */
	color: #0b0b3b;
	/* Texte couleur nuit */
	padding: 10px 20px;
	font-size: 1em;
	border-radius: 20px;
	text-decoration: none;
	display: inline-block;
	margin: 10px 0;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
	transition: background-color 0.3s, transform 0.2s;
	border: 1px solid #0b0b3b;
	/* Bordure du bouton */
	font-weight: bolder;
}

.cta-button:hover {
	background-color: #0b0b3b;
	/* Changement de couleur du bouton au survol */
	color: #d3c26e;
	/* Texte couleur or au survol */
	transform: translateY(-2px);
	font-weight: bolder;
}