Problem with logo on mobile devices

I've got a problem with the logo in navbar. On the computers it looks like it should. Here's my site - http://goo.gl/EpkGpz - as you can see, logo looks awesome. I am using theme called Hueman. I put the image in the navbar by using this code:

li#menu-item-1735 a {
  display: block;
  background-image:url('mylogo.png');
  background-repeat: no-repeat;
  width: 125px;
  height: 20px;
  text-indent: -9000px;
}

The problem begins on the mobile devices. Here's the screen how it looks right now - i.imgur. com/R6AtzbO.png

It should be like this - i.imgur. com/mnbfSYS.png (the search box icon must be moved to the right) or like this - i.imgur. com/QoZgmWr.png. I prefer the first option, but i will be glad if someone can help me with any of these versions. You can check how does my site look on mobile devices here - mobiletest. me

EDIT: I think i figured out why the logo isn't showing up correctly. My logo is just a replaced link in menu (menu-item), so i think that's the reason why logo isn't showing up on mobile devices. Does anyone have any suggestions, how to apply logo in topbar without using "menu-item" attribute?

Best regards, i hope someone will find some time to help me solve my problem.