﻿.navbarcontainer { width: 100%; z-index: 9999; background-color: rgba(0,0,0,0.2); margin-top: 0px; background-color:transparent;}
	.navbarcontainer .navbar .container { padding: 0; }

.navbar { font-family: 'Ubuntu',sans-serif; padding: 0; }
.navbar-light .navbar-toggler { border: 0; width: 50px; height: 50px; }
.navbar-brand { padding: 0; /*width: 190px;*/ }

.mainmenu { margin-right: 0px; }
	.mainmenu .nav-item { font-size: 20px; line-height: 20px; font-weight: 700; position: relative; }
		.mainmenu .nav-item .nav-link { padding: 0; }
		.mainmenu .nav-item a, .mainmenu .nav-item a:focus { color: #000 !important; transition: ease-in-out 0.3s all; }
		.mainmenu .nav-item.active a {color:#fe0000 !important;}

@media(min-width:1199px) {
	.mainmenu .nav-item a:after { position: absolute; background-color: #fe0000; content: ""; left: 0; right: 0; top: 30px; height: 2px; width: 100%; display: block; -moz-transition: all 0.3s; -o-transition: all 0.3s; -webkit-transition: all 0.3s; transition: all 0.3s; -moz-transform: rotateY(-90deg); -ms-transform: rotateY(-90deg); -o-transform: rotateY(-90deg); -webkit-transform: rotateY(-90deg); transform: rotateY(-90deg); }
	.mainmenu .nav-item a:hover:after { -moz-transform: rotateY(0deg); -ms-transform: rotateY(0deg); -o-transform: rotateY(0deg); -webkit-transform: rotateY(0deg); transform: rotateY(0deg); }
	.mainmenu .nav-item a.active:after { -moz-transform: rotateY(0deg); -ms-transform: rotateY(0deg); -o-transform: rotateY(0deg); -webkit-transform: rotateY(0deg); transform: rotateY(0deg); }
}

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

.navfixed { position: fixed; top: 0px; animation-name: menu_sticky; animation-duration: 0.60s; animation-timing-function: linear; box-shadow: #000 0 0 4px; background-color:#fff; }
.navfloat { position: unset; top: 0px; }
.navfixed .navbar-brand { width: 120px; padding:12px 0; }
.navfloat .navbar-brand { }

@media(min-width:1500px) {
	.navbar-brand { width: 300px; }
	.mainmenu .nav-item { margin-left: 25px; }
}

@media(min-width:1400px) and (max-width:1499px) {
	.navbar-brand { width: 280px; }
	.mainmenu .nav-item { margin-left: 25px; }
}

@media(min-width:1300px) and (max-width:1399px) {
	.navbar-brand { width: 260px; }
	.mainmenu .nav-item { margin-left: 18px; }
}

@media(min-width:1200px) and (max-width:1299px) {
	.navbar-brand { width: 260px; }
	.mainmenu .nav-item { margin-left: 16px; }
}

@media(min-width:1200px) {
	.navbarcontainer .container .navbar { margin-bottom: -20px; }
	.navbar-brand { z-index: 9999; }
	.mainmenu {margin-bottom:15px;}
}

@media(max-width:1200px) {
	.navbarcontainer .container .navbar { margin-bottom: -20px; }
	.navbar-brand { margin-left: 15px; width:260px; }
	.navbar-light .navbar-toggler { padding-left: 15px; position: relative; margin-bottom:15px; }
		.navbar-light .navbar-toggler:focus { outline: none; }
		.navbar-light .navbar-toggler span:nth-child(1) { top: 20px; }
		.navbar-light .navbar-toggler span:nth-child(2) { top: 27px; }
		.navbar-light .navbar-toggler span:nth-child(3) { top: 33px; }
		.navbar-light .navbar-toggler span { background: #000; position: absolute; display: block; height: 1px; width: 20px; opacity: 1; left: 20px; -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out; }
		.navbar-light .navbar-toggler[aria-expanded="true"] span { background-color:#fe0000; }
		.navbar-light .navbar-toggler[aria-expanded="true"] span:first-of-type { transform: rotate(45deg) translate(4px, 5px); }
		.navbar-light .navbar-toggler[aria-expanded="true"] span:nth-of-type(2) { opacity: 0; }
		.navbar-light .navbar-toggler[aria-expanded="true"] span:last-of-type { transform: rotate(-45deg) translate(4px, -5px); }
	.navbar-collapse { }
	.mainmenu { margin-top: 10px; margin-bottom:20px; }
		.mainmenu .nav-item { margin: 0 15px 0 15px; padding: 10px; text-align: left; border-bottom: solid 1px #f0f0f0; text-align: center; }
			.mainmenu .nav-item:first-child { margin-top: 10px; }
			.mainmenu .nav-item:last-child { margin-bottom: 10px; border-bottom: 0; }
}

@media(min-width:992px) and (max-width:1199px) {
	.navbar-brand { width: 220px; }
}

@media(max-width:991px) {
	.navbarcontainer .container .navbar { margin-bottom: 0px; }
	.navbar-brand { width: 160px;margin: 10px 0; }
	.navbar-light .navbar-toggler { margin-top:15px; }
}

@media(max-width:576px) {
	.navbar-brand { margin-left:0px; }
	.navbar-light .navbar-toggler span { margin-right:15px; }
}
