@charset "UTF-8";

/* Basic Structure */
html,body{margin:0;padding: 0;}
h1 { color:#5b2800; font-family:din_condensed; font-size:40px; margin-left:10px; text-transform:uppercase;}
h2 { color:#5b2800; font-family:liberation_bold; font-size:25px; margin-left:10px;}
h3 { color:#5b2800; font-family:liberation_regular; font-size:25px; margin-left:10px; margin-top:-25px;}
p  { color:#5b2800; font-family:liberation_regular; font-size:18px; margin-left:10px;}
.separator { width:100%; float:left; height:3px; background:#A4BA3E;}
/* Fonts */
@font-face {font-family: 'liberation_bold';src: url('../fonts/liberation_bold.eot');src: url('../fonts/liberation_bold.eot?#iefix') format('embedded-opentype'),url('../fonts/liberation_bold.woff') format('woff'),url('../fonts/liberation_bold.ttf') format('truetype'),url('../fonts/liberation_bold.svg#liberation_bold') format('svg');font-weight: normal;font-style: normal;}
@font-face {font-family: 'liberation_regular';src: url('../fonts/liberation_regular.eot');src: url('../fonts/liberation_regular?#iefix') format('embedded-opentype'),url('../fonts/liberation_regular.woff') format('woff'),url('../fonts/liberation_regular.ttf') format('truetype'),url('../fonts/liberation_regular.svg#liberation_regular') format('svg');font-weight: normal;font-style: normal;}
@font-face {font-family: 'din_condensed';src: url('../fonts/din_condensed.eot');src: url('../fonts/din_condensed?#iefix') format('embedded-opentype'),url('../fonts/din_condensed.woff') format('woff'),url('../fonts/din_condensed.ttf') format('truetype'),url('../fonts/din_condensed.svg#din_condensed') format('svg');font-weight: normal;font-style: normal;}


/*Estilos del navegador*/

header {
    background-color: #361800;
    height: 74px;
    margin-top: -16px;
    position: fixed;
	width:100%;
    z-index: 1000;
}

header nav {
	width:97%;
	margin:0 auto!important;
	max-width:1000px;
	background:#361800;
	overflow: hidden;
	font-family: 'din_condensed' !important;
}

.menu_bar {
	display:none;
}

header nav ul {
	list-style:none;
	overflow:hidden;
	margin:0 auto;
	/*width:840px;*/
}

header nav ul li {
	float: left;
	/*width:100px;*/
	text-align:center;
}

header nav ul li span {
	margin-right:10px;
}

header nav ul li a{
	display:block;
	padding:35px 10px 10px 10px;
	/*padding:35px 20px 20px 20px;*/
	color:#fff;
	text-decoration:none;
}

header nav ul li a:hover {
	background:#5b2800;
}

@media screen and (max-width:1013px) {
    header{
        height: 58px;
        margin-top: 0px;
        position: fixed;
    }
	header nav {
		width:100%;
		/*height:53%;*/
		margin:0;
		position: fixed;
		left:-100%;
		overflow:hidden;
        text-align: center;
	}
    header nav{
        margin-top: 0px;
        z-index: 100;
    }
	.menu_bar {
		display:block;
		width:100%;
	}

	.menu_bar .bt-menu {
		display:block;
		padding:9px;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
		background:#361800;
		overflow: hidden;
		font-size:25px;
		font-weight:bold;
		color:#fff;
		text-decoration:none;
        padding-left: 30px;
	}

	.menu_bar span {
		float:right;
		font-size:40px;
	}
	header nav ul{
		width:100%!important;
		overflow:hidden;
		margin-left:0!important;
		padding-left:0!important;
	}
	header nav ul li {
		display:block;
		float:none;
		padding:0!important;
		border-bottom:1px solid rgba(255,255,255,.3);
	}
    header nav ul li a{
		padding:15px!important;
    }
    .main_banner{
        padding-top: 58px;
    }
    .logo{
        padding-top: 58px;
    }
}

/*Terminan estilos del navegador*/


/* Top Bar */
.top_content { width:121px; height:auto; left:auto; right:100px; margin:10px; position:absolute; z-index:2;}
#search {}
#search input[type="text"] {background: url(../images/icons/search-white.png) no-repeat 10px 6px #fcfcfc;border: 1px solid #d1d1d1;font: bold 12px Arial,Helvetica,Sans-serif;color: #bebebe;width: 200px;padding: 6px 15px 6px 35px;-webkit-border-radius: 20px;-moz-border-radius: 20px;border-radius: 20px;-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;-webkit-transition: all 0.7s ease 0s;-moz-transition: all 0.7s ease 0s;-o-transition: all 0.7s ease 0s;transition: all 0.7s ease 0s;}
#search input[type="text"]:focus {width: 200px;}

/* Forms */
input[type="text"]{ width:95%; height:18px; border: solid thin #999; padding:5px; outline:none; font-family:liberation_regular; font-size:14px;color:#5b2800;}
input[type="submit"]{cursor:pointer; width:95px; height:40px; line-height:00px; border: solid thin #999; background:#4c4c4e; padding:15px; outline:none; font-family:liberation_regular; font-size:15px;color:#fff; border-radius:5px; margin:10px;}
input[type="submit"]:hover{ border: solid thin #999; background: #333; color:#fff; }
input[type="reset"]{cursor:pointer; width:95px; height:40px; line-height:00px; border: solid thin #999; background: #CCC; padding:15px; outline:none; font-family:liberation_regular; font-size:15px;color:#333; border-radius:5px; margin:10px;}
input[type="reset"]:hover{background: #fff;color:#333;}
textarea { resize:none; width:99%; height:100px;outline:none; font-family:liberation_regular; font-size:14px;color:#5b2800;}

/* Icons */
.icon {width:auto; height:auto; float:left;}

/* Gallery Containers*/
.gallery_container { width:auto; height:auto; float:left;}
.gallery_01 {cursor:pointer; width:115px; height:115px; float:left; margin:5px; background:#333;}
.gallery_02 {cursor:pointer; width:100%; float:left; margin-bottom:15px; background:#333;}

/* Banners */
.main_banner { width: 100%; max-height:100%; overflow:hidden;padding-top: 58px; border-bottom:solid 5px #622100 !important}
.main_banner_content {position:absolute; width:40%; padding:0 30%;height:auto;top:40%; background:rgba(255,255,255,.5); text-align:center;}
.main_banner_content p{font-size:20px;}
.main_banner_brush { width:100%; height:100px; background-image:url(../images/02.png);background-position:top center; background-repeat:no-repeat; overflow:hidden;z-index:1; position:absolute;}
.logo { width:auto; height:auto;  position:absolute; left:50%; margin-left:-100px; z-index:3;padding-top: 58px;}
.logo img{ max-width:100%; height:auto;}
.mini_banner { width: 100%; height:auto; float:left;}
.mini_banner img{ max-width: 100%; width:100%;}

.mini_banner_02 { width: 100%; height:500px; background-image:url(../images/06.jpg); background-position:center center; background-repeat:no-repeat; overflow:hidden;}
.mini_banner_03 { width: 100%; height:500px; background-image:url(../images/07.png); background-position:center center; background-repeat:no-repeat; overflow:hidden;}
.mini_banner_04 { width: 100%; height:500px; background-image:url(../images/09.png); background-position:center center; background-repeat:no-repeat; overflow:hidden;}
.mini_banner_05 { width: 100%; height:500px; background-image:url(../images/12.png); background-position:center center; background-repeat:no-repeat; overflow:hidden;}
.mini_banner_06 { width: 100%; height:500px; background-image:url(../images/14.png); background-position:center center; background-repeat:no-repeat; overflow:hidden;}

/* Sections */
.section { width:100%; height:auto; float:left; margin-top:auto; position:relative;}
.section_img { width:auto; height:auto; float:right; /*visibility:hidden;*/}
.section_img_left { width:auto; height:auto; float:left; /*visibility:hidden;*/}
.section_img_left img {max-width: 100%;width: 100%;}
.section_img img {max-width: 100%;width: 100%;}
.section_img img.logo_conejo {max-width: 50%;width: 50%;}
#cabin_section{margin:0 15%; width:70%!important;}
h4.horarios{font-family: din_condensed; color:#5B2800; font-size:30px; margin-bottom:-20px!important;}

/* Contents*/
.content { width:730px; height:auto; padding:15px; margin:0 auto;}
.content_form { width:500px; height:auto; padding:15px; float:left;}
.content_img { width:180px; height:auto; float:right;margin-top:50px;}
.content_left { width:550px; height:auto; float:left; padding:15px;margin-left:10%; /*visibility:hidden;*/}
.content_right { width:550px; height:auto; float:right; padding:15px;margin-right:10%; /*visibility:hidden;*/}
.column { width:200px; height:auto; float:left; margin:10px;}
/* Buttons */
.pino_btn {cursor:pointer; width:auto; background:#9EB23C; height:auto; /*padding:10px;*/ text-align:center; border:thin solid  #030; color:#fff;font-family:din_condensed; font-size:20px;}
.pino_btn:hover{ background:#030; color:#FFF;}
.pino_btn1 {cursor:pointer; width:auto; background:#00A800; height:auto; padding:10px; text-align:center; border:thin solid  #030; color:#fff;font-family:din_condensed; font-size:25px;}
.pino_btn1:hover{ background:#030; color:#FFF;}

.pino_btn a{
    display: block;
    height: 36px;
    padding-top: 10px;
    width: 100%;
}

/* Animations */

.animated {-webkit-animation-duration: 1s;animation-duration: 1s;-webkit-animation-fill-mode: both;animation-fill-mode: both;}
.animated.infinite {-webkit-animation-iteration-count: infinite;animation-iteration-count: infinite;}
.animated.hinge {-webkit-animation-duration: 2s;animation-duration: 2s;}

@-webkit-keyframes fadeInLeft {0% {opacity: 0;-webkit-transform: translateX(-20px);transform: translateX(-20px);}100% {opacity: 1;-webkit-transform: translateX(0);transform: translateX(0);}}
@keyframes fadeInLeft {0% {opacity: 0;-webkit-transform: translateX(-20px);-ms-transform: translateX(-20px);transform: translateX(-20px);}100% {opacity: 1;-webkit-transform: translateX(0);-ms-transform: translateX(0);transform: translateX(0);}}
.fadeInLeft {-webkit-animation-name: fadeInLeft;animation-name: fadeInLeft; visibility:visible;}

@-webkit-keyframes fadeInRight {0% {opacity: 0;-webkit-transform: translateX(20px);transform: translateX(20px);}100% {opacity: 1;-webkit-transform: translateX(0);transform: translateX(0);}}
@keyframes fadeInRight {0% {opacity: 0;-webkit-transform: translateX(20px);-ms-transform: translateX(20px);transform: translateX(20px);}100% {opacity: 1;-webkit-transform: translateX(0);-ms-transform: translateX(0);transform: translateX(0);}}
.fadeInRight {-webkit-animation-name: fadeInRight;animation-name: fadeInRight; visibility:visible;}

@-webkit-keyframes slideInRight {0% {opacity: 0;-webkit-transform: translateX(2000px);transform: translateX(2000px);}100% {-webkit-transform: translateX(0);transform: translateX(0);}}
@keyframes slideInRight {0% {opacity: 0;-webkit-transform: translateX(2000px);-ms-transform: translateX(2000px);transform: translateX(2000px);}100% {-webkit-transform: translateX(0);-ms-transform: translateX(0);transform: translateX(0);}}
.slideInRight {-webkit-animation-name: slideInRight;animation-name: slideInRight; visibility:visible;}

@-webkit-keyframes slideInLeft {0% {opacity: 0;-webkit-transform: translateX(-2000px);transform: translateX(-2000px);}100% {-webkit-transform: translateX(0);transform: translateX(0);}}
@keyframes slideInLeft {0% {opacity: 0;-webkit-transform: translateX(-2000px);-ms-transform: translateX(-2000px);transform: translateX(-2000px);}100% {-webkit-transform: translateX(0);-ms-transform: translateX(0);transform: translateX(0);}}
.slideInLeft {-webkit-animation-name: slideInLeft;animation-name: slideInLeft; visibility:visible;}

@-webkit-keyframes bounceInLeft {0% {opacity: 0;-webkit-transform: translateX(-2000px);transform: translateX(-2000px);}60% {opacity: 1;-webkit-transform: translateX(30px);transform: translateX(30px);}80% {-webkit-transform: translateX(-10px);transform: translateX(-10px);}100% {-webkit-transform: translateX(0);transform: translateX(0);}}
@keyframes bounceInLeft {0% {opacity: 0;-webkit-transform: translateX(-2000px);-ms-transform: translateX(-2000px);transform: translateX(-2000px);}60% {opacity: 1;-webkit-transform: translateX(30px);-ms-transform: translateX(30px);transform: translateX(30px);}80% {-webkit-transform: translateX(-10px);-ms-transform: translateX(-10px);transform: translateX(-10px);}100% {-webkit-transform: translateX(0);-ms-transform: translateX(0);transform: translateX(0);}}
.bounceInLeft {-webkit-animation-name: bounceInLeft;animation-name: bounceInLeft; visibility:visible;}

@-webkit-keyframes bounceInRight {0% {opacity: 0;-webkit-transform: translateX(2000px);transform: translateX(2000px);}60% {opacity: 1;-webkit-transform: translateX(-30px);transform: translateX(-30px);}80% {-webkit-transform: translateX(10px);transform: translateX(10px);}100% {-webkit-transform: translateX(0);transform: translateX(0);}}
@keyframes bounceInRight {
  0% {opacity: 0;-webkit-transform: translateX(2000px);-ms-transform: translateX(2000px);transform: translateX(2000px);}60% {opacity: 1;-webkit-transform: translateX(-30px);-ms-transform: translateX(-30px);transform: translateX(-30px);}80% {-webkit-transform: translateX(10px);-ms-transform: translateX(10px);transform: translateX(10px);}100% {-webkit-transform: translateX(0);-ms-transform: translateX(0);transform: translateX(0);}}
.bounceInRight {-webkit-animation-name: bounceInRight;animation-name: bounceInRight; visibility:visible;}

@-webkit-keyframes bounceInDown {0% {opacity: 0;-webkit-transform: translateY(-2000px);transform: translateY(-2000px);}60% {opacity: 1;-webkit-transform: translateY(30px);transform: translateY(30px);}80% {-webkit-transform: translateY(-10px);transform: translateY(-10px);}100% {-webkit-transform: translateY(0);transform: translateY(0);}}
@keyframes bounceInDown {0% {opacity: 0;-webkit-transform: translateY(-2000px);-ms-transform: translateY(-2000px);transform: translateY(-2000px);}60% {opacity: 1;-webkit-transform: translateY(30px);-ms-transform: translateY(30px);transform: translateY(30px);}  80% {-webkit-transform: translateY(-10px);-ms-transform: translateY(-10px);transform: translateY(-10px);}100% {-webkit-transform: translateY(0);-ms-transform: translateY(0);transform: translateY(0);}}
.bounceInDown {-webkit-animation-name: bounceInDown;animation-name: bounceInDown;}

@media (max-width: 1245px) {
	.section_img.quienes {
		float: left;
		height: auto;
		margin-left: 10%;
		padding: 15px;
		width: 550px;
	}
}
@media (min-width: 1245px) {
	.section_img.quienes {
		float: left;
		margin-left: 25%;
	}
}

@media (max-width: 1600px){
	.section_img.quienes {
		margin-left: 10%;
	}
}


@media (min-width: 1200px) and (max-width: 1600px){
.section_img { width:500px; height:auto; float:right;}
.section_img_left { width:500px; height:auto; float:left;}
#cabin_img {width:275px; margin-top:30px;}
}
@media (min-width: 800px) and (max-width: 1200px){
.section_img { width:300px; height:auto; float:right;}
.section_img_left { width:300px; height:auto; float:left;}
#cabin_img {width:275px; margin-top:30px;}
}

@media (max-width: 806px){
	.column.arrow{
		display:none;
	}
	.column.precios-cabanas{
		float:left;
		margin-left:0!important;
	}
}


@media all and (max-height:700px) and (orientation:portrait){
   div#pine_section .section{
       margin-top: -73%;
   }
}
div#slides .mini_banner img{
    max-height: 1015px;
    max-width: 1920px;
}
.conejo_logo { width:auto; height:auto; float:right;}

.selPino{
    width: 100%; height:157px;
}
.selPino img{
    float: left;
    margin-left: 4px;
    /* width: 19%; */
	width: 98%;
}


h1 a {
	color:  #361800;
	text-decoration: none;
}
h1 a:hover {
	color: #5B2800;
}

.half_one {
	width:46%;
	float:left;
	margin-right:2%;
	margin-bottom: 15px;
}

.half_two {
	width:46%;
	float:left;
	padding: 15px 0;
}

.half_one img,
.half_two img{
	width:100%;
}

@media (max-width:1000px){
	.half_one, .half_two{
		width: 100%;
		display: block;
		float: none;
		margin:15px auto;
	}
}

/*
.sel_btn{
    width:auto; background:#9EB23C; height:auto; padding:10px; text-align:center; border:thin solid  #030; color:#fff;font-family:din_condensed; font-size:20px;
}
*/


/*
==============================================
CSS3 ANIMATION CHEAT SHEET
==============================================

Made by Justin Aguilar

www.justinaguilar.com/animations/

Questions, comments, concerns, love letters:
justin@justinaguilar.com
==============================================
*/

/*
==============================================
slideDown
==============================================
*/


.slideDown{
	animation-name: slideDown;
	-webkit-animation-name: slideDown;	

	animation-duration: 1s;	
	-webkit-animation-duration: 1s;

	animation-timing-function: ease;	
	-webkit-animation-timing-function: ease;	

	visibility: visible !important;						
}

@keyframes slideDown {
	0% {
		transform: translateY(-100%);
	}
	50%{
		transform: translateY(8%);
	}
	65%{
		transform: translateY(-4%);
	}
	80%{
		transform: translateY(4%);
	}
	95%{
		transform: translateY(-2%);
	}			
	100% {
		transform: translateY(0%);
	}		
}

@-webkit-keyframes slideDown {
	0% {
		-webkit-transform: translateY(-100%);
	}
	50%{
		-webkit-transform: translateY(8%);
	}
	65%{
		-webkit-transform: translateY(-4%);
	}
	80%{
		-webkit-transform: translateY(4%);
	}
	95%{
		-webkit-transform: translateY(-2%);
	}			
	100% {
		-webkit-transform: translateY(0%);
	}	
}

/*
==============================================
slideUp
==============================================
*/


.slideUp{
	animation-name: slideUp;
	-webkit-animation-name: slideUp;	

	animation-duration: 1s;	
	-webkit-animation-duration: 1s;

	animation-timing-function: ease;	
	-webkit-animation-timing-function: ease;

	visibility: visible !important;			
}

@keyframes slideUp {
	0% {
		transform: translateY(100%);
	}
	50%{
		transform: translateY(-8%);
	}
	65%{
		transform: translateY(4%);
	}
	80%{
		transform: translateY(-4%);
	}
	95%{
		transform: translateY(2%);
	}			
	100% {
		transform: translateY(0%);
	}	
}

@-webkit-keyframes slideUp {
	0% {
		-webkit-transform: translateY(100%);
	}
	50%{
		-webkit-transform: translateY(-8%);
	}
	65%{
		-webkit-transform: translateY(4%);
	}
	80%{
		-webkit-transform: translateY(-4%);
	}
	95%{
		-webkit-transform: translateY(2%);
	}			
	100% {
		-webkit-transform: translateY(0%);
	}	
}

/*
==============================================
slideLeft
==============================================
*/


.slideLeft{
	animation-name: slideLeft;
	-webkit-animation-name: slideLeft;	

	animation-duration: 1s;	
	-webkit-animation-duration: 1s;

	animation-timing-function: ease-in-out;	
	-webkit-animation-timing-function: ease-in-out;		

	visibility: visible !important;	
}

@keyframes slideLeft {
	0% {
		transform: translateX(150%);
	}
	50%{
		transform: translateX(-8%);
	}
	65%{
		transform: translateX(4%);
	}
	80%{
		transform: translateX(-4%);
	}
	95%{
		transform: translateX(2%);
	}			
	100% {
		transform: translateX(0%);
	}
}

@-webkit-keyframes slideLeft {
	0% {
		-webkit-transform: translateX(150%);
	}
	50%{
		-webkit-transform: translateX(-8%);
	}
	65%{
		-webkit-transform: translateX(4%);
	}
	80%{
		-webkit-transform: translateX(-4%);
	}
	95%{
		-webkit-transform: translateX(2%);
	}			
	100% {
		-webkit-transform: translateX(0%);
	}
}

/*
==============================================
slideRight
==============================================
*/


.slideRight{
	animation-name: slideRight;
	-webkit-animation-name: slideRight;	

	animation-duration: 1s;	
	-webkit-animation-duration: 1s;

	animation-timing-function: ease-in-out;	
	-webkit-animation-timing-function: ease-in-out;		

	visibility: visible !important;	
}

@keyframes slideRight {
	0% {
		transform: translateX(-150%);
	}
	50%{
		transform: translateX(8%);
	}
	65%{
		transform: translateX(-4%);
	}
	80%{
		transform: translateX(4%);
	}
	95%{
		transform: translateX(-2%);
	}			
	100% {
		transform: translateX(0%);
	}	
}

@-webkit-keyframes slideRight {
	0% {
		-webkit-transform: translateX(-150%);
	}
	50%{
		-webkit-transform: translateX(8%);
	}
	65%{
		-webkit-transform: translateX(-4%);
	}
	80%{
		-webkit-transform: translateX(4%);
	}
	95%{
		-webkit-transform: translateX(-2%);
	}			
	100% {
		-webkit-transform: translateX(0%);
	}
}

/*
==============================================
slideExpandUp
==============================================
*/


.slideExpandUp{
	animation-name: slideExpandUp;
	-webkit-animation-name: slideExpandUp;	

	animation-duration: 1.6s;	
	-webkit-animation-duration: 1.6s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease -out;

	visibility: visible !important;	
}

@keyframes slideExpandUp {
	0% {
		transform: translateY(100%) scaleX(0.5);
	}
	30%{
		transform: translateY(-8%) scaleX(0.5);
	}	
	40%{
		transform: translateY(2%) scaleX(0.5);
	}
	50%{
		transform: translateY(0%) scaleX(1.1);
	}
	60%{
		transform: translateY(0%) scaleX(0.9);		
	}
	70% {
		transform: translateY(0%) scaleX(1.05);
	}			
	80%{
		transform: translateY(0%) scaleX(0.95);		
	}
	90% {
		transform: translateY(0%) scaleX(1.02);
	}	
	100%{
		transform: translateY(0%) scaleX(1);		
	}
}

@-webkit-keyframes slideExpandUp {
	0% {
		-webkit-transform: translateY(100%) scaleX(0.5);
	}
	30%{
		-webkit-transform: translateY(-8%) scaleX(0.5);
	}	
	40%{
		-webkit-transform: translateY(2%) scaleX(0.5);
	}
	50%{
		-webkit-transform: translateY(0%) scaleX(1.1);
	}
	60%{
		-webkit-transform: translateY(0%) scaleX(0.9);		
	}
	70% {
		-webkit-transform: translateY(0%) scaleX(1.05);
	}			
	80%{
		-webkit-transform: translateY(0%) scaleX(0.95);		
	}
	90% {
		-webkit-transform: translateY(0%) scaleX(1.02);
	}	
	100%{
		-webkit-transform: translateY(0%) scaleX(1);		
	}
}

/*
==============================================
expandUp
==============================================
*/


.expandUp{
	animation-name: expandUp;
	-webkit-animation-name: expandUp;	

	animation-duration: 0.7s;	
	-webkit-animation-duration: 0.7s;

	animation-timing-function: ease;	
	-webkit-animation-timing-function: ease;		

	visibility: visible !important;	
}

@keyframes expandUp {
	0% {
		transform: translateY(100%) scale(0.6) scaleY(0.5);
	}
	60%{
		transform: translateY(-7%) scaleY(1.12);
	}
	75%{
		transform: translateY(3%);
	}	
	100% {
		transform: translateY(0%) scale(1) scaleY(1);
	}	
}

@-webkit-keyframes expandUp {
	0% {
		-webkit-transform: translateY(100%) scale(0.6) scaleY(0.5);
	}
	60%{
		-webkit-transform: translateY(-7%) scaleY(1.12);
	}
	75%{
		-webkit-transform: translateY(3%);
	}	
	100% {
		-webkit-transform: translateY(0%) scale(1) scaleY(1);
	}	
}

/*
==============================================
fadeIn
==============================================
*/

.fadeIn{
	animation-name: fadeIn;
	-webkit-animation-name: fadeIn;	

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-timing-function: ease-in-out;	
	-webkit-animation-timing-function: ease-in-out;		

	visibility: visible !important;	
}

@keyframes fadeIn {
	0% {
		transform: scale(0);
		opacity: 0.0;		
	}
	60% {
		transform: scale(1.1);	
	}
	80% {
		transform: scale(0.9);
		opacity: 1;	
	}	
	100% {
		transform: scale(1);
		opacity: 1;	
	}		
}

@-webkit-keyframes fadeIn {
	0% {
		-webkit-transform: scale(0);
		opacity: 0.0;		
	}
	60% {
		-webkit-transform: scale(1.1);
	}
	80% {
		-webkit-transform: scale(0.9);
		opacity: 1;	
	}	
	100% {
		-webkit-transform: scale(1);
		opacity: 1;	
	}		
}

/*
==============================================
expandOpen
==============================================
*/


.expandOpen{
	animation-name: expandOpen;
	-webkit-animation-name: expandOpen;	

	animation-duration: 1.2s;	
	-webkit-animation-duration: 1.2s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease-out;	

	visibility: visible !important;	
}

@keyframes expandOpen {
	0% {
		transform: scale(1.8);		
	}
	50% {
		transform: scale(0.95);
	}	
	80% {
		transform: scale(1.05);
	}
	90% {
		transform: scale(0.98);
	}	
	100% {
		transform: scale(1);
	}			
}

@-webkit-keyframes expandOpen {
	0% {
		-webkit-transform: scale(1.8);		
	}
	50% {
		-webkit-transform: scale(0.95);
	}	
	80% {
		-webkit-transform: scale(1.05);
	}
	90% {
		-webkit-transform: scale(0.98);
	}	
	100% {
		-webkit-transform: scale(1);
	}					
}

/*
==============================================
bigEntrance
==============================================
*/


.bigEntrance{
	animation-name: bigEntrance;
	-webkit-animation-name: bigEntrance;	

	animation-duration: 1.6s;	
	-webkit-animation-duration: 1.6s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease-out;	

	visibility: visible !important;			
}

@keyframes bigEntrance {
	0% {
		transform: scale(0.3) rotate(6deg) translateX(-30%) translateY(30%);
		opacity: 0.2;
	}
	30% {
		transform: scale(1.03) rotate(-2deg) translateX(2%) translateY(-2%);		
		opacity: 1;
	}
	45% {
		transform: scale(0.98) rotate(1deg) translateX(0%) translateY(0%);
		opacity: 1;
	}
	60% {
		transform: scale(1.01) rotate(-1deg) translateX(0%) translateY(0%);		
		opacity: 1;
	}	
	75% {
		transform: scale(0.99) rotate(1deg) translateX(0%) translateY(0%);
		opacity: 1;
	}
	90% {
		transform: scale(1.01) rotate(0deg) translateX(0%) translateY(0%);		
		opacity: 1;
	}	
	100% {
		transform: scale(1) rotate(0deg) translateX(0%) translateY(0%);
		opacity: 1;
	}		
}

@-webkit-keyframes bigEntrance {
	0% {
		-webkit-transform: scale(0.3) rotate(6deg) translateX(-30%) translateY(30%);
		opacity: 0.2;
	}
	30% {
		-webkit-transform: scale(1.03) rotate(-2deg) translateX(2%) translateY(-2%);		
		opacity: 1;
	}
	45% {
		-webkit-transform: scale(0.98) rotate(1deg) translateX(0%) translateY(0%);
		opacity: 1;
	}
	60% {
		-webkit-transform: scale(1.01) rotate(-1deg) translateX(0%) translateY(0%);		
		opacity: 1;
	}	
	75% {
		-webkit-transform: scale(0.99) rotate(1deg) translateX(0%) translateY(0%);
		opacity: 1;
	}
	90% {
		-webkit-transform: scale(1.01) rotate(0deg) translateX(0%) translateY(0%);		
		opacity: 1;
	}	
	100% {
		-webkit-transform: scale(1) rotate(0deg) translateX(0%) translateY(0%);
		opacity: 1;
	}				
}

/*
==============================================
hatch
==============================================
*/

.hatch{
	animation-name: hatch;
	-webkit-animation-name: hatch;	

	animation-duration: 2s;	
	-webkit-animation-duration: 2s;

	animation-timing-function: ease-in-out;	
	-webkit-animation-timing-function: ease-in-out;

	transform-origin: 50% 100%;
	-ms-transform-origin: 50% 100%;
	-webkit-transform-origin: 50% 100%; 

	visibility: visible !important;		
}

@keyframes hatch {
	0% {
		transform: rotate(0deg) scaleY(0.6);
	}
	20% {
		transform: rotate(-2deg) scaleY(1.05);
	}
	35% {
		transform: rotate(2deg) scaleY(1);
	}
	50% {
		transform: rotate(-2deg);
	}	
	65% {
		transform: rotate(1deg);
	}	
	80% {
		transform: rotate(-1deg);
	}		
	100% {
		transform: rotate(0deg);
	}									
}

@-webkit-keyframes hatch {
	0% {
		-webkit-transform: rotate(0deg) scaleY(0.6);
	}
	20% {
		-webkit-transform: rotate(-2deg) scaleY(1.05);
	}
	35% {
		-webkit-transform: rotate(2deg) scaleY(1);
	}
	50% {
		-webkit-transform: rotate(-2deg);
	}	
	65% {
		-webkit-transform: rotate(1deg);
	}	
	80% {
		-webkit-transform: rotate(-1deg);
	}		
	100% {
		-webkit-transform: rotate(0deg);
	}		
}


/*
==============================================
bounce
==============================================
*/


.bounce{
	animation-name: bounce;
	-webkit-animation-name: bounce;	

	animation-duration: 1.6s;	
	-webkit-animation-duration: 1.6s;

	animation-timing-function: ease;	
	-webkit-animation-timing-function: ease;	
	
	transform-origin: 50% 100%;
	-ms-transform-origin: 50% 100%;
	-webkit-transform-origin: 50% 100%; 	
}

@keyframes bounce {
	0% {
		transform: translateY(0%) scaleY(0.6);
	}
	60%{
		transform: translateY(-100%) scaleY(1.1);
	}
	70%{
		transform: translateY(0%) scaleY(0.95) scaleX(1.05);
	}
	80%{
		transform: translateY(0%) scaleY(1.05) scaleX(1);
	}	
	90%{
		transform: translateY(0%) scaleY(0.95) scaleX(1);
	}				
	100%{
		transform: translateY(0%) scaleY(1) scaleX(1);
	}	
}

@-webkit-keyframes bounce {
	0% {
		-webkit-transform: translateY(0%) scaleY(0.6);
	}
	60%{
		-webkit-transform: translateY(-100%) scaleY(1.1);
	}
	70%{
		-webkit-transform: translateY(0%) scaleY(0.95) scaleX(1.05);
	}
	80%{
		-webkit-transform: translateY(0%) scaleY(1.05) scaleX(1);
	}	
	90%{
		-webkit-transform: translateY(0%) scaleY(0.95) scaleX(1);
	}				
	100%{
		-webkit-transform: translateY(0%) scaleY(1) scaleX(1);
	}		
}


/*
==============================================
pulse
==============================================
*/

.pulse{
	animation-name: pulse;
	-webkit-animation-name: pulse;	

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}

@keyframes pulse {
	0% {
		transform: scale(0.9);
		opacity: 0.7;		
	}
	50% {
		transform: scale(1);
		opacity: 1;	
	}	
	100% {
		transform: scale(0.9);
		opacity: 0.7;	
	}			
}

@-webkit-keyframes pulse {
	0% {
		-webkit-transform: scale(0.95);
		opacity: 0.7;		
	}
	50% {
		-webkit-transform: scale(1);
		opacity: 1;	
	}	
	100% {
		-webkit-transform: scale(0.95);
		opacity: 0.7;	
	}			
}

/*
==============================================
floating
==============================================
*/

.floating{
	animation-name: floating;
	-webkit-animation-name: floating;

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}

@keyframes floating {
	0% {
		transform: translateY(0%);	
	}
	50% {
		transform: translateY(8%);	
	}	
	100% {
		transform: translateY(0%);
	}			
}

@-webkit-keyframes floating {
	0% {
		-webkit-transform: translateY(0%);	
	}
	50% {
		-webkit-transform: translateY(8%);	
	}	
	100% {
		-webkit-transform: translateY(0%);
	}			
}

/*
==============================================
tossing
==============================================
*/

.tossing{
	animation-name: tossing;
	-webkit-animation-name: tossing;	

	animation-duration: 2.5s;	
	-webkit-animation-duration: 2.5s;

	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
}

@keyframes tossing {
	0% {
		transform: rotate(-4deg);	
	}
	50% {
		transform: rotate(4deg);
	}
	100% {
		transform: rotate(-4deg);	
	}						
}

@-webkit-keyframes tossing {
	0% {
		-webkit-transform: rotate(-4deg);	
	}
	50% {
		-webkit-transform: rotate(4deg);
	}
	100% {
		-webkit-transform: rotate(-4deg);	
	}				
}

/*
==============================================
pullUp
==============================================
*/

.pullUp{
	animation-name: pullUp;
	-webkit-animation-name: pullUp;	

	animation-duration: 1.1s;	
	-webkit-animation-duration: 1.1s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease-out;	

	transform-origin: 50% 100%;
	-ms-transform-origin: 50% 100%;
	-webkit-transform-origin: 50% 100%; 		
}

@keyframes pullUp {
	0% {
		transform: scaleY(0.1);
	}
	40% {
		transform: scaleY(1.02);
	}
	60% {
		transform: scaleY(0.98);
	}
	80% {
		transform: scaleY(1.01);
	}
	100% {
		transform: scaleY(0.98);
	}				
	80% {
		transform: scaleY(1.01);
	}
	100% {
		transform: scaleY(1);
	}							
}

@-webkit-keyframes pullUp {
	0% {
		-webkit-transform: scaleY(0.1);
	}
	40% {
		-webkit-transform: scaleY(1.02);
	}
	60% {
		-webkit-transform: scaleY(0.98);
	}
	80% {
		-webkit-transform: scaleY(1.01);
	}
	100% {
		-webkit-transform: scaleY(0.98);
	}				
	80% {
		-webkit-transform: scaleY(1.01);
	}
	100% {
		-webkit-transform: scaleY(1);
	}		
}

/*
==============================================
pullDown
==============================================
*/

.pullDown{
	animation-name: pullDown;
	-webkit-animation-name: pullDown;	

	animation-duration: 1.1s;	
	-webkit-animation-duration: 1.1s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease-out;	

	transform-origin: 50% 0%;
	-ms-transform-origin: 50% 0%;
	-webkit-transform-origin: 50% 0%; 		
}

@keyframes pullDown {
	0% {
		transform: scaleY(0.1);
	}
	40% {
		transform: scaleY(1.02);
	}
	60% {
		transform: scaleY(0.98);
	}
	80% {
		transform: scaleY(1.01);
	}
	100% {
		transform: scaleY(0.98);
	}				
	80% {
		transform: scaleY(1.01);
	}
	100% {
		transform: scaleY(1);
	}							
}

@-webkit-keyframes pullDown {
	0% {
		-webkit-transform: scaleY(0.1);
	}
	40% {
		-webkit-transform: scaleY(1.02);
	}
	60% {
		-webkit-transform: scaleY(0.98);
	}
	80% {
		-webkit-transform: scaleY(1.01);
	}
	100% {
		-webkit-transform: scaleY(0.98);
	}				
	80% {
		-webkit-transform: scaleY(1.01);
	}
	100% {
		-webkit-transform: scaleY(1);
	}		
}

/*
==============================================
stretchLeft
==============================================
*/

.stretchLeft{
	animation-name: stretchLeft;
	-webkit-animation-name: stretchLeft;	

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease-out;	

	transform-origin: 100% 0%;
	-ms-transform-origin: 100% 0%;
	-webkit-transform-origin: 100% 0%; 
}

@keyframes stretchLeft {
	0% {
		transform: scaleX(0.3);
	}
	40% {
		transform: scaleX(1.02);
	}
	60% {
		transform: scaleX(0.98);
	}
	80% {
		transform: scaleX(1.01);
	}
	100% {
		transform: scaleX(0.98);
	}				
	80% {
		transform: scaleX(1.01);
	}
	100% {
		transform: scaleX(1);
	}							
}

@-webkit-keyframes stretchLeft {
	0% {
		-webkit-transform: scaleX(0.3);
	}
	40% {
		-webkit-transform: scaleX(1.02);
	}
	60% {
		-webkit-transform: scaleX(0.98);
	}
	80% {
		-webkit-transform: scaleX(1.01);
	}
	100% {
		-webkit-transform: scaleX(0.98);
	}				
	80% {
		-webkit-transform: scaleX(1.01);
	}
	100% {
		-webkit-transform: scaleX(1);
	}		
}

/*
==============================================
stretchRight
==============================================
*/

.stretchRight{
	animation-name: stretchRight;
	-webkit-animation-name: stretchRight;	

	animation-duration: 1.5s;	
	-webkit-animation-duration: 1.5s;

	animation-timing-function: ease-out;	
	-webkit-animation-timing-function: ease-out;	

	transform-origin: 0% 0%;
	-ms-transform-origin: 0% 0%;
	-webkit-transform-origin: 0% 0%; 		
}

@keyframes stretchRight {
	0% {
		transform: scaleX(0.3);
	}
	40% {
		transform: scaleX(1.02);
	}
	60% {
		transform: scaleX(0.98);
	}
	80% {
		transform: scaleX(1.01);
	}
	100% {
		transform: scaleX(0.98);
	}				
	80% {
		transform: scaleX(1.01);
	}
	100% {
		transform: scaleX(1);
	}							
}

@-webkit-keyframes stretchRight {
	0% {
		-webkit-transform: scaleX(0.3);
	}
	40% {
		-webkit-transform: scaleX(1.02);
	}
	60% {
		-webkit-transform: scaleX(0.98);
	}
	80% {
		-webkit-transform: scaleX(1.01);
	}
	100% {
		-webkit-transform: scaleX(0.98);
	}				
	80% {
		-webkit-transform: scaleX(1.01);
	}
	100% {
		-webkit-transform: scaleX(1);
	}		
}