Fix an example that changed.

Author: tabatkins

css-variables/Overview.html

@@ -336,9 +336,10 @@ <h2 id=defining-variables><span class=secno>2. </span> Defining Variables</h2>
     class=css>$foo</code>&rsquo;, respectively, as <a
     href="#invalid-variable"><i>invalid variables</i></a> instead of as the
     values in the declarations. If the last rule were removed, however, there
-    would be no problem: both &lsquo;<code class=css>$foo</code>&rsquo; and
-    &lsquo;<code class=css>$bar</code>&rsquo; would then be defined as the
-    value &lsquo;<code class=css>red</code>&rsquo;.</p>
+    would be no problem - &lsquo;<code class=css>$foo</code>&rsquo; would be
+    defined as &lsquo;<code class=css>red</code>&rsquo;, while &lsquo;<code
+    class=css>$bar</code>&rsquo; would be defined as &lsquo;<code
+    class=css>linear-gradient(transparent, red)</code>&rsquo;.</p>
   </div>
 
   <p>Before they are defined, all variables are <a

css-variables/Overview.src.html

@@ -145,7 +145,7 @@ <h2 id="defining-variables">
 @var $bar linear-gradient(transparent, $foo);
 @var $foo $bar;</pre>
 
-		<p>The last two declarations create the cycle, and so they define ''$bar'' and ''$foo'', respectively, as <i>invalid variables</i> instead of as the values in the declarations.  If the last rule were removed, however, there would be no problem: both ''$foo'' and ''$bar'' would then be defined as the value ''red''.</p>
+		<p>The last two declarations create the cycle, and so they define ''$bar'' and ''$foo'', respectively, as <i>invalid variables</i> instead of as the values in the declarations.  If the last rule were removed, however, there would be no problem - ''$foo'' would be defined as ''red'', while ''$bar'' would be defined as ''linear-gradient(transparent, red)''.</p>
 	</div>
 
 	<p>Before they are defined, all variables are <i>invalid variables</i>.</p>