
.header{
	background-color: var(--color-bg-header);
	padding: 10px 0;
	position: sticky;
	top: 0;
	z-index: 10;
	border-bottom: 1px solid var(--color-bg-border-header);
}

.header .logo{max-height: 80px;}

.header .menu-top{background-color: transparent;}
.header .menu-top .item-menu{list-style: none;}
.header .menu-top .item-menu:first-child{}
.header .menu-top .item-menu a{
	display: block;
	padding: 0px 15px;
	color: var(--color-link-menu);
	font-family: 'Roboto';
	font-size: 18px;
}
.header .menu-top .item-menu.ancora a:hover{
	/*text-shadow: 0 0 3px #000;*/
	color: var(--color-link-menu-hover)/*#CAA5A6*/;
}

.header .menu-top .item-menu.social{
	border-left: none !important;
}

.header .menu-top .item-menu.social a{
	color: var(--color-link-menu-social);
	display: inline;
	
}
.header .menu-top .item-menu.social a:hover{
	color: var(--color-link-menu-social-hover);
}

/* red: #F60000; */

.btn-menu:active,
.btn-menu:visited,
.btn-menu:focus{
	outline: none;
	box-shadow: none;
}

.btn-menu{
	background: none;
	color: var(--color-btn-menu);
	border: none;
	display: none;
}

.btn-menu:hover{
	color: var(--color-btn-menu-hover:);
}

@media only screen and (max-width: 998px){
	.btn-menu{
		display: inline-block;
	}	
}

@media only screen and (min-width: 998px){
	.btn-close-menu{
		width: 1px;
		height: 1px;
		overflow: hidden;
		padding: 0;
		margin: 0;
		position: absolute;
	}
}

@media only screen and (max-width: 998px){
	.btn-menu{
		display: inline-block;
	}
	.close-top-nav{
		position: fixed;
		z-index: 20;
		background-color: #0a304799;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
	}

	.btn-close-menu{
		position: absolute;
		top: 20px;
		right: 20px;
		color: var(--color-btn-menu);
	}

	.menu-top{
		position: fixed;
		width: 90%;
		height: 100vh;
		z-index: 30;
		top: 0;
		right: -105%;
		display: flex;
		align-items: center;
		overflow-y: auto;
		transition: all .7s cubic-bezier(.21,.97,.61,.94);
		box-shadow: 0 -10px 10px #222 ;
	}

	.menu-top.open{
		right: 0;
		width: 100%;
		background-color: #010101;
	}
	.menu-top.open ul{
		top: 25px;
  		position: absolute;
  		width: 100%;
	}
	.menu-top.open ul li.item-menu a{color: var(--color-link-menu-open)}
	.menu-top.open ul li.item-menu i{color: var(--color-link-menu-open); padding-top: 20px;}

	.menu-top .item-menu{
		border-left: none;
		padding-left: 15px;
		padding-bottom: 10px;
	}	
}
