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

@font-face{font-family: 'Digital-7';
	src: url('../font/digital-7.ttf');
	src: local('☺'),url('../font/digital-7.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;}
*{	 -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box; 
}

/*---------DEFAULT STYLE---------*/

/*-------DEVICE WIDTH MIN 980px and HIGHT MIN  601px------------*/	 
	 @media (min-width:980px) and (min-height: 601px){
	 .container
	 {
	 	bottom: 0px;
	 	padding-top: .5%;
	 	padding-bottom: .5%;

box-shadow: 0px 0px 10px #000 inset;
	   width:70.6%;
	   height: 100%;
	    background:#fff;
	     border:10px;
	     border-style: solid;
	     border-color: rgba(0,0,0, .3);
	     border-radius: 25px;

	 }

	 .btmKits{
	position:fixed;
	bottom:0px; 
	width:100%; 
	/* height:100%; */
	height: auto;
	
	margin:0px auto;
	margin-left:-10px;
	}
	 .enter {
	 	margin-top:20px; 
	 	color:red; 
	 	font-weight:bolder; 
	 	font-size:13px; 
	 	box-shadow: 0px 0px 5px red inset; 
	 	line-height: 23px;
	 	height:40px;
		cursor: pointer;
		width:75%;
		margin:1em auto;
		font-weight:bold;
		padding:6%;
		border-radius:10px;
		border:.5px;
		border-style: solid;

		 background: none repeat scroll 0% 0% #CCC;
		 text-align: center;
	 }
	.content{ width:100%;margin-bottom:1%; margin-left:3%;  }
	.ui-draggable { width:6%; height: 30px; background: url(../bets/images/yellow-bottom.png); background-size:100% 100%; background-repeat:no-repeat;  float:left; margin-left:1%; }
	.ui-draggable-red { width:6%; height: 30px;background: url(../bets/images/yellow-top.png);  background-size:100% 100%; background-repeat:no-repeat;  float:left; margin-left:1%; }
	.hclass { width:6%; height: 30px; background: url(../bets/images/green-top.png);  background-size:100% 100%;  background-repeat:no-repeat;  left:11px; }
	.hclass-red { width:6%; height: 30px; background: url(../bets/images/red-bottom.png);  background-size:100% 100%; background-repeat:no-repeat;  left:11px; }
	.clear{ clear:both; }
	#btn
	{
		background:blue;
		color:white;
		cursor:pointer;
		padding:12px;
		text-align:center;
		position: relative;
		font:normal 12px trebuchet ms;
		float:right;
	}
   .digital
	{
		float:left;background:blue;color:white; width:40%;margin:auto;margin-left:1em; padding-top:1em;
	}
	#m1,#m4,#m7,#del
{
margin-left:29%;
}
	
	.btn-container{
	   background-image:url(../bets/images/disp.png);
	    background-size:100% 100%;
	     background-repeat:no-repeat;
	        width:77%; height:50px; padding:2%; margin-bottom: 0%;
	}
	.calc{ display:none; }
	.col-3{ 
		box-shadow: 0px 0px 3px #000 inset;
			width: 10%;
			padding: 1%;
			float: left;
			background-color: #D3D3D3;
			margin: 1.32% ;
			cursor: pointer;
			border-radius: 7px;
			border: 1px solid #A9A9A9;
			font-size:13px;
			font-weight:bold;
	}
	.icons{ 
			width:19%;
			float:left;
			margin:2px;
			cursor:pointer;
			border-radius: 1px;
			margin-top: 10%;
	}
	.col-3:hover, .btns:hover, .enter:hover {
			background-color:#A9A9A9;
	}
	.manual-container
	{
		width:96%;
		margin-left:7px;
		 text-align:center;
		  border:1px solid;
		  padding-bottom:2.5%;
		   padding-top:2%;padding-left: 2%;
		   box-shadow: inset 0 0 10px #000;
		   border-radius:1em;
	}
	.hr-line{ width:90%; margin:auto; border-top:1px solid #ccc;}
	.res_disp
	{

		border-style: inset;
		border-radius: 10px;
		border:2px solid grey;
		box-shadow: inset 0 0 5px rgba(0,0,10,.6);
	 margin:auto;
	  background:#1176ec;
	   padding-top:0.3em;
	    padding-bottom:0.3em; 
	    color:#FFFFFF;
	width:40%;
	 font-size:2.1em; 
	 padding-right:2%;
	  text-align:right;
	   
	   font-family: 'Digital-7';
float:left;
	}
	.abaBack
	{
		background:#f5eede; border:1px solid #8d8980; 
		padding:2%; width:94%; 
		-moz-box-shadow:    inset 0 0 10px #000000;
   		-webkit-box-shadow: inset 0 0 10px #000000;
  		box-shadow:         inset 0 0 10px #000000;
   	}
	.box
	{
		display:inline-block;
		width:18px;
		height:18px;
		background:#888a85;
	}
	.rightContent
	{
		float:right;  background:#f5eede; padding:1%; width:15%;margin-top: -3%;
		position:absolute; left:70%; background:transparent;
	}
	.hide_contant {
		color : #1176ec;
	}
	.slot
	{
		display:inline-block;
		width:2.5em;
		padding:0.1em 0.5em 0.1em 0.5em;
		background:#ccc;
		border-radius:0.2em;
		margin:0.1em auto;
		margin-right:0.5em;
		cursor:pointer;
		text-align: center;
		box-shadow: 0px 0px 2px #000 inset;

	}
	.display_control {
		display:inline-block;
		width:80px;
		background:#ccc;
		border-radius:0.2em;
		margin-top: 15px;
		margin-left: 205px;
		cursor:pointer;
		text-align: center;
		box-shadow: 0px 0px 2px #000 inset;

	}
	.display_control::selection {
    color: blue;
    background: blue;
}
	.btns{
		box-shadow: 0px 0px 5px #000 inset;
		cursor: pointer;
		 width:75%;
		  margin:1em auto;
		  font-weight:bold;
		   padding:6%;
		    border-radius:10px;
		 border:.5px;
		 border-style: solid;

		 background: none repeat scroll 0% 0% #CCC;
		 text-align: center;
	 }
	 .tabac{
	 width:29%; font-size:2em; margin-left: 12px; vertical-align:bottom; color:#999999;
	 text-align: center;
	 }
	 .tabac1{
	 width:55%;
	 }
	 .slo1{
	 background-color:rgba(0,0,0, .6);
	 width:10px;height:10px;float:left;margin-left:27.3%;
	 }
	 .slo2{
	 background-color:green;width:10px;height:10px;float:left;margin-left:19.5%;
	 }
	 .slo3{
	 background-color:rgba(0,0,0, .6);
	 width:10px;height:10px;float:left;margin-left:19.8%;
	 }
	 
	 }


	 /*-------DEVICE WIDTH MIN 980px and HIGHT MAX  600px------------*/	 



	@media (min-device-width: 800px) and (max-device-width: 1280px) {

	 .container
	 {
	 	padding-top: .5%;
	 	padding-bottom: .5%;
box-shadow: 0px 0px 10px #000 inset;
	   width:90.6%;
	   height: 30%;
	    background:#fff;
	     border:10px;
	     border-style: solid;
	     border-color: rgba(0,0,0, .3);
	     border-radius: 25px;

	 }
	 .enter {
	 	margin-top:20px; 
	 	color:red; 
	 	font-weight:bolder; 
	 	font-size:13px; 
	 	box-shadow: 0px 0px 5px red inset; 
	 	line-height: 23px;
	 	height:40px;

		cursor: pointer;
		width:75%;
		margin:1em auto;
		font-weight:bold;
		padding:6%;
		border-radius:10px;
		border:.5px;
		border-style: solid;

		 background: none repeat scroll 0% 0% #CCC;
		 text-align: center;
	 }
	.content{ width:100%;margin-bottom:1%; margin-left:3%;  }
	.ui-draggable { width:6%; height: 30px; background: url(../bets/images/yellow-bottom.png); background-size:100% 100%; background-repeat:no-repeat;  float:left; margin-left:1%; }
	.ui-draggable-red { width:6%; height: 30px;background: url(../bets/images/yellow-top.png);  background-size:100% 100%; background-repeat:no-repeat;  float:left; margin-left:1%; }
	.hclass { width:6%; height: 30px; background: url(../bets/images/green-top.png);  background-size:100% 100%;  background-repeat:no-repeat;  left:11px; }
	.hclass-red { width:6%; height: 30px; background: url(../bets/images/red-bottom.png);  background-size:100% 100%; background-repeat:no-repeat;  left:11px; }
	.clear{ clear:both; }
	#btn
	{
		background:blue;
		color:white;
		cursor:pointer;
		padding:12px;
		text-align:center;
		position: relative;
		/*margin-top: -6%;*/
		font:normal 12px trebuchet ms;
		float:right;
	}
   .digital
	{
		float:left;background:blue;color:white; width:40%;margin:auto;margin-left:1em; padding-top:1em;
	}
	#m1,#m4,#m7,#del
{
margin-left:29%;
}
	.btmKits{
	position:fixed; 
	bottom:0px; 
	width:100%; 
	
	margin: 0px auto;
	height: auto;
	/*height:100%; 
	margin-left:-10px; */
	}
	.btn-container{
	   background-image:url(../bets/images/disp.png);
	    background-size:100% 100%;
	     background-repeat:no-repeat;
	        width:77%; height:50px; padding:2%; margin-bottom: 0%;
	}
	.calc{ display:none; }
	.col-3{ 
		box-shadow: 0px 0px 3px #000 inset;
			width: 10%;
			padding: 1%;
			float: left;
			background-color: #D3D3D3;
			margin: 1.32% ;
			cursor: pointer;
			border-radius: 7px;
			border: 1px solid #A9A9A9;
			font-size:13px;
			font-weight:bold;
	}
	.icons{ 
			width:19%;
			float:left;
			margin:2px;
			cursor:pointer;
			border-radius: 1px;
			margin-top: 10%;
	}
	.col-3:hover, .btns:hover, .enter:hover {
			background-color:#A9A9A9;
	}
	.manual-container
	{
		width:96%;
		margin-left:7px;
		 text-align:center;
		  border:1px solid;
		  padding-bottom:2.5%;
		   padding-top:2%;padding-left: 2%;
		   box-shadow: inset 0 0 10px #000;
		   border-radius:1em;
	}
	.hr-line{ width:90%; margin:auto; border-top:1px solid #ccc;}
	.res_disp
	{

		border-style: inset;
		border-radius: 10px;
		border:2px solid grey;
		box-shadow: inset 0 0 5px rgba(0,0,10,.6);
	 margin:auto;
	  background:#1176ec;
	   padding-top:0.3em;
	    padding-bottom:0.3em; 
	    color:#FFFFFF;
	width:40%;
	height: auto;
	 font-size:2.1em; 
	 padding-right:2%;
	  text-align:right;
	   
	   font-family: 'Digital-7';
float:left;
	}
	.abaBack
	{
		background:#f5eede; border:1px solid #8d8980; 
		padding:2%; width:94%; 
		-moz-box-shadow:    inset 0 0 10px #000000;
   		-webkit-box-shadow: inset 0 0 10px #000000;
  		box-shadow:         inset 0 0 10px #000000;
   	}
	.box
	{
		display:inline-block;
		width:18px;
		height:18px;
		background:#888a85;
	}
	.rightContent
	{
		float:right;  background:#f5eede; padding:1%; width:15%;margin-top: -3%;
		position:absolute; left:70%; background:transparent;
	}
	.hide_contant {
		color : #1176ec;
	}
	.slot
	{
		display:inline-block;
		width:2.5em;
		padding:0.1em 0.5em 0.1em 0.5em;
		background:#ccc;
		border-radius:0.2em;
		margin:0.1em auto;
		margin-right:0.5em;
		cursor:pointer;
		text-align: center;
		box-shadow: 0px 0px 2px #000 inset;

	}
	.display_control {
		display:inline-block;
		width:80px;
		background:#ccc;
		border-radius:0.2em;
		margin-top: 15px;
		margin-left: 205px;
		cursor:pointer;
		text-align: center;
		box-shadow: 0px 0px 2px #000 inset;

	}
	.display_control::selection {
    color: blue;
    background: blue;
}
	.btns{
		box-shadow: 0px 0px 5px #000 inset;
		cursor: pointer;
		 width:75%;
		  margin:1em auto;
		  font-weight:bold;
		   padding:6%;
		    border-radius:10px;
		 border:.5px;
		 border-style: solid;

		 background: none repeat scroll 0% 0% #CCC;
		 text-align: center;
	 }
	 .tabac{
	 width:29%; font-size:2em; margin-left: 12px; vertical-align:bottom; color:#999999;
	 text-align: center;
	 }
	 .tabac1{
	 width:55%;
	 }
	 .slo1{
	 background-color:rgba(0,0,0, .6);
	 width:10px;height:10px;float:left;margin-left:27.3%;
	 }
	 .slo2{
	 background-color:green;width:10px;height:10px;float:left;margin-left:19.5%;
	 }
	 .slo3{
	 background-color:rgba(0,0,0, .6);
	 width:10px;height:10px;float:left;margin-left:19.8%;
	 }
	 
	 }


	 @media (max-device-width: 800px) and (orientation: portrait) { 

	 /*@media (min-width:980px) and (max-height: 600px){*/
	 .container
	 {
	 	padding-top: .5%;
	 	padding-bottom: .5%;
box-shadow: 0px 0px 10px #000 inset;
	   width:96.6%;
	    background:#fff;
	     border:10px;
	     border-style: solid;
	     border-color: rgba(0,0,0, .3);
	     border-radius: 25px;

	 }
	 .enter {
	 	margin-top:20px; 
	 	color:red; 
	 	font-weight:bolder; 
	 	font-size:13px; 
	 	box-shadow: 0px 0px 5px red inset; 
	 	line-height: 23px;
	 	height:40px;

		cursor: pointer;
		width:75%;
		margin:1em auto;
		font-weight:bold;
		padding:6%;
		border-radius:10px;
		border:.5px;
		border-style: solid;

		 background: none repeat scroll 0% 0% #CCC;
		 text-align: center;
	 }
	.content{ width:100%;margin-bottom:1%; margin-left:3%;  }
	.ui-draggable { width:6%; height: 30px; background: url(../bets/images/yellow-bottom.png); background-size:100% 100%; background-repeat:no-repeat;  float:left; margin-left:1%; }
	.ui-draggable-red { width:6%; height: 30px;background: url(../bets/images/yellow-top.png);  background-size:100% 100%; background-repeat:no-repeat;  float:left; margin-left:1%; }
	.hclass { width:6%; height: 30px; background: url(../bets/images/green-top.png);  background-size:100% 100%;  background-repeat:no-repeat;  left:11px; }
	.hclass-red { width:6%; height: 30px; background: url(../bets/images/red-bottom.png);  background-size:100% 100%; background-repeat:no-repeat;  left:11px; }
	.clear{ clear:both; }
	#btn
	{
		background:blue;
		color:white;
		cursor:pointer;
		padding:12px;
		text-align:center;
		position: relative;
		/*margin-top: -6%;*/
		font:normal 12px trebuchet ms;
		float:right;
	}
   .digital
	{
		float:left;background:blue;color:white; width:40%;margin:auto;margin-left:1em; padding-top:1em;
	}
	#m1,#m4,#m7,#del
{
margin-left:29%;
}
	.btmKits{
	position:fixed; 
	bottom:0px; 
	width:100%; 
	z-index:98878688767;
	margin: 0px auto;
	height:auto;
	/*height:100%;
	margin-left:-10px; */
	}
	.btn-container{
	   background-image:url(../bets/images/disp.png);
	    background-size:100% 100%;
	     background-repeat:no-repeat;
	        width:77%; height:50px; padding:2%; margin-bottom: 0%;
	}
	.calc{ display:none; }
	.col-3{ 
		box-shadow: 0px 0px 3px #000 inset;
			width: 10%;
			padding: 1%;
			float: left;
			background-color: #D3D3D3;
			margin: 1.32% ;
			cursor: pointer;
			border-radius: 7px;
			border: 1px solid #A9A9A9;
			font-size:13px;
			font-weight:bold;
	}
	.icons{ 
			width:19%;
			float:left;
			margin:2px;
			cursor:pointer;
			border-radius: 1px;
			margin-top: 10%;
	}
	.col-3:hover, .btns:hover, .enter:hover {
			background-color:#A9A9A9;
	}
	.manual-container
	{
		width:96%;
		margin-left:7px;
		 text-align:center;
		  border:1px solid;
		  padding-bottom:2.5%;
		   padding-top:2%;padding-left: 2%;
		   box-shadow: inset 0 0 10px #000;
		   border-radius:1em;
	}
	.hr-line{ width:90%; margin:auto; border-top:1px solid #ccc;}
	.res_disp
	{

		border-style: inset;
		border-radius: 10px;
		border:2px solid grey;
		box-shadow: inset 0 0 5px rgba(0,0,10,.6);
	 margin:auto;
	  background:#1176ec;
	   padding-top:0.3em;
	    padding-bottom:0.3em; 
	    color:#FFFFFF;
	width:40%;
	height: auto;
	 font-size:2.1em; 
	 padding-right:2%;
	  text-align:right;
	   
	   font-family: 'Digital-7';
float:left;
	}
	.abaBack
	{
		background:#f5eede; border:1px solid #8d8980; 
		padding:2%; width:94%; 
		-moz-box-shadow:    inset 0 0 10px #000000;
   		-webkit-box-shadow: inset 0 0 10px #000000;
  		box-shadow:         inset 0 0 10px #000000;
   	}
	.box
	{
		display:inline-block;
		width:18px;
		height:18px;
		background:#888a85;
	}
	.rightContent
	{
		float:right;  background:#f5eede; padding:1%; width:15%;margin-top: -3%;
		position:absolute; left:70%; background:transparent;
	}
	.hide_contant {
		color : #1176ec;
	}
	.slot
	{
		display:inline-block;
		width:2.5em;
		padding:0.1em 0.5em 0.1em 0.5em;
		background:#ccc;
		border-radius:0.2em;
		margin:0.1em auto;
		margin-right:0.5em;
		cursor:pointer;
		text-align: center;
		box-shadow: 0px 0px 2px #000 inset;

	}
	.display_control {
		display:inline-block;
		width:80px;
		background:#ccc;
		border-radius:0.2em;
		margin-top: 15px;
		margin-left: 205px;
		cursor:pointer;
		text-align: center;
		box-shadow: 0px 0px 2px #000 inset;

	}
	.display_control::selection {
    color: blue;
    background: blue;
}
	.btns{
		box-shadow: 0px 0px 5px #000 inset;
		cursor: pointer;
		 width:75%;
		  margin:1em auto;
		  font-weight:bold;
		   padding:6%;
		    border-radius:10px;
		 border:.5px;
		 border-style: solid;

		 background: none repeat scroll 0% 0% #CCC;
		 text-align: center;
	 }
	 .tabac{
	 width:29%; font-size:2em; margin-left: 12px; vertical-align:bottom; color:#999999;
	 text-align: center;
	 }
	 .tabac1{
	 width:55%;
	 }
	 .slo1{
	 background-color:rgba(0,0,0, .6);
	 width:10px;height:10px;float:left;margin-left:27.3%;
	 }
	 .slo2{
	 background-color:green;width:10px;height:10px;float:left;margin-left:19.5%;
	 }
	 .slo3{
	 background-color:rgba(0,0,0, .6);
	 width:10px;height:10px;float:left;margin-left:19.8%;
	 }
	 
	 }





	@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 1) {
	 .container
	 {
	 	padding-top: .5%;
	 	padding-bottom: .5%;
		box-shadow: 0px 0px 10px #000 inset;
	  	width:96%;
	    background:#fff;
	    border:10px;
	    border-style: solid;
	    border-color: rgba(0,0,0, .3);
	    border-radius: 25px;
	    text-align: center;
	    margin-left: auto;
    	margin-right: auto;
    	
	 }
	 .btmKits{
	position:fixed;
	bottom:0px; 
	width:100%; 
	height: auto;
	/*height:100%; */
	z-index:98878688767;
	margin: 0px auto;
	}


	 
	 .enter {
	 	margin-top:20px; 
	 	color:red; 
	 	font-weight:bolder; 
	 	font-size:13px; 
	 	box-shadow: 0px 0px 5px red inset; 
	 	line-height: 23px;
	 	height:40px;

		cursor: pointer;
		width:75%;
		margin:1em auto;
		font-weight:bold;
		padding:6%;
		border-radius:10px;
		border:.5px;
		border-style: solid;

		 background: none repeat scroll 0% 0% #CCC;
		 text-align: center;
	 }
	.content{ width:100%;margin-bottom:1%; margin-left:3%;  }
	.ui-draggable { width:6%; height: 30px; background: url(../bets/images/yellow-bottom.png); background-size:100% 100%; background-repeat:no-repeat;  float:left; margin-left:1%; }
	.ui-draggable-red { width:6%; height: 30px;background: url(../bets/images/yellow-top.png);  background-size:100% 100%; background-repeat:no-repeat;  float:left; margin-left:1%; }
	.hclass { width:6%; height: 30px; background: url(../bets/images/green-top.png);  background-size:100% 100%;  background-repeat:no-repeat;  left:11px; }
	.hclass-red { width:6%; height: 30px; background: url(../bets/images/red-bottom.png);  background-size:100% 100%; background-repeat:no-repeat;  left:11px; }
	.clear{ clear:both; }
	#btn
	{
		background:blue;
		color:white;
		cursor:pointer;
		padding:12px;
		text-align:center;
		position: relative;
		/*margin-top: -6%;*/
		font:normal 12px trebuchet ms;
		float:right;
	}
   .digital
	{
		float:left;background:blue;color:white; width:40%;margin:auto;margin-left:1em; padding-top:1em;
	}
	#m1,#m4,#m7,#del
{
margin-left:29%;
}
	
	.btn-container{
	   background-image:url(../bets/images/disp.png);
	    background-size:100% 100%;
	     background-repeat:no-repeat;
	        width:77%; height:50px; padding:2%; margin-bottom: 0%;
	}
	.calc{ display:none; }
	.col-3{ 
		box-shadow: 0px 0px 3px #000 inset;
			width: 10%;
			padding: 1%;
			float: left;
			background-color: #D3D3D3;
			margin: 1.32% ;
			cursor: pointer;
			border-radius: 7px;
			border: 1px solid #A9A9A9;
			font-size:13px;
			font-weight:bold;
	}
	.icons{ 
			width:19%;
			float:left;
			margin:2px;
			cursor:pointer;
			border-radius: 1px;
			margin-top: 10%;
	}
	.col-3:hover, .btns:hover, .enter:hover {
			background-color:#A9A9A9;
	}
	.manual-container
	{
		width:96%;
		margin-left:7px;
		 text-align:center;
		  border:1px solid;
		  padding-bottom:2.5%;
		   padding-top:2%;padding-left: 2%;
		   box-shadow: inset 0 0 10px #000;
		   border-radius:1em;
	}
	.hr-line{ width:90%; margin:auto; border-top:1px solid #ccc;}
	.res_disp
	{

		border-style: inset;
		border-radius: 10px;
		border:2px solid grey;
		box-shadow: inset 0 0 5px rgba(0,0,10,.6);
	 margin:auto;
	  background:#1176ec;
	   padding-top:0.3em;
	    padding-bottom:0.3em; 
	    color:#FFFFFF;
	width:40%;
	height: auto;
	 font-size:2.1em; 
	 padding-right:2%;
	  text-align:right;
	   
	   font-family: 'Digital-7';
float:left;
	}
	.abaBack
	{
		background:#f5eede; border:1px solid #8d8980; 
		padding:2%; width:94%; 
		-moz-box-shadow:    inset 0 0 10px #000000;
   		-webkit-box-shadow: inset 0 0 10px #000000;
  		box-shadow:         inset 0 0 10px #000000;
   	}
	.box
	{
		display:inline-block;
		width:18px;
		height:18px;
		background:#888a85;
	}
	.rightContent
	{
		float:right;  background:#f5eede; padding:1%; width:15%;margin-top: -3%;
		position:absolute; left:70%; background:transparent;
	}
	.hide_contant {
		color : #1176ec;
	}
	.slot
	{
		display:inline-block;
		width:2.5em;
		padding:0.1em 0.5em 0.1em 0.5em;
		background:#ccc;
		border-radius:0.2em;
		margin:0.1em auto;
		margin-right:0.5em;
		cursor:pointer;
		text-align: center;
		box-shadow: 0px 0px 2px #000 inset;

	}
	.display_control {
		display:inline-block;
		width:80px;
		background:#ccc;
		border-radius:0.2em;
		margin-top: 15px;
		margin-left: 205px;
		cursor:pointer;
		text-align: center;
		box-shadow: 0px 0px 2px #000 inset;

	}
	.display_control::selection {
    color: blue;
    background: blue;
}
	.btns{
		box-shadow: 0px 0px 5px #000 inset;
		cursor: pointer;
		 width:75%;
		  margin:1em auto;
		  font-weight:bold;
		   padding:6%;
		    border-radius:10px;
		 border:.5px;
		 border-style: solid;

		 background: none repeat scroll 0% 0% #CCC;
		 text-align: center;
	 }
	 .tabac{
	 width:29%; font-size:2em; margin-left: 12px; vertical-align:bottom; color:#999999;
	 text-align: center;
	 }
	 .tabac1{
	 width:55%;
	 }
	 .slo1{
	 background-color:rgba(0,0,0, .6);
	 width:10px;height:10px;float:left;margin-left:27.3%;
	 }
	 .slo2{
	 background-color:green;width:10px;height:10px;float:left;margin-left:19.5%;
	 }
	 .slo3{
	 background-color:rgba(0,0,0, .6);
	 width:10px;height:10px;float:left;margin-left:19.8%;
	 }
}


	 .topScroll{ height:50%; overflow:scroll; }


/* tool kit*/

[data-tooltip] {
  position: relative;
  display: inline-block;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
[data-tooltip]:before, [data-tooltip]:after {
  position: absolute;
  visibility: hidden;
  opacity: 0;
  z-index: 999999;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
[data-tooltip]:before {
  content: '';
  border: 6px solid transparent;
}
[data-tooltip]:after {
  height: 22px;
  padding: 11px 11px 0 11px;
  font-size: 13px;
  line-height: 11px;
  content: attr(data-tooltip);
  white-space: nowrap;
}
[data-tooltip].simptip-position-top:before {
  border-top-color: #323232;
}
[data-tooltip].simptip-position-top:after {
  background-color: #323232;
  color: #ecf0f1;
}
[data-tooltip].simptip-position-bottom:before {
  border-bottom-color: #323232;
}
[data-tooltip].simptip-position-bottom:after {
  background-color: #323232;
  color: #ecf0f1;
}
[data-tooltip].simptip-position-left:before {
  border-left-color: #323232;
}
[data-tooltip].simptip-position-left:after {
  background-color: #323232;
  color: #ecf0f1;
}
[data-tooltip].simptip-position-right:before {
  border-right-color: #323232;
}
[data-tooltip].simptip-position-right:after {
  background-color: #323232;
  color: #ecf0f1;
}
[data-tooltip].simptip-position-top.half-arrow:before {
  border-right: 7px solid #323232;
}
[data-tooltip].simptip-position-bottom.half-arrow:before {
  border-right: 7px solid #323232;
}
[data-tooltip]:hover, [data-tooltip]:focus {
  background-color: transparent;
}
[data-tooltip]:hover:before, [data-tooltip]:hover:after, [data-tooltip]:focus:before, [data-tooltip]:focus:after {
  opacity: 1;
  visibility: visible;
}

/******************************* Position ****************************/
.simptip-position-right:before, .simptip-position-left:before, .simptip-position-right:after, .simptip-position-left:after {
  bottom: 50%;
}
.simptip-position-right:before, .simptip-position-left:before {
  margin-bottom: -5px;
}
.simptip-position-right:after, .simptip-position-left:after {
  margin-bottom: -14.66667px;
}
.half-arrow.simptip-position-right:before, .half-arrow.simptip-position-left:before {
  bottom: 16px;
  border-style: none;
  border-top: 7px solid transparent;
}
.simptip-multiline.simptip-position-right:before, .simptip-multiline.simptip-position-left:before, .simptip-multiline.simptip-position-right:after, .simptip-multiline.simptip-position-left:after {
  -webkit-transform: translateY(50%);
  -moz-transform: translateY(50%);
  -ms-transform: translateY(50%);
  -o-transform: translateY(50%);
  transform: translateY(50%);
  -webkit-filter: blur(0px);
  filter: blur(0px);
  margin-bottom: 0;
}
.simptip-multiline.simptip-position-right:before, .simptip-multiline.simptip-position-left:before {
  margin-bottom: 0;
}
.simptip-multiline.half-arrow.simptip-position-right:before, .simptip-multiline.half-arrow.simptip-position-left:before {
  margin-bottom: -2px;
}

.simptip-position-right:before, .simptip-position-right:after {
  left: 100%;
}
.simptip-position-right:before {
  margin-left: -2px;
}
.simptip-position-right:after {
  margin-left: 10px;
}
.simptip-position-right.simptip-movable:before {
  margin-left: -10px;
}
.simptip-position-right.simptip-movable:after {
  margin-left: 2px;
}
.simptip-position-right.simptip-movable:hover:before, .simptip-position-right.simptip-movable:hover:after {
  -webkit-transform: translateX(10px);
  -moz-transform: translateX(10px);
  -ms-transform: translateX(10px);
  -o-transform: translateX(10px);
  transform: translateX(10px);
}
.simptip-position-right.simptip-movable.half-arrow:before {
  margin-left: -5px;
}
.simptip-position-right.simptip-movable.simptip-multiline:hover:before, .simptip-position-right.simptip-movable.simptip-multiline:hover:after {
  -webkit-transform: translate(10px, 50%);
  -moz-transform: translate(10px, 50%);
  -ms-transform: translate(10px, 50%);
  -o-transform: translate(10px, 50%);
  transform: translate(10px, 50%);
}
.simptip-position-right.half-arrow:before {
  margin-left: 3px;
  border-right: 7px solid #323232;
}

.simptip-position-left:before, .simptip-position-left:after {
  right: 100%;
}
.simptip-position-left:before {
  margin-right: -2px;
}
.simptip-position-left:after {
  margin-right: 10px;
}
.simptip-position-left.simptip-movable:before {
  margin-right: -10px;
}
.simptip-position-left.simptip-movable:after {
  margin-right: 2px;
}
.simptip-position-left.simptip-movable:hover:before, .simptip-position-left.simptip-movable:hover:after {
  -webkit-transform: translateX(-10px);
  -moz-transform: translateX(-10px);
  -ms-transform: translateX(-10px);
  -o-transform: translateX(-10px);
  transform: translateX(-10px);
}
.simptip-position-left.simptip-movable.half-arrow:before {
  margin-right: -5px;
}
.simptip-position-left.simptip-movable.simptip-multiline:hover:before, .simptip-position-left.simptip-movable.simptip-multiline:hover:after {
  -webkit-transform: translate(-10px, 50%);
  -moz-transform: translate(-10px, 50%);
  -ms-transform: translate(-10px, 50%);
  -o-transform: translate(-10px, 50%);
  transform: translate(-10px, 50%);
}
.simptip-position-left.half-arrow:before {
  margin-right: 3px;
  border-left: 7px solid #323232;
}

.simptip-position-bottom:before, .simptip-position-top:before, .simptip-position-bottom:after, .simptip-position-top:after {
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
}
.simptip-position-bottom:after, .simptip-position-top:after {
  width: auto;
}
.half-arrow.simptip-position-bottom:before, .half-arrow.simptip-position-top:before {
  border-style: none;
  border-right: 7px solid #323232;
}

.simptip-position-bottom:before, .simptip-position-bottom:after {
  top: 100%;
}
.simptip-position-bottom:before {
  margin-top: -5px;
}
.simptip-position-bottom:after {
  margin-top: 7px;
}
.simptip-position-bottom:hover:before, .simptip-position-bottom:hover:after {
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
}
.simptip-position-bottom.simptip-movable:before {
  margin-top: -15px;
}
.simptip-position-bottom.simptip-movable:after {
  margin-top: -3px;
}
.simptip-position-bottom.simptip-movable:hover:before, .simptip-position-bottom.simptip-movable:hover:after {
  -webkit-transform: translate(-50%, 10px);
  -moz-transform: translate(-50%, 10px);
  -ms-transform: translate(-50%, 10px);
  -o-transform: translate(-50%, 10px);
  transform: translate(-50%, 10px);
}
.simptip-position-bottom.simptip-movable.half-arrow:before {
  margin-top: -10px;
}
.simptip-position-bottom.half-arrow:before {
  margin-top: 0;
  border-top: 7px solid transparent;
}

.simptip-position-top:before, .simptip-position-top:after {
  bottom: 100%;
}
.simptip-position-top:before {
  margin-bottom: -5px;
}
.simptip-position-top:after {
  margin-bottom: 7px;
}
.simptip-position-top:hover:before, .simptip-position-top:hover:after {
  -webkit-transform: translate(-50%, 0px);
  -moz-transform: translate(-50%, 0px);
  -ms-transform: translate(-50%, 0px);
  -o-transform: translate(-50%, 0px);
  transform: translate(-50%, 0px);
}
.simptip-position-top.simptip-movable:before {
  margin-bottom: -15px;
}
.simptip-position-top.simptip-movable:after {
  margin-bottom: -3px;
}
.simptip-position-top.simptip-movable:hover:before, .simptip-position-top.simptip-movable:hover:after {
  -webkit-transform: translate(-50%, -10px);
  -moz-transform: translate(-50%, -10px);
  -ms-transform: translate(-50%, -10px);
  -o-transform: translate(-50%, -10px);
  transform: translate(-50%, -10px);
}
.simptip-position-top.simptip-movable.half-arrow:before {
  margin-bottom: -10px;
}
.simptip-position-top.half-arrow:before {
  margin-bottom: 0;
  border-bottom: 7px solid transparent;
}

/******************************* Features ****************************/
.simptip-movable:before, .simptip-movable:after {
  -webkit-transition: all 0.1s linear;
  -moz-transition: all 0.1s linear;
  -o-transition: all 0.1s linear;
  -ms-transition: all 0.1s linear;
  transition: all 0.1s linear;
}

.simptip-smooth:after {
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

.simptip-fade:before, .simptip-fade:after {
  -webkit-transition: opacity 0.2s linear, visibility 0.2s linear;
  -moz-transition: opacity 0.2s linear, visibility 0.2s linear;
  -o-transition: opacity 0.2s linear, visibility 0.2s linear;
  -ms-transition: opacity 0.2s linear, visibility 0.2s linear;
  transition: opacity 0.2s linear, visibility 0.2s linear;
}

.simptip-multiline:after {
  height: auto;
  width: 150px;
  padding: 11px;
  line-height: 19px;
  white-space: normal;
  text-align: left;
}

/**************************** Diverse Colors *************************/
.simptip-success.simptip-position-top:before {
  border-top-color: #62c462;
}
.simptip-success.simptip-position-top:after {
  background-color: #62c462;
  color: #ecf0f1;
}
.simptip-success.simptip-position-bottom:before {
  border-bottom-color: #62c462;
}
.simptip-success.simptip-position-bottom:after {
  background-color: #62c462;
  color: #ecf0f1;
}
.simptip-success.simptip-position-left:before {
  border-left-color: #62c462;
}
.simptip-success.simptip-position-left:after {
  background-color: #62c462;
  color: #ecf0f1;
}
.simptip-success.simptip-position-right:before {
  border-right-color: #62c462;
}
.simptip-success.simptip-position-right:after {
  background-color: #62c462;
  color: #ecf0f1;
}
.simptip-success.simptip-position-top.half-arrow:before {
  border-right: 7px solid #62c462;
}
.simptip-success.simptip-position-bottom.half-arrow:before {
  border-right: 7px solid #62c462;
}

.simptip-info.simptip-position-top:before {
  border-top-color: #5bc0de;
}
.simptip-info.simptip-position-top:after {
  background-color: #5bc0de;
  color: #ecf0f1;
}
.simptip-info.simptip-position-bottom:before {
  border-bottom-color: #5bc0de;
}
.simptip-info.simptip-position-bottom:after {
  background-color: #5bc0de;
  color: #ecf0f1;
}
.simptip-info.simptip-position-left:before {
  border-left-color: #5bc0de;
}
.simptip-info.simptip-position-left:after {
  background-color: #5bc0de;
  color: #ecf0f1;
}
.simptip-info.simptip-position-right:before {
  border-right-color: #5bc0de;
}
.simptip-info.simptip-position-right:after {
  background-color: #5bc0de;
  color: #ecf0f1;
}
.simptip-info.simptip-position-top.half-arrow:before {
  border-right: 7px solid #5bc0de;
}
.simptip-info.simptip-position-bottom.half-arrow:before {
  border-right: 7px solid #5bc0de;
}

.simptip-danger.simptip-position-top:before {
  border-top-color: #e74c3c;
}
.simptip-danger.simptip-position-top:after {
  background-color: #e74c3c;
  color: #ecf0f1;
}
.simptip-danger.simptip-position-bottom:before {
  border-bottom-color: #e74c3c;
}
.simptip-danger.simptip-position-bottom:after {
  background-color: #e74c3c;
  color: #ecf0f1;
}
.simptip-danger.simptip-position-left:before {
  border-left-color: #e74c3c;
}
.simptip-danger.simptip-position-left:after {
  background-color: #e74c3c;
  color: #ecf0f1;
}
.simptip-danger.simptip-position-right:before {
  border-right-color: #e74c3c;
}
.simptip-danger.simptip-position-right:after {
  background-color: #e74c3c;
  color: #ecf0f1;
}
.simptip-danger.simptip-position-top.half-arrow:before {
  border-right: 7px solid #e74c3c;
}
.simptip-danger.simptip-position-bottom.half-arrow:before {
  border-right: 7px solid #e74c3c;
}

.simptip-warning.simptip-position-top:before {
  border-top-color: #e67e22;
}
.simptip-warning.simptip-position-top:after {
  background-color: #e67e22;
  color: #ecf0f1;
}
.simptip-warning.simptip-position-bottom:before {
  border-bottom-color: #e67e22;
}
.simptip-warning.simptip-position-bottom:after {
  background-color: #e67e22;
  color: #ecf0f1;
}
.simptip-warning.simptip-position-left:before {
  border-left-color: #e67e22;
}
.simptip-warning.simptip-position-left:after {
  background-color: #e67e22;
  color: #ecf0f1;
}
.simptip-warning.simptip-position-right:before {
  border-right-color: #e67e22;
}
.simptip-warning.simptip-position-right:after {
  background-color: #e67e22;
  color: #ecf0f1;
}
.simptip-warning.simptip-position-top.half-arrow:before {
  border-right: 7px solid #e67e22;
}
.simptip-warning.simptip-position-bottom.half-arrow:before {
  border-right: 7px solid #e67e22;
}