CSS beginner need help with mobile styling

Hi,

I have been building a website for a friend. Using a ready made template on wordpress. Some code was added to remove a background and make it fit for mobile.

https://www.bodyclocktherapies.co.uk/cart/

Image 1: https://ibb.co/0cCYNsM

However all the pages don’t seem to fit mobile. Such as the cart/basket when an items is added.

#cms-theme.woocommerce.archive #cshero-header.header-1 > .container,
#cms-theme.woocommerce-page.archive #cshero-header.header-1 > .container {
  background-color: #ffffff;
}

#cms-theme.woocommerce.archive #cshero-header.header-1,
#cms-theme.woocommerce-page.archive #cshero-header.header-1 {
  background-color: #fff;
}

@media (min-width: 993px) {
  #cshero-header.header-1:before {
    background-color: #fff !important;
  }
}

@media (max-width: 767px) {
  #cms-theme.woocommerce #page:after,
  #cms-theme.woocommerce-page #page:after {
    display: none;
  }
}

recheck the sizes that you are trying to use for mobile devices, i think they may need to be just a little bit smaller…

Hi. All the other pages are fine except the one above