
/*** MOOSE ***/
.moose {
	background-image: url('/games/gold-rush/images/moose-sprite.png?t=1571111287');
	width: 132px;
	height: 126px;
	/*
	background-position-x: 0px;
	background-position-y: -2px;
	*/
}

.moose.walk.walk1 {
    background-position-x: -136px;
    width: 137px;
}

.moose.walk.walk2 {
	background-position-x: -289px;
	width: 137px;
}

.moose.walk.walk3 {
	background-position-x: -438px;
	width: 137px;
}

.moose.walk.walk4 {
	background-position-x: -578px;
	width: 137px;
}

.moose.reverse {
	-moz-transform: scale(-1, 1);
	-webkit-transform: scale(-1, 1);
	-o-transform: scale(-1, 1);
	transform: scale(-1, 1);
	filter: FlipH;
	-ms-filter: "FlipH";
}

.moose.left.reverse {
	-moz-transform: unset;
	-webkit-transform: unset;
	-o-transform: unset;
	transform: unset;
	filter: unset;
	-ms-filter: unset;
}

/*
.moose.walk {
	-moz-transform: scale(-1, 1);
	-webkit-transform: scale(-1, 1);
	-o-transform: scale(-1, 1);
	transform: scale(-1, 1);
	filter: FlipH;
	-ms-filter: "FlipH";
}
*/

.moose.dead
{
	transform: scale(1, -1);
	/*
	-webkit-animation: flash linear 1s 3;
	animation: flash linear 1s 3;
	*/
}

.moose.dead.left
{
	transform: scale(-1, -1);
}

.moose.start-left {
	left: -150px;
}

.moose.start-right {
	right: -150px;
}

.moose .hitbox {
    height: 30%;
}

.moose .shadow {
	height: 4%;
	width: 58%;
	bottom: 5%;
	left: 7%;  
}



.moose.walking {
	/*
	width: 140px;
	animation: walking-moose linear 0.5s infinite;
	*/
	
    width: 147px;
    animation: walking-moose linear 0.5s infinite;
	
}

@keyframes walking-moose {
	/*
	  0% {background-position-x: -136px; animation-timing-function: steps(1, end);}
	 25% {background-position-x: -289px; animation-timing-function: steps(1, end);}
	 50% {background-position-x: -438px; animation-timing-function: steps(1, end);}
	 75% {background-position-x: -578px; animation-timing-function: steps(1, end);}
	*/


	0% {
		background-position-x: -147px;
		animation-timing-function: steps(1, end);
	}
	25% {
		background-position-x: -293px;
		animation-timing-function: steps(1, end);
	}
	50% {
		background-position-x: -440px;
		animation-timing-function: steps(1, end);
	}
	75% {
		background-position-x: -588px;
		animation-timing-function: steps(1, end);
	}
}

.moose.blinking-moose {
	animation: blinking-moose 6s steps(1, end) infinite;
}
@keyframes blinking-moose {
	0% {
		background-position-x: -15px;
	}
	95% {
		background-position-x: -749.5px;
	}
}



/*** MOOSE ***/
.moose.omega {
	width: 232px;
	height: 220px;
}
.moose.omega.walking {
	width: 255px;
	height: 220px;
}

.moose.walking.omega {
	
	animation: walking-moose-omega linear 0.5s infinite;
	
}

@keyframes walking-moose-omega {
	/*
	  0% {background-position-x:  -254px; animation-timing-function: steps(1, end);}
	 25% {background-position-x:  -511px; animation-timing-function: steps(1, end);}
	 50% {background-position-x:  -762px; animation-timing-function: steps(1, end);}
	 75% {background-position-x: -1015px; animation-timing-function: steps(1, end);}
	*/
	0% {
		background-position-x: -256px;
		animation-timing-function: steps(1, end);
	}
	25% {
		background-position-x: -514px;
		animation-timing-function: steps(1, end);
	}
	50% {
		background-position-x: -771px;
		animation-timing-function: steps(1, end);
	}
	75% {
		background-position-x: -1030px;
		animation-timing-function: steps(1, end);
	}
}

/* HEALTH */
.moose .health {
    position: absolute;
    bottom: -16px;
    left: 0;
    border: 1px solid #888;
    display: flex;
    width: 99%;
}

.moose.dead .health {
	top: -16px;
	bottom: unset;
}

.moose .health .health-bar {
    width: 100%;
    height: 8px;
    background: linear-gradient(to bottom, #ff6347, #ab311b, #ff6347);
    display: inline-block;
}

.moose .health .health-bar.hit {
	background: transparent;
}

.moose .health[moose-health="0"] {
	display: none;
}

/* moose reverse position (we reverse the health so its always facing the right way */
.moose.reverse .health {
	transform: scale(-1, 1);
}
.moose.reverse.dead .health {
	transform: scale(1, 1);
}

.moose.start-right .health {
	transform: scale(-1, 1);
}
.moose.start-right.dead .health {
	transform: scale(1, 1);
}

.moose.start-right.reverse .health {
	transform: scale(1, 1);
}
.moose.start-right.reverse.dead .health {
	transform: scale(-1, 1);
}

.moose.dead .hitbox {
    height: 60%;
    top: 0;
}