HTML FLEX AND CSS SOLUTION

Hello Nathan 👋,

had a chance to have a look at your solution and let me first walk through the items you mentioned in the blockers section:

• You should be able to use SVG in a static document. Checkout this article. Just one note, don't use <i> tag. I know this is sometimes utilized when people are using Font Awesome, but i != image/icon. It's an old tag pre HTML5 which was used for italic texts. It's used with icons but it shouldn't. https://stackoverflow.com/questions/17471390/how-to-use-i-tag-with-icons. Using an SVG or img should work. If an SVG doesn't work, double-check the export.

• The overlay position. Do you still have a problem? I looked into the preview site and it looks great.

• Re: "Jules Wyvern": I have access to figma and the particular section should be 400.

And here is a bit of an observation

• CSS looks good, but I think you should consider utilizing CSS variables to reduce some duplicities.

• You shouldn't use absolute values for font sizes. The reason is accessibility. Here is a good article about it.

• You might also double the line-height. The frontend mentor challenges usually have some tweaks in it. If you specify it, use a ration value rather than a specific unit. Another good article related to this.

But in general, you had done a great job, especially as this has been your first challenge solution.