﻿@charset "utf-8";

@keyframes fedein1 {
  0% { opacity:0;}
  30% { opacity:0;}
  99% { opacity:1;}
  100% { opacity:1;}
}
@keyframes fedein2 {
	0% { transform:translateX(-40px) ; opacity:0 ;}
	99% { transform:translateX(0px); opacity:1;}
	100% { transform:translateX(0px); opacity:1;}
  }
@keyframes popup {
  0% { transform:translateY(-20px) ; opacity:0 ;}
  60% { transform:translateY(3px); opacity:1;}
  99% { transform:translateY(0px); opacity:1;}
  100% { transform:translateY(0px); opacity:1;}
}
@keyframes ups {
  0% { transform:translateY(20px) ; opacity:0 ;}
  99% { transform:translateY(0px); opacity:1;}
  100% { transform:translateY(0px); opacity:1;}
}	
@media screen {
	.popup{
		opacity:0 ;
		transform:translateY(-20px)
	}
	.once.popup{
		animation:popup 1.4s forwards;
	}
	.ups{
		opacity:0 ;
		transform:translateY(-20px);
	}
	.once.ups{
		animation:ups 1.4s forwards;
	}
	.once.popups{
		animation:none;
		opacity:1 ;
		transform:translateY(0)
	}
	.popups > *{
		opacity:0;
		transform:translateY(-20px);
	}
	.once.popups > *{
		animation:popup 1.4s forwards;
	}
	.upses > *{
		opacity:0 ;
		transform:translateY(-20px);
	}
	.once.upses > *{
		animation:ups 1.4s forwards;
	}
	.once.popups > *:nth-child(2){ animation-delay: 0.2s;}
	.once.popups > *:nth-child(3){ animation-delay: 0.4s;}
	.once.popups > *:nth-child(4){ animation-delay: 0.6s;}
	.once.popups > *:nth-child(5){ animation-delay: 0.8s;}
	.once.popups > *:nth-child(6){ animation-delay: 1.0s;}
	.once.popups > *:nth-child(7){ animation-delay: 1.2s;}
	.once.popups > *:nth-child(8){ animation-delay: 1.4s;}
	.once.popups > *:nth-child(9){ animation-delay: 1.6s;}
	.once.popups > *:nth-child(10){ animation-delay: 1.8s;}
	.feder,
	.feder_left,
	.feder_row{
		opacity:0 ;
	}
	.once.feder{
		animation:fedein1 1.2s forwards;
	}
	.once.feder_left{
		animation:fedein2 1.6s forwards;
	}
	.once.feder_row{
		animation:fedein1 2.0s ease-out forwards;
	}
	.feders > *{
		opacity:0 ;
	}
	.once.feders > *{
		animation:fedein1 1.8s forwards;
	}
	.once.delay_set > *:nth-child(2),
	.once.delay_1{ animation-delay: 0.2s;}
	.once.delay_set > *:nth-child(3),
	.once.delay_2{ animation-delay: 0.4s;}
	.once.delay_set > *:nth-child(4),
	.once.delay_3{ animation-delay: 0.6s;}
	.once.delay_set > *:nth-child(5),
	.once.delay_4{ animation-delay: 0.8s;}
	.once.delay_set > *:nth-child(6),
	.once.delay_5{ animation-delay: 1.0s;}
	.once.delay_set > *:nth-child(7),
	.once.delay_6{ animation-delay: 1.2s;}
	.once.delay_set > *:nth-child(8),
	.once.delay_7{ animation-delay: 1.4s;}
	.once.delay_set > *:nth-child(9),
	.once.delay_8{ animation-delay: 1.6s;}
	.once.delay_set > *:nth-child(10),
	.once.delay_9{ animation-delay: 1.8s;}
	.once.delay_set > *:nth-child(11),
	.once.delay_10{ animation-delay: 2.0s;}
	.vertical_open,
	.holizon_open,
	.bg_flash,
	.bg_blackout{
		position:relative;
		overflow:hidden;
	}
	.vertical_open:before,
	.vertical_open:after,
	.holizon_open:before,
	.holizon_open:after,
	.bg_blackout:before{
		content:"";
		width:100%;
		height:100%;
		z-index: 999;
		background: #69ba00;
		display:block;
		position:absolute;
		left:0;
		right:0;
		top:0;
		transition:height .2s;
	}
	.vertical_open:after{
		top:auto;
		bottom:0;
	}
	.vertical_open.once:before,
	.vertical_open.once:after{
		height:0;
	}
	.holizon_open:before,
	.holizon_open:after{
		bottom:0;
		right:0;
		left:auto;
		transition:width .4s .2s ease-out;
	}
	.holizon_open:after{
		left:0;
		right:auto;
	}
	.holizon_open.once:before,
	.holizon_open.once:after{
		width:0;
	}
}


