body{
    text-align: justify;
    margin: 0%;
    font-family: "CM Bright";
    font-weight: 300;
    font-style:normal;
    color: rgb(252, 250, 250);
    background-color: rgb(0, 0, 0);
    position: absolute;
    background-image: url(terre.png);  
    background-size: 56%;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: 20%;
} 

.im2{
    position: absolute;
    margin-left: 19%;
    margin-top: 46%;
}

.txt1{
margin-left: 20%;
margin-right: 40%;
background-color: rgba(56, 45, 57, 0.832);
color: white;
padding: 2%;
text-align: left;
transition: opacity 1s; 
opacity: 0.5;
}
.float2 {
    float: right; 
    max-width: 40%; 
    margin-top: 2%;
    margin-left: 2%;
    filter: invert(100%);

}
.txt1:hover{
  opacity: 1;
}

.txt2{
margin-right: 20%;
margin-left: 40%;
text-align: left;
background-color: rgba(114, 91, 116, 0.832);
color: white;
padding: 2%;
text-align: right;
transition: opacity 1s;
opacity: 0.5;
}
.float3 {
    float: left; 
    max-width: 40%; 
    margin-top: 2%;
    margin-left: 2%;
    filter: invert(100%);
}
.txt2:hover{
  opacity: 1;
}

.txt3{
margin-right: 40%;
margin-left: 20%;
background-color: rgba(56, 45, 57, 0.832);
color: white;
padding: 2%;
text-align: left;
transition: opacity 1s;
opacity: 0.5;
}
.float-image {
    float: right; 
    max-width: 40%; 
    margin-top: 2%;
    margin-left: 2%;
    filter: invert(100%);

}
.txt3:hover{
  opacity: 1;
}

.txt4{
margin-right: 20%;
margin-left: 40%;
background-color: rgba(114, 91, 116, 0.832);
color: white;
padding: 2%;
text-align: right;
transition: opacity 1s;
opacity: 0.5;
}
.float4 {
  float: left; 
  max-width: 40%; 
  margin-top: 2%;
  margin-left: 2%;
  filter: invert(100%);
}
.txt4:hover{
opacity: 1;
}

h1{
 display: flex;
 justify-content: right;
    font-family: "CMU Serif Extra";
    font-weight: normal;
    font-style: italic; 
    font-size: 100px;
    margin-right: 20%;
    color: white(8, 8, 8);   
}   
.asa{
  position: absolute;
  margin-left: 63%;
  margin-top: -10%;
  filter: invert(100%);
}

#im4{
  position: absolute;
  margin-left: 1.5%;
  margin-top: 113%;
  filter: invert(100%)
}


.header {
    padding: 10px;
    text-align: right;
    color: white;
    font-size: 30px;
	height: 70px;
    position: relative;
	border: 1px solid transparent;
	box-sizing: border-box;
  }
  
.image2{
    position: absolute;
    display: flex;
    justify-content: right;
    flex-direction: column;
    margin-left: 83%;
    margin-top: -18%;
    filter: drop-shadow(5px 5px 10px rgb(240, 240, 240));
}

#ed{
    display: flex;
    justify-content: left; 
    align-content: space-between;
  }        
  #haut{
    margin-left: 2%;
    margin-top: 2px;
  }
div.scrollmenu {
    background-color: rgba(56, 45, 57, 0);
    overflow: auto;
    white-space: nowrap;
  }
  
  div.scrollmenu a {
    display: inline-block;
    color: rgb(212, 154, 237);
    text-align: center;
    padding: 10px;
    text-decoration: none;
    font-weight: bold;
    font-family: "CM Bright";
  }
  
  div.scrollmenu a:hover {
    background-color:  rgba(114, 91, 116, 0.832);
  }