/*
Theme Name: Factory 
Theme URI: http://factory.commercegurus.com/
Author: CommerceGurus
Author URI: http://www.commercegurus.com
Description: Factory is a precision designed WordPress theme for any kind of business
Version: 1.6.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: factory
Domain Path: /languages/
Tags: light, white, two-columns, three-columns, right-sidebar, custom-background, custom-header, custom-menu, featured-images, flexible-header, sticky-post, theme-options, translation-ready
*/

@media(min-width:1200px){
.machine-animation-wrapper{
	max-width:100%;
	margin:0 auto;
	
}
}

.animation-element {
  opacity: 0;
  position: relative;
}



.mf{
	color:#652d91;
	text-align:center;
	position:relative;
}

.mf  div{
	position:absolute;
	
}



.machine-left-part .frame2 {
	left:177px;
}

.machine-left-part .frame4 {
	left:177px;
}

.machine-right-part .frame5 {
	top:-5px;
	right:8px;
}


.machine-right-part .frame6 {
	left:-45px;
	top:13px;
}

.machine-right-part .frame7 {
	top:10px;
	right:18px;
}


.machine-right-part .frame8 {
	left:-45px;
	top:-10px;
	
}


.framebox1{
	top:160px;
	left:-37px;
	z-index:666;
}

.framebox3{
	top:160px;
	right:35px;
	z-index:666;
}


.framebox2{
	top:400px;
	left:-35px;
	z-index:666;
}

.framebox4{
	top:400px;
	right:30px;
	z-index:666;
}


div.dot1, div.dot2, div.dot3, div.dot4{
	background-color:#a9aaac;
	width:12px;
	height:12px;
	 border-radius: 50%;
	 animation: pulsepoint 1.5s infinite;
	
}

div.dot1{
	right:-50px;
	top:65px;
}


div.dot2 {
    right: -50px;
    top: 0px;
}

div.dot3{
	left:-50px;
	top:60px;
}

div.dot4{
	top:-8px;
	left:-55px;
}



.shape1{
	background-image:url(images/shap1.png);
	background-repeat:no-repeat;
	background-position:left center;
	width:172px;
	height:57px;
	background-size:cover;
}

.machine-center-part{
	max-width:53%;
	min-width:53%;
	display:inline-block;
	position:relative;
}


.machine-left-part, .machine-right-part{
	max-width:23%;
	min-width:23%;
	display:inline-block;
	position:relative;
	vertical-align:top;
}


.machine-center-part img{
	display:block;
	margin:0 auto;
}

.frame1, .frame3, .frame5, .frame7{	
	
	line-height:60px;
}


.frame1, .frame3{
	left:12px;
}

.frame2{
    background-image:url(images/shap2.png);
	background-repeat:no-repeat;
	background-position:left center;
	width:110px;
	height:41px;
	padding-top: 105px;	
	animation: FadeIn 1s linear;
}


.frame4{
    background-image:url(images/shap3.png);
	background-repeat:no-repeat;
	background-position:left center;
	width:110px;
	height:41px;
	margin-top: -5px;
	animation: FadeIn 1s linear;	
}


.frame6{
    background-image:url(images/shap4.png);
	background-repeat:no-repeat;
	background-position:left center;
	width:118px;
	height:44px;
	margin-top: 12px;	
	animation: FadeIn 1s linear;
}


.frame8{
    background-image:url(images/shap5.png);
	background-repeat:no-repeat;
	background-position:left center;
	width:108px;
	height:39px;
	margin-top: 12px;	
	animation: FadeIn 1s linear;
}


.move-me-1 {
  animation: FadeIn 5s linear;
  
}

.move-me-2 {
  animation: FadeIn 5s linear;

}

.move-me-3 {
  animation: FadeIn 5s linear;
  
}

.move-me-4 {
  animation: FadeIn 5s linear;
 
}

@keyframes move-in-steps-left {
  0% {
    left: -12%;   
  }
  100% {
    left: 5%;  
  }
}

@keyframes move-in-steps-right {
  0% {
    right: -12%;   
  }
  100% {
    right: 5%;  
  }
}


@keyframes pulsepoint {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(239,63,62, 0.4);
    box-shadow: 0 0 0 0 rgba(239,63,62, 1);
  }
  70% {
      -moz-box-shadow: 0 0 0 10px rgba(239,63,62, 0);
      box-shadow: 0 0 0 10px rgba(239,63,62, 0);
  }
  100% {
      -moz-box-shadow: 0 0 0 0 rgba(239,63,62, 0);
      box-shadow: 0 0 0 0 rgba(239,63,62, 0);
  }
}




.animation-element.slide-left {
  opacity: 0;
  -moz-transition: all 500ms linear;
  -webkit-transition: all 500ms linear;
  -o-transition: all 500ms linear;
  transition: all 500ms linear;
  -moz-transform: translate3d(-100px, 0px, 0px);
  -webkit-transform: translate3d(-100px, 0px, 0px);
  -o-transform: translate(-100px, 0px);
  -ms-transform: translate(-100px, 0px);
  transform: translate3d(-100px, 0px, 0px);
  
}

.animation-element.slide-left.in-view {
  opacity: 1;
  -moz-transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate3d(0px, 0px, 0px);
  transition-delay: 2.5s;
  
}


.animation-element.slide-left-1 {
  opacity: 0;
  -moz-transition: all 500ms linear;
  -webkit-transition: all 500ms linear;
  -o-transition: all 500ms linear;
  transition: all 500ms linear;
  -moz-transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate3d(0px, 0px, 0px);
}

.animation-element.slide-left-1.in-view {
  opacity: 1;
  -moz-transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate3d(0px, 0px, 0px);
  transition-delay: 1s;
}






.animation-element.slide-right {
opacity: 0;
  -moz-transition: all 500ms linear;
  -webkit-transition: all 500ms linear;
  -o-transition: all 500ms linear;
  transition: all 500ms linear;
  -moz-transform: translate3d(100px, 0px, 0px);
  -webkit-transform: translate3d(100px, 0px, 0px);
  -o-transform: translate(100px, 0px);
  -ms-transform: translate(100px, 0px);
  transform: translate3d(100px, 0px, 0px);
}

.animation-element.slide-right.in-view {
  opacity: 1;
  -moz-transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate3d(0px, 0px, 0px);
  transition-delay: 2.5s;
}


.animation-element.slide-right-1 {
   opacity: 0;
  -moz-transition: all 500ms linear;
  -webkit-transition: all 500ms linear;
  -o-transition: all 500ms linear;
  transition: all 500ms linear;
  -moz-transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate3d(0px, 0px, 0px);
}

.animation-element.slide-right-1.in-view {
  opacity: 1;
  -moz-transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate3d(0px, 0px, 0px);
  transition-delay: 1s;
}


@media(max-width:580px){

.machine-left-part, .machine-right-part{
	max-width:19%;
	min-width:19%;
}
.framebox1 {
    top: -40px;
 
}

.framebox2 {
    top: 120px;
	left:-65px;
 
}

.framebox3 {
    top: 0px;
    right: -45px;
    
}
.framebox4 {
    top: 135px;
    right: -55px; 
}

}