/* mise en colonnes*/
.cols {
    padding: 0;
    columns: 6; /* nombre de colonnes*/
    column-gap: 15px; /* espacement etre chaque colonne*/
}
p {
    break-inside: avoid; /* empêche un paragraphe, une photo d'être coupée en deux colonnes*/
    margin: 0 0 20px;
    transition: transform 0.3s ease, opacity 0.3s ease;
    overflow: hidden;
    border-radius: 20px;
    position: relative;
}
img {
    width: 100%; /* pourcentage de remplissage du contenant*/
    object-fit: cover; /* garde les proportions d'origine*/
    display: block;
    height: 100%;
}

p:hover {
    z-index: 1;
}
p {
    position: relative;
}

p:hover {
	filter: grayscale(0);
    transform: scale(1.1);
}

/* le texte dans strong n'apparait pas sans être survolé */  
p strong {
    display: none;
}