header.navbar { position: relative; display: block; width: 100%; z-index: 1040; padding-top: 0; padding-bottom: 0; margin-bottom: 0; }
header.navbar > .container,
header.navbar > .container-fluid { position: relative; padding-top: 1rem; padding-bottom: 1rem; }

header.navbar .navbar-brand > .ic { width: 32px !important; height: 32px !important; }
header.navbar .navbar-brand > .ic > svg { left: 0 !important; top: 0 !important; width: 32px !important; height: 32px !important; }

header.navbar .navbar-nav .nav-link { color: rgb(0, 0, 0); }
header.navbar .navbar-nav .nav-link:hover { color: rgb(60, 80, 180); }
header.navbar .navbar-nav .nav-link.active { color: #fd7e14; }
header.navbar .navbar-nav .nav-link > .badge { padding-top: .1rem; padding-bottom: .1rem; }

#HeaderClone { display: none; padding-top: .85rem !important; padding-bottom: .85rem !important; }

@media (min-width:992px) {
	header.navbar::before { position: absolute; z-index: -1; left: 0; top: 0; width: 100%; height: 100%; background-color: transparent; border-bottom: 1px solid transparent; content: ''; }
	header.navbar.scrolled::before { background-color: #fff; box-shadow: 0 1px .5rem rgba(0, 0, 0, .075); border-color: rgba(60, 80, 180, .125); }

	@supports (-webkit-backdrop-filter: none) {
		header.navbar.scrolled::before { -webkit-backdrop-filter: saturate(180%) blur(20px); background-color: rgba(255, 255, 255, 0.72); }
	}

	@supports (backdrop-filter: none) {
		header.navbar.scrolled::before { backdrop-filter: saturate(180%) blur(20px); background-color: rgba(255, 255, 255, 0.72); }
	}

	header.navbar .navbar-brand { padding: 0; line-height: 38px; font-weight: bold; }

	header.navbar .navbar-nav .nav-link { position: relative; padding: .5rem 1rem; line-height: 1.5; transition: color .15s ease-in-out; }
	header.navbar .navbar-nav .nav-item:last-child > .nav-link { padding-right: 0; }
	header.navbar .navbar-nav .nav-item:first-child { margin-left: -1rem; }

	header.navbar.scrolled { position: fixed; left: 0; top: 0; z-index: 1021; animation: headerAnimation .25s ease-in-out; }

	#HeaderClone { position: relative; display: block; width: 100%; height: auto; }

	@keyframes headerAnimation {
		0% { opacity: 0; top: -70px; }
	}

	@media (prefers-reduced-motion:reduce) {
		header.navbar .navbar-nav .nav-link { transition: none }
	}
}

@media (max-width:991.98px) {

	header.navbar > .container,
	header.navbar > .container-fluid { padding-bottom: 0; flex-wrap: wrap; }

	header.navbar .navbar-brand { padding: 0; line-height: 38px; font-weight: bold; }

	header.navbar .navbar-nav-preparent { position: relative; display: block; width: 100%; height: auto; margin: 1rem 0 0; }
	header.navbar .navbar-nav-parent { position: relative; display: block; width: 100%; height: 42px; overflow-x: auto; overflow-y: hidden; }
	header.navbar .navbar-nav-shadow { position: absolute; z-index: 2; right: 0; top: 0; display: block; width: 1rem; height: 100%; background-image: linear-gradient(to left, #f9fafc, rgba(255, 255, 255, 0)); }

	header.navbar .navbar-nav { width: auto; flex-wrap: unset; flex-direction: unset; justify-content: left; justify-items: center; }
	header.navbar .navbar-nav > .nav-item { position: relative; display: block; flex-basis: 0; flex-grow: 0; max-width: 100%; width: auto; padding: 0 1rem 0 0; text-align: center; font-size: .75rem; }
	header.navbar .navbar-nav > .nav-item .ic { font-size: .85rem; }
	header.navbar .navbar-nav > .nav-item > a { outline: none; }

	header.navbar .controls { position: absolute; right: 0; top: 1rem; }
}