

.navbar {
	--cnvs-navbar-width: 17.6rem;
	--bs-scroll-height: 15.5rem;
	--cnvs-navbar-offset: 1.5rem;
	--cnvs-navbar-bg: var(--bs-gray-100);
	--cnvs-navbar-link: var(--bs-dark);
	--cnvs-navbar-linecolor: var(--bs-gray-300);
	--cnvs-navbar-logo-color: var(--cnvs-navbar-link);
	--cnvs-navbar-border-radius: 10px;
	--bs-navbar-padding-x: 15px;
	--bs-navbar-color: var(--cnvs-contrast-0);
	--bs-navbar-toggler-bg: var(--cnvs-contrast-1000);
	position: absolute;
	width: var(--cnvs-navbar-width);
	top: var(--cnvs-navbar-offset);
	right: var(--cnvs-navbar-offset);
	left: auto;
	border-radius: var(--cnvs-navbar-border-radius);
	background-color: var(--cnvs-navbar-bg);
	transition: all .4s;
}


.navbar button {
	background-color: transparent;
	color: #2c3034;
	font-weight: 600;
}

#navbarScroll {

}

.navbar .line {
	border-color: var(--cnvs-navbar-linecolor);
	transition: border-color .3s;
}

.navbar-brand {
	color: var(--cnvs-navbar-logo-color) !important;
	transition: color .3s;
}

.navbar-collapse .nav-link {
	opacity: 0;
	transition: opacity .3s .03s ease;
}

.navbar-collapse.show .nav-link {
	opacity: 1;
	transition: opacity .3s ease;
}

.navbar-nav {
	--bs-nav-link-padding-y: .5rem;
	--bs-nav-link-font-size: 1.125rem;
	--bs-nav-link-color: var(--cnvs-navbar-link);
	--bs-nav-link-hover-color: var(--bs-nav-link-color);
	--bs-nav-link-font-weight: 600;
}

.navbar-nav ul .nav-link {
	--bs-nav-link-padding-x: 1.5rem;
	--bs-nav-link-font-size: 1rem;
	--bs-nav-link-font-weight: 400;
}

.navbar-toggler {
	--bs-navbar-toggler-padding-x: 1.25rem;
	--bs-navbar-toggler-padding-y: .5rem;
	--bs-navbar-toggler-font-size: .975rem;
	--bs-border-width: 0;
	--bs-navbar-toggler-focus-width: 0;
	background-color: var(--bs-navbar-toggler-bg);
}

.navbar .footer-text {
	color: var(--cnvs-navbar-link);
}

/* After Open */
.navbar-collapse-open .navbar {
	--cnvs-navbar-width: 20rem;
	--cnvs-navbar-bg: var(--bs-dark);
	--cnvs-navbar-link: var(--bs-light);
	--cnvs-navbar-linecolor: var(--bs-gray-800);
	--bs-navbar-color: var(--cnvs-contrast-1000);
	--bs-navbar-toggler-bg: var(--cnvs-contrast-0);
}

.navbar-collapse-open .navbar-nav {
	--bs-nav-link-hover-color: var(--cnvs-contrast-400);
}



