body {
	margin:0;
	/* overflow: hidden; */
	height: 100%;
/* 	background-size: cover; */
	font-family: 'Montserrat', Helvetica, Arial, sans-serif;
}

.background {
	background-image: linear-gradient(#42b2f3 0%, #ffffff 100%);
	background-image: linear-gradient(#42b2f3 0%, #ffffff 100%);
	margin:0;
	position: fixed;
	height: 100%;
	width: 100%;
	z-index: auto;
/* 	background-size: cover; */
}


.ground {
	border-image:initial;
	position:fixed;
	width:100%;
	height:100px;
	background-image:linear-gradient(269deg,#804000 -0.024414%,#333 99.347153%);
	bottom:0;
	border:1px solid #000;
	transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

.cloudBase {
	position:absolute;
	left:0;
	top:0;
	width:2000px;
	height:20px;
	margin-left:-10px;
	margin-top:-10px;
	animation:smcloud 20s linear infinite;
	animation:smcloud 20s linear infinite;
	animation:smcloud 20s linear infinite;
	z-index: -1;
	transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
/* 	animation:smcloud 82s linear infinite; */
}

.cloudBaseBack {
	position:absolute;
	left:0;
	top:0;
	width:2000px;
	height:20px;
	margin-left:-10px;
	margin-top:-10px;
	animation:smcloud 30s linear infinite;
	z-index: -1;
	transform: translate3d(0,0,0);
/* 	animation:smcloud 82s linear infinite; */
}
.cloudBaseBack *{z-index: -1}

.top {
	position:fixed;
	left:19%;
	height:600px;
	bottom:20px;
	z-index: 999;
	transform: translate3d(0,0,0);
}
.walking .top{
	animation:bodymove 1s linear infinite alternate;
}

.frontleg {
	height:260px;
	position:fixed;
	left:20%;
	bottom:40px;
	z-index: 998;
	transform: translate3d(0,0,0);
	transform:rotate(0deg);
	transform-origin:top;
}
.walking .frontleg{
	animation:frontleg 2s linear infinite alternate;
}

.backleg {
	position:fixed;
	left:20%;
	bottom:60px;
	height:264px;
	z-index: 997;
	transform:rotate(0deg);
	transform-origin:top;
	transform: translate3d(0,0,0);
}
.walking .backleg{
	animation:backleg 2s linear infinite alternate;
}



@keyframes frontleg {
	0% {transform:rotate(30deg);}
	100% {transform:rotate(-30deg);}
}

@keyframes backleg {
	0% {transform:rotate(-30deg);}
	100% {transform:rotate(30deg);}
}

@keyframes bodymove {
	0% {transform:rotate(2deg);}
	100% {transform:rotate(-2deg);}
}

@keyframes smcloud {
	0% {
		left:0px;
	}
	
	100% {
		left:-2001px;
	}
}


.jumping{
	animation:jump 2s;
}

/*
@keyframes jump{
	0% {transform: translateY(0px)}
	50% {transform: translateY(-400px)}
	0% {transform: translateY(0px)}	
}
*/
@keyframes jump{
	0% {margin-top: 0;}
	50% {margin-top: -400px;}
	0% {margin-top: 0;}	
}



@keyframes obstacles {
	0%{left: 0px}
	100%{left: -26000px;}
}

.obstacles {
	width: 26000px;
	height: 200px;
	position: absolute;
	bottom: 0;
	left: 0;
	animation: obstacles 130s linear;
}
.obstacles span{
	position: absolute;
	font-size: 100px;
	font-family: 'Montserrat', Helvetica, Arial, sans-serif;
}

@keyframes kick{
	0% {transform:rotate(0deg);}	
	50%{transform:rotate(20deg);}
	100% {transform:rotate(-80deg);}
}

@keyframes returnkick{
	0% {transform:rotate(-80deg);}	
	100% {transform:rotate(0deg);}
}

.kicking .frontleg{	
	transform:rotate(0deg);
	animation: kick 1.5s, returnkick 10s 1.5s;
	}
.kicking .backleg{
	transform:rotate(0deg);
}

/*
@keyframes smcloud {
	0% {
		left:101%;
	}
	
	100% {
		left:-2001px;
	}
}
*/
