﻿/* reset browser styles */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, th, article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}

html, body {width:100%; display: table;}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}

ol { padding-left: 1.4em; list-style: decimal;}
ul {padding-left: 1.4em; list-style:square;}

table {border-collapse: collapse; border-spacing: 0;} 

area{
	border: solid red 1px;
}

/* end reset browser styles */


body { font-family: Arial; font-size: 11pt; color: #2f2e2e; line-height: 22px }

body.index{ font-family: Arial; font-size: 11pt; color: #2f2e2e; background: #fff url('images/design/body-bg.jpg') no-repeat center top; line-height: 22px ;}
/*-----------------------------------------------------------Template-Elements-------------------------------------------------------------------------------------------------------------------------------*/

#animation{margin: 0 auto; width:1030px;clear:both; height: 600px; overflow: hidden; }
#social_map{
	position: relative; top: -510px;
}

header {margin: 0 auto; width:1024px;}
header section.one {width: 210px; float: left;} 
header section.one img {margin: 10px 15px 15px 1px;} 
header section.two {width: 460px; float: left; padding-top:50px} 
header section.three {float: left; width: 340px; text-align:right; margin-top:10px}  
header section.three img {margin: 8px 0px;} 

nav {margin:0 auto; width:100%}

article {margin: 0 auto; width:1030px; overflow:auto; }
article section {width: 900px; margin:0 auto} 

footer {margin:0 auto; width:1030px}
footer a {color: #666}
footer a:visited {color:#666}
footer a:hover {color:#333}
footer p {
	text-align:center
}
footer img {
	margin:0 auto
}

/*-----------------------------------------------------------Elements-------------------------------------------------------------------------------------------------------------------------------*/

a {	color: #785b43; text-decoration:none}
a:active {color: #785b43; text-decoration:none}   
a:visited {color: #785b43; text-decoration:none}
a:hover {color: #909a4f; text-decoration:underline}

ul, li {line-height:25px}
img {border-width: 0px; }

h1 { font-family: Arial, sans-serif  MS; font-size: 19pt; color: #788046; font-weight:normal; margin: 20px 0 20px 0}
h2 {font: 14pt 'Oxygen', sans-serif; color: #666; margin: 20px 0 20px 0;  }
h3 { font-family: "Trebuchet MS"; font-size: 12pt; color: #785b43; font-style:italic; margin: 10px 0 10px 0 }

p {margin: 20px 0}

input, textarea { padding: 5px;background: #fff; font-size: 9pt; color: #ccc; font-family: Arial, Helvetica, sans-serif; border: 1px solid #ccc; 
                  margin-bottom:5px; height:21px; width:250px; resize: none; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px;
                  box-shadow: inset 0 2px 8px rgba(0,0,0,0.3); 
                }

.submit { background: #333;	-webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px;
   	 cursor:pointer; width: 75px; height: 30px; border: none; color: #fff}


/*-----------------------------------------------------------Classes-------------------------------------------------------------------------------------------------------------------------------*/

.image_border { margin: 7px 0 17px 30px;}
 
.fade {
   opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
   position:relative;
   left:45px;
   top:-15px;
   }
 
.fade:hover {opacity: 0.6;}

.center {text-align:center}
.right {text-align:right}
.hover img:hover { opacity:0.7 }
.contact {float:left; width:500px}
.appt {float:left}





 #dog_bubble, #cabin_bubble, #flock_bubble, #team_bubble{opacity:.2;}
#dog_bubble:hover, #cabin_bubble:hover, #flock_bubble:hover, #team_bubble:hover{opacity: 1;}


/*------------------------------------DOG ANIMATION----------------------------*/
/*-----------------------------------------------------------------------------*/

#dog_bubble{background:url('images/dolls/dog_bubble.png') no-repeat; width: 120px; height: 47px; position: relative; left: 30px; }

#dog{
	position: relative;
	left: 225px; top: -100px; height: 217px; width: 206px;
	}

/*---------------------Dog's Body (static)------------------------*/

#dog_body{
	position: relative;
	background-image:url('images/dolls/dog_body.png'); width:144px; height: 152px;
	left: 35px; top: -50px;
	z-index: 1;
	
}
/*---------------------Dog's Tail (static)------------------------*/

#dog_tail{
	position: relative;
	background:url('images/dolls/dog_tail.png') no-repeat; width:59px; height: 19px;
	left: 145px; top: -80px;
	z-index: 0;
}

#dog_tail.animate{
	/*Properties for the animation in general*/
	-webkit-animation-name: tail_wag;
	-webkit-animation-duration: 2s;
	-webkit-animation-timing-function: ease; /*transition*/
	-webkit-animation-iteration-count:infinite; /*how many times = infinite | <number>*/
	-webkit-animation-direction: normal; 
	
	-moz-animation-name: tail_wag;
	-moz-animation-duration: 2s;
	-moz-animation-timing-function: ease; /*transition*/
	-moz-animation-iteration-count:infinite; /*how many times = infinite | <number>*/
	-moz-animation-direction: normal; 

	-ms-animation-name: tail_wag;
	-ms-animation-duration: 2s;
	-ms-animation-timing-function: ease; /*transition*/
	-ms-animation-iteration-count:infinite; /*how many times = infinite | <number>*/
	-ms-animation-direction: normal; 


	animation-name: tail_wag;
	animation-duration: 2s;
	animation-timing-function: ease; /*transition*/
	animation-iteration-count:infinite; /*how many times = infinite | <number>*/
	animation-direction: normal; 
}

@keyframes tail_wag{
	0%{transform:rotate(0deg);}
	25%{transform:rotate(-25deg);}
	50%{transform:rotate(0deg);}
	75%{transform:rotate(-25deg);}
	100%{transform:rotate(0deg);}

}

@-webkit-keyframes tail_wag{
	0%{-webkit-transform:rotate(0deg);}
	25%{-webkit-transform:rotate(-25deg);}
	50%{-webkit-transform:rotate(0deg);}
	75%{-webkit-transform:rotate(-25deg);}
	100%{-webkit-transform:rotate(0deg);}
}
@-ms-keyframes tail_wag{
	0%{-ms-transform:rotate(0deg);}
	25%{-ms-transform:rotate(-25deg);}
	50%{-ms-transform:rotate(0deg);}
	75%{-ms-transform:rotate(-25deg);}
	100%{-ms-transform:rotate(0deg);}
}
@-moz-keyframes tail_wag{
	0%{transform:rotate(0deg);}
	25%{transform:rotate(-25deg);}
	50%{transform:rotate(0deg);}
	75%{transform:rotate(-25deg);}
	100%{transform:rotate(0deg);}
}


/*-------------------------Dog's Barrel (static)------------------------*/

#dog_barrel{
	position: relative;
	background:url('images/dolls/dog_barrel.png') no-repeat; width:58px; height: 49px;
	left: 50px; top: -195px;
	z-index: 3;
	
}




/*------------------------Dog's Head Animation------------------------*/

#dog_head{
/*properties of the element being animated*/
	position: relative;
	z-index: 2;
	overflow: hidden;
	background-image:url('images/dolls/dog_head_1.png');
	height: 108px;
	width:	126px;
	left: 20px; top: 10px;
	}


#dog_head.animate{
	/*Properties for the animation in general*/
	-webkit-animation-name: dogs_head;
	-webkit-animation-duration: 4s;
	-webkit-animation-timing-function: ease; /*transition*/
	-webkit-animation-iteration-count:1; /*how many times = infinite | <number>*/
	-webkit-animation-direction: normal; 
	
	-moz-animation-name: dogs_head;
	-moz-animation-duration: 4s;
	-moz-animation-timing-function: ease; /*transition*/
	-moz-animation-iteration-count:1; /*how many times = infinite | <number>*/
	-moz-animation-direction: normal; 

	-ms-animation-name: dogs_head;
	-ms-animation-duration: 4s;
	-ms-animation-timing-function: ease; /*transition*/
	-ms-animation-iteration-count:1; /*how many times = infinite | <number>*/
	-ms-animation-direction: normal; 


	animation-name: dogs_head;
	animation-duration: 4s;
	animation-timing-function: ease; /*transition*/
	animation-iteration-count:1; /*how many times = infinite | <number>*/
	animation-direction: normal; 
	
}

@-webkit-keyframes dogs_head{
/* The actual keyframming of the animation*/
	0%{}
	5%{/*tilt head*/-webkit-transform:rotate(0deg); /* Safari and Chrome */}
	24%{}
	25%{/*tilt head*/-webkit-transform:rotate(7deg); /* Safari and Chrome */}
	70%{/*tilt head*/-webkit-transform:rotate(7deg); /* Safari and Chrome */}
	80%{/*tilt head*/-webkit-transform:rotate(-7deg); /* Safari and Chrome */}
	90%{/*tilt head*/-webkit-transform:rotate(-7deg); /* Safari and Chrome */}
	100%{/*tilt head*/-webkit-transform:none; /* Safari and Chrome */}
	}

@-moz-keyframes dogs_head{
/* The actual keyframming of the animation*/
	0%{}
	5%{/*tilt head*/transform:rotate(0deg);}
	24%{}
	25%{/*tilt head*/transform:rotate(7deg);}
	70%{/*tilt head*/transform:rotate(7deg);	}
	80%{/*tilt head*/transform:rotate(-7deg);}
	90%{/*tilt head*/transform:rotate(-7deg);}
	100%{/*tilt head*/transform:none;}
}

@-ms-keyframes dogs_head{
/* The actual keyframming of the animation*/
	0%{}
	5%{/*tilt head*/-ms-transform:rotate(0deg); /* IE 9 */}
	24%{}
	25%{/*tilt head*/-ms-transform:rotate(7deg); /* IE 9 */}
	70%{/*tilt head*/-ms-transform:rotate(7deg); /* IE 9 */}
	80%{/*tilt head*/-ms-transform:rotate(-7deg); /* IE 9 */}
	90%{/*tilt head*/-ms-transform:rotate(-7deg); /* IE 9 */}
	100%{/*tilt head*/-ms-transform:none; /* IE 9 */}
	}

@keyframes dogs_head{
/* The actual keyframming of the animation*/
	0%{}
	5%{/*tilt head*/transform:rotate(0deg);}
	24%{}
	25%{/*tilt head*/transform:rotate(7deg);}
	70%{/*tilt head*/transform:rotate(7deg);}
	80%{/*tilt head*/transform:rotate(-7deg);}
	90%{/*tilt head*/transform:rotate(-7deg);}
	100%{/*tilt head*/transform:none;}
}

/*----------------------------------Cabin Animation----------------------------------*/
/*-----------------------------------------------------------------------------------*/

#cabin_bubble{background:url('images/dolls/cabin_bubble.png') no-repeat;width: 120px; height: 47px;position: relative;}

#cabin{
	position:relative; 
	left: 616px; top: -535px; width: 112px; height: 181px; z-index: 1; 

}

#cabin_main{
	background:url(images/dolls/cabin.png) ; width: 109px; height:73px;
	position:relative; z-index: 2;
}

#cabin_smoke{
	background:url(images/dolls/cabin_smoke.png) no-repeat; width: 75px; height:109px;
	position:relative; left:75px;  top: -100px; z-index:-1;

}

#cabin_smoke.animate{
	/*Properties for the animation in general*/
	-webkit-animation-name: cabin_smoke;
	-webkit-animation-duration: 5s;
	-webkit-animation-timing-function: ease; /*transition*/
	-webkit-animation-iteration-count:infinite; /*how many times = infinite | <number>*/
	-webkit-animation-direction: normal; 
	
	-moz-animation-name: cabin_smoke;
	-moz-animation-duration: 5s;
	-moz-animation-timing-function: ease; /*transition*/
	-moz-animation-iteration-count:infinite; /*how many times = infinite | <number>*/
	-moz-animation-direction: normal; 

	-ms-animation-name: cabin_smoke;
	-ms-animation-duration: 5s;
	-ms-animation-timing-function: ease; /*transition*/
	-ms-animation-iteration-count:1; /*how many times = infinite | <number>*/
	-ms-animation-direction: normal; 


	animation-name: cabin_smoke;
	animation-duration: 5s;
	animation-timing-function: ease; /*transition*/
	animation-iteration-count:infinite; /*how many times = infinite | <number>*/
	animation-direction: normal; 

}

@-webkit-keyframes cabin_smoke{
	0%{opacity: 0;left: 75px;top:-70px}
	20%{opacity: 0; background-image:url(images/dolls/cabin_smoke.png);}
	30%{opacity: .9; }
	40%{opacity: .5; left:72px; background-image:url(images/dolls/cabin_smoke2.png);}
	70%{left:75px;}
	75%{opacity: 0;  background-image:url(images/dolls/cabin_smoke.png);}
	100%{opacity: 0; top:-150px;left: 65px }
}

@-ms-keyframes cabin_smoke{
	0%{opacity: 0;left: 75px;top:-70px}
	20%{opacity: 0; background-image:url(images/dolls/cabin_smoke.png);}
	30%{opacity: .9; }
	40%{opacity: .5; left:72px; background-image:url(images/dolls/cabin_smoke2.png);}
	70%{left:70px;}
	75%{opacity: 0;  background-image:url(images/dolls/cabin_smoke.png);}
	100%{opacity: 0; top:-150px;left: 70px }
}

@-moz-keyframes cabin_smoke{
	0%{opacity: 0;left: 75px;top:-70px}
	20%{opacity: 0; background-image:url(images/dolls/cabin_smoke.png);}
	30%{opacity: .9; }
	40%{opacity: .5; left:72px; background-image:url(images/dolls/cabin_smoke2.png);}
	70%{left:80px;}
	75%{opacity: 0;  background-image:url(images/dolls/cabin_smoke.png);}
	100%{opacity: 0; top:-150px;left: 70px }
}

@keyframes cabin_smoke{
	0%{opacity: 0;left: 75px;top:-70px}
	20%{opacity: 0; background-image:url(images/dolls/cabin_smoke.png);}
	30%{opacity: .9; }
	40%{opacity: .5; left:72px; background-image:url(images/dolls/cabin_smoke2.png);}
	70%{left:80px;}
	75%{opacity: 0;  background-image:url(images/dolls/cabin_smoke.png);}
	100%{opacity: 0; top:-150px;left: 70px }
}



#cabin_window{
	background:url(images/dolls/cabin_window.png) no-repeat; width: 58px; height:64px; z-index: 3;
	position:relative; top: 73px; left: 42px;

}



#cabin_window.animate{
	/*Properties for the animation in general*/
	-webkit-animation-name: cabin_window;
	-webkit-animation-duration: 2s;
	-webkit-animation-timing-function: ease; /*transition*/
	-webkit-animation-iteration-count:infinite; /*change to 3*/
	-webkit-animation-direction: normal; 
	
	-moz-animation-name: cabin_window;
	-moz-animation-duration: 2s;
	-moz-animation-timing-function: ease; /*transition*/
	-moz-animation-iteration-count:infinite; /*change to 3*/
	-moz-animation-direction: normal; 

	-ms-animation-name: cabin_window;
	-ms-animation-duration: 2s;
	-ms-animation-timing-function: ease; /*transition*/
	-ms-animation-iteration-count:1; /*change to 3*/
	-ms-animation-direction: normal; 


	animation-name: cabin_window;
	animation-duration: 2s;
	animation-timing-function: ease; /*transition*/
	animation-iteration-count:infinite; /*change to 3*/
	animation-direction: normal; 
}

@-webkit-keyframes cabin_window{
	0%{opacity: 1;}
	2%{opacity:.8;}
	5%{opacity:1;}
	50%{opacity: 0.5;}
	53%{opacity: 0.8;}
	60%{opacity: 0.6;}
	100%{opacity: 1;}
}

@keyframes cabin_window{
	0%{opacity: 1;}
	2%{opacity:.8;}
	5%{opacity:1;}
	50%{opacity: 0.5;}
	53%{opacity: 0.8;}
	60%{opacity: 0.6;}
	100%{opacity: 1;}
}

@-moz-keyframes cabin_window{
	0%{opacity: 1;}
	2%{opacity:.8;}
	5%{opacity:1;}
	50%{opacity: 0.5;}
	53%{opacity: 0.8;}
	60%{opacity: 0.6;}
	100%{opacity: 1;}
}

@-ms-keyframes cabin_window{
	0%{opacity: 1;}
	2%{opacity:.8;}
	5%{opacity:1;}
	50%{opacity: 0.5;}
	53%{opacity: 0.8;}
	60%{opacity: 0.6;}
	100%{opacity: 1;}
}


/*------------------------------------HIKERS ANIMATION-------------------------*/
/*-----------------------------------------------------------------------------*/

#team_bubble{background:url('images/dolls/team_bubble.png') no-repeat;width: 120px; height: 47px;position: relative;}

#hikers{width: 174px; height: 85px;position: relative; top: -750px; left: 80px;}


			/*------------------------HIKER 1 ANIMATION-------------*/

#hiker1{
	background:url('images/dolls/hiker1_body.png') no-repeat; width: 22px; height:39px;
	position: relative; top: 65px; left: 14px;
}

#hiker1.animate{
	/*Properties for the animation in general*/
	-webkit-animation-name: hiker1;
	-webkit-animation-duration: 2s;
	-webkit-animation-timing-function: ease-out; /*transition*/
	-webkit-animation-iteration-count:infinite; /*change to 2*/
	-webkit-animation-direction: normal; 
	
	-moz-animation-name: hiker1;
	-moz-animation-duration: 2s;
	-moz-animation-timing-function: ease-out; /*transition*/
	-moz-animation-iteration-count:infinite; /*change to 2*/
	-moz-animation-direction: normal; 

	-ms-animation-name: hiker1;
	-ms-animation-duration: 2s;
	-ms-animation-timing-function: ease-out; /*transition*/
	-ms-animation-iteration-count:infinite; /*change to 2*/
	-ms-animation-direction: normal; 


	animation-name: hiker1;
	animation-duration: 2s;
	animation-timing-function: ease-out; /*transition*/
	animation-iteration-count:infinite; /*change to 2*/
	animation-direction: normal; 

}

@-webkit-keyframes hiker1{
	0%{}
	70%{top: 67px; left:15px;}
	100%{}
	}
@keyframes hiker1{
	0%{}
	70%{top: 67px; left:15px;}
	100%{}
	}

@-moz-keyframes hiker1{
	0%{}
	70%{top: 67px; left:15px;}
	100%{}
	}

@-ms-keyframes hiker1{
	0%{}
	70%{top: 67px; left:15px;}
	100%{}
	}


      /*--------ARM--------*/


#hiker1_arm{
	background: url(images/dolls/hiker1_arm.png) no-repeat; width:21px; height: 46px;
	position: relative; top:-10px; left: 5px;

}

#hiker1_arm.animate{
	/*Properties for the animation in general*/
	-webkit-animation-name: hiker1_arm;
	-webkit-animation-duration: 4s;
	-webkit-animation-timing-function: ease-out; /*transition*/
	-webkit-animation-iteration-count:infinite; /*change to 2*/
	-webkit-animation-direction: normal; 
	
	-moz-animation-name: hiker1_arm;
	-moz-animation-duration: 4s;
	-moz-animation-timing-function: ease-out; /*transition*/
	-moz-animation-iteration-count:infinite; /*change to 2*/
	-moz-animation-direction: normal; 

	-ms-animation-name: hiker1_arm;
	-ms-animation-duration: 4s;
	-ms-animation-timing-function: ease-out; /*transition*/
	-ms-animation-iteration-count:infinite; /*change to 2*/
	-ms-animation-direction: normal; 

	animation-name: hiker1_arm;
	animation-duration: 4s;
	animation-timing-function: ease-out; /*transition*/
	animation-iteration-count:infinite; /*change to 2*/
	animation-direction: normal; 
	
}
@-webkit-keyframes hiker1_arm{
	0%{left: 7px;-webkit-transform:rotate(15deg); /* Safari and Chrome */}
	90%{left: 4px; top: -7px;-webkit-transform:rotate(45deg); /* Safari and Chrome */}
	100%{left: 7px;-webkit-transform:rotate(5deg); /* Safari and Chrome */}
	}
@keyframes hiker1_arm{
	0%{left: 7px;transform:rotate(15deg);}
	90%{left: 4px; top: -7px;transform:rotate(45deg);}
	100%{left: 7px;transform:rotate(5deg);}
	}
@-ms-keyframes hiker1_arm{
	0%{left: 7px;-ms-transform:rotate(15deg); /* Safari and Chrome */}
	90%{left: 4px; top: -7px;-ms-transform:rotate(45deg); /* Safari and Chrome */}
	100%{left: 7px;-ms-transform:rotate(5deg); /* Safari and Chrome */}
	}
@-moz-keyframes hiker1_arm{
	0%{left: 7px;transform:rotate(15deg); /* Safari and Chrome */}
	90%{left: 4px; top: -7px;transform:rotate(45deg); /* Safari and Chrome */}
	100%{left: 7px;transform:rotate(5deg); /* Safari and Chrome */}
	}


      /*-------LEGS--------*/

#hiker1_leg1{
	background: url(images/dolls/hiker1_leg1.png) no-repeat; width:21px; height: 46px;
	position: relative; top:-49px; left: 3px;
}

#hiker1_leg1.animate{
	/*Properties for the animation in general*/
	-webkit-animation-name: hiker1_leg1_step;
	-webkit-animation-duration: 2s;
	-webkit-animation-timing-function: ease-out; /*transition*/
	-webkit-animation-iteration-count:infinite; /*change to 2*/
	-webkit-animation-direction: normal; 
	
	-moz-animation-name: hiker1_leg1_step;
	-moz-animation-duration: 2s;
	-moz-animation-timing-function: ease-out; /*transition*/
	-moz-animation-iteration-count:infinite; /*change to 2*/
	-moz-animation-direction: normal; 

	-ms-animation-name: hiker1_leg1_step;
	-ms-animation-duration: 2s;
	-ms-animation-timing-function: ease-out; /*transition*/
	-ms-animation-iteration-count:infinite; /*change to 2*/
	-ms-animation-direction: normal; 

	animation-name: hiker1_leg1_step;
	animation-duration: 2s;
	animation-timing-function: ease-out; /*transition*/
	animation-iteration-count:infinite; /*change to 2*/
	animation-direction: normal; 
}

@-webkit-keyframes hiker1_leg1_step{
	0%{ /*steps*/ -webkit-transform:rotate(-25deg); /* Safari and Chrome */}
	90%{top:-51px;}
	100%{ top: -55px;	/*steps*/-webkit-transform:rotate(15deg); /* Safari and Chrome */}
}
@keyframes hiker1_leg1_step{
	0%{ /*steps*/transform:rotate(-25deg);}
	90%{top:-51px;}
	100%{ top: -55px;	/*steps*/ transform:rotate(15deg);}
}
@-ms-keyframes hiker1_leg1_step{
	0%{ /*steps*/-ms-transform:rotate(-25deg); /* IE 9 */}
	90%{top:-51px;}
	100%{ top: -55px;	/*steps*/-ms-transform:rotate(15deg); /* IE 9 */}
}
@-moz-keyframes hiker1_leg1_step{
	0%{ /*steps*/transform:rotate(-25deg);}
	90%{top:-51px;}
	100%{ top: -55px;	/*steps*/transform:rotate(15deg);}
}


#hiker1_leg2{
	background: url(images/dolls/hiker1_leg2.png) no-repeat; width:21px; height: 46px;
	position: relative; top:-95px; left: 3px;
	/*steps*/
		transform:rotate(15deg);
		-ms-transform:rotate(15deg); /* IE 9 */
		-webkit-transform:rotate(15deg); /* Safari and Chrome */
}
#hiker1_leg2.animate{
	/*Properties for the animation in general*/
	-webkit-animation-name: hiker1_leg2_step;
	-webkit-animation-duration: 2s;
	-webkit-animation-timing-function: ease-in; /*transition*/
	-webkit-animation-iteration-count:infinite; /*change to 2*/
	-webkit-animation-direction: normal; 
	
	-moz-animation-name: hiker1_leg2_step;
	-moz-animation-duration: 2s;
	-moz-animation-timing-function: ease-in; /*transition*/
	-moz-animation-iteration-count:infinite; /*change to 2*/
	-moz-animation-direction: normal; 

	-ms-animation-name: hiker1_leg2_step;
	-ms-animation-duration: 2s;
	-ms-animation-timing-function: ease-in; /*transition*/
	-ms-animation-iteration-count:infinite; /*change to 2*/
	-ms-animation-direction: normal; 


	animation-name: hiker1_leg2_step;
	animation-duration: 2s;
	animation-timing-function: ease-in; /*transition*/
	animation-iteration-count:infinite; /*change to 2*/
	animation-direction: normal; 

}

@-webkit-keyframes hiker1_leg2_step{
	0%{ /*steps*/		-webkit-transform:rotate(25deg); /* Safari and Chrome */}
	90%{top:-95px;}
	100%{	/*steps*/top: -40;	-webkit-transform:rotate(-15deg); /* Safari and Chrome */
	}
}

@-ms-keyframes hiker1_leg2_step{
	0%{ /*steps*/-ms-transform:rotate(25deg); /* IE 9 */}
	90%{top:-95px;}
	100%{	/*steps*/top: -40;-ms-transform:rotate(-15deg); /* IE 9 */}
}

@-moz-keyframes hiker1_leg2_step{
	0%{ /*steps*/transform:rotate(25deg);}
	90%{top:-95px;}
	100%{	/*steps*/top: -40;transform:rotate(-15deg); }
}
@keyframes hiker1_leg2_step{
	0%{ /*steps*/transform:rotate(25deg);}
	90%{top:-95px;}
	100%{	/*steps*/top: -40;transform:rotate(-15deg);}
}



			/*------------------------HIKER 2 ANIMATION-------------*/

#hiker2{
	background-image:url('images/dolls/hiker2_body.png');  width: 19px; height:31px;
	position: relative; top: 16px; left: 44px;
}

#hiker2.animate{
	/*Properties for the animation in general*/
	-webkit-animation-name: hiker2;
	-webkit-animation-duration: 1.5s;
	-webkit-animation-timing-function: ease-out; /*transition*/
	-webkit-animation-iteration-count:infinite; /*change to 2*/
	-webkit-animation-direction: normal; 
	
	-moz-animation-name: hiker2;
	-moz-animation-duration: 1.5s;
	-moz-animation-timing-function: ease-out; /*transition*/
	-moz-animation-iteration-count:infinite; /*change to 2*/
	-moz-animation-direction: normal; 

	-ms-animation-name: hiker2;
	-ms-animation-duration: 1.5s;
	-ms-animation-timing-function: ease-out; /*transition*/
	-ms-animation-iteration-count:infinite; /*change to 2*/
	-ms-animation-direction: normal; 

	animation-name: hiker2;
	animation-duration: 1.5s;
	animation-timing-function: ease-out; /*transition*/
	animation-iteration-count:infinite; /*change to 2*/
	animation-direction: normal; 

}

@-webkit-keyframes hiker2{
	0%{}
	70%{top: 14px; left:44px;}
	100%{}
	
}
@-moz-keyframes hiker2{
	0%{}
	70%{top: 14px; left:44px;}
	100%{}
	
}
@-ms-keyframes hiker2{
	0%{}
	70%{top: 14px; left:44px;}
	100%{}
	
}
@keyframes hiker2{
	0%{}
	70%{top: 14px; left:44px;}
	100%{}
	
}


      /*--------ARM--------*/


#hiker2_arm{
	background: url(images/dolls/hiker2_arm.png) no-repeat; width:21px; height: 46px;
	position: relative; top:-12px; left: 3px;
}

#hiker2_arm.animate{
	/*Properties for the animation in general*/
	-webkit-animation-name: hiker2_arm;
	-webkit-animation-duration: 3s;
	-webkit-animation-timing-function: ease-out; /*transition*/
	-webkit-animation-iteration-count:infinite; /*change to 2*/
	-webkit-animation-direction: normal; 
	
	-moz-animation-name: hiker2_arm;
	-moz-animation-duration: 3s;
	-moz-animation-timing-function: ease-out; /*transition*/
	-moz-animation-iteration-count:infinite; /*change to 2*/
	-moz-animation-direction: normal; 

	-ms-animation-name: hiker2_arm;
	-ms-animation-duration: 3s;
	-ms-animation-timing-function: ease-out; /*transition*/
	-ms-animation-iteration-count:infinite; /*change to 2*/
	-ms-animation-direction: normal; 


	animation-name: hiker2_arm;
	animation-duration: 3s;
	animation-timing-function: ease-out; /*transition*/
	animation-iteration-count:infinite; /*change to 2*/
	animation-direction: normal; 
	
}
@-webkit-keyframes hiker2_arm{
	0%{left: 4px;-webkit-transform:rotate(5deg); /* Safari and Chrome */}
	30%{left: 2px; top: -9px;-webkit-transform:rotate(25deg); /* Safari and Chrome */}
	100%{left: 4px;-webkit-transform:rotate(5deg); /* Safari and Chrome */}
}
@keyframes hiker2_arm{
	0%{left: 4px;transform:rotate(5deg);}
	30%{left: 2px; top: -9px;transform:rotate(25deg);}
	100%{left: 4px;transform:rotate(5deg);}
}
@-moz-keyframes hiker2_arm{
	0%{left: 4px;transform:rotate(5deg);}
	30%{left: 2px; top: -9px;transform:rotate(25deg);}
	100%{left: 4px;transform:rotate(5deg);}
}
@-ms-keyframes hiker2_arm{
	0%{left: 4px;-ms-transform:rotate(5deg); /* IE 9 */}
	30%{left: 2px; top: -9px;-ms-transform:rotate(25deg); /* IE 9 */}
	100%{left: 4px;-ms-transform:rotate(5deg); /* IE 9 */}
}


      /*-------LEG--------*/

#hiker2_leg1{
	background: url(images/dolls/hiker2_leg1.png) no-repeat; width:10px; height: 33px;
	position: relative; top:-45px; left: 5px;
}

#hiker2_leg1.animate{
	/*Properties for the animation in general*/
	-webkit-animation-name: hiker2_leg1_step;
	-webkit-animation-duration: 1.5s;
	-webkit-animation-timing-function: ease-out; /*transition*/
	-webkit-animation-iteration-count:infinite; /*change to 2*/
	-webkit-animation-direction: normal; 
	
	-moz-animation-name: hiker2_leg1_step;
	-moz-animation-duration: 1.5s;
	-moz-animation-timing-function: ease-out; /*transition*/
	-moz-animation-iteration-count:infinite; /*change to 2*/
	-moz-animation-direction: normal; 

	-ms-animation-name: hiker2_leg1_step;
	-ms-animation-duration: 1.5s;
	-ms-animation-timing-function: ease-out; /*transition*/
	-ms-animation-iteration-count:infinite; /*change to 2*/
	-ms-animation-direction: normal; 

	animation-name: hiker2_leg1_step;
	animation-duration: 1.5s;
	animation-timing-function: ease-out; /*transition*/
	animation-iteration-count:infinite; /*change to 2*/
	animation-direction: normal; 

}

@-webkit-keyframes hiker2_leg1_step{
	0%{ top: -46px;	/*steps*/	-webkit-transform:rotate(25deg); /* Safari and Chrome */}
	90%{top:-45px;}
	100%{top:-43px;	/*steps*/	-webkit-transform:rotate(-5deg); /* Safari and Chrome */}
}

@-moz-keyframes hiker2_leg1_step{
	0%{ top: -46px;	/*steps*/transform:rotate(25deg);}
	90%{top:-45px;}
	100%{top:-43px;	/*steps*/transform:rotate(-5deg);}
}

@-ms-keyframes hiker2_leg1_step{
	0%{ top: -46px;	/*steps*/-ms-transform:rotate(25deg); /* IE 9 */}
	90%{top:-45px;}
	100%{top:-43px;	/*steps*/-ms-transform:rotate(-5deg); /* IE 9 */}
}

@keyframes hiker2_leg1_step{
	0%{ top: -46px;	/*steps*/transform:rotate(25deg);}
	90%{top:-45px;}
	100%{top:-43px;	/*steps*/transform:rotate(-5deg);}
}



#hiker2_leg2{
	background: url(images/dolls/hiker2_leg2.png) no-repeat; width:8px; height: 35px;
	position: relative; top:-78px; left: 5px;
}


#hiker2_leg2.animate{
	/*Properties for the animation in general*/
	-webkit-animation-name: hiker2_leg2_step;
	-webkit-animation-duration: 1.5s;
	-webkit-animation-timing-function: ease-in; /*transition*/
	-webkit-animation-iteration-count:infinite; /*change to 2*/
	-webkit-animation-direction: normal; 
	
	-moz-animation-name: hiker2_leg2_step;
	-moz-animation-duration: 1.5s;
	-moz-animation-timing-function: ease-in; /*transition*/
	-moz-animation-iteration-count:infinite; /*change to 2*/
	-moz-animation-direction: normal; 

	-ms-animation-name: hiker2_leg2_step;
	-ms-animation-duration: 1.5s;
	-ms-animation-timing-function: ease-in; /*transition*/
	-ms-animation-iteration-count:infinite; /*change to 2*/
	-ms-animation-direction: normal; 


	animation-name: hiker2_leg2_step;
	animation-duration: 1.5s;
	animation-timing-function: ease-in; /*transition*/
	animation-iteration-count:infinite; /*change to 2*/
	animation-direction: normal; 
}
@keyframes hiker2_leg2_step{
	0%{ top:-79px;/*steps*/transform:rotate(-20deg);}
	90%{ top:-78px;}
	100%{top:-79px;	/*steps*/transform:rotate(20deg);}
}
@-moz-keyframes hiker2_leg2_step{
	0%{ top:-79px;/*steps*/transform:rotate(-20deg);}
	90%{ top:-78px;}
	100%{top:-79px;	/*steps*/transform:rotate(20deg);}
}
@-ms-keyframes hiker2_leg2_step{
	0%{ top:-79px;/*steps*/-ms-transform:rotate(-20deg); /* IE 9 */}
	90%{ top:-78px;}
	100%{top:-79px;	/*steps*/-ms-transform:rotate(20deg); /* IE 9 */}
}
@-webkit-keyframes hiker2_leg2_step{
	0%{ top:-79px;/*steps*/-webkit-transform:rotate(-20deg); /* Safari and Chrome */}
	90%{ top:-78px;}
	100%{top:-79px;	-webkit-transform:rotate(20deg); /* Safari and Chrome */}
}


			/*------------------------HIKER 3 ANIMATION-------------*/
#hiker3{
	background-image:url('images/dolls/hiker3_body.png');  width: 16px; height:27px;
	position: relative; top: -35px; left: 84px;
}

#hiker3.animate{
	/*Properties for the animation in general*/
	-webkit-animation-name: hiker3;
	-webkit-animation-duration: 2.5s;
	-webkit-animation-timing-function: ease-out; /*transition*/
	-webkit-animation-iteration-count:infinite; /*change to 2*/
	-webkit-animation-direction: normal; 
	
	-moz-animation-name: hiker3;
	-moz-animation-duration: 2.5s;
	-moz-animation-timing-function: ease-out; /*transition*/
	-moz-animation-iteration-count:infinite; /*change to 2*/
	-moz-animation-direction: normal; 

	-ms-animation-name: hiker3;
	-ms-animation-duration: 2.5s;
	-ms-animation-timing-function: ease-out; /*transition*/
	-ms-animation-iteration-count:infinite; /*change to 2*/
	-ms-animation-direction: normal; 

	animation-name: hiker3;
	animation-duration: 2.5s;
	animation-timing-function: ease-out; /*transition*/
	animation-iteration-count:infinite; /*change to 2*/
	animation-direction: normal; 
}

@-ms-keyframes hiker3{
	0%{}
	50%{top:-33px; left:85px;}
	100%{}
}
@-moz-keyframes hiker3{
	0%{}
	50%{top:-33px; left:85px;}
	100%{}
}
@keyframes hiker3{
	0%{}
	50%{top:-33px; left:85px;}
	100%{}
}
@-webkit-keyframes hiker3{
	0%{}
	50%{top:-33px; left:85px;}
	100%{}
}


      /*-------LEGS--------*/

#hiker3_leg1{
	background: url(images/dolls/hiker3_leg1.png) no-repeat; width:10px; height: 33px;
	position: relative; top:0px; left: 5px;
}

#hiker3_leg1.animate{
	/*Properties for the animation in general*/
	-webkit-animation-name: hiker3_leg1_step;
	-webkit-animation-duration: 2.5s;
	-webkit-animation-timing-function: ease-out; /*transition*/
	-webkit-animation-iteration-count:infinite; /*change to 2*/
	-webkit-animation-direction: normal; 
	
	-moz-animation-name: hiker3_leg1_step;
	-moz-animation-duration: 2.5s;
	-moz-animation-timing-function: ease-out; /*transition*/
	-moz-animation-iteration-count:infinite; /*change to 2*/
	-moz-animation-direction: normal; 

	-ms-animation-name: hiker3_leg1_step;
	-ms-animation-duration: 2.5s;
	-ms-animation-timing-function: ease-out; /*transition*/
	-ms-animation-iteration-count:infinite; /*change to 2*/
	-ms-animation-direction: normal; 


	animation-name: hiker3_leg1_step;
	animation-duration: 2.5s;
	animation-timing-function: ease-out; /*transition*/
	animation-iteration-count:infinite; /*change to 2*/
	animation-direction: normal; 
}

@-webkit-keyframes hiker3_leg1_step{
	0%{ top:-3px;	/*steps*/-webkit-transform:rotate(25deg); /* Safari and Chrome */}
	70%{top:0px;}
	100%{top:-3px;	/*steps*/-webkit-transform:rotate(-5deg); /* Safari and Chrome */}
}
@-moz-keyframes hiker3_leg1_step{
	0%{ top:-3px;	/*steps*/transform:rotate(25deg); /* Safari and Chrome */}
	70%{top:0px;}
	100%{top:-3px;	/*steps*/transform:rotate(-5deg); /* Safari and Chrome */}
}

@-ms-keyframes hiker3_leg1_step{
	0%{ top:-3px;	/*steps*/-ms-transform:rotate(25deg); /* Safari and Chrome */}
	70%{top:0px;}
	100%{top:-3px;	/*steps*/-ms-transform:rotate(-5deg); /* Safari and Chrome */}
}

@keyframes hiker3_leg1_step{
	0%{ top:-3px;	/*steps*/transform:rotate(25deg); /* Safari and Chrome */}
	70%{top:0px;}
	100%{top:-3px;	/*steps*/transform:rotate(-5deg); /* Safari and Chrome */}
}



#hiker3_leg2{
	background: url(images/dolls/hiker3_leg2.png) no-repeat; width:8px; height: 35px;
	position: relative; top:-35px; left: 5px;
}
#hiker3_leg2.animate{
	/*Properties for the animation in general*/
	-webkit-animation-name: hiker3_leg2_step;
	-webkit-animation-duration: 2.5s;
	-webkit-animation-timing-function: ease-in; /*transition*/
	-webkit-animation-iteration-count:infinite; /*change to 2*/
	-webkit-animation-direction: normal; 
	
	-moz-animation-name: hiker3_leg2_step;
	-moz-animation-duration: 2.5s;
	-moz-animation-timing-function: ease-in; /*transition*/
	-moz-animation-iteration-count:infinite; /*change to 2*/
	-moz-animation-direction: normal; 

	-ms-animation-name: hiker3_leg2_step;
	-ms-animation-duration: 2.5s;
	-ms-animation-timing-function: ease-in; /*transition*/
	-ms-animation-iteration-count:infinite; /*change to 2*/
	-ms-animation-direction: normal; 


	animation-name: hiker3_leg2_step;
	animation-duration: 2.5s;
	animation-timing-function: ease-in; /*transition*/
	animation-iteration-count:infinite; /*change to 2*/
	animation-direction: normal; 
}

@-webkit-keyframes hiker3_leg2_step{
	0%{ top:-35px;/*steps*/-webkit-transform:rotate(-20deg); /* Safari and Chrome */}
	70%{ top:-34px;}
	100%{top:-35px;/*steps*/-webkit-transform:rotate(20deg); /* Safari and Chrome */}
}
@-moz-keyframes hiker3_leg2_step{
	0%{ top:-35px;/*steps*/transform:rotate(-20deg); /* Safari and Chrome */}
	70%{ top:-34px;}
	100%{top:-35px;/*steps*/transform:rotate(20deg); /* Safari and Chrome */}
}
@-ms-keyframes hiker3_leg2_step{
	0%{ top:-35px;/*steps*/-ms-transform:rotate(-20deg); /* Safari and Chrome */}
	70%{ top:-34px;}
	100%{top:-35px;/*steps*/-ms-transform:rotate(20deg); /* Safari and Chrome */}
}
@keyframes hiker3_leg2_step{
	0%{ top:-35px;/*steps*/transform:rotate(-20deg); /* Safari and Chrome */}
	70%{ top:-34px;}
	100%{top:-35px;/*steps*/transform:rotate(20deg); /* Safari and Chrome */}
}


/*------------------------------------SHEEP ANIMATION-------------------------*/
/*-----------------------------------------------------------------------------*/

#flock_bubble{background:url('images/dolls/flock_bubble.png') no-repeat;width: 120px; height: 47px;position: relative; left: 250px; top: -50px}

#flock{
	position: relative; height: 130px; width:400px;
	top: -630px; left: 625px;
}

	/*---------------------SHEEP 1 ----------------*/

#sheep1{
	height: 34px; width: 42px;
	position: relative; top:5px; left: 55px; z-index:2;
}

#sheep1.animate{
	/*Properties for the animation in general*/
	-webkit-animation-name: sheep1;
	-webkit-animation-duration: 6s;
	-webkit-animation-timing-function: ease; /*transition*/
	-webkit-animation-iteration-count:infinite; /*change to 1*/
	-webkit-animation-direction: normal; 
	
	-moz-animation-name: sheep1;
	-moz-animation-duration: 6s;
	-moz-animation-timing-function: ease; /*transition*/
	-moz-animation-iteration-count:infinite; /*change to 1*/
	-moz-animation-direction: normal; 

	-ms-animation-name: sheep1;
	-ms-animation-duration: 6s;
	-ms-animation-timing-function: ease; /*transition*/
	-ms-animation-iteration-count:infinite; /*change to 1*/
	-ms-animation-direction: normal; 


	animation-name: sheep1;
	animation-duration: 6s;
	animation-timing-function: ease; /*transition*/
	animation-iteration-count:infinite; /*change to 1*/
	animation-direction: normal;
	}

@-webkit-keyframes sheep1{
	0%{top:5px; left: 55px;}
	16%{top:5px; left: 55px;}
	20%{top: 2px;}
	25%{top: 9px;}
	28%{top: 15px;}
	32%{top:30px; left: 255px;}
	50%{top:30px; left: 255px;
		-webkit-transform: rotateY(0deg);}
	52%{-webkit-transform: rotateY(180deg);}
	98%{-webkit-transform: rotateY(180deg);}
	100%{-webkit-transform: rotateY(0deg);}
}
@-moz-keyframes sheep1{
	0%{top:5px; left: 55px;}
	16%{top:5px; left: 55px;}
	20%{top: 2px;}
	25%{top: 9px;}
	28%{top: 15px;}
	32%{top:30px; left: 255px;}
	50%{top:30px; left: 255px;
		transform: rotateY(0deg);}
	52%{transform: rotateY(180deg);}
	98%{transform: rotateY(180deg);}
	100%{transform: rotateY(0deg);}
}
@-ms-keyframes sheep1{
	0%{top:5px; left: 55px;}
	16%{top:5px; left: 55px;}
	20%{top: 2px;}
	25%{top: 9px;}
	28%{top: 15px;}
	32%{top:30px; left: 255px;}
	50%{top:30px; left: 255px;
		-ms-transform: rotateY(0deg);}
	52%{-ms-transform: rotateY(180deg);}
	98%{-ms-transform: rotateY(180deg);}
	100%{-ms-transform: rotateY(0deg);}
}
@keyframes sheep1{
	0%{top:5px; left: 55px;}
	16%{top:5px; left: 55px;}
	20%{top: 2px;}
	25%{top: 9px;}
	28%{top: 15px;}
	32%{top:30px; left: 255px;}
	50%{top:30px; left: 255px;
		transform: rotateY(0deg);}
	52%{transform: rotateY(180deg);}
	98%{transform: rotateY(180deg);}
	100%{transform: rotateY(0deg);}
}


	#sheep1_body{
		background: url(images/dolls/sheep_body.png) no-repeat;
		position: relative; background-size:100% 100%; z-index: 2;height: 34px; width: 42px;
		top: -28px;
	}
	
	#sheep1_head{
		background: url(images/dolls/sheep_head.png) no-repeat; height: 31px; width: 34px; 
		background-size:100% 100%; left: 25px; top: -5px;
		position: relative;  z-index: 3;
	}
		#sheep1_head.animate{
				/*Properties for the animation in general*/
			-webkit-animation-name: sheep1_head;
			-webkit-animation-duration: 6s;
			-webkit-animation-timing-function: ease; /*transition*/
			-webkit-animation-iteration-count:infinite; /*change to 1*/
			-webkit-animation-direction: normal; 
			
			-moz-animation-name: sheep1_head;
			-moz-animation-duration: 6s;
			-moz-animation-timing-function: ease; /*transition*/
			-moz-animation-iteration-count:infinite; /*change to 1*/
			-moz-animation-direction: normal; 
		
			-ms-animation-name: sheep1_head;
			-ms-animation-duration: 6s;
			-ms-animation-timing-function: ease; /*transition*/
			-ms-animation-iteration-count:infinite; /*change to 1*/
			-ms-animation-direction: normal; 
		
		
			animation-name: sheep1_head;
			animation-duration: 6s;
			animation-timing-function: ease; /*transition*/
			animation-iteration-count:infinite; /*change to 1*/
			animation-direction: normal;
		}
		@-webkit-keyframes sheep1_head{
			0%{ top: -5px;left: 25px;}
			10%{	/*graze*/top: 13px; left: 28px;-webkit-transform:rotate(20deg); /* Safari and Chrome */}
			14%{/*graze end*/top: 13px; left: 28px;-webkit-transform:rotate(20deg); /* Safari and Chrome */}
			21%{/*head up to run*/top: 0px; left: 28px;	-webkit-transform:rotate(1deg); /* Safari and Chrome */}
			32%{ top: -5px;left: 25px;}	
			50%{}
			100%{}
		}
		@-moz-keyframes sheep1_head{
			0%{ top: -5px;left: 25px;}
			10%{	/*graze*/top: 13px; left: 28px;transform:rotate(20deg); /* Safari and Chrome */}
			14%{/*graze end*/top: 13px; left: 28px;transform:rotate(20deg); /* Safari and Chrome */}
			21%{/*head up to run*/top: 0px; left: 28px;transform:rotate(1deg); /* Safari and Chrome */}
			32%{ top: -5px;left: 25px;}	
			50%{}
			100%{}
		}
		@-ms-keyframes sheep1_head{
			0%{ top: -5px;left: 25px;}
			10%{	/*graze*/top: 13px; left: 28px;-ms-transform:rotate(20deg); /* Safari and Chrome */}
			14%{/*graze end*/top: 13px; left: 28px;-ms-transform:rotate(20deg); /* Safari and Chrome */}
			21%{/*head up to run*/top: 0px; left: 28px;	-ms-transform:rotate(1deg); /* Safari and Chrome */}
			32%{ top: -5px;left: 25px;}	
			50%{}
			100%{}
		}
		@keyframes sheep1_head{
			0%{ top: -5px;left: 25px;}
			10%{	/*graze*/top: 13px; left: 28px;transform:rotate(20deg); /* Safari and Chrome */}
			14%{/*graze end*/top: 13px; left: 28px;transform:rotate(20deg); /* Safari and Chrome */}
			21%{/*head up to run*/top: 0px; left: 28px;transform:rotate(1deg); /* Safari and Chrome */}
			32%{ top: -5px;left: 25px;}	
			50%{}
			100%{}
		}

	#sheep1_foot1{
		background:transparent url('images/dolls/sheep_foot1.png') no-repeat; background-size:100% 100%;
		z-index: 0; position: relative; left:27px; top: -38px; width: 8px; height: 11px;
		background-size:100% 100%;		
	}	
	#sheep1_foot2{
		background:transparent url('images/dolls/sheep_foot2.png') no-repeat; background-size:100% 100%;
		z-index: 0; position: relative; left:5px; top: -48px; width: 8px; height: 11px;
		background-size:100% 100%;		
	}


	/*---------------------SHEEP 2 ----------------*/

#sheep2{
	height: 34px; width: 42px; 
	position: relative; top:-70px; left: 275px;z-index: 1;
}

	#sheep2.animate{
		/*Properties for the animation in general*/
				-webkit-animation-name: sheep2;
				-webkit-animation-duration: 6s;
				-webkit-animation-timing-function: ease; /*transition*/
				-webkit-animation-iteration-count:infinite; /*change to 1*/
				-webkit-animation-direction: normal; 
				
				-moz-animation-name: sheep2;
				-moz-animation-duration: 6s;
				-moz-animation-timing-function: ease; /*transition*/
				-moz-animation-iteration-count:infinite; /*change to 1*/
				-moz-animation-direction: normal; 
			
				-ms-animation-name: sheep2;
				-ms-animation-duration: 6s;
				-ms-animation-timing-function: ease; /*transition*/
				-ms-animation-iteration-count:infinite; /*change to 1*/
				-ms-animation-direction: normal; 
			
			
				animation-name: sheep2;
				animation-duration: 6s;
				animation-timing-function: ease; /*transition*/
				animation-iteration-count:infinite; /*change to 1*/
				animation-direction: normal;
	}
	
	@-webkit-keyframes sheep2{
			0%{ top: -70px;left: 275px;}
			10%{	/*graze*/top: -70px;left: 275px;}
			14%{-webkit-transform: rotateY(0deg); }
			16%{/*graze end*/top: -70px;left: 275px;-webkit-transform: rotateY(180deg);}
			21%{}
			23%{-webkit-transform: rotateY(180deg);top: -40px;}
			24%{ left: 225px;}
			25%{-webkit-transform: rotateY(0deg);}
			32%{left: 285px; height: 34px; width: 42px;}	
			33%{ top:-30px;}
			40%{top:-32px;left: 285px; } /*little jump*/
			60%{top:-30px;left: 285px; height: 34px; width: 42px; -webkit-transform: rotateY(0deg);}
			62%{-webkit-transform: rotateY(180deg);}
			77%{top: -50px;}
			80%{ left: 245px;-webkit-transform: rotateY(180deg);}
			82%{-webkit-transform: rotateY(0deg);}
			100%{top: -70px;left: 275px;}
		}
	@-moz-keyframes sheep2{
			0%{ top: -70px;left: 275px;}
			10%{	/*graze*/top: -70px;left: 275px;}
			14%{transform: rotateY(0deg); }
			16%{/*graze end*/top: -70px;left: 275px;transform: rotateY(180deg);}
			21%{}
			23%{transform: rotateY(180deg);top: -40px;}
			24%{ left: 225px;}
			25%{transform: rotateY(0deg);}
			32%{left: 285px; height: 34px; width: 42px;}	
			33%{ top:-30px;}
			40%{top:-30px;left: 285px; } /*little jump*/
			60%{top:-30px;left: 285px; height: 34px; width: 42px; transform: rotateY(0deg);}
			62%{transform: rotateY(180deg);}
			77%{top: -50px;}
			80%{ left: 245px;transform: rotateY(180deg);}
			82%{transform: rotateY(0deg);}
			100%{top: -70px;left: 275px;}
		}
	@-ms-keyframes sheep2{
			0%{ top: -70px;left: 275px;}
			10%{	/*graze*/top: -70px;left: 275px;}
			14%{-ms-transform: rotateY(0deg); }
			16%{/*graze end*/top: -70px;left: 275px;-ms-transform: rotateY(180deg);}
			21%{}
			23%{-ms-transform: rotateY(180deg);top: -40px;}
			24%{ left: 225px;}
			25%{-ms-transform: rotateY(0deg);}
			32%{left: 285px; height: 34px; width: 42px;}	
			33%{ top:-30px;}
			40%{top:-30px;left: 285px; } /*little jump*/
			60%{top:-30px;left: 285px; height: 34px; width: 42px; -ms-transform: rotateY(0deg);}
			62%{-ms-transform: rotateY(180deg);}
			77%{top: -50px;}
			80%{ left: 245px;-ms-transform: rotateY(180deg);}
			82%{-ms-transform: rotateY(0deg);}
			100%{top: -70px;left: 275px;}
		}
	@keyframes sheep2{
			0%{ top: -70px;left: 275px;}
			10%{	/*graze*/top: -70px;left: 275px;}
			14%{transform: rotateY(0deg); }
			16%{/*graze end*/top: -70px;left: 275px;transform: rotateY(180deg);}
			21%{}
			23%{transform: rotateY(180deg);top: -40px;}
			24%{ left: 225px;}
			25%{transform: rotateY(0deg);}
			32%{left: 285px; height: 34px; width: 42px;}	
			33%{ top:-30px;}
			40%{top:-30px;left: 285px; } /*little jump*/
			60%{top:-30px;left: 285px; height: 34px; width: 42px; transform: rotateY(0deg);}
			62%{transform: rotateY(180deg);}
			77%{top: -50px;}
			80%{ left: 245px;transform: rotateY(180deg);}
			82%{transform: rotateY(0deg);}
			100%{top: -70px;left: 275px;}
		}



	#sheep2_body{
	background: url(images/dolls/sheep_body.png) no-repeat;
	position: relative; background-size:100% 100%; z-index: 2;height: 16px; width: 21px;
	
	}
	
		#sheep2_body.animate{
			/*Properties for the animation in general*/
			-webkit-animation-name: sheep2_body;
			-webkit-animation-duration: 6s;
			-webkit-animation-timing-function: ease; /*transition*/
			-webkit-animation-iteration-count:infinite; /*change to 1*/
			-webkit-animation-direction: normal; 
			
			-moz-animation-name: sheep2_body;
			-moz-animation-duration: 6s;
			-moz-animation-timing-function: ease; /*transition*/
			-moz-animation-iteration-count:infinite; /*change to 1*/
			-moz-animation-direction: normal; 
		
			-ms-animation-name: sheep2_body;
			-ms-animation-duration: 6s;
			-ms-animation-timing-function: ease; /*transition*/
			-ms-animation-iteration-count:infinite; /*change to 1*/
			-ms-animation-direction: normal; 
		
		
			animation-name: sheep2_body;
			animation-duration: 6s;
			animation-timing-function: ease; /*transition*/
			animation-iteration-count:infinite; /*change to 1*/
			animation-direction: normal;
			}
		

		@-webkit-keyframes sheep2_body{
			0%{ }
			20%{height: 16px; width: 21px}
			32%{height: 34px; width: 42px;}
			60%{height: 34px; width: 42px;}
			85%{height: 25px; width: 32px;}
			100%{}
		}
		@-moz-keyframes sheep2_body{
			0%{ }
			20%{height: 16px; width: 21px}
			32%{height: 34px; width: 42px;}
			60%{height: 34px; width: 42px;}
			85%{height: 25px; width: 32px;}
			100%{}
		}
		@-ms-keyframes sheep2_body{
			0%{ }
			20%{height: 16px; width: 21px}
			32%{height: 34px; width: 42px;}
			60%{height: 34px; width: 42px;}
			85%{height: 25px; width: 32px;}
			100%{}
		}
		@keyframes sheep2_body{
			0%{ }
			20%{height: 16px; width: 21px}
			32%{height: 34px; width: 42px;}
			60%{height: 34px; width: 42px;}
			85%{height: 25px; width: 32px;}
			100%{}
		}

	

	#sheep2_head{
		background: url(images/dolls/sheep_head.png) no-repeat; height: 16px; width: 17px; 
		background-size:100% 100%;
		position: relative; left: 14px; top: 13px; z-index: 3;
	}
		#sheep2_head.animate{
			/*Properties for the animation in general*/
			-webkit-animation-name: sheep2_head;
			-webkit-animation-duration: 6s;
			-webkit-animation-timing-function: ease; /*transition*/
			-webkit-animation-iteration-count:infinite; /*change to 1*/
			-webkit-animation-direction: normal; 
			
			-moz-animation-name: sheep2_head;
			-moz-animation-duration: 6s;
			-moz-animation-timing-function: ease; /*transition*/
			-moz-animation-iteration-count:infinite; /*change to 1*/
			-moz-animation-direction: normal; 
		
			-ms-animation-name: sheep2_head;
			-ms-animation-duration: 6s;
			-ms-animation-timing-function: ease; /*transition*/
			-ms-animation-iteration-count:infinite; /*change to 1*/
			-ms-animation-direction: normal; 
		
		
			animation-name: sheep2_head;
			animation-duration: 6s;
			animation-timing-function: ease; /*transition*/
			animation-iteration-count:infinite; /*change to 1*/
			animation-direction: normal;
			}
		@-webkit-keyframes sheep2_head{
			0%{ }
			20%{height: 16px; width: 17px;  left: 14px; top: 13px;}
			32%{height: 31px; width: 34px;  left: 24px; top: 23px;}
			60%{height: 31px; width: 34px;  left: 24px; top: 23px;}
			85%{height: 23px; width: 25px; left: 21px; top: 18px;}
			100%{}
		}
		@-moz-keyframes sheep2_head{
			0%{ }
			20%{height: 16px; width: 17px;  left: 14px; top: 13px;}
			32%{height: 31px; width: 34px;  left: 24px; top: 23px;}
			60%{height: 31px; width: 34px;  left: 24px; top: 23px;}
			85%{height: 23px; width: 25px; left: 21px; top: 18px;}
			100%{}
		}
		@-ms-keyframes sheep2_head{
			0%{ }
			20%{height: 16px; width: 17px;  left: 14px; top: 13px;}
			32%{height: 31px; width: 34px;  left: 24px; top: 23px;}
			60%{height: 31px; width: 34px;  left: 24px; top: 23px;}
			85%{height: 23px; width: 25px; left: 21px; top: 18px;}
			100%{}
		}
		@keyframes sheep2_head{
			0%{ }
			20%{height: 16px; width: 17px;  left: 14px; top: 13px;}
			32%{height: 31px; width: 34px;  left: 24px; top: 23px;}
			60%{height: 31px; width: 34px;  left: 24px; top: 23px;}
			85%{height: 23px; width: 25px; left: 21px; top: 18px;}
			100%{}
		}


	#sheep2_foot1{
		background:transparent url('images/dolls/sheep_foot1.png') no-repeat; background-size:100% 100%;
		z-index: 0; position: relative; left:14px; top: -3px; width: 4px; height: 6px;
		background-size:100% 100%;		
	}
		#sheep2_foot1.animate{
			/*Properties for the animation in general*/
			-webkit-animation-name: sheep2_foot1;
			-webkit-animation-duration: 6s;
			-webkit-animation-timing-function: ease; /*transition*/
			-webkit-animation-iteration-count:infinite; /*change to 1*/
			-webkit-animation-direction: normal; 
			
			-moz-animation-name: sheep2_foot1;
			-moz-animation-duration: 6s;
			-moz-animation-timing-function: ease; /*transition*/
			-moz-animation-iteration-count:infinite; /*change to 1*/
			-moz-animation-direction: normal; 
		
			-ms-animation-name: sheep2_foot1;
			-ms-animation-duration: 6s;
			-ms-animation-timing-function: ease; /*transition*/
			-ms-animation-iteration-count:infinite; /*change to 1*/
			-ms-animation-direction: normal; 
		
			animation-name: sheep2_foot1;
			animation-duration: 6s;
			animation-timing-function: ease; /*transition*/
			animation-iteration-count:infinite; /*change to 1*/
			animation-direction: normal;
			}
		@-webkit-keyframes sheep2_foot1{
			0%{ }
			20%{width: 4px; height: 6px;  left:14px; top: -3px;}
			32%{ width: 8px; height: 11px;  left: 24px; top: -8px;}
			60%{ width: 8px; height: 11px;  left: 24px; top: -8px; }
			100%{}
		}
		@-moz-keyframes sheep2_foot1{
			0%{ }
			20%{width: 4px; height: 6px;  left:14px; top: -3px;}
			32%{ width: 8px; height: 11px;  left: 24px; top: -8px;}
			60%{ width: 8px; height: 11px;  left: 24px; top: -8px; }
			100%{}
		}
		@-ms-keyframes sheep2_foot1{
			0%{ }
			20%{width: 4px; height: 6px;  left:14px; top: -3px;}
			32%{ width: 8px; height: 11px;  left: 24px; top: -8px;}
			60%{ width: 8px; height: 11px;  left: 24px; top: -8px; }
			100%{}
		}
		@keyframes sheep2_foot1{
			0%{ }
			20%{width: 4px; height: 6px;  left:14px; top: -3px;}
			32%{ width: 8px; height: 11px;  left: 24px; top: -8px;}
			60%{ width: 8px; height: 11px;  left: 24px; top: -8px; }
			100%{}
		}
	
	#sheep2_foot2{
		background:transparent url('images/dolls/sheep_foot2.png') no-repeat; background-size:100% 100%;
		z-index: 0; position: relative; left:3px; top: -9px; width: 4px; height: 6px;
		background-size:100% 100%;		
	}
	
		#sheep2_foot2.animate{
			/*Properties for the animation in general*/
			-webkit-animation-name: sheep2_foot2;
			-webkit-animation-duration: 6s;
			-webkit-animation-timing-function: ease; /*transition*/
			-webkit-animation-iteration-count:infinite; /*change to 1*/
			-webkit-animation-direction: normal; 
			
			-moz-animation-name: sheep2_foot2;
			-moz-animation-duration: 6s;
			-moz-animation-timing-function: ease; /*transition*/
			-moz-animation-iteration-count:infinite; /*change to 1*/
			-moz-animation-direction: normal; 
		
			-ms-animation-name: sheep2_foot2;
			-ms-animation-duration: 6s;
			-ms-animation-timing-function: ease; /*transition*/
			-ms-animation-iteration-count:infinite; /*change to 1*/
			-ms-animation-direction: normal; 
		
		
			animation-name: sheep2_foot2;
			animation-duration: 6s;
			animation-timing-function: ease; /*transition*/
			animation-iteration-count:infinite; /*change to 1*/
			animation-direction: normal;
			}
		

		@-webkit-keyframes sheep2_foot2{
			0%{ }
			20%{width: 4px; height: 6px;  left:3px; top: -9px;}
			32%{ width: 8px; height: 11px;  left: 14px; top: -20px;}
			60%{ width: 8px; height: 11px;  left: 14px; top: -20px;}
			100%{}
		}
		@-moz-keyframes sheep2_foot2{
			0%{ }
			20%{width: 4px; height: 6px;  left:3px; top: -9px;}
			32%{ width: 8px; height: 11px;  left: 14px; top: -20px;}
			60%{ width: 8px; height: 11px;  left: 14px; top: -20px;}
			100%{}
		}
		@-ms-keyframes sheep2_foot2{
			0%{ }
			20%{width: 4px; height: 6px;  left:3px; top: -9px;}
			32%{ width: 8px; height: 11px;  left: 14px; top: -20px;}
			60%{ width: 8px; height: 11px;  left: 14px; top: -20px;}
			100%{}
		}
		@keyframes sheep2_foot2{
			0%{ }
			20%{width: 4px; height: 6px;  left:3px; top: -9px;}
			32%{ width: 8px; height: 11px;  left: 14px; top: -20px;}
			60%{ width: 8px; height: 11px;  left: 14px; top: -20px;}
			100%{}
		}


	/*---------------------SHEEP 3 ----------------*/
	#sheep3{
		height: 34px; width: 42px;
		position: relative; top:-60px; left: 225px; z-index:4;
	}
	
	#sheep3.animate{
	/*Properties for the animation in general*/
			-webkit-animation-name: sheep3;
			-webkit-animation-duration: 6s;
			-webkit-animation-timing-function: ease; /*transition*/
			-webkit-animation-iteration-count:infinite; /*change to 1*/
			-webkit-animation-direction: normal; 
			
			-moz-animation-name: sheep3;
			-moz-animation-duration: 6s;
			-moz-animation-timing-function: ease; /*transition*/
			-moz-animation-iteration-count:infinite; /*change to 1*/
			-moz-animation-direction: normal; 
		
			-ms-animation-name: sheep3;
			-ms-animation-duration: 6s;
			-ms-animation-timing-function: ease; /*transition*/
			-ms-animation-iteration-count:infinite; /*change to 1*/
			-ms-animation-direction: normal; 
		
			animation-name: sheep3;
			animation-duration: 6s;
			animation-timing-function: ease; /*transition*/
			animation-iteration-count:infinite; /*change to 1*/
			animation-direction: normal;

		}
	@-webkit-keyframes sheep3{
		0%{}
		20%{top:-60px; left: 225px;}
		28%{top: -30px; left:280px; }
		65%{top: -30px; left:280px;-webkit-transform: rotateY(0deg); }
		67%{-webkit-transform: rotateY(180deg);}
		95%{top:-60px; left: 225px; -webkit-transform: rotateY(180deg);}
		97%{-webkit-transform: rotateY(0deg);}
		100%{}
	}
	@-moz-keyframes sheep3{
		0%{}
		20%{top:-60px; left: 225px;}
		28%{top: -30px; left:280px; }
		65%{top: -30px; left:280px; transform: rotateY(0deg); }
		67%{transform: rotateY(180deg);}
		95%{top:-60px; left: 225px; transform: rotateY(180deg);}
		97%{transform: rotateY(0deg);}
		100%{}
	}
	@-ms-keyframes sheep3{
		0%{}
		20%{top:-60px; left: 225px;}
		28%{top: -30px; left:280px; }
		65%{top: -30px; left:280px;-ms-transform: rotateY(0deg); }
		67%{-ms-transform: rotateY(180deg);}
		95%{top:-60px; left: 225px; -ms-transform: rotateY(180deg);}
		97%{-ms-transform: rotateY(0deg);}
		100%{}
	}
	@keyframes sheep3{
		0%{}
		20%{top:-60px; left: 225px;}
		28%{top: -30px; left:280px; }
		65%{top: -30px; left:280px;transform: rotateY(0deg); }
		67%{transform: rotateY(180deg);}
		95%{top:-60px; left: 225px; transform: rotateY(180deg);}
		97%{transform: rotateY(0deg);}
		100%{}
	}


	#sheep3_body{
		background: url(images/dolls/sheep_body.png) no-repeat;
		position: relative; background-size:100% 100%; z-index: 2;height: 24px; width: 31px;
	}

	#sheep3_head{
		background: url(images/dolls/sheep_head.png) no-repeat; height: 24px; width: 25px; 
		background-size:100% 100%;
		position: relative; left: 18px; top: 18px; z-index: 3;
	}
	
			#sheep3_head.animate{
			/*Properties for the animation in general*/
			-webkit-animation-name: sheep3_head;
			-webkit-animation-duration: 6s;
			-webkit-animation-timing-function: ease; /*transition*/
			-webkit-animation-iteration-count:infinite; /*change to 1*/
			-webkit-animation-direction: normal; 
			
			-moz-animation-name: sheep3_head;
			-moz-animation-duration: 6s;
			-moz-animation-timing-function: ease; /*transition*/
			-moz-animation-iteration-count:infinite; /*change to 1*/
			-moz-animation-direction: normal; 
		
			-ms-animation-name: sheep3_head;
			-ms-animation-duration: 6s;
			-ms-animation-timing-function: ease; /*transition*/
			-ms-animation-iteration-count:infinite; /*change to 1*/
			-ms-animation-direction: normal; 
		
		
			animation-name: sheep3_head;
			animation-duration: 6s;
			animation-timing-function: ease; /*transition*/
			animation-iteration-count:infinite; /*change to 1*/
			animation-direction: normal;

		}
	@-webkit-keyframes sheep3_head{
		0%{}
		65%{left: 18px; top: 18px;}	
		80%{-webkit-transform:rotate(0deg); /* Safari and Chrome */}
		90%{left: 20px; top: 30px;-webkit-transform:rotate(35deg); /* Safari and Chrome */}	
		95%{}
		100%{left: 18px; top: 18px; -webkit-transform:rotate(0deg); /* Safari and Chrome */}	
	}
	@-moz-keyframes sheep3_head{
		0%{}
		65%{left: 18px; top: 18px;}	
		80%{transform:rotate(0deg); /* Safari and Chrome */}
		90%{left: 20px; top: 30px;transform:rotate(35deg); /* Safari and Chrome */}	
		95%{}
		100%{left: 18px; top: 18px;transform:rotate(0deg); /* Safari and Chrome */}	
	}
	@-ms-keyframes sheep3_head{
		0%{}
		65%{left: 18px; top: 18px;}	
		80%{-ms-transform:rotate(0deg); /* Safari and Chrome */}
		90%{left: 20px; top: 30px;-ms-transform:rotate(35deg); /* Safari and Chrome */}	
		95%{}
		100%{left: 18px; top: 18px; -ms-transform:rotate(0deg); /* Safari and Chrome */}	
	}
	@keyframes sheep3_head{
		0%{}
		65%{left: 18px; top: 18px;}	
		80%{transform:rotate(0deg); /* Safari and Chrome */}
		90%{left: 20px; top: 30px;transform:rotate(35deg); /* Safari and Chrome */}	
		95%{}
		100%{left: 18px; top: 18px;transform:rotate(0deg); /* Safari and Chrome */}	
	}
	
	
	#sheep3_foot1{
		background:transparent url('images/dolls/sheep_foot1.png') no-repeat; background-size:100% 100%;
		z-index: 0; position: relative; left:18px; top: -5px; width: 6px; height: 9px;
		background-size:100% 100%;		
	}
	#sheep3_foot2{
		background:transparent url('images/dolls/sheep_foot2.png') no-repeat; background-size:100% 100%;
		z-index: 0; position: relative; left:4px; top: -15px; width: 6px; height: 9px;
		background-size:100% 100%;		
	}
	
		/*---------------------SHEEP 4 ----------------*/

	#sheep4{
		height: 34px; width: 42px;
		position: relative; top:-140px; left: 155px;
	}
	
		#sheep4.animate{
			/*Properties for the animation in general*/
			-webkit-animation-name: sheep4;
			-webkit-animation-duration: 6s;
			-webkit-animation-timing-function: ease; /*transition*/
			-webkit-animation-iteration-count:infinite; /*change to 1*/
			-webkit-animation-direction: normal; 
			
			-moz-animation-name: sheep4;
			-moz-animation-duration: 6s;
			-moz-animation-timing-function: ease; /*transition*/
			-moz-animation-iteration-count:infinite; /*change to 1*/
			-moz-animation-direction: normal; 
		
			-ms-animation-name: sheep4;
			-ms-animation-duration: 6s;
			-ms-animation-timing-function: ease; /*transition*/
			-ms-animation-iteration-count:infinite; /*change to 1*/
			-ms-animation-direction: normal; 
		
			animation-name: sheep4;
			animation-duration: 6s;
			animation-timing-function: ease; /*transition*/
			animation-iteration-count:infinite; /*change to 1*/
			animation-direction: normal;
		}
		
		@-webkit-keyframes sheep4{
			0%{}
			23%{top:-140px; }
			25%{left:155px;}
			31%{top: -100px; left:280px; }
			63%{top: -100px; left:280px;-webkit-transform: rotateY(0deg); }
			67%{-webkit-transform: rotateY(180deg);}
			75%{top:-115px; }
			78%{left: 200px; }
			95%{-webkit-transform: rotateY(180deg);}
			97%{-webkit-transform: rotateY(0deg);}
			100%{}
		}
		@-moz-keyframes sheep4{
			0%{}
			23%{top:-140px; }
			25%{left:155px;}
			31%{top: -100px; left:280px; }
			63%{top: -100px; left:280px;transform: rotateY(0deg); }
			67%{transform: rotateY(180deg);}
			75%{top:-115px; }
			78%{left: 200px; }
			95%{transform: rotateY(180deg);}
			97%{transform: rotateY(0deg);}
			100%{}
		}
		@-ms-keyframes sheep4{
			0%{}
			23%{top:-140px; }
			25%{left:155px;}
			31%{top: -100px; left:280px; }
			63%{top: -100px; left:280px;-ms-transform: rotateY(0deg); }
			67%{-ms-transform: rotateY(180deg);}
			75%{top:-115px; }
			78%{left: 200px; }
			95%{-ms-transform: rotateY(180deg);}
			97%{-ms-transform: rotateY(0deg);}
			100%{}
		}
		@keyframes sheep4{
			0%{}
			23%{top:-140px; }
			25%{left:155px;}
			31%{top: -100px; left:280px; }
			63%{top: -100px; left:280px;transform: rotateY(0deg); }
			67%{transform: rotateY(180deg);}
			75%{top:-115px; }
			78%{left: 200px; }
			95%{transform: rotateY(180deg);}
			97%{transform: rotateY(0deg);}
			100%{}
		}
		


	#sheep4_body{
		background: url(images/dolls/sheep_body.png) no-repeat;
		position: relative; background-size:100% 100%; z-index: 2;height: 24px; width: 31px;
	}

	#sheep4_head{
		background: url(images/dolls/sheep_head.png) no-repeat; height: 24px; width: 25px; 
		background-size:100% 100%;
		position: relative; left: 18px; top: 18px; z-index: 3;
	}
	#sheep4_foot1{
		background:transparent url('images/dolls/sheep_foot1.png') no-repeat; background-size:100% 100%;
		z-index: 0; position: relative; left:18px; top: -5px; width: 6px; height: 9px;
		background-size:100% 100%;		
	}
	#sheep4_foot2{
		background:transparent url('images/dolls/sheep_foot2.png') no-repeat; background-size:100% 100%;
		z-index: 0; position: relative; left:4px; top: -15px; width: 6px; height: 9px;
		background-size:100% 100%;	
	}

	/*---------------------SHEEP 5 ----------------*/
	
	#sheep5{
 		height: 34px; width: 42px;
		position: relative; top:-95px; left: 300px;

	}

	#sheep5_body{
	background: url(images/dolls/sheep_body.png) no-repeat;
	position: relative; background-size:100% 100%; z-index: 2;height: 34px; width: 42px;
	top: -28px;
	}

	#sheep5_head{
		background: url(images/dolls/sheep_head.png) no-repeat; height: 31px; width: 34px; 
		background-size:100% 100%;
		position: relative; left: 25px; top: -5px; z-index: 3;
	}
	
		#sheep5_head.animate{
			/*Properties for the animation in general*/
			-webkit-animation-name: sheep5_head;
			-webkit-animation-duration: 6s;
			-webkit-animation-timing-function: ease; /*transition*/
			-webkit-animation-iteration-count:infinite; /*change to 1*/
			-webkit-animation-direction: normal; 
			
			-moz-animation-name: sheep5_head;
			-moz-animation-duration: 6s;
			-moz-animation-timing-function: ease; /*transition*/
			-moz-animation-iteration-count:infinite; /*change to 1*/
			-moz-animation-direction: normal; 
		
			-ms-animation-name: sheep5_head;
			-ms-animation-duration: 6s;
			-ms-animation-timing-function: ease; /*transition*/
			-ms-animation-iteration-count:infinite; /*change to 1*/
			-ms-animation-direction: normal; 
		
		
			animation-name: sheep5_head;
			animation-duration: 6s;
			animation-timing-function: ease; /*transition*/
			animation-iteration-count:infinite; /*change to 1*/
			animation-direction: normal;

		}
	@-webkit-keyframes sheep5_head{
		0%{}
		20%{-webkit-transform:rotate(0deg); /* Safari and Chrome */}
		30%{-webkit-transform:rotate(25deg); /* Safari and Chrome */}
		65%{}	
		80%{-webkit-transform:rotate(0deg); /* Safari and Chrome */}
		90%{-webkit-transform:rotate(-35deg); /* Safari and Chrome */}
		95%{}
		100%{-webkit-transform:rotate(0deg); /* Safari and Chrome */}	
	}
	@-moz-keyframes sheep5_head{
		0%{}
		20%{transform:rotate(0deg); /* Safari and Chrome */}
		30%{transform:rotate(25deg); /* Safari and Chrome */}
		65%{}	
		80%{transform:rotate(0deg); /* Safari and Chrome */}
		90%{transform:rotate(-35deg); /* Safari and Chrome */}
		95%{}
		100%{transform:rotate(0deg); /* Safari and Chrome */}	
	}
	@-ms-keyframes sheep5_head{
		0%{}
		20%{-ms-transform:rotate(0deg); /* Safari and Chrome */}
		30%{-ms-transform:rotate(25deg); /* Safari and Chrome */}
		65%{}	
		80%{-ms-transform:rotate(0deg); /* Safari and Chrome */}
		90%{-ms-transform:rotate(-35deg); /* Safari and Chrome */}
		95%{}
		100%{-ms-transform:rotate(0deg); /* Safari and Chrome */}	
	}
	@keyframes sheep5_head{
		0%{}
		20%{transform:rotate(0deg); /* Safari and Chrome */}
		30%{transform:rotate(25deg); /* Safari and Chrome */}
		65%{}	
		80%{transform:rotate(0deg); /* Safari and Chrome */}
		90%{transform:rotate(-35deg); /* Safari and Chrome */}
		95%{}
		100%{transform:rotate(0deg); /* Safari and Chrome */}	
	}

	
	#sheep5_foot1{
		background:transparent url('images/dolls/sheep_foot1.png') no-repeat; background-size:100% 100%;
		z-index: 0; position: relative; left:27px; top: -38px; width: 8px; height: 11px;
		background-size:100% 100%;		
	}
	#sheep5_foot2{
		background:transparent url('images/dolls/sheep_foot2.png') no-repeat; background-size:100% 100%;
		z-index: 0; position: relative; left:5px; top: -48px; width: 8px; height: 11px;
		background-size:100% 100%;		
	}
	
		/*---------------------SHEPARD ----------------*/
		
	#shepard{
	 	height: 34px; width: 42px;
		position: relative; top:-215px; left: 350px;
	}
	#shepard_body{
		background:transparent url('images/dolls/shepard.png') no-repeat; height: 68px; width: 36px;
		position: relative; 
	}
	#shepard_hook{
		background:transparent url('images/dolls/shepard_hook.png') no-repeat; 
		height: 75px; width: 20px; position: relative; top: -80px; left: -5px;
	}
		#shepard_hook.animate{
				/*Properties for the animation in general*/
				-webkit-animation-name: shepard_hook;
				-webkit-animation-duration: 6s; /*change to 2*/
				-webkit-animation-timing-function: ease; /*transition*/
				-webkit-animation-iteration-count:infinite; /*change to 1*/
				-webkit-animation-direction: normal; 
				
				-moz-animation-name: shepard_hook;
				-moz-animation-duration: 6s; /*change to 2*/
				-moz-animation-timing-function: ease; /*transition*/
				-moz-animation-iteration-count:infinite; /*change to 1*/
				-moz-animation-direction: normal; 
			
				-ms-animation-name: shepard_hook;
				-ms-animation-duration: 6s; /*change to 2*/
				-ms-animation-timing-function: ease; /*transition*/
				-ms-animation-iteration-count:infinite; /*change to 1*/
				-ms-animation-direction: normal; 
			
				animation-name: shepard_hook;
				animation-duration: 6s; /*change to 2*/
				animation-timing-function: ease; /*transition*/
				animation-iteration-count:infinite; /*change to 1*/
				animation-direction: normal;
		}
		@-webkit-keyframes shepard_hook{
			0%{}
			14%{top: -90px; left: -2px;-webkit-transform: rotate(20deg);}
			16%{top: -78px; left: -5px;-webkit-transform: rotate(0deg);}
		}
		@-moz-keyframes shepard_hook{
			0%{}
			14%{top: -90px; left: -2px;transform: rotate(20deg);}
			16%{top: -78px; left: -5px;transform: rotate(0deg);}
		}
		@-ms-keyframes shepard_hook{
			0%{}
			14%{top: -90px; left: -2px;-ms-transform: rotate(20deg);}
			16%{top: -78px; left: -5px;-ms-transform: rotate(0deg);}
		}
		@keyframes shepard_hook{
			0%{}
			14%{top: -90px; left: -2px;transform: rotate(20deg);}
			16%{top: -78px; left: -5px;transform: rotate(0deg);}
		}

