Opacity / transparency of sub menu dropdowns

I have a couple of problems.
1. How do I make the sub-menu drop down not be transparent (have tried all opacity options) i.e. text/images underneath do not show through the drop down menu

2. Also on the non-home pages, and on the responsive I get extra red lines around the Social icons

The Quick CSS I have use to date is

#header_main {z-index: 10;} /* Put logo on top */

#header_meta, #header_main, .avia-layerslider {border: none;}

#header_meta, #header_main {background-color: white !important; opacity: 0.7; margin:0; }

.logo {margin-top: -20px; }

.phone-info a {font-size: 16px; font-weight: bold; color: black !important}
.social_bookmarks a {font-size: 16px; font-weight: bold; color: black !important ; border: none !important; }
#menu-item-search a {color:black; !important; font-size: 36px; font-weight: bold; font-color: black !important}

.avia-menu-text {color:black; font-size: 16px}
.avia-menu-text:hover {color:red}
.sub-menu .avia-menu-text {font-size: 14px ;}

#top .av-main-nav ul a
{ padding: 10px ; line-height: 1.2em !important;
background-color: #eaeaea;
opacity: 1;
}
.sub-menu li { border-bottom: 1px solid #e2e2e2; }