@charset "utf-8";
/* CSS Document */

*{
	margin:0;
	padding:0;
	height:100%;
	font-family: 'Quicksand', sans-serif;
}


::-webkit-scrollbar {
width:8px;
}
::-webkit-scrollbar-track {
background-color: hsla(0,0%,0%,0.30);
border-radius:0px;
}
::-webkit-scrollbar-thumb {
background-color: #022C41;
border-radius: 0px;
}

body{
	background: url(../images/background.png) fixed no-repeat;
	background-size:cover;
	height:100%;
}

#line{
	width:100%;
	height:85%;
	background: url(../images/line.png) center no-repeat;
	background-size:cover;
	display:flex;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	flex-direction:column;
}
#logo{
	width:18%;
	height:auto;
}
#coming{
	width:auto;
	height:auto;
	color:#fff;
	font-size:1.5em;
	margin-top:20px;
}

footer{
	display:flex;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	flex-direction:column;
	height:100px;
}
#cont_redes{
	width:120px;
	height:auto;
	display:flex;
	justify-content: space-between;
	margin-bottom:15px;
	font-size:1.5em;
}
.red{
	width:30%;
	height:auto;
}
#url{
	color:#022C41;
	font-weight: 700;
}

@media screen and (max-width: 2880px){
	#line{
		height:90%;
	}
	#coming{
		font-size:2.5em;
	}
	footer{
		font-size:2em;
	}
	#cont_redes{
		width:8%;
	}
	
}

@media screen and (max-width: 2560px){
	#line{
		height:90%;
	}
	#coming{
		font-size:2.5em;
	}
	footer{
		font-size:2em;
	}
	#cont_redes{
		width:8%;
	}
	
}

@media screen and (max-width: 1920px){
	#line{
		height:88%;
	}
	#coming{
		font-size:2.2em;
	}
	footer{
		font-size:1.8em;
	}
}

@media screen and (max-width: 1440px){
	#line{
		height:88%;
	}
	#coming{
		font-size:1.7em;
	}
	footer{
		font-size:1.2em;
	}
}

@media screen and (max-width: 1366px){
	#line{
		height:85%;
	}
	#logo{
		width:18%;
		height:auto;
	}
	#coming{
		font-size:1.5em;
	}
	
	footer{
		font-size:1em;
	}
	#cont_redes{
		width:120px;
	}
	
}

@media screen and (max-width: 1024px){
	#line{
		height:86%;
	}
	#coming{
		font-size:1.3em;
	}
	footer{
		font-size:1.3em;
	}
	
}

@media screen and (max-width: 800px){
	#line{
		background-size:150%;
	}
	#logo{
		width:25%;
		height:auto;
	}
	
}

@media screen and (max-width: 700px){
	#line{
		height:86%;
		background-size:130%;
	}
	#logo{
		width:33%;
		height:auto;
	}
	
}

@media screen and (max-width: 667px){
	#line{
		height:86%;
		background-size:125%;
	}
	#logo{
		width:20%;
		height:auto;
	}
	#coming{
		font-size:0.9em;
	}
	footer{
		font-size:0.9em;
	}
	#cont_redes{
		width:100px;
	}
	
}

@media screen and (max-width: 500px){
	#line{
		height:86%;
		background-size:130%;
	}
	#logo{
		width:20%;
		height:auto;
	}
	
}

@media screen and (max-width: 400px){
	#line{
		height:80%;
		background-size:310%;
	}
	#logo{
		width:50%;
		height:auto;
	}
	
}

@media screen and (max-width: 375px){
	#line{
		height:80%;
		background-size:320%;
	}
	#logo{
		width:50%;
		height:auto;
	}
	
}

@media screen and (max-width: 320px){
	#line{
		height:80%;
		background-size:300%;
	}
	#logo{
		width:50%;
		height:auto;
	}
	
}