Pour éviter de péter la barre de progression à la moindre modif, les écrans...

/* Habillage (en vrac)

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

#minipres { width: 38em; background: #fff repeat; margin: 20px auto; padding: 20px; border: 1px solid #EEE;

#minipres { width: 500px; background: #fff repeat; margin: 20px auto; padding: 20px; border: 1px solid #EEE;

-webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;

-webkit-box-shadow: 0 0 20px #666; -moz-box-shadow: 0 0 20px #666; box-shadow: 0 0 20px #666; }

#infos_etapes { height: 63px; overflow: hidden; margin: 0; padding: 0; padding-left: 10px; background: #8c8c8c url(images/degrade-etapes-clair-left.gif) no-repeat right top; text-align: left; list-style: none; }

#infos_etapes.infos_etape_4 { background-image: url(images/degrade-etapes-vert-left.gif); background-color: green; }

#infos_etapes li { float: left; margin-left: -28px; padding-left: 29px; background: url(images/degrade-etapes-fonce-left.gif) no-repeat left top; color: #555; text-align: left; font-size: .9em; line-height: 1.05em; }

#infos_etapes li .fond { width: 8em; height: 69px; padding-right: 2em; padding-top: 10px; background: url(images/degrade-etapes-fonce-left.gif) no-repeat -30px top; }

#infos_etapes li .fond { width: 90px; height: 69px; padding-right: 30px; padding-top: 10px; background: url(images/degrade-etapes-fonce-left.gif) no-repeat -30px top; }

#infos_etapes li em {float:left;position:absolute;top:-1000px;}

#infos_etapes li span.numero_etape { float: left; display: block; height: 50px; margin-left: -10px; padding: 7px 3px 0 3px; font-weight: bold; font-size: 3em; }

#infos_etapes li.on { background-image: url(images/degrade-etapes-vert-left.gif); color: #fff; font-weight: bold; }