html
{
	-moz-user-select     : none;
	-khtml-user-select   : none;
	-webkit-user-select  : none;
	-o-user-select       : none;
	user-select          : none;
}
input[type=text]:focus {
    margin: 5px 0;
    display: inline-block;
    border: 1px solid black;
    border-radius: 2px;
    text-align:center;
    background-color:light-grey;
}
input{
	text-align:center;
	font-family:verdana;
	font-size:14px;
}
#table
{
	padding:0px;
	border: 1px solid black;
	 border-collapse: collapse;
    width: 60%;
}
th,td
{
	height:30px;
}

#simscreen
{
	position: relative;
	left:0px;
	top:0px;
	height: 600px; 
	width:800px;
	border:solid 1px;
}

.tmr
{
	position: absolute;
	left:30px;
	top: 60px;
	height: 100px; 
	width:190px;
	border:solid 1px;
}

#copyright{
	position: absolute;
	left:50px;
	top: 580px;
	font-family: verdana; 
	font-size:12px
}

#title{
	position:relative;
	left: 0px;
	top: 0px;
	height:40px;
	font-size: 24px;
	text-align:center;
	background-color: black;
	font-family: verdana;
	color: White;
	text-transform: uppercase; 
}

#title h3{
	padding-top:2px;
	margin:0px;
}

#container{
    position:relative;
    width:304px;
    height:77px;
    overflow:hidden;
}


.stepfont
{
	font-family: verdana;
	font-size: 14px;
}


.simsubscreen
{
	position:absolute;
	left: 50px;
	top: 50px;
	height:530px;
	width:745px;
}

.incanvas
{
	margin:5px 0 0 5px;
	padding:0;
}
#nextButton{
    position: absolute;
    left: 750px;
    top: 530px;
    cursor:pointer;
}
#nextButton1{
    position: absolute;
    left: 750px;
    top: 530px;
	cursor:pointer;
}

#prevButton{
    position: absolute;
    left: 0px;
    top: 532px;
	cursor:pointer;
}


.steptext
{
	display:inline;
	font-size:14px;
	font-family: verdana;
}

.steptext-6
{
	display:inline;
	font-family: verdana;
	font-size:14px;
}

.steptext-2
{
	display:inline;
	font-family: verdana;
	font-size:14px;

}

.circlebg
{
	border-radius:100%;
	font-size:25px;
	color:#fff;
	text-align:center;
	background:#000
}


/* Arrow styles */
/* #wL{
	animation-name: wLMove;
	animation-duration: 2s;
} */
/* -------------------------------------- water ---------------------------------------- */
/* Chrome, Safari, Opera */

/* Standard syntax */
@keyframes wLMove {
	from{left: 65px; top:458px;opacity: 0.5;}
	to{left: 88px; top:458px;opacity: 1}
}

@-webkit-keyframes wLMove {
	from{left: 65px; top:458px;opacity: 0.5}
	to{left: 88px; top:458px;opacity: 1}
}
@keyframes wRMove {
	from{left: 250px; top:458px;opacity: 0.5;}
	to{left: 227px; top:458px;opacity: 1}
}

@-webkit-keyframes wRMove {
	from{left: 250px; top:458px;opacity: 0.5;}
	to{left: 227px; top:458px;opacity: 1;}
}

@keyframes tLMove {
	from{left: 345px; top:138px; opacity: 0.5;}
	to{left: 345px; top:158px; opacity: 1}
}

@-webkit-keyframes tLMove {
	from{left: 345px; top:138px; opacity: 0.5;}
	to{left: 345px; top:158px; opacity: 1}
}
@keyframes tRMove {
	from{left: 345px; top:225px;opacity: 0.5;}
	to{left: 345px; top:205px;opacity: 1}
}

@-webkit-keyframes tRMove {
	from{left: 345px; top:225px;opacity: 0.5;}
	to{left: 345px; top:205px;opacity: 1;}
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-webkit-keyframes fadeIn {
	0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes specimenFallLeft {
	0%{left:542px; top: 271px;}
	50%{left:542px; top: 271px;}
	80%{left:540px; top: 270px;}
	90%{left:538px; top: 290px;transform:rotate(90deg)}
	100%{left:525px; top: 300px;transform:rotate(180deg)}
}

@-webkit-keyframes specimenFallLeft {
	0%{left:542px; top: 271px;}
	50%{left:542px; top: 271px;}
	80%{left:540px; top: 270px;}
	90%{left:538px; top: 290px;transform:rotate(90deg)}
	100%{left:525px; top: 300px;transform:rotate(180deg)}
}
@keyframes specimenFallRight{
	0%{left:588px; top: 274px;}
	50%{left:588px; top: 274px;}
	80%{left:590px; top: 275px;}
	90%{left:592px; top: 295px;transform:rotate(-90deg)}
	100%{left:600px; top: 305px;transform:rotate(-180deg)}
}

@-webkit-keyframes specimenFallRight {
	0%{left:588px; top: 274px;}
	50%{left:588px; top: 274px;}
	80%{left:590px; top: 275px;}
	90%{left:592px; top: 295px;transform:rotate(-90deg)}
	100%{left:600px; top: 305px;transform:rotate(-180deg)}
}



@keyframes specimenFallZoomLeft {
	0%{left:274px; top: 200px;}
	50%{left:270px; top: 200px;}
	80%{left:268px; top: 199px;}
	90%{left:268px; top: 209px;transform:rotate(90deg)}
	100%{left:250px; top: 235px;transform:rotate(180deg)}
}

@-webkit-keyframes specimenFallZoomLeft {
	0%{left:274px; top: 200px;}
	50%{left:270px; top: 200px;}
	80%{left:268px; top: 199px;}
	90%{left:268px; top: 209px;transform:rotate(90deg)}
	100%{left:250px; top: 235px;transform:rotate(180deg)}
}
@keyframes specimenFallZoomRight{
	0%{left:334px; top: 203px;}
	50%{left:334px; top: 203px;}
	80%{left:340px; top: 204px;}
	90%{left:342px; top: 211px;transform:rotate(-90deg)}
	100%{left:355px; top: 245px;transform:rotate(-180deg)}
}

@-webkit-keyframes specimenFallZoomRight {
	0%{left:334px; top: 203px;}
	50%{left:334px; top: 203px;}
	80%{left:340px; top: 204px;}
	90%{left:342px; top: 211px;transform:rotate(-90deg)}
	100%{left:355px; top: 245px;transform:rotate(-180deg)}
}




@-webkit-keyframes water-4 {
	0% {-webkit-transform: translate(0, 0 );}
	100% {-webkit-transform: translate(0, 40px );}
}

/* Standard syntax */
@keyframes water-4 {
    0% {transform: translate(0, 0);}
    100% {transform: translate(0, 40px);}
}

@-webkit-keyframes water-1 {
	0% {-webkit-transform: translate(0, 0 );}
	100% {-webkit-transform: translate(0, -10px );}
}

/* Standard syntax */
@keyframes water-1 {
    0% {transform: translate(0, 0);}
    100% {transform: translate(0, -10px);}
}

@-webkit-keyframes water-3 {
	0% {-webkit-transform: translate(0, 0 );}
	100% {-webkit-transform: translate(0, -20px );}
}

/* Standard syntax */
@keyframes water-3 {
    0% {transform: translate(0, 0);}
    100% {transform: translate(0, -20px);}
}

@-webkit-keyframes water-5 {
	0% {-webkit-transform: translate(0, 0 );}
	100% {-webkit-transform: translate(0, -35px );}
}

/* Standard syntax */
@keyframes water-5 {
    0% {transform: translate(0, 0);}
    100% {transform: translate(0, -35px);}
}
/* -------------------------------------- constant speed arrow ---------------------------------------- */

/* Chrome, Safari, Opera */
@-webkit-keyframes arrow-1 {
	0% {-webkit-transform: rotate(0deg);}    
	100% {-webkit-transform: rotate(-50deg);}
}

/* Standard syntax */
@keyframes arrow-1 {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(-50deg);}
}
/* -------------------------------------- constant speed arrow 2 ---------------------------------------- */
/* Chrome, Safari, Opera */
@-webkit-keyframes arrow-11 {
	0% {-webkit-transform: rotate(0deg);}    
	100% {-webkit-transform: rotate(70deg);}
}

/* Standard syntax */
@keyframes arrow-11 {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(70deg);}
}



/* -------------------------------------- ---------------------------------------- */
/* Chrome, Safari, Opera */
@-webkit-keyframes valveturn-2 {
	0% {-webkit-transform: rotate(0deg);}    
	100% {-webkit-transform: rotate(-10deg);}
}

/* Standard syntax */
@keyframes valveturn-2 {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(-10deg);}
}

@-webkit-keyframes valveturn-3 {
	0% {-webkit-transform: rotate(0deg);}    
	50% {-webkit-transform: rotate(-20deg);}
	100% {-webkit-transform: rotate(-45deg);}

}

/* Standard syntax */
@keyframes valveturn-3 {
    0% {transform: rotate(0deg);}
    50% {transform: rotate(-20deg);}
	100% {transform: rotate(-45deg);}
}

@-webkit-keyframes valveturn-5 {
	0% {-webkit-transform: rotate(0deg);}    
	100% {-webkit-transform: rotate(20deg);}
}

/* Standard syntax */
@keyframes valveturn-5 {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(20deg);}
}

/* Chrome, Safari, Opera */
@-webkit-keyframes valveturn-4 {
	0% {-webkit-transform: rotate(0deg);}    
	100% {-webkit-transform: rotate(-15deg);}
}

@keyframes valveturn-6 {
    0% {transform: rotate(0deg);}
    50% {transform: rotate(-30deg);}
	100% {transform: rotate(-60deg);}

}

/* Chrome, Safari, Opera */
@-webkit-keyframes valveturn-6 {
0% {-webkit-transform: rotate(0deg);}    
50% {-webkit-transform: rotate(-30deg);}
    100% {transform: rotate(-60deg);}
}



@keyframes valveturn-7 {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(1800deg);}
}

/* Chrome, Safari, Opera */
@-webkit-keyframes valveturn-7 {
0% {-webkit-transform: rotate(0deg);}    
100% {-webkit-transform: rotate(1800deg);}
}

/* Standard syntax */
@keyframes valveturn-4 {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(-15deg);}
}


/* Standard syntax */
@keyframes water0 {
    0% {transform: translate(0, 0);}
    100% {transform: translate(0, -100px);}
}

/* Standard syntax */
@keyframes water0 {
    0% {transform: translate(0, 0);}
    100% {transform: translate(0, -100px);}
}


/*-----------------------------------------hook gauge----------------------- */
/* Chrome, Safari, Opera */
@-webkit-keyframes myhook-1 {
0% {-webkit-transform: translate(0, 0 );}
50% {-webkit-transform: translate(0, -15px );}

100% {-webkit-transform: translate(0, 8px );}
}

/* Standard syntax */
@keyframes myhook-1 {
    0% {transform: translate(0, 0);}
	50% {transform: translate(0, -15px);}
	
	
    100% {transform: translate(0, 8px);}
}



@-webkit-keyframes mymv-1 {
0% {left: 50px; top:305px;}
    50% {left: 130px; top:305px;}
	100% {left: 50px; top:305px;}
}

/* Standard syntax */
@keyframes mymv-1 {
    
	0% {left: 50px; top:305px;}
    50% {left: 130px; top:305px;}
	100% {left: 50px; top:305px;}
}


@-webkit-keyframes mymv-2 {
from{left: 130px; top:345px;}
to {left: 50px; top:345px;}

}

/* Standard syntax */
@keyframes mymv-2{
from {left: 130px; top:345px;}
to {left: 50px; top:345px;}

}

@-webkit-keyframes mymv-3 {
from {left: 110px; top:200px;}
to {left: 150px; top:304px;}
}

/* Standard syntax */
@keyframes mymv-3{
 from {left: 110px; top:200px;}
to {left: 150px; top:304px;}
}

@-webkit-keyframes mymv-4 {
from {left: 160px; top:300px;}
to {left: 415px; top: 230px;}
}

/* Standard syntax */
@keyframes mymv-4{
from  {left: 160px; top:300px;}
to {left: 415px; top: 230px;}   
}

@-webkit-keyframes mymv-5 {
from {left: 160px; top:300px;}
to {left: 415px; top: 230px;}
}

/* Standard syntax */
@keyframes mymv-5{
from  {left: 160px; top:300px;}
to {left: 415px; top: 230px;}   
}


@-webkit-keyframes myhook-2 {
0% {-webkit-transform: translate(0, 0 );}
50% {-webkit-transform: translate(0, -50px );}

100% {-webkit-transform: translate(0, -15px );}
}

/* Standard syntax */
@keyframes myhook-2 {
    0% {transform: translate(0, 0px);}
	50% {transform: translate(0, -50px);}
	
	
    100% {transform: translate(0, -15px);}
}

@keyframes mymv-ln{
from  {left: 114px; top: 64px;}
to {left: 114px; top: 70px;}   
}


@keyframes mymv-arw{
from  {left: 130px; top: 193px;}
to {left: 130px; top: 196px;}   
}

@keyframes mymv-ndl{
from  {left: 40.5px; top: 330px;}
to {left: 40.5px; top: 336px;}   
}


@keyframes mymv-zmv{
from  {left: 415px; top: 200px;}
to {left: 415px; top: 203px;}   
}

@keyframes mymv-arw2{
from  {left: 130px; top: 196px;}
to {left: 130px; top: 250px;}   
}



@keyframes mymv-zmv2{
from  {left: 415px; top: 203px;}
to {left: 415px; top: 282px;}   
}


@keyframes mymv-zmv1{
from  {left: 415px; top: 203px;}
to {left: 415px; top: 279px;}   
}

@keyframes mymv-zmv3{
from  {left: 415px; top: 203px;}
to {left: 415px; top: 276px;}   
}

@keyframes mymv-zmv4{
from  {left: 415px; top: 203px;}
to {left: 415px; top: 275px;}   
}

@keyframes mymv-zmv5{
from  {left: 415px; top: 203px;}
to {left: 415px; top: 273px;}   
}
/* rod move */
@keyframes rod-move{
from  {left:130px; top: 420px;}
to {left:130px; top: 368px;}   
}

@keyframes cali-move{
from  {left:225px; top: 282px;}
to {left:214px; top: 282px;}   
}



@keyframes can13-move{
from  {left:300px; top:208px;}
to {left:400px; top:208px;}   
}

@keyframes vmov-move{
from  {left:450px; top:260px;}
to {left:450px; top:200px;}   
}

@keyframes can27-move{
from  {left:350px; top:115px;}
to {left:350px; top: 120.5px;}   
}


/* hand-move */
@keyframes hand-move{
from  {left:560px; top: 160px;}
to {left:410px; top: 160px;}   
}

@-webkit-keyframes hand-move{
from  {left:560px; top: 160px;}
to {left:410px; top: 160px;}   
} 

/* plunger-move */
@keyframes plunger-move{
from  {left:367px; top: 100px;}
to {left:367px; top: 135px}   
}

@-webkit-keyframes plunger-move{
from  {left:560px; top: 100px;}
to {left:367px; top: 135px}   
}


/* zimg */
@keyframes zimg-move{
from  {left:60px; top: 270px;}
to {left:380px; top: 125px;}   
}

@-webkit-keyframes zimg-move{
from  {left:60px; top: 270px;}
to {left:380px; top: 125px;}   
}


/* mld2 */
@keyframes mld2-move{
from  {left:400px; top: 125px;}
to {left:400px; top: 135px;}   
}

@-webkit-keyframes mld2-move{
from  {left:400px; top: 125px;}
to {left:400px; top: 135px;}   
}

@keyframes mZoomLeftPlate-move{
0%  { left:537px; top: 274px;} 
50% { left:530px; top: 280px;}    
100% { left:520px; top: 290px;}   
}

@-webkit-keyframes mZoomLeftPlate-move{
	0%  { left:537px; top: 274px;} 
	50% { left:530px; top: 280px;}    
	100% { left:520px; top: 290px;} 
}

/* Swing movement css */

/* @keyframes drod-rot{ */
/* 0%  { transform: rotate(0deg);} */
/* 5% { transform: rotate(80deg);}    */
/* 10% { transform: rotate(-80deg);}    */
/* 15% { transform: rotate(70deg);}    */
/* 20% { transform: rotate(-70deg);}    */
/* 25% { transform: rotate(60deg);}    */
/* 30% { transform: rotate(-60deg);}    */
/* 35% { transform: rotate(50deg);}    */
/* 40% { transform: rotate(-50deg);}    */
/* 45% { transform: rotate(40deg);}    */
/* 50% { transform: rotate(-40deg);}    */
/* 55% { transform: rotate(30deg);}    */
/* 60% { transform: rotate(-30deg);}    */
/* 65% { transform: rotate(20deg);}    */
/* 70% { transform: rotate(-20deg);}    */
/* 80% { transform: rotate(10deg);}    */
/* 90% { transform: rotate(-10deg);}    */
/* 100% { transform: rotate(0deg);}    */
/* } */
/* @-webkit-keyframes drod-rot{ */
/* 0%  { -webkit-transform: rotate(0deg);} */
/* 5% { -webkit-transform: rotate(80deg);}    */
/* 10% {-webkit-transform: rotate(-80deg);}    */
/* 15% {-webkit- transform: rotate(70deg);}    */
/* 20% { -webkit-transform: rotate(-70deg);}    */
/* 25% { -webkit-transform: rotate(60deg);}    */
/* 30% { -webkit-transform: rotate(-60deg);}    */
/* 35% { -webkit-transform: rotate(50deg);}    */
/* 40% { -webkit-transform: rotate(-50deg);}    */
/* 45% { -webkit-transform: rotate(40deg);}    */
/* 50% { -webkit-transform: rotate(-40deg);}    */
/* 55% { -webkit-transform: rotate(30deg);}    */
/* 60% { -webkit-transform: rotate(-30deg);}    */
/* 65% { -webkit-transform: rotate(20deg);}    */
/* 70% {-webkit- transform: rotate(-20deg);}    */
/* 80% { -webkit-transform: rotate(10deg);}    */
/* 90% { -webkit-transform: rotate(-10deg);}    */
/* 100% { -webkit-transform: rotate(0deg);}    */
/* } */
@-webkit-keyframes needle-move {
0% {-webkit-transform: rotate(0deg);}    
100% {-webkit-transform: rotate(120deg);}
}



@keyframes needle-move {
    0% {transform: rotate(0deg);}
    100% {transform: rotate(120deg);}
}



/*-----------------------------------------blink----------------------- */
/*------------------------------------ZOOOM--------------*/
.zoom
{
	 zoom: 150%; 
} 
