/*
 * Ported from the vendor parent theme:
 * wp-content/themes/photome/css/animation.css (ThemeGoods "Photome" v5.7.2).
 * Confirmed live: wp_enqueue_style("animation.css", .../css/animation.css", ...)
 * unconditionally on every front-end page load (functions.php,
 * pp_enqueue_front_page_scripts()).
 *
 * NOT MODERNIZED, deliberately: read in full (424 lines). Every rule in this
 * file is a @keyframes block or an `animation-*` / transform property
 * (translateX/translateY/scale). None of the three modernization techniques
 * this porting pass looked for apply here - there is no margin-left/right,
 * padding-left/right, border-left/right, text-align, or bare left/right
 * position property anywhere in the file (nothing to turn into a logical
 * property), no repeated hardcoded color (nothing to turn into a custom
 * property - this file has no color declarations at all), and no
 * display:flex/grid layout with margin-based gutters (nothing to turn into
 * `gap`). Ported unchanged other than this citation comment.
 */
@keyframes subNavIn{
	from{
		transform: translateX(180px);
		-webkit-transform: translateX(180px);
		opacity: 0;
	}
	to{
		transform: translateX(0px);
		-webkit-transform: translateX(0px);
		opacity: 1;
	}
}

@-webkit-keyframes subNavIn{
	from{
		transform: translateX(180px);
		-webkit-transform: translateX(180px);
		opacity: 0;
	}
	to{
		transform: translateX(0px);
		-webkit-transform: translateX(0px);
		opacity: 1;
	}
}

@keyframes subNavOut{
	from{
		transform: translateX(0px);
		-webkit-transform: translateX(0px);
		opacity: 1;
	}
	to{
		transform: translateX(180px);
		-webkit-transform: translateX(180px);
		opacity: 0;
	}
}

@-webkit-keyframes subNavOut{
	from{
		transform: translateX(0px);
		-webkit-transform: translateX(0px);
		opacity: 1;
	}
	to{
		transform: translateX(180px);
		-webkit-transform: translateX(180px);
		opacity: 0;
	}
}

@keyframes mainNavOut{
	from{
		transform: translateX(0px);
		-webkit-transform: translateX(0px);
		opacity: 1;
	}
	to{
		transform: translateX(-180px);
		-webkit-transform: translateX(-180px);
		opacity: 0;
	}
}

@-webkit-keyframes mainNavOut{
	from{
		transform: translateX(0px);
		-webkit-transform: translateX(0px);
		opacity: 1;
	}
	to{
		transform: translateX(-180px);
		-webkit-transform: translateX(-180px);
		opacity: 0;
	}
}

@keyframes mainNavIn{
	from{
		transform: translateX(-180px);
		-webkit-transform: translateX(-180px);
		opacity: 0;
	}
	to{
		transform: translateX(0px);
		-webkit-transform: translateX(0px);
		opacity: 1;
	}
}

@-webkit-keyframes mainNavIn{
	from{
		transform: translateX(-180px);
		-webkit-transform: translateX(-180px);
		opacity: 0;
	}
	to{
		transform: translateX(0px);
		-webkit-transform: translateX(0px);
		opacity: 1;
	}
}

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

	animation-duration: 0.5s;	
	-webkit-animation-duration: 0.5s;

	animation-timing-function: ease-in-out;	
	-webkit-animation-timing-function: ease-in-out;
	
	-webkit-animation-fill-mode:forwards; 
    -moz-animation-fill-mode:forwards;
    animation-fill-mode:forwards;

	visibility: visible !important;
	display: inline-block !important;
}

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

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

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

	animation-duration: 0.5s;	
	-webkit-animation-duration: 0.5s;

	animation-timing-function: ease;	
	-webkit-animation-timing-function: ease;
	
	-webkit-animation-fill-mode:forwards; 
    -moz-animation-fill-mode:forwards;
    -ms-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
    
    visibility: visible !important;	
}

@keyframes slideUp {
	0% {
		opacity: 0;
		visibility: hidden;
		transform: translateY(10%);
	}
	100% {
		opacity: 1;
		visibility: visible;
		transform: translateY(0%);
	}	
}

@-webkit-keyframes slideUp {
	0% {
		opacity: 0;
		visibility: hidden;
		-webkit-transform: translateY(10%);
	}
	100% {
		opacity: 1;
		visibility: visible;
		-webkit-transform: translateY(0%);
	}	
}

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

    animation-duration: 0.2s;	
    -webkit-animation-duration: 0.2s;

    animation-timing-function: ease;	
    -webkit-animation-timing-function: ease;
    
    -webkit-animation-fill-mode:forwards; 
    -moz-animation-fill-mode:forwards;
    -ms-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
}

@keyframes slideUp2 {
    0% {
    	opacity: 0;
    	transform: translateY(15%);
    }
    100% {
    	opacity: 1;
    	transform: translateY(0%);
    }	
}

@-webkit-keyframes slideUp2 {
    0% {
    	opacity: 0;
    	transform: translateY(15%);
    }
    100% {
    	opacity: 1;
    	transform: translateY(0%);
    }	
}

.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% {
		opacity: 0;
		transform: translateY(-100%);
	}			
	100% {
		opacity: 1;
		transform: translateY(0%);
	}		
}

@-webkit-keyframes slideDown {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-100%);
	}			
	100% {
		opacity: 1;
		-webkit-transform: translateY(0%);
	}	
}

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

	animation-duration: 0.2s;	
	-webkit-animation-duration: 0.2s;

	animation-timing-function: ease;	
	-webkit-animation-timing-function: ease;	
	
	visibility: visible !important;
	display: inline-block !important;				
}

@keyframes slideDown2 {
	0% {
		opacity: 0;
		transform: translateY(-50%);
	}			
	100% {
		opacity: 1;
		transform: translateY(0%);
	}		
}

@-webkit-keyframes slideDown {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-50%);
	}			
	100% {
		opacity: 1;
		-webkit-transform: translateY(0%);
	}	
}

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

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

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

	visibility: visible !important;			
}

@keyframes bigEntrance {
	0% {
		transform: scale(0.5);
		opacity: 0.5;
	}
	30% {
		transform: scale(1.03);		
		opacity: 1 !important;
	}
	45% {
		transform: scale(0.98);
		opacity: 1 !important;
	}
	60% {
		transform: scale(1.01);		
		opacity: 1 !important;
	}	
	100% {
		transform: scale(1);
		opacity: 1 !important;
	}		
}

@-webkit-keyframes bigEntrance {
	0% {
		-webkit-transform: scale(0.5);
		opacity: 0.5;
	}
	30% {
		-webkit-transform: scale(1.03);		
		opacity: 1 !important;
	}
	45% {
		-webkit-transform: scale(0.98);
		opacity: 1 !important;
	}
	60% {
		-webkit-transform: scale(1.01);		
		opacity: 1 !important;
	}	
	100% {
		-webkit-transform: scale(1);
		opacity: 1 !important;
	}				
}

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

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

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

	visibility: visible !important;	
}

@keyframes slideLeft {
	0% {
		transform: translateX(10%);
		opacity: 0;
	}		
	100% {
		transform: translateX(0%);
		opacity: 1 !important;
	}
}

@-webkit-keyframes slideLeft {
	0% {
		-webkit-transform: translateX(10%);
		opacity: 0;
	}			
	100% {
		-webkit-transform: translateX(0%);
		opacity: 1 !important;
	}
}

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

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

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

	visibility: visible !important;	
}

@keyframes slideRight {
	0% {
		opacity: 0;
		transform: translateX(-10%);
	}		
	100% {
		transform: translateX(0%);
		opacity: 1 !important;
	}	
}

@-webkit-keyframes slideRight {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-10%);
	}		
	100% {
		-webkit-transform: translateX(0%);
		opacity: 1 !important;
	}
}