/* Runing Car
-----------------------------------------------------------------*/
.running-car {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
}

img.car,
img.wheel {
	-webkit-transition: all 1.5s ease-out;
	-moz-transition: all 1.5s ease-out;
	transition: all 1.5s ease-out;
	margin-left: -560px;
}

/* .device-xs img.car,
img.wheel {
	margin-left: -348px;
} */
/* .device-sm img.car,
img.wheel {
	margin-left: -348px;
} */

img.wheel {
	position: absolute;
	left: 0px;
	bottom: 0px;
	z-index: 1;
}

.running-car.in-view img.car {
	-webkit-transform: translate(600px, 0px) rotate(0deg);
	-moz-transform: translate(600px, 0px) rotate(0deg);
	transform: translate(600px, 0px) rotate(0deg);
}

.running-car.in-view img.wheel {
	-webkit-transform: translate(600px, 0px) rotate(720deg);
	-moz-transform: translate(600px, 0px) rotate(720deg);
	transform: translate(600px, 0px) rotate(720deg);
}

.device-sm .running-car.in-view img.car {
	-webkit-transform: translate(500px, 0px) rotate(0deg);
	-moz-transform: translate(500px, 0px) rotate(0deg);
	transform: translate(500px, 0px) rotate(0deg);
	margin-left: -348px;
}

.device-sm .running-car.in-view img.wheel {
	-webkit-transform: translate(500px, 0px) rotate(720deg);
	-moz-transform: translate(500px, 0px) rotate(720deg);
	transform: translate(500px, 0px) rotate(720deg);
	margin-left: -348px;
}

.device-xs .running-car.in-view img.car {
	-webkit-transform: translate(350px, 0px) rotate(0deg);
	-moz-transform: translate(350px, 0px) rotate(0deg);
	transform: translate(350px, 0px) rotate(0deg);
	margin-left: -348px;
}

.device-xs .running-car.in-view img.wheel {
	-webkit-transform: translate(350px, 0px) rotate(720deg);
	-moz-transform: translate(350px, 0px) rotate(720deg);
	transform: translate(350px, 0px) rotate(720deg);
	margin-left: -348px;
}




/* Runing reverse Car
-----------------------------------------------------------------*/
.running-reverse-car {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
}

img.reverse-car {
	width: 80%;
	-webkit-transition: all 1.5s ease-out;
	-moz-transition: all 1.5s ease-out;
	transition: all 1.5s ease-out;
	margin-left: 1000px;
}


.running-reverse-car.in-view img.reverse-car {
	-webkit-transform: translate(-900px, 0px) rotate(0deg);
	-moz-transform: translate(-900px, 0px) rotate(0deg);
	transform: translate(-900px, 0px) rotate(0deg);
}


.device-sm .running-reverse-car.in-view img.reverse-car {
	-webkit-transform: translate(-500px, 0px) rotate(0deg);
	-moz-transform: translate(-500px, 0px) rotate(0deg);
	transform: translate(-500px, 0px) rotate(0deg);
	margin-left: 348px;
	width: 100%;
}

.device-xs .running-reverse-car.in-view img.reverse-car {
	-webkit-transform: translate(-350px, 0px) rotate(0deg);
	-moz-transform: translate(-350px, 0px) rotate(0deg);
	transform: translate(-350px, 0px) rotate(0deg);
	margin-left: 348px;
	width: 100%;
}

/* Runing reverse hit
-----------------------------------------------------------------*/
.running-reverse-hit {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
}

img.reverse-hit {
	width: 100%;
	-webkit-transition: all 1.5s ease-out;
	-moz-transition: all 1.5s ease-out;
	transition: all 1.5s ease-out;
	margin-left: 960px;
}


.running-reverse-hit.in-view img.reverse-hit {
	-webkit-transform: translate(-900px, 0px) rotate(0deg);
	-moz-transform: translate(-900px, 0px) rotate(0deg);
	transform: translate(-900px, 0px) rotate(-0deg);
}


.device-sm .running-reverse-hit.in-view img.reverse-hit {
	-webkit-transform: translate(-500px, 0px) rotate(0deg);
	-moz-transform: translate(-500px, 0px) rotate(0deg);
	transform: translate(-500px, 0px) rotate(-0deg);
	margin-left: 348px;
	width: 100%;
}

.device-xs .running-reverse-hit.in-view img.reverse-hit {
	-webkit-transform: translate(-350px, 0px) rotate(0deg);
	-moz-transform: translate(-350px, 0px) rotate(0deg);
	transform: translate(-350px, 0px) rotate(-0deg);
	margin-left: 348px;
	width: 100%;
}

/* Runing reverse camp
-----------------------------------------------------------------*/
.running-reverse-camp {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
}

img.reverse-camp {
	width: 100%;
	-webkit-transition: all 1.5s ease-out;
	-moz-transition: all 1.5s ease-out;
	transition: all 1.5s ease-out;
	margin-left: 960px;
}


.running-reverse-camp.in-view img.reverse-camp {
	-webkit-transform: translate(-900px, 0px) rotate(0deg);
	-moz-transform: translate(-900px, 0px) rotate(0deg);
	transform: translate(-900px, 0px) rotate(-0deg);
}


.device-sm .running-reverse-camp.in-view img.reverse-camp {
	-webkit-transform: translate(-500px, 0px) rotate(0deg);
	-moz-transform: translate(-500px, 0px) rotate(0deg);
	transform: translate(-500px, 0px) rotate(-0deg);
	margin-left: 348px;
	width: 100%;
}

.device-xs .running-reverse-camp.in-view img.reverse-camp {
	-webkit-transform: translate(-350px, 0px) rotate(0deg);
	-moz-transform: translate(-350px, 0px) rotate(0deg);
	transform: translate(-350px, 0px) rotate(-0deg);
	margin-left: 348px;
	width: 100%;
}

/* shaking mcn
-----------------------------------------------------------------*/
.shaking-mcn {
	width: 100%;
}

img.shake {
	width: 100%;
	-webkit-transition: all 1.5s ease-out;
	-moz-transition: all 1.5s ease-out;
	transition: all 1.5s ease-out;
}


.shaking-mcn.in-view img.shake {
	animation: shake 3s;
	animation-iteration-count: initial;
}

@keyframes shake {
	0% {
		transform: translate(3px, 3px) rotate(0deg);
	}

	10% {
		transform: translate(-3px, -4px) rotate(-1deg);
	}

	20% {
		transform: translate(-5px, 0px) rotate(1deg);
	}

	30% {
		transform: translate(5px, 4px) rotate(0deg);
	}

	40% {
		transform: translate(3px, -3px) rotate(1deg);
	}

	50% {
		transform: translate(-3px, 4px) rotate(-1deg);
	}

	60% {
		transform: translate(-5px, 3px) rotate(0deg);
	}

	70% {
		transform: translate(5px, 3px) rotate(-1deg);
	}

	80% {
		transform: translate(-3px, -3px) rotate(1deg);
	}

	90% {
		transform: translate(3px, 4px) rotate(0deg);
	}

	100% {
		transform: translate(3px, -4px) rotate(-1deg);
	}
}

/* Runing vending
-----------------------------------------------------------------*/
.running-vending {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
}

.vertexSize {
	width: 70%;
	left: 15%;
}

.robotWidth {
	width: 170%;
}

@media (max-width: 991px) {
	.robotWidth {
		width: 100%;
	}
}

img.vending {
	width: 100%;
	-webkit-transition: all 1.5s ease-out;
	-moz-transition: all 1.5s ease-out;
	transition: all 1.5s ease-out;
	margin-left: 900px;
	z-index: 3;
	position: relative;
}

img.vendingMan {
	width: 100%;
}

img.vendingMan {
	position: absolute;
	left: 0px;
	bottom: 0px;
	z-index: 1;
}

.running-vending.in-view img.vending {
	-webkit-transform: translate(-900px, 0px) rotate(0deg);
	-moz-transform: translate(-900px, 0px) rotate(0deg);
	transform: translate(-900px, 0px) rotate(-0deg);
}

.device-sm .running-vending.in-view img.vending {
	-webkit-transform: translate(-500px, 0px) rotate(0deg);
	-moz-transform: translate(-500px, 0px) rotate(0deg);
	transform: translate(-500px, 0px) rotate(-0deg);
	margin-left: 348px;
	width: 100%;
}


.device-xs .running-vending.in-view img.vending {
	-webkit-transform: translate(-350px, 0px) rotate(0deg);
	-moz-transform: translate(-350px, 0px) rotate(0deg);
	transform: translate(-350px, 0px) rotate(-0deg);
	margin-left: 348px;
	width: 100%;
}


/* Runing drone/soldier
-----------------------------------------------------------------*/
.running-drone {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
}

img.drone {
	width: 100%;
	-webkit-transition: all 1.5s ease-out;
	-moz-transition: all 1.5s ease-out;
	transition: all 1.5s ease-out;
	margin-left: 900px;
	top: -900px;
	position: relative;
}

img.soldier {
	width: 100%;
}

img.soldier {
	position: absolute;
	left: 0px;
	bottom: 0px;
	z-index: 0;
}

.running-drone.in-view img.drone {
	-webkit-transform: translate(-900px, 900px) rotate(0deg);
	-moz-transform: translate(-900px, 900px) rotate(0deg);
	transform: translate(-900px, 900px) rotate(-0deg);
}

.device-sm .running-drone.in-view img.drone {
	-webkit-transform: translate(-500px, 500px) rotate(0deg);
	-moz-transform: translate(-500px, 500px) rotate(0deg);
	transform: translate(-500px, 500px) rotate(-0deg);
	margin-left: 348px;
	top: -348px;
	position: relative;
	width: 100%;
}


.device-xs .running-drone.in-view img.drone {
	-webkit-transform: translate(-350px, 350px) rotate(0deg);
	-moz-transform: translate(-350px, 350px) rotate(0deg);
	transform: translate(-350px, 350px) rotate(-0deg);
	margin-left: 348px;
	top: -348px;
	position: relative;
	width: 100%;
}


/* Runing vertexx
-----------------------------------------------------------------*/
.running-vertexx {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
}

img.vertexx {
	width: 100%;
	-webkit-transition: all 1s ease-out;
	-moz-transition: all 1s ease-out;
	transition: all 1s ease-out;
	margin-left: 900px;
}

img.vertexxMan {
	width: 100%;
}

img.vertexxMan {
	position: absolute;
	left: 5%;
	bottom: 0px;
	z-index: 1;
	visibility: hidden;
}

.running-vertexx.in-view img.vertexx {
	-webkit-transform: translate(-900px, 0px) rotate(0deg);
	-moz-transform: translate(-900px, 0px) rotate(0deg);
	transform: translate(-900px, 0px) rotate(-0deg);
}

.running-vertexx.in-view img.vertexxMan {
	animation: 1s fadeIn;
	animation-fill-mode: forwards;
}

@keyframes fadeIn {
	99% {
		visibility: hidden;
	}

	100% {
		visibility: visible;
	}
}

.device-sm .running-vertexx.in-view img.vertexx {
	-webkit-transform: translate(-500px, 0px) rotate(0deg);
	-moz-transform: translate(-500px, 0px) rotate(0deg);
	transform: translate(-500px, 0px) rotate(-0deg);
	margin-left: 348px;
	width: 100%;
}


.device-xs .running-vertexx.in-view img.vertexx {
	-webkit-transform: translate(-350px, 0px) rotate(0deg);
	-moz-transform: translate(-350px, 0px) rotate(0deg);
	transform: translate(-350px, 0px) rotate(-0deg);
	margin-left: 348px;
	width: 100%;
}


/* Runing sword/shield
-----------------------------------------------------------------*/
.running-sword {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
}

img.sword1 {
	width: 100%;
	-webkit-transition: all 1.5s ease-out;
	-moz-transition: all 1.5s ease-out;
	transition: all 1.5s ease-out;
	left: 900px;
	top: -900px;
	position: absolute;
}


img.shield {
	width: 100%;
}

img.shield {
	position: absolute;
	left: 0px;
	bottom: 0px;
	z-index: 1;
}

.running-sword.in-view img.sword1 {
	-webkit-transform: translate(-900px, 900px) rotate(0deg);
	-moz-transform: translate(-900px, 900px) rotate(0deg);
	transform: translate(-900px, 900px) rotate(-0deg);
}

.device-sm .running-sword.in-view img.sword1 {
	-webkit-transform: translate(-500px, 500px) rotate(0deg);
	-moz-transform: translate(-500px, 500px) rotate(0deg);
	transform: translate(-500px, 500px) rotate(-0deg);
	left: 348px;
	top: -348px;
	position: absolute;
	width: 100%;
}


.device-xs .running-sword.in-view img.sword1 {
	-webkit-transform: translate(-350px, 350px) rotate(0deg);
	-moz-transform: translate(-350px, 350px) rotate(0deg);
	transform: translate(-350px, 350px) rotate(-0deg);
	left: 348px;
	top: -348px;
	position: absolute;
	width: 100%;
}

img.sword2 {
	width: 100%;
	-webkit-transition: all 1.5s ease-out;
	-moz-transition: all 1.5s ease-out;
	transition: all 1.5s ease-out;
	right: 900px;
	top: -900px;
	position: relative;
}

.running-sword.in-view img.sword2 {
	-webkit-transform: translate(900px, 900px) rotate(0deg);
	-moz-transform: translate(900px, 900px) rotate(0deg);
	transform: translate(900px, 900px) rotate(-0deg);
}

.device-sm .running-sword.in-view img.sword2 {
	-webkit-transform: translate(500px, 500px) rotate(0deg);
	-moz-transform: translate(500px, 500px) rotate(0deg);
	transform: translate(500px, 500px) rotate(-0deg);
	right: 348px;
	top: -348px;
	position: relative;
	width: 100%;
}


.device-xs .running-sword.in-view img.sword2 {
	-webkit-transform: translate(350px, 350px) rotate(0deg);
	-moz-transform: translate(350px, 350px) rotate(0deg);
	transform: translate(350px, 350px) rotate(-0deg);
	right: 348px;
	top: -348px;
	position: relative;
	width: 100%;
}