$b: 'top_static_menu';

.#{$b} {
  text-transform: uppercase;
  font-size: 12px;
  font-weight: bold;


}

.#{$b}__logo {
    display: inline-block;
    float: left;
    //margin: 10px 0 0;
    padding: 0 22px;
    background: url(image_path('tanol_small_logo.png')) no-repeat transparent;
    font-size: 18px;
    @include sff;
}
.#{$b}__logo-inner {
      vertical-align: middle;
      line-height: 30px;
}

.#{$b}__telephone {
  color: white;
  margin-top: 10px;
  margin-bottom: -10px;
  text-align: right;
  font-weight: normal;
  & a, &a:hover { color: orange; }
  & span { display: inline-block; }
}
.navbar-default .navbar-nav > li {

  outline: none;
  & > a.#{$b}__make-order {
    &, &:hover, &:focus { font-size: 1.2em; color: orange; outline: none; }
  }
}
@media (min-width: 768px) {
  .dropdown .dropdown-menu {
      -webkit-transition: all 0.3s;
      -moz-transition: all 0.3s;
      -ms-transition: all 0.3s;
      -o-transition: all 0.3s;
      transition: all 0.3s;

      max-height: 0;
      display: block;
      overflow: hidden;
      opacity: 0;
      & li a:hover { transition: all 0.3s; }
  }

  .dropdown:hover .dropdown-menu {
      max-height: 700px;
      opacity: 1;
  }
}

@media (max-width: 1199px) {
}

@media (max-width: 991px) {
  .#{$b} .navbar-right > li >a { padding-left: 7px; padding-right: 7px; font-size: 11px; }
}

@media (max-width: 767px) {
  .#{$b}__telephone { position: absolute; right: 75px; top: 7px;  }
  .#{$b}__logo { margin-top: 10px; }
}
@media (max-width: 467px) {
  .#{$b}__telephone { width: 190px; top: -2px; }
}


$bgDefault      : rgba(20, 20, 20, 0.9);;
$bgHighlight    : orange - #222;
$colDefault     : #ffffff;
$colHighlight   : #ffffff;
$dropDown       : true;
.navbar-default {
  background-color: $bgDefault;
  border-color: $bgHighlight;
  background-image: none;
  background-repeat: no-repeat;
  box-shadow: none;
  border-radius: 0;
  border: none;
  .navbar-brand {
    color: $colDefault;
    &:hover, &:focus {
      color: $colHighlight; }}
  .navbar-text {
    color: $colDefault; }
  .navbar-nav {
    > li {
      > a {
        color: $colDefault;
        &:hover,  &:focus {
          color: $colHighlight; }}
      @if $dropDown {
        > .dropdown-menu {
          background-color: $bgDefault;
          background-image: none;
          background-repeat: no-repeat;
          > li {
            > a {
              color: $colDefault;
              &:hover,  &:focus {
                color: $colHighlight;
                background-color: $bgHighlight;
                background-image: none;
                background-repeat: no-repeat;
                }}
            &.divider {
              background-color: $bgHighlight;
              background-image: none;
              background-repeat: no-repeat;}}}}}
    @if $dropDown {
      .open .dropdown-menu > .active {
        > a, > a:hover, > a:focus {
          color: $colHighlight;
          background-color: $bgHighlight;
          background-image: none;
          background-repeat: no-repeat;}}}
    > .active {
      > a, > a:hover, > a:focus {
        color: $colHighlight;
        background-color: $bgHighlight;
        background-image: none;
        background-repeat: no-repeat;}}
    > .open {
      > a, > a:hover, > a:focus {
        color: $colHighlight;
        background-color: $bgHighlight;
        background-image: none;
        background-repeat: no-repeat;}}}
  .navbar-toggle {
    border-color: $bgHighlight;
    &:hover, &:focus {
      background-color: $bgHighlight;
      background-image: none;
      background-repeat: no-repeat;
    }
    .icon-bar {
      background-color: $colDefault;
      background-image: none;
      background-repeat: no-repeat;
      }}
  .navbar-collapse,
  .navbar-form {
    border-color: $colDefault;

  }
  .navbar-link {
    color: $colDefault;
    &:hover {
      color: $colHighlight; }}}
@media (max-width: 767px) {
  .navbar-default .navbar-nav .open .dropdown-menu {
    > li > a {
      color: $colDefault;
      &:hover, &:focus {
        color: $colHighlight; }}
    > .active {
      > a, > a:hover, > a:focus {
        color: $colHighlight;
        background-color: $bgHighlight;
        background-image: none;
        background-repeat: no-repeat;

        }}}
}


