summary: "Style the beets HTML file from the previous week to match the screenshots." time: "1.5 hours" deliverables: "1 HTML file, 1 CSS file, images"

Stylish beets

Fork this repository.
Copy the index.html and the images folder from last week’s beets code into this repo.
Attach a new CSS file, main.css, and style colors and typography of the beets website.
Resize your browser window so it isn’t as wide.
Don’t worry too much about the visual spacing in the design—we’ll look at that next week.
Pay careful attention to all the small details that are changed.
Run it through Markbot and make sure it passes all the checks.

Typefaces: PT Sans (bold), PT Serif (regular, italic, bold) — from Google Fonts
Text sizes: 1.5rem, 1.125rem, 0.8rem
Line height: 1.5
Colours: #c9b5ab, #8f2440, #222, #3f1622

Visually match the images in the “screenshots” folder and create the interaction shown in the linked video.

Drop this folder into your Markbot application. Make sure to fix all the errors. And submit for grades using Markbot.