All solutions

Any feedback for cleaner and more efficient code is welcome!

This challenge was certainly just that for me. Can someone please help me out with the icon overlay hover opacity?? I could not figure out how to get the cyan background to be someone see-through but not the eye image itself.

And I'm open to all other feedback! This CSS felt all over the place for me, so I'm sure there are a lot of things that could have been done better.

This proved to be more of a challenge than I thought it would be, but once I utilized display: grid;, things started coming together. If I could have used the combination of grid and flex in a more seamless way, I'd love to know how. And any and all other feedback is welcome!

I know pixel perfection is nearly if not completely impossible, but I felt like there was a way to get the text to look more similar to the design. Is there something I could have done better with that?

Also I was wondering if I could get an explanation of the difference (if there is any) between doing @import in CSS and rel=preconnect in HTML for implementing a font?

And of course, if there is any other feedback, I'm happy to read it!

I am still very new to all things web development. I don't know enough to create good questions, but any and all feedback is appreciated! Also if there is a way my code could have been written cleaner, please let me know.