diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-011.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-011.md
index 6709dda70d..adffd59577 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-011.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-011.md
@@ -9,7 +9,7 @@ dashedName: step-11
It's time to add some color to the page. Remember that one way to add color to an element is to use a color keyword like `black`, `cyan`, or `yellow`.
-Use a `class` selector to target `marker` and apply a background color to it. As a reminder, here's how to target the `class` `freecodecamp`:
+Use a class selector to target `marker` and apply a background color to it. As a reminder, here's how to target the `class` `freecodecamp`:
```css
.freecodecamp {
@@ -21,7 +21,7 @@ Create a new CSS rule that targets the `marker` `class`, and set its `background
# --hints--
-You should create a `class` selector to target the `marker` `class`.
+You should create a class selector to target the `marker` `class`.
```js
assert(new __helpers.CSSHelp(document).getStyle('.marker'));
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-012.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-012.md
index ebe8571900..cd8da44b1a 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-012.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-012.md
@@ -7,7 +7,7 @@ dashedName: step-12
# --description--
-Notice that your marker doesn't seem to have any color. The background color was actually applied, but since the `marker` `div` element is empty, it doesn't have any width or height by default.
+Notice that your marker doesn't seem to have any color. The background color was actually applied, but since the marker `div` element is empty, it doesn't have any width or height by default.
In your `.marker` CSS rule, set the `width` property to `200px` and the `height` property to `25px`.
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-015.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-015.md
index 4bedf7485e..35afa215dd 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-015.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-015.md
@@ -7,7 +7,7 @@ dashedName: step-15
# --description--
-While you have three separate `marker` elements, they look like one big rectangle. You should add some space between them to make it easier to see each element.
+While you have three separate marker `div` elements, they look like one big rectangle. You should add some space between them to make it easier to see each element.
When the shorthand `margin` property has two values, it sets `margin-top` and `margin-bottom` to the first value, and `margin-left` and `margin-right` to the second value.
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-016.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-016.md
index 16e5a947db..c2c4655881 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-016.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-016.md
@@ -11,18 +11,18 @@ In school, you might have learned that red, yellow, and blue are primary colors,
These days, there are two main color models: the additive RGB (red, green, blue) model used in electronic devices, and the subtractive CMYK (cyan, magenta, yellow, black) model used in print. In this project you'll work with the RGB model.
-First, add the `class` `one` to the first `marker` `div` element.
+First, add the `class` `one` to the first marker `div` element.
# --hints--
-You should add the `class` `one` to the first `marker` `div` element in the `container` `div`.
+You should add the `class` `one` to the first marker `div` element in the `container` `div`.
```js
const containerFirstChild = [...document.querySelector('.container')?.children][0];
assert(containerFirstChild?.classList?.contains('one'));
```
-Your first `marker` `div` should have the classes `marker` and `one`.
+Your first marker `div` should have the classes `marker` and `one`.
```js
const containerFirstChild = [...document.querySelector('.container')?.children][0];
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-018.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-018.md
index 7b9b4fcb9c..c26c1289ea 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-018.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-018.md
@@ -11,7 +11,7 @@ Then, create a new CSS rule that targets the `class` `one` and set its `backgrou
# --hints--
-You should use a `class` selector to target the `class` `one`.
+You should use a class selector to target the `class` `one`.
```js
assert(new __helpers.CSSHelp(document).getStyle('.one'));
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-019.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-019.md
index 886d9c9080..9cc0325d30 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-019.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-019.md
@@ -7,32 +7,32 @@ dashedName: step-19
# --description--
-Add the `class` `two` to the second `marker` `div`, and the `class` `three` to the third `marker` `div`.
+Add the `class` `two` to the second marker `div`, and the `class` `three` to the third marker `div`.
# --hints--
-You should add the `class` `two` to the second `marker` `div` element in the `container` `div`.
+You should add the `class` `two` to the second marker `div` element in the `container` `div`.
```js
const containerSecondChild = [...document.querySelector('.container')?.children][1];
assert(containerSecondChild?.classList?.contains('two'));
```
-Your second `marker` `div` should have the classes `marker` and `two`.
+Your second marker `div` should have the classes `marker` and `two`.
```js
const containerSecondChild = [...document.querySelector('.container')?.children][1];
assert(containerSecondChild?.classList?.contains('marker') && containerSecondChild.classList?.contains('two'));
```
-You should add the `class` `three` to the third `marker` `div` element in the `container` `div`.
+You should add the `class` `three` to the third marker `div` element in the `container` `div`.
```js
const containerThirdChild = [...document.querySelector('.container')?.children][2];
assert(containerThirdChild?.classList?.contains('three'));
```
-Your third `marker` `div` should have the classes `marker` and `three`.
+Your third marker `div` should have the classes `marker` and `three`.
```js
const containerThirdChild = [...document.querySelector('.container')?.children][2];
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-020.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-020.md
index 73dd634c8d..6fd3d763cf 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-020.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-020.md
@@ -13,7 +13,7 @@ Also, create a separate CSS rule that targets the `class` `three` and set its `b
# --hints--
-You should use a `class` selector to target the `class` `two`.
+You should use a class selector to target the `class` `two`.
```js
assert(new __helpers.CSSHelp(document).getStyle('.two'));
@@ -25,7 +25,7 @@ Your `.two` CSS rule should have a `background-color` property set to `green`.
assert(new __helpers.CSSHelp(document).getStyle('.two')?.backgroundColor === 'green');
```
-You should use a `class` selector to target the `class` `three`.
+You should use a class selector to target the `class` `three`.
```js
assert(new __helpers.CSSHelp(document).getStyle('.three'));
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-021.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-021.md
index 9f8fb56bde..2cf28a3898 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-021.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-021.md
@@ -15,7 +15,7 @@ Create a new CSS rule that targets the `container` `class` and set its `backgrou
# --hints--
-You should use a `class` selector to target the `container` `class`.
+You should use a class selector to target the `container` `class`.
```js
assert(new __helpers.CSSHelp(document).getStyle('.container'));
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-024.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-024.md
index f8f86fc843..fb48d0acf4 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-024.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-024.md
@@ -9,7 +9,7 @@ dashedName: step-24
While the red and blue markers look the same, the green one is much lighter than it was before. This is because the `green` color keyword is actually a darker shade, and is about halfway between black and the maximum value for green.
-In the `two` CSS rule, set the green value in the `rgb` function to `128` to lower its intensity.
+In the `two` CSS rule, set the green value in the `rgb` function to `127` to lower its intensity.
# --hints--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-035.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-035.md
index 040c747771..3825b561e9 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-035.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-035.md
@@ -9,14 +9,26 @@ dashedName: step-35
Now that you've gone through all the primary, secondary, and tertiary colors on a color wheel, it'll be easier to understand other color theory concepts and how they impact design.
-First, in the `.one`, `.two`, and `.three`, adjust the values in the `rgb` function so that the `background-color` of each element is set to pure black.
+First, in the rules `.one`, `.two`, and `.three`, adjust the values in the `rgb` function so that the `background-color` of each element is set to pure black. Remember that the `rgb` function uses the additive color model, where colors start as black and change as the values of red, green, and blue increase.
# --hints--
-Test 1
+Your `.one` CSS rule should have a `background-color` property set to `rgb(0, 0, 0)`.
```js
+assert(new __helpers.CSSHelp(document).getStyle('.one')?.backgroundColor === 'rgb(0, 0, 0)');
+```
+Your `.two` CSS rule should have a `background-color` property set to `rgb(0, 0, 0)`.
+
+```js
+assert(new __helpers.CSSHelp(document).getStyle('.two')?.backgroundColor === 'rgb(0, 0, 0)');
+```
+
+Your `.three` CSS rule should have a `background-color` property set to `rgb(0, 0, 0)`.
+
+```js
+assert(new __helpers.CSSHelp(document).getStyle('.three')?.backgroundColor === 'rgb(0, 0, 0)');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-036.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-036.md
index 3f321449c9..2c968cf9ce 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-036.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-036.md
@@ -7,18 +7,24 @@ dashedName: step-36
# --description--
-A color wheel is a circle where similar colors, or hues, are near each other, and different ones are further apart. For example, pure red is between the hues rose and orange.
+A color wheel is a circle where similar colors, or hues, are near each other, and different ones are further apart. For example, pure red is between the hues rose and orange.
Two colors that are opposite from each other on the color wheel are called complementary colors. If two complementary colors are combined, they produce gray. But when they are placed side-by-side, these colors produce strong visual contrast and appear brighter.
-Set `one` and `two` to the complementary colors red and cyan. In the `rgb` function for `one` set the red value to the max of `255`. In the `rgb` function for two, set the values for green and blue to the max of `255`.
+In the `rgb` function for the `.one` CSS rule, set the red value to the max of `255` to produce pure red. In the `rgb` function for `.two` CSS rule, set the values for green and blue to the max of `255` to produce cyan.
# --hints--
-Test 1
+Your `.one` CSS rule should have a `background-color` property set to `rgb(255, 0, 0)`.
```js
+assert(new __helpers.CSSHelp(document).getStyle('.one')?.backgroundColor === 'rgb(255, 0, 0)');
+```
+Your `.two` CSS rule should have a `background-color` property set to `rgb(0, 255, 255)`.
+
+```js
+assert(new __helpers.CSSHelp(document).getStyle('.two')?.backgroundColor === 'rgb(0, 255, 255)');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-037.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-037.md
index 53b042790f..e2ffe448b6 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-037.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-037.md
@@ -7,18 +7,24 @@ dashedName: step-37
# --description--
-Notice that the red and cyan colors are very bright right next to each other. But this contrast can be distracting if it's overused on a website, and can make text hard to read if it's placed on a complementary-colored background.
+Notice that the red and cyan colors are very bright right next to each other. This contrast can be distracting if it's overused on a website, and can make text hard to read if it's placed on a complementary-colored background.
-It's better practice to choose one color as the dominant color, and use its complementary color as an accent color to bring attention to certain content on the page.
+It's better practice to choose one color as the dominant color, and use its complementary color as an accent to bring attention to certain content on the page.
-First, in the `h1` rule, use the `rbg` function to set the background color to cyan.
+First, in the `h1` rule, use the `rbg` function to set its background color to cyan.
# --hints--
-Test 1
+You should not remove or modify the `text-align` property or its value.
```js
+assert(new __helpers.CSSHelp(document).getStyle('h1')?.textAlign === 'center');
+```
+Your `h1` CSS rule should have a `background-color` property set to `rgb(0, 255, 255)`.
+
+```js
+assert(new __helpers.CSSHelp(document).getStyle('h1')?.backgroundColor === 'rgb(0, 255, 255)');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-038.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-038.md
index 5f1454399a..bef36eec05 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-038.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-038.md
@@ -7,14 +7,20 @@ dashedName: step-38
# --description--
-Next, in `one`, use the `rgb` function to set the `background-color` to black. And in `two`, use the `rgb` function to set the `background-color` to red.
+Next, in the `.one` rule, use the `rgb` function to set the `background-color` to black. And in the `.two` rule, use the `rgb` function to set the `background-color` to red.
# --hints--
-Test 1
+Your `.one` CSS rule should have a `background-color` property set to `rgb(0, 0, 0)`.
```js
+assert(new __helpers.CSSHelp(document).getStyle('.one')?.backgroundColor === 'rgb(0, 0, 0)');
+```
+Your `.two` CSS rule should have a `background-color` property set to `rgb(255, 0, 0)`.
+
+```js
+assert(new __helpers.CSSHelp(document).getStyle('.two')?.backgroundColor === 'rgb(255, 0, 0)');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-039.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-039.md
index 151db2f9a9..38f7300c46 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-039.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-039.md
@@ -11,14 +11,14 @@ Notice how your eyes are naturally drawn to the red color in the center? When de
There are several other important color combinations outside of complementary colors, but you'll learn those a bit later.
-For now, use the `rgb` function in `two` to set the `background-color` to black.
+For now, use the `rgb` function in the `.two` rule to set the `background-color` to black.
# --hints--
-Test 1
+Your `.two` CSS rule should have a `background-color` property set to `rgb(0, 0, 0)`.
```js
-
+assert(new __helpers.CSSHelp(document).getStyle('.two')?.backgroundColor === 'rgb(0, 0, 0)');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-040.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-040.md
index 7422242aad..4ab74c3f50 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-040.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-040.md
@@ -11,10 +11,11 @@ And in the `h1` rule, remove the `background-color` property and value to go bac
# --hints--
-Test 1
+Your `h1` CSS rule should not have a `background-color` property or value.
```js
-
+const backgroundColorInstances = code.match(/background-color:.*;/gi);
+assert(backgroundColorInstances.length === 4 && !new __helpers.CSSHelp(document).getStyle('h1')?.backgroundColor);
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-041.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-041.md
index 714b8fa4dc..7327a28fe4 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-041.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-041.md
@@ -9,14 +9,22 @@ dashedName: step-41
Now it's time time to add other details to the markers, starting with the first one.
-First, change the class of the first marker `div` element from `one` to `red`.
+First, change the `class` attribute of the first marker `div` element from `one` to `red`.
# --hints--
-Test 1
+Your first marker `div` should not have the `class` `one`.
```js
+const containerFirstChild = [...document.querySelector('.container')?.children][0];
+assert(!containerFirstChild?.classList?.contains('one'));
+```
+Your first marker `div` should have the classes `marker` and `red`.
+
+```js
+const containerFirstChild = [...document.querySelector('.container')?.children][0];
+assert(containerFirstChild?.classList?.contains('marker') && containerFirstChild?.classList?.contains('red'));
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-042.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-042.md
index cf7fa21c41..2dc71c5cff 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-042.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-042.md
@@ -7,14 +7,26 @@ dashedName: step-42
# --description--
-Update the `one` class selector to target the new `red` `class`.
+Update the `.one` class selector to target the new `red` `class`.
# --hints--
-Test 1
+Your code should no longer have a `.one` class selector.
```js
+assert(!new __helpers.CSSHelp(document).getStyle('.one'));
+```
+You should use a class selector to target the `class` `red`.
+
+```js
+assert(new __helpers.CSSHelp(document).getStyle('.red'));
+```
+
+Your `.red` CSS rule should have a `background-color` property set to `rgb(0, 0, 0)`.
+
+```js
+assert(new __helpers.CSSHelp(document).getStyle('.red')?.backgroundColor === 'rgb(0, 0, 0)');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-043.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-043.md
index ac879c5608..243bd87a83 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-043.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-043.md
@@ -7,14 +7,14 @@ dashedName: step-43
# --description--
-And update the `rgb` function in `red` so that the red value is at the max.
+And update the `rgb` function in the `.red` rule so that the red value is at the max.
# --hints--
-Test 1
+Your `.red` CSS rule should have a `background-color` property set to `rgb(255, 0, 0)`.
```js
-
+assert(new __helpers.CSSHelp(document).getStyle('.red')?.backgroundColor === 'rgb(255, 0, 0)');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-044.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-044.md
index 433a925a51..3a400f0a34 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-044.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-044.md
@@ -7,14 +7,36 @@ dashedName: step-44
# --description--
-Next, change the `class` of the second marker element from `two` to `green`, and the `class` of the third marker element from `three` to `blue`.
+Next, change the `class` of the second marker `div` from `two` to `green`, and the `class` of the third marker `div` from `three` to `blue`.
# --hints--
-Test 1
+Your second marker `div` should not have the `class` `two`.
```js
+const containerSecondChild = [...document.querySelector('.container')?.children][1];
+assert(!containerSecondChild?.classList?.contains('two'));
+```
+Your second marker `div` should have the classes `marker` and `green`.
+
+```js
+const containerSecondChild = [...document.querySelector('.container')?.children][1];
+assert(containerSecondChild?.classList?.contains('marker') && containerSecondChild?.classList?.contains('green'));
+```
+
+Your third marker `div` should not have the `class` `three`.
+
+```js
+const containerThirdChild = [...document.querySelector('.container')?.children][2];
+assert(!containerThirdChild?.classList?.contains('three'));
+```
+
+Your third marker `div` should have the classes `marker` and `blue`.
+
+```js
+const containerThirdChild = [...document.querySelector('.container')?.children][2];
+assert(containerThirdChild?.classList?.contains('marker') && containerThirdChild?.classList?.contains('blue'));
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-045.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-045.md
index 573ad99b58..c015224b13 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-045.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-045.md
@@ -7,14 +7,44 @@ dashedName: step-45
# --description--
-Update the CSS class selector `two` so it targets the new `green` `class`. And update `three` so it targets `blue`.
+Update the CSS class selector `.two` so it targets the new `green` `class`. And update the `.three` selector so it targets the new `blue` `class`.
# --hints--
-Test 1
+Your code should no longer have a `.two` class selector.
```js
+assert(!new __helpers.CSSHelp(document).getStyle('.two'));
+```
+You should use a class selector to target the `class` `green`.
+
+```js
+assert(new __helpers.CSSHelp(document).getStyle('.green'));
+```
+
+Your `.green` CSS rule should have a `background-color` property set to `rgb(0, 0, 0)`.
+
+```js
+assert(new __helpers.CSSHelp(document).getStyle('.green')?.backgroundColor === 'rgb(0, 0, 0)');
+```
+
+Your code should no longer have a `.three` class selector.
+
+```js
+assert(!new __helpers.CSSHelp(document).getStyle('.three'));
+```
+
+You should use a class selector to target the `class` `blue`.
+
+```js
+assert(new __helpers.CSSHelp(document).getStyle('.blue'));
+```
+
+Your `.blue` CSS rule should have a `background-color` property set to `rgb(0, 0, 0)`.
+
+```js
+assert(new __helpers.CSSHelp(document).getStyle('.blue')?.backgroundColor === 'rgb(0, 0, 0)');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-046.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-046.md
index 9a68675ba5..75d3c1aa67 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-046.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-046.md
@@ -11,14 +11,14 @@ A very common way to apply color to an element with CSS is with hexadecimal
Hex color values start with a `#` character and take six characters from 0-9 and A-F. The first pair of characters represent red, the second pair represent green, and the third pair represent blue. For example, `#4B5320`.
-In the `green` CSS rule, set the `background-color` property to a hex color code with the values `00` for red, `FF` for green, and `00` blue.
+In the `.green` CSS rule, set the `background-color` property to a hex color code with the values `00` for red, `FF` for green, and `00` blue.
# --hints--
-Test 1
+Your `.green` CSS rule should have a `background-color` property set to `#00FF00`.
```js
-
+assert(new __helpers.CSSHelp(document).getStyle('.green')?.backgroundColor === 'rgb(0, 255, 0)');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-047.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-047.md
index d44504492f..2b48bfdf6a 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-047.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-047.md
@@ -13,16 +13,16 @@ You may already be familiar with decimal, or base 10 values, which go from 0 - 1
0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F
```
-With hex colors, 00 is 0% of that color, and FF is 100%. So `#00FF00` translates to 0% red, 100% green, and 0% blue, and is the same as `rgb(0, 255, 0)`.
+With hex colors, `00` is 0% of that color, and `FF` is 100%. So `#00FF00` translates to 0% red, 100% green, and 0% blue, and is the same as `rgb(0, 255, 0)`.
Lower the intensity of green by setting green value of the hex color to `7F`.
# --hints--
-Test 1
+Your `.green` CSS rule should have a `background-color` property set to `#007F00`.
```js
-
+assert(new __helpers.CSSHelp(document).getStyle('.green')?.backgroundColor === 'rgb(0, 127, 0)');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-048.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-048.md
index 22834b67ec..4371d2018d 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-048.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-048.md
@@ -21,10 +21,10 @@ In the `blue` CSS rule, use the `hsl` function to change the `background-color`
# --hints--
-Test 1
+Your `.blue` CSS rule should have a `background-color` property set to `hsl(240, 100%, 50%)`.
```js
-
+assert(new __helpers.CSSHelp(document).getStyle('.blue')?.backgroundColor === 'rgb(0, 0, 255)');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-049.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-049.md
index 8f009fab5c..2b077238aa 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-049.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-049.md
@@ -13,14 +13,14 @@ A gradient is when one color transitions into another. The CSS `linear-gradient`
One thing to remember is that the `linear-gradient` function actually creates an `image` element, and is usually paired with the `background` property which can accept an image as a value.
-In the `red` CSS rule, change the `background-color` property to `background`.
+In the `.red` CSS rule, change the `background-color` property to `background`.
# --hints--
-Test 1
+Your `.red` CSS rule should have a `background` property with the value `rgb(255, 0, 0)`.
```js
-
+assert(new __helpers.CSSHelp(document).getStyle('.red').cssText === 'background: rgb(255, 0, 0);');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-050.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-050.md
index 7a4c0aa645..88ac8638c3 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-050.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-050.md
@@ -7,7 +7,7 @@ dashedName: step-50
# --description--
-The `linear-gradient` function is very flexible, but here is the basic syntax you'll use in this tutorial:
+The `linear-gradient` function is very flexible -- here is the basic syntax you'll use in this tutorial:
```css
linear-gradient(gradientDirection, color1, color2, ...);
@@ -17,14 +17,14 @@ linear-gradient(gradientDirection, color1, color2, ...);
Now you'll apply a red-to-green gradient along a 90 degree line to the first marker.
-First, in the `red` CSS rule, set the `background` property to `linear-gradient()`, and pass it the value `90deg` as the `gradientDirection`.
+First, in the `.red` CSS rule, set the `background` property to `linear-gradient()`, and pass it the value `90deg` as the `gradientDirection`.
# --hints--
-Test 1
+Your `.red` CSS rule should have a `background` property with the value `linear-gradient(90deg)`.
```js
-
+assert(code.match(/background\s*:\s*linear-gradient\(\s*90deg\s*\);?/g));
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-051.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-051.md
index e63687fcdb..f65df494a1 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-051.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-051.md
@@ -13,10 +13,10 @@ In the `linear-gradient` function, use the `rgb` function to set the first color
# --hints--
-Test 1
+Your `.red` CSS rule should have a `background` property with the value `linear-gradient(90deg, rgb(255, 0, 0))`.
```js
-
+assert(code.match(/background\s*:\s*linear-gradient\(\s*90deg\,\s*rgb\(255\,?\s*0\,\s*0\)\s*\);?/g));
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-052.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-052.md
index fa89123587..2442fbb0c8 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-052.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-052.md
@@ -13,10 +13,10 @@ In the same `linear-gradient` function, use the `rgb` function to set the second
# --hints--
-Test 1
+Your `.red` CSS rule should have a `background` property set to `linear-gradient(90deg, rgb(255, 0, 0), rgb(0, 255, 0))`.
```js
-
+assert(new __helpers.CSSHelp(document).getStyle('.red')?.background === 'linear-gradient(90deg, rgb(255, 0, 0), rgb(0, 255, 0))');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-053.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-053.md
index f1578c6150..9269f6b4d8 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-053.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-053.md
@@ -13,10 +13,10 @@ Use the `rgb` function to add pure blue as the third color argument to the `line
# --hints--
-Test 1
+Your `.red` CSS rule should have a `background` property set to `linear-gradient(90deg, rgb(255, 0, 0), rgb(0, 255, 0), rgb(0, 0, 255))`.
```js
-
+assert(new __helpers.CSSHelp(document).getStyle('.red')?.background === 'linear-gradient(90deg, rgb(255, 0, 0), rgb(0, 255, 0), rgb(0, 0, 255))');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-054.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-054.md
index 9ef8fe1d98..2a6ce2ac5b 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-054.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-054.md
@@ -19,10 +19,10 @@ In the `linear-gradient` function, add a `75%` color stop after the first red co
# --hints--
-Test 1
+Your `.red` CSS rule should have a `background` property set to `linear-gradient(90deg, rgb(255, 0, 0) 75%, rgb(0, 255, 0), rgb(0, 0, 255))`.
```js
-
+assert(new __helpers.CSSHelp(document).getStyle('.red')?.background === 'linear-gradient(90deg, rgb(255, 0, 0) 75%, rgb(0, 255, 0), rgb(0, 0, 255))');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-055.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-055.md
index da5f51854e..6561d8b5c5 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-055.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-055.md
@@ -13,10 +13,10 @@ In the `linear-gradient` function, set `gradientDirection` to `180deg`.
# --hints--
-Test 1
+Your `.red` CSS rule should have a `background` property set to `linear-gradient(180deg, rgb(255, 0, 0) 75%, rgb(0, 255, 0), rgb(0, 0, 255))`.
```js
-
+assert(new __helpers.CSSHelp(document).getStyle('.red')?.background === 'linear-gradient(rgb(255, 0, 0) 75%, rgb(0, 255, 0), rgb(0, 0, 255))');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-056.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-056.md
index 4463b7797c..43d2c23a62 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-056.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-056.md
@@ -11,10 +11,10 @@ Next, set the color-stop for red to `0%`, the color-stop for green to `50%`, and
# --hints--
-Test 1
+Your `.red` CSS rule should have a `background` property set to `linear-gradient(180deg, rgb(255, 0, 0) 0%, rgb(0, 255, 0) 50%, rgb(0, 0, 255) 100%)`.
```js
-
+assert(new __helpers.CSSHelp(document).getStyle('.red')?.background === 'linear-gradient(rgb(255, 0, 0) 0%, rgb(0, 255, 0) 50%, rgb(0, 0, 255) 100%)');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-057.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-057.md
index 0f67ff91be..83907db3b8 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-057.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-057.md
@@ -13,10 +13,10 @@ For the first color argument, which is currently pure red, update the `rgb` func
# --hints--
-Test 1
+Your `.red` CSS rule should have a `background` property set to `linear-gradient(180deg, rgb(122, 74, 14) 0%, rgb(0, 255, 0) 50%, rgb(0, 0, 255) 100%)`.
```js
-
+assert(new __helpers.CSSHelp(document).getStyle('.red')?.background === 'linear-gradient(rgb(122, 74, 14) 0%, rgb(0, 255, 0) 50%, rgb(0, 0, 255) 100%)');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-058.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-058.md
index b52b4a8e62..a4386f564c 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-058.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-058.md
@@ -13,10 +13,10 @@ Update the `rgb` function so the value for red is `245`, the value of green is `
# --hints--
-Test 1
+Your `.red` CSS rule should have a `background` property set to `linear-gradient(180deg, rgb(122, 74, 14) 0%, rgb(245, 62, 113) 50%, rgb(0, 0, 255) 100%)`.
```js
-
+assert(new __helpers.CSSHelp(document).getStyle('.red')?.background === 'linear-gradient(rgb(122, 74, 14) 0%, rgb(245, 62, 113) 50%, rgb(0, 0, 255) 100%)');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-059.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-059.md
index 6318f1d2c5..01c7588e7e 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-059.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-059.md
@@ -13,10 +13,10 @@ Update the `rgb` function so the value for red is `162`, the value of green is `
# --hints--
-Test 1
+Your `.red` CSS rule should have a `background` property set to `linear-gradient(180deg, rgb(122, 74, 14) 0%, rgb(245, 62, 113) 50%, rgb(162, 27, 27) 100%)`.
```js
-
+assert(new __helpers.CSSHelp(document).getStyle('.red')?.background === 'linear-gradient(rgb(122, 74, 14) 0%, rgb(245, 62, 113) 50%, rgb(162, 27, 27) 100%)');
```
# --seed--
diff --git a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-060.md b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-060.md
index 4c89731051..39d131010c 100644
--- a/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-060.md
+++ b/curriculum/challenges/english/01-responsive-web-design/learn-css-colors-by-building-a-color-markers-set/step-060.md
@@ -9,14 +9,15 @@ dashedName: step-60
The red marker is looking much more realistic. Now you'll do the same for the green marker, using a combination of the `linear-gradient` function and hex colors.
-In the `green` CSS rule, change the `background-color` property to `background`.
+In the `.green` CSS rule, change the `background-color` property to `background`.
# --hints--
-Test 1
+Your `.green` CSS rule should have a `background` property with the value `rgb(0, 127, 0)`.
```js
-
+console.log(new __helpers.CSSHelp(document).getStyle('.green').cssText);
+assert(new __helpers.CSSHelp(document).getStyle('.green').cssText === 'background: rgb(0, 127, 0);');
```
# --seed--