Custom css for pagination display not working with mobile theme

Hi,

I want to remove pagination number from my post and instead display “Back” and “Next Page” blocks. For this following custom css code was suggested in one of the Tagdiv forum thread. So I tried below code which works well on desktop but not on mobile devices. I am using mobile theme.
On desktop, I can see it properly https://www.screencast.com/t/dXJtxJ3WWEu
But on mobile, it is showing 1st and last page numbers. https://www.screencast.com/t/otiUL1wkW0

This is the custom CSS cosw I have used. Please suggest how can I get the same display on mobile as on desktop.

.page-nav-post .post-page-numbers {
display: none;
}
.page-nav-post .post-page-numbers:first-child, .page-nav-post .post-page-numbers:last-child {
display: block;
}
.page-nav i{
font-size: 20px;
padding: 25px 150px;
justify-content: center;
}
.page-nav-post a {
color: #fff;
background: gray;
}
.page-nav-post .post-page-numbers:last-child{
background: orange;
}
.page-nav-post .post-page-numbers .td-icon-menu-left:before {
content: ‘\e80c BACK’;
}
.page-nav-post .post-page-numbers .td-icon-menu-right:before {
content: ‘NEXT PAGE \e80d’;
}

Hi Vlad,

Thanks for your response. I tried the option you suggested: https://www.screencast.com/t/HIMZBgkE0

But it is not working as pagination numbers are still coming up: https://www.screencast.com/t/Z7FiXhwokHn
Please note I am using Mobile theme for mobile display. I have earlier tried adding code under MobileTheme->Custom CSS but that also didn’t work.

Hi Vlad,

I already tried the option suggested by you. But it is not showing correctly on mobile device: https://www.screencast.com/t/otiUL1wkW0

Do I need to make any change in the css code? It shows correctly on desktop:https://www.screencast.com/t/dXJtxJ3WWEu

Thanks,
Anand