From 2e5abd585874b18d5e94067ca7704a1966df3226 Mon Sep 17 00:00:00 2001
From: jsdelfino <jsdelfino@13f79535-47bb-0310-9956-ffa450edef68>
Date: Mon, 26 Aug 2013 03:04:34 +0000
Subject: Refactor base Javascript and CSS utilities and support server-side
 aggregation of HTML and Javascript.

git-svn-id: http://svn.us.apache.org/repos/asf/tuscany@1517415 13f79535-47bb-0310-9956-ffa450edef68
---
 sca-cpp/trunk/modules/js/htdocs/ui.css | 1032 ++++++++++----------------------
 1 file changed, 301 insertions(+), 731 deletions(-)

(limited to 'sca-cpp/trunk/modules/js/htdocs/ui.css')

diff --git a/sca-cpp/trunk/modules/js/htdocs/ui.css b/sca-cpp/trunk/modules/js/htdocs/ui.css
index cdc9e31aef..69299eb882 100644
--- a/sca-cpp/trunk/modules/js/htdocs/ui.css
+++ b/sca-cpp/trunk/modules/js/htdocs/ui.css
@@ -21,16 +21,14 @@
  * Main body.
  */
 body, .body {
-margin-top: 0px; margin-bottom: 2px; margin-left: 2px; margin-right: 2px;
-font-family: "Lucida Grande", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 14px;
-background-color: #ffffff; opacity: 1;
+margin-top: 0px; margin-bottom: 2px; margin-left: 0px; margin-right: 0px;
+font-family: "Helvetica Neue", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 14px;
+cursor: default;
 -webkit-font-smoothing: subpixel-antialiased;
--webkit-text-size-adjust: none;
+-webkit-text-size-adjust: none; -moz-text-size-adjust: none;
 -webkit-touch-callout: none;
 -webkit-tap-highlight-color: rgba(0,0,0,0);
--webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
-cursor: default;
--webkit-backface-visibility: hidden;
+-webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;
 }
 
 .delayed {
@@ -38,174 +36,63 @@ display: none;
 }
 
 .installer {
-position: relative; width: 0px; height: 0px; display: none; visibility: hidden; background: transparent;
+position: absolute; width: 0px; height: 0px; display: none; visibility: hidden;
 }
 
 .filler {
-position: relative; left: 0px; top: 0px; width: 1px; background: transparent; z-index: -20;
+position: absolute; left: 0px; top: 0px; width: 1px; z-index: -20;
 }
 
 /**
- * Main view.
+ * Views.
  */
 .viewcontainer3dm {
-position: fixed; left: 0px; top: 70px; right: 0px; bottom: 25px; padding-top: 2px; padding-bottom: 2px;
--webkit-backface-visibility: hidden;
+position: absolute; left: 0px; top: 0px; right: 0px;
 }
 
 .viewcontainer3d {
-position: fixed; left: 0px; top: 70px; right: 0px; bottom: 25px; padding-top: 2px; padding-bottom: 2px;
--webkit-backface-visibility: hidden;
-}
-
-.leftviewloading3dm {
-position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px;
-z-index: -5; background-color: #ffffff;
--webkit-transform: translate(100%, 0px);
--moz-transform: translate(100%, 0px);
--ms-transform: translate(100%, 0px);
--o-transform: translate(100%, 0px);
-transform: translate(100%, 0px);
--webkit-backface-visibility: hidden;
-}
-
-.rightviewloading3dm {
-position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px;
-z-index: -5; background-color: #ffffff;
--webkit-transform: translate(-100%, 0px);
--moz-transform: translate(-100%, 0px);
--ms-transform: translate(-100%, 0px);
--o-transform: translate(-100%, 0px);
-transform: translate(-100%, 0px);
--webkit-backface-visibility: hidden;
-}
-
-.viewloading3d {
-position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px;
-z-index: -5; background-color: #ffffff;
--webkit-transform: translate(100%, 0px);
--moz-transform: translate(100%, 0px);
--ms-transform: translate(100%, 0px);
--o-transform: translate(100%, 0px);
-transform: translate(100%, 0px);
--webkit-backface-visibility: hidden;
-}
-
-.viewloaded3dm {
-position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px;
-z-index: 0; background-color: #ffffff;
--webkit-transition: -webkit-transform 0.4s ease-in-out;
--moz-transition: -moz-transform 0.4s ease-in-out;
--ms-transition: -ms-transform 0.4s ease-in-out;
--o-transition: -o-transform 0.4s ease-in-out;
-transition: transform 0.4s ease-in-out;
--webkit-transform: translate(0px, 0px);
--moz-transform: translate(0px, 0px);
--ms-transform: translate(0px, 0px);
--o-transform: translate(0px, 0px);
-transform: translate(0px, 0px);
--webkit-backface-visibility: hidden;
-}
-
-.viewloaded3d {
-position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px;
-z-index: 0; background-color: #ffffff;
--webkit-transform: translate(0px, 0px);
--moz-transform: translate(0px, 0px);
--ms-transform: translate(0px, 0px);
--o-transform: translate(0px, 0px);
-transform: translate(0px, 0px);
--webkit-backface-visibility: hidden;
-}
-
-.viewunloading3dm {
-position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px;
-z-index: -10; background-color: #ffffff;
--webkit-transform: translate(0px, 0px);
--moz-transform: translate(0px, 0px);
--ms-transform: translate(0px, 0px);
--o-transform: translate(0px, 0px);
-transform: translate(0px, 0px);
--webkit-backface-visibility: hidden;
-}
-
-.leftviewunloaded3dm {
-position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px;
-z-index: -10; background-color: #ffffff;
--webkit-transition: -webkit-transform 0.4s ease-in-out;
--moz-transition: -moz-transform 0.4s ease-in-out;
--ms-transition: -ms-transform 0.4s ease-in-out;
--o-transition: -o-transform 0.4s ease-in-out;
-transition: transform 0.4s ease-in-out;
--webkit-transform: translate(-100%, 0px);
--moz-transform: translate(-100%, 0px);
--ms-transform: translate(-100%, 0px);
--o-transform: translate(-100%, 0px);
-transform: translate(-100%, 0px);
--webkit-backface-visibility: hidden;
-}
-
-.rightviewunloaded3dm {
-position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px;
-z-index: -10; background-color: #ffffff;
--webkit-transition: -webkit-transform 0.4s ease-in-out;
--moz-transition: -moz-transform 0.4s ease-in-out;
--ms-transition: -ms-transform 0.4s ease-in-out;
--o-transition: -o-transform 0.4s ease-in-out;
-transition: transform 0.4s ease-in-out;
--webkit-transform: translate(100%, 0px);
--moz-transform: translate(100%, 0px);
--ms-transform: translate(100%, 0px);
--o-transform: translate(100%, 0px);
-transform: translate(100%, 0px);
--webkit-backface-visibility: hidden;
-}
-
-.viewunloaded3d {
-position: absolute; left: 0px; top: 0px; right: 0px; bottom: 0px;
-z-index: -10; background-color: #ffffff;
--webkit-transform: translate(-100%, 0px);
--moz-transform: translate(-100%, 0px);
--ms-transform: translate(-100%, 0px);
--o-transform: translate(-100%, 0px);
-transform: translate(-100%, 0px);
--webkit-backface-visibility: hidden;
+position: absolute; left: 0px; top: 0px; right: 0px;
 }
 
 .viewcontent {
-position: absolute; left: 0px; top: 2px; right: 0px; bottom: 0px;
-overflow-x: hidden; overflow-y: scroll; -webkit-overflow-scrolling: touch;
--webkit-backface-visibility: hidden;
+position: absolute; left: 0px; top: 0px; width: 100%; padding-top: 35px; overflow: hidden;
 }
 
 .viewform {
-position: absolute; left: 0px; top: 2px; right: 0px; bottom: 0px;
-overflow-x: hidden; overflow-y: scroll; -webkit-overflow-scrolling: touch;
--webkit-backface-visibility: hidden;
-}
-
-/**
- * View header and footer.
- */
-.viewhead {
-position: fixed; left: 0px; top: 35px; height: 35px; line-height: 35px; width: 100%; z-index: 8;
-font-size: 15px; font-weight: bold; background-color: #f5f5f5; color: #000000;
-border-top: 1px; border-bottom: 1px; border-left: 0px; border-right: 0px;
-border-style: solid; border-top-color: #e5e5e5; border-bottom-color: #e5e5e5;
--webkit-backface-visibility: hidden;
+position: absolute; left: 0px; top: 0px; width: 100%; padding-top: 35px; overflow: hidden;
 }
 
 .viewfoot {
-position: fixed; left: 0px; bottom: 0px; height: 25px; line-height: 25px; width: 100%; z-index: 8;
+position: fixed; left: 0px; bottom: 0px; height: 0px; width: 100%; z-index: 8;
 font-size: 12px; background-color: #ffffff; color: #404040;
-border-top: 1px; border-bottom: 1px; border-left: 0px; border-right: 0px;
-border-style: solid; border-top-color: #e5e5e5; border-bottom-color: #ffffff;
--webkit-backface-visibility: hidden;
+border-top: 0px; border-bottom: 0px; border-left: 0px; border-right: 0px;
+-webkit-backface-visibility: hidden; -moz-backface-visibility: hidden;
 }
 
-.note {
-font-size: 12px; color: #808080;
-text-transform: none;
+.centeredform {
+max-width: 800px; margin: auto; padding-left: 2px; padding-right: 2px;
+}
+
+.centeredpage {
+max-width: 800px; margin: auto; padding-left: 2px; padding-right: 2px;
+}
+
+.grid100 {
+position: absolute; left: 0px; top: 0px; right: 0px; height: 460px;
+z-index: 3; overflow: hidden;
+-webkit-backface-visibility: hidden; -mozz-backface-visibility: hidden;
+}
+
+.grid320 {
+position: absolute; left: 0px; top: 0px; width: 320px; height: 460px;
+z-index: 4; overflow: hidden;
+-webkit-backface-visibility: hidden; -mozz-backface-visibility: hidden;
+}
+
+.gridfluid {
+position: absolute; left: 0px; top: 0px; height: 460px;
+z-index: 4; overflow: visible;
+-webkit-backface-visibility: hidden; -mozz-backface-visibility: hidden;
 }
 
 /**
@@ -213,47 +100,51 @@ text-transform: none;
  */
 .tbarmenu {
 position: fixed; top: 0px; left: 0px; z-index: 10; width: 100%; margin: 0px; padding: 0px; border-collapse: separate;
-height: 35px; line-height: 35px; background-color: #2c2c2c;
-border-top: 1px; border-bottom: 1px; border-left: 0px; border-right: 0px; border-style: solid; border-top-color: #2c2c2c; border-bottom-color: #2c2c2c;
--webkit-backface-visibility: hidden;
+height: 35px; line-height: 35px; background-color: #f5f5f5; font-size: 18px; overflow: hidden;
+border-top: 0px; border-bottom: 0px; border-left: 0px; border-right: 0px; border-style: solid; border-top-color: #f5f5f5; border-bottom-color: #f5f5f5;
+-webkit-backface-visibility: hidden; -moz-backface-visibility: hidden;
+opacity: 0.95;
 }
 
-.tbarleft {
-padding-left: 2px; padding-right: 6px; white-space: nowrap; float: left;
-text-transform: uppercase;
+.tbartitle {
+position: absolute; top: 0px; left: 0px; width: 100%; text-align: center; z-index: 11;
 }
 
-.tbarright {
-padding-left: 6px; padding-right: 2px; white-space: nowrap; float: right;
+.tbaritems {
+position: absolute; top: 0px; left: 0px; width: 100%; z-index: 12;
 }
 
-.tbaramenu {
-font-size: 15px; color: #cccccc; text-decoration: none; white-space: nowrap;
+.tbarleft {
+padding-left: 6px; padding-right: 6px; float: left; display: inline-block;
 }
 
-.tbarsmenu {
-font-size: 15px; font-weight: bold; color: #ffffff; text-decoration: none; white-space: nowrap;
+.tbarcenter {
+padding-left: 6px; padding-right: 6px; font-size: 24px!important;
+display: inline-block; max-width: 160px; overflow: hidden; text-overflow: ellipsis;
 }
 
-.amenu {
-padding-left: 2px; padding-right: 6px; white-space: nowrap; color: #808080; text-decoration: none; float: left;
+.tbarright {
+padding-left: 6px; padding-right: 6px; float: right; display: inline-block;
+}
+
+.tbaramenu {
+color: #357ae8; text-decoration: none;
 }
 
-.smenu {
-padding-left: 2px; padding-right: 6px; white-space: nowrap; color: #000000; text-decoration: none; float: left;
+.tbarsmenu {
+font-weight: bold; color: #357ae8; text-decoration: none;
 }
 
-.cmenu {
-font-size: 15px; padding-left: 6px; padding-right: 6px; white-space: nowrap; color: #000000; text-decoration: none; float: left;
-padding-left: 45px;
+.tbarbluemenu {
+color: #357ae8; text-decoration: none;
 }
 
-.bcmenu {
-font-size: 22px; padding-left: 2px; padding-right: 6px; white-space: nowrap; color: #000000; text-decoration: none;
+.tbarredmenu {
+color: #d14836; text-decoration: none;
 }
 
-.rmenu {
-padding-left: 2px; padding-right: 2px; white-space: nowrap; white-space: nowrap; float: right;
+.tbargreenmenu {
+color: #3d9400; text-decoration: none;
 }
 
 /**
@@ -261,74 +152,51 @@ padding-left: 2px; padding-right: 2px; white-space: nowrap; white-space: nowrap;
  */
 .status3d {
 position: absolute; left: 0px; bottom: 0px; height: 25px; line-height: 25px; width: 100%; z-index: 9;
-background-color: #ffffff; color: #404040;
+background-color: #f5f5f5; color: #404040;
 border-top: 0px; border-bottom: 0px; border-left: 0px; border-right: 0px;
-border-style: solid; border-top-color: #e5e5e5; border-bottom-color: #ffffff;
--webkit-transform: translate(0px, 0px);
--moz-transform: translate(0px, 0px);
--ms-transform: translate(0px, 0px);
--o-transform: translate(0px, 0px);
-transform: translate(0px, 0px);
--webkit-backface-visibility: hidden;
+border-style: solid; border-top-color: #f5f5f5; border-bottom-color: #ffffff;
+transform: translate(0px, 0px); -webkit-transform: translate(0px, 0px); -moz-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px);
+-webkit-backface-visibility: hidden; -moz-backface-visibility: hidden;
+opacity: 0.95;
 }
 
 .statusout3d {
 position: absolute; left: 0px; bottom: 0px; height: 25px; line-height: 25px; width: 100%; z-index: 9;
-background-color: #ffffff; color: #404040;
-border-top: 0px; border-bottom: 0px; border-left: 0px; border-right: 0px;
-border-style: solid; border-top-color: #e5e5e5; border-bottom-color: #ffffff;
--webkit-transition: -webkit-transform 0.4s ease-in-out;
--moz-transition: -moz-transform 0.4s ease-in-out;
--ms-transition: -ms-transform 0.4s ease-in-out;
--o-transition: -o-transform 0.4s ease-in-out;
-transition: transform 0.4s ease-in-out;
--webkit-transform: translate(0px, 25px);
--moz-transform: translate(0px, 25px);
--ms-transform: translate(0px, 25px);
--o-transform: translate(0px, 25px);
-transform: translate(0px, 25px);
--webkit-backface-visibility: hidden;
+background-color: #f5f5f5; color: #404040;
+border-top: 0px; border-bottom: 0px; border-left: 0px; border-right: 0px; border-style: solid; border-top-color: #f5f5f5; border-bottom-color: #ffffff;
+transform: translate(0px, 25px); -webkit-transform: translate(0px, 25px); -moz-transform: translate(0px, 25px); -ms-transform: translate(0px, 25px);
+transition: transform 0.4s ease-in-out; -webkit-transition: -webkit-transform 0.4s ease-in-out; -moz-transition: transform 0.4s ease-in-out;
+-webkit-backface-visibility: hidden; -moz-backface-visibility: hidden;
+opacity: 0.95;
 }
 
 .status3dm {
 position: absolute; left: 0px; bottom: 0px; height: 25px; line-height: 25px; width: 100%; z-index: 9;
-background-color: #ffffff; color: #404040;
-border-top: 0px; border-bottom: 0px; border-left: 0px; border-right: 0px;
-border-style: solid; border-top-color: #e5e5e5; border-bottom-color: #ffffff;
--webkit-transform: translate(0px, 0px);
--moz-transform: translate(0px, 0px);
--ms-transform: translate(0px, 0px);
--o-transform: translate(0px, 0px);
-transform: translate(0px, 0px);
--webkit-backface-visibility: hidden;
+background-color: #f5f5f5; color: #404040;
+border-top: 0px; border-bottom: 0px; border-left: 0px; border-right: 0px; border-style: solid; border-top-color: #f5f5f5; border-bottom-color: #ffffff;
+transform: translate(0px, 0px); -webkit-transform: translate(0px, 0px); -moz-transform: translate(0px, 0px); -ms-transform: translate(0px, 0px);
+-webkit-backface-visibility: hidden; -moz-backface-visibility: hidden;
+opacity: 0.95;
 }
 
 .statusout3dm {
 position: absolute; left: 0px; bottom: 0px; height: 25px; line-height: 25px; width: 100%; z-index: 9;
-background-color: #ffffff; color: #404040;
-border-top: 0px; border-bottom: 0px; border-left: 0px; border-right: 0px;
-border-style: solid; border-top-color: #e5e5e5; border-bottom-color: #ffffff;
--webkit-transition: -webkit-transform 0.4s ease-in-out;
--moz-transition: -moz-transform 0.4s ease-in-out;
--ms-transition: -ms-transform 0.4s ease-in-out;
--o-transition: -o-transform 0.4s ease-in-out;
-transition: transform 0.4s ease-in-out;
--webkit-transform: translate(0px, 25px);
--moz-transform: translate(0px, 25px);
--ms-transform: translate(0px, 25px);
--o-transform: translate(0px, 25px);
-transform: translate(0px, 25px);
--webkit-backface-visibility: hidden;
+background-color: #f5f5f5; color: #404040;
+border-top: 0px; border-bottom: 0px; border-left: 0px; border-right: 0px; border-style: solid; border-top-color: #f5f5f5; border-bottom-color: #ffffff;
+transform: translate(0px, 25px); -webkit-transform: translate(0px, 25px); -moz-transform: translate(0px, 25px); -ms-transform: translate(0px, 25px);
+transition: transform 0.4s ease-in-out; -webkit-transition: -webkit-transform 0.4s ease-in-out; -moz-transition: transform 0.4s ease-in-out;
+-webkit-backface-visibility: hidden; -moz-backface-visibility: hidden;
+opacity: 0.95;
 }
 
 .okstatus {
-font-size: 14px; padding-left: 6px; padding-right: 6px; white-space: nowrap; text-decoration: none;
-background-color: #f5f5f5; color: #000000;
+font-size: 14px; padding-left: 6px; padding-right: 6px; text-decoration: none;
+color: #000000;
 width: 100%; margin-left: auto; margin-right: auto; text-align: center; float: right;
 }
 
 .errorstatus {
-font-size: 14px; padding-left: 6px; padding-right: 6px; white-space: nowrap; text-decoration: none;
+font-size: 14px; padding-left: 6px; padding-right: 6px; text-decoration: none;
 background-color: #d14836; color: #ffffff;
 width: 100%; margin-left: auto; margin-right: auto; text-align: center; float: right;
 }
@@ -339,71 +207,46 @@ width: 100%; margin-left: auto; margin-right: auto; text-align: center; float: r
 .working {
 position: fixed; z-index: 15; display: none; width: 60px; height: 60px; left: 50%; top: 50%; border-bottom-color: transparent;
 margin: -50px 0 0 -50px; border: 20px solid #c0c0c0; border-right-color: transparent;
-border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;
--webkit-box-shadow: 0 0 45px 5px #f5f5f5; -moz-box-shadow: 0 0 45px 5px #f5f5f5; -ms-box-shadow: 0 0 45px 5px #f5f5f5;
--o-box-shadow: 0 0 45px 5px #f5f5f5; box-shadow: 0 0 45px 5px #f5f5f5;
--webkit-animation: spin 1s linear infinite;
--moz-animation: spin 1s linear infinite;
--ms-animation: spin 1s linear infinite;
--o-animation: spin 1s linear infinite;
-animation: spin 1s linear infinite;
-}
-
-@-webkit-keyframes spin {
-from { -webkit-transform: rotate(0deg); opacity: 0.4; }
-50% { -webkit-transform: rotate(180deg); opacity: 1; }
-to { -webkit-transform: rotate(360deg); opacity: 0.4; }
-}
-
-@-moz-keyframes spin {
-from { -moz-transform: rotate(0deg); opacity: 0.4; }
-50% { -moz-transform: rotate(180deg); opacity: 1; }
-to { -moz-transform: rotate(360deg); opacity: 0.4; }
+border-radius: 60px; -webkit-border-radius: 60px; -moz-border-radius: 60px;
+animation: spin 0.8s linear infinite; -webkit-animation: webkit-spin 0.8s linear infinite; -moz-animation: moz-spin 0.8s linear infinite;
+-webkit-backface-visibility: hidden; -moz-backface-visibility: hidden;
 }
 
-@-ms-keyframes spin {
-from { -ms-transform: rotate(0deg); opacity: 0.4; }
-50% { -ms-transform: rotate(180deg); opacity: 1; }
-to { -ms-transform: rotate(360deg); opacity: 0.4; }
+@keyframes spin {
+0% { transform: rotate(0deg); opacity: 0.4; }
+50% { transform: rotate(180deg); opacity: 1; }
+100% { transform: rotate(360deg); opacity: 0.4; }
 }
 
-@-o-keyframes spin {
-from { -o-transform: rotate(0deg); opacity: 0.4; }
-50% { -o-transform: rotate(180deg); opacity: 1; }
-to { -o-transform: rotate(360deg); opacity: 0.4; }
+@-webkit-keyframes webkit-spin {
+0% { -webkit-transform: rotate(0deg); opacity: 0.4; }
+50% { -webkit-transform: rotate(180deg); opacity: 1; }
+100% { -webkit-transform: rotate(360deg); opacity: 0.4; }
 }
 
-@keyframes spin {
-from { transform: rotate(0deg); opacity: 0.4; }
+@-moz-keyframes moz-spin {
+0% { transform: rotate(0deg); opacity: 0.4; }
 50% { transform: rotate(180deg); opacity: 1; }
-to { transform: rotate(360deg); opacity: 0.4; }
+100% { transform: rotate(360deg); opacity: 0.4; }
 }
 
-/**
- * Refreshing status animation.
- */
 .refreshing {
 z-index: 14; display: none; width: 10px; height: 10px; border-bottom-color: transparent; vertical-align: top;
 border: 5px solid #c0c0c0; border-right-color: transparent;
-border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;
--webkit-box-shadow: 0 0 10px 5px #f5f5f5; -moz-box-shadow: 0 0 10px 5px #f5f5f5; -ms-box-shadow: 0 0 10px 5px #f5f5f5;
--o-box-shadow: 0 0 10px 5px #f5f5f5; box-shadow: 0 0 10px 5px #f5f5f5;
--webkit-animation: spin 1s linear infinite;
--moz-animation: spin 1s linear infinite;
--ms-animation: spin 1s linear infinite;
--o-animation: spin 1s linear infinite;
-animation: spin 1s linear infinite;
+border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px;
+animation: spin 0.8s linear infinite; -webkit-animation: webkit-spin 0.8s linear infinite; -moz-animation: moz-spin 0.8s linear infinite;
+-webkit-backface-visibility: hidden; -moz-backface-visibility: hidden;
 }
 
 /**
  * Scrollbars.
  */
-.flatscrollbars::-webkit-scrollbar{
+.flatscrollbars::-webkit-scrollbar {
 width: 10px; height: 10px; background-color: #ffffff;
-box-shadow: inset 1px 1px 0 rgba(0,0,0,.1), inset -1px -1px 0 rgba(0,0,0,.07);
+-webkit-box-shadow: inset 1px 1px 0 rgba(0,0,0,.1), inset -1px -1px 0 rgba(0,0,0,.07);
 }
 
-.flatscrollbars::-webkit-scrollbar:hover{
+.flatscrollbars::-webkit-scrollbar:hover {
 background-color: #eeeeee;
 }
 
@@ -412,16 +255,16 @@ background-color: #eeeeee;
 background-color: #666666;
 }
 
-.flatscrollbars::-webkit-scrollbar-thumb{
+.flatscrollbars::-webkit-scrollbar-thumb {
 min-height: 0.8em; min-width: 0.8em; background-color: rgba(0, 0, 0, .2);
-box-shadow: inset 1px 1px 0 rgba(0,0,0,.1), inset -1px -1px 0 rgba(0,0,0,.07);
+-webkit-box-shadow: inset 1px 1px 0 rgba(0,0,0,.1), inset -1px -1px 0 rgba(0,0,0,.07);
 }
 
-.flatscrollbars::-webkit-scrollbar-thumb:hover{
+.flatscrollbars::-webkit-scrollbar-thumb:hover {
 background-color: #bbbbbb;
 }
 
-.flatscrollbars::-webkit-scrollbar-thumb:active{
+.flatscrollbars::-webkit-scrollbar-thumb:active {
 background-color: #888888;
 }
 
@@ -429,129 +272,191 @@ background-color: #888888;
  * Base HTML elements.
  */
 .text {
-padding-top: 3px; padding-bottom: 4px; vertical-align: middle; white-space: nowrap;
+padding-top: 6px; padding-bottom: 0px; padding-left: 4px; padding-right: 4px; margin-left: 0px; margin-right: 0px; vertical-align: middle;
+line-height: 16px; min-height: 22px; min-width: 30px;
+display: inline-block;
+}
+
+.note {
+font-size: 14px; color: #808080; text-transform: none; min-width: 30px;
+}
+
+.doc {
+padding-left: 4px; padding-right: 4px; min-width: 30px;
+}
+
+.intro {
+font-size: 15px; padding-left: 4px; padding-right: 4px; color: #000000; min-width: 30px;
+}
+
+.help {
+font-size: 14px; padding-left: 4px; padding-right: 4px; color: #808080; min-width: 30px;
 }
 
 .bluetext {
-color: #4787ed;
+color: #4787ed; min-width: 30px;
 }
 
 .redtext {
-color: #d14836;
+color: #d14836; min-width: 30px;
 }
 
 .greentext {
-color: #3d9400;
+color: #3d9400; min-width: 30px;
 }
 
 h1 {
-font-size: 20px; font-weight: bold; vertical-align: middle; margin-top: 5px; margin-bottom: 5px; margin-left: 2px; margin-right: 2px; white-space: nowrap;
+font-size: 24px; font-weight: normal; vertical-align: middle; white-space: normal;
+padding-top: 0px; padding-bottom: 0px; padding-left: 4px; padding-right: 4px; margin-bottom: 6px; margin-left: 0px; margin-right: 0px;
+display: inline-block; line-height: 28px; min-height: 28px; min-width: 30px;
 }
 
 h2 {
-font-size: 18px; font-weight: bold; vertical-align: middle; margin-top: 5px; margin-bottom: 5px; margin-left: 2px; margin-right: 2px; white-space: nowrap;
-}
-
-.hw1 {
-font-size: 20px; font-weight: bold; vertical-align: middle; margin-top: 5px; margin-bottom: 5px; margin-left: 2px; margin-right: 2px; white-space: normal;
-}
-
-.hw2 {
-font-size: 18px; font-weight: bold; vertical-align: middle; margin-top: 5px; margin-bottom: 5px; margin-left: 2px; margin-right: 2px; white-space: normal;
+font-size: 20px; font-weight: normal; vertical-align: middle; white-space: normal;
+padding-top: 0px; padding-bottom: 0px; padding-left: 4px; padding-right: 4px; margin-bottom: 6px; margin-left: 0px; margin-right: 0px;
+display: inline-block; line-height: 28px; min-height: 28px; min-width: 30px;
 }
 
 .hd1 {
-font-size: 20px; font-weight: bold; white-space: nowrap; padding-top: 3px; padding-bottom: 4px; vertical-align: middle;
+font-size: 24px; font-weight: normal; vertical-align: middle; white-space: normal;
+padding-top: 0px; padding-bottom: 0px; padding-left: 4px; padding-right: 4px; margin-bottom: 6px; margin-left: 0px; margin-right: 0px;
+display: inline-block; line-height: 28px; min-height: 28px; min-width: 30px;
 }
 
 .hd2 {
-font-size: 18px; font-weight: bold; white-space: nowrap; padding-top: 3px; padding-bottom: 4px; vertical-align: middle;
+font-size: 20px; font-weight: normal; vertical-align: middle; white-space: normal;
+padding-top: 0px; padding-bottom: 0px; padding-left: 4px; padding-right: 4px; margin-bottom: 6px; margin-left: 0px; margin-right: 0px;
+display: inline-block; line-height: 28px; min-height: 28px; min-width: 30px;
+}
+
+.width100 {
+width: 312px;
 }
 
 .section {
-font-size: 15px; font-weight: bold; background-color: #f5f5f5; color: #000000; height: 30px; line-height: 30px; width: 100%; display: block;
-text-align: left; padding-top: 0px; padding-bottom: 0px; padding-left: 2px; padding-right: 2px; white-space: nowrap;
-border-top: 1px; border-bottom: 1px; border-left: 0px; border-right: 0px; border-style: solid; border-top-color: #e5e5e5; border-bottom-color: #e5e5e5; border-left-color: #e5e5e5; border-right-color: #e5e5e5;
+font-size: 20px; font-weight: normal;
+padding-top: 0px; padding-bottom: 0px; padding-left: 4px; padding-right: 4px; margin-left: 0px; margin-right: 0px;
+border-top: 1px; border-bottom: 1px; border-left: 0px; border-right: 0px; border-style: solid; border-top-color: #d9d9d9; border-bottom-color: #d9d9d9; border-left-color: #d9d9d9; border-right-color: #d9d9d9;
+display: inline-block; line-height: 26px; min-height: 28px; min-width: 30px;
 }
 
 .link {
-padding-top: 3px; padding-bottom: 4px; vertical-align: middle; white-space: nowrap;
+padding-top: 3px; padding-bottom: 4px; vertical-align: middle;
+display: inline-block; line-height: 16px; min-height: 16px; min-width: 30px;
 }
 
 a:link {
-color: #357ae8; text-decoration: none; white-space: nowrap; cursor: pointer;
+/*color: #357ae8; text-decoration: none; cursor: pointer;*/
+color: inherit; text-decoration: none; cursor: pointer;
 }
 
 a:visited {
-color: #357ae8; text-decoration: none; white-space: nowrap; cursor: pointer;
+/*color: #357ae8; text-decoration: none; cursor: pointer;*/
+color: inherit; text-decoration: none; cursor: pointer;
 }
 
-.label{
-font-weight: bold; padding-top: 6px;
-}
-
-.lightlabel{
-font-weight: normal; color: #808080; padding-top: 6px;
+.label {
+font-weight: normal; color: #808080;
+padding-top: 6px; padding-bottom: 2px; padding-left: 4px; padding-right: 4px; margin-left: 0px; margin-right: 0px; vertical-align: middle;
+display: inline-block; line-height: 16px; min-height: 20px; min-width: 30px;
 }
 
 input {
-font-family: "Lucida Grande", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 15px;
+font-family: "Helvetica Neue", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 16px; min-width: 30px;
+background-image: none;
 vertical-align: middle;
 outline: none;
--webkit-text-size-adjust: 100%;
+-webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%;
 }
 
 textarea {
-font-family: "Lucida Grande", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 15px;
+font-family: "Helvetica Neue", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 16px;
+background-image: none;
 outline: none;
 overflow: auto; resize: none;
 }
 
+.entry {
+padding-left: 4px; padding-right: 4px; padding-top: 0px; padding-bottom: 0px; margin: 0px;
+}
+
+.password {
+padding-left: 4px; padding-right: 4px; padding-top: 0px; padding-bottom: 0px; margin: 0px;
+}
+
 .flatentry {
-font-family: "Lucida Grande", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 15px;
-vertical-align: middle;
--webkit-appearance: none; appearance: none;
+font-family: "Helvetica Neue", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 16px; vertical-align: middle;
+height: 28px; width: 100%;
+-webkit-appearance: none; -moz-appearance: none!important;
+box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;
 border: 1px solid #d9d9d9!important; border-top: 1px solid silver!important;
-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;
-border-radius: 1px; -webkit-border-radius: 1px; -moz-border-radius: 1px;
-margin: 1px!important; padding: 3px 1px 3px 3px;
+border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px;
+margin: 1px!important; padding: 3px 3px 3px 3px;
+}
+
+.flattextarea {
+font-family: "Helvetica Neue", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 16px; vertical-align: middle;
+width: 100%;
+-webkit-appearance: none; -moz-appearance: none!important;
+box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;
+border: 1px solid #d9d9d9!important; border-top: 1px solid silver!important;
+border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px;
+margin: 1px!important; padding: 3px 3px 3px 3px;
+}
+
+.ifiller {
+-webkit-appearance: none; -moz-appearance: none;
+border: 0px; margin: 0px; padding: 0px;
+overflow: hidden; width: 100%; height: 0px;
 }
 
 .readentry {
-font-family: "Lucida Grande", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 15px;
-vertical-align: middle; color: #808080;
--webkit-appearance: none; appearance: none;
-border: 0px;
-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;
-border-radius: 1px; -webkit-border-radius: 1px; -moz-border-radius: 1px;
-margin: 1px!important; padding: 3px 1px 3px 3px;
+font-family: "Helvetica Neue", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 16px; vertical-align: middle;
+height: 28px; width: 100%;
+-webkit-appearance: none; -moz-appearance: none;
+box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;
+border: 1px solid #ffffff!important; border-top: 1px solid ffffff!important;
+border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px;
+margin: 1px!important; padding: 3px 3px 3px 3px;
 overflow: hidden; text-overflow: ellipsis;
 }
 
+.readtextarea {
+font-family: "Helvetica Neue", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 16px; vertical-align: middle;
+width: 100%;
+-webkit-appearance: none; -moz-appearance: none;
+box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;
+border: 1px solid #ffffff!important; border-top: 1px solid ffffff!important;
+border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px;
+margin: 1px!important; padding: 3px 3px 3px 3px;
+overflow: hidden; text-overflow: ellipsis;
+}
+
+.bigentry {
+font-size: 18px!important;
+}
+
 .searchentry {
-font-family: "Lucida Grande", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 15px;
-vertical-align: middle;
--webkit-appearance: searchfield; -moz-appearance: searchfield; -ms-appearance: searchfield; appearance: searchfield;
+font-family: "Helvetica Neue", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 16px; vertical-align: middle;
+height: 28px; width: 100%;
+-webkit-appearance: searchfield; -moz-appearance: searchfield;
+box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;
 border: 1px solid #d9d9d9!important; border-top: 1px solid silver!important;
-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;
-border-radius: 1px; -webkit-border-radius: 1px; -moz-border-radius: 1px;
-margin: 1px!important; padding: 3px 1px 3px 3px;
+border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px;
+margin: 1px!important; padding: 3px 3px 3px 3px;
 }
 
 .checkbox {
-padding-top: 3px; padding-bottom: 4px; vertical-align: middle; white-space: nowrap;
+padding-top: 3px; padding-bottom: 4px; vertical-align: middle;
 }
 
 .flatcheckbox {
 }
 
 .editablewidget {
--webkit-user-select: text; -moz-user-select: text; -ms-user-select: text; user-select: text;
-outline: none; -moz-outline-style: none;
-}
-
-.noneditablewidget {
-outline: none; -moz-outline-style: none;
+-webkit-user-select: text; -moz-user-select: text; -ms-user-select: text;
+outline: none; outline-style: none;
+display: block;
 }
 
 iframe {
@@ -559,25 +464,44 @@ border: 0px; margin: 0px; padding: 0px;
 }
 
 img {
+padding: 0px; margin: 0px; border: 0px;
+border-radius: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px;
+display: inline-block;
+}
+
+.img {
+padding: 0px; margin: 0px; border: 0px;
+max-width: 320px; max-height: 460px;
 border: 0px;
+border-radius: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px;
+background-repeat: no-repeat; float: left;
+display: inline-block;
+}
+
+.thumbnail {
+padding: 0px; margin: 0px; border: 0px;
+max-width: 50x; max-height: 50px;
+border: 0px;
+border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px;
+background-repeat: no-repeat; float: left;
+display: inline-block;
 }
 
 /**
  * Tables.
  */
 table {
-border: 0px; border-collapse: collapse; border-color: #a2bae7; border-style: solid;
-font-family: "Lucida Grande", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 14px;
+border: 0px; border-collapse: collapse; border-color: #f5f5f5; border-style: solid;
+font-family: "Helvetica Neue", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 14px;
 }
 
 .table {
-width: 100%;
 }
 
 th {
-font-size: 15px; font-weight: bold; background-color: #f5f5f5; color: #000000;
-text-align: left; padding-left: 2px; padding-right: 8px; padding-top: 0px; padding-bottom: 0px; vertical-align: middle; white-space: nowrap;
-border-top: 1px; border-bottom: 1px; border-left: 1px; border-right: 1px; border-style: solid; border-top-color: #e5e5e5; border-bottom-color: #e5e5e5; border-left-color: #e5e5e5; border-right-color: #e5e5e5;
+font-size: 18px; font-weight: normal; background-color: #ffffff; color: #000000;
+padding-left: 2px; padding-right: 8px; padding-top: 0px; padding-bottom: 0px; vertical-align: middle;
+border-top: 1px; border-bottom: 1px; border-left: 1px; border-right: 1px; border-style: solid; border-top-color: #f5f5f5; border-bottom-color: #f5f5f5; border-left-color: #f5f5f5; border-right-color: #f5f5f5;
 }
 
 .thl {
@@ -593,7 +517,7 @@ padding: 0px;
 }
 
 td {
-padding-left: 2px; padding-top: 2px; padding-right: 8px; white-space: nowrap; vertical-align: middle; border: 0px;
+padding-left: 2px; padding-top: 2px; padding-right: 8px; vertical-align: middle; border: 0px;
 }
 
 .tdl {
@@ -609,33 +533,30 @@ padding-left: 2px; padding-top: 2px; padding-right: 8px; white-space: normal; ve
 }
 
 .datatd {
-border-top: 1px; border-bottom: 1px; border-style: solid; border-color: #dcdcdc; width: 10px; vertical-align: middle;
+border-top: 1px; border-bottom: 1px; border-style: solid; border-color: #f5f5f5; width: 10px; vertical-align: middle;
 }
 
 .datatdl {
-border-right: 1px; border-top: 1px; border-bottom: 1px; border-style: solid; border-color: #dcdcdc; width: 10px; vertical-align: middle;
+border-right: 1px; border-top: 1px; border-bottom: 1px; border-style: solid; border-color: #f5f5f5; width: 10px; vertical-align: middle;
 }
 
 .datatdltop {
-border-right: 1px; border-top: 1px; border-bottom: 1px; border-style: solid; border-color: #dcdcdc; width: 10px; vertical-align: top;
+border-right: 1px; border-top: 1px; border-bottom: 1px; border-style: solid; border-color: #f5f5f5; width: 10px; vertical-align: top;
 }
 
 .datatdr {
-border-left: 1px; border-top: 1px; border-bottom: 1px; border-style: solid; border-color: #dcdcdc; vertical-align: middle;
+border-left: 1px; border-top: 1px; border-bottom: 1px; border-style: solid; border-color: #f5f5f5; vertical-align: middle;
 }
 
 .list {
-width: 100%;
 }
 
 .datatable {
-border-top: 1px; border-bottom: 1px; border-style: solid; border-color: #dcdcdc; width: 100%;
+border-top: 1px; border-bottom: 1px; border-style: solid; border-color: #f5f5f5;
 }
 
 .databg {
-opacity: .6;  
--ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
-filter: alpha(opacity=60);
+opacity: 0.95;  
 }
 
 /**
@@ -643,416 +564,65 @@ filter: alpha(opacity=60);
  */
 button {
 vertical-align: middle;
-font-family: "Lucida Grande", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 15px;
-outline: none;
--webkit-text-size-adjust: 100%;
-}
-
-.plusminus {
-font-size: 18px; font-family: "Courier New";
+font-family: "Helvetica Neue", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 18px;
+-webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%;
 }
 
-.graybutton {
-display: inline-block; text-align: center; color: #444; font-weight: bold; font-size: 14px; text-transform: uppercase;
-padding-top: 0px; padding-bottom: 0px; padding-left: 4px; padding-right: 4px; margin-left: 2px; margin-right: 2px;
-height: 28px; line-height: 28px; min-width: 30px;
--webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
-cursor: default;
-border: 1px solid gainsboro; background-color: #f5f5f5;
-background-image: -webkit-gradient(linear,left top,left bottom,from(#f5f5f5),to(#f1f1f1));
-background-image: -webkit-linear-gradient(top,#f5f5f5,#f1f1f1);
-background-image: -moz-linear-gradient(top,#f5f5f5,#f1f1f1);
-background-image: -ms-linear-gradient(top,#f5f5f5,#f1f1f1);
-background-image: -o-linear-gradient(top,#f5f5f5,#f1f1f1);
-background-image: linear-gradient(top,#f5f5f5,#f1f1f1);
+button::-moz-focus-inner {
+outline: none!important; border: 0px!important;
 }
 
-.graybutton:hover {
-border: 1px solid #c6c6c6; color: #333; text-shadow: 0 1px rgba(0, 0, 0, 0.3); background-color: #f8f8f8;
-background-image: -webkit-gradient(linear,left top,left bottom,from(#f8f8f8),to(#f1f1f1));
-background-image: -webkit-linear-gradient(top,#f8f8f8,#f1f1f1);
-background-image: -moz-linear-gradient(top,#f8f8f8,#f1f1f1);
-background-image: -ms-linear-gradient(top,#f8f8f8,#f1f1f1);
-background-image: -o-linear-gradient(top,#f8f8f8,#f1f1f1);
-background-image: linear-gradient(top,#f8f8f8,#f1f1f1);
+.submit {
+visibility: hidden; height: 0px; width: 0px; max-height: 0px; padding: 0px; margin: 0px;
 }
 
-.graybutton:active {
--webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -ms-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
--o-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
+.symbolbutton {
+text-align: center; vertical-align: middle; font-family: "Courier"; font-size: 28px!important;
+display: inline-block; min-height: 28px; min-width: 30px; padding-top: 0px;
 }
 
-.graybutton:disabled {
-color: #c0c0c0;
+.minusbutton {
+text-align: center; vertical-align: top; font-family: "Courier"; font-size: 28px!important;
+display: inline-block; min-height: 28px; min-width: 30px; padding-top: 0px;
 }
 
-.graybutton:hover:disabled {
-color: #c0c0c0;
+.bigbutton {
+font-size: 24px!important; padding: 10px!important; height: 50px!important;
 }
 
-.lightbutton {
-display: inline-block; text-align: center; color: #444; font-weight: normal; font-size: 14px;
-padding-top: 0px; padding-bottom: 0px; padding-left: 4px; padding-right: 4px; margin-left: 2px; margin-right: 2px;
-height: 28px; line-height: 28px; min-width: 30px;
--webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
-cursor: default;
-border: 1px solid gainsboro; background-color: #f5f5f5;
-background-image: -webkit-gradient(linear,left top,left bottom,from(#f5f5f5),to(#f1f1f1));
-background-image: -webkit-linear-gradient(top,#f5f5f5,#f1f1f1);
-background-image: -moz-linear-gradient(top,#f5f5f5,#f1f1f1);
-background-image: -ms-linear-gradient(top,#f5f5f5,#f1f1f1);
-background-image: -o-linear-gradient(top,#f5f5f5,#f1f1f1);
-background-image: linear-gradient(top,#f5f5f5,#f1f1f1);
-}
-
-.lightbutton:hover {
-border: 1px solid #c6c6c6; color: #333; text-shadow: 0 1px rgba(0, 0, 0, 0.3); background-color: #f8f8f8;
-background-image: -webkit-gradient(linear,left top,left bottom,from(#f8f8f8),to(#f1f1f1));
-background-image: -webkit-linear-gradient(top,#f8f8f8,#f1f1f1);
-background-image: -moz-linear-gradient(top,#f8f8f8,#f1f1f1);
-background-image: -ms-linear-gradient(top,#f8f8f8,#f1f1f1);
-background-image: -o-linear-gradient(top,#f8f8f8,#f1f1f1);
-background-image: linear-gradient(top,#f8f8f8,#f1f1f1);
-}
-
-.lightbutton:active {
--webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -ms-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
--o-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
+.graybutton {
+color: #808080!important; font-size: 18px;
+padding-top: 0px; padding-bottom: 0px; padding-left: 6px; padding-right: 6px; margin-left: 0px; margin-right: 0px; text-align: center; vertical-align: top;
+display: inline-block; line-height: 28px; min-height: 28px; min-width: 30px;
 }
 
-.lightbutton:disabled {
-color: #c0c0c0;
+.blackbutton {
+color: #000000!important; font-size: 18px;
+padding-top: 0px; padding-bottom: 0px; padding-left: 6px; padding-right: 6px; margin-left: 0px; margin-right: 0px; text-align: center; vertical-align: top;
+display: inline-block; line-height: 28px; min-height: 28px; min-width: 30px;
 }
 
-.lightbutton:hover:disabled {
-color: #c0c0c0;
+.lightbutton {
+color: #808080!important; font-size: 18px;
+padding-top: 0px; padding-bottom: 0px; padding-left: 6px; padding-right: 6px; margin-left: 0px; margin-right: 0px; text-align: center; vertical-align: top;
+display: inline-block; line-height: 28px; min-height: 28px; min-width: 30px;
 }
 
 .bluebutton {
-display: inline-block; text-align: center; font-weight: bold; font-size: 14px; text-transform: uppercase;
-padding-top: 0px; padding-bottom: 0px; padding-left: 4px; padding-right: 4px; margin-left: 2px; margin-right: 2px;
-height: 28px; line-height: 28px; min-width: 30px;
--webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
-cursor: default;
-border: 1px solid #3079ed; color: #ffffff; text-shadow: 0 1px rgba(0, 0, 0, 0.1); background-color: #4d90fe;
-background-image: -webkit-gradient(linear,left top,left bottom,from(#4d90fe),to(#4787ed));
-background-image: -webkit-linear-gradient(top,#4d90fe,#4787ed);
-background-image: -moz-linear-gradient(top,#4d90fe,#4787ed);
-background-image: -ms-linear-gradient(top,#4d90fe,#4787ed);
-background-image: -o-linear-gradient(top,#4d90fe,#4787ed);
-background-image: linear-gradient(top,#4d90fe,#4787ed);
-}
-
-.bluebutton:hover {
-border: 1px solid #2f5bb7; color: #ffffff; text-shadow: 0 1px rgba(0, 0, 0, 0.3); background-color: #357ae8;
-background-image: -webkit-gradient(linear,left top,left bottom,from(#4d90fe),to(#357ae8));
-background-image: -webkit-linear-gradient(top,#4d90fe,#357ae8);
-background-image: -moz-linear-gradient(top,#4d90fe,#357ae8);
-background-image: -ms-linear-gradient(top,#4d90fe,#357ae8);
-background-image: -o-linear-gradient(top,#4d90fe,#357ae8);
-background-image: linear-gradient(top,#4d90fe,#357ae8);
-}
-
-.bluebutton:active {
--webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -ms-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
--o-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
-}
-
-.bluebutton:disabled {
-color: #c0c0c0;
-}
-
-.bluebutton:hover:disabled {
-color: #c0c0c0;
+color: #4d90fe!important; font-size: 18px;
+padding-top: 0px; padding-bottom: 0px; padding-left: 6px; padding-right: 6px; margin-left: 0px; margin-right: 0px; text-align: center; vertical-align: top;
+display: inline-block; line-height: 28px; min-height: 28px; min-width: 30px;
 }
 
 .greenbutton {
-display: inline-block; text-align: center; font-weight: bold; font-size: 14px; text-transform: uppercase;
-padding-top: 0px; padding-bottom: 0px; padding-left: 4px; padding-right: 4px; margin-left: 2px; margin-right: 2px;
-height: 28px; line-height: 28px; min-width: 30px;
--webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
-cursor: default;
-border: 1px solid #29691d; color: #ffffff; text-shadow: 0 1px rgba(0, 0, 0, 0.1); background-color: #3d9400;
-background-image: -webkit-gradient(linear,left top,left bottom,from(#3d9400),to(#398a00));
-background-image: -webkit-linear-gradient(top,#3d9400,#398a00);
-background-image: -moz-linear-gradient(top,#3d9400,#398a00);
-background-image: -ms-linear-gradient(top,#3d9400,#398a00);
-background-image: -o-linear-gradient(top,#3d9400,#398a00);
-background-image: linear-gradient(top,#3d9400,#398a00);
-}
-
-.greenbutton:hover {
-border: 1px solid #2d6200; color: #ffffff; text-shadow: 0 1px rgba(0, 0, 0, 0.3); background-color: #097b24;
-background-image: -webkit-gradient(linear,left top,left bottom,from(#3d9400),to(#097b24));
-background-image: -webkit-linear-gradient(top,#3d9400,#097b24);
-background-image: -moz-linear-gradient(top,#3d9400,#097b24);
-background-image: -ms-linear-gradient(top,#3d9400,#097b24);
-background-image: -o-linear-gradient(top,#3d9400,#097b24);
-background-image: linear-gradient(top,#3d9400,#097b24);
-}
-
-.greenbutton:active {
--webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -ms-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
--o-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
-}
-
-.greenbutton:disabled {
-color: #c0c0c0;
-}
-
-.greenbutton:hover:disabled {
-color: #c0c0c0;
+color: #3d9400!important; font-size: 18px;
+padding-top: 0px; padding-bottom: 0px; padding-left: 6px; padding-right: 6px; margin-left: 0px; margin-right: 0px; text-align: center; vertical-align: top;
+display: inline-block; line-height: 28px; min-height: 28px; min-width: 30px;
 }
 
 .redbutton {
-display: inline-block; text-align: center; font-weight: bold; font-size: 14px; text-transform: uppercase;
-padding-top: 0px; padding-bottom: 0px; padding-left: 4px; padding-right: 4px; margin-left: 2px; margin-right: 2px;
-height: 28px; line-height: 28px; min-width: 30px;
--webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
-cursor: default;
-border: 1px solid transparent; color: #ffffff; text-shadow: 0 1px rgba(0, 0, 0, 0.1); background-color: #d14836;
-background-image: -webkit-gradient(linear,left top,left bottom,from(#dd4b39),to(#d14836));
-background-image: -webkit-linear-gradient(top,#dd4b39,#d14836);
-background-image: -moz-linear-gradient(top,#dd4b39,#d14836);
-background-image: -ms-linear-gradient(top,#dd4b39,#d14836);
-background-image: -o-linear-gradient(top,#dd4b39,#d14836);
-background-image: linear-gradient(top,#dd4b39,#d14836);
-}
-
-.redbutton:hover {
-border: 1px solid #b0281a; border-bottom-color: #af301f; color: #ffffff; text-shadow: 0 1px rgba(0, 0, 0, 0.3); background-color: #c53727;
-background-image: -webkit-gradient(linear,left top,left bottom,from(#dd4b39),to(#c53727));
-background-image: -webkit-linear-gradient(top,#dd4b39,#c53727);
-background-image: -moz-linear-gradient(top,#dd4b39,#c53727);
-background-image: -ms-linear-gradient(top,#dd4b39,#c53727);
-background-image: -o-linear-gradient(top,#dd4b39,#c53727);
-background-image: linear-gradient(top,#dd4b39,#c53727);
-}
-
-.redbutton:active {
--webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); -ms-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
--o-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
-}
-
-.redbutton:disabled {
-color: #c0c0c0;
-}
-
-.redbutton:hover:disabled {
-color: #c0c0c0;
-}
-
-/**
- * Store.
- */
-.imgbutton {
-width: 142px; height: 64px; margin-left: 20px; margin-right: 20px; padding: 0px; border: 1px; cursor: pointer;
-}
-
-.box {
-width: 148px; display: inline-block; overflow: hidden; text-overflow: ellipsis;
-border: 1px; border-style: solid; border-color: #dcdcdc; border-collapse: collapse;
-white-space: nowrap; margin: 2px; padding: 2px; vertical-align: top;
-}
-
-.appicon {
-float: left; width: 50px; vertical-align: top; padding-right: 4px; padding-top: 2px; padding-bottom: 4px;
-overflow: hidden; text-overflow: ellipsis;
-}
-
-.appdetails {
-font-size: 13px; color: #808080; overflow: hidden; text-overflow: ellipsis;
-}
-
-.apptitle {
-font-size: 14px; font-weight: bold; overflow: hidden; text-overflow: ellipsis;
-}
-
-/**
- * Editor.
- */
-.pagediv {
-position: absolute; left: 0px; top: 0px; width: 1024px; height: 1024px;
-z-index: 2; overflow: hidden;
-}
-
-.playdiv {
-position: absolute; left: 0px; top: 0px; width: 1024px; height: 1024px;
-z-index: 1; overflow: hidden;
-}
-
-.guide {
-border: 1px; border-style: solid; border-color: #fcff00;
-}
-
-.draggable3d {
-position: absolute;
--webkit-transition: -webkit-transform 0.016s linear;
--moz-transition: -moz-transform 0.016s linear;
--ms-transition: -ms-transform 0.016s linear;
--o-transition: -o-transform 0.016s linear;
-transition: transform 0.016s linear;
--webkit-backface-visibility: hidden;
-}
-
-.draggable3dm {
-position: absolute;
--webkit-transition: -webkit-transform 0.016s linear;
--moz-transition: -moz-transform 0.016s linear;
--ms-transition: -ms-transform 0.016s linear;
--o-transition: -o-transform 0.016s linear;
-transition: transform 0.016s linear;
--webkit-backface-visibility: hidden;
-}
-
-/**
- * Palette.
- */
-.palettecontainer3dm {
-position: absolute; left: 0px; top: 0px; width: 0px; bottom: 0px; padding-top: 2px; padding-bottom: 2px;
--webkit-backface-visibility: hidden;
-}
-
-.palettecontainer3d {
-position: absolute; left: 0px; top: 0px; width: 0px; bottom: 0px; padding-top: 2px; padding-bottom: 2px;
--webkit-backface-visibility: hidden;
-}
-
-.paletteloading3d {
-position: absolute; left: 0px; top: 0px; bottom: 0px;
-z-index: 6; background-color: #ffffff;
--webkit-transform: translate(-150px, 0px);
--moz-transform: translate(-150px, 0px);
--ms-transform: translate(-150px, 0px);
--o-transform: translate(-150px, 0px);
-transform: translate(-150px, 0px);
--webkit-backface-visibility: hidden;
-}
-
-.paletteloading3dm {
-position: absolute; left: 0px; top: 0px; bottom: 0px;
-z-index: 6; background-color: #ffffff;
--webkit-transform: translate(-150px, 0px);
--moz-transform: translate(-150px, 0px);
--ms-transform: translate(-150px, 0px);
--o-transform: translate(-150px, 0px);
-transform: translate(-150px, 0px);
--webkit-backface-visibility: hidden;
-}
-
-.paletteloaded3d {
-position: absolute; left: 0px; top: 0px; bottom: 0px;
-z-index: 6; background-color: #ffffff;
--webkit-transform: translate(0px, 0px);
--moz-transform: translate(0px, 0px);
--ms-transform: translate(0px, 0px);
--o-transform: translate(0px, 0px);
-transform: translate(0px, 0px);
--webkit-backface-visibility: hidden;
-}
-
-.paletteloaded3dm {
-position: absolute; left: 0px; top: 0px; bottom: 0px;
-z-index: 6; background-color: #ffffff;
--webkit-transition: -webkit-transform 0.4s ease-in-out;
--moz-transition: -moz-transform 0.4s ease-in-out;
--ms-transition: -ms-transform 0.4s ease-in-out;
--o-transition: -o-transform 0.4s ease-in-out;
-transition: transform 0.4s ease-in-out;
--webkit-transform: translate(0px, 0px);
--moz-transform: translate(0px, 0px);
--ms-transform: translate(0px, 0px);
--o-transform: translate(0px, 0px);
-transform: translate(0px, 0px);
--webkit-backface-visibility: hidden;
-}
-
-.paletteunloading3dm {
-position: absolute; left: 0px; top: 0px; bottom: 0px;
-z-index: 6; background-color: #ffffff;
--webkit-transform: translate(0px, 0px);
--moz-transform: translate(0px, 0px);
--ms-transform: translate(0px, 0px);
--o-transform: translate(0px, 0px);
-transform: translate(0px, 0px);
--webkit-backface-visibility: hidden;
-}
-
-.paletteunloaded3dm {
-position: absolute; left: 0px; top: 0px; bottom: 0px;
-z-index: 6; background-color: #ffffff;
--webkit-transition: -webkit-transform 0.4s ease-in-out;
--moz-transition: -moz-transform 0.4s ease-in-out;
--ms-transition: -ms-transform 0.4s ease-in-out;
--o-transition: -o-transform 0.4s ease-in-out;
-transition: transform 0.4s ease-in-out;
--webkit-transform: translate(-150px, 0px);
--moz-transform: translate(-150px, 0px);
--ms-transform: translate(-150px, 0px);
--o-transform: translate(-150px, 0px);
-transform: translate(-150px, 0px);
--webkit-backface-visibility: hidden;
-}
-
-.paletteunloaded {
-position: absolute; left: 0px; top: 0px; bottom: 0px;
-z-index: 6; background-color: #ffffff;
--webkit-transform: translate(-150px, 0px);
--moz-transform: translate(-150px, 0px);
--ms-transform: translate(-150px, 0px);
--o-transform: translate(-150px, 0px);
-transform: translate(-150px, 0px);
--webkit-backface-visibility: hidden;
-}
-
-.palettecontent {
-position: absolute; left: 0px; top: 0px; bottom: 0px; width: 150px;
-padding-right: 4px; padding-top: 4px; padding-bottom: 6px; z-index: 6;
-border-top: 0px; border-bottom: 0px; border-left: 0px; border-right: 1px;
-background-color: #ffffff; border-style: solid; border-color: #e5e5e5;
-overflow-y: scroll; overflow-x: hidden; -webkit-overflow-scrolling: touch;
-}
-
-.palettetable {
-border-top: 1px; border-bottom: 1px; border-left: 1px; border-right: 1px; border-style: solid; border-color: #dcdcdc;
-background-color: #ffffff; width: 100%;
-}
-
-.palettetd {
-border-top: 1px; border-bottom: 1px; border-left: 1px; border-right: 1px; border-style: solid; border-color: #dcdcdc; vertical-align: middle;
-height: 25px; padding-bottom: 6px; padding-top: 4px;
-}
-
-/**
- * Graph.
- */
-.g {
-position: absolute; display: block;
--webkit-backface-visibility: hidden;
-}
-
-.path {
-position: absolute; background: transparent; display: block;
--webkit-backface-visibility: hidden;
-}
-
-.gtitle {
-position: absolute;
-margin: 4px; padding: 0px; line-height: 15px; vertical-align: middle; white-space: nowrap;
-font-family: "Lucida Grande", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 14px; cursor: default;
-background: transparent; display: block;
--webkit-text-size-adjust: none;
--webkit-touch-callout: none;
--webkit-tap-highlight-color: rgba(0,0,0,0);
--webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
-}
-
-.graphentry {
-font-family: "Lucida Grande", Helvetica, Arial; font-style: normal; font-variant: normal; font-size: 14px;
--webkit-appearance: none; appearance: none;
-border: 1px solid #d9d9d9!important; border-top: 1px solid silver!important;
-box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;
-border-radius: 1px; -webkit-border-radius: 1px; -moz-border-radius: 1px;
-margin: 0px; padding: 0px;
+color: #d14836!important; font-size: 18px;
+padding-top: 0px; padding-bottom: 0px; padding-left: 6px; padding-right: 6px; margin-left: 0px; margin-right: 0px; text-align: center; vertical-align: top;
+display: inline-block; line-height: 28px; min-height: 28px; min-width: 30px;
 }
 
-- 
cgit v1.2.3