#logo{
    font-size: 60%;
    float: right;
    height: 130px;
    margin-top: 80px;
    text-align: center;
    width: 100%;

}
.rouge{
   display: inline-block;
   width: 60%;
   margin-left: 120px;
   
}
.troi{
    color: #f0f0f0; 
}
.tragraphe13{
color: #f0f0f0;
}
.photo{
    width: 100%;

}
.item{
display: inline-block;
width: 28%;
border: 2px solid black;
border-radius: 10px;
box-shadow: 0px 0px 5px white;

}
.contenu{
width: 90%;
margin: 10%;
}
.para{
    margin-top: 2%;
margin-bottom: 10px;
margin-top: 0%;
color: white;
}
.date{
    float: right;
}
.titre2{
margin-top: 0%;
color: white;
}
.téte{
    border: 1px solid white;
   width: 90%;
   margin-top: 20px;
   background-color:gainsboro; 
}
.titres3,.deux{
text-align: center;
}
.deux{

}
.texte{
text-align: justify;
}
.ensemble{
    width: 90%;
    margin: 10%;
 
}
.liste{
display: inline-block;
width: 28%;
border: 2px solid black;
border-radius: 10px;
margin-top: 10px;
color: white;
box-shadow: 0px 0px 5px white;

}
.item:hover{
    background-color: orange;
    }

.liste:hover{
background-color: orange;
}
.image{
    width: 100%;
}
.titre11{

}
.paragraphe{

}
.groupe{
   background-color: gainsboro; 
   border: 1px solid white;
   width: 100%;
   
}
.livre{
display: inline-block;
text-align: center;
}


body{
    background-color: #0e142e;
}
@media screen and (max-width:600px){
    .liste{
        width: 90%;
    }
.item{
    width: 90%;
}
.livre{
    width: 90%;  
}
body{
    background-color:blue;
}
}