Sample transitions

html { overflow-y: visible!important; }
.nav-menu > .menu-item > ul {
    -webkit-transition: opacity 1s ease,
                        top .6s ease,
                        z-index 1.2s ease!important;
    -moz-transition: opacity 1s ease,
                        top .6s ease,
                        z-index 1.2s ease!important;
    transition: opacity 1s ease,
                        top .6s ease,
                        z-index 1.2s ease!important;
    display: block!important;
    opacity: 0!important;
    z-index: -1!important;
    top: 0!important;
}
.nav-menu > .menu-item:hover > ul {
    opacity: 1!important;
    z-index: 1!important;
    top: 100%!important;
}