body {
background-color: black;
color: red;
}

blocks {
display: grid;
padding: 1rem;
grid-gap: 1rem;
grid-template-columns: repeat(9,1fr);
}
@media(max-width: 1700px) {

blocks {grid-template-columns: repeat(7,1fr);}
}
@media(max-width: 1500px) {

blocks {grid-template-columns: repeat(5,1fr);}
}
@media(max-width: 1100px){

blocks {grid-template-columns: repeat(3,1fr);}
}
@media(max-width: 700px){

blocks {grid-template-columns: repeat(1,1fr);}
}

figure {
background-color: red;
animation: 0.5s linear opp infinite;
}

@keyframes opp {
0%{background-color: red; filter:saturate(2)}
50%{background-color: black; filter:saturate(1)}
100% {background-color: red; filter:saturate(2)}
}
img { vertical-align: middle; width: 100%; mix-blend-mode: difference}