.nav {
    /*position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     z-index: 10000;
    */
}
 .nav-container {
     position: fixed;
     top:0;
    /* 1 */
     left: 0;
     z-index: 99;
     overflow-y: auto;
     visibility: hidden;
    /* 2 */
     width: 100%;
     height: calc(100% - 40px);
     min-height: 100%;
     margin: 0;
     padding: 0;
     -webkit-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
     transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
     -webkit-transform: translateX(-100%);
     -ms-transform: translateX(-100%);
     transform: translateX(-100%);
     -webkit-overflow-scrolling: touch;
}
 .nav-container.is-visible {
     visibility: visible;
    /* 1 */
     -webkit-transform: translateX(0);
     -ms-transform: translateX(0);
     transform: translateX(0);
    /* 1 */
}
 .nav-toggle {
     line-height: 1;
     display: inline-block;
     padding:10px;
     border: 0;
     background-color: #9abe43;
     cursor: pointer;
     position: fixed;
     top: 0;
     left: 0;
     z-index: 999;
     border: 1px solid #fff;
}
 .nav-toggle .icon-menu {
     position: relative;
     display: inline-block;
     width: 28px;
     height: 20px;
     vertical-align: middle;
     fill: none;
}
 .icon-menu .line {
     position: absolute;
     left: 0;
     display: block;
     width: 100%;
     height: 4px;
     -webkit-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1.000);
     transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1.000);
     -webkit-transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
     transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1.000);
     background-color: #fff;
}
 .icon-menu .line-1 {
     top: 0;
}
 .is-active .icon-menu .line-1 {
     -webkit-transform: translateY(8px) translateX(0) rotate(45deg);
     -ms-transform: translateY(8px) translateX(0) rotate(45deg);
     transform: translateY(8px) translateX(0) rotate(45deg);
}
 .icon-menu .line-2 {
     top: 50%;
     margin-top: -2px;
}
 .is-active .icon-menu .line-2 {
     opacity: 0;
}
 .icon-menu .line-3 {
     bottom: 0;
}
 .is-active .icon-menu .line-3 {
     -webkit-transform: translateY(-8px) translateX(0) rotate(-45deg);
     -ms-transform: translateY(-8px) translateX(0) rotate(-45deg);
     transform: translateY(-8px) translateX(0) rotate(-45deg);
}
 .nav-menu li:last-child{
     border-right:none!important;
}
 .main_dis{
     font-size:11px;
     width:110px;
}
 .main_m{
     font-size:18px;
     text-transform:uppercase;
}
/*****custum********/
 @media (min-width: 768px) {
     .nav, .nav-container, .nav-container.is-visible {
         position: static;
         top: auto;
         left: auto;
        /*z-index: auto;
        */
         -webkit-transform: translateX(0);
         -ms-transform: translateX(0);
         transform: translateX(0);
    }
     .nav-container, .nav-container.is-visible {
         visibility: visible;
         height: auto;
         min-height: 0;
         overflow-y: visible;
    }
     .nav-toggle {
         display: none;
    }
}
 .nav li {
     display: inline-block;
     position: relative;
     margin: 0 10px;
}
 .nav li a {
     margin: 0;
     color: #fff;
     font-size: 14px;
     transition: all 0.2s ease-in;
     display: block;
     padding: 0 5px;
     font-family:OpenSans-Bold;
     position: relative;
     text-transform: uppercase;
}
.nav li a:hover {
    color: #fff;
}
 .nav li ul {
     position: absolute;
     /*display: none;*/
     transition: all 0.2s ease-in;
     background: #0066b3 url("../images/shd-top.png") no-repeat center top;
     width: 208px;
     padding: 10px 5px;
     left: 0;
     z-index: 9999;
}
 .nav li.hover ul {
     display: block;
}
 .nav li ul li {
  display: block;
 }
 .nav li ul li a {
  padding: 5px 5px 5px 18px;
  display: block;
  font-size: 13px;
  font-family:OpenSans-Regular;
  color: #fff;
  transition: all 0.2s ease-in;
 }
 .nav li ul li a:hover, .nav li ul li a:focus, .nav li ul li a.active {
  background: #a6ce39;
 }
.nav li ul::before {
    border-left: 16px solid transparent;
    border-right: 16px solid transparent;
    border-bottom: 16px solid #0066b3;
    content: "";
    height: 0;
    left: 35px;
    position: absolute;
    top: -8px;
    width: 0;
}
 .nav li ul li a:hover::before, .nav li ul li a:focus::before, .nav li ul li a.active::before {
    border-left: 6px solid #fff;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    content: "";
    height: 0;
    left: 6px;
    top: 9px;
    position: absolute;
    width: 0;
}