2nd Attempt HTML/CSS With BEM Naming Convention

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

This challenge was a true first attempt with no tutorials and purely just reading the web documents to find solutions to how I thought the project should be tackled.

I am pleased with the naming convention (I know it could be improved and some of the organization on the CSS got sloppy as I attempted solutions).

I am extremely pleased with the custom markers and also making the table work properly (in my humble opinion) for the site.

I dont think the media break point is at a great size and I'm not sure how to properly scale things down to a good, commonly used breakpoint.

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

The biggest challenge hands down had to be the list markers. I fought for literally WEEKS just trying to find any way to properly space the markers and not mess with the line spacing for each list item but I finally gave up and realized that the functionality did not exist on the ::marker pseudo.

That being said, I learned a LOT about markers and how to properly search and research so, silver lining.

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

I would like to know any tips or tricks people use to find the right sizes for the font size, margins, paddings etc. I know the projects dont give this information but I find it a little counter-productive/defeating that the project goal is to get it as close as possible to the images, but the images arent properly to scale so when you complete the project, it doesnt look right at all.

I would also like to make sure that I was using the correct units when setting margins and paddings.

lastly, I would like any tips and tricks to condense down the class usage. I know I repeated the same steps several times in the code, I just could not think of a simple and clear name to place on each section.