.navbar {
--bs-navbar-padding-x:
3
rem;
--bs-navbar-padding-y:
2
rem;
--bs-navbar-
color
: rgba(
0
,
0
,
0
,
0.55
);
--bs-navbar-hover-
color
: rgba(
0
,
0
,
0
,
0.7
);
--bs-navbar-disabled-
color
: rgba(
0
,
0
,
0
,
0.3
);
--bs-navbar-active-
color
: rgba(
0
,
0
,
0
,
0.9
);
--bs-navbar-brand-padding-y:
1.2
rem;
--bs-navbar-brand-margin-end:
1
rem;
--bs-navbar-brand-
font-size
:
1.7
rem;
--bs-navbar-brand-
color
: rgba(
0
,
0
,
0
,
0.9
);
--bs-navbar-brand-hover-
color
: rgba(
0
,
0
,
0
,
0.9
);
--bs-navbar-nav-link-padding-x:
2
rem;
--bs-navbar-toggler-padding-y:
1
rem;
--bs-navbar-toggler-padding-x:
2
rem;
--bs-navbar-toggler-
font-size
:
2
rem;
--bs-navbar-toggler-icon-bg:
url
("data:image/svg+xml,
viewBox=
'0 0 30 30'
%
3
e%
3
cpath
stroke=
'rgba%280, 0, 0, 0.55%29'
stroke-linecap=
'round'
stroke-miterlimit=
'10'
stroke-width=
'2'
d=
'M4 7h22M4 15h22M4 23h22'
/%
3
e%
3
c/svg%
3
e");
--bs-navbar-toggler-
border-color
: rgba(
0
,
0
,
0
,
0.1
);
--bs-navbar-toggler-border-radius:
2
rem;
--bs-navbar-toggler-focus-
width
:
2
rem;
--bs-navbar-toggler-transition: box-shadow
3
s ease-in;
position
:
relative
;
display
: flex;
flex-wrap: wrap;
align-items:
center
;
justify-
content
: space-between;
padding
: var(--bs-navbar-padding-y) var(--bs-navbar-padding-x);
}
.navbar-dark {
--bs-navbar-
color
:
white
;
--bs-navbar-hover-
color
:
black
;
--bs-navbar-disabled-
color
:
rgb
(
93
,
182
,
133
);
--bs-navbar-active-
color
:
black
;
--bs-navbar-brand-
color
:
black
;
--bs-navbar-brand-hover-
color
:
black
;
--bs-navbar-toggler-
border-color
:
white
;
--bs-navbar-toggler-icon-bg:
url
("data:image/svg+xml,
viewBox=
'0 0 30 30'
%
3
e%
3
cpath stroke=
'white'
stroke-linecap=
'round'
stroke-miterlimit=
'10'
stroke-width=
'2'
d=
'M4 7h22M4 15h22M4 23h22'
/%
3
e%
3
c/svg%
3
e");
}