.entete {
    text-align: center;
}

.portraits {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(250px,1fr));
}

.portraits div {
    text-align: center;
}

.portraits h3 {
    margin: -30px 0 30px 0;
}

.face {
    width: 250px;
    height: 250px;
    transition: opacity 2s;
    /* background-color: aqua; */
}

.box:hover .face {
    opacity: 0;
    animation: rotate 2s;
}

@keyframes rotate {
    100% {
        transform: rotate(360deg);
    }
}

h3 {
    transition: 2s scale;
}

.box:hover h3 {
    scale: 1.4;
}