body{
	margin: 0;
	box-sizing: border-box;
}

div.frame{
	border-color: DarkGray;
	border-style: solid;
	border-width: 1px;
	border-radius: 4px;
	padding: 3px;
	width: 560px;
	height: 650px;
	position: relative;
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
}


/* display */

#setup1{
	position: absolute;
	top: 10px;
	left: 10px;
	border: 1px solid rgba(100,100,100,0.35);
	border-radius: 5px;
	width: 540px;
	height: 390px;
	
}

.canvasBox{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 540px;
	height: 390px;
}


#playOrPause{
	position:absolute; 
	bottom:0px;
	left:0px;	
}


#bottomDiv{
	position: absolute;
	top: 410px;
	left: 10px;
	border: 1px solid rgba(0,0,0,0);
	width: 540px;
	height: 230px;	
}



#jxgbox{
	position: relative;
	left:0px;
	top: 5px;
	width:270px; 
	height:180px;
	margin-bottom:0px;
}

#resultBox{
	position: absolute;
	left:280px;
	top: 5px;
	width:255px; 
	height:200px;
	margin-bottom:0px;
	border: 1px solid rgba(0,0,0,0.3);
	padding: 5px;
}

/*.resultLine{
	font-size:15px;
	margin-bottom:25px;
}*/

#resultBox table{
	font-size:14px;
    border: none;
}
#resultBox td{
	vertical-align:top;
}

#resultBox .td1 div{
	font-size:10px;
}

#resultBox .td1,#resultBox .td3{
    text-align: left;
}

#resultBox .td1{
	width:80px;
}

#resultBox .td2{
    text-align: right;
}

#resultBox tr{
    height:38px;
}


/*selectIsDefault*/
button {
 outline: none !important;  
}
button.tone-corporate{
  height: 38px;
  background-color: rgba(111, 44, 145, 0.45);
  color:white;
  font-size: 16px;
  border: none; 
  margin: 2px 2px 2px; 

}
button.tone-corporate:hover{
  background-color: rgba(111, 44, 145, 0.45);
  color:white;
}
button.tone-corporate:focus {
  background-color: rgba(111, 44, 145, 0.45) !important;
  color:white;
}
button.tone-corporate:active{
  background-color: #6f2c91;
  color:white;
  box-shadow: none;
}
button.tone-corporate.active{
  background-color: #6f2c91;
  color:white;
  box-shadow: none;
}
button.tone-corporate.active:hover{
  background-color: #6f2c91;
  color:white;
}
button.tone-corporate.active:focus {
  background-color: #6f2c91 !important;
  color:white;
}
button.tone-corporate.disabled{
  background-color: rgba(111, 44, 145, 0.6);
}



button.tone-gray{ 
height: 38px; 
background-color: #e6e6e6; 
color:black; 
font-size: 16px; 
border: none; 
margin: 5px 5px 7px; 
} 
button.tone-gray:hover{ 
background-color: #4d4d4d; 
color:white; 
} 
button.tone-gray:active{ 
background-color: #4d4d4d; 
color:white; 
box-shadow: none; 
} 
button.tone-gray.active{ 
background-color: #4d4d4d; 
color:white; 
box-shadow: none; 
} 
button.tone-gray.disabled{ 
background-color: rgba(230, 230, 230, 0.6); 
color:rgba(255, 255, 255, 0.6); 
} 



/* mouse cursors */
.cursor-default {
	cursor: default;
}
.cursor-pointer {
	cursor: pointer;
}
.cursor-grab {
	cursor: grab;
	cursor: -webkit-grab;
	cursor: -moz-grab;
}
.cursor-grabbing {
	cursor: grabbing;
	cursor: -webkit-grabbing;
	cursor: -moz-grabbing;
}
