﻿.navbar { font-family: 'open-sans', sans-serif; padding-top: 0; padding-bottom: 0; transition: ease-in-out 0.3s all; background: url(../images/navbar-bg.png) center center no-repeat; }
/*.navbar .navbar-toggler { border: 0; width: 50px; height: 50px; }*/

.navbar-nav .nav-item, .navbar-top, .productmenu { font-size: 18px; line-height: 1; font-weight: 700; position: relative; letter-spacing: 1px; }
	.navbar-nav .nav-item a, .navbar-nav .nav-item a:focus, .navbar-top a { transition: ease-in-out 0.3s all; color: #fff; }
		.navbar-nav .nav-item a:hover, .navbar-nav .nav-link.active { color: #a1d55d; }
.navbar-top { margin-bottom: 22px; }

.navbar-brand { transition: ease-in-out 0.3s all; }

.navfixed { }
.navfloat, .navbar { }

.productmenu { background-color: #a1d55d; position: fixed; width: 100%; z-index: 555; transition: ease-in-out 0.3s all; }
	.productmenu a { padding: 16px 0; color: #fff; border-bottom:solid 1px transparent; }
		.productmenu a:hover { color: #628a1a; }
		.productmenu a.active { border-bottom: solid 4px #628a1a; }

@media(min-width:1400px) {
	.navbar { background-position-x: calc(50% - 160px); }
}

@media(min-width:1200px) and (max-width:1399px) {
	.navbar { background-position-x: calc(50% - 100px); }
}

@media(min-width:1200px) {
	header { height: 191px; }
	.navbar-main { z-index: 999; }
	.navbar-brand { width: 380px; padding: 8px 0; }
	.navbar.navfixed .navbar-brand { width: 200px; }
	.navbar-top {width:100%;}
	.navbar-expand-xl .navbar-nav .nav-item .nav-link, .navbar-top a { padding: 0 15px; }
	.navbar-expand-xl .navbar-nav .nav-item.br .nav-link, .navbar-top a { border-right: solid 1px #a1d55d; }
		.nav-link, .navbar-top a:last-child { padding-right: 0; border-right: solid 0px #a1d55d; }
	.nav-item { padding: 4px 0; }
		.nav-item.nav-contact { background-color: #a1d55d; border-radius: 16px; padding: 4px 16px; }
			.nav-item.nav-contact .nav-link.active, .nav-item.nav-contact .nav-link:hover { color: #fff; }
	.navbar-expand-xl .navbar-nav .nav-item.nav-contact .nav-link { padding: 0; border-right: solid 1px #a1d55d; }
	.productmenu { left: 0; top: 141px; }
	.productmenu.navfixed { top: 82px; }
}

@media(max-width:1199px) {
	.navfixed.navbar { margin-top: 0; }
	.navbar-brand { }
	.navbar-toggler, .navbar-toggler:focus { border: 0; box-shadow: none; }
	.navbar-toggler { padding-left: 15px; position: relative; width: 50px; height: 50px; }
		.navbar-toggler:focus { outline: none; }
		.navbar-toggler span:nth-child(1) { top: 15px; }
		.navbar-toggler span:nth-child(2) { top: 23px; }
		.navbar-toggler span:nth-child(3) { top: 31px; }
		.navbar-toggler span { background-color: #fff; position: absolute; display: block; height: 3px; width: 28px; opacity: 1; left: 20px; -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out; }
		.navbar-toggler[aria-expanded="true"] span { background-color: #fff; }
			.navbar-toggler[aria-expanded="true"] span:first-of-type { transform: rotate(45deg) translate(4px, 7px); }
			.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(4px, -7px); }
	.navbar-nav { margin-top: 0px; margin-bottom: 0px; }
	.navbar-nav .nav-item { margin: 0 5px; padding: 10px; border-bottom: solid 1px #f0f0f0; text-align: center; }
		.navbar-nav .nav-item:first-child { margin-top: 10px; }
		.navbar-nav .nav-item:last-child { margin-bottom: 15px; border-bottom: 0; }
		.navbar-nav.mainmenu .nav-item a:hover, .navbar-nav .nav-item.active a { }

	.navbar-nav .nav-item a, .navbar-nav .nav-item a:focus, .navbar-top a { transition: ease-in-out 0.3s all; color: #628a1a; }
}

@media(min-width:768px) and (max-width:1199px) {
	header { height: 110px; }
	.navbar-brand { width: 300px; }
	.navbar.navfixed .navbar-brand { width: 200px; }
}

@media(max-width:767px) {
	header { height: 83px; }
	.navbar-brand { width: 220px; }
	.navbar.navfixed .navbar-brand { width: 180px; }
	.navbar { background-image: none; background-color: #F1F9EE; }
	.navbar-toggler span { background-color: #628a1a; }
}

