﻿/*** NAVIGATION ***/

.category-navigation .listbox {
  padding: 10px 0px;
}

.category-navigation > ul {
  display: block !important;
  /* prevents toggle display:none on resize */
  font-size: 0;
}

  .category-navigation > ul.mobile {
    display: none !important;
  }

  .category-navigation > ul > li {
    display: inline-block;
    border-left: 1px solid #ddd;
    padding: 0 15px;
    vertical-align: middle;
  }

    .category-navigation > ul > li:first-child {
      border-left: none;
    }

    .category-navigation > ul > li > a {
      display: block;
      padding: 5px 10px;
      line-height: 20px;
      font-size: 17px;
      /*reset zeroing*/
      color: #555;
      cursor: pointer;
    }

      .category-navigation > ul > li > a:hover {
        color: #4ab2f1;
      }

.category-navigation .plist {
  background-color: #fff;
  /* padding         : 10px 0; */
  text-align: left;
  border: 1px solid #7db531;
}

  .category-navigation .plist li {
    position: unset;
  }

    .category-navigation .plist li a {
      display: block;
      position: relative;
      padding: 6px 10px 6px 15px;
      font-size: 15px;
      color: #444;
    }

    .category-navigation .plist li:hover > a {
      background-color: #f8f8f8;
      color: #f77e22;
      font-weight: bold;
    }

  .category-navigation .plist > li:hover > a {
    border-left: 2px solid #7db531;
  }

.category-navigation ul li:hover > .plist {
  display: block;
}


.category-navigation ul li .plist {
  display: none;
}

.category-navigation .plist .sublist {
  top: 42px;
  left: 92% !important;
  white-space: nowrap;
  /* border     : 1px solid #7db531; */
  z-index: 5;
}

.side-2 .category-navigation .plist .sublist-content {
  border: 0;
}

.category-navigation .plist .sublist-content {
  /* height: inherit; */
  /* max-height: calc(100vh - 80px); */
  height: 696px;
  overflow-y: scroll;
  background: #fff;
  box-sizing: border-box;
  padding: 10px 0;
  border: 1px solid #7db531;
}

.category-navigation .plist .icon_head {
  vertical-align: middle;
}

/* sublist */

.category-navigation .sublist {
  display: none;
  position: absolute;
  min-Width: 290px;
  width: auto;
  box-shadow: none;
  /* background-color: #fff; */
  /* padding         : 10px 0; */
  text-align: left;
  z-index: 10;
  margin: 0px !important;
}

.category-list .category-navigation .sublist li {
  position: unset;
}

.category-navigation .sublist li a {
  display: block;
  position: relative;
  padding: 10px 20px 10px 30px;
  font-size: 14px;
  color: #444;
}


.category-navigation .sublist li:hover > a {
  background-color: #f8f8f8;
  color: #f77e22;
  border-left: 2px solid #7db531;
}


.category-navigation ul li:hover > .sublist {
  display: block;
  background: transparent;
  padding-bottom: 100vh;
}

  .category-navigation ul li:hover > .sublist .sublist-content {
    height: inherit;
    max-height: 650px;
  }


.category-navigation .sublist .sublist {
  top: 0px;
  left: 94% !important;
}

.cate-close-btn {
  text-align: right;
  margin-right: 12px;
  color: #7db531;
}

  .cate-close-btn > span {
    cursor: pointer;
    font-size: 20px;
  }

.side-2 .cate-close-btn {
  display: none;
}


.category-navigation .plist .sublist .sublist-content {
  margin-left: 18px;
}

.side-2 .category-navigation .plist .sublist-content {
  height: inherit;
  overflow-y: unset;
  position: relative;
}

.side-2 .category-navigation .plist li {
  position: relative;
}

.side-2 .category-navigation .plist .sublist {
  top: -11px;
  left: 100% !important;
  background: #fff;
  border: 1px solid #7db531;
  padding: 10px 0;
}

  .side-2 .category-navigation .plist .sublist .sublist-content {
    margin-left: 0;
    padding: 0;
    max-height: unset;
  }


@media (min-width: 1001px) and (max-width:1366px) {
  .category-navigation .plist .sublist-content {
    height: 640px;
  }

  .category-navigation ul li:hover > .sublist .sublist-content {
    height: inherit;
    max-height: 605px;
  }
}
