/** Shopify CDN: Minification failed

Line 11:9 Unexpected "{"
Line 11:18 Expected ":"
Line 11:25 Unexpected "{"
Line 84:13 Unexpected "{"
Line 84:22 Expected ":"
Line 84:29 Unexpected "{"

**/
section-{{ section.id }} {

  .video-section__media {
    --ratio-percent: 56.25%;
    position: relative;
    padding-bottom: calc(var(--ratio-percent) - var(--media-border-width));
  }

  .video-section__media.deferred-media {
    box-shadow: var(--media-shadow-horizontal-offset) var(--media-shadow-vertical-offset) var(--media-shadow-blur-radius)
    rgba(var(--color-shadow), var(--media-shadow-opacity));
  }
  
  .video-section__media.deferred-media:after {
    content: none;
  }
  
  .video-section__poster.deferred-media__poster:focus {
    outline-offset: 0.3rem;
  }
  
  .video-section__poster {
    position: absolute;
    width: 100%;
    height: 100%;
  }
  
  .deferred-media[loaded] > .deferred-media__poster {
    display: none;
  }
  
  .deferred-media__poster:focus-visible {
    outline: none;
    box-shadow: 0 0 0 var(--media-border-width)
    rgba(var(--color-foreground), var(--media-border-opacity)),
    0 0 0 calc(var(--media-border-width) + 0.3rem) rgb(var(--color-background)),
    0 0 0 calc(var(--media-border-width) + 0.5rem)
    rgba(var(--color-foreground), 0.5);
    border-radius: calc(var(--media-radius) - var(--media-border-width));
  }
  
  .deferred-media__poster:focus {
    outline: none;
    box-shadow: 0 0 0 var(--media-border-width)
    rgba(var(--color-foreground), var(--media-border-opacity)),
    0 0 0 calc(var(--media-border-width) + 0.3rem) rgb(var(--color-background)),
    0 0 0 calc(var(--media-border-width) + 0.5rem)
    rgba(var(--color-foreground), 0.5);
    border-radius: calc(var(--media-radius) - var(--media-border-width));
  }
  
  .global-media-settings--full-width .deferred-media__poster,
  .global-media-settings--full-width
  .deferred-media__poster:is(:focus, :focus-visible) {
    border-radius: 0;
  }
  
  .deferred-media__poster-button:hover {
    transform: translate(-50%, -50%) scale(1.1);
  }
  
  video {
    position: absolute !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    
    width: 200% !important;
    height: 133% !important;
  }
}
  
  @media screen and (max-width: 768px) {
    section-{{ section.id }} {

      video {
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        
        width: 100% !important;
        height: 150% !important;
      } 
    }
  }