diff --git a/docs/tutorials/getting-started.md b/docs/tutorials/getting-started.md
index 12837afb..8b478531 100644
--- a/docs/tutorials/getting-started.md
+++ b/docs/tutorials/getting-started.md
@@ -1,13 +1,13 @@
 # Getting started
 
-<begin>basic.showString("Hello world")</begin>
+# begin: basic.showString("Hello world")
 
 ### Step 1
 
 Use the **Basic** drawer in the editor
 to drag out and arrange three blocks to create this program:
 
-```blocks
+```block
 basic.showString("Hello world")
 ```
 
@@ -21,18 +21,25 @@ to drag out and arrange three blocks to create this program:
 Use the **Basic** drawer in the editor
 to drag out and arrange three blocks to create this program:
 
-```blocks
-basic.showString("Hello world")
+```block
+basic.forever(() => {
+    basic.showNumber(0)
+})
 ```
-
 ### Step 4
 
 Use the **Basic** drawer in the editor
 to drag out and arrange three blocks to create this program:
 
-```blocks
-basic.forever(() => {
-    basic.showNumber(0)
+```block
+input.onButtonPressed(Button.B, () => {
+    basic.showLeds(`
+    . . . . .
+    . . . . .
+    . . . . .
+    . . . . .
+    . . . . .
+    `)
 })
 ```
 
@@ -41,7 +48,7 @@ basic.forever(() => {
 Use the **Basic** drawer in the editor
 to drag out and arrange three blocks to create this program:
 
-```blocks
+```block
 input.onButtonPressed(Button.A, () => {
     basic.showString("Hello!")
 })
diff --git a/theme/style.less b/theme/style.less
index 646b1d30..92c5c6b1 100644
--- a/theme/style.less
+++ b/theme/style.less
@@ -46,6 +46,11 @@
 .blocklyTreeRow {
     border-bottom: 1px solid #ecf0f1 !important;
     margin-bottom: 0px !important;
+
+    -webkit-transition-property: background-color; /* Safari */
+    -webkit-transition-duration: 1s; /* Safari */
+    transition-property: background-color;
+    transition-duration: 1s;
 }
 
 /* Blockly toolbox font size same as the page font */