/* --------------------------------------------------
  ZONES D'INTRODUCTION - BASE 16px (en-bref)
===================================================== */
.zone-intro {
  position: relative;
  margin-bottom: 1.5em;
}

.zone-intro.en-bref,
.zone-intro .en-bref {
  padding: 0 15px;
  font-size: 1.231em;
  border: 1px solid #ddd;
  -moz-box-shadow: 0px 1px 2px 0px #ddd;
  -webkit-box-shadow: 0px 1px 2px 0px #ddd;
  box-shadow: 0px 1px 2px 0px #ddd;
  background: #fff url("/ressources/images/a00-bloc-en-bref-fond.gif") repeat-x left bottom;
  background: -moz-linear-gradient(top, #fff 0%, #f8f8f8 60%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(60%,#f8f8f8)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, #fff 0%, #f8f8f8 60%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, #fff 0%, #f8f8f8 60%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #fff 0%, #f8f8f8 60%); /* IE10+ */
  background: linear-gradient(to bottom, #fff 0%, #f8f8f8 60%); /* W3C */
}

.zone-intro.en-bref > *,
.zone-intro .en-bref > * {
  margin: 1em 0;
  padding: 0;
}

.zone-intro.en-bref h2, .zone-intro.en-bref .titre-n2 {
  font-size: 1em;
}

.zone-intro.en-bref .petit {
  font-size: 0.75em;
}

.zone-intro.en-bref a.bouton-action,
.zone-intro .en-bref a.bouton-action {
  font-size: 0.813em;
}

.zone-intro.en-bref ul,
.zone-intro .en-bref ul {
  padding-left: 0;
}

#zone-centrale .zone-intro.en-bref ul li,
#zone-centrale .zone-intro .en-bref ul li {
  margin: 0.5em 0 0 0;
  padding: 0 0 0 16px;
  background: url("/ressources/images/a00-bloc-en-bref-puce.png") no-repeat 2px 0.3em;
}

.zone-intro.en-bref ul ul li,
.zone-intro .en-bref ul ul li {
  padding: 0 0 0 16px;
  background: url("/ressources/images/a00-puce-point-vert.gif") no-repeat 4px 0.5em;
}

.zone-intro.en-bref > ul > li:first-child,
.zone-intro .en-bref > ul > li:first-child {
  margin: 0;
}

.zone-intro.en-bref .images,
.zone-intro .en-bref .images {
  margin: 1em 0 1em 1em;
  padding-top: 0.25em;
  float: right;
  text-align: right;
}

.zone-intro.en-bref .images img,
.zone-intro .en-bref .images img {
  display: block;
  margin: 1em 1px 0 auto;
}

/* Bug d'interprétation de Chrome */
@media screen and (-webkit-min-device-pixel-ratio:0) { .zone-intro.en-bref .images a.bouton-action + br { content: " "; } }

.zone-intro.en-bref .images img:first-child,
.zone-intro .en-bref .images img:first-child {
  margin-top: 0;
}

.zone-intro.en-bref .image-droite,
.zone-intro .en-bref .image-droite {
  margin: 1em 0 1em 1em;
  padding-top: 0.25em;
}

.zone-intro.en-bref .image-gauche,
.zone-intro .en-bref .image-gauche {
  margin: 1em 1em 1em 0;
  padding-top: 0.25em;
}

.zone-intro.vitrine, .zone-intro.carrousel,
.zone-intro .vitrine, .zone-intro .carrousel {
  padding: 0;
  text-align: center;
  overflow: hidden;
  border: 1px solid #ddd;
  -moz-box-shadow: 0px 1px 2px 0px #ddd;
  -webkit-box-shadow: 0px 1px 2px 0px #ddd;
  box-shadow: 0px 1px 2px 0px #ddd;
}

.zone-intro.vitrine img,.zone-intro .vitrine img {
  position: relative;
}

.zone-intro.vitrine-en-bref {
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  padding: 2.5%;
  box-sizing: border-box;
  width: 100%;
  height: auto;
  min-height: 380px;
  background: #C3C3C3 none top right/auto no-repeat;
}
.zone-intro.vitrine-en-bref.courte {
  min-height: 190px;
}
#page:not(.pleine-page) .zone-intro.vitrine-en-bref,
body([style*="font-size: 150%;"])  .zone-intro.vitrine-en-bref,
body([style*="font-size: 200%;"]) .zone-intro.vitrine-en-bref,
html([style*="font-size: 150%;"])  .zone-intro.vitrine-en-bref,
html([style*="font-size: 200%;"]) .zone-intro.vitrine-en-bref {
  -webkit-align-items: stretch;
  align-items: stretch;
  min-height: 500px;
}
.zone-intro.vitrine-en-bref > .en-bref {
  max-width: 45%;
  box-sizing: border-box;
  padding: 30px 20px;
  border: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  background: none;
  background-color: rgba(255,255,255,0.9);
}
.zone-intro.vitrine-en-bref.courte  > .en-bref{
  max-width: 50%;
}
#page:not(.pleine-page) .zone-intro.vitrine-en-bref > .en-bref {
  max-width:  60%;
}
@media screen and (max-width: 850px) {
  #page.mobile .zone-intro.vitrine-en-bref {
  background-size: auto;
  }
  #page.mobile .zone-intro.vitrine-en-bref > .en-bref {
  max-width:  60%;
  }
}
@media screen and (max-width: 649px) {
  #page.mobile .zone-intro.vitrine-en-bref {
  -webkit-align-items: stretch;
  align-items: stretch;
  }
  #page.mobile .zone-intro.vitrine-en-bref > .en-bref {
  max-width:  100%;
  margin-top: 250px;
  }
}
.zone-intro.vitrine-en-bref > .en-bref * {
  white-space: inherit;
}
.zone-intro.vitrine-en-bref > .en-bref > *:first-child {
  margin-top: 0;
}
.zone-intro.vitrine-en-bref > .en-bref > h1,
.zone-intro.vitrine-en-bref > .en-bref > .titre-n1 {
  margin-bottom: 0.6em;
  line-height: 1em;
  background: none;
}
.zone-intro.vitrine-en-bref > .en-bref > p:not([class*="titre-n"]) {
  color: black;
}
.zone-intro.vitrine-en-bref > .en-bref > *:last-child {
  margin-bottom: 0;
}

.zone-intro .flag-nouveau,
.zone-intro .flag-nouveau-en  {
  position: absolute;
  top: -28px;
  margin-top: 38px;
  height: 26px;
  left: 0px;
  width: 120px;
  text-indent: -2000px;
  z-index:10;
  display: none;
}
.zone-intro .flag-nouveau {
  background: url("/ressources/images/b35-tag-nouveau-f.png") no-repeat;
}
.zone-intro .flag-nouveau-en, #page.en .zone-intro .flag-nouveau {
  background: url("/ressources/images/b35-tag-nouveau-e.png") no-repeat;
}

.zone-intro.carrousel ul {
  margin: 0;
  padding: 0;
}

.zone-intro.carrousel ul li {
  margin: 0;
  padding: 0;
  background: none;
}


.zone-intro .offre-detail, #contenu.coopmoi.tri .offre-detail  {
  display: block;
  position: absolute;
  bottom: 0;
  right: 50px;
  background-color: #fff;
  padding: 3px 10px;
  color: #007944;
  font-family: Arial, Helvetica, sans-serif;
  font-weight: bold;
  z-index: 10;
 }
 
.zone-intro ol.etapes-numerotees {
  margin: 1em auto;
  padding: 0;  list-style: none;
  counter-reset: etapeNumerotee;
  overflow: hidden;
}
#zone-centrale ul.liste-blocs {
  margin: 1em auto;
  padding: 0;
  list-style: none;
}
.zone-intro ol.etapes-numerotees li, #zone-centrale ul.liste-blocs li {
  position: relative;
  float: left;
  margin-top: 0;
  background: none;
}
.zone-intro ol.etapes-numerotees li {
  margin-left: 10px;
  padding: 0;
  font-size: 0.8125em;
  text-align: center;
  border: 1px solid #ddd;
  z-index: 1;
}

.zone-intro ol.etapes-numerotees li:first-child { margin-left: 0; }

.zone-intro ol.etapes-numerotees li a:before {
  counter-increment: etapeNumerotee;
  display: block;
  padding-bottom: 5px;
  color: #00884e;
  font-weight: bold;
  font-size: 1.833em;
  text-align: center;
}

#page.fr:not(.mobile) .zone-intro ol.etapes-numerotees li a:before { content: "Étape " counter(etapeNumerotee); }
#page.en:not(.mobile) .zone-intro ol.etapes-numerotees li a:before { content: "Step " counter(etapeNumerotee); }

.zone-intro ol.etapes-numerotees li a {
  position: relative;
  display: block;
  padding: 10px;
  color: #3e3e3e;
  font-weight: bold;
  text-decoration: none;
  background-color: #e9e9e9;
  border: 1px solid #f6f6f6;
}

.zone-intro ol.etapes-ligne-temps {
  margin: 1em auto;
  padding: 0;
  list-style: none;
  overflow: hidden;
  display: -webkit-flex;
  display: flex;
  justify-content:center;
}

.zone-intro ol.etapes-ligne-temps li {
  position: relative;
  float: left;
  margin-top: 0;
  padding: 0;
  width: 128px;
  font-size: 0.75em;
  text-align: center;
  background: none;
  z-index: 1;
  margin: 0 10px 0 10px;
}

.zone-intro ol.etapes-ligne-temps li:first-child {
  margin-left: 0;
}

.zone-intro ol.etapes-ligne-temps li a {
  position: relative;
  display: block;
  color: #3e3e3e;
  font-weight: bold;
  text-decoration: none;
}

.zone-intro ol.etapes-ligne-temps li span {
  display: inline-block;
  height: 12px;
  text-indent: -9999px;
  border-left: 1px solid #3e3e3e;
  overflow: hidden;
}
.zone-intro #boite-ouverture-compte {
  position: absolute;
  background-color: white;
  background-color: rgba(255, 255, 255, 0.9);
  top: 63%;
  left: 26%;
  width: 48%;
  text-align: center;
  padding: 0 10px;
}
.zone-intro #boite-ouverture-compte p {
  font-weight: bold;
  font-size: 1.231em;
  color: #3e3e3e;
  margin: 0.75em 0px;
}
.zone-intro #boite-ouverture-compte > .colonne {
  float: left;
  width: 50%;
  text-align: center;
}
.zone-intro #boite-ouverture-compte .bouton-action {
  min-width: 120px;
  margin-bottom: 15px;
}

.contenu-tiroir .zone-intro.en-bref .rangee img{width: 100%;}
#contenu.top .zone-intro {
  min-height: 80px;
  display: inline-block;
  width: 100%;
}