@charset "utf-8";
/* All Rigth Reserved - BLINX Estudio Gráfico 2019 */

header{
	background: #000;
	height: auto;
	overflow: hidden;
	width: 100%;
}

#logo{
	background:url( "../Images/logo-desktop.png") center no-repeat;
	margin: 48px auto;
	height: 64px;
	width: 353px;
}

#hi{
	display: none;
}

nav{
	background: #000;
	border-bottom: 2px solid #f00;
	margin: 0;
	width: 100%;
}

nav ul{
	list-style-type:none;
	margin:0;
	padding:0;
	text-align:center;
}
nav ul li{
	color: #fff;
	display: inline-block;
	font-size: 1.125em;
	padding: 8px 20px;
    margin: 0 -2px;
    
}   nav ul li a:link{color: #fff; text-decoration: none;}
	nav ul li a:visited{color: #fff; text-decoration: none;}
	nav ul li a:hover{color: #fff; text-decoration: none;}


nav ul li:hover{
	background:#f00;
	border-radius: 10px 10px 0 0;
	color:#fff;
	cursor:pointer;
	z-index: 1000;
}

.current{
	background:#f00;
	border-radius: 10px 10px 0 0;
	color:#fff;
}


@media only screen and (max-width: 1024px){
/*nav ul li{font-size:1.000em;}*/
}

@media only screen and (max-width: 960px){
header{
	border-bottom: 2px solid #f00;
}

#logo{
	background:url( "../Images/logo-mobile.svg") center no-repeat;
	height: 46px;
	margin: 36px auto 36px auto;
	width: 256px;
}

#hi{
	background: #25d366;
	border-radius:20px;
	color: #fff;
	display: block;
	float: right;
	font-size: 14px;
	margin: -48px 5% 0 0;
	padding: 6px 10px;
	text-align: center;
	z-index: -1;
}   #hi img{width: 16px;}
	
nav{
	background: url("../Icons/menu.svg") center no-repeat;
	border-bottom: none;
	cursor: pointer;
	float: left;
	height: 32px;
	margin: -74px 0 0 5%;
	width: 32px;	
}
	
nav ul{
	display:none;
}
	
nav ul li{
    float:none;
	margin:0;
	padding:15px 0;
	width:100%;
	z-index:10;
}
	
nav ul li:hover{
	background:#f00;
	border-radius: 0;
}

nav:hover ul{
	background:#000;
	display:inline-block;
	height:auto;
	float:left;
	margin: 48px 0 0 0;
	position:absolute;
	width:90%;
	z-index:10;
}

nav:hover, nav:focus{/*Para iOS*/
max-height: 128px;
}
	
nav:hover a{
	color:#fff;
	text-decoration:none;
}
	
.current{
	background:#f00;
	border-radius: 0;
	color:#fff;
}

}

@media only screen and (max-width: 704px){/*Smartphone Horizontal*/
#logo{
	float: right;
	margin: 36px 5% 36px 0;
}
nav:hover ul{
	margin: 74px 0 0 0;
}
}