good day i need help to separate my navigation bar the WELCOME ADMIN should be on the right side here is my code.

HTML

```
    <div id="menu">
      <ul>
        <li><a href="#">item1</a></li>
        <li><a href="#">item1</a><ul>
        <li><a href="#">item1</a></li>
        <li><a href="#">item1</a></li>
        <li><a href="#">item1</a></li></ul>
        </li>
   <li><a href="#">item1</a></li>
         <li><a href="#">item1</a><ul>
        <li><a href="#">item1</a></li>
        <li><a href="#">item1</a></li>
        <li><a href="#">item1</a></li></ul>
        </li>
        <li class="right"><a href="#" >Welcome Admin</a>
        <ul>
        <li><a href="#">Subitem One</a></li>
  li><a href="#">Subitem Two</a></li>
<li><a href="#">Subitem Three</a></li>
        </ul>
        </li>
        </ul>

  </nav>

```

CSS

```
    #menu {
background:#000;
width:100%;
margin-top:0px;
height:40px;    
border-radius: 3px; 
    }

    #menu ul ul {
display: none;
    }

#menu ul li:hover > ul {
    display: block;
}

    #menu ul { 
background: #000
padding: 0px;
border-radius: 5px;
float:left;
list-style: none;
margin-top:-20px;
position: relative;
display: inline-table;
   }
   }
#menu ul:after {
    content: ""; clear: both; display: block;
}

#menu ul li {
float: left;
    }
#menu ul li:hover {
color:#fff; 
}
 #menu ul li:hover a {
    background:#fff;
color: #000;
   }

#menu ul li a {
display: block; margin-top:20px;
padding:10px 5px;
color: #FFF; text-decoration: none;

 }

#menu ul ul {
 background: #fff;
 padding:0;
 position: absolute;
top: 80px;
 box-shadow: 0px 0px 9px rgba(0,0,0,0.15);
     }
#menu ul ul li {
float: none; 
position: relative;
}
    #menu ul ul li a {
padding: 15px 40px;
color: #fff;
}   

#menu ul ul li a:hover {
background: #000;
color:#fff;
}   

```

thankyou for your answers badly need your help for this projects thankyou for those who will answer