How make an inside element ignore the style

<ul id="login">
    <li><a href="#">User></a></li>
    <li><a href="#">Logout></a></li>
</ul>

I did make my menu and sub menu work ok. But the last item came from a Partial view doesnt show because this line

/* hide the second level menu */
    .menu ul {
           display: none;

I try putting using :not selector, but then show in a wrong format and first sub menu stop working.

.menu ul:not(#login)

On this sample, all four <LI> element should have same format and first one display the submenu.

Also try creating a different class for the second UL and ignore me.

body {
background: black;
}

.menu {
display: block;
}

.menu li {
	display: inline-block;
	position: relative;
	z-index: 100;
}

	.menu li a {
		font-weight: 600;
		text-decoration: none;
		padding: 11px;
		display: block;
		color: #ffffff;
		-webkit-transition: all 0.2s ease-in-out 0s;
		-moz-transition: all 0.2s ease-in-out 0s;
		-o-transition: all 0.2s ease-in-out 0s;
		-ms-transition: all 0.2s ease-in-out 0s;
		transition: all 0.2s ease-in-out 0s;
	}

		.menu li a:hover, .menu li:hover > a {
			color: #ffffff;
			background: #9CA3DA;
		}

/* hide the second level menu */
.menu ul {
	display: none;
	margin: 0;
	padding: 0;
	width: 150px;
	position: absolute;
	top: 43px;
	left: 0px;
	background: #ffffff;
}

/* display second level menu on hover */
.menu li:hover > ul {
	display: block;
}

.menu ul li {
	display: block;
	float: none;
	background: black;
	margin: 0;
	padding: 0;
}

	.menu ul li a {
		font-size: 12px;
		font-weight: normal;
		display: block;
		color: #797979;
		border-left: 3px solid #ffffff;
		background: #ffffff;
	}

		.menu ul li a:hover, .menu ul li:hover > a {
			background: #f0f0f0;
			border-left: 3px solid #9CA3DA;
			color: #797979;
		}

<nav>
<ul class="menu">
    <li>
        <a href="#"><i class="icon-home"></i>HOME</a>
        <ul class="sub-menu">
            <li><a href="#">Sub-Menu 1</a></li>
            <li><a href="#">Sub-Menu 2</a></li>
            <li><a href="#">Sub-Menu 3</a></li>
        </ul>
    </li>
    <li><a href="#"><i class="icon-user"></i>ABOUT</a></li>
    <li>            
        <ul id="login">
            <li><a href="#">User</a></li>
            <li><a href="#">Logout</a></li>
        </ul>
    </li>
</ul>
</nav>