* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    /* background-color: #f5e2d7; /* Couleur de fond pâle beige/orange */
    background-image: url('images/gen/bg2.jpg'); /* Chemin vers votre image de texture */
    /* background-size: cover; /* Couvre toute la section */
    background-position: center; /* Centre l'image de texture */
	font-family: Arial, sans-serif;
}

.container {
    text-align: center;
    padding: 20px;
}

h1 {
    font-family: 'Georgia', serif; /* Police à empattement */
	color: #403152;
    margin-bottom: 20px;
}

.header-image {
    width: 100%; /* Ajustez la taille selon vos besoins */
    max-width: 600px; /* Limitez la largeur maximale */
    height: auto;
    margin-bottom: 20px;
}


.section {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 3px solid; /* Pour le liseré */
    border-radius: 15px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin: 20px auto; /* Centrer la section */
    width: fit-content; /* Ajuste la largeur au contenu */
    background-image: url('images/bg1.jpg'); /* Chemin vers votre image de texture */
    background-size: cover; /* Couvre toute la section */
    background-position: center; /* Centre l'image de texture */
}

.inner-section {
    display: flex;
    align-items: center;
    border: 1px solid; /* Pour le liseré */
	border-color: #403152;
    border-radius: 15px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5);
    padding: 10px; /* Ajustez la marge intérieure */
    margin-left: 20px; /* Ajustez pour espacer de l'image */
    margin-right: 20px; /* Ajustez pour espacer de l'image */
	background-color: #EEEEF080;
}

.lien-similaire {
    color: #007BFF;  /* Remplace par la couleur de tes liens */
    text-decoration: none;  /* Si tu veux garder le soulignement */
    cursor: pointer;  /* Si tu veux que le curseur soit en forme de main */
}


.image {
    width: auto; /* Ajustez la taille selon vos besoins */
    height: auto;
    margin-right: 20px;
	margin-left: 20px;
}

.image-portrait {
    max-width: 150px; /* Ajustez la taille selon vos besoins */
    height: auto;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
    cursor: pointer; /* le curseur change pour montrer que c'est cliquable */
    border-radius: 8px; /* coins arrondis (optionnel) */
}

.image-portrait:hover {
  transform: scale(1.05); /* zoom léger */
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); /* ombre élégante */
}

.image-module {
    max-width: 93px; /* Ajustez la taille selon vos besoins */
    height: auto;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
    cursor: pointer; /* le curseur change pour montrer que c'est cliquable */
    border-radius: 8px; /* coins arrondis (optionnel) */
}

.image-module:hover {
  transform: scale(1.05); /* zoom léger */
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); /* ombre élégante */
}


.content {
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* Pour aligner les éléments à gauche */
}

.small-caps {
        font-variant: small-caps; /* utilise les petites majuscules */
		font-size: 1.3em; /* augmente la taille de 30%, à ajuster selon besoins */
}
.small-caps::first-letter {
    text-transform: uppercase; /* pour rendre la première lettre en majuscule */
}



ul {
    list-style-type: none; /* Enlève les puces */
}

ul li {
    margin: 5px 0;
}

ul li a {
    text-decoration: none; /* Enlève le soulignement */
    color: #007bff; /* Couleur des liens */
}

ul li a:hover {
    text-decoration: underline; /* Souligne au survol */
}