        body {
            margin: 0;
        }

        ul {
            list-style-type: none;
            padding: 0;
        }

        li {
            margin-bottom: 10px;
            display: flex;
            align-items: center;
        }

        .preview {
            position: absolute;/* empeiche de faire bouger le texte */
    	    top: 50%;/* centre la previsualisation */
    	    left: 50%;/* centre la previsualisation*/
    	    transform: translate(-50%, -50%);/* centre la previsualisation */
            width: 30vw; /* 1/3 of the viewport width */
            height: 30vw;   /* 25% of the viewport width */
            overflow: hidden;
            margin: 0 auto; /* Ajout de cette ligne pour centrer horizontalement */
            display: none;
            border: 1px solid #ccc; /* Ajoute un cadre de 1 pixel de largeur, de couleur grise claire, autour des prévisualisations */
        }
	a:hover {
	    color: blue;
	}

        .preview img {
            width: 100%;
            height: auto;
        }

        a {
            text-decoration: none;
            color: #000;
        }
        
        button {
    background-color: #4CAF50; /* Couleur de fond du bouton */
    color: white; /* Couleur du texte du bouton */
    border: none; /* Supprime la bordure du bouton */
    padding: 10px 20px; /* Ajoute un rembourrage autour du texte du bouton */
    text-align: center; /* Centre le texte du bouton */
    text-decoration: none; /* Supprime la décoration du texte du bouton */
    display: inline-block; /* Affiche le bouton en ligne avec le texte */
    font-size: 16px; /* Taille de la police du texte du bouton */
    margin: 4px 2px; /* Marge autour du bouton */
    cursor: pointer; /* Change le curseur en pointeur lorsque la souris passe sur le bouton */
}

button:hover {
    background-color: #3e8e41; /* Couleur de fond du bouton lorsque la souris passe dessus */
}

