/* Style pour le corps */

body {
    background-image: url('../image/fondecran.jpeg'); /* ou .png, .webp selon ton format */
    background-size: cover; /* pour que l'image couvre tout l'écran */
    background-position: center; /* pour centrer l'image */
    background-repeat: no-repeat; /* pour éviter que l'image se répète */
  }

/* Style pour les images */
img {
    max-width: 60px;
    max-height: 60px;
    height: auto;  
    width: auto;
    padding: 5px;
    margin-left: 20px;                     
    display: inline-block; /* Meilleure intégration */
}

/* Style pour les tableaux */
td, tr {
    border: 1px solid #ddd; /* Bordure subtile */
    width: 300px;
    height: 150px; /* Réduction de hauteur */
    padding: 10px; /* Ajout d'espace interne */
    text-align: center;
    background-color: #fff; /* Fond blanc pour contraste */
}

/* Style de la navbar */
.navbar {
    background-color: #444; /* Couleur plus neutre */
    overflow: hidden;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Effet de profondeur */
}
.navbar ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: flex; /* Aligne les éléments horizontalement */
    justify-content: center; /* Centrage de la navbar */
}

.navbar ul li {
    margin: 0;
}

.navbar ul li a {
    display: block;
    color: #fff; /* Texte blanc */
    text-align: center;
    padding: 10px 20px;
    text-decoration: none;
    font-size: 16px; /* Taille de texte équilibrée */
    transition: background-color 0.3s, color 0.3s; /* Animation au survol */
}

.navbar ul li a:hover {
    background-color: #1e90ff; /* Couleur dynamique */
    color: #fff; /* Conserve le texte blanc */
}

/* Style pour les paragraphes */
p {
    background-color: #fafafa; /* Fond doux */
    width: 300px;
    border: 5px solid #1e90ff; /* Bordure fine et élégante */
    padding: 20px;
    margin: 20px auto; /* Centrage horizontal */
    border-radius: 10px; /* Coins arrondis */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Effet de profondeur */
    text-align: center; /* Centrage du texte */
}

/* Ajout de transitions pour une expérience fluide */
* {
    transition: all 0.3s ease-in-out;
}

/* Style de base pour le tableau avec des bordures */
td, tr {
    border-color: rgb(255, 0, 0);
    border-style: solid;
    border-width: thin;
    width: 300px;
    height: 200px;
}