Module menu customize

Hello,

I want to customize the mobile (hamburger) menu hover color.
And I add the following CSS for the menu,

.fl-builder-content .fl-node-600a1e5a264cd .menu > li > a:hover, .fl-has-submenu-container > a:hover, .fl-node-600a1e5a264cd .sub-menu > li > a:hover,
.fl-builder-content .fl-node-600a1e5a264cd .menu > li > a:focus, .fl-has-submenu-container > a:focus, .fl-node-600a1e5a264cd .sub-menu > li > a:focus {
background-color: #f1c43b;
color: #000000;
border: 2px solid #f1c43b;
width: 140px;
padding-left: 12px;
padding-right: 12px;
padding-top: 1px;
padding-bottom: 1px;
border-radius: 12px;
}

The CSS is working though, but the menu behavior is strange. As soon as I touch the link, the menu is sliding out, so cannot even touch the submenu, something like that. Please let me know if I miss something on the CSS.
Thanks!