/*********************************************START ANIMATION/HOME PAGE***************************************************/
.firstshow{ position:absolute; top:35%; left:0; background:none; font-size:50px; width:100%; text-align:center; font-family: 'minya_nouvellebold';  transition:opacity 1s ease-out, top 1.5s ease-out; }
.firstshow.hide{opacity:0; top:-400px;}
.firstshow h1{ font-size:60px;color:#00aeef; width:100%; margin:0 auto; padding-top:55px;  text-transform:uppercase; position:relative;}
.firstshow h1 span{position:relative;}
.firstshow h1 .ears{position:absolute; top:-50px; left:7px; width:61px; height:70px; background:url(../images/bunny_ear.png) no-repeat; z-index:0;}
.firstshow h2{font-size:30px;color:#00aeef; margin:5px 0; width:100%;}
.no-firstshow .firstshow{display:none; height:0px; transition:opacity 0s;}
.bigrock{position:absolute; top:auto; bottom:20%; left:40%; padding:32px 47px 0 5px; background:url(../images/big-rock.png) no-repeat top center; background-size:500px; width:500px; height:297px;  font-family: 'minya_nouvellebold'; font-size:22px; color:yellow; text-align:center; font-style:italic; text-shadow:1px 1px 6px rgba(0,0,0,.6);}
.bigrock h2{ margin:0 0 0 -10px; padding:0; font-weight:normal; letter-spacing:-1px; line-height:30px; -webkit-transform:translate3d(0,0,0); position: relative; top: 25px; }
.bigrock .one{ font-size:28px; display:inline-block;}
.bigrock .two{ font-size:28px;}
.home{ width:100%; height:100%; background: url(../images/site-bg.jpg) no-repeat center center; background-size:cover; opacity:1; transition:opacity 2s ease-out; overflow:hidden; position:relative; -webkit-transform: translateZ(0);}
.home .addthis_horizontal_follow_toolbox{display:inline-block; width:86px; height:24px; position:absolute; bottom:10px; right:10px;}
.home .addthis_horizontal_follow_toolbox p{display:none;}
.hide{opacity:0; }
.home .bg{display:none;}
.home:after {
  content: url(../animations/Bunny/bunny_sprite_v2.png) url(../animations/Squirrel/squirly-sprite-v2c.png) url(../animations/mailbox_sprite_v3.png);
  display: none;
}
.nolandscape{display:none;}
.nolandscape.on{display:block; width:100%; height:100%; position:absolute; top:0; left:0; z-index:100000; font-size:40px; color:yellow; font-family: 'minya_nouvellebold'; background:#000; padding:50px; text-align:center; }
.share_this{position:absolute; bottom:15px; right:15px;}
.share_this .stButton .chicklets{width:16px; overflow:hidden; padding-right:0px;}
/*Bunny Animations*/
.bunny { width:300px; height:270px; background-size:29100px; position: absolute; bottom:5%; left:25%; background-image: url("../animations/Bunny/bunny_sprite_v2.png"); z-index:5;}
.bunny.on {
	-webkit-animation: bunnay 8s steps(97) ;
	-moz-animation: bunnay 8s steps(97) ;
	-ms-animation: bunnay 8s steps(97) ;
	-o-animation: bunnay 8s steps(97) ;
	animation: bunnay 8s steps(97) ;
	animation-delay: 3s;
}
@keyframes bunnay{ 0%{background-position:0px;} 100%{background-position:-29100px;}}
@-webkit-keyframes bunnay{ 0%{background-position:0px;} 100%{background-position:-29100px;}}
@-moz-keyframes bunnay{ 0%{background-position:0px;} 100%{background-position:-29100px;}}
@-ms-keyframes bunnay{ 0%{background-position:0px;} 100%{background-position:-29100px;}}
@-o-keyframes bunnay{ 0%{background-position:0px;} 100%{background-position:-29100px;}}


/*Squirrel*/
.squirrel{ width:130px; height:150px; background-size:6630px; position: absolute; top:42%; left:28%; background-image: url("../animations/Squirrel/squirly-sprite-v2c.png"); z-index:0;} /*6630x150 - 51 frames at 130w*/
.squirrel.on{
	-webkit-animation: squirly 5.1s steps(51);
    -moz-animation: squirly 5.1s steps(51);
    -ms-animation: squirly 5.1s steps(51);
    -o-animation: squirly 5.1s steps(51);
    animation: squirly 5.1s steps(51);
}
/* @keyframes squirly{from{ background-position:0px;} to { background-position:-6630px;}}
@-webkit-keyframes squirly{from{ background-position:0px;} to { background-position:-6630px;}}
@-moz-keyframes squirly{from{ background-position:0px;} to { background-position:-6630px;}}
@-ms-keyframes squirly{from{ background-position:0px;} to { background-position:-6630px;}}
@-o-keyframes squirly{from{ background-position:0px;} to { background-position:-6630px;}} */


/*Mailbox*/
.mailbox{position:absolute; bottom:10%; left:10%; width:150px; height:200px; background-image:url(../animations/mailbox_sprite_v3.png); cursor:pointer; background-size:900px;}
.mailbox .stone{ position:absolute; bottom:-90px; left:-87px; background:url(../images/left-rock.png) no-repeat bottom center; width:243px; height:106px; }
.mailbox .contact{opacity:1; transition: opacity:0.3s ease-in; position:absolute; top:45px; left:38px; font-family:'minya_nouvellebold'; font-size:19px; font-style:italic; color:yellow; text-align:center; }
.mailbox.on{background-position:150px; } /*on touch screens we make it always open*/
.mailbox:hover .contact,.mailbox.on .contact{opacity:1;}
.mailbox:hover{
	-webkit-animation: mailbox 0.2s steps(5) forwards;
    -moz-animation: mailbox 0.2s steps(5) forwards;
    -ms-animation: mailbox 0.2s steps(5) forwards;
    -o-animation: mailbox 0.2s steps(5) forwards; 
    animation: mailbox 0.2s steps(5) forwards;
}

@keyframes mailbox { from { background-position:0px; } to{ background-position:-750px; } }
@-webkit-keyframes mailbox { 0% { background-position:0px; } 100% { background-position:-750px; } }
@-moz-keyframes mailbox { 0% { background-position:0px; } 100% { background-position:-750px; } }
@-ms-keyframes mailbox { 0% { background-position:0px; } 100% { background-position:-750px; } }
@-o-keyframes mailbox { 0% { background-position:0px; } 100% { background-position:-750px; } }


/*Pole with arrows*/
.pole{position:absolute; bottom:5%; left:50%; margin-left:375px; width:193px;height:524px; background:url(../images/pole-with-rock.png) no-repeat bottom center; z-index:2;}


header,footer{display:none;}



/*Resizing tweaks*/
@media(max-width:1500px){ 
	/* .squirrel{left:28%; width:104px; height:120px; background-size:5304px;} */ /*20% smaller*/
	/* @keyframes squirly{from{ background-position:0px;} to { background-position:5304px;}}
	@-webkit-keyframes squirly{from{ background-position:0px;} to { background-position:5304px;}}
	@-moz-keyframes squirly{from{ background-position:0px;} to { background-position:5304px;}}
	@-ms-keyframes squirly{from{ background-position:0px;} to { background-position:5304px;}}
	@-o-keyframes squirly{from{ background-position:0px;} to { background-position:5304px;}} */
}

@media(max-width:1300px){
	.squirrel{left:23%;}
}

@media(max-width:1200px){
	.squirrel{left:20%;}
}


@media (max-width:1100px){
	.bunny{left:20%; bottom:1%;}
	.squirrel{left:16%;}
	.pole{left:auto; margin-left:0; right:-40px;}
	.bigrock{left:35%;}	
	.mailbox{left:4%;}
}

@media (min-width:961px){
	html,body{min-height:650px; overflow-y:auto; overflow-x:hidden;}	
}
@medai screen (max-width:900px){
	.squirrel{left:10%;}
}
@media (max-width:801px){
	.home{background:none;}
	.home .bg{display:block; position:absolute; top:0; left:0; z-index:0; width:100%;}
	.pole{display:none;}
	.squirrel{left:21%;}
	.firstshow h1{font-size:50px; width:95%;}
	.firstshow h1 .ears{left:4px;}
	.bigrock{background:none; bottom:43%;}
	
	header{display:block; width:100%; position:absolute; min-height:100px; top:0; left:0;}
	
}

@media (min-width:641px) and (max-width:800px){
	.home .bg{top:-115px;}
}

@media (max-width:641px){	
	.firstshow{top:20%;}
	.mailbox{display:none;}
	.bunny{left:0; margin:0 auto;}
	.squirrel{display:none;}
	.birds{transition-duration: 8s !important; -webkit-transition-duration:8s  !important; -moz-transition-duration:8s  !important; }
	.bigrock{ top:300px; bottom:auto; left:0; padding:0; width:100%; opacity:1; transition:opacity 2s; -webkit-transition:opacity 2s;}
	.bigrock.on{opacity:0;}
	.bigrock h2{line-height:25px;}
	.bigrock h2 .one{font-size:30px;}
	.bigrock h2 .two{ font-size:28px;}	
	
	.bunny { width:200px; height:180px; background-size:19400px; }		
	@keyframes bunnay{ 0%{background-position:0px;} 100%{background-position:-19400px;}}
	@-webkit-keyframes bunnay{ 0%{background-position:0px;} 100%{background-position:-19400px;}}
	@-moz-keyframes bunnay{ 0%{background-position:0px;} 100%{background-position:-19400px;}}
	@-ms-keyframes bunnay{ 0%{background-position:0px;} 100%{background-position:-19400px;}}
	@-o-keyframes bunnay{ 0%{background-position:0px;} 100%{background-position:-19400px;}}
}

@media (max-width:461px){	
	.firstshow{top:15%;}
	.firstshow h1{font-size:40px;}
	.firstshow h1 .ears{left:1px; top:-53px;}
	.firstshow h2{font-size:22px;}
	.bigrock{ top:220px; } 
	.bigrock h2{line-height:25px;}
	.bigrock h2 .one{font-size:30px;}
	.bigrock h2 .two{ font-size:28px;}	
}

@media (max-width:321px){
	.bigrock{top:180px;}
	.bigrock h2{line-height:20px;}
	.bigrock h2 .one{font-size:25px;}
	.bigrock h2 .two{ font-size:18px;}	
}

/*********************************************END ANIMATION/HOME PAGE***************************************************/
