li {
  display: block;
  transition-duration: 0.5s;
 }
 
 li:hover {
   cursor: pointer;
 }
 
 ul li ul {
   visibility: hidden;
   opacity: 0;
   position: absolute;
   transition: all 0.5s ease;
   left: 0;
   display: none;
 }
 
 ul li:hover > ul,
 ul li ul:hover {
   visibility: visible;
   opacity: 1;
   display: block;
   text-decoration: none;
 }
 
 ul li ul li {
   clear: both;
   width: 100%;
 }
 .sub-menu{background: #000; padding:20px!important; width: 200px;}
 .sub-menua {height:50px!important; padding-top:10px!important;}
 
 .sub-menua a:hover{
   border-bottom:2px solid #30918b!important;
   background:none;
   padding: 13px 0 2px 0!important;
 }
 
 @media screen and (max-width:768px) {
   .sub-menua {padding-top:0px!important; height:50px!important;}
 }