Lets create a responsive blog for coffee lovers!

Example:

• mobile:

• desktop:

Exercise Instructions

Create the following blog page using media queries for a mobile and desktop view.

Task 1:

• Carefully study the style.css file. Use provided style variables while writing your code.

• Use the example template to create a blog. Use the mobile first technic.

Task 2:

• Use media queries to set the breakpoint of the view at 768px

Task 3:

• Hide the aside section when the breakpoint will be less than 768px. It should appear only when the breakpoint is higher than 768px.

Hints:

• Use classes.

• Create sections.

• Media Queries Docs

• CSS display property

• CSS variables