body {                                                  /*couleur de fond*/
    background-color:#C9BADA ; 
}


h1 {

    font-family: Verdana, Geneva, Tahoma, sans-serif ;  
    font-size: 40px;
    color: #4A3461;
    
}

h3 {

    font-family: Arial, Helvetica, sans-serif ;
    font-size: 25px;
    color: #634682;
}

h4 {

    font-family: Arial, Helvetica, sans-serif ;
    font-size: 20px;
    color: #7C58A3;
}

h5 {

    font-family: Arial, Helvetica, sans-serif ;
    font-size: 15px;
    color: #81689c;
}


aside {                                    

   width: 100%;
   background: #B099C8;
   padding: 30px 1px 10px;

}


main {             

    max-width: 1000px;
    margin: auto;
    background: #E3DBEC;
    min-height: 100vh;
    padding-left: 5px;
    padding-bottom: 10px;
    padding-right: 5px;

}


section {

    background: #E3DBEC;           /*zones de texte pour la page favorite books&movie*/

    border: solid 1px  #4A3461;
    border-radius: 10px;
    padding-left: 10px;


}


img {                           /*pour que toutes les images on la même taille et la même forme */

    border-radius: 20px;
    display: flex;
    justify-content: center;
    width: 30%;    
    margin-bottom: 10px;
    margin-left: 5px;

}


#bc {

    width:  4500px;
    
}

a:hover {

    text-decoration: darkviolet;
}




nav {                                  /*bandeau de navigation*/

  background-color: #E3DBEC;
  padding: 0px 25px 10px;
  padding-block: 10px;
  border-radius: 40px;
  box-shadow: 0 10px 40px #867994;
  display: flex;
  position: relative;
  
}


nav img {


 width: 50%;

}

nav ul {

    margin-inline-end: 10px;
    gap: 20px;
    display: flex;
    list-style: none;

}


audio {                                /*c'est pour redimesionner l'audio et faire la banière en violet derrière*/

    margin-left: 40%;
    margin-top: 30%;
    display: block;
    background: #B099C8;
    width: 20%;
    height: 30px;
    padding: 15px;
    margin: 20px auto;
    border-radius: 5px;

}



#versailles1 img {                     /*c'est que les images de la page versailles soit positioner comme je le veux*/

    display: flex;
    margin-left: auto;
    margin-top: 0%;
}


#versailles2 img {

    display: flex;
    margin-top: -10%;

} 


#versailles3 img {

    display: flex;
    margin-left: 39%;
    margin-top: -5%;

}