.menu-top {
  display: block;
  position: relative;
  font-size: 0;
  line-height: 0;
  width: 100%;
  background: #333333; }
  .menu-top:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    background: #333333;
    z-index: 15;
    right: -100%;
    left: -100%; }
    @media only screen and (max-width: 992px) {
      .menu-top:before {
        display: none; } }
  @media only screen and (max-width: 992px) {
    .menu-top {
      background: #2b2b2b; } }
  .menu-top__back {
    display: none; }
    @media only screen and (max-width: 992px) {
      .menu-top__back {
        display: block;
        position: relative;
        z-index: 1;
        color: #a7abb4;
        padding: 0 20px;
        font: 400 14px/40px "Arial", sans-serif;
        transition: all 0.3s ease;
        cursor: pointer; }
        .menu-top__back:before {
          content: '';
          background-image: url(/local/static/build/img/sprite/sprite.png);
          background-position: -112px -54px;
          width: 7px;
          height: 4px;
          -ms-transform: rotate(90deg);
          transform: rotate(90deg);
          position: absolute;
          left: 6px;
          top: calc(50% - 2px); }
        .menu-top__back:hover {
          background: #333333; } }
  .menu-top__item {
    display: inline-block;
    font: 400 16px/40px "Arial", sans-serif;
    color: #a7abb4;
    background: transparent;
    transition: all 0.3s ease; }
    @media only screen and (max-width: 992px) {
      .menu-top__item {
        display: block;
        width: 100%;
        border: 0 none;
        position: relative;
        border-bottom: 1px solid #242424; }
        .menu-top__item:first-child {
          border-left: 0 none; } }
  .menu-top__item .menu-top__item-name {
    border-right: 1px solid #242424; }
  .menu-top__item:first-child .menu-top__item-name {
    border-left: 1px solid #242424; }
  .menu-top__item-href {
    text-decoration: none;
    color: #a7abb4;
    transition: all 0.3s ease; }
    .menu-top__item-href:hover, .menu-top__item-href:focus, .menu-top__item-href:active {
      color: #ffffff; }
  .menu-top__item-name {
    position: relative;
    z-index: 17;
    padding: 0 20px;
    transition: all 0.3s ease;
    cursor: pointer; }
    .menu-top__item-name:hover, .menu-top__item-name:focus, .menu-top__item-name:active {
      background: #242424; }
    .menu-top__item-name--down:after {
      content: '';
      position: relative;
      display: inline-block;
      background-image: url(/local/static/build/img/sprite/sprite.png);
      background-position: -112px -54px;
      width: 7px;
      height: 4px;
      vertical-align: middle;
      margin: 0 0 0 5px;
      z-index: 20; }
      @media only screen and (max-width: 992px) {
        .menu-top__item-name--down:after {
          -ms-transform: rotate(-90deg);
          transform: rotate(-90deg);
          position: absolute;
          right: 15px;
          top: 17px; } }
  .menu-top__down {
    position: absolute;
    width: 100%;
    top: -100%;
    left: 0;
    transition: all 0.3s ease;
    z-index: 1; }
    .menu-top__down:before {
      content: '';
      position: absolute;
      left: -100%;
      right: -100%;
      top: 0;
      bottom: 0;
      background: #242424; }
    @media only screen and (max-width: 992px) {
      .menu-top__down {
        padding: 0;
        top: 0 !important;
        left: -100%;
        position: fixed;
        bottom: 0;
        z-index: 1001;
        overflow-y: auto;
        overflow-x: hidden;
        width: 270px;
        opacity: 0;
        transition: left .3s ease, opacity .3s ease;
        background: #2b2b2b; }
        .menu-top__down.active {
          opacity: 1;
          left: 0; } }

@media only screen and (max-width: 992px) {
  .menu-top__item--podmenu.active .menu-top__down {
    opacity: 1;
    left: 0; } }

.menu-top__item--podmenu:hover .menu-top__down {
  top: 40px; }
  @media only screen and (max-width: 992px) {
    .menu-top__item--podmenu:hover .menu-top__down {
      top: 0; } }

.menu-top__item--podmenu:hover .menu-top__item-name--down {
  background: #242424; }

.menu-top-down {
  position: relative;
  display: block;
  width: 100%;
  z-index: 1; }
  .menu-top-down__item {
    display: inline-block;
    padding: 0 20px 0 0;
    transition: all 0.3s ease; }
    .menu-top-down__item a {
      transition: all 0.3s ease;
      font: 400 12px/40px "Arial", sans-serif;
      color: #a7abb4;
      display: inline-block; }
      .menu-top-down__item a:hover, .menu-top-down__item a:focus, .menu-top-down__item a:active {
        color: #ffffff; }
      @media only screen and (max-width: 992px) {
        .menu-top-down__item a {
          display: block; } }
    @media only screen and (max-width: 992px) {
      .menu-top-down__item {
        display: block;
        padding: 0 20px;
        border-bottom: 1px solid #333333; }
        .menu-top-down__item:hover {
          background: #333333; } }
