Create layout for the design below. For each element use appropriate HTML tag, according to it's semantics.
Consider using following tags:
Header
Footer
Main
Nav
Menu
Menuitem
Article
Section
P (paragraph)
Aside (for ad)
H1 (headline)
There are links in the menu (each link takes all available space and they all are placed evenly). When you place the cursor above – a link is highlighted with underline. Disable it and make the hover effect like this:
background color becomes 30% lighter;
text color changes to 85% black color (rgba(0, 0, 0, 0.85));
all changes are smooth (use transition property). Learn how does transition work in CSS and use it properly to animate hover effect for links.
Add 2 types of lists to the article text: ol and ul.