Build all and check

en/meta.yml

@@ -22,8 +22,8 @@ steps:
   completion:
   - engaged
 - title: Telling your story
-- title: Finding your own images
-- title: Uploading images
   completion:
   - internal
+- title: Challenge
+  challenge: true
 - title: What can you do now?

en/step_4.md

@@ -1,15 +1,56 @@
-## Finding your own images
+## Challenge
 
-Let's find an image on the web to add to your story.
+--- challenge ---
 
-+ Go to [this page](http://jumpto.cc/html-images){:target="_blank"}, and find an image that you want to include in your story.
+Edit the CSS code to customise your webpage. 
 
-+ Right-click the image, and click **Copy Image URL** (or **Copy Image Address**, depending on the computer you are using). The URL is the address of the image.
+--- task ---
+Click on the file `style.css`:
 
-![screenshot](images/story-url.png)
+![A screenshot of the UI for the code editor with the file style.css highlighted](images/codeed-css.png)
 
-+ Go back to your `index.html` page.
+--- /task ---
 
-+ Paste the URL between the speech marks in your `<img>` tag. You should see your image appear!
+--- task ---
+Find the style for the body, and change the font. 
 
-![screenshot](images/story-image.png)
+You can choose different fonts such as:
++ <span style="font-family: Arial;">Arial</span>
++ <span style="font-family: Impact;">Impact</span>
++ <span style="font-family: Tahoma;">Tahoma</span>
+
+--- code ---
+---
+language: css
+line_numbers: true
+line_number_start: 1
+line_highlights: 3
+---
+body {
+  background-color: white;
+  font-family: Comic Sans MS;
+}
+--- /code ---
+--- /task ---
+
+--- task ---
+Change the background colour to a different colour:
+
+--- code ---
+---
+language: css
+line_numbers: true
+line_number_start: 1
+line_highlights: 2
+---
+body {
+  background-color: white;
+  font-family: Comic Sans MS;
+}
+--- /code ---
+
+Find more CSS colour names [here](http://jumpto.cc/colours){:target="_blank"}.
+
+--- /task ---
+
+--- /challenge ---

en/step_5.md

@@ -1,26 +1,11 @@
-## Challenge
+## What can you do now?
 
---- challenge ---
+If you are following the [HTML and CSS: Module 1](https://projects.raspberrypi.org/en/pathways/webdev-module-1) pathway, you can move on to the [Wanted](https://projects.raspberrypi.org/en/projects/wanted) project. In this project, you will learn how to make your own poster.
 
-Use what you've learnt in this project to finish telling your story! Here's an example:
+--- print-only --- 
 
-![A cartoon with six panels in, each with part of a story](images/story-final.png)
+![ALT TEXT](images/wanted-final.png)
 
-Edit the HTML and CSS code to customise your webpage.
+--- /print-only ---
 
-![screenshot](images/story-changes.png)
-
-The HTML content can be found in the `index.html` file, and the CSS style in the `style.css` file.
-
-![screenshot](images/story-files.png)
-
-You can also alter the colours used in the webpage, and you can use different fonts such as:
-+ <span style="font-family: Arial;">Arial</span>
-+ <span style="font-family: Comic Sans MS;">Comic Sans MS</span>
-+ <span style="font-family: Impact;">Impact</span>
-+ <span style="font-family: Tahoma;">Tahoma</span>
-
-Find more CSS colour names [here](http://jumpto.cc/colours){:target="_blank"}.
-
-
---- /challenge ---
+Or, why not try out another [HTML](https://projects.raspberrypi.org/en/projects?software%5B%5D=html-css-javascript) project.