:root {
font-size: 62.5%;
}  .backend a {
pointer-events: none !important;
}
.block-membre {
display: flex;
flex-wrap: wrap;
justify-content: start;
align-items: start;
gap: clamp(1.5rem, 0.0274509804 * (100vmin + 100vmax) / 2, 2.8rem);
}
.block-membre > * {
flex: 0 0 calc(100% / var(--nbr-col) - clamp(1.5rem, 0.0274509804 * (100vmin + 100vmax) / 2, 2.8rem) * (var(--nbr-col) - 1) / var(--nbr-col));
}
@media screen and (max-width: 781px) {
.block-membre > * {
flex: 0 0 calc(33.3333333333% - clamp(1.5rem, 0.0274509804 * (100vmin + 100vmax) / 2, 2.8rem) * 2 / 3);
}
}
@media screen and (max-width: 420px) {
.block-membre > * {
flex: 0 0 calc(50% - clamp(1.5rem, 0.0274509804 * (100vmin + 100vmax) / 2, 2.8rem) / 2);
}
}
.block-membre > * .membre-photo-container {
position: relative;
width: 100%;
aspect-ratio: 2/3;
overflow: hidden;
}
.block-membre > * .membre-photo-container .membre-photo {
display: block;
width: 100%;
aspect-ratio: 2/3;
object-fit: cover;
transition: transform 0.5s ease-out;
}
.block-membre > * .membre-photo-container:hover .membre-photo {
transform: scale(1.1);
}
.block-membre > * .membre-photo-container::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #2735DB;
mix-blend-mode: screen;
transition: width 1s ease-in-out;
}
.block-membre > * .membre-photo-container.visible::after {
height: 0%;
}
.block-membre > * .membre-name {
color: #2735DB;
}
.block-membre > *:nth-child(3n+1) .membre-photo-container::after {
transition: height 1s ease-in-out;
}
.block-membre > *:nth-child(3n+2) .membre-photo-container::after {
transition: height 1s ease-in-out 0.3s;
}
.block-membre > *:nth-child(3n+3) .membre-photo-container::after {
transition: height 1s ease-in-out 0.6s;
}