.annonce {
  position: absolute;
  bottom: 246px;
left: -30px; 
  width: 120vw;
  z-index: 4;
  text-align: center;
  transform: translateY(50%) rotate(-3deg);
  background-color: #0009;
}
.pleine-page {
  width: 100%;
}
.pleine-page img {
  width: 50%;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}

.annonce h1 {
  font-size: 10vmin;
  color: #fff;
  
  padding: 20px 0 0;
}
.annonce h2 {
  font-size: 6vmin;
  color: #fff;
}
.pre-capsule {
  height: 40px;
}
.stage {
padding:40px;
text-align:center;}

.stage a {
  line-height:1em;
  letter-spacing:0.06em;
  font-weight:normal;
  font-size:16px;
  text-decoration:none;
  color:#fff;
  background:#231f20;
  display:inline-block;
  padding:15px 12px 15px 15px;
  transition:background 200ms;
  border-radius:4px;
}


.stage a:hover {
  background:#8F2B0D;
  color: #c42727;
}
.color-btn a {
  background:#c42727;
  margin-bottom: 20px;
}
.color-btn a:hover {
  background:#000;
  color: #c42727;
}
/*FIN DE READ MORE*/

body {
  background: #000;
}

* {
  margin: 0;
  padding: 0;
}
.en-tete {
  max-height: 100vh; 
  overflow: hidden;
  position: relative;
  z-index: 1;
  /*! background-color: black; */
}
.en-tete img {
  width:100%;
}
.smart {
  display: none;
}
.no-smart {
  display: block;
  /*! position: relative; */
  /*! top: 50%; */
  /*! transform: translateY(-50%); */
}
.accordion {
  margin: 0px 10px;
  background: #000;
  cursor: pointer;
  user-select: none;
}


.accordion .ouvert h3 {
  color: black!important;
}
.accordion .item {
  height: 100px;
}
.capsule {
  border: solid 1px #c42727;
  margin-top: 6px;
}
.accordion .item h3 {
  display: inline-block;
  vertical-align: middle;
  height: 100%;
  padding-left: 20px;
  font-family: "JF Flat Regular";
  font-size: 5em;
  font-weight: 400;
  text-transform: uppercase;
  color: #c42727;
  font-family: Helveticanowdisplay, sans-serif;
  font-weight: 600;
  padding-top: 6px;
}

.accordion .item:hover {
  background-color: #c42727;
}

.accordion .item img {
  padding-left: 15px;
  width: 30px;
  vertical-align: middle;
  /*! position: relative; */
  /*! right: 10px; */
  float: right;
  padding: 20px;
}

.fleche {
  padding-left: 15px;
  width: 80px;
  vertical-align: middle;
  /*! position: relative; */
  /*! right: 10px; */
  float: right;
  padding: 3px;
  pointer-events: none;
}
.fleche svg {
float: right;
  /*! width: 80px; */ 
  /*! height: 80px; */ 
  max-width: 100%;
pointer-events: none;

}
.fleche svg path {
    fill: #c42727; /* Couleur de remplissage noire */
}

.accordion p {
  font-family: Helveticanowdisplay, sans-serif;
  font-size: 18px;
  font-weight: 400;
  padding: 14px 6em 15px 30px;
  display: none;
}
@media (max-width: 790px) {
.annonce {
  background-color: #fffb03bf;
}
.smart {
  display: block;
}
.no-smart {
  display: none;
}
.accordion .item h3 {
  font-size: 4em;
}
  .fleche {
  width: 60px;
}
  .accordion .item {
  height: 70px;
}
}
@media (max-width: 638px) {
.en-tete {
  height: inherit;
  overflow: hidden;
}
.accordion .item h3 {
  font-size: 3em;
}
  .fleche {
  width: 42px;
}
}
  @media (max-width: 480px) {
.annonce {
  width: 120vw;
   bottom: 100px;
}
    .pleine-page img {
  width: 75%;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
.accordion .item {
  height: 58px;
}
.accordion .item h3 {
  font-size: 2em;
}
  .fleche {
  width: 33px;
}
.accordion p {
  font-size: 16px;
  padding: 0px 8px 15px 8px;
}
}
@media (max-width: 340px) {
.accordion .item h3 {
  font-size: 1.3em;
}
  .fleche {
  width: 33px;
}
}