Any suggestions on how to contain the background color of this menu item?

/*background*/

body{
  background-image:     url('http://mrg.bz/EeHkZt');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: relative;
}



/*nav*/
nav {
  margin: 5px 0; 
  background-color:#007628;
  flex-wrap: nowrap;
  margin-left:5px;
}

nav:after {
    content:"";
    display:table;
    clear:both;
}

/* Removing padding, margin and "list-style"*/

nav ul {
  margin:0;
  padding:0;
  list-style:none;
  position:relative;
}

/*placing nav items in line*/

nav ul li{
  margin:0;
  display:inline-block;
  float: left;
  background-color: #098E36;

}

/*link styling*/

nav a {
  display:block;
    padding:0 10px;
    color:#FFF;
    font-size:20px;
    line-height: 50px;
    text-decoration:none;
  }

/*color change on hover*/

nav a:hover{
  background-color: #22A74F;
}

/*hide dropdown*/

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

/*display on hover*/

nav ul li:hover > ul {
   display:inherit;
    top: 50px;
    opacity: .9;
  }

/*menu item display*/

nav ul ul li {
    min-width:170px;
    float:none;
    display:list-item;
    position: relative; 
}


/*change marker*/

li > a:after { content:  ' +'; }
li > a:only-child:after { content: ''; }