Drop Down Nav Menu not working

Hey,

I’ve built a drop down navigation css menu for a site Im doing for a client. All is working accept this annoying space on my sub menu to the right of the items.

Here’s the website :

https://www.bmhs.co.uk/

The CSS is complicated atm, I need to trim it all up, but here it is:

.main-nav ul {

list-style: none;
display: inline-table;
position: relative;
margin-left: 22px;

}

.main-nav ul:after {
content: “”; clear: both; display: block;
}

.main-nav li {

list-style:none;
display: block;

}

.main-nav a {

color: #681f79;
font-size: 18px;
font-family: Trebuchet MS, Helvetica, sans-serif;
margin-right: 14px;
text-align:center;
text-decoration: none;
list-style:none;
display: block;
line-height: 31px;
padding-left: 5px;
padding-right: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-moz-border-radius-bottomleft: 5px;
-moz-border-radius-bottomright: 5px;

}

.main-nav a:hover {

background: #681f79;
display:block;
color: #ffffff;
}

.main-nav ul li {
position: relative;
float: left;
display:block;
}

.main-nav ul ul {
margin-left: 0px;
position: absolute;
top: 100%;
top: -999999px;
width: 200px;
background: #ffffff;
list-style: none;
box-shadow: 3px 3px 0 #000000;
border: 1px solid black;

}

.main-nav ul ul a {

margin: 4px;
text-align: middle;
line-height: 20px;
font-size: 15px;
min-width:200px;

}

.main-nav ul ul li {
float: none;
border-top: 1px solid black;
border-bottom: 1px solid black;
position: relative;

}

nav ul ul li a {
padding: 15px 40px;
color: #fff;
}

.main-nav ul li:hover > ul {
z-index: 1000;
position: absolute;
top: 100%;
display:inline-table;
}

nav ul li a {
display: block;
text-decoration: none;
}

.main-nav ul li a:hover {

background: #681f79;
display:block;
color: #ffffff;
}

.main-nav ul li.current_page_item > a,
.main-nav ul li.current-menu-ancestor > a,
.main-nav ul li.current-menu-item > a,
.main-nav ul li.current-menu-parent > a {
background: #681f79;
display:block;
color: #ffffff;

}

Any help will be greatly appreciated!

Thanks