Blog

<style>
  div:has(.custom-video-section) {
    padding: 0 !important;
  }
  video {
    display: block;
    margin: 0 auto;
    width: 100%;
  }
  @media screen and (min-width: 800px) {
    .video-for-mobile {
      display: none;
    }
  }
  @media screen and (max-width: 800px) {
    .video-for-desktop {
      display: none;
    }
    video {
      width: 100%;
    }
  }
</style>

<div class="custom-video-section">
  <video class="video-for-desktop" autoplay loop playsinline muted>
    <source
      src="https://cdn.shopify.com/videos/c/o/v/fc5c6752c643485bacd65b1a5557b016.mp4"
    />
  </video>
  <video class="video-for-mobile" autoplay loop playsinline muted>
    <source
      src="https://cdn.shopify.com/videos/c/o/v/e1913e781f064577b59fa6b6f42f9afe.mp4"
    />
  </video>
</div>