1 files changed, 37 insertions, 39 deletions

diff --git a/examples/adding_up_to_10/css/lesson.css b/examples/adding_up_to_10/css/lesson.css
index 5147cfa..e368b14 100755
--- a/examples/adding_up_to_10/css/lesson.css
+++ b/examples/adding_up_to_10/css/lesson.css
@@ -1,32 +1,33 @@
+@charset "UTF-8";
 
-#main {
+#karma-main {
 width:800px;
 height:600px;
 position:absolute;
 }
-#action {
+
+#main {
 float:left;
 position:relative;
 width: 650px;
 height: 600px;
 
 }
-#sidebar {
+#side {
 background-image: url(../assets/generic/images/sidebar.png);
--moz-background-clip:border;
--moz-background-inline-policy:continuous;
--moz-background-origin:padding;
 background:none none repeat scroll 0 0;
 float:left;
 height:600px;
 position:relative;
 width:150px;
 }
-#actionTop {
+
+#top {
 width: 650px;
 height: 300px;
 position:relative;
 }
+
 #bottom {
 clear:both;
 float:left;
@@ -34,32 +35,26 @@ width: 650px;
 height: 300px;
 position:relative;
 }
-#topLtSide {
+#topLeftArea {
 float:left;
 width: 300px;
 height: 300px;
 position:relative;
 }
-#topMd {
--moz-background-clip:border;
--moz-background-inline-policy:continuous;
--moz-background-origin:padding;
+#topMiddleArea {
 background:none none repeat scroll 0 0;
 float:left;
 width: 50px;
 height: 300px;
 position:relative;
 }
-#topRtSide {
+#topRightArea {
 float:left;
 width: 300px;
 height:300px;
 position:relative;
 }
-#topLtBox {
--moz-background-clip:border;
--moz-background-inline-policy:continuous;
--moz-background-origin:padding;
+#topLeftCard {
 background:none none repeat scroll 0 0;
 width: 200px;
 height: 200px;
@@ -68,22 +63,22 @@ position:absolute;
 top:50px;
 }
 
-#topLtCanvas {
--moz-background-clip:border;
--moz-background-inline-policy:continuous;
--moz-background-origin:padding;
+#topLeftPaper {
 background:none none repeat scroll 0 0;
 position:absolute;
 top: 50px;
 left: 75px;
+width:200px; 
+height:200px;
 }
-#plussign {
+
+#plusSign {
 display: block;
 margin-left: auto;
 margin-right: auto;
 margin-top: 150px;
 }
-#topRtBox {
+#topRightCard {
 background: none none repeat scroll 0 0;
 width: 200px;
 height: 200px;
@@ -91,18 +86,17 @@ position:absolute;
 right: 50px;
 top: 50px;
 }
-#topRtCanvas {
+#topRightPaper {
 background:none none repeat scroll 0 0;
 position:absolute;
 left: 50px;
 right:50px;
 top:50px;
+width:200px;
+height:200px;
 }
 
 .bottom {
--moz-background-clip:border;
--moz-background-inline-policy:continuous;
--moz-background-origin:padding;
 background:none none repeat scroll 0 0;
 float:left;
 width: 216.5px;
@@ -110,7 +104,7 @@ height: 300px;
 position:relative;
 }
 
-.bottomBox {
+.bottomCard {
     left:25px;
     position:absolute;
     width: 200px;
@@ -118,7 +112,8 @@ position:relative;
     top: 20px;
 }
 
-.sidebarItem {
+
+.sideItem {
     clear:both;
     float:left;
     width:150px;
@@ -134,7 +129,7 @@ top:10px;
 left:25px;
 }
 
-#timerCanvas {
+#timerPaper {
 position:absolute;
 width:100px;
 height:150px;
@@ -142,28 +137,31 @@ top:10px;
 left:25px;
 }
 
-#scorebox {
+#scoreBox {
 position:absolute;
 width:100px;
 height:150px;
 top:10px;
 left:25px;
+z-index: 10;
 }
 
-#scoreboxCanvas {
-position:absolute;
-width:100px;
-height:150px;
-top:10px;
-left:25px;
+#scoreBoxText {
+position:relative;
+top:60px;
+font: 70px Arial;
+color: #fff;
+text-align: center;
+z-index: 100;
 }
 
 
-#chimpCanvas {
+#chimpPaper {
 position:absolute;
 top:10px;
 left:25px;
-
+width:120px; 
+height:125px;
 }
 
 #buttons {