header {
	height: 100px;
	background-color: rgb(241, 243, 248);
	z-index: 2;
	position: relative;
}

header .logo-container {
	height: 70%;
}

header .logo {
	height: 100%;
}

header nav {
	margin-left: 50px; 
}
header nav .header-menu-desktop{
	display: flex;
    flex-direction: row;
    flex-flow: wrap;
    list-style: none;
	gap: 50px;
}

header nav .header-menu-desktop li a{
	color: #000;
	transition: all 0.2s ease-in-out;
}

header nav .header-menu-desktop li.current-menu-item a, header nav .header-menu-desktop li a:hover{
	color: #3b7e00;
}

header .button-container {
	gap: 20px;
}

header .button-container .btn-search{
	display: flex;
	align-items: center;
	border-radius: 0;
	background-color: #3b7e01;
	cursor: pointer;
    font-size: 16px;
    padding: 10px 15px;
}
header .button-container .btn-search i{
	color: #fff;
}

header .menu-toggle {
	height: 25px; 
	width: 25px;
	display: none;
	cursor: pointer;
}

header .mobile-menu {
	overflow: hidden;
	height: 0;
	position: absolute;
	transition: 0.4s;
	background-color: white;
	top: 100px;
	left: 0;
	width: 100%;
}

@media only screen and (max-width: 1024px) {
	header .button-container {
		display: none;
	}
}

@media only screen and (max-width: 820px) {
	header .mobile-menu.open {
		transition: 0.4s;
	}
	
	header .mobile-menu a {
		display: block;
		box-sizing: border-box;
		padding-top: 10px; 
		padding-bottom: 10px;
		padding-left: 10px;
		border-bottom: 1px #ddd solid;
		text-align: center;
	}
	
	header nav {
		display: none !important;
	}
	
	header .menu-toggle {
		display: block;
	}
}