Fixing sub menus in wordpress

I’m having problems trying to fix my sub-menus in wordpress. Whenever i hover on a parent menu, the sub-menu isn’t positioning it self properly under the parent men!

[IMG]https://i255.photobucket.com/albums/hh140/testament1234/drop_down_zps999ab02d.png[/IMG]

The events sub-menu should be under the news but it looks like it is floating to the left.

–HTML–

<!--NAVIGATION -->
    <div class="row">
        <div class="col5">
		    <nav class="left_nav nav_shadow_top">
			    <div class="nav_shadow_bottom">
			    <?php wp_nav_menu( array( 'theme_location' => 'left-menu' ) ); ?>
				</div>
			</nav>
	    </div>

	    <div class="col6">
		<h1 class="logo"><a href="<?php echo home_url('/') ?>" title="Federal Land">federal land</a></h1>
	    </div>

	    <div class="col5">
		    <nav class="right_nav nav_shadow_top">
			    <div class="nav_shadow_bottom">
			    <?php wp_nav_menu( array( 'theme_location' => 'right-menu' ) ); ?>
				</div>
			</nav>
	    </div>
		<div class="row-end">&nbsp;</div>
	</div>
    <!--END NAVIGATION -->

–CSS–

.nav{positon:relative}

    nav li:hover ul.sub-menu{display:block;}

    ul.sub-menu {
        background-color:white;
        display:none;
        position:absolute;
        z-index:1;
        border-radius:5px;
        top:35px;
        box-shadow:0 0 10px rgba(0,0,0,.3);
    }

    ul.sub-menu li{display:block !important; padding-bottom:10px;}

    .current-menu-item{border-bottom:1px solid #DBD9D9}

Here is a link for the website

https://digitalspin.ph/federalland/