html, body {
  width:  100%;
  height: 100%;
  margin: 0px;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

#container {
/*
  border: solid;
  border-color: yellow;
*/
  width:100%;
  height:100%;
}

#hcontainer {
/*
  border: solid;
  border-color: blue;
*/
  overflow: hidden;
  white-space: nowrap;
  height:100%;
}

#toolbar {
/*
  border: solid;
  border-color: red;
*/
  display: block;
  width: 50px;
  float:left;
}

#colorbar {
/*
  border: solid;
  border-color: red;
*/
  display: block;
  width: 50px;
  float:left;
}

#colorselector {
/*
  border: solid;
  border-color: red;
*/
  width: 55px;
}

#toolbar {
/*
  border: solid;
  border-color: red;
*/
  display: block;
  width: 50px;
  float:left;
}

.hidden {
  display: none;
}

.invisible {
  visibility: hidden;
}

.subtoolbar {
  height: 50px;
}

.tool {
  width: 50px;
  height: 50px;
  padding: 0px 0px 0px 0px;
  vertical-align: middle;
  display: inline-block;
}

.currentColor {
  width: 50px;
  height: 50px;
}

.color {
  width: 25px;
  height: 25px;
  margin: 0px;
}

.colorblack { background-color: rgb(0, 0, 0); }
.colorwhite { background-color: rgb(255, 255, 255); }
.colordgrey { background-color: rgb(128, 128, 128); }
.colorlgrey { background-color: rgb(190, 190, 190); }
.colordred { background-color: rgb(128, 0, 0); }
.colorlred { background-color: rgb(255, 0, 0); }
.colordyellow { background-color: rgb(128, 128, 0); }
.colorlyellow { background-color: rgb(255, 255, 0); }
.colordgreen { background-color: rgb(0, 128, 0); }
.colorlgreen { background-color: rgb(0, 255, 0); }
.colordcyan { background-color: rgb(0, 128, 128); }
.colorlcyan { background-color: rgb(0, 255, 255); }
.colordblue { background-color: rgb(0, 0, 128); }
.colorlblue { background-color: rgb(0, 0, 255); }
.colordpurple { background-color: rgb(128, 0, 128); }
.colorlpurple { background-color: rgb(255, 0, 255); }
.colordbrown { background-color: rgb(73, 61, 38); }
.colorlbrown { background-color: rgb(136, 104, 67); }
.colordorange { background-color: rgb(225, 135, 0); }
.colorlorange { background-color: rgb(255, 195, 30); }

#paint {
  position: relative;
}

#kiddopaint {
  border: 1px solid #00f; 
  width: 1920px;
  height: 1200px;
}

#tmpCanvas {
  position: absolute;
  top: 1px;
  left: 1px;
  cursor: crosshair;
}

#previewCanvas {
  position: absolute;
  top: 1px;
  left: 1px;
}

h1 {
  font-size: 3em;
  margin: 0.5ex;
}

emj {
  font-family: 'Apple Color Emoji';
  font-size: 3em;
  height: 50px;
}
