You cannot add a dot as part of a class name when you are defining individual menu items because it is used in stylesheets to indicate a class name. What you should do is add a class name for a menu item, then when you write the rule, you add the dot to the front end to indicate that it is a class name.
For example, let’s say there’s a particular menu item that you want to have bold red text. You would add a class name like stand-out to the menu item, and then, when you write the CSS rule in your custom CSS, it would look like this:
.menu-item .stand-out {
color: #f00;
font-weight: 700;
}
The dot inside the rule says “this is a class name, not an ID,” so the browser will look for an element that has stand-out as a class name, there’s no need to add the dot when you define the element.