Primer maquetado, uso de herramientas CSS y HTML

Hola mi nombre es Ignacio, llevo 3 meses estudiando HTML y CSS y este es mi primer maquetado. Estoy contento con el resultado pero no logre resolver del todo bien el "hover" azulado al pasar el mouse por encima de la imagen como lo pedia la consigna. Mi estrategia para esto fue la siguiente: -Poner la imagen en "position: relative" -Crear un contenedor del mismo tamaño de la imagen a cubrir -Declarar "position: absolute" al contenedor para que tome como referencia la posicion de la imagen a cubrir. -Ajustar la posicion del contenedor con la propiedad "left" y "bottom" -Declare "media queries" para que el contenedor coincida en los distintos tipos de pantallas. Sabiendo que no era esta la forma correcta de lograrlo, preferi intenarlo para el menos acerecarme a un mejor resultado. Gracias por leerme, espero su correccion Saludos!