.jssorb051 .i {position:absolute;cursor:pointer;}
.jssorb051 .i .b {fill:#fff;fill-opacity:0.5;stroke:#000;stroke-width:400;stroke-miterlimit:10;stroke-opacity:0.5;}
.jssorb051 .i:hover .b {fill-opacity:.7;}
.jssorb051 .iav .b {fill-opacity: 1;}
.jssorb051 .i.idn {opacity:.3;}

.w1000 #s1{
	border:	5px solid red;
}

.passive1{
	margin-left: -50px;
	opacity: 0;
}
.passive2{
  -ms-transform: scale(2); /* IE 9 */
  -webkit-transform: scale(2); /* Safari 3-8 */
  transform: scale(2);
	opacity: 0;
}
.passive3{
  -ms-transform: scale(3) rotate(20deg); /* IE 9 */
  -webkit-transform: scale(3) rotate(20deg); /* Safari 3-8 */
  transform: scale(3) rotate(20deg);

	opacity: 0;

}

.stage{
	display: none;
	position: absolute;
	top: 0;
	pointer-events: none;
}
.stage *, .s1_1{


	-webkit-transition: all 1s ease-in-out;
  -moz-transition: all 1s ease-in-out;
  -o-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;


}

#stage_0 .circle.passive{
	position: absolute;
	left: -300px;
	opacity: 0;
	transition: all .6s ease-out;
}
#stage_0 .machine.passive{
	position: absolute;
	width: 350px;
	left: -150px;
	top: 20px;
	transition: all .4s ease-out;
	z-index: 10;
	opacity: 0;
}

#stage_0 .love{
	width: 500px;
	position: absolute;
	right: 50px;
	top: 30px;
}
#stage_0 .text1{
	font-family: "Roboto";
	line-height: 120%;
	font-weight: 300;
	font-size: 60px;
	color: #fff;
	text-shadow: 2px 2px 5px rgba(0,0,0,.5);
	position: absolute;
	left: 390px;
	top: 150px;
	z-index: 10;
}
#stage_0 .text2{
	font-family: "Roboto";
	font-weight: 400;
	font-size: 26px;
	color: #fff;
	text-shadow: 2px 2px 5px rgba(0,0,0,.5);
	position: absolute;
	left: 395px;
	top: 230px;
	z-index: 10;
}
#stage_0 .icons{
	width: 300px;
	height: 80px;
	position: absolute;
	left: 390px;
	top: 280px;
	z-index: 10;

}
#stage_0 .icons img{
	width: 100%;
}

#stage_0 .bgcircle{
	width: 600px;
	position: absolute;
	top: 0;
	z-index: 1

}
#stage_0 .circle{
	left: -0px;
	position: absolute;
	transition: all .6s ease-out;
	opacity: .6;
}
#stage_0 .machine{
	position: absolute;
	width: 350px;
	left: 50px;
	top: 20px;
	transition: all .6s ease-out;
	z-index: 10;
	opacity: 1;
}
.invbr{
	display: none;
}




#stage_1 .text1{
	font-family: "Roboto";
	line-height: 120%;
	font-weight: 300;
	font-size: 55px;
	color: #fff;
	text-shadow: 2px 2px 5px rgba(0,0,0,.5);
	position: absolute;
	left: calc(50% - 500px);
	top: 70px;
	z-index: 10;
}
#stage_1 .text2{
	font-family: "Roboto";
	font-weight: 400;
	font-size: 26px;
	color: #fff;
	text-shadow: 2px 2px 5px rgba(0,0,0,.5);
	position: absolute;
	left: calc(50% - 500px);
	top: 155px;
	z-index: 10;
}

#stage_1 .img1{
	width: 380px;
	height: 137px;
	position: absolute;
	left: calc(50% - 560px);
	top: 200px;
	z-index: 10;
	transition: all .6s ease-out;

}
#stage_1 .img2{
	width: 350px;
	height: 137px;
	position: absolute;
	left: calc(50% - 560px + 330px );
	top: 200px;
	z-index: 10;
	transition: all .6s ease-out;

}
#stage_1 .cta{
	width: 300px;
	height: 73px;
	position: absolute;
	left: calc(50% - 560px + 330px + 350px + 60px);
	top: 230px;
	z-index: 10;
	transition: all .4s ease-out;
}
#stage_1 .img1.passive{
	opacity: 0;
	margin-left: -100px;
	transition: all .6s ease-out;
}
#stage_1 .img2.passive{
	opacity: 0;
	margin-left: -100px;
	transition: all .4s ease-out;
}
#stage_1 .cta.passive{
	-ms-transform: scale(3) rotate(20deg); /* IE 9 */
	-webkit-transform: scale(3) rotate(20deg); /* Safari 3-8 */
	transform: scale(3) rotate(20deg);
	transition: all .3s ease-out;
	opacity: 0;
}

@media only screen and (max-width: 1160px) {
	#stage_1 .text1{
		top: 30px;
		left: 50px;
		font-size: 40px;
	}
	#stage_1 .text2 {
		top: 85px;
		left: 50px;
		font-size: 25px;
	}
	#stage_1 .img1{
		left: 0px;
		top: 45%;
	}
	#stage_1 .img2{
		left: 330px;
		top: 45%;
	}

	#stage_1 .cta {
		width: 230px;
		top: calc(45% + 40px);
	}

}

@media only screen and (max-width: 960px) {
	#stage_1 .text1{
		top: 30px;
		left: 50px;
		font-size: 30px;
	}
	#stage_1 .text1 span{
		display: block !important;
		clear: both;
	}
	#stage_1 .text2 {
		top: 115px;
		left: 50px;
		font-size: 20px;
	}
	#stage_1 .img1{
		left: 0px;
		width: 285px;
	}
	#stage_1 .img2{
		left: 270px;
		width: 285px;
	}
	#stage_1 .cta {
		width: 200px;
		top: unset;
		left: unset;
		bottom: 0px;
		right: 25px;
	}
}

@media only screen and (max-width: 560px) {
	#stage_1 .text1{
		top: 30px;
		left: 25px;
		font-size: 28px;
	}

	#stage_1 .text2 {
		top: 115px;
		left: 25px;
		font-size: 18px;
	}
	#stage_1 .img1{
		left: 0px;
		width: calc( 55%);
	}
	#stage_1 .img2{
		left: unset;
		right: 00px;
		width: calc( 55%);
	}
	#stage_1 .img2.passive{
		right: -100px;
	}
	#stage_1 .cta {
		width: 150px;
		top: unset;
		left: 50%;
		bottom: 0px;
		transform: translateX(-50%);
	}
}



/* w1500 */
@media only screen and (max-width: 1500px) {
	#stage_0 .love{
		width: 300px ;
	}
	#stage_0 .text1{
		font-size: 45px ;
		top: 100px ;
		left: 450px
	}
	#stage_0 .text2{
		font-size: 30px ;
		font-weight: 200 ;
		top: 170px ;
		left: 455px
	}
	#stage_0 .icons{
		top: 230px ;
		left: 455px
	}

}

/* w1200 */
@media only screen and (max-width: 1200px) {
	#stage_0 .love{
		width: 300px ;
	}
	#stage_0 .text1{
		font-size: 45px ;
		top: 170px ;
		left: 120px
	}
	#stage_0 .text2{
		font-size: 30px ;
		font-weight: 200 ;
		top: 225px ;
		left: 125px
	}
	#stage_0 .icons{
		top: 270px ;
		left: 125px ;
	}

}

		
/* w840 */
@media only screen and (max-width: 840px) {
	#stage_0 .love{
			width: 300px ;
		}
	#stage_0 .text1{
			font-size: 35px ;
			top: 150px ;
			left: 120px
		}
	#stage_0 .text1 .invbr{
			display: block ;
		}
	 #stage_0 .text2{
			font-size: 22px ;
			font-weight: 200 ;
			top: 245px ;
			left: 120px
		}
	#stage_0 .icons{
			top: 290px ;
			left: 120px ;
			width: 240px ;
		}
	#stage_0 .bgcircle{
			width: 400px
		}
	#stage_0 .machine{
			width: 300px
		}
		

}
/* w720 */
@media only screen and (max-width: 720px) {
	#stage_0 .love {
		width: 230px;
		right: 15px;
		z-index: 150;
		top: 45px
	}

	.s1_1 {
		/*background-size: 750px !important;*/
		background-position: -110px center;
		-webkit-transition: all 1s ease-in-out;
		-moz-transition: all 1s ease-in-out;
		-o-transition: all 1s ease-in-out;
		transition: all 1s ease-in-out;

	}

	.fullscrlogo {
		width: 100px;
	}
}
@media only screen and (max-width: 420px) {
		#stage_0 .machine{
			position: absolute;
			width: 250px ;
			left: 35px;
			top: 20px;
		}
	#stage_0 .text1{
			font-size: 30px ;
			top: 150px ;
			left: 40px
		}
		#stage_0 .text2{
			left: 40px
			
		}
		#stage_0 .icons{
			left: 40px ;
		}
		


}