Custom css for mobile logo don't work

Hi,
I'm trying to use a custom css and make the mobile logo bigger, but after several attempts, I don't have results yet.
Maybe there are conflicts with other css codes?

Tried with:

.mobile-header-navigation .mobile-header-logo, .mobile-header-navigation .mobile-header-logo img {
height: 40px;
}

or

.mobile-header-navigation .mobile-header-logo img {
height: 35px;
}

and many others codes, found on this forum, starting with: "@media" (i'm not a programmer so excuse me if i'm inaccurate)

I tried also hiding logo (just an experiment) with this:

@media (max-width: 768px) {
.site-logo {
display: none;
}
}

but the logo was still there.
So i thought that might be a conflict with other code.
This is the whole custom css added for other things:

/* HIDE FOOTER */
.site-info {
display: none;
}

/*HIDE PAGE TITLE*/
.page .entry-header,
.single .entry-header {
display:none;
}

/*HIDE WHITE BAR ON TOP*/
.entry-content {
margin: 0;
}

/*SIZE/POSITION DESKTOP LOGO*/
.main-navigation .sticky-logo,
.main-navigation .sticky-logo img {
height: 150px;
padding-left: 40px;
padding-top: 0px;

}

/*POSITION MENU*/
@media (min-width: 769px ) {
.site-branding {
display: inline-block;
}
.site-logo {
float: CENTER;
margin-right: -140px;
}
}

/*COLORS MENU MOBILE*/
@media ( max-width: 768px ) {
.main-navigation {
background-color: #12109a;
}
.main-navigation .main-nav ul li a,
.main-navigation .menu-toggle {
color: #ffffff;
}
.main-navigation .main-nav ul li > a:hover,
.main-navigation .main-nav ul li > a:focus,
.main-navigation .main-nav ul li.sfHover > a {
color: #12109a;
background-color: #ffffff;
}
}

So after all, what i want is choose size and position of logo for tablet and smartphone 'cause desktop version is ok.
Thanks in advance for your support and patience.