Style the extensions virtual keyboard

ui/keyboard/resources/main.css

Index: ui/keyboard/resources/main.css
diff --git a/ui/keyboard/resources/main.css b/ui/keyboard/resources/main.css
index 172b9f3bc3a8fb82ca447057842aa6cd35e8d4b6..7f99cc8605d2bebd1bae1a2bc9aaddbe99343139 100644
--- a/ui/keyboard/resources/main.css
+++ b/ui/keyboard/resources/main.css
@@ -22,24 +22,25 @@ kb-keyboard {
 }
 
 kb-key {
-  background-color: #444444;
-  border-top: 1px solid #666666;
-  border-radius: 3px;
+  background-color: #3b3b3e;
+  border-top: 2px solid #4b4b4e;
+  border-radius: 2px;
   color: #ffffff;
-  font-family: sans-serif;
-  font-weight: 100;
-  margin-left: 5px;
+  font-family: 'Open Sans', sans-serif;
+  font-weight: 300;
+  margin-left: 7px;
 }
 
 kb-key.dark {
-  background-color: #333333;
+  background-color: #2a2a2c;
+  border-top: 2px solid #3a3a3c;
 }
 
 #upper .left-shift,
 #upper .right-shift,
 .active {
-  background-color: #acacac !important;
-  border-top: 1px solid rgba(125,125,125,0.5);
+  background-color: #848490 !important;
+  border-top: 2px solid #A9A9AF !important;
   /* Do not use box shadow until performance improves
    * http://code.google.com/p/chromium/issues/detail?id=99045
   box-shadow: 0px 0px 15px #fff;
@@ -56,8 +57,11 @@ kb-key.dark {
   -webkit-box-flex: 1.3 !important;

[bshe, 2013/06/20 19:41:51]

value of .tab and .backspace may also need to change. It seems you increased the
total flex value of second and third row by 0.6 if I understand correctly?

[SteveT, 2013/06/20 20:58:33]

Nope, this is intentional. We actually want to keep the tab and backspace keys
slightly smaller than the new elongated shift and return keys. This is for
aesthetics, mostly, but we might change this in the future if it doesn't
function well.

Thanks for catching that, though.

 }
 
-.symbol,
 .return {
+  -webkit-box-flex: 2.1 !important;
+}
+
+.symbol {
   -webkit-box-flex: 1.5 !important;
 }
 
@@ -67,12 +71,12 @@ kb-key.dark {
 
 .left-shift,
 .left-more {
-  -webkit-box-flex: 1.4 !important;
+  -webkit-box-flex: 1.8 !important;
 }
 
 .right-shift,
 .right-more {
-  -webkit-box-flex: 1.6 !important;
+  -webkit-box-flex: 1.8 !important;
 }
 
 .space {
@@ -84,15 +88,16 @@ kb-key.dark {
 }
 
 .backspace,
-.tab,
-.return,
-.left-shift,
-.right-shift,
+.dotcom,
 .left-more,
+.left-shift,
+.moddown.shift,
+.return,
 .right-more,
+.right-shift,
 .symbol,
-.moddown.shift {
-  font-size: 80%;
+.tab {
+  font-size: 70%;
 }
 
 .mic {