html {
	width: 99%;
	height: 99%;
	position: fixed;
	overflow:hidden;
}
body {
	width: 100%;
	height: 100%;
	margin: 0px;
	text-align:center;
}

.testImage
{
	max-height: 120px !important;
	max-width: 12vw !important;
	height: auto;
}

.imagediv
{
	display: block;
	width: 60%;
	height: 100%;
	position: absolute;
	top: 2px;
	left: 2px;

	border-radius: 10px;
	background: linear-gradient(to bottom, #def, #cdf);
	box-shadow: inset 0px 0px 3px #fff, inset 2px 2px #bbc, inset -2px -2px #55a, 0px 0px 0px 1px #eef, 0px 0px 3px 0px #005;
}

.imagedivdrop
{
	background: linear-gradient(to bottom, #888, #ddd) ! important;
	box-shadow: inset 0px 0px 10px 3px #ff0 ! important;
}

.imagediv img
{
	max-width: 100%;
	max-height: 100%;
}

.infodiv
{
	display: block;
	position: absolute;
	right: 0px;
	top: 0px;
	height: 100%;
	width: 39%;
	overflow-y: scroll;
	overflow-x: hidden;
	text-align: left;

	border-radius: 10px;
	background: linear-gradient(to bottom, #eee, #ddd);
	box-shadow: inset 0px 0px 3px #fff, inset 2px 2px #bbc, inset -2px -2px #557, 0px 0px 0px 1px #eef, 0px 0px 3px 0px #005;

	scrollbar-color: #448 transparent;
}

.infodiv h2
{
	margin: 5px;
}
.infodiv ul
{
	padding-left: 16px;
	margin-left: 16px;
}

.infodiv li
{
	cursor: pointer;
	list-style-image: url(images/pie.png);
}

.infodiv .attr li
{
	list-style-image: url(images/tag.png);
}

.bindiv
{
	display: block;
	position: absolute;
	left: 6px;
	top: 205px;
	height: calc(100% - 215px);
	width: calc(100% - 16px);
	border: 0px solid black;
	border-radius: 5px;
	overflow-y: scroll;
	font-family: monospace;
	font-size: 12px;
	overflow-y: scroll;
	overflow-x: auto;
	text-align: left;
	box-shadow: inset 0px 0px 3px #fff, inset 2px 2px #bbc, inset -2px -2px #557, 0px 0px 0px 1px #eef, 0px 0px 3px 0px #005;
	scrollbar-color: #008 transparent;
}

.bindiv span
{
	padding: 1px;
}

.bindiv b
{
	background: #aaa;
	padding: 1px;
	margin-right: 10px;
	user-select: none;
}

.bindiv i
{
	user-select: none;
}

.bindiv .diffs
{
	color: darkred;
	background-color: pink;
}

.divParse 
{
	width:300px;
	min-height:100px;
	background:#aaa;
	border-style:ridge;
	border-width:2px;
	border-radius:5px;
	box-shadow:2px 2px 5px;
	position:absolute;
	left:0px;
	top:800px;
	transition:all 0.5s ease-out;
	opacity:0;
	padding: 3px;
}

.divParse td, .divParse th
{
	text-align: left;
}

.divParse h3
{
	margin: 5px;
}

.canvasdiv
{
	display: block;
	position: absolute;
	left: 6px;
	top: 235px;
	height: calc(100% - 245px);
	width: calc(100% - 16px);
	border: 2px solid black;
	border-radius: 5px;
	overflow-y: hidden;
	overflow-x: hidden;
	text-align: center;
	margin:0 auto;
}

.canvasdiv canvas
{
	max-height: calc(100vh - 235px);
	max-width: calc(60vw - 8px);
}

.toHome
{
	width:64px;
	height:64px;
	cursor:pointer;
	position:fixed;
	left:5px;
	top:5px;
	font-size: 12px;
	line-height:12px;
	text-decoration: none;
	border-radius:3px;
}

.toHome:hover
{
	background-color: #ffa;
}
