﻿.navbarcontainer { left: 0; width: 100%; z-index: 1000; font-family: 'Lexend', sans-serif; position: absolute; box-shadow: #000 0 0 0px; }
.navbar-light .navbar-toggler { border: 0; }
.navbar-light .navbar-nav .nav-link { color: #fff; }
.navbar-brand { margin-right: 0; }
.navbar { padding: 0; }
.ghkh {display:block;width:100%;}
.mainmenu { padding: 15px 0; /*box-shadow:#444 5px 5px 4px;border-radius:0 0 8px 8px;*/ }
	.mainmenu .nav-item { font-size: 16px; line-height: 16px; font-weight: 400; text-transform: uppercase; }
		.mainmenu .nav-item:last-child { border-right: 0; }
		.mainmenu .nav-item a { padding: 24px 10px 6px 10px; }
		.mainmenu .nav-item { background: url(../images/menu.png) 0 0 no-repeat;}
			.mainmenu .nav-item a, .mainmenu .nav-item a.active, .mainmenu .nav-item a:focus { color: #e60909; border-bottom: solid 3px #fff; }
			/*.mainmenu .nav-item a.nav-link.active {color:#e60909;}*/
			.mainmenu .nav-item.gh { background: url(../images/groothandel.png) 0 0 no-repeat; }
			.mainmenu .nav-item.gh a, .mainmenu .nav-item.gh a:focus { color: #821705; }
			.mainmenu .nav-item.kh { background: url(../images/kleinhandel.png) 0 0 no-repeat; }
			.mainmenu .nav-item.kh a, .mainmenu .nav-item.kh a:focus { color: #058282; }
		.mainmenu .nav-item a:hover { border-bottom: solid 3px #e60909; }
			.mainmenu .nav-item.gh a:hover { border-bottom: solid 3px #821705; }
			.mainmenu .nav-item.kh a:hover { border-bottom: solid 3px #058282; }

ul.dropdown-menu { margin: 0px 0 0 0; border-radius: 0; padding: 0px; border: 0; box-shadow: #ccc 5px 5px 10px; background-color: #5f9a42; }
.dropdown-item { font-size: 16px; line-height: 26px; padding: 6px 10px 6px 22px !important; margin-left: 0 !important; margin-right: 0 !important; border-radius: 0; font-weight: 400; }
	.dropdown-item:last-child, .dropdown-item:first-child { border-radius: 0; }
.mainmenu .nav-item a.dropdown-item:hover { color: #fff !important; background-color: #ea5b0c; }

@keyframes menu_sticky {
	0% { margin-top: -100px; }
	50% { margin-top: -50px; }
	100% { margin-top: 0; }
}

@media (min-width:1300px) {
	header { height: 291px; }
}

@media (min-width:1200px) and (max-width: 1299px) {
 	header { height: 249px; }
}

@media(min-width:1200px) {
	.navbarcontainer { background: #fff url(/images/navbar-bg.png) 0 15px repeat-x; }
	.navbar-brand img { max-width: 400px; padding: 10px 0 10px 0; }
	.navfixed { padding-top: 0; }
	.navbarcontainer.navfixed { position: fixed; top: 0px; animation-name: menu_sticky; animation-duration: 0.30s; animation-timing-function: linear;box-shadow:#000 0 0 10px; }
	.mainmenu {width:100%;}
	ul.dropdown-menu { display: block; visibility: hidden; opacity: 0; transform: translateY(-50px); transition: .5s ease all; }
		ul.dropdown-menu.show { display: block; visibility: visible; opacity: 1; transform: translateY(0px); transition: .5s ease all; }
	.mainmenu .nav-item a.active::after { content: '\f354'; font-family: 'Font Awesome 6 Pro'; font-weight:bold; margin-left:5px; }
	.mainmenu .nav-item a span {display:none;}
}

@media(max-width:1199px) {
	header {height:160px;}
	.navbarcontainer { position: fixed; top: 0; background-color:#fff;}
		.navbarcontainer .navbar-brand, .navfloat .navbar-brand { }
		.navbarcontainer.navfixed { box-shadow: #000 0 0 10px; }
	.phone { background-color: transparent; padding: 4px 6px; border-radius: 0 0 6px 6px; }
		.phone a { color: #fff; }

	.navbar-toggler { width: 50px; height: 50px; background-color: transparent; box-shadow: none !important; border:none; }
		.navbar-toggler span { transform: none; background-color: #e60909; margin: 7px auto; width: 100%; height: 3px; transition: all 0.8s cubic-bezier(0.810, -0.330, 0.345, 1.375); opacity: 1; display: block; }
		.navbar-toggler[aria-expanded="true"] span:first-of-type { transform: rotate(45deg) translate(0px, 8px); }
		.navbar-toggler[aria-expanded="true"] span:nth-of-type(2) { opacity: 0; }
		.navbar-toggler[aria-expanded="true"] span:last-of-type { transform: rotate(-45deg) translate(6px, -14px); }

	.navbar-brand img { max-width: 160px;padding:8px 0;transition:ease-in-out all 0.3s; }
	.navfixed .navbar-brand img { max-width: 80px; padding: 8px 0; }
	/*.navfloat .navbar-toggler, .navbar-toggler { margin-top: 10px; }
	.navfixed .navbar-toggler { margin-top: 4px; }*/
	.nav-item { text-align: center; font-size: 16px !important; line-height: 20px !important; margin-bottom: 16px; }
	.mainmenu { border-top: 0 !important; background-color: transparent; margin-top: 0px; width:340px; margin-left:calc(50% - 170px); }
		.mainmenu .nav-item { background:none !important; }
		.mainmenu .nav-item a { padding: 4px 0; color: #000; }
			.mainmenu .nav-item a:hover { color: #888; background-color: transparent; border-bottom:solid 3px transparent !important; }

	ul.dropdown-menu { text-align: center; background-color: #fff; }
}

@media (max-width: 768px) {
	header { height: 126px; }
	.navbar-brand img { max-width: 120px; padding: 8px 0; transition: ease-in-out all 0.3s; }
}

