@front10/landing-page-book/dist/components/Navbar/style.css

A react library for landing page

:root {
  --Navbar-backgroundImage: none;
  --Navbar--backgroundColor: rgba(250, 250, 250, 0.9);
  --Navbar--boxShadow: rgba(0, 0, 0, 0.124); }

:root {
  --Image-boxShadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15); }

.img-shadow {
  box-shadow: var(--Image-boxShadow); }

.Navbar {
  background-image: var(--Navbar-backgroundImage); }
  .Navbar .NavbarLink,
  .Navbar .Navbar__Toggler,
  .Navbar .NavbarBrand {
    cursor: pointer; }
    @media (max-width: 768px) {
      .Navbar .NavbarLink img,
      .Navbar .Navbar__Toggler img,
      .Navbar .NavbarBrand img {
        padding: 0rem 1rem; } }
  .Navbar .NavbarBrand .Logo {
    max-height: 60px; }
  .Navbar .LanguageSwitcher,
  .Navbar .nav-item {
    padding: 0.5rem 1rem; }
    .Navbar .LanguageSwitcher .flag-select,
    .Navbar .nav-item .flag-select {
      padding: 0.5rem 0rem; }
      .Navbar .LanguageSwitcher .flag-select .selected--flag--option,
      .Navbar .nav-item .flag-select .selected--flag--option {
        padding: 0px; }

.Navbar--transparent {
  background-color: transparent; }

.Navbar.navbar-down {
  box-shadow: 0 0 4px var(--Navbar--boxShadow), 0 4px 8px var(--Navbar--boxShadow); }

.Navbar.Navbar--transparent.navbar-down {
  background-color: var(--Navbar--backgroundColor) !important; }

@media (min-width: 768px) {
  .navbar-expand-md .navbar-nav .nav-link {
    padding-right: 0px;
    padding-left: 0px; } }