
body{
  font-family: "Martian Mono SemiExpanded";
  font-weight: 300;
  font-size: 25px;
}

.messagedefilant {
  display: block;
  margin: -20px auto;
  padding: 10px;
  position: fixed;
  font-family: "Martian Mono SemiExpanded";
  font-weight: 800;
  color: red;
    
}
 
.messagedefilant div {
  position: absolute;
  display: flex;
  min-width: 100%; /* au minimum la largeur du conteneur */
}
  
.messagedefilant div:after {
  content: attr(data-text);
  
}
.messagedefilant div span, 
.messagedefilant div:after {
  position: relative;
  display: inline-block;
  font-size: 40px;
  white-space: nowrap;
  top:0;
  background-color: white;
}
 
.messagedefilant div  {
  animation: defilement 15s infinite linear;
  
}

.liste-des-statuts {
    display: flex;
    flex-direction: column;    
}
html {
  overflow-y: scroll;
  scroll-snap-type: y mandatory;
}
article {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    scroll-snap-align: start;
}




h1{
    font-family: "Martian Mono SemiExpanded";
    font-weight: 800;
    font-stretch:100%;
    writing-mode: sideways-lr;
    font-size: 80px;
    padding-top: 100px;
    position: fixed;
  

}
.wave-container{
  margin-left: 260px ;
  margin-bottom: -130px;
  /*color: white;*/
  background-color:  orangered;

}

.wave-text span {
    display: inline-block;
    font-size: 800px;
    animation: wave 2s ease-in-out infinite;
    font-family: "Martian Mono SemiExpanded";
    font-weight: 300;
    font-stretch:100%;
    font-size: 80px;
    padding-top: 100px;


}



.wave-text span:nth-child(2) {
    animation-delay: 0.2s;
}
.wave-text span:nth-child(3) {
    animation-delay: 0.4s;
}
.wave-text span:nth-child(4) {
    animation-delay: 0.6s;
}
.wave-text span:nth-child(5) {
    animation-delay: 0.8s;
}
.wave-text span:nth-child(6) {
    animation-delay: 1.0s;
}
.wave-text span:nth-child(6) {
    animation-delay: 1.1;
}
.wave-text span:nth-child(7) {
    animation-delay: 1.2s;

}
.wave-text span:nth-child(8) {
    animation-delay: 1.4s;

}

.couleur{
  color: red;
}


@keyframes wave {
    0%, 100% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(-20px);
    }
}

p img{
    width: 90%;
    height: 90%;
    padding-left: 185px;
    padding-top: 42px;
}



.mm span img  {

margin-left: 200px;
width: 30%;
height: 30%;

}

ul{
    padding-top: 120px;
    font-family: "Martian Mono SemiExpanded";
    font-weight: 200;
    font-size: 30px;
    color: white;


}
 


.liste{
  display: flex;
  flex-direction: column;
  margin-left: 850px;
  margin-top: -922px;
  background-color: black;
  padding-bottom: 274px;

}




@keyframes defilement {
  0% {  }
  100% { transform: translateX( -50%); }
}
 
/*.sommaire{
  background-color: black;
  margin-left: 185px;
}*/

.video {
  
  background: red;
  margin-top: 200px;
  
}

.video div {
  width: 800px;
  margin: auto;
}

a{
  outline: none;
  text-decoration: none;
  color: white;
}

@font-face {
    font-family: "Martian Mono SemiExpanded";
    font-weight: 100 800;
    font-stretch: 66.7% 100%;
    font-style: normal;
    font-display: swap;
    src: url("martian-mono-semiexpanded/martianmono-variablefontwdth-wght.ttf") format(opentype) tech(variations),
         url("martianmono-variablefontwdth-wght.ttf") format("opentype-variations");
}
.martian-mono-semiexpanded {
    font-variation-settings: "wght" var(--martian-mono-semiexpanded-wght, 400), "wdth" var(--martian-mono-semiexpanded-wdth, 112.50000762951095);
}

.rubik {
    font-variation-settings: "wght" var(--rubik-wght, 300);
}@font-face {
    font-family: "Rubik";
    font-weight: 300 900;
    font-style: normal;
    font-display: swap;
    src: url("rubik-light/rubik-variablefontwght.woff2") format(woff2) tech(variations),
         url("rubik-light/rubik-variablefontwght.woff") format(woff) tech(variations),
         url("rubik-ligh/rubik-variablefontwght.woff2") format("woff2-variations"),
         url("rubik-light/rubik-variablefontwght.woff") format("woff-variations");
}
.rubik {
    font-variation-settings: "wght" var(--rubik-wght, 300);
}