Submenu appearing in menu dropdown not next to it

Hi,

I’m trying to introduce a submenu to https://fionalouisephotography.co.uk/ On the Gallery dropdown I want to include a submenu of Prices to display next to each gallery. I’ve tried this on Maternity & Newborn using the parent attribute and indenting it to the right in Menu however it is displaying underneath Maternity & Newborn rather than to the right of it. How can I change this?

I have no knowledge of CSS but here is the navigation current code

#navigation {
	margin-top: 20px;
	background: url(images/navbar.png) repeat-x;
	float: right;
	position: relative;
	z-index: 300;
}
#navigation ul {

}
#navigation ul li {
	float: left;
}
#navigation ul li a {
	padding: 10px 20px;
	display: block;
	color:#999999;
	font-size: 14px;
}
/* drop down */
#navigation ul ul {
	position:absolute;
	display:none;
	margin:0 0 0 -1px;
	padding:0;
	list-style:none;
	border-top: 1px solid #666666;
	border-right: 1px solid #666666;
	border-left: 1px solid #666666;
}

#navigation ul ul li {
	width:170px;
	float:none;
	background: #000;
}

#navigation ul ul a {
	display:block;
	height:15px;
	padding: 8px 5px;
	background: none;
	border-bottom: 1px solid #666666;
}

*html #navigation ul ul {
	margin:0 0 0 -2px;
}
#navigation ul li.current_page_item a, #navigation ul li a:hover  {
	color: #fff;
}

Any help would be much appreciated.

Many thanks

Hayley