/* Général */
body {
  font-family: Arial, sans-serif;
  margin: 0;
  padding: 0;
  background-color: #f8f9fa;
}

header {
  background-color: #f8f9fa;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.card {
  border: none;
}

.card img {
  height: 100px;
  object-fit: contain;
}

footer {
  background-color: #343a40;
  color: #fff;
}

footer p {
  margin: 0;
  font-size: 14px;
}

/* Responsive design */
@media (max-width: 768px) {
  .card img {
    height: 80px;
  }
}
.logo {
  width: 150px; /* Définir une largeur fixe */
  height: auto; /* Conserver les proportions */
}

/* Applique Flexbox à la page */
html,
body {
  height: 100%; /* Assurez-vous que la page occupe toute la hauteur de l'écran */
  margin: 0;
  display: flex;
  flex-direction: column; /* Organise les éléments en colonne */
}

/* Conteneur principal, occupe l'espace restant */
.content {
  flex: 1; /* Prend tout l'espace restant disponible */
}

/* Style du footer */
footer {
  margin-top: auto; /* Pousse le footer au bas de la page */
}

/* Vous pouvez également personnaliser le style du footer comme vous le faites déjà */
footer {
  background-color: #343a40;
  color: white;
  padding: 1rem;
}