html: el código CSS no funciona como debería en el encabezado de WordPress

Quiero que el tamaño del botón sea más corto como en la siguiente imagen:

Pero cuando agregué el CSS personalizado al sitio de WordPress, cambió el tamaño del botón.

#menu-item-11695 {
    box-shadow: 0px 7px 14px -7px #3e7327;
    background:linear-gradient(to bottom, #77b55a 5%, #72b352 100%);
    background-color:#77b55a;
    border-radius:3px;
    border:1px solid #4b8f29;
    display:inline-block;
    cursor:pointer;
    color:#ffffff;
    font-family:Arial;
    font-size:13px;
    font-weight:bold;
    padding:9px 8px;
    text-decoration:none;
    text-shadow:0px 1px 0px #5b8a3c;
}
#menu-item-11695:hover {
    background:linear-gradient(to bottom, #72b352 5%, #77b55a 100%);
    background-color:#72b352;
}
#menu-item-11695:active {
    position:relative;
    top:1px;
}