Help with PNG logo on Slider. Position moves on mobile

Hi, i need help in my logo which appears on desktop fine but on mobile is down to the bottom right of the page. https://marketinglawyers.co.uk

I currently have this in header and footer scripts plugin:

.slide-logo-wrap{ position: absolute; top: 150px; left: 355px; width: 50%; height: 50%; z-index: 9999; text-align: center; } .slide-logo{ display: table; position: relative; width: 100%; height: 100%; } .slide-logo div{ display: table-cell; vertical-align: middle; position: relative; } .slide-logo a{ padding: 10px 20px; }

What do i need to do please?

Hi,

The fixed ( pixel ) size may not work well on mobile devices, please try to use a % value instead for site-logo-wrap position, like this:

.slide-logo-wrap {
    position: absolute;
    top: 25% !important;
    left: 22% !important;
    width: 50%;
    height: 50%;
    z-index: 9999;
    text-align: center;
}

or apply the % position only for mobile devices with this Custom CSS:

@media only screen and (max-width: 768px) {
.slide-logo-wrap {
    top: 25% !important;
    left: 22% !important;
}
}

Please add the above CSS to your Child Theme’s style.css or in case you haven’t setup a Child Theme already, then you can also add the CSS to wp-admin -> Appearance -> Customizer -> Additional CSS so you won’t loose the changes after Theme or WordPress updates.

Please let me know how it works.

Kind Regards,
Csaba