How to change size of background image on mobile view?

Site URL: https://www.allurestudioseven.com/home

I'm trying to change it on the home page: www.allurestudioseven.com/home

On the first section, in mobile view, it cuts off the image of the laptop on the right. I'm wondering if there's a way to move it over to the left in mobile only and then make it so the text is still visible somehow, maybe by aligning it to the left. 

Is this possible?

Hi,

Which image are you referring to? I see top section uses video

@tuanphan Hi! That's right, I meant the video 

Try adding to Design > Custom CSS

@media screen and (max-width:767px) {
[data-section-id="62261333cc7bb27d65404724"] .section-background video {
    object-position: 85% 50% !important;
}
}

Do you need to add overlay behind the text?

@tuanphan That looks good! Thank you. Yeah, I'll definitely need to add overlay for the text or move it somehow. How would I do that?

17 hours ago, AmandaKay said:

@tuanphan That looks good! Thank you. Yeah, I'll definitely need to add overlay for the text or move it somehow. How would I do that?

Add to Design > Custom CSS

/* Mobile top banner text overlay */
@media screen and (max-width:767px) {
div#block-yui_3_17_2_1_1646847547001_4184 {
    background-color: rgba(255,255,255,0.75);
}
}