问如何让这个水平菜单变成垂直菜单，让菜单在右边，子菜单在左边？

EN

    ul {
	list-style: none;
	padding: 0;
	margin: 0;
	background: #1bc2a2;
    width: 260px;
    float:right;
}
    ul li {
    	display: block;
    	position: relative;
    	display: block;
    	background: #1bc2a2;
    }

    /*The CSS to hide the sub menus.*/
    li ul {
    	display:none;
    }
    ul li a {
    	display: block;
    	padding: 1em;
    	text-decoration: none;
    	white-space: nowrap;
    	color: #fff;
    }
    ul li a:hover {
    	background: #2c3e50;
    }

    /*Displays the dropdown menu on hover.*/
    li:hover > ul {
	display: block;
	position: absolute;
    top: 0px;
    right: 260px;
}
    li:hover li {
    	float: none;
    }
    li:hover a {
    	background: #1bc2a2;
    }
    li:hover li a:hover {
    	background: #2c3e50;
    }
    .main.navigation li ul li {
    	border-top: 0;
    }

    /*Displays second level dropdown menus to the right of the first level dropdown menu.

    */
    ul ul ul {
    	left: 100%;
    	top: 0;
    }

		<div id="main-navigation">
    		<ul>
    			<li><a>Városunk</a>
    				<ul>
    					<li><a>Köszöntő</a></li>
    					<li><a>Földrajz</a></li>
    					<li><a>Története</a></li>
    					<li><a>Heraldika</a></li>
    				</ul>
    			</li>
    			<li><a>Önkormányzat</a>
    				<ul>
    					<li><a>Polgármesteri Hivatal</a>
    						<ul>
    							<li><a>Polgármester</a></li>
    							<li><a>Alpolgármester</a></li>
    							<li><a>Jegyző</a></li>
    							<li><a>Titkárság</a></li>
    							<li><a>Hatósági és Igazgatási Osztály</a></li>
    							<li><a>Építésügyi és Városfejlesztési Osztály</a></li>
    							<li><a>Pénzügyi Osztály</a></li>
    							<li><a>Letölthető dokumentumok</a></li>
    							<li><a>Pályázatok</a>
    								<ul>
    									<li><a>EU</a></li>
    									<li><a>ÁROP</a></li>
    									<li><a>TIOP-1.2.3</a></li>
    									<li><a>KEOP-6.1.0/A/11.</a></li>
    									<li><a>KEOP-6.2.0/A/11-2011-0121</a></li>
    									<li><a>KEOP-6.2.0/A/11-2011-0124</a></li>
    									<li><a>KEOP-4.2.0/A/11-2011-0626</a></li>
    									<li><a>EOP-5.5.0/K/14-2014-0031</a></li>
    									<li><a>ÁROP-1.A.3-2014-2014-0116</a></li>
    									<li><a>KEOP-5.7.0/15-2015-0275</a></li>
    									<li><a>KÖFOP-1.2.1-VEKOP-16-2016-00280</a></li>
    								</ul>
    							</li>
    						</ul>
    					</li>
    					<li><a>Képviselő-testület</a>
    						<ul>
    							<li><a>Képviselők</a></li>
    							<li><a>Határozatok, Rendeletek</a></li>
    							<li><a>Rendelet-tervezetek</a></li>
    							<li><a>estületi ülések</a></li>
    						</ul>
    					</li>
    					<li><a>RNÖ</a></li>
    					<li><a>Telefonszámok</a></li>
    				</ul>
    			</li>
    			<li><a>Oktatás és Kultúra</a>
    				<ul>
    					<li><a>Oktatás</a>
    						<ul>
    							<li><a>Cigánd</a>
    								<ul>
    									<li><a>Óvoda</a></li>
    									<li><a>Iskola</a></li>
    								</ul>
    							</li>
    							<li><a>Révleányvár</a></li>
    							<li><a>Zemplénagárd</a></li>
    						</ul>
    					</li>
    					<li><a>Kultúra</a>
    						<ul>
    							<li><a>Művelődési Ház</a></li>
    							<li><a>Városi Könyvtár</a></li>
    							<li><a>Múzeumporta</a></li>
    						</ul>
    					</li>
    					<li><a>Iskolakonyha</a></li>
    				</ul>
    			</li>
    			<li><a>Egészségügy</a>
    				<ul>
    					<li><a>Háziorvosok</a></li>
    					<li><a>Fogorvos</a></li>
    					<li><a>Központi Orvosi Ügyelet</a></li>
    					<li><a>Védőnői Szolgálat</a></li>
    					<li><a>Járóbeteg Szakrendelő</a></li>
    				</ul>
    			</li>
    			<li><a>Hagyományok</a>
    				<ul>
    					<li><a>Múzeumporta</a></li>
    					<li><a>Tájház</a></li>
    					<li><a>Óvodamúzeum</a></li>
    				</ul>
    			</li>
    			<li><a>Sport</a>
    				<ul>
    					<li><a>Intézmények</a>
    						<ul>
    							<li><a>Szabadidő Központ</a></li>
    							<li><a>Műfüves-pálya</a></li>
    							<li><a>Labdarúgó-pálya</a></li>
    						</ul>
    					</li>
    					<li><a>Cigánd SE</a></li>
    				</ul>
    			</li>
    			<li><a>Kezdőlap</a>
    			</li>
    		</ul>
    		</div>

ul {
    list-style: none;
    padding: 0;
    margin: 0;
    background: #1bc2a2;
    float: right;
}
ul li {
    display: block;
    position: relative;
    margin-left: -200px;
    background: #1bc2a2;
}
li ul {
    margin-top: -50px;
    display:none;
}
...
ul ul ul {
    margin-left: -120px;
    top: 0;
}