@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Mono:wght@900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Mono:wght@100&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Mono:wght@100;400&display=swap');


body{
    background-color: black;
    background-attachment: fixed;           /* Le fond restera fixe */
	background-repeat: repeat-x;
    cursor: crosshair;
    margin:1%;
    padding:5;
}

.grand-titre{
	font-family:'Noto Sans Mono', monospace;
	font-size:90px;
	color: #00ff12;
	    width: 70vw;
    margin-left:2%;
    right:0;
}


h1 {
}


.intro{
      color: #00ff12;
      text-align: justify;
      text-align: left;
      font-family: 'Noto Sans Mono', monospace; 
      font-size: 11px;
      width: 37%;
      height: 200px;
      margin-top: 10%;
      margin-bottom: 1%;
      margin-left: 2%;
      border: 1px solid #00ff12; padding: 10px;
}


.gre{
	width:100%;
	display:flex;

 }
.image-moyen{
	width:40%;
	margin-bottom: 5%;
	flex:1;
}

img{
	width:100%;

}
a:link{
      cursor:  pointer;
}

.presentation{
      color: #00ff12;
      text-align: justify;
      text-align: left;
      font-family: 'Noto Sans Mono', monospace; 
      font-size: 9px;
      width: 20%;
      height: 110px;
      margin-bottom: 5%;
      margin-left: 75%;
      border: 1px solid #00ff12; padding: 10px;
}

.txt_maffeis{
	      color: #00ff12;
      text-align: justify;
      text-align: left;
      font-family: 'Noto Sans Mono', monospace; 
      font-size: 9px;
      width: 16%;
      height: 55px;
      margin-top: 70px;
      margin-left: 20px;
      margin-bottom: 20%;
      border: 2px solid #00ff12; padding: 10px;
      float: right;
}

.premier{
	column-count: 2;

}

.louis{
	width: 70%;

}
	
.maffeis{
	width: 90%;

}



.txt_louis{
      color: #00ff12;
      text-align: justify;
      text-align: left;
      font-family: 'Noto Sans Mono', monospace; 
      font-size: 9px;
      width: 25%;
      height: 95px;
      margin-left: calc(15% - 15%);
      margin-top: 0px;
      margin-bottom: 20%;
      border: 2px solid #00ff12; padding: 10px;
      float: left
            margin-bottom: 50px;
	}
	

.mackay{
      color: #00ff12;
      text-align: justify;
      text-align: left;
      font-family: 'Noto Sans Mono', monospace; 
      font-size: 9px;
      width: 16%;
      height: 75px;
      border: 2px solid #00ff12; padding: 10px;
      float: right
	
}
	
.deux{
	column-count: 2;
	top-margin: 60px;
}

.image_hay{
	width: 90%;
	margin-bottom: 20px;
}

.image_mackay{
	width: 90%;
	margin-right: 20px;
}

.hay{
      color: #00ff12;
      text-align: justify;
      text-align: left;
      font-family: 'Noto Sans Mono', monospace; 
      font-size: 9px;
      width: 20%;
      height: 65px;
      border: 2px solid #00ff12; padding: 10px;
      margin-top: 20px;
	}
	
.roulette{
	margin-top: 200px;
	width: 70%;
	}
	
	
.txt_roulette{
      color: #00ff12;
      text-align: justify;
      text-align: left;
      font-family: 'Noto Sans Mono', monospace; 
      font-size: 9px;
      width: 20%;
      height: 65px;
      border: 2px solid #00ff12; padding: 10px;
      margin-top: 20px;      
margin-left: 49%;
	margin-bottom:10%;
}

.troisieme{
	column-count: 2;
	top-margin: 40px;
}

.adele{
	width: 80%;
	margin-left: 30%;
}
	
.txt_adele{
      color: #00ff12;
      text-align: justify;
      text-align: left;
      font-family: 'Noto Sans Mono', monospace; 
      font-size: 9px;
      width: 40%;
      height: 65px;
      border: 2px solid #00ff12; padding: 10px;
      margin-top: 400px;      
margin-left: 10%;
	margin-bottom:70%;
}



.gre_fin{
	width: 30%;
	margin-top: 500px;
	margin-left: 70%;
	}