/*NAVIGATION  NAVIGATION  NAVIGATION  NAVIGATION  NAVIGATION  NAVIGATION*/
.navbar-default {
  background-color: rgba(255, 255, 255, .6);
  border: none;
}
.navbar-default .navbar-brand {
  color: #ddd;
}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus {
  background-color: rgba(40, 200, 230, .5);
  transition: all 100ms linear;
}
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {
  background-color: rgba(40, 200, 230, .5);
}
.navbar-default .navbar-nav>.active>a:hover {
  background-color: rgba(40, 200, 230, .9);
  transition: all 300ms linear;
}
.navbar-default .navbar-toggle {
  border-color: transparent;
}
.navbar-default .navbar-toggle:visited {
  background-color: #f50;
}
.navbar-default .navbar-toggle:hover {
  background-color: #333;
}
.navbar-default .navbar-toggle:active {
  background-color: #eef;
}
.navbar-default .navbar-toggle:focus {

}
.navbar-default .navbar-toggle .icon-bar {
  background-color: rgba(70, 70, 70, .9);
}
.active {
  background-color: #09f !important;
  color: #eee !important;
}
.brand_active {
  color: #09f !important;
}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
  background-color: transparent; !important;
}
.navbar-default {
  transition: background-color 500ms linear;
}
.navbar-default .navbar-nav>li>a {
  transition: color 1000ms linear;
}


@media screen and (max-width: 767px) {
  #navbar ul li {
    background-color: rgba(40, 180, 230, .9) !important;
  }
  #navbar ul li a:hover {
    background-color: #fff !important;
    color: rgba(40, 180, 230, 1) !important;
  }
}