Organising the Category area in Places page

Hi

I have a layout issue, which I am hoping to adjust.

See here: https://www.screencast.com/t/RJ5QFeQKTQH9 . the categories are not laying correctly/cleanly

See here: before and after is what I am trying to achieve.

https://projects.invisionapp.com/share/X8NBI3BW7KY#/screens/362386513_Popular-Cat

I used inspected area and then adjusted the CSS in the ‘inspection console’

.geodir_full_page .geodir-cat-list ul li {
width: 15%; – This was adjusted in console
padding-left: 15px;
}

.widget ul li + li, .widget ul li > ol, .widget ul li > ul {
margin-top: 0px; – This was adjust in console
}

.geodir-cat-list ul li {
float: left;
margin-right: 1%; – This was adjusted in console.
font-size: 13px;
padding: 6px 0;
padding-left: 0px;
}

This adjusted the layout to what I need 🙂 . But not sure where i should adjust the CSS? Or whether I should at all?

Should I try and adjust in Custom CSS?