html,body {
  position: relative;
  height: 100%;
  width: 100%;
  overflow: auto;
}

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;  
  background:transparent;
  box-sizing: border-box; /* css3 rec */
  -moz-box-sizing: border-box; /* ff2 */
  -ms-box-sizing: border-box; /* ie8 */
  -webkit-box-sizing: border-box; /* safari3 */
  -khtml-box-sizing: border-box; /* konqueror */
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  -webkit-touch-callout: none;
  white-space: nowrap;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
  display:block;
}

a {
  margin:0;
  padding:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}

hr {
  display:block;
  height:1px;
  border:0;
  border-top:1px solid #cccccc;
  margin:1em 0;
  padding:0;
}

td, input, select {
  vertical-align: middle;
}

h1 {
  display:block;font-weight:normal;line-height:16px;margin:1px;
}

h1 img {
  width:16px;height;16px;vertical-align:bottom;margin-right:5px;
}

label {
  margin:0;padding:0;font-size:11px;vertical-align:top;font-family:arial;
  color:#444;white-space: nowrap;
  line-height: 14px;
}

input {
  margin:0px;padding:2px;border:1px solid #666;font-family:arial;
  height: 22px;
}

input::-ms-clear {
  display: none;
}  

select {
  margin:0px;padding:1px;border:1px solid #666;font-family:arial;
  height: 22px;
}

textarea {
  margin:0px;padding:2px;border:1px solid #666;font-family:arial;
  resize:none;
}

table {
  table-layout: fixed;
}

/* Forms *********************************************************************/

.field {
  float:left;
  display: block;
  position: relative;
  overflow: hidden;
  padding: 2px;
}

.field label {
  margin-top: -3px;
  margin-bottom: 1px;
}

.field label, .field input, .field select, .field textarea {
  display: block;
  width: 100%;
  box-sizing: border-box; /* css3 rec */
  -moz-box-sizing: border-box; /* ff2 */
  -ms-box-sizing: border-box; /* ie8 */
  -webkit-box-sizing: border-box; /* safari3 */
  -khtml-box-sizing: border-box; /* konqueror */
}

.field.checkbox {
  padding: 10px 2px 2px 8px;
}

.field.checkbox label {
  display:inline;height:auto;width:auto;padding:0;font-size:inherit;line-height:100%;vertical-align:middle;
}

.field.checkbox input {
  display:inline;height:auto;width:auto;padding:0;margin:0 4px 0 0;vertical-align:middle;border:0;
}

td input, td select {
  display:block;width:100%;height:100%;border:none;margin:none;outline:none;
  box-sizing: border-box; /* css3 rec */
  -moz-box-sizing: border-box; /* ff2 */
  -ms-box-sizing: border-box; /* ie8 */
  -webkit-box-sizing: border-box; /* safari3 */
  -khtml-box-sizing: border-box; /* konqueror */
}


/* Buttons *******************************************************************/

button {
  display: inline-block;
  position: relative;
  width: 128px;
  padding: 2px 0 2px 2px;
  margin: 4px;
  font-size: 14px;
  line-height: 24px;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
  cursor: pointer;
  color: black;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  background: #c0e8f4;
  border: 2px solid;
  border-color: #f0fcff #90b0b8 #90b0b8 #f0fcff;  
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  outline: 0;
  box-shadow: 1px 1px 8px rgba(0,0,0,.8);
}

button:active {
  left: 1px;
  top: 1px;  
}

button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

button img {
  width: 24px;
  height: 24px;
  vertical-align: middle;
  margin-right: 6px;
  margin-left: 6px;
}

/* Structural classes ********************************************************/

.box {
  position: absolute;
  overflow: visible;
}

.window {
  position: absolute;
  overflow: visible;
  color: white;
  background: #207090;
  border: 1px solid;
  border-color: #4090B0 #18546C #18546C #4080B0;
}

.frame {
  position: absolute;
  overflow: visible;
  color: white;
  background: #206480;
  border: 1px solid;
  border-color: #18546C #4090B0 #4090B0 #18546C;
}

.panel {
  position: absolute;
  overflow: visible;
  color: #007090;
  background: #80d8f0;
  border: 1px solid;
  border-color: #a0fcff #60b0d8 #60b0d8 #a0fcff;
}

.bevel {
  position: absolute;
  overflow: visible;
  color: #007090;
  background: #80d8f0;
  border: 1px solid;
  border-color: #60b0d8 #a0fcff #a0fcff #60b0d8;
}

.scrollbox {
  position: absolute;
  color: #007090;
  background: #eee;
  border: 1px solid;
  border-color: #60b0d8 #a0fcff #a0fcff #60b0d8;
  overflow: scroll; 
  overflow-x: hidden;
}



/* Positioning classes *******************************************************/

.left {float:left;}
.right {float:right;}

.aligntop {left:0;top:0;right:0;}
.alignbottom {left:0;bottom:0;right:0;}
.alignleft {left:0;top:0;bottom:0;}
.alignright {right:0;top:0;bottom:0;}

.full {left:0;right:0;top:0;bottom:0;}
.hfull {left:0;right:0;}
.vfull {top:0;bottom:0;}

.full2 {left:2px;right:2px;top:2px;bottom:2px;}
.hfull2 {left:2px;right:2px;}
.vfull2 {top:2px;bottom:2px;}

.W100 {width: 100%;}
.W90  {width: 90%; }
.W80  {width: 80%; }
.W75  {width: 75%; }
.W70  {width: 70%; }
.W66  {width: 66.67%; }
.W60  {width: 60%; }
.W50  {width: 50%; }
.W40  {width: 40%; }
.W33  {width: 33.33%; }
.W30  {width: 30%; }
.W25  {width: 25%; }
.W20  {width: 20%; }
.W10  {width: 10%; }

.H100 {height: 100%;}
.H90  {height: 90%; }
.H80  {height: 80%; }
.H75  {height: 75%; }
.H70  {height: 70%; }
.H66  {height: 66.67%; }
.H60  {height: 60%; }
.H50  {height: 50%; }
.H40  {height: 40%; }
.H33  {height: 33.33%; }
.H30  {height: 30%; }
.H25  {height: 25%; }
.H20  {height: 20%; }
.H10  {height: 10%; }

.L100 {left: 100%;}
.L90  {left: 90%; }
.L80  {left: 80%; }
.L75  {left: 75%; }
.L70  {left: 70%; }
.L66  {left: 66.67%; }
.L60  {left: 60%; }
.L50  {left: 50%; }
.L40  {left: 40%; }
.L33  {left: 33.33%; }
.L30  {left: 30%; }
.L25  {left: 25%; }
.L20  {left: 20%; }
.L10  {left: 10%; }
.L2   {left: 2px; }
.L1   {left: 1px; }
.L0   {left: 0; }

.T100 {top: 100%;}
.T90  {top: 90%; }
.T80  {top: 80%; }
.T75  {top: 75%; }
.T70  {top: 70%; }
.T66  {top: 66.67%; }
.T60  {top: 60%; }
.T50  {top: 50%; }
.T40  {top: 40%; }
.T33  {top: 33.33%; }
.T30  {top: 30%; }
.T25  {top: 25%; }
.T20  {top: 20%; }
.T10  {top: 10%; }
.T2   {top: 2px; }
.T1   {top: 1px; }
.T0   {top: 0; }

.R100 {right: 100%;}
.R90  {right: 90%; }
.R80  {right: 80%; }
.R75  {right: 75%; }
.R70  {right: 70%; }
.R66  {right: 66.67%; }
.R60  {right: 60%; }
.R50  {right: 50%; }
.R40  {right: 40%; }
.R33  {right: 33.33%; }
.R30  {right: 30%; }
.R25  {right: 25%; }
.R20  {right: 20%; }
.R10  {right: 10%; }
.R2   {right: 2px; }
.R1   {right: 1px; }
.R0   {right: 0; }

.B100 {bottom: 100%;}
.B90  {bottom: 90%; }
.B80  {bottom: 80%; }
.B75  {bottom: 75%; }
.B70  {bottom: 70%; }
.B66  {bottom: 66.67%; }
.B60  {bottom: 60%; }
.B50  {bottom: 50%; }
.B40  {bottom: 40%; }
.B33  {bottom: 33.33%; }
.B30  {bottom: 30%; }
.B25  {bottom: 25%; }
.B20  {bottom: 20%; }
.B10  {bottom: 10%; }
.B2   {bottom: 2px; }
.B1   {bottom: 1px; }
.B0   {bottom: 0; }