/*Test area above,now come real
*/
/*Loader part hold until fully loaded*/
/*.content {display:none;}
.preload { width:100px;
    height: 100px;
    position: fixed;
    top: 50%;
    left: 50%;}*/


/*Start Button markings on TechnicsBG*/

/*.container {
    top:0;
    position:absolute;
}*/

/*.container img {
    
}*/


/*End Button markings on TechnicsBG*/

/* Start Technicsbuttons Animations*/
area {

}

.TechnicsLimited {
    top:0;
    position:absolute;
    width: 100%;
    height: auto;
}

.TechnicsLimitedLast{
    top:0;
    position:relative;
    width: 100%;
    height: auto;
}

.startbutton{

}

.stopbutton{
    
}

.StopStartButton {
    cursor: pointer; 
}

.OnOffButton {
   cursor: pointer; 
}

.SlowRpmButton {
    cursor: pointer; 

}

.FastRpmButton {
    cursor: pointer; 
}

.ResetButton {
    cursor: pointer; 

}

.PitchArea {

}

.DoublePitchButton {

}

/* End Technicsbuttons*/
.TechnicsLimitedTA {
}




/*Technics Player Functions*/
.playerreset{
    animation-direction: alternate;
}

.playerpause {
    animation-play-state: paused;
}

.tastop {
    -webkit-animation:tastop 3s ease-in-out;
    -moz-animation:tastop 3s ease-in-out;
    animation:tastop 3s ease-in-out;
    animation-direction: reverse;
    transform-origin: 85% 26.25%;
    animation-fill-mode: forwards;
} 

.tastart {
    -webkit-animation:tastart 3s ease-in-out;
    -moz-animation:tastart 3s ease-in-out;
    animation:tastart 3s ease-in-out;
    transform-origin: 85% 26.25%;
    animation-fill-mode: forwards;

} 

.taplayslow {
	-webkit-animation:taplay 5s linear;
    -moz-animation:taplay 5s linear;
    animation:taplay 5s linear;
    transform-origin: 83.85% 26.25%;
	animation-fill-mode: forwards;
}

.tarest {
    -webkit-animation:tarest 1s linear;
    -moz-animation:tarest 1s linear;
    animation:tarest 1s linear;
    transform-origin: 40% 33.28125%;
    animation-fill-mode: forwards;
} 

.taplayfast {
	-webkit-animation:taplay 900s linear;
    -moz-animation:taplay 900s linear;
    animation:taplay 900s linear;
    transform-origin: 85% 26.25%;
	animation-fill-mode: forwards;
} 

.smrotatefast {
    -webkit-animation:slipmatspin 10s linear infinite;
    -moz-animation:slipmatspin 10s linear infinite;
    animation:slipmatspin 10s linear infinite;
    transform-origin: 40% 50.46875%;
}

.smrotate {
    -webkit-animation:slipmatspin 8s linear infinite;
    -moz-animation:slipmatspin 8s linear infinite;
    animation:slipmatspin 8s linear infinite;
    transform-origin: 40% 50.46875%;
}

.smplaypause {
    -webkit-animation:slipmatspin 6s linear ease-out;
    -moz-animation:slipmatspin 6s linear ease-out;
    animation:slipmatspin 6s linear ease-out;
    transform-origin: 40% 50.46875%;
}

.smstartstop{
    -webkit-animation:slipmatspin 1s linear ease-out;
    -moz-animation:slipmatspin 1s linear ease-out;
    animation:slipmatspin 1s linear ease-out;
    transform-origin: 40% 50.46875%;
}

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

@-moz-keyframes tarest { 100% { -moz-transform: rotateZ(-2deg); } }
@-webkit-keyframes tarest { 100% { -webkit-transform: rotateZ(-2deg); } }
@keyframes tarest { 100% { -webkit-transform: rotateZ(-2deg); transform:rotateZ(-2deg); } }

@-moz-keyframes tastart { 100% { -moz-transform: rotate(19deg); } }
@-webkit-keyframes tastart { 100% { -webkit-transform: rotate(19deg); } }
@keyframes tastart { 100% { -webkit-transform: rotate(19deg); transform:rotate(19deg); } }

@-moz-keyframes tastop { 100% { -moz-transform: rotate(-19deg); } }
@-webkit-keyframes tastop { 100% { -webkit-transform: rotate(-19deg); } }
@keyframes tastop { 100% { -webkit-transform: rotate(-19deg); transform:rotate(19deg); } }

@-moz-keyframes taplay { 100% { -moz-transform: rotate(50deg); } }
@-webkit-keyframes taplay { 100% { -webkit-transform: rotate(50deg); } }
@keyframes taplay { 100% { -webkit-transform: rotate(50deg); transform:rotate(50deg); } }