changed color
authorschepers
Sat, 29 Aug 2009 08:06:30 +0900
changeset 159 53b37c7d0823
parent 158 7a1eb49f361a
child 160 048701e4b4ea
changed color
html/images/ISOIEC-9995-3-FCD-2009A.svg
--- a/html/images/ISOIEC-9995-3-FCD-2009A.svg	Sat Aug 29 08:05:40 2009 +0900
+++ b/html/images/ISOIEC-9995-3-FCD-2009A.svg	Sat Aug 29 08:06:30 2009 +0900
@@ -2,7 +2,7 @@
      xmlns:xlink="http://www.w3.org/1999/xlink"
      width="100%" height="100%" viewBox="-2 -2 904 304">
 
-  <title>ISO/IEC 9995-3:2009A Common Secondary Layout of the Alphanumeric Zone of the Alphanumeric Section</title>
+  <title> fill="gainsboro" Common Secondary Layout of the Alphanumeric Zone of the Alphanumeric Section</title>
   <desc>A graphical depiction of an ISO standard defining layouts of computer keyboards.</desc>
   
   <style type="text/css"><![CDATA[
@@ -23,7 +23,7 @@
   <rect id="keyboard" x="0" y="0" width="900" height="300" fill="gray" stroke="black" />
   <g font-family="'New Century Schoolbook', Palatino, Times, Courier, Helvetica, 'Cordia New', Ayuthaya, Tahoma, 'Arial Unicode MS', sans-serif" text-anchor="middle" font-size="15">
     <g transform="translate(0, 0)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">~</text>
     	<text class="left mid" x="10" y="35">`</text>
     	<text class="right top" x="50" y="18">&#x0AD;</text>
@@ -31,7 +31,7 @@
     	<text class="right bottom" x="50" y="52">&#x07C;</text>
     </g>
     <g transform="translate(60, 0)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">!</text>
     	<text class="left mid" x="10" y="35">1</text>
     	<text class="right top" x="50" y="18">&#x0A1;</text>
@@ -39,7 +39,7 @@
     	<text class="right bottom" x="50" y="52">&#x2B9;</text>
     </g>
     <g transform="translate(120, 0)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">@</text>
     	<text class="left mid" x="10" y="35">2</text>
     	<text class="right top" x="50" y="18">&#x0A4;</text>
@@ -47,7 +47,7 @@
     	<text class="right bottom" x="50" y="52">&#x2BA;</text>
     </g>
     <g transform="translate(180, 0)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">#</text>
     	<text class="left mid" x="10" y="35">3</text>
     	<text class="right top" x="50" y="18">&#x0A3;</text>
@@ -55,7 +55,7 @@
     	<text class="right bottom" x="50" y="52">&#x2BF;</text>
     </g>
     <g transform="translate(240, 0)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">$</text>
     	<text class="left mid" x="10" y="35">4</text>
     	<text class="right top" x="50" y="18">&#x20AC;</text>
@@ -63,7 +63,7 @@
     	<text class="right bottom" x="50" y="52">&#x2BE;</text>
     </g>
     <g transform="translate(300, 0)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">%</text>
     	<text class="left mid" x="10" y="35">5</text>
     	<text class="right top" x="50" y="18">&#x2191;</text>
@@ -71,7 +71,7 @@
     	<text class="right bottom" x="50" y="52">&#x2C1;</text>
     </g>
     <g transform="translate(360, 0)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">^</text>
     	<text class="left mid" x="10" y="35">6</text>
     	<text class="right top" x="50" y="18">&#x2193;</text>
@@ -79,7 +79,7 @@
     	<text class="right bottom" x="50" y="52">&#x2C0;</text>
     </g>
     <g transform="translate(420, 0)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">&amp;</text>
     	<text class="left mid" x="10" y="35">7</text>
     	<text class="right top" x="50" y="18">&#x2190;</text>
@@ -87,7 +87,7 @@
     	<text class="right bottom" x="50" y="52">&#x07B;</text>
     </g>
     <g transform="translate(480, 0)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">*</text>
     	<text class="left mid" x="10" y="35">8</text>
     	<text class="right top" x="50" y="18">&#x2192;</text>
@@ -95,7 +95,7 @@
     	<text class="right bottom" x="50" y="52">&#x07D;</text>
     </g>
     <g transform="translate(540, 0)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">(</text>
     	<text class="left mid" x="10" y="35">9</text>
     	<text class="right top" x="50" y="18">&#x0B1;</text>
@@ -103,7 +103,7 @@
     	<text class="right bottom" x="50" y="52">&#x05B;</text>
     </g>
     <g transform="translate(600, 0)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">)</text>
     	<text class="left mid" x="10" y="35">0</text>
     	<text class="right top" x="50" y="18">&#x2122;</text>
@@ -111,7 +111,7 @@
     	<text class="right bottom" x="50" y="52">&#x05D;</text>
     </g>
     <g transform="translate(660, 0)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18"></text>
     	<text class="left mid" x="10" y="35"> </text>
     	<text class="right top" x="50" y="18">&#x0BF;</text>
@@ -119,7 +119,7 @@
     	<text class="right bottom" x="50" y="52">&#x2BB;</text>
     </g>
     <g transform="translate(720, 0)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18"></text>
     	<text class="left mid" x="10" y="35"> </text>
     	<text class="right top" x="50" y="18">&#x328;</text>
@@ -127,16 +127,16 @@
     	<text class="right bottom" x="50" y="52">&#x0AC;</text>
     </g>
     <g transform="translate(780, 0)">
-    	<rect x="0" y="0" width="120" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="120" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="mid" x="60" y="35">Backspace</text>
     </g>
     
     <g transform="translate(0, 60)">
-    	<rect x="0" y="0" width="90" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="90" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="mid" x="45" y="35">Tab</text>
     </g>
     <g transform="translate(90, 60)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">Q</text>
     	<text class="left mid" x="10" y="35">q</text>
     	<text class="right top" x="50" y="18">&#x241;</text>
@@ -144,7 +144,7 @@
     	<text class="right bottom" x="50" y="52">&#x30D;</text>
     </g>
     <g transform="translate(150, 60)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">W</text>
     	<text class="left mid" x="10" y="35">w</text>
     	<text class="right top" x="50" y="18">&#x2126;</text>
@@ -152,7 +152,7 @@
     	<text class="right bottom" x="50" y="52">&#x307;</text>
     </g>
     <g transform="translate(210, 60)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">E</text>
     	<text class="left mid" x="10" y="35">e</text>
     	<text class="right top" x="50" y="18">&#x152;</text>
@@ -160,7 +160,7 @@
     	<text class="right bottom" x="50" y="52">&#x306;</text>
     </g>
     <g transform="translate(270, 60)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">R</text>
     	<text class="left mid" x="10" y="35">r</text>
     	<text class="right top" x="50" y="18">&#x0AE;</text>
@@ -168,7 +168,7 @@
     	<text class="right bottom" x="50" y="52">&#x302;</text>
     </g>
     <g transform="translate(330, 60)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">T</text>
     	<text class="left mid" x="10" y="35">t</text>
     	<text class="right top" x="50" y="18">&#xA78B;</text>
@@ -176,7 +176,7 @@
     	<text class="right bottom" x="50" y="52">&#x308;</text>
     </g>
     <g transform="translate(390, 60)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">Y</text>
     	<text class="left mid" x="10" y="35">y</text>
     	<text class="right top" x="50" y="18">&#x0A5;</text>
@@ -184,7 +184,7 @@
     	<text class="right bottom" x="50" y="52">&#x311;</text>
     </g>
     <g transform="translate(450, 60)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">U</text>
     	<text class="left mid" x="10" y="35">u</text>
     	<text class="right top" x="50" y="18">&#x222;</text>
@@ -192,7 +192,7 @@
     	<text class="right bottom" x="50" y="52">&#x30C;</text>
     </g>
     <g transform="translate(510, 60)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">I</text>
     	<text class="left mid" x="10" y="35">i</text>
     	<text class="right top" x="50" y="18">&#x214D;</text>
@@ -200,7 +200,7 @@
     	<text class="right bottom" x="50" y="52">&#x313;</text>
     </g>
     <g transform="translate(570, 60)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">O</text>
     	<text class="left mid" x="10" y="35">o</text>
     	<text class="right top" x="50" y="18">&#x0D8;</text>
@@ -208,7 +208,7 @@
     	<text class="right bottom" x="50" y="52">&#x31B;</text>
     </g>
     <g transform="translate(630, 60)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">P</text>
     	<text class="left mid" x="10" y="35">p</text>
     	<text class="right top" x="50" y="18">&#x0DE;</text>
@@ -216,7 +216,7 @@
     	<text class="right bottom" x="50" y="52">&#x309;</text>
     </g>
     <g transform="translate(690, 60)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">{</text>
     	<text class="left mid" x="10" y="35">[</text>
     	<text class="right top" x="50" y="18">&#x30A;</text>
@@ -224,7 +224,7 @@
     	<text class="right bottom" x="50" y="52">&#x300;</text>
     </g>
     <g transform="translate(750, 60)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">}</text>
     	<text class="left mid" x="10" y="35">]</text>
     	<text class="right top" x="50" y="18">&#x304;</text>
@@ -232,7 +232,7 @@
     	<text class="right bottom" x="50" y="52">&#x040;</text>
     </g>
     <g transform="translate(810, 60)">
-    	<rect x="0" y="0" width="90" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="90" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">|</text>
     	<text class="left mid" x="10" y="35">\</text>
     	<text class="right top" x="80" y="18">&#x18F;</text>
@@ -241,11 +241,11 @@
     </g>
     
     <g transform="translate(0, 120)">
-    	<rect x="0" y="0" width="105" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="105" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="mid" x="52.5" y="35">Caps Lock</text>
     </g>
     <g transform="translate(105, 120)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">A</text>
     	<text class="left mid" x="10" y="35">a</text>
     	<text class="right top" x="50" y="18">&#x0C6;</text>
@@ -253,7 +253,7 @@
     	<text class="right bottom" x="50" y="52">&#x329;</text>
     </g>
     <g transform="translate(165, 120)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">S</text>
     	<text class="left mid" x="10" y="35">s</text>
     	<text class="right top" x="50" y="18">&#x0A7;</text>
@@ -261,7 +261,7 @@
     	<text class="right bottom" x="50" y="52">&#x323;</text>
     </g>
     <g transform="translate(225, 120)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">D</text>
     	<text class="left mid" x="10" y="35">d</text>
     	<text class="right top" x="50" y="18">&#x0D0;</text>
@@ -269,7 +269,7 @@
     	<text class="right bottom" x="50" y="52">&#x32E;</text>
     </g>
     <g transform="translate(285, 120)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">F</text>
     	<text class="left mid" x="10" y="35">f</text>
     	<text class="right top" x="50" y="18">&#x0AA;</text>
@@ -277,7 +277,7 @@
     	<text class="right bottom" x="50" y="52">&#x32D;</text>
     </g>
     <g transform="translate(345, 120)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">G</text>
     	<text class="left mid" x="10" y="35">g</text>
     	<text class="right top" x="50" y="18">&#x14A;</text>
@@ -285,7 +285,7 @@
     	<text class="right bottom" x="50" y="52">&#x331;</text>
     </g>
     <g transform="translate(405, 120)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">H</text>
     	<text class="left mid" x="10" y="35">h</text>
     	<text class="right top" x="50" y="18">&#x19D;</text>
@@ -293,7 +293,7 @@
     	<text class="right bottom" x="50" y="52">&#x332;</text>
     </g>
     <g transform="translate(465, 120)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">J</text>
     	<text class="left mid" x="10" y="35">j</text>
     	<text class="right top" x="50" y="18">&#x132;</text>
@@ -301,7 +301,7 @@
     	<text class="right bottom" x="50" y="52">&#x325;</text>
     </g>
     <g transform="translate(525, 120)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">K</text>
     	<text class="left mid" x="10" y="35">k</text>
     	<text class="right top" x="50" y="18">&#x325;</text>
@@ -309,7 +309,7 @@
     	<text class="right bottom" x="50" y="52">&#x335;</text>
     </g>
     <g transform="translate(585, 120)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">L</text>
     	<text class="left mid" x="10" y="35">l</text>
     	<text class="right top" x="50" y="18">&#x141;</text>
@@ -317,7 +317,7 @@
     	<text class="right bottom" x="50" y="52">&#x338;</text>
     </g>
     <g transform="translate(645, 120)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">:</text>
     	<text class="left mid" x="10" y="35">;</text>
     	<text class="right top" x="50" y="18">&#x30B;</text>
@@ -325,7 +325,7 @@
     	<text class="right bottom" x="50" y="52">&#x0B0;</text>
     </g>
     <g transform="translate(705, 120)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">"</text>
     	<text class="left mid" x="10" y="35">'</text>
     	<text class="right top" x="50" y="18">&#x1E9E;</text>
@@ -333,16 +333,16 @@
     	<text class="right bottom" x="50" y="52">&#x2032;</text>
     </g>
     <g transform="translate(765, 120)">
-    	<rect x="0" y="0" width="135" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="135" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="mid" x="67.5" y="35">Enter</text>
     </g>
     
     <g transform="translate(0, 180)">
-    	<rect x="0" y="0" width="75" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="75" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="mid" x="37.5" y="35">Shift</text>
     </g>
     <g transform="translate(75, 180)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18"></text>
     	<text class="left mid" x="10" y="35"> </text>
     	<text class="right top" x="50" y="18">&#x0A6;</text>
@@ -350,7 +350,7 @@
     	<text class="right bottom" x="50" y="52">&#x266A;</text>
     </g>
     <g transform="translate(135, 180)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">Z</text>
     	<text class="left mid" x="10" y="35">z</text>
     	<text class="right top" x="50" y="18">&#x1B7;</text>
@@ -358,7 +358,7 @@
     	<text class="right bottom" x="50" y="52">&#x0AB;</text>
     </g>
     <g transform="translate(195, 180)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">X</text>
     	<text class="left mid" x="10" y="35">x</text>
     	<text class="right top" x="50" y="18">&#x201A;</text>
@@ -366,7 +366,7 @@
     	<text class="right bottom" x="50" y="52">&#x0BB;</text>
     </g>
     <g transform="translate(255, 180)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">C</text>
     	<text class="left mid" x="10" y="35">c</text>
     	<text class="right top" x="50" y="18">&#x0A9;</text>
@@ -374,7 +374,7 @@
     	<text class="right bottom" x="50" y="52">&#x2015;</text>
     </g>
     <g transform="translate(315, 180)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">V</text>
     	<text class="left mid" x="10" y="35">v</text>
     	<text class="right top" x="50" y="18">&#x2018;</text>
@@ -382,7 +382,7 @@
     	<text class="right bottom" x="50" y="52">&#x2039;</text>
     </g>
     <g transform="translate(375, 180)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">B</text>
     	<text class="left mid" x="10" y="35">b</text>
     	<text class="right top" x="50" y="18">&#x2019;</text>
@@ -390,7 +390,7 @@
     	<text class="right bottom" x="50" y="52">&#x203A;</text>
     </g>
     <g transform="translate(435, 180)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">N</text>
     	<text class="left mid" x="10" y="35">n</text>
     	<text class="right top" x="50" y="18">&#x220;</text>
@@ -398,7 +398,7 @@
     	<text class="right bottom" x="50" y="52">&#x2013;</text>
     </g>
     <g transform="translate(495, 180)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">M</text>
     	<text class="left mid" x="10" y="35">m</text>
     	<text class="right top" x="50" y="18">&#x0BA;</text>
@@ -406,7 +406,7 @@
     	<text class="right bottom" x="50" y="52">&#x2014;</text>
     </g>
     <g transform="translate(555, 180)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18"></text>
     	<text class="left mid" x="10" y="35"> </text>
     	<text class="right top" x="50" y="18">&#x0D7;</text>
@@ -414,7 +414,7 @@
     	<text class="right bottom" x="50" y="52">&#x024;</text>
     </g>
     <g transform="translate(615, 180)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18"></text>
     	<text class="left mid" x="10" y="35"> </text>
     	<text class="right top" x="50" y="18">&#x0F7;</text>
@@ -422,7 +422,7 @@
     	<text class="right bottom" x="50" y="52">&#x023;</text>
     </g>
     <g transform="translate(675, 180)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18"></text>
     	<text class="left mid" x="10" y="35"> </text>
     	<text class="right top" x="50" y="18">&#x13F;</text>
@@ -430,24 +430,24 @@
     	<text class="right bottom" x="50" y="52">&#x2011;</text>
     </g>
     <g transform="translate(735, 180)">
-    	<rect x="0" y="0" width="165" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="165" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="mid" x="82.5" y="35">Shift</text>
     </g>
     
     <g transform="translate(0, 240)">
-    	<rect x="0" y="0" width="105" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="105" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="mid" x="52.5" y="35">Ctrl</text>
     </g>
     <g transform="translate(105, 240)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="mid" x="30" y="25">Win<tspan x="30" y="45">Key</tspan></text>
     </g>
     <g transform="translate(165, 240)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="mid" x="30" y="35">Alt</text>
     </g>
     <g transform="translate(225, 240)">
-    	<rect x="0" y="0" width="420" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="420" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="left top" x="10" y="18">&#x202F;</text>
     	<text class="mid" x="210" y="35">(Space)</text>
     	<text class="right top" x="415" y="18" text-anchor="end">ZWNJ</text>
@@ -455,19 +455,19 @@
     	<text class="right bottom" x="415" y="52" text-anchor="end">&#x0A0; NBSP</text>
     </g>
     <g transform="translate(645, 240)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="mid" x="30" y="25">Alt<tspan x="30" y="45">Graph</tspan></text>
     </g>
     <g transform="translate(705, 240)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="mid" x="30" y="25">Win<tspan x="30" y="45">Key</tspan></text>
     </g>
     <g transform="translate(765, 240)">
-    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="60" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="mid" x="30" y="35">Menu</text>
     </g>
     <g transform="translate(825, 240)">
-    	<rect x="0" y="0" width="75" height="60" rx="4" ry="4" fill="white" stroke="black"/>
+    	<rect x="0" y="0" width="75" height="60" rx="4" ry="4" fill="#ececec" stroke="black"/>
     	<text class="mid" x="32.5" y="35">Menu</text>
     </g>