Cacher is the code snippet organizer for pro developers

nav.main ul ul {
    position: absolute;
    list-style: none;
    display: none;
    opacity: 0;
    visibility: hidden;
    padding: 10px;
    background-color: rgba(92, 91, 87, 0.9);
    -webkit-transition: opacity 600ms, visibility 600ms;
            transition: opacity 600ms, visibility 600ms;
}

nav.main ul li:hover ul {
    display: block;
    visibility: visible;
    opacity: 1;
}




<nav class="main">
    <ul>
        <li>
            <a href="">Lorem</a>
            <ul>
                <li><a href="">Ipsum</a></li>
                <li><a href="">Dolor</a></li>
                <li><a href="">Sit</a></li>
                <li><a href="">Amet</a></li>
            </ul>
        </li>
    </ul>
</nav>