@import url(https://fonts.googleapis.com/css?family=Roboto:400,300);

html, body{
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
	overflow: hidden;
}

.container{
	position: relative;
	width: 100%;
	height: 100%;
	background: url('pliki/background.jpg');
	background-position: 0 0;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
	background-size: cover;
}

.header{
	text-align: center;
}

.saelic_logo{
	position: relative;
}

@keyframes logo_fade {
    0%   {opacity: 0;}
    100%  {opacity: 1;}
}

.saelic_logo img{
	width: 35%;
	opacity: 1;
	animation-name: logo_fade;
    animation-duration: 2s;
}

.coming_soon{
	display: inline-block;
	font-size: 1.3vw;
	text-transform: uppercase;
	text-decoration: none;
	color: #fff;
}

.coming_soon span{
	font-size: 1.4vw;
	transition: 0.3s margin-left;
}

.coming_soon:hover span{
	margin-left: 10px;
}

.footer{
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	width: 50%;
	margin: 0 auto;
}

@keyframes logo_slide {
    0%   {margin-bottom: -100px; opacity: 0;}
    100%  {margin-bottom: 0; opacity: 1;}
}

.footer a{
	float: left;
	width: 33.33%;
	opacity: 1;
	animation-name: logo_slide;
    animation-duration: 2s;
}

.footer a:nth-child(1){
	margin-bottom: 0;
}

.footer a:nth-child(2){
	display: block;
	line-height: 170px;
	text-align: center;
	font-size: .8vw;
	text-decoration: none;
	color: #fff;
}

.footer a:nth-child(3){
	text-align: right;
	margin-top: -1%;
	margin-bottom: 0;
}

.footer a img{
	width: 80%;
}