// Styles for the NAVBAR

div#navbar {
    padding-left: 0px;
    margin-left: -1rem;
}

nav.navbar {
  background-color: $dark_gray;
  color: $light_gray;
  font-size: 1.2rem;
  letter-spacing: .15rem;
  margin: 0;
  text-transform: uppercase;
  border-radius: 0px;
  border: 0px solid;
}
.navbar-nav>li>a, .logout-button {
  color: $gray!important;
  &:hover, :active, :focus {
    color: $off_white!important;
    font-weight: bold;
    text-decoration: none;
  }
}

.nav-status-buttons {
  display: block;
  margin: 15px;
  float: right;
}

.last-sync {
  margin-right: 30px;
  float: right;
}

.logout-button {
  float: right;
  display: block;
  padding: 15px;
  line-height: 20px;
}

// Mobile Nav Styles

button.navbar-toggle {
  float: left;
  margin: 0;
  border: none;
  color: $gray;
  font-size: 1.6rem!important;
  padding: .4rem 2rem 0 2rem;
  line-height: 4.6rem;
  &:hover {
    background-color: transparent!important;
    color: $off_white
  }
  &:focus {
    background-color: transparent!important;
    color: $off_white
  }
}

div#navbar.navbar-collapse {
  z-index: 9999;
  left: 1rem;
  top: 5rem;
  background: #434343;
  border: 0px;
  width: 100%;
  box-shadow: 0 4px 10px $translucent;
  @media screen and (max-width: 768px) {
    padding: 0 2rem;
    position: absolute;
  }
}