body{
	margin: 0;
	box-sizing: border-box;
}

div.frame{
	border-color: DarkGray;
	border-style: solid;
	border-width: 1px;
	border-radius: 4px;
	padding: 3px;
	width: 650px;
	height: 600px;
	position: relative;
	user-select: none;
	-webkit-user-select: none;
	-moz-user-select: none;
}


/* display */

#setup1{
	position: relative;
	top: 0px;
	left: 2px;
	margin-bottom:10px
		
}

#can1Div{
	position: relative;
	top: 0px;
	left: 0px;
	border: 1px solid rgba(100,100,100,0.35);
	border-radius: 5px;
	width: 641px;
	height: 391px;	
	background-color:#FFFFFF;

}

.dropdown{
	margin:2px;
}


.canvasBox{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 390px;
	height: 390px;
}

#moreDetail{
	position:absolute; 
	top:0px;
	right :0px;	
	font-size:12px;
}


#showVA{
	position: absolute;
	top: 0px;
	left: 0px;
}

#showDt{
	position: absolute;
	top: 0px;
	left: 102px;
}

.leftTop button{
	width: 100px;
}





#aResetAll{
	position: absolute;
	margin:2px;
	top: 0px;
	right: 10px;
	height:25px;	
	font-size:14px;
	padding-top:2px;
}

#playOrPause{
	position:absolute; 
	bottom:0px;
	left:0px;	
}

#resetTime{
	position:absolute; 
	bottom:0px;
	left:42px;	
}


#keepPrevious{
	position:absolute; 
	top:0px;
	right:0px;	
}

#keepPrevious>div{
	display:inline-block;
	vertical-align:middle;
	border: 1px solid rgba(255,255,255,1);
	font-size:12px;
	height:20px;
	width:20px;
}


#dataPrevious{
	position:absolute; 
	top:40px;
	right:0px;
	height:150px;
	width:330px;
	background-color: rgba(50,50,50,0.8);
	margin:2px;
	text-align:right;
}

#dataPrevious table{
	font-size:14px;
    border: none;
	color:white;
	right:0px;
	margin:5px;
	text-align:left;
}

#dataPrevious td,#dataPrevious th{
	vertical-align:top;
}

#dataPrevious tr{
	height:30px;
}

#dataPrevious .td1{
	width:40px;
}
#dataPrevious .td2{
	width:100px;
}
#dataPrevious .td3{
	width:70px;
}
#dataPrevious .td4{
	width:120px;
}

#dataPrevious button{
	right:5px;
	bottom:5px;
	margin:2px;
}


#aKeep{
	position: absolute;
	margin:2px;
	top: 0px;
	right: 100px;
	height:25px;	
	font-size:14px;
	padding-top:2px;
}




#zoomIn{
	position:absolute; 
	bottom:0px;
	right:50px;	
}

#zoomOut{
	position:absolute; 
	bottom:0px;
	right:0px;	
}

#showValuePanel{
	position: absolute;
	top: 0px;
	left: 390px;
	width: 250px;
	height: 390px;
	padding-right: 0px;
}

#showValuePanel .outer{
	position: absolute;
	top: 2px;
	width:248px; 
	height:146px;
	margin-right:0px;
	margin-bottom:0px;
	padding-bottom:0px;
	border: 1px solid rgba(150,150,150,1);
}

#showValuePanel>div:nth-child(1){
	left:1px;
}
/*
#showValuePanel>div:nth-child(2){
	left:127px;
}
*/
#showValuePanel .color{
	position: relative;
	display: inline-block;
	width:244px; 
	height:30px;
	border: 1px solid rgba(150,150,150,1);
	margin-right:0px;
	padding-left:10px;
	padding-top:5px;
	color: rgba(255,255,255,1);
	background-color: rgba(255,120,120,1);
}



#showValuePanel .result{
	position: relative;
	display: inline-block;
	width:240px; 
	height:146px;
	margin-top:0px;
	margin-right:0px;
	vertical-align: text-bottom; 
	padding-left:10px;
	padding-top:5px;
	padding-right:0px;
}

.resultLine{
	font-size:15px;
	margin-bottom:5px;
}

#graphShow1 button{
	background-color:#F2BB6E;
}

#graphShow2 button{
	background-color:#95DEBB;
}

#jxgboxT{
	position: relative;
	left:5px;
	top: 2px;
	width:630px; 
	height:30px;
	margin-bottom:0px;
	border: 1px solid rgba(0,0,0,1);
}





#bottomDiv{
	position: relative;
	top: 5px;
	left: 10px;
	border: 1px solid rgba(0,0,0,0);
	width: 640px;
	height: 230px;	
}



#resultBox{
	position: absolute;
	left:391px;
	top: 150px;
	width:250px; 
	height:240px;
	margin-bottom:0px;
	border: 1px solid rgba(0,0,0,0.3);
	padding: 5px;
}

#resultBox>div{
	display: inline-block;
	height:25px;	
	padding-top:2px;
}

#resultBox button{
	height:25px;	
	padding-top:2px;
}

#resultBox li{
	font-size:10px;
	padding-top:0px;
	padding-bottom:1px;
}



#can2{
	position: absolute;
	top: 35px;
	left: 0px;
	width: 250px;
	height: 200px;
}


#airMode button{
	height:25px;	
	font-size:14px;
	padding-top:2px;
}

#jxgbox{
	position: relative;
	left:0px;
	top: 30px;
	width:630px; 
	height:180px;
	margin-bottom:0px;
}

/*selectIsDefault*/
button {
 outline: none !important;  
}
button.tone-corporate{
  height: 38px;
  background-color: rgba(111, 44, 145, 1);
  color:white;
  font-size: 16px;
  border: none; 
  margin: 5px 2px 7px; 
/*  padding:  10px 10px 10px 10px; */

}
button.tone-corporate:hover{
  background-color: rgba(190, 160, 206,1);
  color:white;
}
button.tone-corporate:focus {
  background-color: rgba(190, 160, 206,1) !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); 
} 

button.tone-darkGray{ 
margin:2px;
height: 35px; 
background-color: rgba(150, 150, 150, 1); 
color:white; 
font-size: 14px; 
border: none; 
} 
button.tone-darkGray:hover{ 
background-color: rgba(150, 150, 150, 1); 
color:white; 
} 
button.tone-darkGray:focus {
background-color: rgba(150, 150, 150, 1) !important;
color:white;
}
button.tone-darkGray:active{ 
background-color: rgba(150, 150, 150, 1); 
color:white; 
box-shadow: none; 
} 
button.tone-darkGray.active{ 
background-color: rgba(150, 150, 150, 1); 
color:white; 
box-shadow: none; 
} 
button.tone-darkGray.disabled{ 
background-color: rgba(150, 150, 150, 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;
}