/* Supprimer le soulignement des liens dans les cartes */
.card a {
   text-decoration: none;
   color: inherit;
}

/* Ajouter un effet de surélévation aux cartes */
.card {
   transition: transform 0.2s, box-shadow 0.2s;
}

.card:hover {
   transform: translateY(-10px);
   box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.card-img-top {
   height: 400px; /* Set a fixed height for the images */
   object-fit: cover; /* Ensure the image covers the area */
   transition: transform 0.3s ease; /* Smooth zoom effect */
   border-radius: 5px 5px 0 0; /* Rounded corners for the top image */
}

.card-img-top:hover {
   transform: scale(1.05); /* Slight zoom effect */
}

.card-footer {
   text-align: center;
   background-color: #f8f9fa;
   border-top: 1px solid #e9ecef;
}

/* Améliorez les titres */
h1, h2, h3, h4 {
   color: #333;
   text-transform: uppercase;
   letter-spacing: 1px;
   margin-bottom: 20px;
}

h1 {
   font-size: 2.5em;
}

h2 {
   font-size: 2em;
}

/* Améliorez les liens de navigation */
.nav-link {
   color: #f8f9fa;
   transition: color 0.3s ease, border-bottom 0.3s ease;
}

.nav-link:hover {
   color: #ffffff;
   border-bottom: 2px solid #ffffff;
}

/* Ajoutez des couleurs et une mise en forme améliorée */
body {
   background-color: #f4f4f4;
   color: #555;
}

header, footer {
   background-color: #343a40;
   color: #f8f9fa;
}

footer a {
   color: #f8f9fa;
   text-decoration: none;
}

footer a:hover {
   text-decoration: underline;
}

/* Ajoutez une bordure et un rayon aux images */
.card-img-top {
   border-radius: 5px 5px 0 0;
   border-bottom: 5px solid #ddd;
}