body{
	margin: 0;
	color: #fff;
}
h1,p{margin:0;}
.top{/*	height: 500vh;*/}
.top_layer{
	width: 100vw;
	height: 100vh;
	position: fixed;
	top: 0;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	animation-timing-function: ease-in-out;
/*	animation-timeline: scroll();*/
	animation-duration: 8s;
	animation-delay: 5s;  
	animation-fill-mode: both;
}
h1{margin-top: -5vw;}
.top_layer-1{animation-name: top_layer-1;}
@keyframes top_layer-1{to{scale: 1.3;}}
.top_layer-2{
	animation-name: top_layer-2;
	/*animation-timing-function: ease-out;	*/
	animation-duration: 100s;
}
@keyframes top_layer-2{to{scale: 5;}}
.top_layer-3{
	animation-name: top_layer-3;
	display: flex;
	justify-content: center;
	align-items: center;
}
@keyframes top_layer-3{to{scale: 1.8;}}
.top_layer-4{
    animation-name: top_layer-4;
	animation-delay: 2s;
}
@keyframes top_layer-4{to{scale: 3;}}
/*.top_layer-5{animation-name: top_layer-5;}*/
@keyframes top_layer-5{to{scale: 2.5;}}
.top_text{
	text-align: center;
	position: relative;
	z-index: 5;
	animation-name: text;
	animation-duration: 3s;
	animation-delay: 8s;
	animation-timing-function: linear;
	animation-fill-mode: both;	
	opacity: 0;
}
@keyframes text{to{opacity: 1}}
.title{
	text-transform: uppercase;
	font-size: 5vw;
}
.text{font-size: 2vw;}
.bottom{
	position: fixed;
	right: 0;
	left: 0;
	bottom: 8vw;
	z-index: 50;
	text-align: center;
	animation-name: text;
	animation-duration: 1s;
	animation-delay: 10s;
	animation-timing-function: linear;
	animation-fill-mode: both;	
	opacity: 0;
}
.bottom_link{
    padding:1vw 2vw;
    border: 0.01vw solid #fff;
    border-radius: 10%;
	font-size: 2vw;
	font-weight: 800;
	color: #fff;
	transition: 0.3s ease;
	text-decoration: none;	
}
.bottom_link:hover{
	text-decoration: none;
	background-color: rgba(255,255,255,0.1);
}

 @media screen and (orientation:portrait) {
    .bottom_link{
        padding:1.5vw 2.5vw;
	    font-size: 5vw;
    } 
}