1 files changed, 204 insertions, 0 deletions
diff --git a/design/style.css b/design/style.css
new file mode 100644
index 0000000..d186eda
--- /dev/null
+++ b/design/style.css
@@ -0,0 +1,204 @@
+body {
+  background: #eeeeee;
+  padding: 0px;
+  margin: 0px;
+  width: 400px;
+}
+
+@media (min-device-width: 400px) and (min-width: 400px) {
+	body {
+	  	width: 100%;
+	}
+}
+
+a {
+  color: #007;
+  text-decoration: none;
+}
+
+h1 {
+  clear: both;
+  margin: 0px;
+  padding: 0px;
+  font-size: 1.2em;
+  text-align: center;
+  text-transform: uppercase;
+}
+
+.menu {
+  padding: 4px;
+  margin-bottom: 8px;
+  background: #ddd;
+  border-bottom: 1px solid #ccc;
+}
+
+.menu .right {
+	float: right;
+}
+
+.menu .right a {
+	text-align: right;
+}
+
+.menu a {
+	display: inline-block;
+	padding: 8px;
+}
+
+@media (min-device-width: 400px) and (min-width: 400px) {
+	.menu {
+		padding-left: 20px;
+		padding-right: 20px;
+	}
+
+	.menu a {
+		min-width: 100px;
+		padding: 4px;
+	}
+}
+
+.contents-left, .contents-right {
+	padding: 2px;
+}
+
+@media (min-device-width: 400px) and (min-width: 400px) {
+	.contents-left {
+		position: absolute;
+		top: 50px;
+		left: 0px;
+		bottom: 16px;
+		width: 300px;
+		border-right: 1px solid #ccc;
+		overflow: auto;
+		padding: 16px;
+	}
+
+	.contents-right {
+		position: absolute;
+		top: 50px;
+		left: 332px;
+		bottom: 16px;
+		right: 0px;
+		overflow: auto;
+		padding: 16px;
+	}
+}
+
+dt {
+	font-weight: bold;
+}
+
+iframe, textarea {
+	width: 98%;
+	min-height: 200px;
+}
+
+@media (min-device-width: 400px) and (min-width: 400px) {
+	label {
+		border-bottom: 1px dashed gray;
+	}
+
+	label, .empty_label {
+	  display: inline-block;
+	  width: 200px;
+	  margin-right: 8px;
+	}
+
+	form {
+	  padding-left: 8px;
+	  padding-bottom: 8px;
+	  border: 1px solid #ccc;
+	  border-top: 0px;
+	  border-right: 0px;
+	  margin-top: 16px;
+	}
+
+	input[type=submit], button {
+		width: 100px;
+		margin-right: 8px;
+	}
+
+	input[type=text], input[type=password] {
+		width: 300px;
+	}
+
+	iframe, textarea {
+	  border: 1px solid gray;
+	  width: 98%;
+	  height: 400px;
+	}
+
+	textarea {
+		margin: 8px;
+	}
+}
+
+.error {
+  margin-top: 8px;
+  margin-bottom: 8px;
+  padding: 8px;
+  border: 1px solid red;
+  color: red;
+  background-color: #FCC;
+}
+
+.message {
+  margin-top: 8px;
+  margin-bottom: 8px;
+  padding: 8px;
+  border: 1px solid green;
+  background-color: #CFC;
+  color: green;
+}
+
+.tree_branch {
+	border-left: 1px solid #ddd;
+	padding-left: 16px;
+	margin-bottom: 4px;
+}
+
+.tree_root p {
+	margin: 0px;
+	padding: 1px;
+	padding-top: 8px;
+}
+
+.tree_branch p {
+	margin: 0px;
+	padding: 1px;
+}
+
+.small_right {
+	float: right;
+}
+
+.small_right, .tool_link {
+	font-size: 0.8em;
+	font-style: italic;
+}
+
+table {
+	margin: 8px;
+	width: 99%;
+	border-collapse: collapse;
+}
+
+td, th {
+	border: 1px solid #bbb;
+}
+
+td {
+	background-color: #eee;
+	padding: 6px;
+	vertical-align: top;
+}
+
+th {
+	background-color: #ddd;
+	padding: 2px;
+	text-align: center;
+}
+
+abbr {
+	border-bottom: 1px dashed #999;
+}