Would like to view filtered images ONLY (instead of entire portfolio)

Actually, perhaps you could assist me with my solution. I have instead, set each category up in a different portfolio on separate pages. I have then added a widget area in the advanced layout builder, and added a custom menu to this widget area, allowing the user to click between each category almost as they could before with the sorter, just doesn’t look quite as nice ;)
I made some tweaks to the css so that it would display how I wanted it to, (see below), but my remaining challenges are:
1: the “currently active” menu item drops down so that it is no longer in line with the rest – how do I fix this?
2: this menu does not work for smaller mobile devices, it just disappears off the page. I don’t think its necessary to show it at all on smaller devices, instead they could just view the entire portfolio – so how do I make it disappear for the smaller mobile size?

These are the changes I have made so far to css for menu…

/*CHANGES TO PORTFOLIO-SORTING MENU WIDGET*/

#top .widget_nav_menu ul {
    display: -webkit-inline-box;
    font-size: 11px;
    letter-spacing: 0.5px;
    font-family: 'Quicksand', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.main_color a {
    color: #808080;
}

.entry-content-wrapper li {
    margin-right: 1.5em;
    margin-left: 0em;
}

.widget_nav_menu .current-menu-item>a, .widget_nav_menu .current_page_item>a {
    color: #ab860c;
}

THANKS!!

This is great thanks (I made padding-top 4px as this seemed to line up better) – although it changes the styling on the main menu as well. How do I make it only change on the portfolio sorting menu? Thanks again!

PERFECT! Thankyou :) (resolved) :)