how do manipulate css to make it look like pucs?

L PROJECT DIFFICULTY LEVEL: Intermediate Overview the flexbox layout mode and media queries to create a responsive layout. Instructions Open chapter07-project02.html in the browser. You will be modifying the CSS 1. ,. Modify styles.css and float the chi- in the header to the left and the vertical 3, Right now each card fills the entire width of the available space. Change the only. line menu image to the right. width of the card class to24%. By taking less than a quarter of the available e, we will eventually be able to fit four cards on a row. yow we need to use the flexbox mode. You will need to add display:flex to the cards class 5. Cha nge the max-width property of the

image to 100%. 6. Modify the card class by setting its flex property to 0 1 auto. Test in browser. Set the justify-content, align-items, and flex-wrap properties appropriately in ord er to achieve a layout similar to that shown in Figure 7.56