CSS Expert? Need a second pair of eyes on this...

I'm playing around with bootstrap 4 (yes, it's alpha), but my CSS issue really doesn't have anything to do with bootstrap.

See: http://suvovu.com

Under the "My Account" menu item, if using a screen with width > 768px, there is a submenu that you can't see. It's an absolutely positioned element. I want to see it. Why can't I see it?

Menu is basic nested list:

Code:

<nav id="menu">
    <ul>
        <li>
            <a href="#"><i class="fa fa-chevron-right"></i>Home</a>
        </li>
        <li>
            <a href="#"><i class="fa fa-chevron-right"></i>Service</a>
        </li>
        <li>
            <a href="#"><i class="fa fa-chevron-right"></i>Maintenance</a>
        </li>
        <li class="submenu">
            <button type="button" id="sub-menu-toggle">
                My Account<i class="fa fa-caret-down"></i>
            </button>
            <ul>
                <li>
                    <a href="#"><i class="fa fa-chevron-right"></i>Sign In To Access Awesome</a>
                </li>
                <li>
                    <a href="#"><i class="fa fa-chevron-right"></i>Register</a>
                </li>
            </ul>
        </li>
        <li>
            <a href="#"><i class="fa fa-chevron-right"></i>Contact</a>
        </li>
    </ul>
</nav>

CSS is a little too much to post here, but being that it's a responsive design, and was designed mobile first, I've done everything that should be necessary to see the submenu. Just can't see it. CSS:

http://suvovu.com/css/style.1494535584.css

If anyone can help, I'd appreciate it.

Expert Website Development - Temecula, CA
Community Auth For CodeIgniter 3