body {
 padding:0px;
 margin:0px;
 font-family:arial;
 font-size:11px;
 background:teal;
 overflow:hidden;
}

img {
 outline:none;
 border:0;
 image-rendering: -moz-crisp-edges;
 image-rendering: pixelated;
}

.titlebar > .titlebar-buttons {
  float:right;
  padding-right: 2px;
  padding-top: 2px;
}
.titlebar-buttons .spacer {
  width: 2px;
  height: 1px;
  float: left;
}
.titlebar-buttons .button-outer {
  height: 14px;
  float: left;
}
.titlebar-buttons button {
  height: 14px;
  width: 16px;
  line-height: 7px;
  min-width: unset;
  padding-left: 2px;
}

.button-outer {
 position:relative;
}
button {
 border:solid 2px;
 height:22px;
 font-family:arial;
 font-size:11px;
 min-width: 45px;
 background:#c3c3c3;
 border-color: #DEDEDE #7B7B7B #7B7B7B #DEDEDE;
}
button:after {
 border: 1px solid;
 border-color: #FFFFFF #000000 #000000 #FFFFFF;
 display: block;
 position: absolute;
 content: no-close-quote;
 height: calc(100% - 2px);
 width: calc(100% - 2px);
 top: 0;
 left: 0;
}
button:active {
 background:#c3c3c3;
 border-color: #7B7B7B #DEDEDE #DEDEDE #7B7B7B;
}
button:active:after {
 border-color: #000000 #FFFFFF #FFFFFF #000000;
}

.window.hidden {
 display: none;
}

.window {
 position: fixed;
 top: 40px;
 left: 80px;
 left: calc(50% - 120px);
 width:240px;
 height:250px;
 background:#c3c3c3;
 border:solid 2px;
 border-color:#ffffff #818181 #818181 #ffffff;
 padding:2px
}
.titlebar {
 color:white;
 background:Navy;
 background:linear-gradient(to right, navy, #1084D0);
 height:18px;
 width:100%;
 padding:0px;
}
.titlebar > .titlebar-icon {margin-top:1px;}
.titlebar > div {margin-left:2px;float:left;}
.titlebar > .titlebar-icon > *, .titlebar > .titlebar-title > * {
 display: table-cell;
 vertical-align: middle;
 /*margin-left:100px;*/
 height:18px;
}
.toolbar-drag {
 margin-left:2px;
 margin-top:1px;
 margin-right:5px;
 height:18px;
 width:1px;
 background:#c3c3c3;
 border:solid 1px;
 border-color:#ffffff #818181 #818181 #ffffff;
 float:left;
}
.toolbar a {      
 text-decoration:none;
 color: inherit;
 outline:none;
}
.toolbar {
 height:22px;
 background:#c3c3c3;
 border:solid 1px;
 border-color:#ffffff #818181 #818181 #ffffff;
}
.toolbar-outline {
 margin: 0px;
 margin-top:1px;
 margin-bottom:3px;
 background:#c3c3c3;
 color:black;
 border:solid 1px;
 border-color:#818181 #ffffff #ffffff #818181;
}
.toolbar-item {
 display:block;
 margin-top:3px;
 height:16px;
 background:none;
 float:left;
}
.toolbar-item:hover {
 border:solid 1px;
 border-color:#ffffff #818181 #818181 #ffffff;
 margin:2px -1px;
}
.toolbar-item:active {
 border:solid 1px;
 border-color:#818181 #ffffff #ffffff #818181;
 margin:2px -1px;
}
.toolbar-item > p {
 margin:4px 8px;
 margin:1px 8px;
}
.toolbar-item > * > img {
 margin-top:2px;
 display:block;
 margin-left:auto;
 margin-right:auto;
}
.toolbar-item > .tool-col {display:none;}
.toolbar-item:not(:hover) > .tool-col {display:none;}
.toolbar-item:not(:hover) > .tool-gry {display:block;}
.toolbar-item:hover > .tool-gry {display:none;}
.toolbar-item:hover > .tool-col {display:block;}

.img-bar-large {height:40px;}
.img-bar-large > .toolbar-drag {height:36px;}
.img-bar-large > * > .toolbar-item {height:34px;}

.outset {
 border:solid 2px;
 border-color:#ffffff #818181 #818181 #ffffff;
}
.inset-outer {
 border:solid 1px;
 border-color:#818181 #ffffff #ffffff #818181;
}
.inset-inner {
 margin-top:0px;
 border:solid 1px;
 border-color:#000000 #C0C0C0 #C0C0C0 #000000;
 overflow:scroll;
}

/* hr is just .inset-outer, style-wise */
hr {
 border:solid 1px;
 border-color:#818181 #ffffff #ffffff #818181;
}

.taskbar {
 position:absolute;
 width:100%;
 height:31px;
 left:0;
 top:auto;
 bottom:0px;
 border-left: 0px;
 border-right:0px;
 border-bottom:0px;
 padding-left:0px;
 padding-right:0;
}

.taskbar > img {float:left;margin-left:2px;}