/* styles-common.css */
/* Styles pour l'en-tête */
#header {
    text-align: left;
}

.header-title {
    font-size: 20pt;
}

.header-subtitle {
    font-size: 15pt;
}

/* Fond noir et couleur de texte blanc */
body {
    background-color: black;
    color: white;
    font-family: "Rooney", sans-serif;
    text-align: center;
}

/* Menu principal */
ul#menu {
    font-style: italic;
    list-style: none;
    display: flex;
    justify-content: center;
    padding: 0;
    font-size: 20pt;
    /*background-color: #333; Ajout d'une couleur de fond */
    /*border-radius: 5px; Arrondir les coins */
}

/* Séparateurs visuels */
ul#menu li:not(:last-child) {
    margin-right: 10px; /* Espace entre les éléments du menu */
    padding-right: 10px; /* Espace à droite des éléments du menu */
    /*border-right: 1px solid #ccc;  Bordure à droite de chaque élément du menu */
}

/* Icônes */
ul#menu li a::before {
    content: "\1F517"; /* Code Unicode pour un point */
    margin-right: 5px; /* Espace entre l'icône et le texte du menu */
}

/* Liens */
a {
    text-decoration: none;
    color: #00f0ff;
    transition: background-color 0.3s; /* Transition pour une animation fluide */
}

/* Changement de couleur au survol du lien hypertexte */
.header-title a:hover {
    background-color: #555; /* Ajout d'une couleur de fond au survol */
    color: #ff0000;
}

.submenu {
    display: none;
}

/* Styles pour les liens du sous-menu */
#menu .submenu li {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: left;
}

#menu .submenu li a {
    text-decoration: none;
    color: #00f0ff;
    font-size: 10pt;
    border: 2px solid #ffffff;
    border-radius: 5px;
    padding: 5px; /* Ajout d'un espace autour du texte */
    display: block; /* Permet de remplir toute la largeur du conteneur */
    transition: border 0.3s; /* Transition pour une animation fluide */
    border: 1px solid transparent; /* Ajout d'un cadre transparent par défaut */

}

/* Style au survol des liens du sous-menu */
#menu .submenu li a:hover {
    background-color: #ff0000;
    color: #ffffff;
}

/* Style pour les éléments du menu principal */
ul#menu .menu-item {
    background-color: #333; /* Couleur de fond */
    border-radius: 5px; /* Arrondir les coins si nécessaire */
    padding: 10px; /* Ajouter un espace intérieur */
    transition: background-color 0.3s; /* Transition pour une animation fluide */
}

/* Changement de couleur au survol du menu principal */
ul#menu .menu-item:hover {
    background-color: green; /* Nouvelle couleur de fond au survol */
}


/* Style de la ligne ondulée */
.wave-line {
    width: 100%;
    height: 10px;
    background: linear-gradient(90deg, white, green, white);
}

/* Style pour la ligne en haut */
.wave-line.top {
    margin-bottom: 10px;
}

/* Style pour la ligne en bas */
.wave-line.bottom {
    margin-top: 10px;
}

/* Style pour les images du dossier */
.image-container {
    display: flex;
    justify-content: space-between;
}

.image-container img {
    max-width: 33%;
    height: auto;
}