Site too wide on mobile

Hi there,

in Customizer > Additional CSS - remove this block of code:

.page-hero .inside-page-hero {
    width: 100%;
}

Hi, thanks for the speedy response

I currently have this...

/* ------
Page Header
------- */

.page-hero {
height: 100vh;
background-size: 70vh;
background-position: 90%;
}
.inside-page-hero {
margin-left: 40px;
margin-right: 50%;
}

@media (max-width: 419px ){
.page-hero {
min-height: 568px;
background-position: 42vw !important;
}
.inside-page-hero {
margin-left: 20px !important;
margin-right: 20% !important;
}
}
@media (min-width: 420px) and (max-width: 768px) {
.page-hero {
background-position: 60vw !important;
background-size: 60vh !important;
}
.inside-page-hero {
margin-right: 40% !important;
}
}

****************************************************************

I attempted to remove

.inside-page-hero {
margin-left: 40px;
margin-right: 10%;
}

which removed spacing left of header where the issue is spacing on right of the header? if that makes sense

Aah ok. Add this CSS:

.page-hero .inside-page-hero {
    width: auto !important;
}

Excellent, I appreciate the knowledge and speed of delivery.

Glad to be of help