.nav-container,ul.sub-menu{
    transition:max-height .3s
}

/* ul.primary li.menu-item-has-children {border: 1px solid red;} */

ul.primary li.menu-item-has-children a{
    padding-right:25px
}

ul.primary li.menu-item-has-children > a::after{
    content: ' \f0d7';
    font-family: fontAwesome;
}

ul.sub-menu{
    position:absolute;
    z-index:4;
    min-width:200px;
    display:none;
    box-shadow:0 7px 12px rgba(0,0,0,.175)
}
ul.sub-menu li{
    float:none;
    margin:0
}

ul.primary ul.sub-menu li a{
    border-left:1px solid #ddd;
    border-right:1px solid #ddd;
    border-bottom:1px solid #eee;
    color:#666;
    padding:13px 20px
}
ul.primary ul.sub-menu li a:hover{
    color:#000;
    background:#eee
}

@media (max-width:767px){

    .nav-wrap .sub-menu,.nav-wrap .nav-container{
        max-height:0;
        overflow:hidden
    }

    .nav-wrap .sub-menu.open,.nav-wrap .nav-container.open{
        max-height:500px;
        overflow:scroll;
        -webkit-overflow-scrolling:touch
    }
    .nav-wrap .sub-menu.open{
        max-height:999px
    }
    .nav-wrap ul.sub-menu{
        display:block;
        position:static;
        box-shadow:none;
        width:100%;
        border-bottom:none
    }
    .nav-wrap ul.primary ul.sub-menu li a{
        background:#1a1a1a;
        border:none;
        color:#999
    }
    .nav-wrap ul.primary ul.sub-menu li a:hover{
        color:#bfbfbf
    }
    .nav-light.nav-wrap ul.primary ul.sub-menu li a{
        background:#e6e6e6;
        color:#333
    }
    .menu-item-has-children .select .alux-arrow{
        transform:rotate(-90deg)
    }

}