+body{\r
+ background-color: #F0F0EE; \r
+ font: 12px monospace, sans-serif;\r
+}\r
+\r
+select{\r
+ background-color: #F9F9F9;\r
+ border: solid 1px #888888;\r
+}\r
+\r
+h1, h2, h3, h4, h5, h6{\r
+ margin: 0;\r
+ padding: 0;\r
+ color: #2B6FB6;\r
+}\r
+\r
+h1{\r
+ font-size: 1.5em;\r
+}\r
+\r
+div#char_list{\r
+ height: 200px;\r
+ overflow: auto;\r
+ padding: 1px;\r
+ border: 1px solid #0A246A;\r
+ background-color: #F9F9F9;\r
+ clear: both;\r
+ margin-top: 5px;\r
+}\r
+\r
+a.char{\r
+ display: block;\r
+ float: left;\r
+ width: 20px;\r
+ height: 20px;\r
+ line-height: 20px;\r
+ margin: 1px;\r
+ border: solid 1px #888888;\r
+ text-align: center;\r
+ cursor: pointer;\r
+}\r
+\r
+a.char:hover{\r
+ background-color: #CCCCCC;\r
+}\r
+\r
+.preview{\r
+ border: solid 1px #888888;\r
+ width: 50px;\r
+ padding: 2px 5px;\r
+ height: 35px;\r
+ line-height: 35px;\r
+ text-align:center; \r
+ background-color: #CCCCCC;\r
+ font-size: 2em;\r
+ float: right;\r
+ font-weight: bold;\r
+ margin: 0 0 5px 5px;\r
+}\r
+\r
+#preview_code{\r
+ font-size: 1.1em;\r
+ width: 70px;\r
+}\r