@charset "iso-8859-1";

body {
    height: 100%;
    width: 100%;
    background: 'white';
    color: 'black';
    font-family: 'Fira Mono';
    font-size: 10pt;
    font-size: 1.7vh;
}

/* canvas */
#container {
    position: fixed;
    left: -10px;
    top: -10px;
}

/* welcome */
#hi {
	position: fixed;
	top: 10%;
	right: 25%;
	width: 22em;
	padding: 2px;
}

/* tools */
img { 
	height: 100%;
	width: auto;
}

.tool {
	position: fixed;
	height: 85%;
	cursor: pointer;
}

#brushpen {	left: 3%; }
#bpencil { left: 11%; }
#whink { left: 17%; }
#pencil { left: 26%; }
#unio {	right: 4%; }
#unig {	right: 10%; }
#staed { right: 17%; }

/* clear page */
#newpg {
	position: fixed;
	right: 0;
	bottom: -7px;
}

/* text label */
#text {
	position: fixed;
	width: 100%;
	bottom: 5%;
}

.label {
	vertical-align: middle;
	text-align: center;
	margin: auto;
}

.whiteout {	background: #ffffff;}