.container{
  height: 100vh;
  width: 100vw;}

/* Style de la fenêtre modale */
.modal-container{
  height: 100vh;
  width: 100%;
  position: fixed;
  top:0;
  left: 0;
  background-color: rgba(136,222,136,0.8);
  display: flex;
  justify-content: center;
  align-items: center;
  display: none;
}
.modal-details{
  background-color: white;
  width: 50%;
  text-align: center;
  position: relative;
  padding: 3rem;
  color:#1e2337;
}
.modal-details i{
  position: absolute;
  top:-2px;
  right:-2px;
  font-size: 2rem;
  padding: 1rem;
  color:grey;
}
.modal-titre{
  font-size: 2rem;
  font-weight: 900;
  margin-bottom: 1rem;
}
.code{
  background-color: black;
  color: white;
  font-family: monospace;
  padding: 1rem;
  display: none;
  font-size: 1.5rem;
}
.btn-success{
  height: 4rem;
  background-color:rgb(231,171,61) ;
  color:white;
  padding: 1rem;
  border:none;
  width: 100%;
  font-size: 1.5rem;
}
/* HTML correspondant/
<div class="modal-container">
      <div class="modal-details">
        <p class="modal-titre">50% de promotion sur tout le site</p>
        <!-- Ce code est visible au clic sur le bouton -->
        <p class="code">OHMYCODE!</p>
        <!-- Icône pour refermer la modale -->
        <i class="fas fa-times"></i>
        <button class="btn-success">Obtenir le code</button>
      </div>
    </div>*/