.header-box {
  padding: 30px 0;
}
.height_99 {
  width: 100%;
  position: relative;
  height: 99px;
}
.logo-wr {
  text-align: center;
  a {
    img {
      max-width: 100%;
      @include Transition(0.05);
      &:active {
        @include Scale(1.05);
      }
    }
  }
  span {
    color: $MenuSepBg;
    font-size: 11px;
    font-weight: 400;
    line-height: 12px;
    display: block;
    margin-top: 1px;
  }
}
/***выбор города***/
.cities-wr {
  color: $color2;
  text-align: center;
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
  .cities-tile {
    i {
      font-style: normal;
    }
  }
  .addCity {
    padding-left: 19px;
    position: relative;
    color: $link-color;
    cursor: pointer;
    i {

    }
    &:before {
      width: 9px;
      height: 5px;
      background: url("../images/ico-all/arrow-down-small-blue.png") 50% 50%;
      position: absolute;
      left: 5px;
      top: 50%;
      margin-top: -2px;
      content: '';
    }
    &:hover {
      .hidden_shops {
        display: block !important;
      }
    }
  }
}
.hidden_shops {
  display: none;
  position: absolute;
  top: 3px;
  left: 50%;
  z-index: 2;
  $w:150;
  width: $w + px;
  margin-left: -(($w/2)-9) + px;
  ul {
    margin-top: 20px;
    @include Shadow2;
    background: #fff;
    width: 100%;
    float: left;
    padding: 15px 10px;
    li {
      &.active {
        display: none;
      }
    }
  }
}
.phones_content  {
  display: none;
}
/***end города***/
@mixin ArrowMenu($wid,$hei) {
  width: $wid + px;
  height: $hei + px;
  background: url("../images/ico-all/arrow-down.png") 50% 50% no-repeat;
  content: '';
  position: absolute;
  top: 50%;
  margin-top: -($hei/2) +px;
  @include Transition(0.3)
}
$heightMenu: 52px;
$attachmentHeight:26px;
.section-box-menu {
  background: $Menu-bg;
  height: $heightMenu;
}

.menu-second {
  ul {
    width: 100%;
    display: table;
    li {

      list-style: none;
      display: table-cell;
      text-align: center;
      height: $heightMenu;
      border-right: 1px solid $MenuSepBg;
      position: relative;
      &:first-child {
        border-left: 1px solid $MenuSepBg;
      }
      a {
        font-weight: 700;
        text-transform: uppercase;
        color: #fff;
        line-height: $heightMenu;
        height: $heightMenu;
        display: block;
        &:hover {
          text-decoration: none;
          background: $MenuSepBg;
          @include Transition(0.1)
        }
        &:active {
          background: $color2;
        }
      }
      ul {
        display: none;
      }
      &:hover {
        ul {
          display: block;
          width: 100%;
          float: left;
          position: absolute;
          left: 0;
          top: $heightMenu;
          z-index: 8;
          background: $Menu-bg;
          @include Shadow2;
          li {
            width: 100%;
            float: left;
            height: $attachmentHeight;
            border-left: 0;
            border-right: 0;
            a {
              line-height: $attachmentHeight;
              height: $attachmentHeight;
              font-weight: normal;
              &:before {
                display: none;
              }
            }
          }
        }
      }
    }
    li.sail-menu {
      position: relative;

      a {
        padding-right: 9px;
        position: relative;
        &:before {
          @include ArrowMenu(9, 5);
          right: 15px;
        }
        &:hover:before{
          @include Rotate(180);
        }
      }
    }

  }
}
.catalog-link {
  span {
    text-transform: uppercase;
    font-weight: 700;
    color: #fff;
    height: $heightMenu;
    line-height: $heightMenu;
    padding-left: 20px;
  }

  a {
    text-transform: uppercase;
    font-weight: 700;
    color: #fff;
    height: $heightMenu;
    line-height: $heightMenu;
    padding-left: 20px;
  }
  .arrow-catalog {
    cursor: pointer;
    position: relative;
    display: block;

    i {
      position: relative;
      &:before {
        @include ArrowMenu(9, 5);
        right: -18px;
      }
    }
    &.active {
      i {
        &:before{
          @include Rotate(180);
        }
      }
    }

  }
}

/*****меню главная****/
.main-menu {
  @include wfl;
  ul {
    @include wfl;
    li {
      @include wfl;
      position: relative;
      z-index: 8;
      a {
        z-index: 8;
        position: relative;
        color: $main-color;
        padding: 14px 45px 14px 20px;
        background: $Main-bg;
        display: block;
        border-top: 1px solid #fff;
        line-height: 16px;
        &:before {
         @include ArrowMenu(5, 9);
          right: 20px;
          background: url("../images/ico-all/arrow-right.png") 50% 50% no-repeat;
          @include Transition(0);
        }

        &:hover {

          text-decoration: none;
        }
        &:active {
          background: $MenuSepBg !important;
        }
      }
      &.not-list {
        a {
          &:before {
            display: none;
          }
        }
      }
      &.active {
        a {
          background: $Menu-bg !important;
          color: #fff;
          &:before {
            @include ArrowMenu(9, 5);
            @include Rotate(-90)
          }
        }
      }
      &:hover {
        a {
          background: $Mein-menu-hover;
        }

        ul {
          display: block;
        }
      }
      //&.hover {
      //  a {
      //    background: $Mein-menu-hover;
      //
      //  }
      //}
      ul {
        display: none;
        position: absolute;
        left: 100%;
        top: 0;
        z-index: 7;
        li {
          a {
            background: $Main-bg !important;
            color: $main-color !important;
            &:before {
              display: none;
            }
            &:hover {
              background: $Mein-menu-hover !important;
            }

          }
        }
      }
    }
  }
  &.full {
    ul {
      li {
        ul {
            background: #fff;
            padding: 20px 0;
            @include Shadow;

          li {
              width: 33%;
            display: inline-block;
            vertical-align: top;
            white-space: normal;
              //padding: 5px 30px 20px 24px;
            &:nth-child(3n+1){
            clear: both;
            }
            a {
              background: none !important;
              border-top: 0;
              padding: 15px 30px 20px 74px;
              font-weight: 700;
              &:hover {
                color: $link-color !important;
              }
              &:active {
              color: $link-active !important;
            }
            }
          }
        }
      }
    }
  }
}

/*****end меню главная****/

/***search***/
.search-header-wr {
  margin-top: 22px;
  .popular-requests {
    margin-top: 5px;
  }
  form {
    overflow: hidden;
    position: relative;
    @include wfl;
  }
  input {
    background: $Main-bg;
    border-bottom: 0;
    border-right:0;
    margin-top: 0;
  }
  textarea {
    background: $Main-bg;
    border-bottom: 0;
    border-right:0;
  }
  button {
    @extend .button-search;
  }
  &.show_search {

  }
}

.button-search {
    position: absolute;
    top: 1px;
    right: 0;
    width: 40px;
    height: 100%;
    background: none;
    @include svgIcon;
  @include contrast(60%);
  text-align: center;


  &:before {
    color: $Mein-menu-hover;
    content: "\e9006";
    font-size: 16px;
    display: block;
  }
  &:hover {
    @include Transition(0.1);
    @include contrast(80%);
  }
  &:active {
    @include contrast(30%);
    &:before {
      @include Scale(1.35);
      @include Transition(0.1);
    }
  }
}
.close_search {
  @include svgIcon;
  position: absolute;
  width: 40px;
  height: 40px;
  top: 0;
  right: 7px;
  line-height:40px;
  text-align:center;
  cursor: pointer;

  &:before {
    content: '\e9008';
    color: $color2;
    font-size: 20px;
  }
}
/***end search***/

/***phones***/
.modal-callback {
  color: #0f6fc7;
  border-bottom: 1px dashed #0f6fc7;
  font-size: 13px;
  cursor: pointer;
  float: right;
  &:hover {border-bottom: 1px dashed $Main-bg;}
  &:active {
    color: $link-active;
  }
}
.header-phones {
  line-height: 14px;
  margin-top: -2px;
  a {
    color: inherit !important;
  }
  p {
    float: left;
    font-size:18px;
    font-weight: 700;
    margin-left: 10px;
    color: inherit;
    &:first-child {margin-left: 15px;}
  }
}
/***end phones***/

/***header-btns***/
.header-btns-wr {
  position: relative;
  .style {
    position: absolute;
    left: 0;
    bottom: -2px;
    &:first-child {
      bottom: auto;
      top: 0;
    }
  }
  a {
    text-align: center;
    color: $color2;
    @include wfl;
    display: block;
    span {
      display: inline-block;
      position: relative;
      @include svgIcon;
      @include Transition(0.15);

      i {
        position: absolute;
        top: -4px;
        right: -9px;
        font-style: normal;
        font-size: 11px;
        background: #fff59e;
        border-radius: 100%;
        line-height: 16px;
        text-align: center;
        min-width: 16px;
        padding: 0 2px;

      }

      &:before {
        color: #6d7276;
        font-size: 16px;
        display: block;
        @include Transition(0.1);
      }
    }
    div {
      @include wfl;
    }
    &:active {
      span {
        &:before {
          @include Scale(1.35);
        }
      }
    }
  }
  .list_wish {
    span {
      &:before {
        font-size: 24px;
        content: "\e9005";
      }
    }
  }

  .list_compare {
    span {
      &:before {
        font-size: 18px;
        content: "\e9004";
      }
    }
  }
  .in_active {
    span {
      &:before {
        color: $link-color;
      }
    }
  }


}
/***end header-btns***/
/***login***/
.login-wr {
  text-align: center;
  overflow: hidden;
  white-space: nowrap;
  position: relative;

  a {
    width: 100%;
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    position: relative;


    div {
      margin-right: 15px;
      vertical-align: middle;
      display: inline-block;
      @include svgIcon;
      &:before {
        content: "\e9007";
        font-size: 16px;
        line-height: 18px;
        color: $ulColor;
        display: block;
      }
    }
    &.is_logged {
      text-transform: none;
      &:before {
        height: 100%;
        width: 18px;
        top: 0;
        right: 0;
        position: absolute;
        content: '';
        @include Gradient-horisontal(rgba(255,255,255,0),#fff);
        @include Transition(0.1);
      }

    }

    &:active {
      div {
        &:before {
          //@include Scale(1.35);
        }
      }
    }
  }
}
/***end login***/
/***header basket***/

  .header-basket-ico {
    width: 38px;
    height: 38px;
    background: $link-color;
    border: 1px solid $link-color;;
    text-align: center;
    display: block;
    border-radius: 100%;
    text-decoration: none !important;
    float: left;
    @include svgIcon;
    position: relative;
    @include Transition(0.3);
    &:before {
      color: #fff;
      font-size: 16px;
      content: "\e9002";
      line-height: 36px;
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      text-align: center;
      @include Transition(0.1);
    }
  }

  .price-header-basket {
    font-size: 18px;
    font-weight: 700;
    color: $main-color;
    span {
      font-weight: 400;
      font-size: 13px;
    }
  }




.header-basket-wr {
  margin-top: 23px;
  height: 38px;
  position: relative;
  float: left;
  width: 100%;
  text-decoration: none !important;
  table {
    margin: 0 auto;
    td {
      vertical-align: middle;
    }
  }
  &:hover {
    .header-basket-ico {
      background: #fff;
      @include Transition(0.2);
      &:before {
        color: $link-color;

      }
    }
  }
  &:active {
    .header-basket-ico {
      border: 1px solid $link-active;
      &:before {
        color: $link-active;
        @include Scale(1.35);
        @include Transition(0.1);
      }
    }
  }
}

.price_num_header_basket {
  height: 38px;
  position: relative;
  vertical-align: middle;
  display: table-cell;
  padding-left: 10px;
}
.price-header-basket, .proucts-num-header-basket {
  line-height: 13px;
  padding-left: 10px;
}

/***end header basket***/
/***menu mob***/
@import "menu-mob";
.btn-menu-mob {

  a {
    $h:42;
    display: block;
    width: 38px;
    height: $h + px;
    float: right;
    text-decoration: none !important;
    text-align: center;
    span {
      text-align: center;
      width: 38px;
      height: $h + px;
      @include svgIcon;
      &:before {
        display: block;
        color: #fff;
        line-height: $h + px;
        font-size: 16px;
        @include Transition(0.05);
      }
    }
    &:active {
      span {
        &:before {
          @include Scale(1.35);
        }
      }
    }

  }
}
a.basket-btn-menu-mob {
  span {
    &:before
    {
      content: "\e9002";
    }
  }
}
a.login-btn-menu-mob {
  span {
    &:before
    {
      content: "\e9007";
    }
  }
}
.search-btn-menu-mob {
  display: none !important;
  span {
    &:before
    {
      content: "\e9006";
    }
  }
}
/***end menu mob***/

@media (max-width: 1200px) {
  /*****меню главная****/
  .main-menu {

    ul {

      li {

        a {

          &:before {

          }
          &:hover {

          }
          &:active {

          }
        }
        &.active {
          a {

            &:before {

            }
          }
        }
        &:hover {
          ul {

          }
        }
        ul {

          li {
            a {

              &:before {

              }
              &:hover {

              }
            }
          }
        }
      }
    }
    &.full {
      ul {
        li {
          ul {

            li {
              width: 50%;
              &:nth-child(3n+1){
                clear: none;
              }
              &:nth-child(2n+1){
                clear: both;
              }
              a {

                &:hover {

                }
              }
            }
          }
        }
      }
    }
  }

  /*****end меню главная****/

  .menu-second {
    ul {

      li {


        &:first-child {

        }
        a {

          &:hover {

          }
          &:active {

          }
        }
        ul {

        }
        &:hover {
          ul {

            li {

              a {

                &:before {

                }
              }
            }
          }
        }
      }
      li.sail-menu {


        a {

          &:before {

            right: 6px;
          }
          &:hover:before{

          }
        }
      }

    }
  }

  .header-basket-ico {
    width: 30px;
    height: 30px;
    &:before {
      line-height: 28px;
    }
  }
  .price-header-basket {
    font-size: 16px;
  }

}

@media (max-width: 991px) {
  .logo-wr {
    br {display: none;}
  }
  .section-box-menu {
    height: 42px;
  }

}
@media (max-width: 970px) {}
@media (max-width: 960px) {

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

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

}

@media (max-width: 920px) {

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

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

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

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

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

}

@media (max-width: 850px) {

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

}

@media (max-width: 800px) {

}

@media (max-width: 790px) {

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

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

}
@media (max-width: 767px) {
  .close_search {
    display: block !important;
  }
  .search-header-wr {
    position: fixed;
    width: 100%;
    left: 0;
    background: #fff;
    padding: 40px 15px 20px 15px;
    z-index: 9;
    margin-top: -100%;
    top: 0;
    @include Transition(0.3);
    &.show_search {
      margin-top: 0;
    }
  }

  .search-btn-menu-mob {
    display: block !important;
  }
  .header-box {
    padding: 15px 0;
  }
  .logo-wr {
    text-align: left;
  }
  .cities-wr {
    text-align: left;
  }
  .height_99 {
    height: 60px;
  }

  .header-phones {
    height: 60px;
    vertical-align: middle;
    display: table-cell;
    float: none;
    line-height: normal;
    p {
      font-size: 18px !important;
      width: 100%;
      text-align: right;
      margin-left: 0;
      &:first-child {
        margin-left: 0;
      }
    }
  }

  .hidden_shops {
    left: 0;
    margin-left: 0;
    padding-left: 5px;
    ul {
      padding-left: 15px;
      padding-right: 15px;
    }
  }
}

@media (max-width: 749px) {

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

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

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

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


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

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

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

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

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

}
@media (max-width: 436px) {
}
@media (max-width: 420px) {

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

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

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

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

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

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

}