HTML, CSS , Flexbox

Greetings Jack. Some issues raised in the automated feedback includes

• a document should have a main landmark . Navigating a web page is far simpler for screen reader users if all of the content splits between one or more high-level sections. Content outside of these sections is difficult to find, and its purpose may be unclear.
• a site should have the first heading element (h1)
• the hover effect on the card is scaling way too much in my opinion

Aim to use semantic tags when writing html. I would change div class="card" to main class="card". I'll also wrap the image in an h1. I see that you wrote two separate codes for the two screen sizes. Instead of that, I would recommend that you write the mobile code as your base code, then make a media query for the bigger size. For example, you can give a max-width to something, and then in the media query for the bigger size, you would just increase the max-width. That way you're building a responsive design but also doing less work

you did great though. that's ^ just a way for u to upgrade ur behind-the-scene skills