Hi, I’m using this code to display the site logo in an overlapping fashion:
.main-navigation .site-logo.navigation-logo {
position: absolute;
left: 0;
top: 0;
}
.main-navigation {
margin-top: 0;
padding: 0px;
}
.main-navigation .navigation-logo img {
padding: 0px 0px 10px 30px;
margin-top: 0px;
}
.main-navigation .navigation-logo img {
height: 130px;
}
.main-navigation:not(.navigation-stick) {
position: relative;
z-index: 99;
}
.navigation-branding img,
.mobile-header-logo.site-logo img,
.main-navigation.sticky-navigation-transition .navigation-branding img {
padding: 0;
position: absolute;
top: 0;
height: 170px;
}
But the mobile version of the logo looks too large – how can I reduce the size of the mobile logo?