@charset "utf-8";
/* CSS Document */


.w_30 {
  width: 60em;
}

/**
* concerne le défilement
**/
/* le block conteneur */
.marque {
  margin: 0.5em auto;
 
  overflow: hidden;
 
}
/* juste pour visualiser l'effet */
.marque:hover [data-text]:before {
  animation-play-state: paused;
}

/* les blocks défilants */
.marque [data-text] {
  white-space: nowrap;
  display: inline-block;
  min-width: 200%;            /* 2 fois la largeur du conteneur */
  font-size: 1.2em;
  line-height: 2em;
  cursor: pointer;  
}
.marque [data-text]:before,
.marque [data-text]:after {
  content: attr( data-text) "\00A0";
  display: inline-block;
  min-width: 50%;             /* la moitié du parent */
}
.marque [data-text]:before {
  animation: marque-defil 40s infinite linear;
}
.marque [data-text]:after {
  color: #000000;                /* juste pour voir le changement */
}
@keyframes marque-defil {
  0% {
    margin-left: 0;
  }
  100% {
    margin-left: -50%;
  }
}