[css-ui-4] Update code in examples

Drop old -webkit- prefixes used in examples as they are no longer needed
for recent browsers, and as they trip various validators.

Author: frivoal

css-ui-4/Overview.bs

@@ -1574,12 +1574,11 @@ for details.
 
 	The simulated rendering below illustrates how this should look.
 	<style>
-	@-webkit-keyframes caret-alternate-ref { 50% { border-color: red; } }
 	@keyframes caret-alternate-ref { 50% { border-color: red; } }
 	</style>
 	<div style="border:inset; background: white; width: 10em;">
 		Text area
-		with color-alternating caret<span style="border-right: 2px solid blue; animation: caret-alternate-ref 2s step-end infinite;-webkit-animation: caret-alternate-ref 2s step-end infinite;"></span>
+		with color-alternating caret<span style="border-right: 2px solid blue; animation: caret-alternate-ref 2s step-end infinite;"></span>
 	</div>
 
 	Focus the element below to see how your browser renders it.
@@ -1683,10 +1682,7 @@ The stacking position of the caret is left undefined, within the following const
 	the insertion point is between the letters u and m.
 
 	<style>
-	@-webkit-keyframes caret-bar-ref { 50% { outline-color: transparent; } }
-	@-webkit-keyframes caret-block-ref { 50% { background: transparent; } }
-	@-webkit-keyframes caret-underscore-ref { 50% { border-color: transparent; } }
-	@keyframes caret-bar-ref { 50% { outline-color: transparent; } }
+	@keyframes caret-bar-ref { 50% { border-color: transparent; } }
 	@keyframes caret-block-ref { 50% { background: transparent; } }
 	@keyframes caret-underscore-ref { 50% { border-color: transparent; } }
 	#caret-shape-example {
@@ -1709,17 +1705,17 @@ The stacking position of the caret is left undefined, within the following const
 
 		<tr>
 			<td>''bar''
-			<td>Lorem ipsu<span style="outline: 1px solid black;animation: caret-bar-ref 2s step-end infinite;-webkit-animation: caret-bar-ref 2s step-end infinite;">&#8203;</span>m
+			<td>Lorem ipsu<span style="border: 1px solid black; margin: 0 -1px; animation: caret-bar-ref 2s step-end infinite;">&#8203;</span>m
 			<td style contentEditable=true style="caret-shape: bar">Lorem Ipsum
 
 		<tr>
 			<td>''caret-shape/block''
-			<td>Lorem ipsu<span style="background: #bbb; -webkit-animation: caret-block-ref 2s step-end infinite;animation: caret-block-ref 2s step-end infinite;">m</span>
+			<td>Lorem ipsu<span style="background: #bbb; animation: caret-block-ref 2s step-end infinite;">m</span>
 			<td contentEditable=true style="caret-shape: block">Lorem Ipsum
 
 		<tr>
 			<td>''underscore''
-			<td>Lorem ispu<span style="border-bottom: 2px solid black; -webkit-animation: caret-underscore-ref 2s step-end infinite; animation: caret-underscore-ref 2s step-end infinite;">m</span>
+			<td>Lorem ispu<span style="border-bottom: 2px solid black; animation: caret-underscore-ref 2s step-end infinite;">m</span>
 			<td contentEditable=true style="caret-shape: underscore">Lorem Ipsum
 	</table>
 </div>
@@ -1741,13 +1737,12 @@ The stacking position of the caret is left undefined, within the following const
 
 	The simulated rendering below illustrates how this should look.
 	<style>
-	@-webkit-keyframes terminal-caret-ref { 50% { border-color: transparent; } }
 	@keyframes terminal-caret-ref { 50% { border-color: transparent; } }
 	</style>
 	<pre style="background: black; color: white; font-family: monospace; padding: 1ex">
 	user@host:css-ui-4 $ ls -a
 	. .. Overview.bs Overview.html
-	user@host:css-ui-4 $ <span style="border-bottom: 2px solid white;animation: terminal-caret-ref 2s step-end infinite;-webkit-animation: terminal-caret-ref 2s step-end infinite;">&nbsp;</span>
+	user@host:css-ui-4 $ <span style="border-bottom: 2px solid white;animation: terminal-caret-ref 2s step-end infinite;">&nbsp;</span>
 	</pre>
 
 	Focus the element below to see how your browser renders it.
@@ -1812,17 +1807,12 @@ Omitted values are set to their initial values.
 		white-space: pre;
 		caret: block 0s;
 		animation: caret-old-ref 2s  infinite;
-		-webkit-animation: caret-old-ref 2s  infinite;
 
 	}
 	@keyframes caret-old-ref {
 		from, 50% { background-color: green; }
 		75%, to { background-color: transparent; }
 	}
-	@-webkit-keyframes caret-old-ref {
-		from, 50% { background-color: green; }
-		75%, to { background-color: transparent; }
-	}
 	</style>
 	<div class="old-screen" style="height: 100px">&gt; <span>&nbsp;</span></div>