@import url('root.css');

#menu {
	background-color: #ffffff;
}

#menu .top-menu {
	height: 80px;
	padding: 10px 0px;
	border-bottom: 1px solid var(--bg1);
	
	display: flex;
	align-items: center;
}

#menu .navbar-brand img {
    height: 38px;
}

#menu .titulo-menu h1 {
	font-size: 1.2rem;
	margin-bottom: 0px;
	text-align: center;
	color: var(--primaria);
}

#menu .redes-menu {
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

#menu .redes-menu a {
	padding: 0px 16px;
}


#menu .item-menu {
	background-color: #ffffff;
	border-bottom: 1px solid var(--bg1);
}

#menu .navbar-nav a.nav-link {
	color: var(--texto);
}

#menu .navbar-nav a.nav-link:hover {
	color: var(--primaria0);
}



/*Mobile*/
.navbar-toggler-icon {
	background-image: url('../img/ico-menu.svg');
}

.navbar-collapse {
    margin: -12px;
    padding: 16px;
}

@media (max-width: 1024px) {
	#menu .titulo-menu h1 {font-size: 1rem;}
}

@media (max-width: 975px) {
	ul.navbar-nav li.nav-rede {display: block;}
	.navbar-toggler {display: block;}
  
	.navbar-default .navbar-responsive {
	  width: 100vw;
	  background: var(--branco);
	  height: auto;
	  padding: 10px 0px 10px 22px;
	  margin: 30px -45px 0px -47px;
	  transition: all .3s ease;
	}
  
	.navbar-responsive {
	  width: 100vw;
	  background: #fff;
	  height: auto;
	  padding: 10px 0px 30px 22px;
	  margin: -20px -45px 0px -48px;
	  box-shadow: 0px 45px 50px -40px #56565657;
	  transition: all .3s ease;
	}
  
	.navbar-default .navbar-nav > li > a {color: var(--azul);}
  
	.navbar-toggler {padding: 10px; top: 28px; right: 30px;}
  
}

@media (max-width: 769px) {
	.navbar-default .navbar-responsive {
		right: 20px;
		position: relative;
	}
	
	li.nav-item {display: block;}
}

@media (max-width: 445px) {
	#menu .top-menu {
		height: auto;
	}

	a.navbar-brand {
		display: flex;
		justify-content: center;
	}
	
	#menu .titulo-menu h1 {
		padding: 10px 0px;
	}

	#menu .redes-menu {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	#menu .item-menu {
		padding-left: 10px;
	}
}

@media (max-width: 376px) {
	#menu .redes-menu a {padding: 0px 8px;}
}