Button style is not working

So im working on a nav menu for my website and even though i have a css style done for the buttons they still are default with some of the styles applied im fairly new to html and css so if it might just be me over looking something heres the code:

.navagationmenu1 {
background-color: transparent;
color: white;
padding: 15px 32px;
text-align: center;
text-decoration: none;
font-size: 16px;
cursor: pointer;
width: 150px;
display: block;
font-family: 'Lato', sans-serif ;

.navagationmenu1 :not(:last-child) {
border-bottom: none;

.navagationmenu1 :hover {
background-image: linear-gradient(to right, rgba( 154, 64, 64, 1), rgba( 154, 64, 64, 0) 75% );

thank you so much for the help

im hovering over commands

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make easier to read.

See this post to find the backtick on your keyboard. The “preformatted text” tool in the editor (</>) will also add backticks around text.

Note: Backticks are not single quotes.


thanks sorry first time using this

you should not have the space before :hover

my goal is to have a nav bar that each individually show the gradient when you hover over them and when not active are just the words

if you have an element with class button, you use selector .button for normal look, and .button:hover (no space) when the element is hovered