@import url(http://fonts.googleapis.com/css?family=Roboto:400,900);
/*font-family: 'Roboto', sans-serif;
font-family: 'Oswald', sans-serif;*/
body{
	background:#ffffff;
	color:#ffffff;
	font-size:16px;
	font-family: 'Roboto', sans-serif;
        background-size: cover;
	font-weight:normal;	
	margin:0 auto;
	padding:0;
	text-align:center;
	width:auto;
}
.log{
	top:5em;
	position:absolute;	
	width:100%;
	z-index:2;
}
/*CONTENEDOR*/
#contenedor{
	margin:0 auto;	
	padding:0;	
	width:100%;
}
#contenedor article{
	background:rgba(255,255,255,0.0);
	padding:1em;
}
header{
	background:rgba(255,255,255,0.0);
	text-align:center;
	width:100%;
}
header > a{
	display:inline-block;
	margin:1em 0 1em 1em;
	padding:0;
	vertical-align:top;	
	width:50%;
}
header a img{
	width:50%;
}
/*LISTA BANDERA*/
ul#region{
	margin:1em 0;
	padding:0;
}
ul#region li{
	display:inline-block;
	margin:0 1em;
	padding:0;
	vertical-align:top;
}
ul#region li a{
	color:black;
	text-transform:uppercase;
	text-decoration:none;
}
ul#region li a img{
	border-radius:50%;
	height:6em;
	width:6em;
}
/***********************************************/
/*******DISPOSITIVOS MOBILES*********/
/**********************************************/
@media only screen and (max-width:1150px){
	header > a{	
		height:4em;
		margin-left:1em;
		vertical-align:top;	
		width:50%;	
	}
	header > a:hover{	
		background-position:0 -3.5em;
	}
	form{
		padding:3em 0 1em 0;
	}
}
@media only screen and (max-width:1024px){
	header > a{	
		height:3.3em;
		margin-left:1em;
		vertical-align:top;	
		width:50%;	
	}
	header > a:hover{	
		background-position:0 -3.5em;
	}
	form{
		padding:3em 0 1em 0;
	}

}
/***    DISEÑO PARA TABLETAS           ****/
@media only screen and (max-width:800px){
	.log{
		top:2em;
	}
		/*CONTENEDOR*/
	#contenedor{
		width:70%;
	}
}
@media only screen and (max-width:768px){
	
}
@media only screen and (max-width:720px){
	.log{
		top:2em;
	}
		/*CONTENEDOR*/
	#contenedor{
		width:85%;
	}
}
@media only screen and (max-width:640px){
	header > a{	
		width:50%;	
	}
	header > a:hover{	
		background-position:0 -4em;
	}
	.log{
		top:2em;
	}
		/*CONTENEDOR*/
	#contenedor{
		width:90%;
	}
}
@media only screen and (max-width:540px){
	
}
@media only screen and (max-width:480px){
	
}