Adding button to nav menu without using secondary nav

Site URL: http://gregorylassale.com

Hello,

I use the Brine template and am trying to have the menu item on the right ("FR") styled as a button. 

That menu item toggles between the French and English versions of the site, and because the site is multilingual and already uses a secondary nav for the the French version, I can't go the secondary nav option route. Plus I need that same menu item on the French version ("EN") also styled as a button anyway.

Is there any way to accomplish this without code ? If not, could anyone help me with it ? I guess I would need a piece of code that would style only one item in the nav bar as button and leaves the rest alone. 

Thanks in advance for your help !

Under Design > Custom CSS you can style the last element of the navigation so it's different and looks like a button. Here's an example giving it a white border. 

.Header-nav-inner>a:last-child {
    border: 1px solid white;
}

Thanks Chris. Could you please let me know the appropriate code to play with the dimensions (height, width) as well as the angle of the corners? Thank you!  

Sure!  Instead of width, you may want to use padding to add space between the text and the border edges. The first number will be the top/bottom spacing, second one is left/right spacing.

.Header-nav-inner>a:last-child {
  border: 1px solid white;
  border-radius:5px;
  padding:5px 25px;
  width:150px;
}

Fantastic! I'll play with those settings. Thanks again!

Hello again. For some reason, changing the padding values did not seem to do anything, so I set the width at 50px and centered the text. 

One more thing I forgot. I'd like the color of the button and text to change on hover: text to black and button to white. Is that possible via CSS?

I Think I figured it out:

.Header-nav-inner>a:last-child:hover {
  color: black !important;
  background-color: white !important;
}