XF 1.4 Stuck on CSS - Getting Jitters on Hover

[LPH]

I've tried to add links to the top right corner of the site header. The links are showing but hover is causing a jitter instead of just changing colors and adding a background.

Also, looking at the forums on a tablet causes a huge headache with the menu disappearing and the primary navigation I'm adding sliding down.

Since I suck at CSS, maybe someone can help. I would ask Russ but he's very busy at the moment. He helped with where to put the links in the templates but now it is down to the CSS.

.primaryNavigation {
    float: right;
    padding-top: 50px;
    display: inline-flex;
}

.primaryNavigation li.primaryTabs {
    /* margin-right: 10px !important; */
    padding: 20px;
    text-transform: none !important;
    font-size: 1.0rem !important;
    color: #000 !important;
}

.primaryNavigation li.primaryTabs a.navLink:hover {
    color: white;
    background-color: rgb(37, 129, 170);
    text-decoration: none !important;
    padding: 20px;
    width: inherit;
}

Live site: http://www.tuxreports.com/community/

Thank you.