/*////////////////////////
Titre
////////////////////////*/

.lettre
{
	opacity: 0;
	filter: blur(20px);
	animation: texteApparait .5s forwards;
}
@keyframes texteApparait 
{
	to
	{
		opacity: 1;
		filter: blur(0);
	}
}

/*////////////////////////
Accroche
////////////////////////*/

.accroche 
{
	opacity: 0;
	animation: elementApparition .5s ease-out forwards;
	animation-delay: .5s;
}
@keyframes elementApparition
{
	to { opacity: 1; }
}

/*////////////////////////
Grille
////////////////////////*/

.catalogue
{
	animation: elementApparition .4s ease-out forwards;
	animation-delay: 1s;
	opacity: 0;
	/* padding-bottom: 1rem; */
}
.colonne 
{ 
	display: flex;
	justify-content: stretch;
	align-items: stretch;
	/* padding-bottom: .4rem;  */
}
.colonne a
{
	border-radius: var(--border-radius);
}
.colonne a div
{
	display: block;
	transform: scale(1);
	transition: opacity .2s ease-in-out, transform .3s ease-out;
}
.colonne img
{
	border-radius: var(--border-radius);
	width: 100%;
	height: auto;
	margin-bottom: .5rem;
}
/* @media (min-width: 600px)
{
	.catalogue {padding-bottom: 0;}
} */
@media (min-width: 600px) and (max-width: 1365px)
{
	/* .catalogue { padding-bottom: 5.5rem; } */
	/* .colonne { padding-bottom: .4rem; } */
	.colonne img { margin-bottom: .6rem; }
}
@media (min-width: 1366px)
{
	/* .catalogue { padding-bottom: 6.6rem; } */
	/* .colonne { padding-bottom: 1rem; } */
	.colonne img { margin-bottom: .8rem; }
}
.colonne .petit
{
	color: var(--couleur-secondaire);
}
@media (hover: hover)
{
	.catalogue a:hover div
	{
		opacity: .6;
	}
}
.catalogue a:active div
{
	transform: scale(.85);
	/* pas d'anim à l'entrée de l'état : */
	transition: none;
}
