Page class naming issue

I am trying to adjust plugin style to hide some elements in small screen (responsive effects). And in small screen I want to leave only first/last page, previous/next post links, current page, and one before and one after current page.

I have almost 200 pages. Current element structure looks like this:
span.pages
a.first
a.previouspostslink
span.extend
a.smaller.page
a.smaller.page
span.extend
a.page.smaller
span.current
a.page.larger
span.extend
a.larger.page
a.larger.page
span.extend
a.nextpostslink
a.last

There is no way to set different style for links that are one before and one after current page. Now classes are just in different order and in CSS order does not have any effect if i write “a.larger.page” or “a.page.larger”. And there is no filter to do that.

So may be there is possibility to change or add new class name for first links before/after current link? Names could be like “before”, “after” meaning “first link before/after current page link”.