Html_css_card_projrct

👾Hello Fathy, congratulations for your new solution!

I liked a lots the custom hover effect you've applied in the image while hovering. If you want give some more features to this images you can play around with some other effects as filter: saturate (2); or filter: grayscale(100);.

The component isn't properly align due the lack of some properties inside the body to make the child element align with flex and min-height. See the corrections below for the alignment:

body {
    display: flex;
    margin: 0;
    justify-content: center;
    min-height: 100vh;
    align-items: center;
}

Hope it helps and happy coding!