/* A PARTIR D ICI C EST POUR LES CHOSES EN COMMUNS SUR LES PAGES */

h2 {
    font-size: 20px;
    /* regle la taille à 18px */
    font-weight: bold;
    /* met en gras */
    text-decoration: underline;
    /* souligne les titres */
}

.pics {
    text-align: center;
    /*permet de mettre au centre les images qui sont dans la div avec cette class */
}

.photos {
    width: 150px;
    /*photos grandes donc je réduis la largeur*/
    height: auto;
    /* adapte la hauteur pour garder la taille des images */
    display: inline-block;
    /*permet de mettre les images sur une seule ligne*/
    margin-left: 10px;
    /*marge de 15px a gauche de chaque image*/
    padding: 35px;
    /*marge interieur de 45px */
}


.texte {
    font-size: 18px;
    /* met la taille à 18px */
    text-align: justify;
    /* justifie le texte */
}

body {
    background-color: blanchedalmond;
    /* couleur de fond beige clair */
    font-family: 'Times New Roman', Times, serif;
    /* police d'écriture */
    margin: 0;
    /* supprime les marges par défaut du navigateur */
    text-align: justify;
    /* justifie le texte */
}


.bloc {
    max-width: 75%;
    /* largeur maximale du bloc principal pour ne pas qu'il soit trop large sur grand écran */
    margin: 0 auto;
    /* centre le bloc horizontalement sur la page */
    margin-top: 40px;
    /* marge au-dessus du bloc */
    margin-bottom: 40px;
    /* marge en-dessous du bloc */
    padding: 20px;
    /* marge intérieur pour que le texte ne touche pas les bords noirs */
    background-color: rgb(0, 0, 0);
    /* fond noir pour le bloc principal */
    margin-bottom: 60px;
    /* marge intérieur en bas */
    color: white;
    /* couleur blanche */
}


header {
    width: 100%;
    /* prend toute la largeur */
    background-color: rgb(0, 0, 0);
    /* fond noir */
    padding-top: 15px;
    /* marge intérieur en haut du menu */
    padding-bottom: 15px;
    /* marge intérieur en bas du menu */
    top: 0;
    /* collé tout en haut */
    left: 0;
    /* collé à gauche */
}

footer {
    width: 100%;
    /* prend toute la largeur */
    background-color: rgb(0, 0, 0);
    /* fond noir */
    text-align: center;
    /* centre le texte du footer */
    padding-top: 25px;
    /* marge intérieur au-dessus */
    padding-bottom: 25px;
    /* marge intérieur en-dessous */
    color: white;
    /* couleur blanche */
}

nav ul {
    list-style: none;
    /* enlève les points de la liste à gauche */
    padding: 0;
    /* enlève le padding par défaut de la liste */
    margin: 0;
    /* enlève les marges par défaut */

    display: flex;
    /* pour aligner les éléments horizontalement */
    justify-content: center;
    /* centre les éléments */
    width: 100%;
    /* occupe toute la largeur */
}

nav li {
    flex: 1;
    /* chaque élément prend la même place */
    text-align: center;
    /* centre le texte à l'intérieur de chaque bouton du menu */
}

nav li a {
    color: white;
    /* couleur blanche */
    text-decoration: none;
    /* enlève le soulignement bleu par défaut des liens */
    border: 2px solid white;
    /* met une bordure blanche autour des liens */
    border-radius: 10px;
    /* arrondit les coins des bordures */
    padding: 10px;
    /* marge intérieur */
    display: block;
    /* occupe tout l’espace disponible */
}

nav li a:hover {
    color: black;
    /* met la couleur du texte en noir au survol */
    text-decoration: underline;
    /* souligne le texte au survol */
    background-color: white;
    /* met le fond en blanc au survol */
}


/* A PARTIR D ICI PAGE ACCUEIL 
PAGE NUMERO 1 
*/

.imgaccueil {
    display: block;
    /* pôur que margin fonctionne */
    margin: auto;
    /* centre horizontalement */
}

/* A PARTIR D ICI C EST POUR LA PAGE CV.HTML 
C EST LA DEUXIEME PAGE DU SITE WEB
*/

.infoperso {
    font-size: large;
    /* ugmente la taille du texte */
    background-color: rgb(0, 0, 0);
    /* fond noir */
    color: white;
    /* couleur blanche */
    padding: 30px;
    /* marge intérieur */
    font-family: 'Times New Roman', Times, serif;
    /* Police d'écriture */
    min-height: 100%;
    /* hauteur minimum de 100% */
    height: auto;
    /* la hauteur s’adapte au contenu */
}


main {
    width: 20%;
    /* largeur 20% de l'écran */
    border-right: 5px solid white;
    /* ajoute une ligne blanche verticale à droite de la section main */
}


h3 {
    font-weight: bold;
    /* Mettre en gras */
    margin-bottom: 5px;
    /* Marge sous le titre */
}

h1 {
    font-size: 24px;
    /* regle la taille a 18px */
    font-weight: bold;
    /* Mettre en gras */
}

.photocv {
    width: 150px;
    /* largeur de la photo */
    height: 150px;
    /* hauteur de la photo */
    display: block;
    /* pour que margin auto fonctionne */
    margin: 0 auto;
    /* centre horizontalement */
}

.grosbloc {
    display: flex;
    /* pour que main et aside soit a cote */
}

aside {
    width: 80%;
    /* la partie droite prend 80% */
    margin-bottom: 70px;
    /* espace en bas de la section aside */
}


/* A PARTIR D ICI C EST POUR LA PAGE INTERESTS.HTML 

C EST LA TROISIEME PAGE DU SITE WEB

*/

iframe {
    width: 560px;
    /* largeur de la vidéo */
    height: 315px;
    /* hauteur de la vidéo */
    border: 0;
    /* supprime la bordure par défaut de l'iframe */
    padding-top: 50px;
    /* marge intérieure au-dessus */
    margin: auto;
    /* centre horizontalement */
    display: block;
    /* pour margin fonctionne */
    padding-bottom: 50px;
    /* marge intérieur en dessous */
}




/* A PARTIR D ICI C EST POUR LA PAGE CULTURE.HTML 

C EST LA QUATRIEME PAGE DU SITE WEB

*/

.uruma {
    width: 550px;
    /* largeur pour l'image */
    height: 275px;
    /* hauteur pour l'image */
}



/* A PARTIR D ICI C EST POUR LA PAGE CITY.HTML 

C EST LA CINQUIEME PAGE DU SITE WEB

*/

audio {
    width: 50%;
    /* prendre 50% de la largeur */
    display: block;
    /* pour que margin fonctionne */
    margin: auto;
    /* centre horizontalement */
    margin-top: 50px;
    /* marge au-dessus */
    margin-bottom: 50px;
    /* marge en-dessous */
}


/* A PARTIR D ICI C EST POUR LA PAGE IUT.HTML 

C EST LA SIXIEME PAGE DU SITE WEB

*/

video {
    padding-top: 50px;
    /* marge intérieur haut  */
    width: 560px;
    /* Largeur de la vidéo */
    margin: auto;
    /* centre horizontalement */
    display: block;
    /* pour que margin fonctionne */
    padding-bottom: 40px;
    /* marge intérieur en dessous */
}


/* */


/* <!-- LE CONTENU DE CETTE PAGE A ETE VALIDE SUR LE SITE VALIDATOR LE 19/12/25 A 20H50 --> */