#Mechanism {
	width: 1000px;					position: relative;
	margin: auto;
}

#frame {
	background: url(http://www.steveferrisworld.com/images/frame.png);
	width: 592px;					height: 814px;
	position: absolute;			top: 171px;
	left: 214px;					
}

#ring {
	background: url(http://www.steveferrisworld.com/images/ring.png);
	width: 773px;					height: 773px;
	left: 125px;					top: 68px;
	position: absolute;			
	-webkit-transition-property: -webkit-transform;
	-webkit-transition-timing-function: linear;
	-webkit-transition-duration: 1s;
}

#arctic {
	background: url(http://www.steveferrisworld.com/images/arctic.png);
	width: 609px;					height: 719px;
	left: 198px;					top: 88px;
	position: absolute;
	-webkit-transition-property: -webkit-transform;
	-webkit-transition-timing-function: linear;
	-webkit-transition-duration: 1s;
	-webkit-transform-origin: 313px 367px;
	-moz-transform-origin: 313px 367px;
	-webkit-background-size: 100%;
	-moz-background-size: 100%;
}

#crosshead {
	background: url(http://www.steveferrisworld.com/images/crosshead.png);
	width: 213px;					position: absolute;
	height: 109px;					top: 550px;
	left: 383px;
}

#cog {
	background: url(http://www.steveferrisworld.com/images/cog.png);
	width: 218px;					height: 218px;
	left: 253px;						top: 496px;
	position: absolute;
	-webkit-transition-property: -webkit-transform;
	-webkit-transition-timing-function: linear;
	-webkit-transition-duration: 1s;
}

#crank {
	background: url(http://www.steveferrisworld.com/images/crank.png);
	width: 94px;					height: 94px;
	position: absolute;			top: 558px;
	left: 315px;
	-webkit-transition-property: -webkit-transform;
	-webkit-transition-timing-function: linear;
	-webkit-transition-duration: 1s;
}

#eccentriccrank {
	background: url(http://www.steveferrisworld.com/images/eccentric.crank.png);
	width: 26px;					height: 56px;
	position: absolute;			top: 592px;
	left: 353px;
	-webkit-transition-property: -webkit-transform;
	-webkit-transition-timing-function: linear;
	-webkit-transition-duration: 1s;
	-webkit-transform-origin: 9px 13px;
	-moz-transform-origin: 9px 13px;
}

#eccentricpin {
	background: #11c;
	width: 4px;					height: 4px;
	position: absolute; 			top: 10px;
	left: 18px;
	-webkit-transition-property: -webkit-transform;
	-webkit-transition-timing-function: linear;
	-webkit-transition-duration: 1s;
}

#eccentricrod {
	background: #111;
	width: 100px;					height: 4px;
	position: absolute; 			top: 0px;
	left: 2px;
	-webkit-transition-property: -webkit-transform;
	-webkit-transition-timing-function: linear;
	-webkit-transition-duration: 1s;
	-webkit-transform-origin: 0px 2px;
	-moz-transform-origin: 0px 2px;
}

#guidelink {
	background: url(http://www.steveferrisworld.com/images/guide.link.png);
	width: 19px;					height: 135px;
	position: absolute; 			top: -118px;
	left: 89px;
	-webkit-transition-property: -webkit-transform;
	-webkit-transition-timing-function: linear;
	-webkit-transition-duration: 1s;
	-webkit-transform-origin: 10px 119px;
	-moz-transform-origin: 10px 119px;
}

#guiderod {
	background: url(http://www.steveferrisworld.com/images/guide.rod.png);
	width: 62px;					height: 31px;
	position: absolute; 			top: -14px;
	left: 87px;
	-webkit-transition-property: -webkit-transform;
	-webkit-transition-timing-function: linear;
	-webkit-transition-duration: 1s;
	-webkit-transform-origin: 13px 15px;
	-moz-transform-origin: 13px 15px;
}

#valve {
	background: url(http://www.steveferrisworld.com/images/valve.png);
	width: 62px;					height: 31px;
	position: absolute; 			top: 0px;
	left: 22px;
	-webkit-transition-property: -webkit-transform;
	-webkit-transition-timing-function: linear;
	-webkit-transition-duration: 1s;
	-webkit-transform-origin: 13px 15px;
	-moz-transform-origin: 13px 15px;
}

#pistonrod {
	background: url(http://www.steveferrisworld.com/images/piston.rod.png);
	width: 106px;
	height: 54px;					position: absolute;
	top: -10px;						left: 104px;
	-webkit-transition-property: -webkit-transform;
	-webkit-transition-timing-function: linear;
	-webkit-transition-duration: 1s;
	-webkit-transform-origin: 18px 27px;
	-moz-transform-origin: 18px 27px;
}

#crankpin {
	width: 2px;						height: 2px;
	position: absolute;			background: red;
	top: 74px;						left: 46px;
	-webkit-transition-property: -webkit-transform;
	-webkit-transition-timing-function: linear;
	-webkit-transition-duration: 1s;
}

#rod {				
	width: 137px;					height: 36px;	
	top: -17px;						left: -13px;				
	position: absolute;
	-webkit-transition-property: -webkit-transform;
	-webkit-transition-timing-function: linear;
	-webkit-transition-duration: 1s;
	-webkit-transform-origin: 15px 18px;
	-moz-transform-origin: 15px 18px;
}

#rodimage {
	background: url(http://www.steveferrisworld.com/images/rod.png);				
	width: 137px;					height: 36px;	
	top: 0px;						left: 0px;				
	position: absolute;
}

#cylinder { 
	background: url(http://www.steveferrisworld.com/images/cylinder.png);
	width: 213px;					position: absolute;
	height: 109px;					top: 541px;
	left: 450px;				
}

.capsule {
	background-position: 40px 90px;
	-webkit-background-size: 4px 5px;
	width: 185px;					background-repeat: no-repeat;
	position: absolute;			height: 185px;
	-webkit-transition-property: -webkit-transform, background-position, background-size;
	-webkit-transition-timing-function: linear, ease-out;
	-webkit-transition-duration: 1s, 1s;
}

.capCar {
	width: inherit;				height: inherit;
}

.capArm {
	background: url(http://www.steveferrisworld.com/images/capsule.arm.png);
	position: absolute;			width: 187px;
	height: 187px;
}

.capLabel {
	position: relative;			top: -50px;
}

.capClickZone {
	width: 120px;					height: 165px;
	position: absolute;			top: -50px;
	left: 33px;
}
.capClickZone:hover { cursor: pointer; }

.steamExhaust {
	position: absolute;			top: 380px;
	left: 282px;					width: 100px;
	height: 100px;					background: url(http://www.steveferrisworld.com/images/steampuff.png);
	-webkit-transform: scale(0.05,0.2);
	-webkit-animation-name: steamExhaust;
	-webkit-animation-duration: 0.56s;
	-webkit-animation-iteration-count: 1;
	/*-webkit-transition-property: -webkit-transform, opacity;
	-webkit-transition-timing-function: linear;
	-webkit-transition-duration: 1s;*/
}
.se0 { -webkit-animation-delay: .02s; }
.se1 { -webkit-animation-delay: .09s; }
.se2 { -webkit-animation-delay: .13s; }
.se3 { -webkit-animation-delay: .16s; }
.se4 { -webkit-animation-delay: .18s; }
.se5 { -webkit-animation-delay: .19s; }
.se6 { -webkit-animation-delay: .20s; }
.se7 { -webkit-animation-delay: .21s; }
.se8 { -webkit-animation-delay: .23s; }
.se9 { -webkit-animation-delay: .27s; }
.se10 { -webkit-animation-delay: .32s; }
.se11 { -webkit-animation-delay: .37s; }
.se12 { -webkit-animation-delay: .42s; }
.se13 { -webkit-animation-delay: .47s; }

@-webkit-keyframes forward {
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(360deg); }
}

@-webkit-keyframes pistonrod {
	from { -webkit-transform: rotate(15deg); }
	to { -webkit-transform: rotate(-15deg); }
}

@-webkit-keyframes rod {
	from { -webkit-transform: rotate(-15deg); }
	to { -webkit-transform: rotate(15deg); }
}

@-webkit-keyframes reverse {
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(-360deg); }
}

@-webkit-keyframes goc {
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(-360deg); }
}

@-webkit-keyframes eccentricrod {
	from { -webkit-transform: rotate(-20deg); }
	to { -webkit-transform: rotate(-7deg); }
}

@-webkit-keyframes guidelink {
	from { -webkit-transform: rotate(24.3deg); }
	to { -webkit-transform: rotate(4.5deg); }
}

@-webkit-keyframes guiderod {
	from { -webkit-transform: rotate(30deg); }
	to { -webkit-transform: rotate(16deg); }
}

@-webkit-keyframes valve {
	from { -webkit-transform: rotate(-12deg); }
	to { -webkit-transform: rotate(-8deg); }
}

@-webkit-keyframes steamExhaust {
	0% { -webkit-transform: scale(0.05,0.2); }
	35% { -webkit-transform: scale(0.05,0.2); opacity: 0.85; }
	75% { -webkit-transform: scale(1,1) translateY(200px); opacity: 0.25; }
	to { -webkit-transform: scale(4,1) translateY(250px); opacity: 0; }
	
}