body {                                          /*Permet de mettre une couleur de fond et régler son opacité*/
    background-color: #1e1e1e;
    opacity: 1.6;
}

h1 {                                            /*Permet de centrer les titres*/
    color: rgb(0, 0, 0);
    text-align: center;
    font-size: 25px ;
    margin: 10px;
}

.menu {                                         /*Permet de configurer la disposition du menu*/ 
    list-style-type: none;
    margin: 0px ;
    padding: 0;
    overflow: hidden;
    border: 1px solid;
    border-radius: 5px;
    display: flex;
}

.menu li {                                       /*Permet de centrer et aligner horizontalement chaque élement du menu et  */
    margin: 0 auto;
    float: left;  
}

.menu li a {                                    /*permet de donner un couleur texte du menu */
  display: block;
  color: rgb(255, 255, 255) ;
  padding: 10px 10px;
  text-decoration: none;
}

.menu li a:hover {                              /*Permet de faire apparaitre un couleur de fond lorsque le curseur est sur un menu*/
    background-color: #ffffff;
    color: #1e1e1e;
}

 .cv_section {                                  /*Ce bloc permet de donner une forme arrondis à un essemble de texte , en donnant un effet d'ombre, en les mettant en milieu de la page et permet de disposer les espace entre chaque ensemble*/
    border: 2px solid rgb(255, 255, 255);
    border-radius: 5px;
    color: #000000;
    background-color: rgb(255, 255, 255);
    margin: 20px;
    width: auto;
    height: auto;
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 5px 5px 6px rgb(255, 255, 255);
}

.story {    /**/
    color: rgb(255, 255, 255);
    text-align: center  ;   
}

table {                                         /*Permet de centrer le tableau*/
    margin: auto;
}

.ensemble{                                      /*Ce bloc permet de centrer les images au milieu de la page et de les entourer avec une bordure */
    border: 2px solid rgb(255, 255, 255);
    border-radius: 5px;
    color: #000000;
    margin: 20px;
    margin-left: 150px;
    width: auto;
    height: auto;
    padding: 20px;
    margin-bottom: 40px;
    box-shadow: 5px 5px 6px rgb(255, 255, 255);
    display: inline-block;           
    align-items: center;                
}

h2 {                                            /*Permet de centrer les titres*/
    color: white;
    text-align: center;
    font-size: 25px ;
    margin: 10px;
}

.text {                                         /*Ce bloc permet de entourer les textes avec une bordure arrondis et de lui donner une ombre blache  */
    border: 2px solid rgb(255, 255, 255);
    border-radius: 5px;
    box-shadow: 5px 5px 6px rgb(255, 255, 255);
    padding: 10px;
    color: #ffffff;
}

.audio {                                        /*Permet de donner une forme arrondis et d'avoir une ombre blanche derriere l'audio*/
    margin: 50px;
    display: block;
    border-radius: 10px ;
    box-shadow: 5px 5px 6px rgb(255, 255, 255);
}

.video {                                        /*Permet de centrer la video au milieu de la page, de lui donner une forme arrondis et de lui donner une ombre blanche derrière*/
    display: block;
    margin-top: 50px ;
    margin-left: auto;
    margin-right: auto;
    border-radius: 20px;
    box-shadow: 5px 5px 6px rgb(255, 255, 255);
}

iframe {                                        /*Permet de centrer la video au milieu de la page, de lui donner une forme arrondis et de lui donner une ombre blanche derrière*/
    display: block;
    margin-top: 50px ;
    margin-left: auto;
    margin-right: auto;
    border-radius: 20px;
    box-shadow: 5px 5px 6px rgb(255, 255, 255);
}