There is a lot of javascript used in this website, making the code difficult to understand. If I simplified this website, I would decrease the amount of javascript and make it less decorative. There's lots of decorative elements to this websites, kind of taking away from the product. Because there's so many animations going on, it's not able to be used on mobile devices and makes your computer lag when you scroll.

1. Why does this element have that class applied to it? What could it be used for? Does the class have semantic meaning (e.g. "article-grid)?

There's a lot of elements, but one I saw a lot is 'span'.

2. What is each "container" doing? Is it providing extra structure? Is it a stand-alone container for some interactive element? It is a part of the navigation? Is it part of the main content, or does it feel secondary? Each container seperates each section of the website. There is the title, and then there are other sections with recipes and other fun facts.

3. What are the components of the site? If it's a news site, what element represents an article? If its a fashion e-commerce site, what element represents a shop-able item? How are these structured?

Yes this is a website where you can buy the drink. There is a link at the bottom to where you can buy the drink, as well as contact the business.

4. Poke around in Dev Tools! What happens if this class is not applied to the element (double-click the target's class attribute in the Element Pane and remove the class? What

When I take away these elements, it sort of breaks the page.