- Create a new branch from the Out of This World project.
- Set up a server to run the project.
- In your project directory, create a directory called 'stylesheets'.
- Inside the stylesheets directory, create an external stylesheet called styles.css
- In your index document, link to the external stylesheet.
- Besides adding the link to the stylesheet, do not add any additional markup to the index file.
- In the external stylesheet, style the page to meet the following requirements.
- Give all the content a max-width of 900px and center the content on the page.
- Style the text and use at most 3 Google Fonts. You will have to @import your fonts into the styles.css file. Use at least font-size, color, and line-height (you can use more properties!).
- Use a background image
- Style the hover state of at least 1 item on the page
- Add padding and margins
- Utilize at least 1 CSS transition
- Use a border or partial border somewhere
- Add additional styling if you want to!
- Go above and beyond!
- Besides adding the link to the stylesheet, do not add any additional markup to the index file.
- Do not use default fonts.
- Do not style the properties 'display', 'visibility', and 'position' (for now).
- Do not use flexbox sizing (for now).
- Do not create a multi-column layout (for now).
- Do not use SASS or LESS.
- Do not use frameworks or libraries.
- Do not use LiveReload.
If you already know basic styling and want to focus on UI/Design, shout @ Kelli when done to get 'Design Directives'