All solutions

What are you most proud of, and what would you do differently next time?

I am proud to have understood how to generate a well-defined and organized layout. Next time I will take more time to organize my layout well before everything else.

What challenges did you encounter, and how did you overcome them?

First I used float to place the cards but they did not look the way I wanted, then I reviewed the information and saw that I could apply both flex and grid

What specific areas of your project would you like help with?

I have done everything. But I would like to know an alternative to making the colored top lines of the cards.

What did you find difficult while building the project? In this project it was difficult to locate the two background images, I did not know how to use these properties correctly. That is, combine them so that they look like one.

Which areas of your code are you unsure of?

body{
    background-image: url(./images/bg-pattern-top.svg), url(./images/bg-pattern-bottom.svg);
    background-position: right 51vw bottom 20vh, left 45vw top 50vh;}

Do you have any questions about best practices? I would like to know other way to do this combination of images.

I couldn't use the min-width property correctly. How to properly use the min max width and height properties?

It was a challenge to imagine how to place the hover of the image.

I'm just not sure my solution is the best idea.

     <div class="image">
          <div class="eye-image"></div>
       </div> 

How to stack images and make one of them appear whenever you want?

Try to use grid but still need to reaffirm the knowledge, just use flexbox

I would like to learn how to modify svg files.

Can I use grid with this excercise?