/* ==========================================================================
   1. Mise en forme générale
   ========================================================================== */

/* Surlignage type == ... == */
.mark {
  background: #fff3b0;
  padding: 0 0.1em;
}

/* Listes numérotées : légère réduction d'indentation */
ol {
  margin-left: 1.5em;
}

/* Icônes d’extensions (uBlock, Privacy Badger, etc.) en 25px */
ol li img[src$="ublock.png"],
ol li img[src$="Privacy_Badger.png"],
ol li img[src$="Clear_urls.png"],
ol li img[src$="Decentraleyes.png"],
ol li img[src$="Lightbeam.png"] {
  width: 25px;
  height: auto;
  vertical-align: middle;
  margin: 0 0.4em 0 0;
}

/* ==========================================================================
   2. Images flottantes à droite avec tailles spécifiques
   (logos dans le corps de l'article)
   ========================================================================== */

/* Toutes les images listées ici flottent à droite avec la même marge */
img[src*="11ec6494-0b63-425c-b112-3382c93ee787.png"], /* ancienne image ordi (si encore utilisée) */
img[src*="VPN.png"],                                  /* image VPN */
img[src*="AuroraOSS.png"],
img[src*="logo_firefox.png"],
img[src*="demailnagement.png"],
img[src*="Tubular.png"],
img[src*="Peertube.png"],
img[src*="Logo_Magic_Earth.png"],
img[src*="signal_logo.png"],
img[src*="Mastodon_logotype.png"] {
  float: right;
  height: auto;
  margin: 1px 1em 1em;
}

/* Tailles spécifiques */

/* VPN : 200px (exemple, ajuste si besoin) */
img[src*="VPN.png"] {
  width: 200px;
}

/* AuroraOSS : 150px */
img[src*="AuroraOSS.png"] {
  width: 150px;
}

/* Firefox : 50px */
img[src*="logo_firefox.png"] {
  width: 50px;
}

/* Demailnagement : 150px */
img[src*="demailnagement.png"] {
  width: 150px;
}

/* Tubular : 50px */
img[src*="Tubular.png"] {
  width: 50px;
}

/* Peertube : 50px */
img[src*="Peertube.png"] {
  width: 50px;
}

/* Magic Earth : 50px */
img[src*="Logo_Magic_Earth.png"] {
  width: 50px;
}

/* Signal : 50px */
img[src*="signal_logo.png"] {
  width: 50px;
}

/* Mastodon : 50px */
img[src*="Mastodon_logotype.png"] {
  width: 50px;
}

/* Raspberry Pi 5 : à droite, 250px (si utilisé sur une autre page) */
img[src$="Raspberry%20pi%205%20in%20hand.jpg"],
img[src$="Raspberry pi 5 in hand.jpg"] {
  float: right;
  width: 250px;
  height: auto;
  margin: 0 0 1em 1em;
}

/* ==========================================================================
   3. Images en ligne / pleine largeur
   ========================================================================== */

/* Bannière en haut : pleine largeur, centrée */
img[src*="Banniere_EFF_surveillances_numeriques.png"] {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto 1.5em auto;
}

/* Murena / iodé : images de sites, centrées avec un peu d’air */
img[src*="Murena_site.png"],
img[src*="Iode_site.png"] {
  display: block;
  max-width: 300px;
  height: auto;
  margin: 1em auto;
}

/* Work in progress : image finale centrée */
img[src*="Work%20in%20progress.jpg"] {
  display: block;
  max-width: 400px;
  height: auto;
  margin: 1.5em auto;
}