@charset "utf-8";
/* CSS Document */

	#dataset1 {
    
	
	
	
}

#incell {
	width:90%;
	
	}	
	#dataset {
    
	display:inline-block;
	width:49.5%;
	max-width:950px;
	vertical-align:top;
	min-height: 70vh;
	max-height:72vh;
    overflow: auto;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
}

#answer {
 
	display:inline-block;
	width:49.5%;
	max-width:950px;
	
	min-height: 70vh;
	max-height:72vh;
    overflow:auto;
  vertical-align:top;

    border-left: 3px solid #727272;
    border-left-color: #D6D6D6;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;

	
}



#r, #c {
	display:none;
	}



#target:focus {
    border-style: solid;
	border-width: 5px;
	border-color: #7BE500;
	

}
#sol:focus {
    border-style: solid;
	border-width: 5px;
	border-color: #7BE500;
	

}

#prec:focus {
    border-style: solid;
	border-width: 5px;
	border-color: #7BE500;
	

}

#dataset1 input
{
  position: relative;
    width: 85%;
	height: 100%;
   padding: 0;
border: none;

   
    
}
#dlt {
   text-align: center;
position: relative;
display: inline-block;
    width: 10%;
	height: 100%;
	 padding: 0;

   border: none;
   color: #B0A9A9;
  
   
}

#dlt:hover {
   	color: red;
	background-color: #9F9F9F;
	cursor:pointer;
	
   
}
#dataset1 input:focus {
    border-style: solid;
	border-width: 5px;
	border-color: #4795FF;
	

}

html,
body {
   margin:0;
   padding:0;
   width:100%;
   height:100%;
   overflow-x:hidden;
   overflow-y:auto;
   
  
}
#container {
   min-height:100%;
   position:relative;
}

#header {
   background:#ff0;
   padding:10px;
   white-space:nowrap;
   
}
#main {
 
   padding-bottom:60px;   /* Height of the footer */
   white-space:nowrap;
}

#controls{
	
	white-space:normal
	
	}


	
	#sel {

    display:inline;
	color:rgba(5,207,2,1.00); 
	height:50%;
	width:7vw;
	vertical-align: middle;
		
	}


#prec, #sol {
		display:inline-block;
		vertical-align: middle;
		width: 3vw;
		height:50%;
    	border: 3px solid #727272;
}

#target {
		display:inline-block;
		vertical-align: middle;
		width: 3vw;
		min-width: 3vw;
		max-width: 28vw;
		height:50%;
    	border: 3px solid #727272;
}



	
	#test{
	
	 display:b;
	color: limegreen;
		 
	
	}

#footer {
   position:absolute;
   bottom:0;
   width:100%;
   height:60px;   /* Height of the footer */
   background:#6cf;
}

.loader {
   -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
 
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


	
	
table
{
     border-collapse:collapse;
	 border: 1px solid black;
	 
}

td
{
   
   border: 1px solid black;
	
}


button{

	margin:1%;
	
	}

#myTextarea:focus {
    border-style: solid;
	border-width: 5px;
	border-color: #7BE500;
	

}

#myTextarea1:focus {
    border-style: solid;
	border-width: 5px;
	border-color: #7BE500;
	

}

#tll {
	float:left; 
	height:7vh; 
	width:10%; 
	margin-top:1%; 
	margin-bottom:1%;
	 
	border-style: double; 
	background-color:gray; 
	border-width:thick; 
	border-color:silver;
	
	}


#prec:focus {
    border-style: solid;
	border-width: 5px;
	border-color: #7BE500;
	

}






textarea{
	border: 1px solid black;
	 display:inline-block;
	 font-size:9px;
	overflow:hidden;
	resize: none;
	width:10%;
	height:60%;
	background-color: #F3FFDA;
	border-radius:20%;
   border-style:dashed;
   padding:3px;
   vertical-align: middle;
   text-align:center;
   
   
}

	
#prec {
		display:inline;
	
		max-width: 5%;
	min-width:55px;
    	border: 3px solid #727272;
}
#status{
	
  text-align: center;
	visibility:hidden;
	background-color:yellowgreen;
	
	
	 
	
	}
	

	
	
.tooltip3 {
    position: relative;
    display: inline-block;
   
}

.tooltip4 {
    position: relative;
    display: inline-block;
   
}

.tooltip3 .tooltiptext3 {
    visibility: hidden;
    width: 350px;
	
    background-color: yellowgreen;
    color: black;
    text-align: left;
    border-radius: 6px;
    padding: 5px 0;
    
    /* Position the tooltip */
    position: absolute;
    z-index: 1;
  bottom: 100%;
    left: 50%;
    margin-left: -60px;
   
}

.tooltip4 .tooltiptext4 {
    visibility: hidden;
    width: 420px;
    background-color: yellowgreen;
    color: black;
    text-align: left;
    border-radius: 6px;
    padding: 5px 0;
    
   /* Position the tooltip */
     position: absolute;
    z-index: 1;
   top: 100%;
    left: 50%;
	margin-left: -60px;
   

}

.tooltip3:hover .tooltiptext3 {
    visibility: visible;
}

.tooltip4:hover .tooltiptext4 {
    visibility: visible;
}


input[type="range"] {
  -webkit-appearance: none;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  width: 15%;
  height: 20px;
  margin: 0;
  border: none;
  padding: 1px 2px;
  border-radius: 14px;
  background: #232528;
  box-shadow: inset 0 1px 0 0 #0d0e0f, inset 0 -1px 0 0 #3a3d42;
  -webkit-box-shadow: inset 0 1px 0 0 #0d0e0f, inset 0 -1px 0 0 #3a3d42;
  outline: none; /* no focus outline */
}

input[type="range"]::-moz-range-track {
  border: inherit;
  background: transparent;
}

input[type="range"]::-ms-track {
  border: inherit;
  color: transparent; /* don't drawn vertical reference line */
  background: transparent;
}

input[type="range"]::-ms-fill-lower,
input[type="range"]::-ms-fill-upper {
  background: transparent;
}

input[type="range"]::-ms-tooltip {
  display: none;
}

/* thumb */

input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 40px;
  height: 18px;
  border: none;
  border-radius: 12px;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, yellowgreen), color-stop(100%, yellowgreen)); /* android <= 2.2 */
  background-image: -webkit-linear-gradient(top , yellowgreen 0, yellowgreen 100%); /* older mobile safari and android > 2.2 */;
  background-image: linear-gradient(to bottom, yellowgreen 0, yellowgreen 100%); /* W3C */
}
input[type="range"]::-moz-range-thumb {
  width: 40px;
  height: 18px;
  border: none;
  border-radius: 12px;
  background-image: linear-gradient(to bottom, yellowgreen 0, yellowgreen 100%); /* W3C */
}

input[type="range"]::-ms-thumb {
  width: 40px;
  height: 18px;
  border-radius: 12px;
  border: 0;
  background-image: linear-gradient(to bottom, yellowgreen 0, yellowgreen 100%); /* W3C */
}