Having issues on my drop-down menu

Question

So I'm facing troubles creating a drop-down submenu. I've started giving the main ul a class and an id for the second ul but after that I don't know where should I apply CSS. I set both ul#sub1 & li a:hover display to block so you can see exactly what I'm trying to say Demo:

ul {
	list-style-type:none;
	margin:0;
	padding:0;
	background-color:#404040;
	overflow:hidden;
}

li {
	float:left;
}

li a {
	display:block;
	padding:15px;
	color:#8c8c8c;
	float:left;
	text-decoration:none;
	padding:30px;
	display:absolute;
	font-size:15px;
	letter-spacing:2px;
	
}

ul#sub1 {
	display:block;
	position:absolute;
	top:78px;
	left:410px;
}

li a:hover {
	background-color:#ff8533;
	color:white;
	transition:0.4s;
	display:block;
}

li a.active {
	background-color:#ff8533;
	color:white;
}

<ul class='navmenu'>
			<li><a href='http://www.google.ro'>HOME</a></li>
			<li><a class='active' href='http://www.google.ro'>ABOUT US</a></li>
			<li><a href='http://www.google.ro'>SERVICES</a></li>
			<li><a href='http://www.google.ro'>GALLERY</a></li>
				<ul id='sub1'>
					<li>
						<a href='http://www.google.ro'>GALLERY 2</a>
					</li>
					<li>
						<a href='http://www.google.ro'>GALLERY 3</a>
					</li>
					<li>
						<a href='http://www.google.ro'>GALLERY 4</a>
					</li>
				</ul>
			<li><a href='http://www.google.ro'>NEWS</a></li>
			<li><a href='http://www.google.ro'>CONTACTS</a></li>
		</ul>

Answer 1

ul {
  	list-style-type:none;
	margin:0;
	padding:0;
	background-color:#404040;
  }

ul.navmenu {

  position:relative;
  display:inline-block;
  width:100%;
}

li {
	float:left;
  position:relative;
}

li a {
	display:block;
	padding:15px;
	color:#8c8c8c;
	float:left;
	text-decoration:none;
	padding:30px;
	display:absolute;
	font-size:15px;
	letter-spacing:2px;
	
}

ul.navmenu > li:hover a + ul {
display:block;
  }

ul.navmenu ul {
	display:none;
	position:absolute;
	top:100%;	
}

ul#sub1 li {
  display:block;
  float:none;
  }

li a:hover {
	background-color:#ff8533;
	color:white;
	transition:0.4s;
	display:block;
}

li a.active {
	background-color:#ff8533;
	color:white;
}

<ul class='navmenu'>
			<li><a href='http://www.google.ro'>HOME</a></li>
			<li><a class='active' href='http://www.google.ro'>ABOUT US</a></li>
			<li><a href='http://www.google.ro'>SERVICES</a></li>
			<li><a href='http://www.google.ro'>GALLERY</a>
				<ul id='sub1'>
					<li>
						<a href='http://www.google.ro'>GALLERY 2</a>
					</li>
					<li>
						<a href='http://www.google.ro'>GALLERY 3</a>
					</li>
					<li>
						<a href='http://www.google.ro'>GALLERY 4</a>
					</li>
				</ul>
             </li>
			<li><a href='http://www.google.ro'>NEWS</a></li>
			<li><a href='http://www.google.ro'>CONTACTS</a></li>
		</ul>