How to change background video size and avoid cropping on mobile? 7.0 version

Site URL: http://www.nathanpalm.com

Hi,

I'm having trouble with the video cropping on the mobile version. Is it possible to make the video smaller (it's too vertical and larger than I'd prefer) while also maintaining its original aspect ratio to avoid this really cropped in look?

site: nathanpalm.com

pw: test

Thanks!

Add the Code on Design > Custom CSS

@media(max-width: 767px) {
  #montage{
    min-height: 40vh !important;
  }
}

@Web_Solutions Thanks! The video size looks much better but the video continues to crop even further in. Is there a way to get it back to its original picture without the crop while remaining at this size?

On 5/30/2022 at 11:07 PM, Napalm said:

@Web_Solutions Thanks! The video size looks much better but the video continues to crop even further in. Is there a way to get it back to its original picture without the crop while remaining at this size?

Edit this code

@media screen and (max-width: 640px) {
    body.homepage .Parallax-item:first-child iframe {
        width:100% !important;
        height: 100% !important;
        left: 0 !important
    }

    body.homepage .Parallax-item:first-child figure {
        transform: unset !important;
        bottom: 0 !important;
    }
}

to this

@media screen and (max-width: 640px) {
    body.homepage .Parallax-item:first-child iframe {
        width:100% !important;
        height: 100% !important;
        left: 0 !important;
    }
    body.homepage .Parallax-item:first-child figure {
        transform: unset !important;
        bottom: 0 !important;
    }
section#montage {
    min-height: 25vh !important;
}
}

Then save & reload the site

Perfect, thanks so much!