Website not displaying correctly on mobile view(icon and slideshow images)

[ThePhoneSpecial]

Hello All,

I'm in my final stages of adjustments before launching my site and Shopify plan for www,ThePhoneSpecialist.co.uk(password is tawcla) and whilst doing all my website editing on my browser, my website had no visual issues. I've just done a test on a mobile browser, and if you can see in the attached images, there are two issues. I've uploaded desktop view and mobile view. If anyone can help me resolve the icon overlapping, and only half my image/slideshow showing, that would be incredible!

1) The basket checkout icon has moved for some reason and overlapping.

2) The 2 photo slideshows present, only show half of the image/slideshow.

Now bellow is the attached view of the desktop version on a windows laptop, which displays perfectly:

[LitExtension]

Hi @ThePhoneSpecial, 

#1:

Please follow the steps:

- Step 1: Go to sections > header.liquid file and change code: https://i.imgur.com/P9eUdo6.png => https://i.imgur.com/oFPgbfA.png

Code: one-eighth, medium-down--six-eighths

- Step 2: Go to Assets > theme.scss.liquid and paste this at the bottom of the file:

@media only screen and (max-width: 768px){

        .site-nav__link--burger{

           top: 0px !important;

        }

        .site-header__logo{

            font-size: 18px !important;

        }

}

https://i.imgur.com/7JvaCJa.png

#2: Please change Slide height: Adapt to first image

Refer: https://i.imgur.com/2GuTejf.png