Flex box, mobile first design, semantic html

Hi, nice result for this challenge, it looks good and it works. Well done! I like how the code is organized in all files but there are some things i noticed i don't like in your html.

• The id must be unique, you can't use it for more items.

• for attribute in labels should perfectly match the input id

• The <section></section> element was invented as a generic wrapper for headings so i think its use must be very limited for that purpose but in that case i prefer the <article></article> element which is semantic, so the word section make me think of a block of code, and i used to use it as you did, then i found out that the word section is measleading!

• Headings must increase by one, so basically you can't write <h4></h4> and then <h2></h2>, also the browser always expect to find a presentation heading <h1><h1>, so if the layout can't be built following a strict order, well, just forget about headings, <span><span> or <p></p> can be used, plus the right attributes to make it accessible.

Hope it helps a little, keep coding :-)