.navbar {
  position: relative;
  display: flex;
  flex-wrap: wrap; /*// allow us to do the line break for collapsing content*/
  align-items: center;
  justify-content: space-between; /*// space out brand from logo*/
  padding: 4px;
  }


/*// Navbar brand
//
// Used for brand, project, or site names.*/

.navbar-brand {
    position: relative;
    display: inline-block;
  padding-top: 25px;
  padding-bottom: 20px;
  margin-left: 0%;
  margin-right: 5px;
  text-decoration: none;
  white-space: nowrap;
  width: 300px;
  height: auto;
}
  .navbar-brand,
  .navbar-brand:focus {
    color: green;
    text-decoration: white;
  }


/*// Navbar nav
//
// Custom navbar navigation (doesn't require `.nav`, but does make use of `.nav-link`).*/

.navbar-nav {
  display: flex;
  flex-direction: column; /*// cannot use `inherit` to get the `.navbar`s value*/
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
 }
  .nav-lin.active,
   .nav-lin.show {
      color: red;
}


  .dropdown-menu {
    position: static;
  }


/*// Navbar text
//
//*/

.navbar-text {
  padding-top: 5px;
  padding-bottom: 5px;
  color: fuchsia;
}

  a,
  a:hover,
  a:focus  {
    color: silver;
  }


/*// Responsive navbar
//
// Custom styles for responsive collapsing and toggling of navbar contents.
// Powered by the collapse Bootstrap JavaScript plugin.

// When collapsed, prevent the toggleable navbar contents from appearing in
// the default flexbox row orientation. Requires the use of `flex-wrap: wrap`
// on the `.navbar` parent.*/
.navbar-collapse {
  flex-basis: 100%;
  flex-grow: 1;
  /*// For always expanded or extra full navbars, ensure content aligns itself
  // properly vertically. Can be easily overridden with flex utilities.
  align-items: center;*/
}

/*// Button for toggling the navbar when in its collapsed state*/
.navbar-toggler {
  padding: 10px;
  line-height: 1;
  color: salmon;
  background-color: transparent; /*// remove default button style*/
  border: none;
  }

  .navbar-toggler:hover {
    text-decoration: none;
  }

  .navbar-toggler:focus {
    text-decoration: none;
    outline: 0;
    box-shadow: 0 0 0 3px;
  }

/*// Keep as a separate element so folks can easily override it with another icon
// or image file as needed.*/
.navbar-toggler-icon {
  display: inline-block;
  width: 1.5em;
  height: 1.5em;
  vertical-align: middle;
  /*background-image: var(--#{$prefix}navbar-toggler-icon-bg);*/
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
}

.navbar-nav-scroll {
  max-height: 75vh;
  overflow-y: auto;
}

/*// scss-docs-start navbar-expand-loop
// Generate series of `.navbar-expand-*` responsive classes for configuring
// where your navbar collapses.*/
.navbar-expand {
    flex-wrap: nowrap;
    justify-content: flex-start;
}

.navbar-nav {
    flex-direction: row;
}

.dropdown-menu {
    position: absolute;
}

.nav-link {
    padding-right: 3px;
    padding-left: 3px;
}

.navbar-nav-scroll {
    overflow: visible;
}

.navbar-collapse {
    position: absolute;
    display: flex !important; /* // stylelint-disable-line declaration-no-important*/
    flex-basis: auto;
    right: 0px;
}

.navbar-toggler {
    display: none;
}

.offcanvas {
    /*// stylelint-disable declaration-no-important*/
    position: static;
    z-index: auto;
    flex-grow: 1;
    width: auto !important;
    height: auto !important;
    visibility: visible !important;
    background-color: transparent !important;
    border: 0 !important;
    transform: none !important;
}

.offcanvas-header {
    display: none;
}

.offcanvas-body {
    display: flex;
    flex-grow: 0;
    padding: 0;
    overflow-y: visible;
}

/*// scss-docs-end navbar-expand-loop*/

/*// Navbar themes
//
// Styles for switching between navbars with light or dark background.*/