.nav-container {
  position: relative;
  z-index: 2;
  display: none;
}
.sidebar  .nav-container {
  margin-bottom: 25px;
  display: block;
  border: 1px solid #e0dfdf;
  background: #fdfdfd;
  padding:3px;
  border-radius: 6px;
}
.block.nav-container .block-title {margin-bottom: 0; padding: 0; border: 0;}

 @media only screen and (min-width: 980px) {
    .sf-menu-phone.item {display: block !important; margin: 0;}
    #menu-icon {display: none !important;}
    .sf-menu-phone {display: none !important;}
  }
 @media only screen and (max-width: 979px) { 
   .sf-menu-phone.item,
   .nav-container.block {display: none !important;}
   .nav-container {display: block;}
 }
 /*-------------------- menu icon --------------------------*/
  .sf-menu,
  .sf-menu-phone {display: none;}
  /* menu icon */
  .menu-icon-bg {
    border: 1px solid #e0dfdf;
    background: #fdfdfd;
    padding:3px;
    border-radius: 6px;
  }
  #menu-icon {
    display: block;
    background: url("../images/block-title.gif") repeat-x scroll center top #F9F9F9;
    font-size: 22px;
    line-height: 54px;
    color: #62b303;
    cursor: pointer;
    font-weight: 600;
    padding: 0 15px;
    height:54px;
    border: 1px solid #e0dfdf;
    border-radius: 6px;
    position: relative;
  }
  #menu-icon:after {
    content: ".";
    font-size: 0;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: url(../images/menu-icon-bg.png) 96% 16px no-repeat;

 }

  #menu-icon.active:after { background-position: 96% -42px;  }

  .sf-menu-phone {
    position: relative;
    z-index: 2;
    padding: 9px 18px;
  }
  .sf-menu-phone li { position: relative;  }
  .sf-menu-phone > li { border-bottom:1px solid #e0dfdf; padding: 11px 0; }
  .sf-menu-phone > li.last {border: 0;}
  .sf-menu-phone > li > a { 
      border-top: 0;
      font-size: 16px;
      font-weight: normal;
      display:inline-block;  
      color: #424141;
      text-transform: capitalize;
  }
  .sf-menu-phone li li a {color: #969696; font-size: 14px; }
  .sf-menu-phone li li a:before {content: "\f10c"; font-size: 12px; line-height: 20px; color: #62b303; margin-right: 8px;}
  .sf-menu-phone li li { padding:3px 0 3px  0; }
  .sf-menu-phone li li li {padding-left: 10px;}
  .sf-menu-phone li > a:hover,
  .sf-menu-phone li.active > a,
  .sf-menu-phone li.act > a { color: #62b303; }
  .sf-menu-phone li li.active a:before,
  .sf-menu-phone li li.act a:before,
  .sf-menu-phone li li a:hover:before {color: #424141;}

  .sf-menu-phone li li {font-size: 14px;}
  .sf-menu-phone li li.last { border: 0; }
  .sf-menu-phone > li > strong:after {content: "\f054"; font-size: 16px; color: #62b303; line-height: 30px;}
  .sf-menu-phone li strong {
    position: absolute;
    display: block;
    background: url(../images/toogle-button2.png) center -54px no-repeat;
    top: 2px;
    right: 0;
    height: 35px;
    width: 30px;
  }
  .sf-menu-phone li strong:hover { cursor: pointer; }
  .sf-menu-phone li strong.opened { background-position: center 7px; }
  .sf-menu-phone li.parent.active > ul {display: block;}
  .sf-menu-phone > li > strong { right: 0px; top: 5px; text-align: right; background: none;}
  .sf-menu-phone > li > strong.opened { }

  .sf-menu-phone > li.parent.active > strong { }
  .sf-menu-phone > li.parent.active > strong.opened { }

  .sf-menu-phone li li.parent.active > strong {background-position: center 7px; }
  .sf-menu-phone li li.parent.active > strong.opened {background-position: center -54px; }


  /* dropdown */
  .sf-menu-phone ul {  width: auto;  padding:10px;  display: none;  }
  .sf-menu-phone ul ul {padding:10px; }
  .sf-menu-phone > li.active > a > span {color: inherit;}
@media only screen and (min-width: 768px) and (max-width: 979px) {
  .sf-menu-phone ul {padding: 10px;}
  .sf-menu-phone li li a {font-size: 12px;}
  .sf-menu-phone > li > a {font-size: 15px;}
}