.topheader {
	/* box-shadow: 0 2px var(--navbar-shadow-color); */
	box-shadow: 0 2px var(--verde1);
	position: fixed;
	/* background-color: var(--nord-5); */
	background-color: var(--verde2);
	left: 0;
	top: 0;
	width: 100%;
	z-index: 100;
}

.topnav {
	display: flex;
	justify-content: space-between;
	padding: 10px;
	margin: 0 auto;
/* 	
	margin-top: 15px;
	margin-bottom: 15px;
*/
}

.logo {
	display: flex;
	align-items: center;
	font-size: 22px;
	font-weight: 500;
}

.logo img {
	border-radius: 50%;
}

/* Menu Principal */

.menu {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
	align-items: center;
}

.menu li {
	padding: 0 15px;
}

.menu a {
	font-size: 16px;
	font-weight: 500;
	position: relative;
}

.menu a::after {
	content: "";
	background-color: var(--secundary-color);
	position: absolute;
	left: 0;
	top: calc(100% + 4px);
	width: 100%;
	height: 2px;
	opacity: 0;
	transition: opacity 0.3s;
}

.menu a.selected::after,
.menu a:hover::after {
	opacity: 0.8;
}

.open-menu,
.close-menu {
	display: none;
}

/* Submenu Principal */

.submenu {
	position: absolute;
	flex-direction: column;
	list-style: none;
	margin: 0;
	padding: 12px;
	align-items: center;
	background-color: var(--nord-1);
	visibility: hidden;
	transition: opacity 0.5s;
	border-radius: 5%;
}

.submenu li {
	padding: 15px 5px;
}

.submenu a {
	font-size: 16px;
	font-weight: 500;
	position: relative;
	color: var(--text-color-inverse);
}

.submenu a::after {
	content: "";
	background-color: var(--navbar-shadow-color);
	position: absolute;
	left: 0;
	top: calc(100% + 4px);
	width: 100%;
	height: 2px;
	opacity: 0;
	transition: opacity 0.3s;
}

.submenu a.selected::after,
.submenu a:hover::after {
	opacity: 0.8;
}

.menu li:hover .submenu {
	visibility: visible;
	opacity: 1;
}

@media (max-width: 950px) {
	.logo {
		display: flex;
		align-items: center;
		font-size: 14px;
		font-weight: 500;
	}

	.menu {
		flex-direction: column;
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		align-items: center;
		background-color: var(--menu-mobile-background-color);
		color: var(--text-color-inverse);
		height: 100%;
		overflow-y: auto;
		opacity: 0;
		pointer-events: none;
		transition: opacity 0.3s;
	}

	.menu li {
		padding: 15px 15px;
	}

	.menu a {
		font-size: 26px;
		font-weight: 500;
	}

	.open-menu,
	.close-menu {
		display: block;
		border: none;
		background: none;
		cursor: pointer;
	}

	.close-menu {
		align-self: flex-end;
		padding: 22px 16px;
	}

	.menu_opened {
		opacity: 1;
		pointer-events: all;
	}

	.submenu {
		flex-direction: column;
		align-items: center;
		background-color: var(--nord-1);
		color: var(--text-color);
		overflow-y: auto;
		transition: opacity 0.3s;
		display: inline-table;
	}

}