nav>ul{text-transform: uppercase; position:relative;}
nav ul ul{text-transform:none; z-index:5;}
nav>ul li{
    display:inline-block;
    padding: 0 .7em;
    position:relative;
}

nav ul ul{display:none; position:absolute; padding-top: .5em;}

nav>ul>li:hover ul{display:block; background: rgba(0,0,0,.3)}

nav ul ul li{display:block; padding: .5em 1em;}

nav a{transition:all .5s}

nav a:hover {color: #000;}

nav.darkBG a:hover {color: #888;}


@media only screen and (max-width:600px) {
 
nav a:hover {color: #fff;}    
    nav ul ul{top:0;}  
    
}