body {
  margin: 0;
  /* Élimine les marges par défaut */
  padding: 0;
  /* Élimine les espaces internes par défaut */
  font-family: Arial, sans-serif;
  /* Choix d'une police lisible */
  line-height: 1.6;
  /* Améliore la lisibilité avec un espacement de ligne confortable */
  color: #333;
  /* Couleur de texte par défaut */
  background-color: #f7f7f7;
  /* Couleur de fond pour un contraste agréable */
  overflow-x: hidden;
  /* Empêche le défilement horizontal */
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

header {
  color: white;
  background: green;

}

.container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 20px;
  overflow: hidden;
  /* Ajout de l'overflow hidden */
}

.navbar-brand {
  font-size: 1.5em;
}

.navbar-menu {
  list-style: none;
  padding: 0;
  margin: 0;
}

.navbar-menu li {
  display: inline-block;
  margin-right: 20px;
}

.navbar-menu li:last-child {
  margin-right: 0;
}

.navbar-menu li a {
  color: white;
  text-decoration: none;
  transition: color 0.3s, transform 0.3s;
}

.navbar-menu li a:hover {
  color: red;
  transform: scale(1.1);
  background-color: wheat;
}

.navbar-toggle {
  cursor: pointer;
}

#sidebar {
  position: fixed;
  top: 0;
  left: -250px;
  width: 250px;
  height: 100%;
  background-color: #333;
  color: white;
  transition: left 0.3s ease;
}

.sidebar-header {
  padding: 5px;
  text-align: right;
}

.close-btn {
  cursor: pointer;
}

#sidebar ul {
  list-style: none;
  padding: 0;
}

#sidebar ul li {
  padding: 10px;
}


/* Style pour la zone de contenu principale */
.content {
  flex-grow: 1;
  margin-left: 0;
  /* Initialisé à zéro */
  padding: 10px;
  overflow-x: hidden;
  /* Empêche le débordement horizontal */
}

/* Style pour masquer le contenu */
.hidden-content {
  display: none;
}

.navbar-toggle {
  transition: transform 0.3s ease;
}

p {
  font-size: 18px;
}

h2,
h3 {
  background-color: #333;
  color: white;
}

.navbar-toggle:hover {
  transform: scale(1.2);
}

.navbar-nav .nav-link {
  color: white;
  transition: color 0.3s;
  text-decoration: none;
}

.navbar-nav .nav-link:hover {
  color: red;
  transform: scale(1.1);
  background-color: wheat;
  overflow-x: hidden;
  /* Empêche le débordement horizontal */

}


/* Styles pour le formulaire de recherche */
.search-form {
  display: none;
  /* Initialement masqué */
  position: absolute;
  top: 50px;
  /* Ajuster selon la hauteur de la barre de navigation */
  right: 10px;
  background-color: #fff;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 10px;
  z-index: 1000;
}

h2,
p,
h3,
h4,
h5 {
  text-align: center;
}

.search-form.show {
  display: block;
  /* Afficher lorsque activé */
}

/* Votre CSS existant */

/* Style pour la petite croix */
.clear-input {
  position: absolute;
  right: 5px;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  color: red;
  display: none;
  /* Masquer initialement la petite croix */
  /* Styles supplémentaires */
}

/* Alignement et style pour le conteneur de la zone de recherche */
.search-input-container {
  position: relative;
}

footer {
  position: relative;
  /* Utilisez "relative" au lieu de "fixed" */
  left: 0;
  bottom: 0;
  width: 100%;
  text-align: center;
  background-color: #333;
  color: #fff;
  padding: 10px;
  margin-top: auto;
  overflow-x: hidden;
}

/* Styles de base pour la table */
table {
  border-collapse: collapse;
  width: 100%;
  max-width: 500px;
  /* Limite la largeur maximale du tableau à 500 pixels */
  margin: 0 auto;
  /* Centre le tableau horizontalement */
}

th,
td {
  border: 1px solid #ccc;
  padding: 10px;
  text-align: center;
}

th {
  background-color: #f2f2f2;
  /* Couleur de fond pour les en-têtes de colonne */
}

tr:nth-child(even) {
  background-color: #f9f9f9;
  /* Couleur de fond pour les lignes paires */
}

/* Réglages spécifiques pour les th et td */
th,
td {
  padding: 8px;
  text-align: left;
  border-bottom: 1px solid #ddd;
  /* Ajoute une bordure inférieure pour les cellules */
}

tr:nth-child(even) {
  background-color: #f2f2f2;
  /* Couleur de fond pour les lignes paires */
}

/* Réglages spécifiques pour les th */
th {
  background-color: #007bff;
  /* Couleur de fond pour les en-têtes de colonne */
  color: white;
  /* Couleur du texte pour les en-têtes de colonne */
}

/* Ajoutez ce code à votre feuille de style CSS */
#backToTopBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 20px;
  background-color: #007bff;
  color: #fff;
  border: none;
  border-radius: 5px;
  padding: 10px;
  font-size: 16px;
  cursor: pointer;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

#backToTopBtn:hover {
  background-color: #0056b3;
}