title: Hide Play Button Overlay on <video> in iOS 14
body: <p>I have a short, ~2-second video that plays on a loop in the background of a website I'm making, which, when it appears through transparent portions of divs, gives the effect of a metallic shimmer. It looks great. The problem is, when an iOS device is in low power mode, the video not only doesn't play (which is acceptable, I get it), it shows a big honkin' play button that shows through those same transparent portions of divs. I need to get rid of that, but every solution I've found seems to not work in iOS 14.</p>
  <p>Here's the video tag:</p>
  <pre><code>&lt;video id=&quot;videoElement&quot; src=&quot;copper.mp4&quot; autoplay loop playsinline muted webkit-playsinline&gt;&lt;/video&gt;
  </code></pre>
  <p>…and the CSS:</p>
  <pre><code>video#videoElement::-webkit-media-controls, 
  video#videoElement::-webkit-media-controls-start-playback-button, 
  video#videoElement::-webkit-media-controls-play-button, 
  video#videoElement::-webkit-media-controls-panel, 
  video#videoElement::-webkit-media-controls-container, 
  video#videoElement::-webkit-media-controls-overlay-play-button, 
  video#videoElement::-webkit-media-controls-enclosure {
    display: none !important;
    -webkit-appearance: none;
    opacity: 0 !important;
  }
  </code></pre>