<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">header {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 5;
	padding: 0 0;
}

header .navbar {
	padding-top: 0;
	padding-bottom: 0;
	background: none !important;
	position: relative;
	min-width: 100vw;
}

header .navbar-nav {
	background-color: rgb(var(--complimentary-color), 0.7);
	transition: background-color 2s;
	border-radius: 0 0 30px 30px;
	padding: 0;
}

header .container {
	max-width: none;
}

.avatar-container {
	display: flex;
	flex-direction: column;
	position: absolute;
	right: calc(1rem + 1.5vw);
	top: calc(1rem + 1.5vh);
	align-items: flex-end;
}

.avatar {
	z-index: 10;
	width: 80px;
	height: 80px;
	border-radius: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	border: rgba(var(--primary-color)) solid;
	background-color: rgba(var(--complimentary-color), 0.8);
	border-width: 2.5px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	-webkit-transition: .3s all ease;
	-o-transition: .3s all ease;
	transition: .3s all ease;
}


.avatar svg path {
	filter: drop-shadow(10px 6px 10px rgba(20, 50, 67, 0.887));
	fill: rgb(var(--primary-color));
}


.avatar svg {
	height: 66%;
	width: 66%;
	margin: 0vw 0.5vw;
	-webkit-transition: .3s all ease;
	-o-transition: .3s all ease;
	transition: .3s all ease;
}

.avatar:hover {
	filter: drop-shadow(12px 8px 13px rgba(20, 50, 67, 0.887));
	border: rgba(var(--secondary-color)) solid;
	border-width: 2.5px;
	background-color: rgba(var(--primary-color));
	-webkit-transition: .3s all ease;
	-o-transition: .3s all ease;
	transition: .3s all ease;
	background-size: 105%;
	cursor: pointer;
}

.avatar:hover svg {
	transform: scale(1.1);
	-webkit-transition: .3s all ease;
	-o-transition: .3s all ease;
	transition: .3s all ease;
}

.avatar:hover svg path {
	fill: rgb(var(--secondary-color));
}

.avatar-menu-container {
	text-align: right;
	background-color: rgba(var(--complimentary-color), 0.8);
	color: rgba(var(--primary-color));
	border-radius: 5px;
	display: none;
	margin: 0;
	border: 2px solid rgb(var(--primary-color));
	border-radius: 0 0 30px 30px
}

.avatar-menu {
	margin-bottom: 0;
	padding: 0.75vw;
	font-size: 25px;
}

.avatar-menu li {
	padding: 0.33vw;
}

.avatar-menu .nav-link {
	transition: none;
	-o-transition: none;
}

.avatar-menu .nav-link:hover {
	color: #111B28;
	transition: none;
	-o-transition: none;
}

.navbar-toggler {
	padding: 10px 15px;
	background-color: rgba(var(--primary-color), 0.8);
	border-color: rgb(var(--secondary-color));
	border-radius: 2vw;
	border-width: 2px;
}

.navbar-toggler:focus {
	box-shadow: none;
}

.navbar-toggler[aria-expanded="false"] {
	-webkit-animation: fadeBackgroundColor 0.8s backwards;
	animation: fadeBackgroundColor 0.8s backwards;
}

.navbar-toggler[aria-expanded="true"] {
	background-color: rgba(var(--complimentary-color), 0.8);
	border-color: rgb(var(--primary-color));
	border-bottom-style: none;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	transition: background-color 0.6s ease, border-color 0.6s ease;
}

.navbar-toggler {
	outline: none !important;
}

header .navbar .nav-link {
	padding: 10px 10px;
	outline: none !important;
	font-size: 25px;
	color: rgb(var(--primary-color));
	transition: none;
	-o-transition: none;
}

.nav-item-left {
	padding-left: 20px !important;
}

.nav-item-right {
	padding-right: 20px !important;
}

header .navbar .nav-link:hover {
	color: rgba(var(--background-blue), 0.8);
	color: #111B28;
	transition: none;
	-o-transition: none;
}

.dropdown:hover .dropdown-menu {
	display: block;
	margin-top: 0;
	/* remove the gap so it doesn't close */
}

header .navbar .disabled {
	color: rgba(var(--primary-color), 0.33);
}

.navbar-collapse {
	z-index: 5;
}

.navbar-toggler svg {
	fill: rgb(var(--secondary-color));
}


.navbar-toggler[aria-expanded="true"] svg {
	fill: rgb(var(--primary-color));
}


.navbar-collapse li {
	padding-left: 10px;
}

@-webkit-keyframes fadeBackgroundColor {
	0% {
		background-color: rgb(var(--complimentary-color));
	}

	100% {
		background-color: rgb(var(--primary-color));
	}
}

@keyframes fadeBackgroundColor {
	0% {
		background-color: rgb(var(--complimentary-color));
	}

	100% {
		background-color: rgb(var(--primary-color));
	}
}

/* Everything from here on is for the bars to xmark animation...  */

.navTrigger {
	pointer-events: none;
	width: 30px;
	height: 25px;
	margin: auto;
	position: relative;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
}

.navTrigger i {
	background-color: rgb(var(--secondary-color));
	border-radius: 2px;
	content: '';
	display: block;
	width: 100%;
	height: 4px;
	transition: background-color 0.6s ease;
}

.navTrigger i:nth-child(1) {
	-webkit-animation: outT 0.8s backwards;
	animation: outT 0.8s backwards;
	-webkit-animation-direction: reverse;
	animation-direction: reverse;
}

.navTrigger i:nth-child(2) {
	margin: 5px 0;
	-webkit-animation: outM 0.8s backwards;
	animation: outM 0.8s backwards;
	-webkit-animation-direction: reverse;
	animation-direction: reverse;
}

.navTrigger i:nth-child(3) {
	-webkit-animation: outBtm 0.8s backwards;
	animation: outBtm 0.8s backwards;
	-webkit-animation-direction: reverse;
	animation-direction: reverse;
}

.navbar-toggler[aria-expanded="true"] i:nth-child(1) {
	-webkit-animation: inT 0.8s forwards;
	animation: inT 0.8s forwards;
}

.navbar-toggler[aria-expanded="true"] i:nth-child(2) {
	-webkit-animation: inM 0.8s forwards;
	animation: inM 0.8s forwards;
}

.navbar-toggler[aria-expanded="true"] i:nth-child(3) {
	-webkit-animation: inBtm 0.8s forwards;
	animation: inBtm 0.8s forwards;
}

@-webkit-keyframes inM {
	50% {
		-webkit-transform: rotate(0deg);
	}

	100% {
		-webkit-transform: rotate(45deg);
		background-color: rgb(var(--primary-color));
	}
}

@keyframes inM {
	50% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(45deg);
		background-color: rgb(var(--primary-color));
	}
}

@-webkit-keyframes outM {
	50% {
		-webkit-transform: rotate(0deg);
		background-color: rgb(var(--secondary-color));
	}

	100% {
		-webkit-transform: rotate(45deg);
	}
}

@keyframes outM {
	50% {
		transform: rotate(0deg);
		background-color: rgb(var(--secondary-color));
	}

	100% {
		transform: rotate(45deg);
	}
}

@-webkit-keyframes inT {
	0% {
		-webkit-transform: translateY(0px) rotate(0deg);
	}

	50% {
		-webkit-transform: translateY(9px) rotate(0deg);
	}

	100% {
		-webkit-transform: translateY(9px) rotate(135deg);
		background-color: rgb(var(--primary-color));
	}
}

@keyframes inT {
	0% {
		transform: translateY(0px) rotate(0deg);
	}

	50% {
		transform: translateY(9px) rotate(0deg);
	}

	100% {
		transform: translateY(9px) rotate(135deg);
		background-color: rgb(var(--primary-color));
	}
}

@-webkit-keyframes outT {
	0% {
		-webkit-transform: translateY(0px) rotate(0deg);
	}

	50% {
		-webkit-transform: translateY(9px) rotate(0deg);
		background-color: rgb(var(--secondary-color));
	}

	100% {
		-webkit-transform: translateY(9px) rotate(135deg);
	}
}

@keyframes outT {
	0% {
		transform: translateY(0px) rotate(0deg);
	}

	50% {
		transform: translateY(9px) rotate(0deg);
		background-color: rgb(var(--secondary-color));
	}

	100% {
		transform: translateY(9px) rotate(135deg);
	}
}

@-webkit-keyframes inBtm {
	0% {
		-webkit-transform: translateY(0px) rotate(0deg);
	}

	50% {
		-webkit-transform: translateY(-9px) rotate(0deg);
	}

	100% {
		-webkit-transform: translateY(-9px) rotate(135deg);
		background-color: rgb(var(--primary-color));
	}
}

@keyframes inBtm {
	0% {
		transform: translateY(0px) rotate(0deg);
	}

	50% {
		transform: translateY(-9px) rotate(0deg);
	}

	100% {
		transform: translateY(-9px) rotate(135deg);
		background-color: rgb(var(--primary-color));
	}
}

@-webkit-keyframes outBtm {
	0% {
		-webkit-transform: translateY(0px) rotate(0deg);
	}

	50% {
		-webkit-transform: translateY(-9px) rotate(0deg);
		background-color: rgb(var(--seconary-color));
	}

	100% {
		-webkit-transform: translateY(-9px) rotate(135deg);
	}
}

@keyframes outBtm {
	0% {
		transform: translateY(0px) rotate(0deg);
	}

	50% {
		transform: translateY(-9px) rotate(0deg);
		background-color: rgb(var(--seconary-color));
	}

	100% {
		transform: translateY(-9px) rotate(135deg);
	}
}

@media (max-width: 800px) {

	header .navbar .nav-link {
		font-size: 20px;
	}

	header .navbar .nav-link {
		padding: 8px 10px;
	}

	.navbar-collapse li:not(.nav-item-left) {
		padding-left: 0px;
	}
}

@media (max-width: 575px) {
	.navbar&gt;.container {
		margin: 3vw;
		padding: 0;
	}

	header .navbar-nav {
		background-color: rgb(var(--complimentary-color), 0.8);
	}

	.avatar-menu-container,
	.navbar-collapse ul {
		margin: 0;
		border: 2px solid rgb(var(--primary-color));
		top: -2px;
		z-index: 3;
		width: max-content;
		border-radius: 0px 0px 30px 30px
	}

	.avatar-container {
		right: 0;
		top: 0;
		margin: 3vw;
	}

	.avatar {
		top: 3vw;
		background-color: rgba(var(--primary-color), 0.8);
		border: rgba(var(--secondary-color)) solid;
		width: calc(2rem + 4vw);
		height: calc(2rem + 4vw);
	}

	.avatar svg path {
		fill: rgb(var(--secondary-color));
	}

	.avatar-menu {
		margin: 0;
		padding: 0;
	}

	.avatar-menu a {
		font-size: calc(1rem + 0.8vw);
		padding: 8px 10px;
	}

	.avatar-menu li {
		padding: 0;
		padding-right: 5px !important;
	}

	.navbar-collapse li {
		padding-left: 5px !important;
	}

	header .navbar .nav-link {
		font-size: calc(1rem + 0.8vw);
	}

	.avatar.invert-colors {
		border: rgba(var(--primary-color)) solid;
		background-color: rgba(var(--complimentary-color), 0.8) !important;
	}

	.avatar.invert-colors svg path {
		fill: rgb(var(--primary-color));
	}
}

@media (min-width: 992px) {
	#mainNav {
		transition: background-color 0.2s;
		/* Force Hardware Acceleration in WebKit */
		transform: translate3d(0, 0, 0);
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
	}

	#mainNav.is-fixed {
		/* when the user scrolls down, we hide the header right above the viewport */
		position: relative;
		top: -57.5px;
		transition: transform 0.2s;
	}


	#mainNav.nav-is-visible .navbar-nav {
		background-color: rgba(var(--complimentary-color), 0.7);
		transition: background-color 0.2s;
		border-radius: 0px 0px 30px 30px;
	}



	#mainNav.is-fixed .navbar-nav&gt;li.nav-item&gt;a:focus,
	#mainNav.is-fixed .navbar-nav&gt;li.nav-item&gt;a:hover {
		color: var(rbg(--primary-color));
	}

	#mainNav.nav-is-visible {
		/* if the user changes the scrolling direction, we show the header */
		transform: translate3d(0, 100%, 0);
	}

}</pre></body></html>