@charset "utf-8";


#scrollBox .bgimg.centerFix
{
	background-position: center;
	background-size: 100% auto;
	background-attachment: fixed;
	transition: none;
}

#scrollBox .bgimg.bottom2top
{
	background-position: center bottom;
	background-size: 100% auto;
}

#scrollBox .bgimg.bottom2top.on
{
	background-position: center top;
}

#scrollBox .bgimg.bottom2center
{
	background-position: center bottom;
	background-size: 100% auto;
}
#scrollBox .bgimg.bottom2center.on
{
	background-position: center center;
}

#scrollBox .bgimg.top2bottom
{
	background-position: center top;
	background-size: 100% auto;
}

#scrollBox .bgimg.top2bottom.on
{
	background-position: center bottom;
}


@keyframes up {
    from {
		bottom: -400px;
    }
    to {
		bottom: 0;
    }
}

@keyframes drop {
    from {
		top: -400px;
    }
    to {
		top: 0;
    }
}

@keyframes left {
    from {
		right: -200px;
    }
    to {
		right: 0;
    }
}

@keyframes right {
    from {
		left: -800px;
    }
    to {
		left: 0;
    }
}

#scrollBox div.headline h1 em:nth-child(3){
	bottom: -400px;
    animation-name: up;
    animation-duration: 1.6s;
	animation-timing-function: ease-out;
	animation-fill-mode: forwards;
}

#scrollBox div.headline h1 em i:nth-child(1){
	left: -800px;
    animation-name: right;
    animation-duration: 2.6s;
	animation-timing-function: ease-out;
	animation-fill-mode: forwards;
    animation-delay: .2s;
}

#scrollBox div.headline h1 em:nth-child(1){
	top: -400px;
    animation-name: drop;
    animation-duration: 1.6s;
	animation-timing-function: ease-out;
	animation-fill-mode: forwards;
    animation-delay: .6s;
}

#scrollBox div.headline h1 em i:nth-child(2){
	right: -200px;
    animation-name: left;
    animation-duration: 1.6s;
	animation-timing-function: ease-out;
	animation-fill-mode: forwards;
    animation-delay: .8s;
}
