/* Version 3.8 — Mon parcours uniquement.
 * Etapes 01 à 05 : cinq cadres PAYSAGE de même taille, sans bandes beiges.
 * Le portrait d'introduction garde son cadre vertical distinct.
 * Aucune photo n'est remplacée, aucune page Potion Digitale n'est modifiée. */

html body.mpb-site main.parcours-view #mon-parcours .journey-row .journey-photo,
html body.mpb-site main.parcours-view #mon-parcours .journey-row.journey-step-01 .journey-photo,
html body.mpb-site main.parcours-view #mon-parcours .journey-row.journey-step-03 .journey-photo {
  box-sizing: border-box !important;
  display: block !important;
  width: 100% !important;
  max-width: 340px !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: 17 / 11 !important; /* 340 x 220 sur grand ecran */
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 auto !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
}
html body.mpb-site main.parcours-view #mon-parcours .journey-row .journey-photo > img.cover-img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center center !important;
}
/* Pour l'etape 03, priorite au visage sans afficher les bras. */
html body.mpb-site main.parcours-view #mon-parcours .journey-step-03 .journey-photo > img.cover-img {
  object-position: 50% 22% !important;
}
/* Le rendu provisoire reste dans le meme cadre tant que la photo
 * definitivement choisie n'a pas ete affectee dans la Mediatheque. */
html body.mpb-site main.parcours-view #mon-parcours .journey-row .journey-photo > .photo-to-select {
  width: 100% !important;
  height: 100% !important;
}
@media (max-width: 800px) {
  html body.mpb-site main.parcours-view #mon-parcours .journey-row .journey-photo,
  html body.mpb-site main.parcours-view #mon-parcours .journey-row.journey-step-01 .journey-photo,
  html body.mpb-site main.parcours-view #mon-parcours .journey-row.journey-step-03 .journey-photo {
    max-width: min(100%, 340px) !important;
  }
}
